修改样式及历史趋势样式

src/views/govern/terminal/planData/components/device.vue

@@ -2,15 +2,17 @@
     <el-dialog
         class="cn-operate-dialog device-manage-popup"
         v-model="dialogVisible"
-        title="设备信息"
+        :title="!addFlag ? '设备信息' : '添加设备'"
         draggable
-        width="85%"
+        :append-to-body="true"
+        width="60%"
     >
         <el-button type="primary" @click="addFlag = true" v-if="!addFlag">新增</el-button>
         <el-popconfirm
             confirm-button-text="是"
             cancel-button-text="否"
             icon-color="#626AEF"
+            width="200"
             title="是否确认删除所选数据？"
             @confirm="handleDelete('')"
             @cancel="cancelDelete"
@@ -20,7 +22,7 @@
             </template>
         </el-popconfirm>
 
-        <div class="default-main device-manage" v-show="addFlag" v-loading="loading">
+        <div class="device-manage" v-show="addFlag" v-loading="loading">
             <deviceInfoTree
                 :showCheckbox="true"
                 :default-checked-keys="defaultCheckedKeys"
@@ -32,19 +34,14 @@
                 <Table ref="tableRef" />
             </div>
         </div>
-        <div
-            class="default-main device-manage"
-            v-show="!addFlag"
-            :style="{ height: pageHeight.height }"
-            v-loading="loading"
-        >
-            <div class="device-manage-right" :style="{ height: pageHeight.height }">
+        <div class="device-manage" v-show="!addFlag" v-loading="loading">
+            <div class="device-manage-right">
                 <!-- <datePicker ref="datePickerRef"></datePicker>
                 <el-button type="primary" @click="handleSearch">查询</el-button> -->
                 <vxe-table
                     v-bind="defaultAttribute"
                     :data="tableData"
-                    height="auto"
+                    height="420"
                     style="width: 100%; margin-top: 10px"
                     ref="checkedTableRef"
                     @checkbox-all="selectChangeEvent"
@@ -60,15 +57,16 @@
                     <vxe-column title="操作" width="120" fixed="right">
                         <template #default="{ row }">
                             <el-popconfirm
+                                width="150"
                                 confirm-button-text="是"
                                 cancel-button-text="否"
                                 icon-color="#626AEF"
-                                title="是否确认删除当前数据？"
+                                title="是否确认删除？"
                                 @confirm="handleDelete(row)"
                                 @cancel="cancelDelete"
                             >
                                 <template #reference>
-                                    <el-button type="danger" size="small">删除</el-button>
+                                    <el-button type="danger" text size="small">删除</el-button>
                                 </template>
                             </el-popconfirm>
                         </template>
@@ -127,6 +125,7 @@ const addFlag = ref(false)
 const selectId: any = ref('')
 //查绑定测试项列表
 const getSelectedTable = (id: any) => {
+    //新增传0已绑定传1
     getDeviceList({ id: id, isTrueFlag: 1, pageNum: 1, pageSize: 1000 }).then(res => {
         tableData.value = res.data.records
     })
@@ -134,10 +133,10 @@ const getSelectedTable = (id: any) => {
 //新增设备列表
 const tableStore = new TableStore({
     url: '/cs-device-boot/wlRecord/queryPage',
-    // publicHeight: 65,
+    publicHeight: 310,
     method: 'POST',
     column: [
-        { width: '60', type: 'checkbox' },
+        { width: '60', type: 'checkbox', fixed: 'left' },
         { title: '序号', type: 'seq', width: 80 },
         { field: 'devName', title: '设备名称', minWidth: 170 },
         { field: 'devMac', title: '设备MAC', minWidth: 170 },
@@ -149,6 +148,7 @@ const tableStore = new TableStore({
 
     beforeSearchFun: () => {
         tableStore.table.params.id = selectId.value
+        //新增传0已绑定传1
         tableStore.table.params.isTrueFlag = 0
         tableStore.table.params.treeIds = treeIds.value
     }
@@ -168,31 +168,45 @@ const open = (id: any) => {
     //查新增列表
     tableStore.index()
 }
-const close = () => {
-    addFlag.value = false
-    dialogVisible.value = false
-}
 const tableRef = ref()
 //添加设备
 const submit = () => {
     //选择的数据
     let deviceIds = []
     //新增的时候执行的逻辑
-    if (addFlag.value == true) {
-        tableStore.table.selection.map(item => {
-            deviceIds.push(item.id)
-        })
-        const addForm = {
-            id: selectId.value,
-            list: deviceIds
-        }
-        addDevice(addForm).then(res => {
-            if (res.code == 'A0000') {
-                ElMessage.success('添加成功')
-                getSelectedTable(selectId.value)
-                addFlag.value = false
+    if (addFlag.value) {
+        if (tableStore.table.selection.length != 0) {
+            tableStore.table.selection.map(item => {
+                deviceIds.push(item.id)
+            })
+            const addForm = {
+                id: selectId.value,
+                list: deviceIds
             }
-        })
+            addDevice(addForm).then(res => {
+                if (res.code == 'A0000') {
+                    ElMessage.success('添加成功')
+                    getSelectedTable(selectId.value)
+                    //清除树节点选择状态
+                    defaultCheckedKeys.value = []
+                    //刷新新增列表状态
+                    tableStore.index()
+                    addFlag.value = false
+                }
+            })
+        } else {
+            ElMessage.warning('请选择设备信息')
+        }
+    }
+}
+
+const close = () => {
+    if (addFlag.value) {
+        addFlag.value = false
+        checkedList.value = []
+        checkedTableRef.value.clearCheckboxRow()
+    } else {
+        dialogVisible.value = false
     }
 }
 //删除设备