修改

dsk-operate-ui/src/views/detail/groupAccount/component/zbxmfx.vue

@@ -53,14 +53,15 @@
         :slots="true"
         :isExcel="false"
       ></head-form>
-      <el-row>
+      <skeleton v-if="isSkeleton2" style="padding: 16px"></skeleton>
+      <el-row v-if="!isSkeleton2">
         <el-col :span="12">
-          <div id="ndzb-echarts" style="height: 300px;"></div>
+          <div id="ndzb-echarts" style="height: 280px;"></div>
         </el-col>
         <el-col :span="12">
           <div class="box-right">
             <div class="table-item">
-              <el-table class="fixed-table" :data="ndzbList" border max-height="270">
+              <el-table class="fixed-table" :data="ndzbList" border max-height="260">
                 <el-table-column label="年度" prop="type" min-width="70"></el-table-column>
                 <el-table-column label="历史发包数量" prop="count" width="120">
                   <template slot-scope="scope">
@@ -96,12 +97,14 @@
         <el-select
           v-model="year1"
           clearable
+          @change="changeSelect1"
           class="form-content-width"
           style="width: 80px">
           <el-option v-for="(item, index) in yearOptions" :key="index" :label="item.name" :value="item.value"/>
         </el-select>
       </div>
-      <el-row>
+      <skeleton v-if="isSkeleton3" style="padding: 16px"></skeleton>
+      <el-row v-if="!isSkeleton3">
         <el-col :span="12">
           <div id="fbje-echarts" style="height: 280px;"></div>
         </el-col>
@@ -133,12 +136,14 @@
         <el-select
           v-model="year2"
           clearable
+          @change="changeSelect2"
           class="form-content-width"
           style="width: 80px">
           <el-option v-for="(item, index) in yearOptions" :key="index" :label="item.name" :value="item.value"/>
         </el-select>
       </div>
-      <el-row>
+      <skeleton v-if="isSkeleton4" style="padding: 16px"></skeleton>
+      <el-row v-if="!isSkeleton4">
         <el-col :span="12">
           <div id="lxtj-echarts" style="height: 280px;"></div>
         </el-col>
@@ -181,12 +186,14 @@
         <el-select
           v-model="year3"
           clearable
+          @change="changeSelect3"
           class="form-content-width"
           style="width: 80px">
           <el-option v-for="(item, index) in yearOptions" :key="index" :label="item.name" :value="item.value"/>
         </el-select>
       </div>
-      <el-row>
+      <skeleton v-if="isSkeleton5" style="padding: 16px"></skeleton>
+      <el-row v-if="!isSkeleton5">
         <el-col :span="12">
           <div id="xfl-echarts" style="height: 280px;"></div>
         </el-col>
@@ -270,14 +277,16 @@
       return{
         queryParams: {
           combineId: this.customerId,
+          year:'2023'
         },
         queryParams1: {
           combineId: this.customerId,
+          year:'2023'
         },
         formData: [
           { type: 4, fieldName: 'type', value: '', placeholder: '项目类型', options: [],width:150},
           { type: 1, fieldName: 'cgbl', value: '', placeholder: '持股比例', options: [],width:110},
-          { type: 1, fieldName: 'year', value: '', placeholder: '年份', options: [],width:80},
+          { type: 1, fieldName: 'year', value: '2023', placeholder: '年份', options: [],width:80},
         ],
         cgblList: [
           {name:'100%',value:'100%'},
@@ -343,6 +352,7 @@
         this.formData[2].options=Years
       },
       handleQuery(params){
+        // this.isSkeleton = true
         let data = params || this.queryParams;
         if(data.cgbl){
           if(data.cgbl === '100%'){
@@ -378,7 +388,7 @@
       },
       getBidByYear(){
         bidByYear({combineId:this.customerId}).then(res=>{
-          // this.isSkeleton = false
+          this.isSkeleton2 = false
           if(res.code === 200){
             this.ndzbList=res.data;
             if(res.data.length > 0){
@@ -390,7 +400,7 @@
       getGroupByMoney(){
         let year=[this.year1.toString()]
         groupByMoney({combineId:this.customerId,year:year}).then(res=>{
-          // this.isSkeleton = false
+          this.isSkeleton3 = false
           if(res.code === 200){
             this.jeqjList=res.data;
 
@@ -410,7 +420,7 @@
       getGroupByType(){
         let year=[this.year2.toString()]
         groupByType({combineId:this.customerId,year:year}).then(res=>{
-          // this.isSkeleton = false
+          this.isSkeleton4 = false
           if(res.code === 200){
             this.lxtjList=res.data;
             if(res.data.length > 0){
@@ -422,7 +432,7 @@
       getGroupByLowerRate(){
         let year=[this.year3.toString()]
         groupByLowerRate({combineId:this.customerId,year:year}).then(res=>{
-          // this.isSkeleton = false
+          this.isSkeleton5 = false
           if(res.code === 200){
             this.xflList=res.data;
             if(res.data.length > 0){
@@ -469,8 +479,14 @@
         let params = this.formParams()
         this.getPeojectTop(params)
       },
-      changeSelect(){
-
+      changeSelect1(){
+        this.getGroupByMoney()
+      },
+      changeSelect2(){
+        this.getGroupByType()
+      },
+      changeSelect3(){
+        this.getGroupByLowerRate()
       },
       initChart(data) {
         this.$nextTick(()=>{