91 lines
2.6 KiB
TypeScript
91 lines
2.6 KiB
TypeScript
import TooltipIconFontButton from '@/components/shared/TooltipIconFontButton';
|
|
import { ROUTER_HOME } from '@/constants/routes';
|
|
import { apiQueryMessage } from '@/services/master/MessageController';
|
|
import { apiGetThingDetail } from '@/services/master/ThingController';
|
|
import { PageContainer } from '@ant-design/pro-components';
|
|
import { history, useModel, useParams } from '@umijs/max';
|
|
import { useEffect, useState } from 'react';
|
|
import ThingTitle from './components/ThingTitle';
|
|
|
|
const DetailDevicePage = () => {
|
|
const { thingId } = useParams();
|
|
const [thing, setThing] = useState<MasterModel.Thing | null>(null);
|
|
const [isLoading, setIsLoading] = useState<boolean>(false);
|
|
const { initialState } = useModel('@@initialState');
|
|
const getThingDetail = async () => {
|
|
setIsLoading(true);
|
|
try {
|
|
const thing = await apiGetThingDetail(thingId || '');
|
|
setThing(thing);
|
|
} catch (error) {
|
|
console.error('Error when get Thing: ', error);
|
|
} finally {
|
|
setIsLoading(false);
|
|
}
|
|
};
|
|
const getDeviceConfig = async () => {
|
|
try {
|
|
const resp = await apiQueryMessage(
|
|
thing?.metadata?.data_channel_id || '',
|
|
initialState?.currentUserProfile?.metadata?.frontend_thing_key || '',
|
|
{
|
|
offset: 0,
|
|
limit: 1,
|
|
subtopic: `config.${thing?.metadata?.type}.node`,
|
|
},
|
|
);
|
|
console.log('Device Config:', resp.messages![0].string_value_parsed);
|
|
} catch (error) {}
|
|
};
|
|
useEffect(() => {
|
|
if (thingId) {
|
|
getThingDetail();
|
|
}
|
|
}, [thingId]);
|
|
useEffect(() => {
|
|
if (thing) {
|
|
getDeviceConfig();
|
|
}
|
|
}, [thing]);
|
|
|
|
return (
|
|
<PageContainer
|
|
title={isLoading ? 'Loading...' : <ThingTitle thing={thing} />}
|
|
header={{
|
|
onBack: () => history.push(ROUTER_HOME),
|
|
breadcrumb: undefined,
|
|
}}
|
|
extra={[
|
|
<TooltipIconFontButton
|
|
key="logs"
|
|
tooltip="Nhật ký"
|
|
iconFontName="icon-system-diary"
|
|
shape="circle"
|
|
size="middle"
|
|
onClick={() => {}}
|
|
/>,
|
|
<TooltipIconFontButton
|
|
key="notifications"
|
|
tooltip="Thông báo"
|
|
iconFontName="icon-bell"
|
|
shape="circle"
|
|
size="middle"
|
|
onClick={() => {}}
|
|
/>,
|
|
<TooltipIconFontButton
|
|
key="settings"
|
|
tooltip="Cài đặt"
|
|
iconFontName="icon-setting-device"
|
|
shape="circle"
|
|
size="middle"
|
|
onClick={() => {}}
|
|
/>,
|
|
]}
|
|
>
|
|
Thing ID: {thingId}
|
|
</PageContainer>
|
|
);
|
|
};
|
|
|
|
export default DetailDevicePage;
|