Merge branch 'feat/v20240706-dashboard' into dev

src/views/dashboard/index.vue

@@ -5,7 +5,17 @@
       <div class="wrapper">
         <el-form ref="topSearchFormRef" inline :model="topSearchForm">
           <el-form-item label="代理商">
-            <el-select clearable :popper-append-to-body="false" @change="handleChangeTopSelect('agents')" v-model="topSearchForm.agents" class="select" placeholder="请选择代理商">
+            <el-select
+              remote
+              :remote-method="(query) => handleSearchOptions('agents', query)"
+              filterable
+              clearable
+              :popper-append-to-body="false"
+              @change="handleChangeTopSelect('agents')"
+              v-model="topSearchForm.agents"
+              class="select"
+              placeholder="请选择代理商"
+            >
               <el-option
                 style="height: auto !important; line-height: 1.1; padding: 5px 15px; margin: 2px 0"
                 v-for="(item, index) in selectOptions.agents"
@@ -20,7 +30,16 @@
           </el-form-item>
 
           <el-form-item label="加盟商">
-            <el-select clearable @change="handleChangeTopSelect('franchise')" v-model="topSearchForm.franchise" class="select" placeholder="请选择加盟商">
+            <el-select
+              :remote-method="(query) => handleSearchOptions('franchise', query)"
+              filterable
+              clearable
+              remote
+              @change="handleChangeTopSelect('franchise')"
+              v-model="topSearchForm.franchise"
+              class="select"
+              placeholder="请选择加盟商"
+            >
               <el-option
                 style="height: auto !important; line-height: 1.1; padding: 5px 15px; margin: 2px 0"
                 v-for="(item, index) in selectOptions.franchise"
@@ -35,7 +54,14 @@
           </el-form-item>
 
           <el-form-item label="商家">
-            <el-select clearable @change="handleChangeTopSelect('shop')" class="select" v-model="topSearchForm.shop" placeholder="请选择商家">
+            <el-select
+              filterable
+              clearable
+              @change="handleChangeTopSelect('shop')"
+              class="select"
+              v-model="topSearchForm.shop"
+              placeholder="请选择商家"
+            >
               <el-option v-for="(item, index) in selectOptions.shopList" :key="`${item.shopName}:${index}`" :label="item.shopName" :value="`${item.shopName}:${index}`"></el-option>
             </el-select>
           </el-form-item>
@@ -220,7 +246,10 @@ export default {
 
         shopList: [], // 商家列表
         agents: [], // 代理商列表
-        franchise: [] // 加盟商列表
+        franchise: [], // 加盟商列表
+        shopOriginList: [], // 商家列表
+        agentsOrigin: [], // 代理商列表
+        franchiseOrigin: [] // 加盟商列表
       },
 
       // 分析图相关
@@ -356,10 +385,12 @@ export default {
         })
         const target = type === 1 ? 'agents' : 'franchise'
         this.selectOptions[target] = res.status === 200 && res.data.statusCode === 20000 ? res.data.data : []
+        this.selectOptions[target + 'Origin'] = res.status === 200 && res.data.statusCode === 20000 ? res.data.data : []
       } catch (error) {
         console.error('Error fetching data:', error)
         const target = type === 1 ? 'agents' : 'franchise'
         this.selectOptions[target] = []
+        this.selectOptions[target + 'Origin'] = []
       }
     },
 
@@ -368,8 +399,10 @@ export default {
       try {
         const res = await getHomeStatisticsShopList()
         this.selectOptions.shopList = res.data
+        this.selectOptions.shopOriginList = res.data
       } catch (error) {
         this.selectOptions.shopList = []
+        this.selectOptions.shopOriginList = []
       }
     },
 
@@ -418,7 +451,6 @@ export default {
         // 地图数据
         this.nationalMapList = data.nationalMapList
       } catch (error) {
-        
       } finally {
         this.isLoading = false
       }
@@ -493,6 +525,19 @@ export default {
       }
 
       this.topSearchForm.type = searchType.find((item) => item.key === currentKey).value || null
+    },
+
+    handleSearchOptions(key, query) {
+      try {
+        if (query) {
+          const res = this.selectOptions[key + 'Origin'].filter((item) => {
+            return (item.shopName + '').includes(query) || (item.shopAddress + '').includes(query)
+          })
+          this.selectOptions[key] = res
+        } else {
+          this.selectOptions[key] = JSON.parse(JSON.stringify(this.selectOptions[key + 'Origin']))
+        }
+      } catch (error) {}
     }
   },