Merge branch 'feature_20241016_下属汇报率审批率统计添加loading'

src/views/home/reportingRate.vue

@@ -1,7 +1,11 @@
 <template>
   <div>
     <div class="navBarTOP">
-      <van-nav-bar class="navBar" left-arrow title="下属汇报率审批率统计" @click-left="onClickLeft"/>
+      <van-nav-bar
+        class="navBar"
+        left-arrow
+        title="下属汇报率审批率统计"
+        @click-left="onClickLeft" />
     </div>
     <!--        主体内容-->
     <div class="lineGrey"></div>
@@ -12,41 +16,64 @@
     <div class="container contentpd16 containers">
       <van-row gutter="20">
         <van-col span="12">
-          <van-cell :disabled="powerGrade<5" :title="companyName" arrow-direction="down" is-link @click="regionClick"/>
+          <van-cell
+            :disabled="powerGrade < 5"
+            :title="companyName"
+            arrow-direction="down"
+            is-link
+            @click="regionClick" />
         </van-col>
         <van-col span="12">
-          <van-cell :title="regionName" arrow-direction="down" is-link @click="SalesRegionClick"/>
+          <van-cell :title="regionName" arrow-direction="down" is-link @click="SalesRegionClick" />
         </van-col>
         <van-col span="12">
           <van-cell :title="seacherForm.startTime" is-link @click="StartTimeClick">
             <template #right-icon>
-              <van-icon :name="timeico" class="search-icon"/>
+              <van-icon :name="timeico" class="search-icon" />
             </template>
           </van-cell>
         </van-col>
         <van-col span="12">
           <van-cell :title="seacherForm.endTime" is-link @click="EndTimeClick">
             <template #right-icon>
-              <van-icon :name="timeico" class="search-icon"/>
+              <van-icon :name="timeico" class="search-icon" />
             </template>
           </van-cell>
         </van-col>
       </van-row>
     </div>
-    <el-table :data="tableList" :load="load" :tree-props="{ children: 'children', hasChildren: 'hasChildren' }" border class="elTreeTable" lazy row-key="id">
+    <el-table
+      :data="tableList"
+      :load="load"
+      :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
+      border
+      class="elTreeTable"
+      lazy
+      row-key="id">
       <el-table-column class="firstName" label="组织名称/业务员(单位%)" prop="deptName" width="120">
         <template slot-scope="scope">
-          <span v-if="scope.row.reportType==1">{{ scope.row.userName }}</span>
-          <span v-if="scope.row.reportType!=1">{{ scope.row.deptName }}</span>
+          <span v-if="scope.row.reportType == 1">{{ scope.row.userName }}</span>
+          <span v-if="scope.row.reportType != 1">{{ scope.row.deptName }}</span>
         </template>
       </el-table-column>
       <el-table-column label="半月报" width="46">
         <el-table-column label="提交率%" prop="name" width="46">
           <template slot-scope="scope">
-            <span v-if="scope.row.reportType!=3" class="spanNum">{{ scope.row.doubleWeekCommitRate }} </span>
-            <div v-if="scope.row.reportType==3&&scope.row.doubleWeekCommitRate!=null">
-              <span v-if="scope.row.doubleWeekCommitRate!='-'" class="linkSpan" @click="linKReportHistory(scope.row,3)">{{ scope.row.doubleWeekCommitRate }}</span>
-              <span v-if="scope.row.doubleWeekCommitRate=='-'" style="text-align: center;display: block">{{ scope.row.doubleWeekCommitRate }}</span>
+            <span v-if="scope.row.reportType != 3" class="spanNum"
+              >{{ scope.row.doubleWeekCommitRate }}
+            </span>
+            <div v-if="scope.row.reportType == 3 && scope.row.doubleWeekCommitRate != null">
+              <span
+                v-if="scope.row.doubleWeekCommitRate != '-'"
+                class="linkSpan"
+                @click="linKReportHistory(scope.row, 3)"
+                >{{ scope.row.doubleWeekCommitRate }}</span
+              >
+              <span
+                v-if="scope.row.doubleWeekCommitRate == '-'"
+                style="text-align: center; display: block"
+                >{{ scope.row.doubleWeekCommitRate }}</span
+              >
             </div>
           </template>
         </el-table-column>
@@ -54,19 +81,41 @@
       <el-table-column label="周报" width="46">
         <el-table-column label="提交率%" prop="address" width="46">
           <template slot-scope="scope">
-            <span v-if="scope.row.reportType!=2" class="spanNum">{{ scope.row.weekCommitRate }} </span>
-            <div v-if="scope.row.reportType==2&&scope.row.weekCommitRate!=null">
-              <span v-if="scope.row.weekCommitRate!='-'" class="linkSpan" @click="linKReportHistory(scope.row,2)">{{ scope.row.weekCommitRate }}</span>
-              <span v-if="scope.row.weekCommitRate=='-'" style="text-align: right;display: block">{{ scope.row.weekCommitRate }}</span>
+            <span v-if="scope.row.reportType != 2" class="spanNum"
+              >{{ scope.row.weekCommitRate }}
+            </span>
+            <div v-if="scope.row.reportType == 2 && scope.row.weekCommitRate != null">
+              <span
+                v-if="scope.row.weekCommitRate != '-'"
+                class="linkSpan"
+                @click="linKReportHistory(scope.row, 2)"
+                >{{ scope.row.weekCommitRate }}</span
+              >
+              <span
+                v-if="scope.row.weekCommitRate == '-'"
+                style="text-align: right; display: block"
+                >{{ scope.row.weekCommitRate }}</span
+              >
             </div>
           </template>
         </el-table-column>
         <el-table-column label="审批率%" prop="weekApprovalRate" width="46">
           <template slot-scope="scope">
-            <span v-if="scope.row.reportType!=2" class="spanNum">{{ scope.row.weekApprovalRate }} </span>
-            <div v-if="scope.row.reportType==2&&scope.row.weekApprovalRate!==null">
-              <span v-if="scope.row.weekApprovalRate!='-'" class="linkSpan" @click="linKReportHistory(scope.row,2)">{{ scope.row.weekApprovalRate }}</span>
-              <span v-if="scope.row.weekApprovalRate=='-'" style="text-align: right;display: block">{{ scope.row.weekApprovalRate }}</span>
+            <span v-if="scope.row.reportType != 2" class="spanNum"
+              >{{ scope.row.weekApprovalRate }}
+            </span>
+            <div v-if="scope.row.reportType == 2 && scope.row.weekApprovalRate !== null">
+              <span
+                v-if="scope.row.weekApprovalRate != '-'"
+                class="linkSpan"
+                @click="linKReportHistory(scope.row, 2)"
+                >{{ scope.row.weekApprovalRate }}</span
+              >
+              <span
+                v-if="scope.row.weekApprovalRate == '-'"
+                style="text-align: right; display: block"
+                >{{ scope.row.weekApprovalRate }}</span
+              >
             </div>
           </template>
         </el-table-column>
@@ -74,19 +123,41 @@
       <el-table-column label="日报" width="46">
         <el-table-column label="提交率%" prop="address" width="46">
           <template slot-scope="scope">
-            <span v-if="scope.row.reportType!=1" class="spanNum">{{ scope.row.dayCommitRate }} </span>
-            <div v-if="scope.row.reportType==1&&scope.row.dayCommitRate!=null">
-              <span v-if="scope.row.dayCommitRate!='-'" class="linkSpan" @click="linKReportHistory(scope.row,1)">{{ scope.row.dayCommitRate }}</span>
-              <span v-if="scope.row.dayCommitRate=='-'" style="text-align: right;display: block">{{ scope.row.dayCommitRate }}</span>
+            <span v-if="scope.row.reportType != 1" class="spanNum"
+              >{{ scope.row.dayCommitRate }}
+            </span>
+            <div v-if="scope.row.reportType == 1 && scope.row.dayCommitRate != null">
+              <span
+                v-if="scope.row.dayCommitRate != '-'"
+                class="linkSpan"
+                @click="linKReportHistory(scope.row, 1)"
+                >{{ scope.row.dayCommitRate }}</span
+              >
+              <span
+                v-if="scope.row.dayCommitRate == '-'"
+                style="text-align: right; display: block"
+                >{{ scope.row.dayCommitRate }}</span
+              >
             </div>
           </template>
         </el-table-column>
         <el-table-column label="审批率%" prop="address" width="46">
           <template slot-scope="scope">
-            <span v-if="scope.row.reportType!=1" class="spanNum">{{ scope.row.dayApprovalRate }} </span>
-            <div v-if="scope.row.reportType==1&&scope.row.dayApprovalRate!=null">
-              <span v-if="scope.row.dayApprovalRate!='-'" class="linkSpan" @click="linKReportHistory(scope.row,1)">{{ scope.row.dayApprovalRate }}</span>
-              <span v-if="scope.row.dayApprovalRate=='-'" style="text-align: right;display: block">{{ scope.row.dayApprovalRate }}</span>
+            <span v-if="scope.row.reportType != 1" class="spanNum"
+              >{{ scope.row.dayApprovalRate }}
+            </span>
+            <div v-if="scope.row.reportType == 1 && scope.row.dayApprovalRate != null">
+              <span
+                v-if="scope.row.dayApprovalRate != '-'"
+                class="linkSpan"
+                @click="linKReportHistory(scope.row, 1)"
+                >{{ scope.row.dayApprovalRate }}</span
+              >
+              <span
+                v-if="scope.row.dayApprovalRate == '-'"
+                style="text-align: right; display: block"
+                >{{ scope.row.dayApprovalRate }}</span
+              >
             </div>
           </template>
         </el-table-column>
@@ -95,69 +166,63 @@
 
     <van-popup v-model="RegionShow" capture position="bottom">
       <van-picker
-          :columns="companyList"
-          show-toolbar
-          value-key="deptName"
-          @cancel="RegionShow = false"
-          @confirm="onregionConfirm"
-      />
+        :columns="companyList"
+        show-toolbar
+        value-key="deptName"
+        @cancel="RegionShow = false"
+        @confirm="onregionConfirm" />
     </van-popup>
     <van-popup v-model="SalesRegionShow" capture position="bottom">
       <van-picker
-          :columns="regionList"
-          show-toolbar
-          value-key="deptName"
-          @cancel="SalesRegionShow = false"
-          @confirm="onSalesRegionConfirm"
-      />
+        :columns="regionList"
+        show-toolbar
+        value-key="deptName"
+        @cancel="SalesRegionShow = false"
+        @confirm="onSalesRegionConfirm" />
     </van-popup>
     <van-popup v-model="SalesDepartmentShow" capture position="bottom">
       <van-picker
-          :columns="deptList"
-          show-toolbar
-          value-key="deptName"
-          @cancel="SalesDepartmentShow = false"
-          @confirm="onSalesDepartmentConfirm"
-      />
+        :columns="deptList"
+        show-toolbar
+        value-key="deptName"
+        @cancel="SalesDepartmentShow = false"
+        @confirm="onSalesDepartmentConfirm" />
     </van-popup>
     <van-popup v-model="StaffShow" capture position="bottom">
       <van-picker
-          :columns="userList"
-          show-toolbar
-          value-key="nickName"
-          @cancel="StaffShow = false"
-          @confirm="onStaffConfirm"
-      />
+        :columns="userList"
+        show-toolbar
+        value-key="nickName"
+        @cancel="StaffShow = false"
+        @confirm="onStaffConfirm" />
     </van-popup>
 
     <van-popup v-model="StartTimeShow" capture position="bottom">
       <van-datetime-picker
-          v-model="strtcurrentDate"
-          :max-date="strtmaxDate"
-          :min-date="strtminDate"
-          title="选择查找开始时间"
-          type="date"
-          @cancel="StartTimeShow = false"
-          @confirm="onStartTimeConfirm"
-      />
+        v-model="strtcurrentDate"
+        :max-date="strtmaxDate"
+        :min-date="strtminDate"
+        title="选择查找开始时间"
+        type="date"
+        @cancel="StartTimeShow = false"
+        @confirm="onStartTimeConfirm" />
     </van-popup>
     <van-popup v-model="EndTimeShow" capture position="bottom">
       <van-datetime-picker
-          v-model="endcurrentDate"
-          :max-date="endmaxDate"
-          :min-date="endminDate"
-          title="选择查找结束时间"
-          type="date"
-          @cancel="EndTimeShow = false"
-          @confirm="onEndTimeConfirm"
-      />
+        v-model="endcurrentDate"
+        :max-date="endmaxDate"
+        :min-date="endminDate"
+        title="选择查找结束时间"
+        type="date"
+        @cancel="EndTimeShow = false"
+        @confirm="onEndTimeConfirm" />
     </van-popup>
   </div>
 </template>
 <script>
-import request from '@/utils/request'
-import {queryRates, getDeptInfo} from "@/api/index";
-import timeico from "@/assets/Icon/datatims.png";
+import request from '@/utils/request';
+import { queryRates, getDeptInfo } from '@/api/index';
+import timeico from '@/assets/Icon/datatims.png';
 
 export default {
   data() {
@@ -169,87 +234,89 @@ export default {
       StaffShow: false,
       StartTimeShow: false,
       EndTimeShow: false,
-      PhotoTypeList: [{text: "009", value: "09"}],
+      PhotoTypeList: [{ text: '009', value: '09' }],
       strtminDate: new Date(2022, 0, 1),
       endminDate: new Date(2022, 0, 1),
       strtmaxDate: new Date(),
       endmaxDate: new Date(),
       strtcurrentDate: new Date(),
       endcurrentDate: new Date(),
-      companyName: "全部",
-      deptName: "全部",
-      regionName: "全部",
-      userName: "全部",
-      companyCode: "",
-      deptCode: "",
-      regionCode: "",
-      userCode: "",
+      companyName: '全部',
+      deptName: '全部',
+      regionName: '全部',
+      userName: '全部',
+      companyCode: '',
+      deptCode: '',
+      regionCode: '',
+      userCode: '',
       companyList: [],
       deptList: [],
       regionList: [],
       userList: [],
       deptForm: {
-        type: "",
-        parentId: ""
+        type: '',
+        parentId: '',
       },
       list: [],
       tableList: [],
       seacherFormload: {
-        companyId: "",
-        regionId: "",
-        parentId: "",
-        startTime: "",
-        endTime: ""
+        companyId: '',
+        regionId: '',
+        parentId: '',
+        startTime: '',
+        endTime: '',
       },
 
       seacherForm: {
-        companyId: "",
-        regionId: "",
-        parentId: "",
-        startTime: "",
-        endTime: ""
-      }
-    }
+        companyId: '',
+        regionId: '',
+        parentId: '',
+        startTime: '',
+        endTime: '',
+      },
+    };
   },
   created() {
-    this.seacherForm.startTime = this.parseTime(new Date(), '{y}-{m}-{d}')
-    this.seacherFormload.startTime = this.parseTime(new Date(), '{y}-{m}-{d}')
-    this.strtcurrentDate = new Date(this.parseTime(new Date(), '{y}-{m}-{d}'))
-    this.seacherForm.endTime = this.parseTime(new Date(), '{y}-{m}-{d}') + ""
-    this.seacherFormload.endTime = this.parseTime(new Date(), '{y}-{m}-{d}') + ""
-    this.endminDate = new Date(this.GetPreMonthDay(this.parseTime(new Date(), '{y}-{m}-{d}'), 2))
-    this.powerGrade = localStorage.getItem("powerGrade")
-    this.getDeptInfo("dept")
+    this.seacherForm.startTime = this.parseTime(new Date(), '{y}-{m}-{d}');
+    this.seacherFormload.startTime = this.parseTime(new Date(), '{y}-{m}-{d}');
+    this.strtcurrentDate = new Date(this.parseTime(new Date(), '{y}-{m}-{d}'));
+    this.seacherForm.endTime = this.parseTime(new Date(), '{y}-{m}-{d}') + '';
+    this.seacherFormload.endTime = this.parseTime(new Date(), '{y}-{m}-{d}') + '';
+    this.endminDate = new Date(this.GetPreMonthDay(this.parseTime(new Date(), '{y}-{m}-{d}'), 2));
+    this.powerGrade = localStorage.getItem('powerGrade');
+    this.getDeptInfo('dept');
     if (this.powerGrade > 3) {
       setTimeout(() => {
-        this.getDeptInfo("dept", 1)
-      }, 1000)
+        this.getDeptInfo('dept', 1);
+      }, 1000);
     }
   },
   watch: {
     $route(to, from) {
-      if (to.path == "/reportingRate" && from.path == "/My/index") {
-        this.seacherForm.startTime = this.parseTime(new Date(), '{y}-{m}-{d}')
-        this.seacherFormload.startTime = this.parseTime(new Date(), '{y}-{m}-{d}')
-        this.strtcurrentDate = new Date(this.parseTime(new Date(), '{y}-{m}-{d}'))
-        this.seacherForm.endTime = this.parseTime(new Date(), '{y}-{m}-{d}') + ""
-        this.seacherFormload.endTime = this.parseTime(new Date(), '{y}-{m}-{d}') + ""
-        this.endminDate = new Date(this.GetPreMonthDay(this.parseTime(new Date(), '{y}-{m}-{d}'), 2))
-        this.deptCode = "";
-        this.userCode = "";
-        this.regionCode = ""
-        this.seacherForm.parentId = ""
-        this.seacherFormload.parentId = ""
-        this.regionName = "全部"
-        this.powerGrade = localStorage.getItem("powerGrade")
-        this.getDeptInfo("dept")
+      if (to.path == '/reportingRate' && from.path == '/My/index') {
+        this.seacherForm.startTime = this.parseTime(new Date(), '{y}-{m}-{d}');
+        this.seacherFormload.startTime = this.parseTime(new Date(), '{y}-{m}-{d}');
+        this.strtcurrentDate = new Date(this.parseTime(new Date(), '{y}-{m}-{d}'));
+        this.seacherForm.endTime = this.parseTime(new Date(), '{y}-{m}-{d}') + '';
+        this.seacherFormload.endTime = this.parseTime(new Date(), '{y}-{m}-{d}') + '';
+        this.endminDate = new Date(
+          this.GetPreMonthDay(this.parseTime(new Date(), '{y}-{m}-{d}'), 2)
+        );
+        this.deptCode = '';
+        this.userCode = '';
+        this.regionCode = '';
+        this.seacherForm.parentId = '';
+        this.seacherFormload.parentId = '';
+        this.regionName = '全部';
+        this.powerGrade = localStorage.getItem('powerGrade');
+        this.getDeptInfo('dept');
         if (this.powerGrade > 3) {
           setTimeout(() => {
-            this.getDeptInfo("dept", 1)
-          }, 1000)
+            this.getDeptInfo('dept', 1);
+          }, 1000);
         }
       }
-    }
+    },
   },
   methods: {
     GetPreMonthDay(date, monthNum, type) {
@@ -275,13 +342,13 @@ export default {
       if (month2 < 10) {
         month2 = '0' + month2;
       }
-      var t2 = ""
+      var t2 = '';
       if (monthNum > 0) {
         t2 = year2 + '-' + month2 + '-01';
       } else {
-        if (type == "end") {
-          var Months = new Date().getMonth() + 1
-          var days111 = new Date().getDate()
+        if (type == 'end') {
+          var Months = new Date().getMonth() + 1;
+          var days111 = new Date().getDate();
           if (Months < 10) {
             Months = '0' + Months;
           }
@@ -291,7 +358,7 @@ export default {
           if (parseInt(month2) >= new Date().getMonth() + 1) {
             t2 = year2 + '-' + Months + '-' + days111;
           } else {
-            var daysd = this.getMonthDays(year2, month2)
+            var daysd = this.getMonthDays(year2, month2);
             t2 = year2 + '-' + month2 + '-' + daysd;
           }
         } else {
@@ -302,61 +369,61 @@ export default {
     },
     getMonthDays(year, month) {
       var stratDate = new Date(year, month - 1, 1),
-          endData = new Date(year, month, 1);
+        endData = new Date(year, month, 1);
       var days = (endData - stratDate) / (1000 * 60 * 60 * 24);
       return days;
     },
     getDeptInfo(type, grade) {
-      this.deptForm.type = type
-      if (type == "dept") {
-        if (grade == "1") {
-          this.deptForm.parentId = this.companyCode
-        } else if (grade == "2") {
-          this.deptForm.parentId = this.regionCode
+      this.deptForm.type = type;
+      if (type == 'dept') {
+        if (grade == '1') {
+          this.deptForm.parentId = this.companyCode;
+        } else if (grade == '2') {
+          this.deptForm.parentId = this.regionCode;
         } else {
-          this.deptForm.type = ""
-          this.deptForm.parentId = ""
+          this.deptForm.type = '';
+          this.deptForm.parentId = '';
         }
-      } else if (type == "user") {
-        this.deptForm.parentId = this.deptCode
+      } else if (type == 'user') {
+        this.deptForm.parentId = this.deptCode;
       }
-      getDeptInfo(this.deptForm).then(res => {
-        if (type == "dept") {
-          if (grade == "1") {
+      getDeptInfo(this.deptForm).then((res) => {
+        if (type == 'dept') {
+          if (grade == '1') {
             if (res.data.region != null) {
-              this.regionList = [{deptName: "全部", deptId: ""}].concat(res.data.region)
+              this.regionList = [{ deptName: '全部', deptId: '' }].concat(res.data.region);
             }
-          } else if (grade == "2") {
+          } else if (grade == '2') {
             if (res.data.dept != null) {
-              this.deptList = [{deptName: "全部", deptId: ""}].concat(res.data.dept)
+              this.deptList = [{ deptName: '全部', deptId: '' }].concat(res.data.dept);
             }
           } else {
-            this.companyList = res.data.company
-            this.companyName = res.data.company[0].deptName
-            this.companyCode = res.data.company[0].deptId
+            this.companyList = res.data.company;
+            this.companyName = res.data.company[0].deptName;
+            this.companyCode = res.data.company[0].deptId;
             if (res.data.region != null) {
-              this.regionName = res.data.region[0].deptName
-              this.regionCode = res.data.region[0].deptId
-              this.regionList = res.data.region
+              this.regionName = res.data.region[0].deptName;
+              this.regionCode = res.data.region[0].deptId;
+              this.regionList = res.data.region;
             }
             if (res.data.user != null) {
-              this.userList = res.data.user
-              this.userCode = ""
+              this.userList = res.data.user;
+              this.userCode = '';
             }
-            this.queryRates()
+            this.queryRates();
           }
-        } else if (type == "user") {
+        } else if (type == 'user') {
           if (res.data.user != null) {
-            this.userList = [{nickName: "全部", userId: ""}].concat(res.data.user)
+            this.userList = [{ nickName: '全部', userId: '' }].concat(res.data.user);
           }
         }
-      })
+      });
     },
     dailyFn() {
-      this.$router.push("/dailyDetails")
+      this.$router.push('/dailyDetails');
     },
     onClickLeft() {
-      this.$router.go(-1)
+      this.$router.go(-1);
     },
     regionClick() {
       this.RegionShow = true;
@@ -377,52 +444,52 @@ export default {
       this.EndTimeShow = true;
     },
     onregionConfirm(val) {
-      this.tableList = []
+      this.tableList = [];
       this.RegionShow = false;
       this.companyName = val.deptName;
       this.companyCode = val.deptId;
-      this.regionName = "全部";
-      this.regionCode = "";
-      this.deptName = "全部";
-      this.deptCode = "";
-      this.userName = "全部";
-      this.userCode = "";
-      this.seacherForm.parentId = ""
-      this.seacherFormload.parentId = ""
-      this.getDeptInfo("dept", 1)
-      this.queryRates()
+      this.regionName = '全部';
+      this.regionCode = '';
+      this.deptName = '全部';
+      this.deptCode = '';
+      this.userName = '全部';
+      this.userCode = '';
+      this.seacherForm.parentId = '';
+      this.seacherFormload.parentId = '';
+      this.getDeptInfo('dept', 1);
+      this.queryRates();
     },
     onSalesRegionConfirm(val) {
-      this.tableList = []
+      this.tableList = [];
       this.SalesRegionShow = false;
       this.regionName = val.deptName;
-      this.seacherForm.parentId = ""
-      this.seacherFormload.parentId = ""
+      this.seacherForm.parentId = '';
+      this.seacherFormload.parentId = '';
 
-      if (val.deptId != "") {
+      if (val.deptId != '') {
         this.regionCode = val.deptId;
-        this.getDeptInfo("dept", 2)
-        this.deptName = "全部";
-        this.deptCode = ""
+        this.getDeptInfo('dept', 2);
+        this.deptName = '全部';
+        this.deptCode = '';
       } else {
-        this.regionCode = ""
-        this.deptName = "全部";
-        this.deptCode = "";
-        this.userName = "全部";
-        this.userCode = "";
+        this.regionCode = '';
+        this.deptName = '全部';
+        this.deptCode = '';
+        this.userName = '全部';
+        this.userCode = '';
       }
-      this.queryRates()
+      this.queryRates();
     },
     onSalesDepartmentConfirm(val) {
-      this.tableList = []
+      this.tableList = [];
       this.SalesDepartmentShow = false;
       this.deptName = val.deptName;
-      if (val.deptId != "") {
+      if (val.deptId != '') {
         this.deptCode = val.deptId;
-        this.getDeptInfo("user")
+        this.getDeptInfo('user');
       } else {
-        this.userName = "全部";
-        this.userCode = "";
+        this.userName = '全部';
+        this.userCode = '';
       }
     },
     onStaffConfirm(val) {
@@ -431,146 +498,159 @@ export default {
       this.userCode = val.userId;
     },
     onStartTimeConfirm(val) {
-      this.seacherForm.startTime = this.parseTime(new Date(val), '{y}-{m}-{d}') + ""
-      this.seacherForm.parentId = ""
-      this.seacherFormload.startTime = this.parseTime(new Date(val), '{y}-{m}-{d}') + ""
-      this.seacherFormload.parentId = ""
-      this.tableList = []
+      this.seacherForm.startTime = this.parseTime(new Date(val), '{y}-{m}-{d}') + '';
+      this.seacherForm.parentId = '';
+      this.seacherFormload.startTime = this.parseTime(new Date(val), '{y}-{m}-{d}') + '';
+      this.seacherFormload.parentId = '';
+      this.tableList = [];
       this.StartTimeShow = false;
-      if(new Date(val).getTime()<new Date(this.GetPreMonthDay(this.formData.startTime,-2,"end")).getTime()){
-        this.endminDate = new Date(this.GetPreMonthDay(this.formData.startTime,-2,"end"))
-        this.endmaxDate=new Date(this.GetPreMonthDay(this.formData.startTime,-2,"end"))
-      }else{
-        this.endminDate = new Date(val)
-        this.endmaxDate=new Date(this.GetPreMonthDay(this.formData.startTime,-2,"end"))
+      if (
+        new Date(val).getTime() <
+        new Date(this.GetPreMonthDay(this.formData.startTime, -2, 'end')).getTime()
+      ) {
+        this.endminDate = new Date(this.GetPreMonthDay(this.formData.startTime, -2, 'end'));
+        this.endmaxDate = new Date(this.GetPreMonthDay(this.formData.startTime, -2, 'end'));
+      } else {
+        this.endminDate = new Date(val);
+        this.endmaxDate = new Date(this.GetPreMonthDay(this.formData.startTime, -2, 'end'));
       }
-      if ((new Date(this.seacherForm.startTime).getTime() > new Date(this.seacherForm.endTime).getTime()) || (new Date(this.endmaxDate).getTime() < new Date(this.seacherForm.endTime).getTime())) {
-        this.seacherForm.endTime = this.parseTime(new Date(val), '{y}-{m}-{d}') + ""
-        this.seacherFormload.endTime = this.parseTime(new Date(val), '{y}-{m}-{d}') + ""
+      if (
+        new Date(this.seacherForm.startTime).getTime() >
+          new Date(this.seacherForm.endTime).getTime() ||
+        new Date(this.endmaxDate).getTime() < new Date(this.seacherForm.endTime).getTime()
+      ) {
+        this.seacherForm.endTime = this.parseTime(new Date(val), '{y}-{m}-{d}') + '';
+        this.seacherFormload.endTime = this.parseTime(new Date(val), '{y}-{m}-{d}') + '';
 
-        this.endcurrentDate = this.GetPreMonthDay(this.seacherForm.startTime, -2)
+        this.endcurrentDate = this.GetPreMonthDay(this.seacherForm.startTime, -2);
       }
-      this.queryRates()
+      this.queryRates();
     },
     onEndTimeConfirm(val) {
-      this.tableList = []
-      this.seacherForm.endTime = this.parseTime(new Date(val), '{y}-{m}-{d}')
-      this.seacherForm.parentId = ""
-      this.seacherFormload.endTime = this.parseTime(new Date(val), '{y}-{m}-{d}')
-      this.seacherFormload.parentId = ""
-      this.strtmaxDate = new Date(val)
-      if (new Date(this.seacherForm.startTime).getTime() > new Date(this.seacherForm.endTime).getTime()) {
-        this.seacherForm.startTime = this.seacherForm.endTime
-        this.seacherFormload.startTime = this.seacherForm.endTime
-
+      this.tableList = [];
+      this.seacherForm.endTime = this.parseTime(new Date(val), '{y}-{m}-{d}');
+      this.seacherForm.parentId = '';
+      this.seacherFormload.endTime = this.parseTime(new Date(val), '{y}-{m}-{d}');
+      this.seacherFormload.parentId = '';
+      this.strtmaxDate = new Date(val);
+      if (
+        new Date(this.seacherForm.startTime).getTime() >
+        new Date(this.seacherForm.endTime).getTime()
+      ) {
+        this.seacherForm.startTime = this.seacherForm.endTime;
+        this.seacherFormload.startTime = this.seacherForm.endTime;
       }
-      this.queryRates()
+      this.queryRates();
       this.EndTimeShow = false;
     },
     queryRates() {
-      this.seacherForm.companyId = this.companyCode
-      this.seacherFormload.companyId = this.companyCode
-      this.seacherForm.regionId = this.regionCode
-      this.seacherFormload.regionId = this.regionCode
-      queryRates(this.seacherForm).then(res => {
+      this.toastLoading(0, '加载中...', true);
+      this.seacherForm.companyId = this.companyCode;
+      this.seacherFormload.companyId = this.companyCode;
+      this.seacherForm.regionId = this.regionCode;
+      this.seacherFormload.regionId = this.regionCode;
+      queryRates(this.seacherForm).then((res) => {
         if (res.code == 200) {
           for (var i = 0; i < res.data.length; i++) {
             if (res.data[i].reportType > 1) {
-              res.data[i].hasChildren = true
+              res.data[i].hasChildren = true;
             }
           }
-          this.tableList = res.data
+          this.tableList = res.data;
         } else {
           this.$toast.fail('数据获取失败');
         }
-      })
+        this.toastLoading().clear();
+      });
     },
     linKReportHistory(row, type) {
       if (type == 1) {
-        var userId = ""
-        var userName = "全部"
-        if (row.userId == "null") {
-          userId = ""
-          userName = "全部"
+        var userId = '';
+        var userName = '全部';
+        if (row.userId == 'null') {
+          userId = '';
+          userName = '全部';
         } else {
-          userId = row.userId
-          userName = row.userName
+          userId = row.userId;
+          userName = row.userName;
         }
         this.$router.push({
-          path: "/subordinateHistoricalDaily",
+          path: '/subordinateHistoricalDaily',
           query: {
             companyCode: this.companyCode,
             companyName: this.companyName,
             regionCode: row.regionId,
             regionName: row.regionName,
             deptCode: row.deptId,
-            deptName: row.deptName + "销售部",
+            deptName: row.deptName + '销售部',
             userCode: userId,
             userName: userName,
             startTime: this.seacherForm.startTime,
-            endTime: this.seacherForm.endTime
-          }
-        })
+            endTime: this.seacherForm.endTime,
+          },
+        });
       } else if (type == 2) {
         this.$router.push({
-          path: "/subordinateHistoricalWeekly",
+          path: '/subordinateHistoricalWeekly',
           query: {
             companyCode: this.companyCode,
             companyName: this.companyName,
             regionCode: row.regionId,
             regionName: row.regionName,
             deptCode: row.deptId,
-            deptName: row.deptName + "销售部",
+            deptName: row.deptName + '销售部',
             startTime: this.seacherForm.startTime,
-            endTime: this.seacherForm.endTime
-          }
-        })
+            endTime: this.seacherForm.endTime,
+          },
+        });
       } else {
         this.$router.push({
-          path: "/doubleWeeklyHistorical",
+          path: '/doubleWeeklyHistorical',
           query: {
             companyCode: this.companyCode,
             companyName: this.companyName,
             regionCode: row.deptId,
-            regionName: row.deptName + "销售大区",
+            regionName: row.deptName + '销售大区',
             startTime: this.seacherForm.startTime,
-            endTime: this.seacherForm.endTime
-          }
-        })
+            endTime: this.seacherForm.endTime,
+          },
+        });
       }
     },
     load(tree, treeNode, resolve) {
+      this.toastLoading(0, '加载中...', true);
       if (tree.reportType == 2) {
-        this.seacherFormload.parentId = tree.deptId
+        this.seacherFormload.parentId = tree.deptId;
       } else if (tree.reportType == 3) {
         // this.regionCode=tree.deptId
         // this.regionName=tree.deptName+"销售大区"
-        this.seacherFormload.parentId = ""
-        this.seacherFormload.regionId = tree.deptId
+        this.seacherFormload.parentId = '';
+        this.seacherFormload.regionId = tree.deptId;
       } else {
-        this.seacherFormload.parentId = ""
+        this.seacherFormload.parentId = '';
       }
       request({
         url: 'mobile/reportMobile/queryRates',
         method: 'get',
-        params: this.seacherFormload
-      }).then(res => {
+        params: this.seacherFormload,
+      }).then((res) => {
         if (res.code == 200) {
           for (var i = 0; i < res.data.length; i++) {
             if (res.data[i].reportType > 1) {
-              res.data[i].hasChildren = true
+              res.data[i].hasChildren = true;
             } else {
-              res.data[i].hasChildren = false
+              res.data[i].hasChildren = false;
             }
           }
-          resolve(res.data)
+          resolve(res.data);
         } else {
           this.$toast.fail('数据获取失败');
         }
-      })
-    }
-  }
-}
+        this.toastLoading().clear();
+      });
+    },
+  },
+};
 </script>
 <style>
 body {
@@ -648,7 +728,7 @@ body {
   background-color: white;
 }
 .contentpd16 .van-cell {
-  background-color: #EBF4FF;
+  background-color: #ebf4ff;
   margin: 8px 0;
   border-radius: 5px;
   padding: 4px 16px;