工控系统同步上层平台

zfipc-ui/src/layout/components/Navbar.vue

@@ -7,7 +7,7 @@
     /> -->
     <!-- <top-nav id="topmenu-container" class="topmenu-container" v-if="true" /> -->
     <div class="left-content">
-      <div class="pro-log"></div>
+      <!-- <div class="pro-log"></div> -->
       <div class="pro-title">扁鸿设备工控管理系统</div>
       <div class="top-title-container">
         <template v-for="(item, index) in topNavRouters">

zfipc-ui/src/views/eqmanagement/eqcategory/index.vue

@@ -1,5 +1,39 @@
 <template>
   <div class="app-container">
+    <el-row :gutter="20">
+      <!--部门数据-->
+      <el-col
+        :span="4"
+        :xs="24"
+      >
+        <div class="head-container">
+          <el-input
+            v-model="deptName"
+            placeholder="请输入部门名称"
+            clearable
+            size="small"
+            prefix-icon="el-icon-search"
+            style="margin-bottom: 20px"
+          />
+        </div>
+        <div class="head-container">
+          <el-tree
+            :data="deptOptions"
+            :props="defaultProps"
+            :expand-on-click-node="false"
+            :filter-node-method="filterNode"
+            ref="tree"
+            node-key="id"
+            default-expand-all
+            highlight-current
+            @node-click="handleNodeClick"
+          />
+        </div>
+      </el-col>
+      <el-col
+        :span="20"
+        :xs="24"
+      >
         <el-form
           :model="queryParams"
           ref="queryForm"
@@ -78,7 +112,7 @@
           :gutter="10"
           class="mb8"
         >
-      <el-col :span="1.5">
+          <!-- <el-col :span="1.5">
             <el-button
               type="primary"
               plain
@@ -87,7 +121,7 @@
               @click="handleAdd"
               v-hasPermi="['equip:category:add']"
             >新增</el-button>
-      </el-col>
+          </el-col> -->
           <!-- <el-col :span="1.5">
         <el-button
           type="success"
@@ -210,7 +244,7 @@
             align="center"
             prop="remark"
           />
-      <el-table-column
+          <!-- <el-table-column
             label="操作"
             align="center"
             class-name="small-padding fixed-width"
@@ -238,9 +272,10 @@
                 v-hasPermi="['equip:category:remove']"
               >删除</el-button>
             </template>
-      </el-table-column>
+          </el-table-column> -->
         </el-table>
-
+      </el-col>
+    </el-row>
     <!-- 添加或修改设备分类对话框 -->
     <el-dialog
       :title="title"
@@ -410,6 +445,7 @@ import FileUpload from "@/components/FileUpload";
 import { getToken } from "@/utils/auth";
 import { Loading } from "element-ui";
 import ElImageViewer from "element-ui/packages/image/src/image-viewer";
+import { deptTreeSelect } from "@/api/system/user";
 export default {
   name: "Category",
   components: {
@@ -510,12 +546,43 @@ export default {
       files: [],
       tableImageList: [],
       showViewer: false,
+      // 部门名称
+      deptName: undefined,
+      // 部门树选项
+      deptOptions: undefined,
+      defaultProps: {
+        children: "children",
+        label: "label",
+      },
     };
   },
+  watch: {
+    // 根据名称筛选部门树
+    deptName(val) {
+      this.$refs.tree.filter(val);
+    },
+  },
   created() {
     this.getList();
+    this.getDeptTree();
   },
   methods: {
+    /** 查询部门下拉树结构 */
+    getDeptTree() {
+      deptTreeSelect().then((response) => {
+        this.deptOptions = response.data;
+      });
+    },
+    // 筛选节点
+    filterNode(value, data) {
+      if (!value) return true;
+      return data.label.indexOf(value) !== -1;
+    },
+    // 节点单击事件
+    handleNodeClick(data) {
+      this.queryParams.deptId = data.id;
+      this.handleQuery();
+    },
     hasPath(data) {
       return data.picPath == null || data.picPath == "" ? false : true;
     },