优化图表

src/views/homePage/components/tableMain.vue

@@ -180,7 +180,12 @@
           <el-tag type="success" v-if="scope.row.onlinestatus == 1"
             >在线</el-tag
           >
-          <el-tag type="danger" v-else>离线</el-tag>
+          <el-tag type="warning" v-if="scope.row.onlinestatus == 0"
+            >离线</el-tag
+          >
+          <el-tag type="danger" v-if="scope.row.onlinestatus == -1"
+            >异常</el-tag
+          >
         </template>
       </u-table-column>
       <u-table-column

src/views/picReport/components/selectLineTreeBak.vue

@@ -0,0 +1,142 @@
+<template>
+  <div class="lineBtn">
+    <el-button type="primary" @click="showDialogFn">选择线路</el-button>
+    <el-dialog title="选择线路" :visible.sync="dialogVisible" width="470px">
+      <div class="lineList">
+        <el-tree
+          :data="lineTreeData"
+          show-checkbox
+          ref="tree"
+          node-key="id"
+          highlight-current
+          :props="defaultProps"
+          @check="getCheckedNodes"
+          :default-checked-keys="defaultCheckedKeys"
+        >
+        </el-tree>
+        <el-checkbox-group v-model="checkList">
+          <el-checkbox
+            v-for="item in lineListData"
+            :label="item.id"
+            :key="item.id"
+            >{{ item.name }}</el-checkbox
+          >
+        </el-checkbox-group>
+        <!-- {{ lineListData }} -->
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisible = false">取 消</el-button>
+        <el-button type="primary" @click="saveCheck">确 定</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+<script>
+import { getPermissionTree } from "@/utils/api/index";
+export default {
+  data() {
+    return {
+      dialogVisible: false,
+      checkList: [],
+      lineListData: [],
+      total: 0,
+      lineTreeData: [],
+      defaultProps: {
+        //指定参数格式回显数据
+        children: "list",
+        label: "name",
+      },
+      allCheckNode: [],
+      defaultCheckedKeys: [], // 用来存储默认选中的节点 ID
+    };
+  },
+  mounted() {
+    // this.lineList();
+    this.getlineTree();
+  },
+  methods: {
+    showDialogFn() {
+      this.dialogVisible = true;
+      const storedArray = localStorage.getItem("checkListLocal");
+      console.log(storedArray);
+      if (storedArray) {
+        // 将JSON字符串转换回数组
+        this.checkList = JSON.parse(storedArray);
+        this.checkList = [...new Set(this.checkList)];
+        console.log(this.checkList);
+      }
+      this.defaultCheckedKeys = this.checkList; // 设置默认选中的节点 ID
+    },
+    //获取线路tree
+    getlineTree() {
+      getPermissionTree()
+        .then((res) => {
+          console.log(res);
+          this.lineTreeData = this.preprocessTreeData(res.data);
+        })
+        .catch((err) => {});
+    },
+    //预处理，只保留前两集数据
+    preprocessTreeData(data) {
+      return data.map((node) => {
+        // 复制当前节点
+        let newNode = { ...node };
+        // 如果存在子节点，则只保留前两级
+        if (newNode.list && newNode.list.length > 0) {
+          newNode.list = newNode.list.map((child) => {
+            // 复制子节点
+            let newChild = { ...child };
+            // 移除子节点的子节点（即第三级及以后）
+            newChild.list = [];
+            return newChild;
+          });
+        }
+        return newNode;
+      });
+    },
+    getCheckedNodes(nodeObj) {
+      console.log(nodeObj);
+      this.checkList = [];
+      this.allCheckNode = this.$refs.tree.getCheckedNodes();
+      console.log(this.allCheckNode);
+      this.allCheckNode.forEach((obj) => {
+        console.log(obj);
+        obj.list.forEach((item) => {
+          console.log(item);
+          this.checkList.push(item.id);
+        });
+        console.log(this.checkList);
+      });
+    },
+
+    saveCheck() {
+      console.log(this.checkList);
+      localStorage.setItem("checkListLocal", JSON.stringify(this.checkList));
+      this.dialogVisible = false;
+      this.$parent.getTablefun();
+    },
+  },
+};
+</script>
+<style lang="less">
+.lineBtn {
+  .el-dialog__body {
+    padding: 10px;
+  }
+  .lineList {
+    height: 500px;
+    overflow: auto;
+    .el-dialog__body {
+      overflow: auto;
+    }
+
+    .el-checkbox-group {
+      .el-checkbox {
+        width: 220px;
+        height: 32px;
+        line-height: 32px;
+      }
+    }
+  }
+}
+</style>

src/views/picReport/index.vue

@@ -371,6 +371,7 @@ export default {
         this.picLoading = true;
         picRportApi(params)
           .then((res) => {
+            if (res.code == 200) {
               this.picLoading = false;
               if (res.data.length !== 0) {
                 console.log(res.data);
@@ -378,8 +379,13 @@ export default {
               } else {
                 this.tableData = [];
               }
+            } else {
+              this.picLoading = false;
+            }
           })
-          .catch((err) => {});
+          .catch((err) => {
+            this.picLoading = false;
+          });
       }, 100);
     },