From 4aa0bc0f5dc0d8d5ba7ade5c89ea9aa1eb84c606 Mon Sep 17 00:00:00 2001
From: zhangjunwen <zhangjunwen@inspur.com>
Date: Wed, 19 Jun 2024 11:54:34 +0800
Subject: [PATCH] =?UTF-8?q?=E5=B7=A5=E6=8E=A7=E7=B3=BB=E7=BB=9F=E5=90=8C?=
 =?UTF-8?q?=E6=AD=A5=E4=B8=8A=E5=B1=82=E5=B9=B3=E5=8F=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 zfipc-ui/src/layout/components/Navbar.vue     |   2 +-
 .../views/eqmanagement/eqcategory/index.vue   | 409 ++++++++++--------
 2 files changed, 239 insertions(+), 172 deletions(-)

diff --git a/zfipc-ui/src/layout/components/Navbar.vue b/zfipc-ui/src/layout/components/Navbar.vue
index 93caf2a..225e5c5 100644
--- a/zfipc-ui/src/layout/components/Navbar.vue
+++ b/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">
diff --git a/zfipc-ui/src/views/eqmanagement/eqcategory/index.vue b/zfipc-ui/src/views/eqmanagement/eqcategory/index.vue
index 8fa0937..6708253 100644
--- a/zfipc-ui/src/views/eqmanagement/eqcategory/index.vue
+++ b/zfipc-ui/src/views/eqmanagement/eqcategory/index.vue
@@ -1,54 +1,88 @@
 <template>
   <div class="app-container">
-    <el-form
-      :model="queryParams"
-      ref="queryForm"
-      size="small"
-      :inline="true"
-      v-show="showSearch"
-      label-width="90px"
-      style="text-align:right"
-    >
-      <el-form-item
-        label="设备类别名称"
-        prop="categoryName"
+    <el-row :gutter="20">
+      <!--部门数据-->
+      <el-col
+        :span="4"
+        :xs="24"
       >
-        <el-input
-          v-model="queryParams.categoryName"
-          placeholder="请输入设备类别名称"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item
-        label="设备类别简称"
-        prop="categoryAbbr"
-      >
-        <el-input
-          v-model="queryParams.categoryAbbr"
-          placeholder="请输入设备类别简称"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item
-        label="设备类别状态"
-        prop="status"
-      >
-        <el-select
-          v-model="queryParams.status"
-          placeholder="请选择节点状态"
-          clearable
-        >
-          <el-option
-            v-for="dict in dict.type.equip_category_status"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
+        <div class="head-container">
+          <el-input
+            v-model="deptName"
+            placeholder="请输入部门名称"
+            clearable
+            size="small"
+            prefix-icon="el-icon-search"
+            style="margin-bottom: 20px"
           />
-        </el-select>
-      </el-form-item>
-      <!-- <el-form-item
+        </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"
+          size="small"
+          :inline="true"
+          v-show="showSearch"
+          label-width="90px"
+          style="text-align:right"
+        >
+          <el-form-item
+            label="设备类别名称"
+            prop="categoryName"
+          >
+            <el-input
+              v-model="queryParams.categoryName"
+              placeholder="请输入设备类别名称"
+              clearable
+              @keyup.enter.native="handleQuery"
+            />
+          </el-form-item>
+          <el-form-item
+            label="设备类别简称"
+            prop="categoryAbbr"
+          >
+            <el-input
+              v-model="queryParams.categoryAbbr"
+              placeholder="请输入设备类别简称"
+              clearable
+              @keyup.enter.native="handleQuery"
+            />
+          </el-form-item>
+          <el-form-item
+            label="设备类别状态"
+            prop="status"
+          >
+            <el-select
+              v-model="queryParams.status"
+              placeholder="请选择节点状态"
+              clearable
+            >
+              <el-option
+                v-for="dict in dict.type.equip_category_status"
+                :key="dict.value"
+                :label="dict.label"
+                :value="dict.value"
+              />
+            </el-select>
+          </el-form-item>
+          <!-- <el-form-item
         label="设备类别所属部门"
         prop="deptId"
       >
@@ -59,36 +93,36 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item> -->
-      <el-form-item>
-        <el-button
-          type="primary"
-          icon="el-icon-search"
-          size="mini"
-          @click="handleQuery"
-        >搜索</el-button>
-        <el-button
-          icon="el-icon-refresh"
-          size="mini"
-          @click="resetQuery"
-        >重置</el-button>
-      </el-form-item>
-    </el-form>
+          <el-form-item>
+            <el-button
+              type="primary"
+              icon="el-icon-search"
+              size="mini"
+              @click="handleQuery"
+            >搜索</el-button>
+            <el-button
+              icon="el-icon-refresh"
+              size="mini"
+              @click="resetQuery"
+            >重置</el-button>
+          </el-form-item>
+        </el-form>
 
-    <el-row
-      :gutter="10"
-      class="mb8"
-    >
-      <el-col :span="1.5">
-        <el-button
-          type="primary"
-          plain
-          icon="el-icon-plus"
-          size="mini"
-          @click="handleAdd"
-          v-hasPermi="['equip:category:add']"
-        >新增</el-button>
-      </el-col>
-      <!-- <el-col :span="1.5">
+        <el-row
+          :gutter="10"
+          class="mb8"
+        >
+          <!-- <el-col :span="1.5">
+            <el-button
+              type="primary"
+              plain
+              icon="el-icon-plus"
+              size="mini"
+              @click="handleAdd"
+              v-hasPermi="['equip:category:add']"
+            >新增</el-button>
+          </el-col> -->
+          <!-- <el-col :span="1.5">
         <el-button
           type="success"
           plain
@@ -120,36 +154,36 @@
           v-hasPermi="['system:category:export']"
         >导出</el-button>
       </el-col> -->
-      <right-toolbar
-        :showSearch.sync="showSearch"
-        @queryTable="getList"
-      ></right-toolbar>
-    </el-row>
+          <right-toolbar
+            :showSearch.sync="showSearch"
+            @queryTable="getList"
+          ></right-toolbar>
+        </el-row>
 
-    <el-table
-      v-if="refreshTable"
-      v-loading="loading"
-      :data="categoryList"
-      row-key="categoryId"
-      :default-expand-all="isExpandAll"
-      :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
-      v-hasPermi="['ipc:faultTreeConfig:list']"
-    >
-      <el-table-column
-        label="设备类别名称"
-        prop="categoryName"
-      />
-      <el-table-column
-        label="设备类别简称"
-        prop="categoryAbbr"
-      />
-      <el-table-column
-        label="设备类别描述"
-        show-overflow-tooltip
-        align="center"
-        prop="categoryDescription"
-      />
-      <!-- <el-table-column
+        <el-table
+          v-if="refreshTable"
+          v-loading="loading"
+          :data="categoryList"
+          row-key="categoryId"
+          :default-expand-all="isExpandAll"
+          :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
+          v-hasPermi="['ipc:faultTreeConfig:list']"
+        >
+          <el-table-column
+            label="设备类别名称"
+            prop="categoryName"
+          />
+          <el-table-column
+            label="设备类别简称"
+            prop="categoryAbbr"
+          />
+          <el-table-column
+            label="设备类别描述"
+            show-overflow-tooltip
+            align="center"
+            prop="categoryDescription"
+          />
+          <!-- <el-table-column
         label="创建时间"
         align="center"
         prop="createdTime"
@@ -174,73 +208,74 @@
         align="center"
         prop="parentCategoryId"
       />-->
-      <el-table-column
-        label="图片"
-        align="center"
-      >
-        <template slot-scope="scope">
-          <el-button
-            v-if="hasPath(scope.row)"
-            size="mini"
-            type="text"
-            @click="clickPic(scope.row)"
-          >设备类别图片</el-button>
-          <el-image-viewer
-            v-if="showViewer"
-            :on-close="closeViewer"
-            :url-list="tableImageList"
+          <el-table-column
+            label="图片"
+            align="center"
+          >
+            <template slot-scope="scope">
+              <el-button
+                v-if="hasPath(scope.row)"
+                size="mini"
+                type="text"
+                @click="clickPic(scope.row)"
+              >设备类别图片</el-button>
+              <el-image-viewer
+                v-if="showViewer"
+                :on-close="closeViewer"
+                :url-list="tableImageList"
+              />
+            </template>
+          </el-table-column>
+          <el-table-column
+            label="设备类别状态"
+            align="center"
+            prop="status"
+          >
+            <template slot-scope="scope">
+              <dict-tag
+                :options="dict.type.equip_category_status"
+                :value="scope.row.status"
+              />
+            </template>
+          </el-table-column>
+          <el-table-column
+            label="备注"
+            show-overflow-tooltip
+            align="center"
+            prop="remark"
           />
-        </template>
-      </el-table-column>
-      <el-table-column
-        label="设备类别状态"
-        align="center"
-        prop="status"
-      >
-        <template slot-scope="scope">
-          <dict-tag
-            :options="dict.type.equip_category_status"
-            :value="scope.row.status"
-          />
-        </template>
-      </el-table-column>
-      <el-table-column
-        label="备注"
-        show-overflow-tooltip
-        align="center"
-        prop="remark"
-      />
-      <el-table-column
-        label="操作"
-        align="center"
-        class-name="small-padding fixed-width"
-      >
-        <template slot-scope="scope">
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-edit"
-            @click="handleUpdate(scope.row)"
-            v-hasPermi="['equip:category:edit']"
-          >修改</el-button>
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-plus"
-            @click="handleAdd(scope.row)"
-            v-hasPermi="['equip:category:add']"
-          >新增</el-button>
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-delete"
-            @click="handleDelete(scope.row)"
-            v-hasPermi="['equip:category:remove']"
-          >删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-
+          <!-- <el-table-column
+            label="操作"
+            align="center"
+            class-name="small-padding fixed-width"
+          >
+            <template slot-scope="scope">
+              <el-button
+                size="mini"
+                type="text"
+                icon="el-icon-edit"
+                @click="handleUpdate(scope.row)"
+                v-hasPermi="['equip:category:edit']"
+              >修改</el-button>
+              <el-button
+                size="mini"
+                type="text"
+                icon="el-icon-plus"
+                @click="handleAdd(scope.row)"
+                v-hasPermi="['equip:category:add']"
+              >新增</el-button>
+              <el-button
+                size="mini"
+                type="text"
+                icon="el-icon-delete"
+                @click="handleDelete(scope.row)"
+                v-hasPermi="['equip:category:remove']"
+              >删除</el-button>
+            </template>
+          </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;
     },