Merge branch 'feat/v20240706-dashboard' into dev

src/views/dashboard/index.vue

@@ -1,18 +1,36 @@
 <template>
-  <div class="dashboard-container" ref="dashboardContainerRef">
+  <div class="dashboard-container" ref="dashboardContainerRef" v-loading="isLoading">
     <!-- 顶部的地区和店铺筛选 -->
     <div class="total-search">
       <div class="wrapper">
         <el-form ref="topSearchFormRef" inline :model="topSearchForm">
           <el-form-item label="代理商">
-            <el-select @change="handleChangeTopSelect('agents')" v-model="topSearchForm.agents" class="select" placeholder="请选择代理商">
-              <el-option v-for="(item, index) in selectOptions.agents" :key="`${item.shopAddress}:${index}`" :label="item.shopName" :value="`${item.shopAddress}:${index}`"></el-option>
+            <el-select :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"
+                :key="`${item.shopAddress}:${index}`"
+                :label="item.shopName"
+                :value="`${item.shopAddress}:${index}`"
+              >
+                <div style="font-size: 14px; font-weight: bold; margin-bottom: 7px; color: black">{{ item.shopName }}</div>
+                <div style="height: auto !important; line-height: 1.1; margin: 2px 0">{{ item.shopAddress }}</div>
+              </el-option>
             </el-select>
           </el-form-item>
 
           <el-form-item label="加盟商">
             <el-select @change="handleChangeTopSelect('franchise')" v-model="topSearchForm.franchise" class="select" placeholder="请选择加盟商">
-              <el-option v-for="(item, index) in selectOptions.franchise" :key="`${item.shopAddress}:${index}`" :label="item.shopName" :value="`${item.shopAddress}:${index}`"></el-option>
+              <el-option
+                style="height: auto !important; line-height: 1.1; padding: 5px 15px; margin: 2px 0"
+                v-for="(item, index) in selectOptions.franchise"
+                :key="`${item.shopAddress}:${index}`"
+                :label="item.shopName"
+                :value="`${item.shopAddress}:${index}`"
+              >
+                <div style="font-size: 14px; font-weight: bold; margin-bottom: 7px; color: black">{{ item.shopName }}</div>
+                <div style="height: auto !important; line-height: 1.1; margin: 2px 0">{{ item.shopAddress }}</div>
+              </el-option>
             </el-select>
           </el-form-item>
 
@@ -139,7 +157,6 @@ import PAndLWarning from './componets/PAndLWarning.vue'
 import SetPLLine from './componets/SetPLLine.vue'
 
 import { statisticalArea, consumerProfile, financialStatistics, sitedatastatistics, searchType } from './data/dashboard.js'
-import { Loading } from 'element-ui'
 
 // api docs: https://www.showdoc.com.cn/2275703555064913/11472635245710770
 export default {
@@ -161,6 +178,7 @@ export default {
   data() {
     return {
       observer: null,
+      isLoading: false,
       statisticalArea: Object.freeze(statisticalArea),
       consumerProfile: Object.freeze(consumerProfile),
       financialStatistics: Object.freeze(financialStatistics),
@@ -357,7 +375,7 @@ export default {
 
     // 一次性获取首页数据
     async getHomeData() {
-      const serveice = Loading.service()
+      this.isLoading = true
       try {
         const type = this.topSearchForm.type
         let address = undefined
@@ -399,7 +417,7 @@ export default {
         this.nationalMapList = data.nationalMapList
       } catch (error) {
       } finally {
-        serveice.close()
+        this.isLoading = false
       }
     },