站点地图重复调用问题

src/components/Ems/ZdSelect/index.vue

@@ -3,12 +3,12 @@
   <div class="zd-select-container">
     <el-form :inline="true">
       <el-form-item label="站点选择">
-        <el-select v-model="id" placeholder="请选择换电站名称" :loading="loading" loading-text="正在加载数据" @change="change">
+        <el-select v-model="id" placeholder="请选择换电站名称" :loading="loading" loading-text="正在加载数据">
           <el-option :label="item.siteName" :value="item.id" v-for="(item,index) in siteList" :key="index+'zdxeSelect'"></el-option>
         </el-select>
       </el-form-item>
       <el-form-item>
-        <el-button type="primary" @click="onSubmit">搜索</el-button>
+        <el-button type="primary" :loading="searchLoading" @click="onSubmit">搜索</el-button>
       </el-form-item>
     </el-form>
   </div>
@@ -37,6 +37,7 @@ import {mapGetters} from "vuex"
       return {
         id:'',
         loading:false,
+        searchLoading:false,
         siteList:[],
       }
     },
@@ -47,9 +48,6 @@ import {mapGetters} from "vuex"
       onSubmit(){
         this.$emit('submitSite',this.id)
       },
-      change(id){
-        this.$emit('changeSite',id)
-      },
       setDefaultSite(){
         const defaultSite = parseInt(this.defaultSiteId)
         if(defaultSite && this.siteList.find(item=>item.id === defaultSite)){
@@ -64,11 +62,12 @@ import {mapGetters} from "vuex"
           this.siteList = response.data || []
           console.log("获取站点列表返回数据",response,this.siteList)
           this.setDefaultSite()
-        }).finally(() => {this.loading=false})
+        }).finally(() => {this.loading=false;this.searchLoading=false})
       }
     },
     mounted(){
       this.loading=true
+      this.searchLoading=true
       this.$nextTick(()=>{
         if(this.getListByStore){
           if(this.zdList.length === 0){
@@ -79,6 +78,7 @@ import {mapGetters} from "vuex"
           }else{
             this.siteList = this.zdList
             this.loading=false
+            this.searchLoading=false
             console.log("从store中获取站点列表数据",this.zdList,this.siteList)
             this.setDefaultSite()
           }

src/views/ems/zddt/index.vue

@@ -7,7 +7,7 @@
       </div>
       <div class="zd-msg-container">
         <div class="zd-msg-top">
-          <zd-select @submitSite="submitSite"></zd-select>
+          <zd-select ref="zdSelect" @submitSite="submitSite"></zd-select>
           <el-card class="common-card-container">
             <div slot="header">
               <span class="card-title">基本信息</span>
@@ -99,6 +99,7 @@ export default {
       if(this.singleSiteId === id){return console.log(`点击搜索按钮 搜索相同的站点id= ${id}不再调用获取基本信息接口`)}
       console.log('点击搜索按钮 选中的站点id',id)
       this.singleSiteId = id
+      this.$refs.zdSelect.searchLoading = true
       getSingleSiteBaseInfo(id).then(response => {
         console.log('单个站点详情数据',response)
         const res = response.data || {}
@@ -112,8 +113,7 @@ export default {
         })
         this.$refs.barChart.setOption(res?.sevenDayDisChargeStats || [])
         this.$refs.mapChart.setOption([{name:this.singleSiteName,value:this.singleSiteLocation}])
-
-      })
+      }).finally(() => {this.$refs.zdSelect.searchLoading = false})
     },
     //跳转单站监控页面
     toDzjk(){