|
@@ -32,10 +32,16 @@
|
|
|
row-key="id"
|
|
row-key="id"
|
|
|
:row-selection="rowSelection"
|
|
:row-selection="rowSelection"
|
|
|
@change="handleTableChange"
|
|
@change="handleTableChange"
|
|
|
- />
|
|
|
|
|
|
|
+ >
|
|
|
|
|
+ <template #bodyCell="{ column, record }">
|
|
|
|
|
+ <template v-if="column.key === 'operation'">
|
|
|
|
|
+ <TableActionBar :record="record" :has-view="false" :has-edit="true" :has-delete="true" @edit="openForm(record)" @delete="handleDeleteRecord(record)" />
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </a-table>
|
|
|
</a-card>
|
|
</a-card>
|
|
|
|
|
|
|
|
- <a-modal v-model:open="formOpen" title="新增设备" width="640px" @ok="submitForm">
|
|
|
|
|
|
|
+ <a-modal v-model:open="formOpen" :title="form.id ? '编辑设备' : '新增设备'" width="640px" @ok="submitForm">
|
|
|
<a-form ref="formRef" :model="form" :rules="rules" :label-col="{span: 5}" :wrapper-col="{span: 17}">
|
|
<a-form ref="formRef" :model="form" :rules="rules" :label-col="{span: 5}" :wrapper-col="{span: 17}">
|
|
|
<a-form-item label="设备名称" name="name">
|
|
<a-form-item label="设备名称" name="name">
|
|
|
<a-input v-model:value="form.name" allow-clear placeholder="请输入设备名称" />
|
|
<a-input v-model:value="form.name" allow-clear placeholder="请输入设备名称" />
|
|
@@ -75,8 +81,9 @@ import {message, Modal} from 'ant-design-vue';
|
|
|
import BearJiaUtil from '@/utils/BearJiaUtil';
|
|
import BearJiaUtil from '@/utils/BearJiaUtil';
|
|
|
import {listStation} from '@/api/config/station';
|
|
import {listStation} from '@/api/config/station';
|
|
|
import {listChannel} from '@/api/config/channel';
|
|
import {listChannel} from '@/api/config/channel';
|
|
|
-import {addDevice, delDevice, listDevice} from '@/api/config/device';
|
|
|
|
|
|
|
+import {addDevice, delDevice, getDevice, listDevice, updateDevice} from '@/api/config/device';
|
|
|
import StationSelector from '../components/StationSelector.vue';
|
|
import StationSelector from '../components/StationSelector.vue';
|
|
|
|
|
+import TableActionBar from '@/components/TableActionBar/index.vue';
|
|
|
import {normalizeRows} from '../components/dataAdapter';
|
|
import {normalizeRows} from '../components/dataAdapter';
|
|
|
import {toStationOptions} from '../components/stationAdapter';
|
|
import {toStationOptions} from '../components/stationAdapter';
|
|
|
import {BearJiaIcon} from '@/utils/BearJiaIcon.js';
|
|
import {BearJiaIcon} from '@/utils/BearJiaIcon.js';
|
|
@@ -153,7 +160,8 @@ const columns = [
|
|
|
title: '状态', dataIndex: 'status', width: 120,
|
|
title: '状态', dataIndex: 'status', width: 120,
|
|
|
customRender: ({text}) => (text === 'GOOD' ? '在线' : '离线')
|
|
customRender: ({text}) => (text === 'GOOD' ? '在线' : '离线')
|
|
|
},
|
|
},
|
|
|
- {title: '投运日期', dataIndex: 'installDate', width: 180}
|
|
|
|
|
|
|
+ {title: '投运日期', dataIndex: 'installDate', width: 180},
|
|
|
|
|
+ {title: '操作', key: 'operation', dataIndex: 'operation', width: 200, fixed: 'right'}
|
|
|
];
|
|
];
|
|
|
|
|
|
|
|
const resetObject = (target, source = {}) => {
|
|
const resetObject = (target, source = {}) => {
|
|
@@ -198,19 +206,36 @@ const handleTableChange = (page) => {
|
|
|
handleQuery();
|
|
handleQuery();
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
-const openForm = () => {
|
|
|
|
|
- resetObject(form, {configStationId: queryParams.configStationId});
|
|
|
|
|
|
|
+const openForm = async (record) => {
|
|
|
|
|
+ if (record?.id) {
|
|
|
|
|
+ const res = await getDevice(record.id);
|
|
|
|
|
+ resetObject(form, {...res.data});
|
|
|
|
|
+ } else {
|
|
|
|
|
+ resetObject(form, {configStationId: queryParams.configStationId});
|
|
|
|
|
+ }
|
|
|
formOpen.value = true;
|
|
formOpen.value = true;
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
const submitForm = async () => {
|
|
const submitForm = async () => {
|
|
|
await formRef.value?.validate();
|
|
await formRef.value?.validate();
|
|
|
- await addDevice(form);
|
|
|
|
|
|
|
+ if (form.id) await updateDevice(form); else await addDevice(form);
|
|
|
message.success('保存成功');
|
|
message.success('保存成功');
|
|
|
formOpen.value = false;
|
|
formOpen.value = false;
|
|
|
handleQuery();
|
|
handleQuery();
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
|
|
+const handleDeleteRecord = (record) => {
|
|
|
|
|
+ Modal.confirm({
|
|
|
|
|
+ title: '确认删除',
|
|
|
|
|
+ content: '确认删除该设备?',
|
|
|
|
|
+ onOk: async () => {
|
|
|
|
|
+ await delDevice(record.id);
|
|
|
|
|
+ message.success('删除成功');
|
|
|
|
|
+ handleQuery();
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
const handleBatchDelete = () => {
|
|
const handleBatchDelete = () => {
|
|
|
if (selectedRowKeys.value.length <= 0) {
|
|
if (selectedRowKeys.value.length <= 0) {
|
|
|
message.warning('请至少选择一条数据');
|
|
message.warning('请至少选择一条数据');
|