feat: 资源管理设备状态静态完成，fabric监控信息展示初始化
parent
694c5bdd69
commit
f7402f5822
@ -1,30 +1,72 @@
|
||||
export const deviceStatusEnums: Record<string, any> = {
|
||||
allStatus: {
|
||||
miniName: '全部',
|
||||
value: '0',
|
||||
color: '',
|
||||
},
|
||||
onlineStatus: {
|
||||
miniName: '在线',
|
||||
value: '1',
|
||||
color: 'success',
|
||||
},
|
||||
outlineStatus: {
|
||||
miniName: '离线',
|
||||
value: '2',
|
||||
color: 'default',
|
||||
},
|
||||
processingStatus: {
|
||||
miniName: '运行中',
|
||||
value: '3',
|
||||
color: 'warning',
|
||||
},
|
||||
errorStatus: {
|
||||
miniName: '故障',
|
||||
value: '4',
|
||||
color: 'error',
|
||||
},
|
||||
};
|
||||
|
||||
|
||||
|
||||
export const deviceStatusEnums : Record<string,any> = {
|
||||
'allStatus': {
|
||||
miniName: '全部',
|
||||
value: '0',
|
||||
color: ''
|
||||
},
|
||||
'onlineStatus': {
|
||||
miniName: '在线',
|
||||
value: '1',
|
||||
color: 'success'
|
||||
},
|
||||
'outlineStatus': {
|
||||
miniName: '离线',
|
||||
value: '2',
|
||||
color: 'default'
|
||||
},
|
||||
'processingStatus': {
|
||||
miniName: '运行中',
|
||||
value: '3',
|
||||
color: 'warning'
|
||||
},
|
||||
'errorStatus': {
|
||||
miniName: '故障',
|
||||
value: '4',
|
||||
color: 'error'
|
||||
}
|
||||
}
|
||||
export const resourceDeviceStatusEnums: Record<string, any> = {
|
||||
allStatus: {
|
||||
miniName: '全部异常',
|
||||
value: '0',
|
||||
color: '',
|
||||
renderType: '',
|
||||
},
|
||||
storageWarn: {
|
||||
miniName: '存储告警',
|
||||
value: '1',
|
||||
color: 'error',
|
||||
renderType: 'progress',
|
||||
},
|
||||
GPUWarn: {
|
||||
miniName: 'GPU告警',
|
||||
value: '2',
|
||||
color: 'success',
|
||||
renderType: 'progress',
|
||||
},
|
||||
memoryWarn: {
|
||||
miniName: '内存告警',
|
||||
value: '3',
|
||||
color: 'success',
|
||||
renderType: 'progress',
|
||||
},
|
||||
errorStatus: {
|
||||
miniName: 'CPU告警',
|
||||
value: '4',
|
||||
color: 'warning',
|
||||
renderType: 'progress',
|
||||
},
|
||||
codeError: {
|
||||
miniName: '代码出错',
|
||||
value: '5',
|
||||
color: 'error',
|
||||
renderType: 'dot',
|
||||
},
|
||||
serveTimeOut: {
|
||||
miniName: '服务器超时',
|
||||
value: '6',
|
||||
color: 'error',
|
||||
renderType: 'dot',
|
||||
},
|
||||
};
|
||||
|
||||
@ -0,0 +1,167 @@
|
||||
/*
|
||||
* @Author: zhoux zhouxia@supervision.ltd
|
||||
* @Date: 2023-11-01 13:56:33
|
||||
* @LastEditors: zhoux zhouxia@supervision.ltd
|
||||
* @LastEditTime: 2023-12-15 16:58:50
|
||||
* @FilePath: \general-ai-platform-web\src\pages\Resource\ModelCategoryList\components\ColumnDrawer.tsx
|
||||
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
||||
*/
|
||||
import { CloseOutlined } from '@ant-design/icons';
|
||||
import { ProColumns, ProDescriptions, ProDescriptionsItemProps } from '@ant-design/pro-components';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
|
||||
export type ColumnDrawProps = {
|
||||
handleDrawer: (id?: any) => void;
|
||||
isShowDetail: boolean;
|
||||
columns: ProColumns<API.ModelCategory>[];
|
||||
currentRow: Record<string, any>;
|
||||
clipPathData: Record<string, any>;
|
||||
};
|
||||
|
||||
const ColumnDrawer: React.FC<ColumnDrawProps> = (props) => {
|
||||
const [positionStyle, setPositionStyle] = useState<React.CSSProperties>({});
|
||||
// 生成模型详情卡片位置
|
||||
function initPointPosition() {
|
||||
type Point = { x: number; y: number };
|
||||
type Position = 'left' | 'right' | 'top' | 'bottom';
|
||||
let currPositionStyle: React.CSSProperties = {};
|
||||
const modelInfoPosition: Position[] = ['right'];
|
||||
const maxX = props.clipPathData?.width; // 画布宽度
|
||||
const maxY = props.clipPathData?.height; // 画布高度
|
||||
const x = props.currentRow.baseInfo?.left; // 模型x轴位置
|
||||
const y = props.currentRow.baseInfo?.top; // 模型y轴位置
|
||||
const modelWidth: number = 120; // 模型自身宽度
|
||||
const modelHeight: number = 54; // 模型自身高度
|
||||
const modelInfoWidth: number = 400; // 模型信息卡片宽度
|
||||
const modelInfoHeight: number = 240; // 模型信息卡片高度
|
||||
// if (x < 0 || x > maxX || y < 0 || y > maxY) {
|
||||
// // 模型超过范围
|
||||
// }
|
||||
if (x > maxX / 2) {
|
||||
modelInfoPosition.push('left');
|
||||
// if (x < maxX / 2) {
|
||||
// modelInfoPosition.push('left');
|
||||
// } else {
|
||||
// modelInfoPosition.push('right');
|
||||
// }
|
||||
} else {
|
||||
modelInfoPosition.push('right');
|
||||
// if (y < maxY / 2) {
|
||||
// modelInfoPosition.push('top');
|
||||
// } else {
|
||||
// modelInfoPosition.push('bottom');
|
||||
// }
|
||||
}
|
||||
console.log(props.currentRow, 'currentRow');
|
||||
if (modelInfoPosition.includes('left')) {
|
||||
let topValue = y - modelInfoHeight / 2 + modelHeight / 2
|
||||
if(topValue> maxY - modelInfoHeight){
|
||||
topValue = maxY - modelInfoHeight
|
||||
}
|
||||
if(topValue<0){
|
||||
topValue = 0
|
||||
}
|
||||
currPositionStyle = {
|
||||
top: topValue,
|
||||
left: x - modelInfoWidth - 10,
|
||||
};
|
||||
} else {
|
||||
let topValue = y - modelInfoHeight / 2 + modelHeight / 2
|
||||
if(topValue> maxY - modelInfoHeight){
|
||||
topValue = maxY - modelInfoHeight
|
||||
}
|
||||
if(topValue<0){
|
||||
topValue = 0
|
||||
}
|
||||
currPositionStyle = {
|
||||
top: topValue,
|
||||
left: x + modelWidth + 10,
|
||||
};
|
||||
}
|
||||
setPositionStyle(currPositionStyle);
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
if (props.currentRow) {
|
||||
initPointPosition();
|
||||
}
|
||||
}, [props.currentRow, props.clipPathData]);
|
||||
return props.isShowDetail ? (
|
||||
<div
|
||||
style={{
|
||||
position: 'absolute',
|
||||
background: '#fff',
|
||||
borderRadius: 4,
|
||||
width: 400,
|
||||
boxShadow: '0px 8px 12px rgba(0, 0, 0, 0.25)',
|
||||
border: '1px solid #eee',
|
||||
...positionStyle,
|
||||
}}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'space-between',
|
||||
padding: '16px 24px',
|
||||
borderBottom: '1px solid #eee',
|
||||
color: '#1E1E1E',
|
||||
fontSize: 20,
|
||||
fontWeight: 700,
|
||||
marginBottom: 16,
|
||||
}}
|
||||
>
|
||||
<span>设备信息</span>
|
||||
<CloseOutlined onClick={() => props.handleDrawer()} />
|
||||
</div>
|
||||
<ProDescriptions
|
||||
style={{
|
||||
padding: '0 24px',
|
||||
}}
|
||||
column={2}
|
||||
dataSource={props.currentRow || {}}
|
||||
columns={props.columns as ProDescriptionsItemProps<API.ModelCategory>[]}
|
||||
></ProDescriptions>
|
||||
</div>
|
||||
) : (
|
||||
<></>
|
||||
);
|
||||
|
||||
// <Modal
|
||||
// title="设备信息"
|
||||
// mask={false}
|
||||
|
||||
// open={props.isShowDetail}
|
||||
// width={500}
|
||||
// footer={null}
|
||||
// onCancel={() => props.handleDrawer()}
|
||||
// >
|
||||
|
||||
// </Modal>
|
||||
// <Drawer
|
||||
// width={500}
|
||||
// open={props.isShowDetail}
|
||||
// onClose={() => {
|
||||
// props.handleDrawer();
|
||||
// }}
|
||||
// closable={true}
|
||||
// >
|
||||
// {props.currentRow?.id && (
|
||||
// <ProDescriptions<API.ModelCategory>
|
||||
// style={{
|
||||
// // paddingLeft: 4,
|
||||
// // paddingRight: 4
|
||||
// }}
|
||||
// column={2}
|
||||
// title={props.currentRow?.id}
|
||||
// request={async () => ({
|
||||
// data: props.currentRow || {},
|
||||
// })}
|
||||
// params={{
|
||||
// id: props.currentRow?.id,
|
||||
// }}
|
||||
// columns={props.columns as ProDescriptionsItemProps<API.ModelCategory>[]}
|
||||
// />
|
||||
// )}
|
||||
// </Drawer>
|
||||
};
|
||||
export { ColumnDrawer };
|
||||
@ -0,0 +1,204 @@
|
||||
/*
|
||||
* @Author: zhoux zhouxia@supervision.ltd
|
||||
* @Date: 2023-12-12 10:57:54
|
||||
* @LastEditors: zhoux zhouxia@supervision.ltd
|
||||
* @LastEditTime: 2023-12-15 17:06:36
|
||||
* @FilePath: \general-ai-platform-web\src\pages\FabricView\Room\index.tsx
|
||||
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
||||
*/
|
||||
|
||||
// import { useUuid } from '@/hooks/useUuid';
|
||||
import { currJson } from '@/testData/fabricRoomList';
|
||||
import { bgImageData } from '@/testData/fabricRoomSvg';
|
||||
import { ProCard } from '@ant-design/pro-components';
|
||||
import { useIntl } from '@umijs/max';
|
||||
import { Button } from 'antd';
|
||||
import { fabric } from 'fabric';
|
||||
import React, { useEffect, useRef, useState } from 'react';
|
||||
import { ColumnDrawer } from './components/ColumnDrawer';
|
||||
|
||||
export const ModelCategoryColumns = [
|
||||
{
|
||||
title: '设备ID',
|
||||
dataIndex: 'id',
|
||||
},
|
||||
{
|
||||
title: '设备名称',
|
||||
dataIndex: 'deviceName',
|
||||
},
|
||||
{
|
||||
title: '设备代码',
|
||||
dataIndex: 'deviceCode',
|
||||
},
|
||||
{
|
||||
title: '设备位置',
|
||||
dataIndex: 'deviceLocation',
|
||||
},
|
||||
{
|
||||
title: '设备代码',
|
||||
dataIndex: 'deviceCode',
|
||||
},
|
||||
{
|
||||
title: '设备名称',
|
||||
dataIndex: 'deviceName',
|
||||
},
|
||||
{
|
||||
title: '设备代码',
|
||||
dataIndex: 'deviceCode',
|
||||
},
|
||||
{
|
||||
title: '设备名称',
|
||||
dataIndex: 'deviceName',
|
||||
},
|
||||
];
|
||||
const FabricViewRoom: React.FC = () => {
|
||||
const intl = useIntl();
|
||||
const canvasRef = useRef(null);
|
||||
const itemsRef = useRef(null);
|
||||
const [cvs, setCanvas] = useState(null);
|
||||
const [descriptors, setDescriptors] = useState<Record<string, any>>({});
|
||||
const [category_fk_id_open, set_category_fk_id_open] = useState(false);
|
||||
const [currentModelUserProperty, setCurrentModelUserProperty] = useState<Record<string, any>>({});
|
||||
|
||||
const [changeId, setChangeId] = useState<string[]>([]);
|
||||
const [currentTargetObject, setCurrentTargetObject] = useState<any>(null);
|
||||
|
||||
const [clipPathData, setClipPathData] = useState({
|
||||
width: 1200, // 宽
|
||||
height: 900, // 高
|
||||
});
|
||||
const [jsonData, setJsonData] = useState<Record<string, any>>({});
|
||||
|
||||
/*test */
|
||||
// const { fetchUuid } = useUuid();
|
||||
|
||||
function changeModelStatus() {
|
||||
setChangeId(['2', '3']);
|
||||
}
|
||||
|
||||
const handle_category_fk_id = () => {
|
||||
if (category_fk_id_open) {
|
||||
set_category_fk_id_open(false);
|
||||
}
|
||||
};
|
||||
|
||||
function closeSelectedModel(targetCvs?: any) {
|
||||
let finalCvs = cvs;
|
||||
if (targetCvs) {
|
||||
finalCvs = targetCvs;
|
||||
}
|
||||
finalCvs.getObjects().forEach((item) => {
|
||||
// if (changeId.includes(item?.userProperty?.id)) {
|
||||
const groupObject = item;
|
||||
// 选中组合对象
|
||||
// canvasObject.setActiveObject(groupObject); // 可以改变 selectable 值
|
||||
finalCvs.requestRenderAll();
|
||||
// 获取组合对象中的子对象
|
||||
const objectsInGroup = groupObject.getObjects();
|
||||
groupObject.item(0).item(1).set({
|
||||
fill: '#DCDCDC',
|
||||
});
|
||||
groupObject.item(1).set({
|
||||
fill: 'rgb(0,0,0)',
|
||||
})
|
||||
finalCvs.renderAll();
|
||||
// 遍历子对象找到要修改的子对象
|
||||
|
||||
// }
|
||||
});
|
||||
}
|
||||
// 初始化加载画布&渲染模型
|
||||
useEffect(() => {
|
||||
const canvasObject = new fabric.Canvas(canvasRef.current);
|
||||
canvasObject.setBackgroundImage(bgImageData.src, canvasObject.renderAll.bind(canvasObject), {
|
||||
width: clipPathData.width,
|
||||
height: clipPathData.height,
|
||||
originX: 'left',
|
||||
originY: 'top',
|
||||
});
|
||||
canvasObject.loadFromJSON(JSON.stringify(currJson), () => {
|
||||
canvasObject.renderAll();
|
||||
// const groupObjectList = canvasObject.getObjects()
|
||||
|
||||
// const groupObject = canvasObject.getObjects()[0];
|
||||
|
||||
// 选中组合对象
|
||||
// console.log(groupObject, 'groupObject', canvasObject.getObjects());
|
||||
// 注册事件监听器
|
||||
canvasObject.on('mouse:down', (event) => {
|
||||
// 获取事件的目标对象
|
||||
const targetObject = event.target;
|
||||
// set_category_fk_id_open(false);
|
||||
|
||||
// 检查目标对象是否为组合对象
|
||||
if (targetObject && targetObject?.userProperty) {
|
||||
// canvasObject.setActiveObject(targetObject);
|
||||
setChangeId([targetObject?.userProperty?.id]);
|
||||
// console.log('mouse:up:', targetObject);
|
||||
setCurrentModelUserProperty(targetObject.userProperty);
|
||||
set_category_fk_id_open(true);
|
||||
}
|
||||
// 检查目标对象是否为组合对象
|
||||
if (targetObject) {
|
||||
setCurrentTargetObject(targetObject);
|
||||
closeSelectedModel(canvasObject);
|
||||
|
||||
// console.log('mouse:down:', );
|
||||
targetObject.item(0).item(1).set({
|
||||
fill: 'blue',
|
||||
});
|
||||
targetObject.item(1).set({
|
||||
fill: 'blue',
|
||||
})
|
||||
}
|
||||
canvasObject.renderAll();
|
||||
});
|
||||
});
|
||||
setCanvas(canvasObject);
|
||||
return () => {
|
||||
canvasObject.dispose();
|
||||
};
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
// TODO_3 需要加个loading效果
|
||||
// import('./Descriptors.json').then((descriptors) => {
|
||||
// setDescriptors(descriptors);
|
||||
// });
|
||||
// console.log(fetchUuid(), 'fetchUuid');
|
||||
if (changeId && changeId.length && !category_fk_id_open) {
|
||||
closeSelectedModel();
|
||||
}
|
||||
}, [changeId, category_fk_id_open]);
|
||||
|
||||
return (
|
||||
<ProCard
|
||||
gutter={24}
|
||||
extra={
|
||||
<>
|
||||
<Button type="primary" onClick={changeModelStatus}>
|
||||
切换状态
|
||||
</Button>
|
||||
</>
|
||||
}
|
||||
>
|
||||
{/* <ProCard colSpan={4}>
|
||||
<ImageMapItems ref={itemsRef} canvasRef={canvasRef} descriptors={descriptors} />
|
||||
</ProCard> */}
|
||||
<ProCard colSpan={24} style={{ padding: 0, margin: 0 }} bodyStyle={{ padding: 0, margin: 0 }}>
|
||||
<canvas ref={canvasRef} {...clipPathData} style={{ border: '1px dashed #eee' }}></canvas>
|
||||
|
||||
<ColumnDrawer
|
||||
handleDrawer={handle_category_fk_id}
|
||||
isShowDetail={category_fk_id_open}
|
||||
columns={ModelCategoryColumns}
|
||||
currentRow={currentModelUserProperty}
|
||||
clipPathData={clipPathData}
|
||||
/>
|
||||
</ProCard>
|
||||
</ProCard>
|
||||
// 属性预览
|
||||
);
|
||||
};
|
||||
|
||||
export default FabricViewRoom;
|
||||
@ -0,0 +1,158 @@
|
||||
/*
|
||||
* @Author: zhoux zhouxia@supervision.ltd
|
||||
* @Date: 2023-11-06 16:12:17
|
||||
* @LastEditors: zhoux zhouxia@supervision.ltd
|
||||
* @LastEditTime: 2023-12-15 14:00:33
|
||||
* @FilePath: \general-ai-platform-web\src\pages\Setting\components\ProjectCardList.tsx
|
||||
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
||||
*/
|
||||
import React from 'react';
|
||||
|
||||
import { Progress } from 'antd';
|
||||
// import { postModelVersionGetModelVersionListByIds } from '@/services/resource/ModelVersion';
|
||||
|
||||
// const [tabs, setTabs] = useState([]);
|
||||
// const [projectData, setProjectData] = useState<any>({});
|
||||
// const [tab, setTab] = useState('');
|
||||
// const [modelVersionData, setModelVersionData] = useState<any[]>([]);
|
||||
|
||||
/**styles */
|
||||
const listItemStyle = {
|
||||
display: 'flex',
|
||||
fontSize: 14,
|
||||
color: '#333333',
|
||||
width: '100%',
|
||||
alignItems: 'center',
|
||||
padding: '4px 0 0',
|
||||
};
|
||||
|
||||
const listItemLabelStyle = {
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
fontSize: 12,
|
||||
color: '#666666',
|
||||
minWidth: 53
|
||||
};
|
||||
|
||||
const listItemTextStyle = {
|
||||
fontSize: 14,
|
||||
margin: 0,
|
||||
};
|
||||
// 卡片
|
||||
export type UpdateProjectProps = {
|
||||
info: Record<string, any>;
|
||||
// reload: any;
|
||||
};
|
||||
|
||||
type DeviceItemProgress = {
|
||||
label: string;
|
||||
percent: number;
|
||||
};
|
||||
|
||||
// 进度条
|
||||
// TODO 进度条的边框圆角调整为矩形
|
||||
const DeviceItemProgress: React.FC<DeviceItemProgress> = (props) => {
|
||||
let strokeColor = 'rgb(243,48,5)';
|
||||
switch (props.label) {
|
||||
case '存储告警':
|
||||
strokeColor = 'rgb(243,48,5)';
|
||||
break;
|
||||
case 'GPU告警':
|
||||
case '内存告警':
|
||||
strokeColor = 'rgb(33,169,122)';
|
||||
break;
|
||||
case 'CPU告警':
|
||||
strokeColor = 'rgb(250,173,20)';
|
||||
break;
|
||||
}
|
||||
|
||||
return (
|
||||
<div style={{ width: '100%', display: 'flex' }} className="rectProgress_box">
|
||||
<span style={listItemLabelStyle}>{props.label}</span>
|
||||
<Progress
|
||||
style={{ padding: 0, margin: 0, borderRadius: 0 }}
|
||||
size={['100%', 10]}
|
||||
percent={props.percent * 100}
|
||||
strokeColor={strokeColor}
|
||||
showInfo={false}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
const DeviceStatusCard: React.FC<UpdateProjectProps> = ({
|
||||
info,
|
||||
}: {
|
||||
info: Record<string, any>;
|
||||
}) => {
|
||||
return (
|
||||
<div
|
||||
style={{
|
||||
width: '100%',
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
alignItems: 'left',
|
||||
paddingLeft: 8,
|
||||
paddingRight: 8,
|
||||
}}
|
||||
>
|
||||
{/* <div style={{ display: 'flex', alignItems: 'center', paddingBottom: 10 }}>
|
||||
<span style={{ fontWeight: 700, fontSize: 14, paddingRight: 10 }}>苏胜天算法模型</span>
|
||||
<Tag color="#44AEF5">经典算法</Tag>
|
||||
</div> */}
|
||||
<ul
|
||||
style={{
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'space-between',
|
||||
fontSize: 12,
|
||||
color: '#E80D0D',
|
||||
padding: '8px 0 0',
|
||||
lineHeight: '18px',
|
||||
margin: 0,
|
||||
}}
|
||||
>
|
||||
<li>
|
||||
<span
|
||||
style={{
|
||||
display: 'inline-block',
|
||||
width: 8,
|
||||
height: 8,
|
||||
borderRadius: '50%',
|
||||
backgroundColor: '#E80D0D',
|
||||
}}
|
||||
></span>
|
||||
<span style={{ paddingLeft: 8 }}>代码出错</span>
|
||||
</li>
|
||||
<li>
|
||||
<span
|
||||
style={{
|
||||
display: 'inline-block',
|
||||
width: 8,
|
||||
height: 8,
|
||||
borderRadius: '50%',
|
||||
backgroundColor: '#E80D0D',
|
||||
}}
|
||||
></span>
|
||||
<span style={{ paddingLeft: 8 }}>服务超时</span>
|
||||
</li>
|
||||
</ul>
|
||||
<ul style={{ width: '100%', marginBottom: 8 }}>
|
||||
<li style={listItemStyle}>
|
||||
<DeviceItemProgress label="存储告警" percent={0.79}></DeviceItemProgress>
|
||||
</li>
|
||||
<li style={listItemStyle}>
|
||||
<DeviceItemProgress label="GPU告警" percent={0.18}></DeviceItemProgress>
|
||||
</li>
|
||||
<li style={listItemStyle}>
|
||||
<DeviceItemProgress label="内存告警" percent={0.16}></DeviceItemProgress>
|
||||
</li>
|
||||
<li style={listItemStyle}>
|
||||
<DeviceItemProgress label="CPU告警" percent={0.58}></DeviceItemProgress>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default DeviceStatusCard;
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,147 @@
|
||||
/*
|
||||
* @Author: zhoux zhouxia@supervision.ltd
|
||||
* @Date: 2023-12-12 15:41:56
|
||||
* @LastEditors: zhoux zhouxia@supervision.ltd
|
||||
* @LastEditTime: 2023-12-15 17:22:03
|
||||
* @FilePath: \general-ai-platform-web\src\testData\fabricRoomList.ts
|
||||
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
||||
*/
|
||||
|
||||
import { fetchWatchGroupObjects } from './fabricWatchIcons';
|
||||
// 模型状态 在线 离线 告警 故障
|
||||
const startData: Record<string, any> = {
|
||||
modelsList: [
|
||||
{
|
||||
deviceType: '1', // 模型类型 1 设备1 2 设备2
|
||||
id: '1001', // 模型id
|
||||
status: 'watchOnline', //
|
||||
deviceName: '监控设备1', // 模型名称
|
||||
deviceCode: 'code1002',
|
||||
deviceLocation: '客厅',
|
||||
deviceParams: '设备参数',
|
||||
deviceCategory: '控制器',
|
||||
diviceGroup: '组1',
|
||||
baseInfo: {
|
||||
left: 527.0215, // 相对x
|
||||
top: 24.5797, // 相对y
|
||||
},
|
||||
},
|
||||
{
|
||||
deviceType: '1', // 模型类型 1 设备1 2 设备2
|
||||
id: '1002', // 模型id
|
||||
status: 'watchError', // 模型状态 在线 离线 告警 故障
|
||||
deviceName: '监控设备2', // 模型名称
|
||||
deviceCode: 'code1001',
|
||||
deviceLocation: '客厅',
|
||||
deviceParams: '设备参数',
|
||||
deviceCategory: '控制器',
|
||||
diviceGroup: '组1',
|
||||
baseInfo: {
|
||||
left: 397.0215, // 相对x
|
||||
top: 444.5797, // 相对y
|
||||
},
|
||||
},
|
||||
{
|
||||
deviceType: '1', // 模型类型 1 设备1 2 设备2
|
||||
id: '1003', // 模型id
|
||||
status: 'watchOutline', // 模型状态 在线 离线 告警 故障
|
||||
deviceName: '监控设备2', // 模型名称
|
||||
deviceCode: 'code1001',
|
||||
deviceLocation: '客厅',
|
||||
deviceParams: '设备参数',
|
||||
deviceCategory: '控制器',
|
||||
diviceGroup: '组1',
|
||||
baseInfo: {
|
||||
left: 397.0215, // 相对x
|
||||
top: 144.5797, // 相对y
|
||||
},
|
||||
},
|
||||
{
|
||||
deviceType: '1', // 模型类型 1 设备1 2 设备2
|
||||
id: '1004', // 模型id
|
||||
status: 'watchOutline', // 模型状态 在线 离线 告警 故障
|
||||
deviceName: '监控设备2', // 模型名称
|
||||
deviceCode: 'code1001',
|
||||
deviceLocation: '客厅',
|
||||
deviceParams: '设备参数',
|
||||
deviceCategory: '控制器',
|
||||
diviceGroup: '组1',
|
||||
baseInfo: {
|
||||
left: 297.0215, // 相对x
|
||||
top: 644.5797, // 相对y
|
||||
},
|
||||
},
|
||||
{
|
||||
deviceType: '1', // 模型类型 1 设备1 2 设备2
|
||||
id: '1005', // 模型id
|
||||
status: 'watchWarn', // 模型状态 在线 离线 告警 故障
|
||||
deviceName: '监控设备2', // 模型名称
|
||||
deviceCode: 'code1001',
|
||||
deviceLocation: '客厅',
|
||||
deviceParams: '设备参数',
|
||||
deviceCategory: '控制器',
|
||||
diviceGroup: '组1',
|
||||
baseInfo: {
|
||||
left: 797.0215, // 相对x
|
||||
top: 844.5797, // 相对y
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const fabricRoomListData: Record<string, any>[] = [];
|
||||
startData.modelsList.forEach((item: Record<string, any>) => {
|
||||
const { baseInfo, ...restInfo } = item;
|
||||
fabricRoomListData.push(
|
||||
JSON.parse(
|
||||
JSON.stringify({
|
||||
...fetchWatchGroupObjects(item),
|
||||
...baseInfo,
|
||||
userProperty: item,
|
||||
selectable: false,
|
||||
}),
|
||||
),
|
||||
);
|
||||
});
|
||||
|
||||
export const currJson = {
|
||||
version: '5.3.0',
|
||||
objects: fabricRoomListData,
|
||||
clipPath: {
|
||||
type: 'rect',
|
||||
version: '5.3.0',
|
||||
originX: 'left',
|
||||
originY: 'top',
|
||||
left: 0,
|
||||
top: 0,
|
||||
width: 1200,
|
||||
height: 900,
|
||||
fill: 'rgba(255,255,255,1)',
|
||||
stroke: null,
|
||||
strokeWidth: 0,
|
||||
strokeDashArray: null,
|
||||
strokeLineCap: 'butt',
|
||||
strokeDashOffset: 0,
|
||||
strokeLineJoin: 'miter',
|
||||
strokeUniform: false,
|
||||
strokeMiterLimit: 4,
|
||||
scaleX: 1,
|
||||
scaleY: 1,
|
||||
angle: 0,
|
||||
flipX: false,
|
||||
flipY: false,
|
||||
opacity: 1,
|
||||
shadow: null,
|
||||
visible: true,
|
||||
backgroundColor: '',
|
||||
fillRule: 'nonzero',
|
||||
paintFirst: 'fill',
|
||||
globalCompositeOperation: 'source-over',
|
||||
skewX: 0,
|
||||
skewY: 0,
|
||||
rx: 0,
|
||||
ry: 0,
|
||||
selectable: false,
|
||||
hasControls: true,
|
||||
},
|
||||
};
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue