perf: 优化数据引擎搜索

admin_2/src/pages/engineSearch/components/Search.vue

@@ -85,7 +85,8 @@
               placement="bottom-start"
               popper-class="search-popover"
             >
-              <div class="w-full">
+              <div class="h-auto w-full">
+                <div class="w-full" v-if="calcBusinessList.length">
                   <div class="mb-3">推荐业务</div>
                   <div class="flex w-full flex-col gap-3">
                     <div
@@ -101,6 +102,15 @@
                     </div>
                   </div>
                 </div>
+                <div
+                  v-else
+                  class="flex h-full w-full items-center justify-center"
+                >
+                  <el-empty
+                    :image="require('@/assets/img/empty.png')"
+                  ></el-empty>
+                </div>
+              </div>
               <el-input
                 size="small"
                 placeholder="请输入"
@@ -135,7 +145,8 @@
               placement="bottom-start"
               popper-class="search-popover"
             >
-              <div class="w-full">
+              <div class="h-auto w-full">
+                <div class="w-full" v-if="calcDept.length">
                   <div class="mb-3">推荐部门</div>
                   <div class="flex w-full flex-col gap-3">
                     <div
@@ -151,6 +162,15 @@
                     </div>
                   </div>
                 </div>
+                <div
+                  v-else
+                  class="flex h-full w-full items-center justify-center"
+                >
+                  <el-empty
+                    :image="require('@/assets/img/empty.png')"
+                  ></el-empty>
+                </div>
+              </div>
               <el-input
                 size="small"
                 placeholder="请输入"
@@ -168,7 +188,8 @@
               placement="bottom-start"
               popper-class="search-popover"
             >
-              <div class="w-full">
+              <div class="h-auto w-full">
+                <div class="w-full" v-if="calcWindow.length">
                   <div class="mb-3">推荐窗口</div>
                   <div class="flex w-full flex-col gap-3">
                     <div
@@ -186,6 +207,15 @@
                     </div>
                   </div>
                 </div>
+                <div
+                  v-else
+                  class="flex h-full w-full items-center justify-center"
+                >
+                  <el-empty
+                    :image="require('@/assets/img/empty.png')"
+                  ></el-empty>
+                </div>
+              </div>
               <el-input
                 size="small"
                 placeholder="请输入"
@@ -268,10 +298,30 @@ export default {
       },
     },
   },
+  watch: {
+    businessList: {
+      handler(val) {
+        this.calcBusiness = val.slice(0, 10);
+      },
+      deep: true,
+      immediate: true,
+    },
+    deptList: {
+      handler(val) {
+        this.calcDept = val.slice(0, 10);
+      },
+      deep: true,
+      immediate: true,
+    },
+    windowList: {
+      handler(val) {
+        this.calcWindow = val.slice(0, 10);
+      },
+      deep: true,
+      immediate: true,
+    },
+  },
   created() {
-    this.calcBusiness = this.businessList.slice(0, 10);
-    this.calcDept = this.deptList.slice(0, 10);
-    this.calcWindow = this.windowList.slice(0, 10);
     this.getSubMenus();
   },
   mounted() {},
@@ -423,5 +473,6 @@ export default {
 :global(.search-popover) {
   width: 348px;
   min-height: 330px;
+  display: flex;
 }
 </style>