pu428f3pz
/
datacenter
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

修改虚拟仿真

Browse Source
dev
陈博文 3 years ago
parent c06ef2e9dc
commit ceca3e4ead
3 changed files with 164 additions and 40 deletions
Show Stats Download Patch File Download Diff File

3
src/pages/Manager/BasicManager/List/Allotment/index.tsx
Unescape View File

@ -66,7 +66,8 @@ const Page: FC<PageProps> = () => {
},
});
if (res.result === 'success') {
setFacilityData(res?.data?.[0]?.list);
const item = res?.data?.[0]?.list?.filter((e: any) => e.status !== '0');
setFacilityData(item);
}
};

6
src/pages/Simulation/index.less
Unescape View File

@ -54,6 +54,7 @@
> i {
cursor: pointer;
color: @primary-color;
}
}
@ -158,3 +159,8 @@
}
}
}
.no {
pointer-events: none !important;
user-select: none;
}

189
src/pages/Simulation/index.tsx
Unescape View File

@ -16,6 +16,8 @@ import Fetch from '@/utils/fetch';
import { useEffect, useState, FC, Fragment, useRef } from 'react';
import { cloneDeep } from 'lodash';
import { ColumnsType } from 'antd/lib/table';
const RangePicker: any = DatePicker.RangePicker;
import moment from 'moment';
const testData = {
id: 1,
@ -49,7 +51,7 @@ const Progress = ({ item, onFinish, start, setVisible }: any) => {
dataSave.current = item;
setData(item);
}
}, [item.id]);
}, [item]);
useEffect(() => {
if (start) {
@ -79,6 +81,9 @@ const Progress = ({ item, onFinish, start, setVisible }: any) => {
if (total >= 100) {
newItem[arrayItem[1]] = 100;
newItem[arrayItem[0]] = '资源写入完成';
} else if (total < 15) {
newItem[arrayItem[1]] = total;
newItem[arrayItem[0]] = '正在封装资源';
} else {
newItem[arrayItem[1]] = total;
newItem[arrayItem[0]] = '正在写入';
@ -102,10 +107,17 @@ const Progress = ({ item, onFinish, start, setVisible }: any) => {
<div className={styles.s1}>{data.deviceId}</div>
<div className={styles.s2}>{data.name}</div>
<div className={styles.s0}>
{data.type === 4 ? (
<i
onClick={() => setVisible(data)}
className="iconfont icon-bianji10"
/>
) : (
<i
onClick={() => setVisible(true)}
className="iconfont icon-bianji10"
style={{ cursor: 'not-allowed', color: '#999' }}
/>
)}
</div>
</div>
<div className={styles.s1}>
@ -119,9 +131,6 @@ const Progress = ({ item, onFinish, start, setVisible }: any) => {
</div>
<div className={styles.t}>{data.aProgress}%</div>
</div>
<div className={styles.s0}>
<i className="iconfont icon-bianji10" />
</div>
</div>
<div className={styles.s1}>
<div>{data.bText}</div>
@ -135,7 +144,17 @@ const Progress = ({ item, onFinish, start, setVisible }: any) => {
<div className={styles.t}>{data.bProgress}%</div>
</div>
<div className={styles.s0}>
<i className="iconfont icon-bianji10" />
{data.type === 1 ? (
<i
onClick={() => setVisible(data)}
className="iconfont icon-bianji10"
/>
) : (
<i
className="iconfont icon-bianji10"
style={{ cursor: 'not-allowed', color: '#999' }}
/>
)}
</div>
</div>
<div className={styles.s1}>
@ -150,7 +169,17 @@ const Progress = ({ item, onFinish, start, setVisible }: any) => {
<div className={styles.t}>{data.cProgress}%</div>
</div>
<div className={styles.s0}>
<i className="iconfont icon-bianji10" />
{data.type === 2 ? (
<i
onClick={() => setVisible(data)}
className="iconfont icon-bianji10"
/>
) : (
<i
className="iconfont icon-bianji10"
style={{ cursor: 'not-allowed', color: '#999' }}
/>
)}
</div>
</div>
</div>
@ -158,6 +187,8 @@ const Progress = ({ item, onFinish, start, setVisible }: any) => {
};
const Page = () => {
const [form] = Form.useForm();
const [data, setData] = useState<any>([]);
const [disabled, setDisabled] = useState<boolean>(false);
const [start, setStart] = useState<boolean>(false);
@ -167,18 +198,27 @@ const Page = () => {
const [modalData, setModalData] = useState<any>([]);
const [modalSelectKey, setModalSelectKey] = useState<any>([]);
const [deviceList, setDeviceList] = useState<any[]>([]);
const resizeBar = useRef<any>(null);
const resizeBox = useRef<any>(null);
const iframeBox = useRef<any>(null);
const dataSave = useRef<any>([]);
const [form] = Form.useForm();
console.log(data, 'data');
useEffect(() => {
document.title = '初装系统';
getDeviceList();
}, []);
useEffect(() => {
if (visible) {
getModalData({});
setModalSelectKey(visible?.keys || []);
}
}, [visible]);
useEffect(() => {
window.addEventListener('message', getData, false);
return () => {
@ -186,6 +226,14 @@ const Page = () => {
};
}, []);
const getDeviceList = async () => {
const res = await Fetch('/openi/deviceType/list');
if (res.result === 'success') {
const data = res?.data?.[0];
setDeviceList(data);
}
};
const getData = (e: any) => {
if (e.origin === 'https://edu-xnfz.educoder.net') {
console.log(e.data, 22222);
@ -197,7 +245,6 @@ const Page = () => {
} catch (s) {
newData = eval('(' + e.data + ')');
}
if (dataSave.current.length === newData.length) return;
let realData = [];
@ -211,8 +258,6 @@ const Page = () => {
});
}
// console.log(dataSave.current, newData, 2222);
if (dataSave.current.length < newData.length) {
const param = newData.find((e: any) => {
if (!dataSave.current.map((l: any) => l?.id).includes(e?.id)) {
@ -220,15 +265,24 @@ const Page = () => {
}
return false;
});
param.name = '';
param.keys = [];
if (param.type === 1) {
param.bText = '开机棒连接成功';
} else if (param.type === 2) {
param.cText = '授启棒连接成功';
} else if (param.type === 3) {
param.aText = '密码设备连接成功';
param.name = `${param.name}_${param.deviceId}`;
} else if (param.type === 4) {
param.aText = '注入器连接成功';
}
realData = [
...dataSave.current,
{
...param,
aText: '正在封装资源',
aProgress: 0,
bText: '正在封装资源',
bProgress: 0,
cText: '正在封装资源',
cProgress: 0,
},
];
@ -302,6 +356,11 @@ const Page = () => {
};
const handleClick = async () => {
const bool = dataSave.current.every((e: any) => e.name);
if (!bool) {
message.warn('请添加设备物理标志');
return;
}
const deviceList = dataSave.current.map((e: any) => {
return { id: e.id, status: '1' };
});
@ -312,6 +371,7 @@ const Page = () => {
},
});
if (res.result === 'success') {
iframeBox.current.className = styles.iframe + ' ' + styles.no;
setStart(true);
setLoading(true);
setDisabled(false);
@ -319,25 +379,35 @@ const Page = () => {
};
const handleModalFinish = async (v: any) => {
console.log(v, 222);
const params = { ...v };
if (v.time) {
params.startDate =
moment(v?.time?.[0]).format('YYYY-MM-DD') + ' 00:00:00';
params.endDate = moment(v?.time?.[1]).format('YYYY-MM-DD') + ' 23:59:59';
delete params.time;
}
getModalData(params);
};
const getModalData = async (p: any) => {};
const columns: ColumnsType<any> = [
{
width: 120,
title: '编号',
align: 'center',
dataIndex: 'index',
render: (_: string, __: any, index: number) => index + 1,
},
{
title: '设备物理标识',
dataIndex: 'number',
dataIndex: 'deviceType',
render: (v: any, r: any) => (
<span>
{v?.typeNumber}_{r.deviceId}
</span>
),
},
{
title: '注册时间',
dataIndex: 'beginTime',
dataIndex: 'addTime',
},
{
width: 120,
@ -345,13 +415,60 @@ const Page = () => {
dataIndex: 'status',
render: (v: any, r: any) =>
v === '1' ? (
<span style={{ color: 'green' }}>已同步</span>
<span style={{ color: 'green' }}>已初装</span>
) : (
<span>未同步</span>
<span>未初装</span>
),
},
];
const getModalData = async (record: any) => {
const res = await Fetch('/openi/device/page', {
method: 'get',
params: {
pageNumber: 1,
pageSize: 100000,
...record,
},
});
if (res.result === 'success') {
const item = res?.data?.[0]?.list;
setModalData(item);
} else {
message.warn(res.errorMsg);
}
};
const handleOk = async () => {
if (!modalSelectKey.length) {
message.warn('请选择一个设备');
return;
}
const items = modalData.filter((e: any) => modalSelectKey.includes(e.id));
let str = '';
if (items.length === 1) {
str = `${items[0]?.deviceType?.typeNumber}_${items[0]?.deviceId}`;
}
if (items.length > 1) {
str = `${items[0]?.deviceType?.typeNumber}_${items[0]?.deviceId} ~ ${
items[items.length - 1]?.deviceType?.typeNumber
}_${items[items.length - 1]?.deviceId}`;
}
const param = cloneDeep(visible);
param.name = str;
param.keys = items.map((e: any) => e.id);
const newData = cloneDeep(data).map((e: any) => {
if (e.id === param.id) {
return param;
}
return e;
});
console.log(newData, 22244);
setData(newData);
dataSave.current = newData;
setVisible(false);
};
return (
<div className={styles.page}>
<iframe
@ -385,7 +502,6 @@ const Page = () => {
<div className={styles.s1}>
<div>接入状态</div>
<div>执行状态</div>
<div className={styles.s0}>编辑</div>
</div>
<div className={styles.s1}>
<div>接入状态</div>
@ -435,9 +551,7 @@ const Page = () => {
setModalData([]);
}}
cancelText="取消"
onOk={() => {
setVisible(false);
}}
onOk={handleOk}
onCancel={() => {
setVisible(false);
}}
@ -453,16 +567,18 @@ const Page = () => {
<Col span={12}>
<Form.Item label="装备类型" name="type" initialValue={''}>
<Select>
<Select.Option key={''}>全部</Select.Option>
<Select.Option key={'电脑'}>电脑</Select.Option>
<Select.Option key={'键盘'}>键盘</Select.Option>
<Select.Option key={'显示器'}>显示器</Select.Option>
<Select.Option key={''}>全部类型</Select.Option>
{deviceList?.map((e) => (
<Select.Option value={e.id} key={e.id}>
{e.name}
</Select.Option>
))}
</Select>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="注册时间" name="deviceId" initialValue={''}>
<DatePicker style={{ width: 328 }} />
<Form.Item label="注册时间" name="time" initialValue={''}>
<RangePicker style={{ width: 328 }} />
</Form.Item>
</Col>
</Row>
@ -471,13 +587,13 @@ const Page = () => {
<Form.Item label="资源状态" name="status" initialValue={''}>
<Select>
<Select.Option key={''}>全部状态</Select.Option>
<Select.Option key={'已分发'}>已分发</Select.Option>
<Select.Option key={'未分发'}>未分发</Select.Option>
<Select.Option key={'0'}>未初装</Select.Option>
<Select.Option key={'1'}>已初装</Select.Option>
</Select>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="铭牌号" name="num" initialValue={''}>
<Form.Item label="铭牌号" name="deviceId" initialValue={''}>
<Input />
</Form.Item>
</Col>
@ -504,7 +620,8 @@ const Page = () => {
<Table
dataSource={modalData}
rowSelection={{
type: 'checkbox',
hideSelectAll: true,
type: visible?.type === 4 ? 'checkbox' : 'radio',
selectedRowKeys: modalSelectKey,
onChange: (selectedRowKeys: any[], selectedRows: any[]) => {
setModalSelectKey(selectedRowKeys);

Write Preview
Loading…
Cancel
Save