优化后台资产信息位置显示

ruoyi-ui/src/views/asset/information/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="app-container">
-    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">
+    <el-form :model="queryParams" ref="queryForm" class="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">
       <el-form-item label="资产条码" prop="code">
         <el-input
           v-model="queryParams.code"
@@ -56,14 +56,7 @@
         </div>
       </el-form-item>
       <el-form-item label="所在位置" prop="locationNumber">
-        <el-select v-model="queryParams.locationNumber" placeholder="请选择所在位置">
-            <el-option
-              v-for="item in locationList"
-              :key="item.number"
-              :label="item.name"
-              :value="parseInt(item.number)"
-            ></el-option>
-          </el-select>
+        <treeselect v-model="queryParams.locationNumber" :options="locationList" :normalizer="tenantIdnormalizer" placeholder="选择位置" />
       </el-form-item>
       <el-form-item label="所属公司" prop="corporation">
         <div style="display:inline-block; width: 183px;">
@@ -339,7 +332,7 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item> -->
-      <el-form-item>
+      <el-form-item style="padding-left: 30px;">
         <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>
@@ -440,7 +433,7 @@
       </el-table-column>
       <el-table-column label="所在位置" align="center" prop="locationNumber" >
         <template slot-scope="scope">
-          <span>{{ scope.row.locationNumber != null ? locationName(scope.row.locationNumber) : ""}}</span>
+          <span>{{locationName(scope.row.locationNumber)}}</span>
         </template>
       </el-table-column>
       <el-table-column label="所属公司" align="center" prop="corporation" >
@@ -584,14 +577,7 @@
               />
         </el-form-item>
         <el-form-item label="所在位置" prop="locationNumber">
-          <el-select v-model="form.locationNumber" placeholder="请选择所在位置">
-            <el-option
-              v-for="item in locationList"
-              :key="item.number"
-              :label="item.name"
-              :value="item.number"
-            ></el-option>
-          </el-select>
+          <treeselect v-model="form.locationNumber" :options="locationList" :normalizer="tenantIdnormalizer" placeholder="选择位置" />
         </el-form-item>
         <el-form-item label="所属公司" prop="corporation">
               <treeselect
@@ -816,7 +802,7 @@
 <script>
 import { listInformation, getInformation, delInformation, addInformation, updateInformation, setDiy, getDiy } from "@/api/asset/information";
 import { listCategory } from "@/api/asset/category";
-import { listLocation } from "@/api/asset/location";
+import { treeSelect } from "@/api/asset/location";
 import ImageUploadTemp from "@/components/ImageUploadTemp"
 import { listDept } from "@/api/system/dept";
 import Treeselect from "@riophae/vue-treeselect";
@@ -968,8 +954,8 @@ export default {
       listCategory().then(response => {
         this.categoryList = response.rows;
       });
-      listLocation().then((response) => {
-        this.locationList = response.rows;
+      treeSelect().then((response) => {
+        this.locationList = response.data;
       });
       listInformation(this.queryParams).then(response => {
         this.informationList = response.rows;
@@ -988,6 +974,13 @@ export default {
         children: node.children,
       };
     },
+    tenantIdnormalizer(node) {
+      return {
+        id: node.number,
+        label: node.label,
+        children: node.children
+      }
+    },
     //获取公司名
     companyName(val){
        let num = parseInt(val)
@@ -1001,10 +994,39 @@ export default {
        return arr2[0].name
     },
     //获取所在位置名
-    locationName(val){
-      //let num = parseInt(val)
-      let arr2 = this.locationList.filter(item => item.number===val);
-       return arr2[0].name
+    locationName(number) {
+      let name = '未知'
+      for (let item of this.locationList) {
+        if (item.number === number) {
+          name = item.label
+          break
+        }
+        if (item.children) {
+          let label = this.findLocation(number, item.children)
+          if (label != null) {
+            name = label
+            break
+          }
+        }
+      }
+      return name
+    },
+    findLocation(number, children) {
+      let name = null
+      for (let item of children) {
+        if (item.number === number) {
+          name = item.label
+          break
+        }
+        if (item.children) {
+          let label = this.findLocation(number, item.children)
+          if (label != null) {
+            name = label
+            break
+          }
+        }
+      }
+      return name
     },
     // 取消按钮
     cancel() {
@@ -1197,4 +1219,13 @@ export default {
     }
   }
 }
+/deep/ .vue-treeselect {
+  display: inline-block;
+}
+.queryForm {
+  /deep/ .vue-treeselect {
+    width: 205px;
+    height: 32px;
+  }
+}
 </style>