质量流程&研发效率数据汇总饼图:esLint修复

src/views/monthlyReport/childrenPage/editReport/components/OverallOverviewOfTheClient/box.vue

@@ -5,7 +5,7 @@
       <span class="report-title-text">{{ title }}</span>
     </div>
     <div>
-      <el-tabs :value="tabsActive" @tab-click="tabClick" v-if="pageData">
+      <el-tabs v-if="pageData" :value="tabsActive" @tab-click="tabClick">
         <el-tab-pane
           v-for="item in pageData"
           :key="item.clientType"

src/views/monthlyReport/childrenPage/editReport/components/OverallOverviewOfTheClient/onlineQuestion.vue

@@ -5,7 +5,7 @@
       <div class="echarts-wrapper">
         <div class="pie-wrapper">
           <div class="total-wrapper">
-            总数：<span class="total" @click.stop="reportBizName = ''">{{tabData.total}}</span>
+            总数：<span class="total" @click.stop="reportBizName = ''">{{ tabData.total }}</span>
           </div>
           <div
             id="a_tylo_oo_2ppmn_ayghs"

src/views/monthlyReport/childrenPage/editReport/components/OverallOverviewOfTheClient/qualityProcess.vue

@@ -1,34 +1,62 @@
 <template>
   <div>
-    <boxCom title="质量流程&研发效率" @change="tabChange" :page-data="pageData">
+    <boxCom title="质量流程&研发效率" :page-data="pageData" @change="tabChange">
       <!-- <div>质量流程&研发效率：{{ active }}</div> -->
-      <div class="echarts-wrapper" v-if="tabData">
+      <div v-if="tabData" class="echarts-wrapper">
         <div class="pie-wrapper">
           <div class="total-wrapper">
-            总数：<span class="total" @click.stop="reportBizName = ''">{{tabData.total}}</span>
+            总数：<span class="total" @click.stop="reportBizName = ''">{{
+              tabData.total
+            }}</span>
           </div>
           <div
             id="a_oiew_mkds_ppmn_aygs"
             class="pir"
             style="width: 100%; height: 130px"
           />
-          <div v-if="tabData">本月&nbsp;&nbsp;{{active}}&nbsp;&nbsp;类：<span v-for="(item, index) in tabData.qualityProcessAndRdEfficiencyCopywriters" :key="index">
-            <span>{{item.type}}</span><span :class="{'fontWeight': true,'red': item.total > 0}">{{item.total}}次</span><span>{{index < tabData.qualityProcessAndRdEfficiencyCopywriters.length - 1 ? '，' : '。'}}</span>
-          </span> </div>
+          <div v-if="tabData">
+            本月&nbsp;&nbsp;{{ active }}&nbsp;&nbsp;类：
+            <span v-for="(item, itemIndex ) in tabData.qualityProcessAndRdEfficiencyCopywriters" :key="itemIndex">
+              <span>{{ item.type }}</span>
+              <span :class="{ fontWeight: true, red: item.total > 0 }">{{ item.total }}次</span>
+              <span>{{ tabData.qualityProcessAndRdEfficiencyCopywriters.length - 1 > itemIndex ? '，': '。' }}</span>
+            </span>
+          </div>
         </div>
         <div class="detail-wrapper">
-          <div v-for="item in tabData.qualityProcessAndRdEfficiencyCopywriters.filter((elm) =>
-              reportBizName ? elm.name === reportBizName : true
-            )" style="margin-bottom: 20px">
-            <div class="fontWeight" style="margin-bottom: 10px">{{item.type}}数据</div>
-            <div>本月{{item.type}}{{item.total}}次</div>
-            <div v-for="elm in item.subClientDetails" style="margin-bottom: 10px">
+          <div
+            v-for="(
+              item, itemIndex
+            ) in tabData.qualityProcessAndRdEfficiencyCopywriters.filter(
+              (elm) => (reportBizName ? elm.name === reportBizName : true)
+            )"
+            :key="itemIndex"
+            style="margin-bottom: 20px"
+          >
+            <div class="fontWeight" style="margin-bottom: 10px">
+              {{ item.type }}数据
+            </div>
+            <div>本月{{ item.type }}{{ item.total }}次</div>
+            <div
+              v-for="(elm, elmIndex) in item.subClientDetails"
+              :key="elmIndex"
+              style="margin-bottom: 10px"
+            >
               <div class="fontWeight">
-                {{elm.subClientType}}{{item.type}}{{elm.total}}次
+                {{ elm.subClientType }}{{ item.type }}{{ elm.total }}次
               </div>
-              <div v-for="(subItem, subIndex) in elm.details" style="margin-bottom: 5px">
+              <div
+                v-for="(subItem, subindex) in elm.details"
+                :key="'sub_' + subindex"
+                style="margin-bottom: 5px"
+              >
                 <div v-if="subItem.name">
-                  <span class="fontWeight">{{subIndex + 1}}、</span>{{subItem.name}}<span v-if="subItem.description">（{{subItem.description}}）</span>
+                  <span class="fontWeight">{{ subindex + 1 }}、</span
+                  >{{ subItem.name
+                  }}<span
+v-if="subItem.description"
+                    >（{{ subItem.description }}）</span
+                  >
                 </div>
               </div>
             </div>
@@ -41,7 +69,7 @@
 <script type="text/javascript">
 import boxCom from './box'
 import echarts from 'echarts'
-import {getQualityProcessAndRdEfficiencyPieData} from '@/api/qualityMonthlyReport/edit'
+import { getQualityProcessAndRdEfficiencyPieData } from '@/api/qualityMonthlyReport/edit'
 
 export default {
   name: 'OnlineQuestion',
@@ -61,34 +89,38 @@ export default {
       pieData: []
     }
   },
-  mounted(){
-    this.init();
+  mounted() {
+    this.init()
   },
   methods: {
-   async init(){
-      const res = await getQualityProcessAndRdEfficiencyPieData(this.$route.query.reportId)
+    async init() {
+      const res = await getQualityProcessAndRdEfficiencyPieData(
+        this.$route.query.reportId
+      )
       this.pageData = res.data.map((elm) => {
         return {
           ...elm,
-          qualityProcessAndRdEfficiencyCopywriters: elm.qualityProcessAndRdEfficiencyCopywriters.map((item) => {
-            return {
-              ...item,
-              subReportDetails: item.subReportDetails.map(subItem => {
-                return {
-                  ...subItem,
-                  value: subItem.total,
-                  name: subItem.subReportName
-                }
-              }),
-              value: item.total,
-              name: item.type
+          qualityProcessAndRdEfficiencyCopywriters: elm.qualityProcessAndRdEfficiencyCopywriters.map(
+            (item) => {
+              return {
+                ...item,
+                subReportDetails: item.subReportDetails.map((subItem) => {
+                  return {
+                    ...subItem,
+                    value: subItem.total,
+                    name: subItem.subReportName
+                  }
+                }),
+                value: item.total,
+                name: item.type
+              }
             }
-          })
+          )
         }
       })
       this.active = this.pageData[0].clientType
       this.tabData = this.pageData[0]
-      console.log(this.tabData);
+      console.log(this.tabData)
       // this.subIndex = 0
       this.$nextTick(() => {
         this.echartsInit()
@@ -126,12 +158,12 @@ export default {
             radius: [0, '60%'],
             data: this.tabData.qualityProcessAndRdEfficiencyCopywriters,
             labelLine: {
-                show: false
+              show: false
             },
             label: {
-                position: 'inner',
-                fontSize: 10,
-                show: false
+              position: 'inner',
+              fontSize: 10,
+              show: false
             },
             emphasis: {
               itemStyle: {
@@ -169,29 +201,28 @@ export default {
         // console.log(params.data);
         // console.log();
         const list = this.tabData.qualityProcessAndRdEfficiencyCopywriters
-        console.log(list);
+        console.log(list)
         for (var i = list.length - 1; i >= 0; i--) {
-          if(list[i].name === params.data.name){
+          if (list[i].name === params.data.name) {
             this.reportBizName = params.data.name
-            console.log(params.data.name);
+            console.log(params.data.name)
             this.subIndex = i
             this.subReportDetails = list[i].subReportDetails
-//             this.myChart.setOption({...option,
-//               series:[
-// option.series
-//               ]})
+            //             this.myChart.setOption({...option,
+            //               series:[
+            // option.series
+            //               ]})
             this.option.series[1].data = this.subReportDetails
             this.myChart.setOption(this.option)
             this.$forceUpdate()
           }
         }
-
       })
     },
     tabChange(value) {
       this.active = value
       this.reportBizName = ''
-      console.log(this.myChart);
+      console.log(this.myChart)
 
       this.tabData = this.pageData.filter(
         (elm) => elm.clientType === this.active
@@ -210,7 +241,7 @@ export default {
     font-weight: 500;
   }
   .red {
-    color: red
+    color: red;
   }
   display: flex;
   color: #333;