From 290d8ae2624fad38dad594e7ab99c9a209ea2a80 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=86=8A=E4=B8=BD=E5=90=9B?= <664953382@qq.com>
Date: Fri, 11 Feb 2022 11:55:38 +0800
Subject: [PATCH] =?UTF-8?q?=E7=BB=8F=E8=90=A5=E7=AE=A1=E7=90=86=E4=BA=BF?=
 =?UTF-8?q?=E5=85=83=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/bigScreen/management/center.vue | 517 ++++++++++++----------
 1 file changed, 295 insertions(+), 222 deletions(-)

diff --git a/src/views/bigScreen/management/center.vue b/src/views/bigScreen/management/center.vue
index f812362..68cc914 100644
--- a/src/views/bigScreen/management/center.vue
+++ b/src/views/bigScreen/management/center.vue
@@ -3,48 +3,105 @@
     <center1>
       <div class="data">
         <div class="top_tab">
-          <bigScreenTabs slot="datePicker" v-model="index" :titleArr="['全年', '本月']"></bigScreenTabs>
+          <bigScreenTabs
+            slot="datePicker"
+            v-model="index"
+            :titleArr="['全年', '本月']"
+          ></bigScreenTabs>
         </div>
         <div class="data-item">
-          <div><img src="./icon1.png" alt="" /><span style="font-weight: bold">收入</span></div>
-          <div class="box"><i>{{resData.realIncome}}/</i><i class="num">{{resData.targetIncome}}</i><span class="num2">万</span></div>
+          <div>
+            <img src="./icon1.png" alt="" /><span style="font-weight: bold"
+              >收入</span
+            >
+          </div>
+          <div class="box">
+            <i>{{ handleMillion(resData.realIncome) }}/</i
+            ><i class="num">{{ handleMillion(resData.targetIncome) }}</i
+            ><span class="num2">亿元</span>
+          </div>
           <div style="width: 100%">
-            <progressBar :percentage="resData.realIncome/resData.targetIncome*100" />
+            <progressBar
+              :percentage="(resData.realIncome / resData.targetIncome) * 100"
+            />
           </div>
         </div>
         <div class="data-item">
-          <div><img src="./icon2.png" alt="" /><span style="font-weight: bold">利润</span></div>
-          <div class="box"><i>{{resData.realProfit}}/</i><i class="num">{{resData.targetProfit}}</i><span class="num2">万</span></div>
+          <div>
+            <img src="./icon2.png" alt="" /><span style="font-weight: bold"
+              >利润</span
+            >
+          </div>
+          <div class="box">
+            <i>{{ handleMillion(resData.realProfit) }}/</i
+            ><i class="num">{{ handleMillion(resData.targetProfit) }}</i
+            ><span class="num2">亿元</span>
+          </div>
           <div style="width: 100%">
-            <progressBar :percentage="resData.realProfit/resData.targetProfit*100" />
+            <progressBar
+              :percentage="(resData.realProfit / resData.targetProfit) * 100"
+            />
           </div>
         </div>
         <div class="data-item">
-          <div><img src="./icon3.png" alt="" /><span style="font-weight: bold">EVA</span></div>
-          <div class="box"><i>{{resData.realEva}}/</i><i class="num">{{resData.targetEva}}</i><span class="num2">万</span></div>
+          <div>
+            <img src="./icon3.png" alt="" /><span style="font-weight: bold"
+              >EVA</span
+            >
+          </div>
+          <div class="box">
+            <i>{{ handleMillion(resData.realEva) }}/</i
+            ><i class="num">{{ handleMillion(resData.targetEva) }}</i
+            ><span class="num2">亿元</span>
+          </div>
           <div style="width: 100%">
-            <progressBar :percentage="resData.realEva/resData.targetEva*100" />
+            <progressBar
+              :percentage="(resData.realEva / resData.targetEva) * 100"
+            />
           </div>
         </div>
         <div class="data-item" style="width: 34%">
-          <div><img src="./icon4.png" alt="" /><span style="font-weight: bold">两金</span></div>
+          <div>
+            <img src="./icon4.png" alt="" /><span style="font-weight: bold"
+              >两金</span
+            >
+          </div>
           <div style="display: flex">
             <div>
               <div class="box" style="margin-bottom: 0">
-                <i>{{resData.realCollection}}/</i><i class="num">{{resData.targetCollection}}</i><span class="num2">万</span>
+                <i>{{ handleMillion(resData.realCollection) }}/</i
+                ><i class="num">{{ handleMillion(resData.targetCollection) }}</i
+                ><span class="num2">亿元</span>
               </div>
-              <span style="font-size: 12px; position: relative; top: -6px">产成品</span>
+              <span style="font-size: 12px; position: relative; top: -6px"
+                >产成品</span
+              >
               <div style="display: flex">
-                <progressBar :percentage="resData.realCollection/resData.targetCollection*100" />
+                <progressBar
+                  :percentage="
+                    (resData.realCollection / resData.targetCollection) * 100
+                  "
+                />
               </div>
             </div>
             <div style="margin-left: 10px">
               <div class="box" style="margin-bottom: 0">
-                <i>{{resData.realFinishProduct}}/</i><i class="num">{{resData.targetFinishProduct}}</i><span class="num2">万</span>
+                <i>{{ handleMillion(resData.realFinishProduct) }}/</i
+                ><i class="num">{{
+                  handleMillion(resData.targetFinishProduct)
+                }}</i
+                ><span class="num2">亿元</span>
               </div>
-              <span style="font-size: 12px; position: relative; top: -6px">应收账款</span>
+              <span style="font-size: 12px; position: relative; top: -6px"
+                >应收账款</span
+              >
               <div style="display: flex">
-                <progressBar :percentage="resData.realFinishProduct/resData.targetFinishProduct*100" />
+                <progressBar
+                  :percentage="
+                    (resData.realFinishProduct / resData.targetFinishProduct) *
+                    100
+                  "
+                />
               </div>
             </div>
           </div>
@@ -52,10 +109,25 @@
       </div>
       <div class="center_box">
         <rocketTit>经营指标完成率</rocketTit>
-        <el-date-picker v-model="month" value-format="yyyy-MM" v-if="index2 == 0" type="month" size="mini" placeholder="选择月">
+        <el-date-picker
+          v-model="month"
+          value-format="yyyy-MM"
+          v-if="index2 == 0"
+          type="month"
+          size="mini"
+          placeholder="选择月"
+        >
         </el-date-picker>
-        <bigScreenTabs slot="datePicker" v-model="index2" :titleArr="['全年', '本月']"></bigScreenTabs>
-        <div style="height: 182px; width: 100%" ref="chart" v-if="index2 == 0"></div>
+        <bigScreenTabs
+          slot="datePicker"
+          v-model="index2"
+          :titleArr="['全年', '本月']"
+        ></bigScreenTabs>
+        <div
+          style="height: 182px; width: 100%"
+          ref="chart"
+          v-if="index2 == 0"
+        ></div>
         <div style="height: 182px; width: 100%" ref="chart4" v-else></div>
       </div>
       <div class="center_box">
@@ -74,30 +146,34 @@
 </template>
 
 <script>
-import center1 from './components/center1/index.vue'
-import rocketTit from '../components/rocketTit/index.vue'
-import bigScreenTabs from '../components/bigScreenTabs/index.vue'
-import progressBar from './../components/progress/index.vue'
-import colorList from '@/utils/colorPalette'
-import { blueColorList, greenColorList, yelloColorList } from '@/utils/gradualColor'
+import center1 from "./components/center1/index.vue";
+import rocketTit from "../components/rocketTit/index.vue";
+import bigScreenTabs from "../components/bigScreenTabs/index.vue";
+import progressBar from "./../components/progress/index.vue";
+import colorList from "@/utils/colorPalette";
+import {
+  blueColorList,
+  greenColorList,
+  yelloColorList,
+} from "@/utils/gradualColor";
 
-import echarts from 'echarts'
-require('echarts/theme/macarons') // echarts theme
-import resize from '../../dashboard/mixins/resize'
+import echarts from "echarts";
+require("echarts/theme/macarons"); // echarts theme
+import resize from "../../dashboard/mixins/resize";
 export default {
   mixins: [resize],
-  name: 'left1',
+  name: "left1",
   components: {
     center1,
     rocketTit,
     progressBar,
     bigScreenTabs,
   },
-  data () {
+  data() {
     return {
       index: 0,
       index2: 0,
-      month: '',
+      month: "",
       chart: null,
       chart2: null,
       chart3: null,
@@ -114,84 +190,84 @@ export default {
         targetIncome: 0,
         targetProfit: 0,
       },
-    }
+    };
   },
-  mounted () {
+  mounted() {
     this.$nextTick(() => {
-      this.initChart()
-      this.initChart2()
+      this.initChart();
+      this.initChart2();
       this.getData(1);
-    })
+    });
   },
-  beforeDestroy () { },
+  beforeDestroy() {},
   watch: {
-    month (newVal) {
-      this.initChart(newVal)
+    month(newVal) {
+      this.initChart(newVal);
     },
-    index (newVal, oldVal) {
+    index(newVal, oldVal) {
       if (newVal == 0) {
         this.getData(1);
       } else {
         this.getData(2);
       }
     },
-    index2 (newVal, oldVal) {
+    index2(newVal, oldVal) {
       if (newVal == 0) {
-        this.chart4.dispose()
-        this.chart4 = null
+        this.chart4.dispose();
+        this.chart4 = null;
         this.$nextTick(() => {
-          this.initChart()
-        })
+          this.initChart();
+        });
       } else {
-        this.chart.dispose()
-        this.chart = null
+        this.chart.dispose();
+        this.chart = null;
         this.$nextTick(() => {
-          this.initChart4()
-        })
+          this.initChart4();
+        });
       }
     },
   },
   methods: {
-    getData (type) {
+    getData(type) {
       this.request({
-        url: '/hx/operating/getFactoryOperateIndexPic',
-        method: 'get',
-        params: { type: type }
-      }).then(res => {
+        url: "/hx/operating/getFactoryOperateIndexPic",
+        method: "get",
+        params: { type: type },
+      }).then((res) => {
         if (200 == res.code && res.data) {
           this.resData = res.data;
         }
-      })
+      });
     },
-    initChart (month) {
+    initChart(month) {
       let params = { type: 2 };
       if (month) {
-        params['month'] = month
+        params["month"] = month;
       }
       if (this.chart) {
         this.chart.dispose();
         this.chart = null;
       }
       this.request({
-        url: '/hx/operating/getDeptOperateIndexPic',
-        method: 'get',
-        params: params
-      }).then(res => {
+        url: "/hx/operating/getDeptOperateIndexPic",
+        method: "get",
+        params: params,
+      }).then((res) => {
         if (200 == res.code) {
           let { list } = res.data;
-          this.chart = echarts.init(this.$refs.chart, 'macarons')
+          this.chart = echarts.init(this.$refs.chart, "macarons");
           this.chart.setOption({
             tooltip: {
               // trigger: 'axis',
               // formatter: '{a1}<br/>{b1}：{c1}',
             },
             legend: {
-              data: ['数量', '完成率'],
+              data: ["数量", "完成率"],
               textStyle: {
-                color: '#fff', //legend字体颜色
+                color: "#fff", //legend字体颜色
               },
-              left: 'left',
-              left: '10%',
+              left: "left",
+              left: "10%",
               // selectedMode: false,
             },
             grid: {
@@ -202,11 +278,11 @@ export default {
               bottom: 0,
             },
             xAxis: {
-              data: list.map(e => e.deptName),
+              data: list.map((e) => e.deptName),
               //   data: ['项目一', '项目二', '项目三', '项目四', '项目五', '项目六'],
               axisLine: {
                 lineStyle: {
-                  color: 'rgb(255, 255, 255)',
+                  color: "rgb(255, 255, 255)",
                 },
               },
             },
@@ -215,34 +291,34 @@ export default {
             // 	start: 0,
             // 	end: 50,
             // },
-            color: ['#ccc', 'red'],
+            color: ["#ccc", "red"],
             yAxis: [
               {
-                name: '个',
+                name: "个",
                 splitLine: {
                   show: true,
                   //  改变轴线颜色
                   lineStyle: {
                     // 使用深浅的间隔色
-                    color: ['rgba(255, 255, 255,.5)'],
+                    color: ["rgba(255, 255, 255,.5)"],
                   },
                 },
                 axisLabel: {
-                  formatter: '{value}',
+                  formatter: "{value}",
                 },
                 axisLine: {
                   lineStyle: {
-                    color: 'rgb(255, 255, 255)',
+                    color: "rgb(255, 255, 255)",
                   },
                 },
               },
               {
-                type: 'value',
+                type: "value",
                 min: 0,
                 max: 100,
                 interval: 20,
                 axisLabel: {
-                  formatter: '{value} %',
+                  formatter: "{value} %",
                 },
                 splitLine: {
                   show: false, //不显示网格线
@@ -252,7 +328,7 @@ export default {
                 },
                 axisLine: {
                   lineStyle: {
-                    color: 'rgb(255, 255, 255)',
+                    color: "rgb(255, 255, 255)",
                   },
                 },
               },
@@ -270,15 +346,15 @@ export default {
               // 	data: [80, 80, 95, 95, 95, 95, 80, 80, 95, 95, 95, 95],
               // },
               {
-                name: '数量',
-                type: 'bar',
+                name: "数量",
+                type: "bar",
                 barWidth: 30,
                 position: [0, 0],
-                data: list.map(e => e.realIncome),
+                data: list.map((e) => e.realIncome),
                 // data: [5, 20, 36, 10, 10, 20, 10, 20, 30, 10, 70, 75],
                 itemStyle: {
                   color: {
-                    type: 'linear', // 线性渐变
+                    type: "linear", // 线性渐变
                     x: 0,
                     y: 0,
                     x2: 0,
@@ -286,93 +362,91 @@ export default {
                     colorStops: [
                       {
                         offset: 0,
-                        color: '#B5D3FE',
+                        color: "#B5D3FE",
                       },
                       {
                         offset: 1,
-                        color: '#7EA7FC',
+                        color: "#7EA7FC",
                       },
                     ],
                   },
                 },
               },
               {
-                name: '完成率',
-                type: 'scatter',
-                symbol: 'rect',
+                name: "完成率",
+                type: "scatter",
+                symbol: "rect",
                 symbolSize: [30, 4],
                 symbolOffset: [0, 0],
                 position: [0, 0],
                 yAxisIndex: 1,
                 itemStyle: {
-                  color: '#F6D97E',
+                  color: "#F6D97E",
                 },
-                data: list.map(e => e.rate),
+                data: list.map((e) => e.rate),
                 // data: [20, 30, 45, 20, 20, 30, 20, 30, 40, 20, 90, 90],
               },
             ],
-          })
-
+          });
         }
-      })
+      });
     },
 
     // 折线图
-    initChart2 () {
+    initChart2() {
       this.request({
-        url: '/hx/operating/getCostAnalysisPic',
-        method: 'get',
-      }).then(res => {
+        url: "/hx/operating/getCostAnalysisPic",
+        method: "get",
+      }).then((res) => {
         if (200 == res.code) {
           let { list, rate } = res.data;
-          this.chart2 = echarts.init(this.$refs.chart2, 'macarons')
+          this.chart2 = echarts.init(this.$refs.chart2, "macarons");
           this.setOptions2(list);
-		      this.initChart3(rate);
+          this.initChart3(rate);
         }
-      })
-
+      });
     },
-    setOptions2 (list) {
+    setOptions2(list) {
       this.chart2.setOption({
         legend: {
-          left: 'right',
+          left: "right",
           textStyle: {
-            color: '#fff',
+            color: "#fff",
           },
         },
         grid: {
-          top: '3%',
-          left: '3%',
-          right: '6%',
-          bottom: '3%',
+          top: "3%",
+          left: "3%",
+          right: "6%",
+          bottom: "3%",
           containLabel: true,
         },
         xAxis: [
           {
-            type: 'category',
-            data: list.map(e=>e.month),
+            type: "category",
+            data: list.map((e) => e.month),
             // axisPointer: {
             // 	type: 'shadow',
             // },
             axisLine: {
               lineStyle: {
-                color: 'rgb(255, 255, 255)',
+                color: "rgb(255, 255, 255)",
               },
             },
           },
         ],
         yAxis: [
           {
-            type: 'value',
+            type: "value",
             min: 0,
             max: 100,
             axisLabel: {
-              formatter: '{value} %',
+              formatter: "{value} %",
             },
             splitLine: {
               // show: false, //不显示网格线
               lineStyle: {
-                color: '#2b3b6c',
+                color: "#2b3b6c",
               },
             },
             // splitArea: {
@@ -380,58 +454,58 @@ export default {
             // },
             axisLine: {
               lineStyle: {
-                color: 'rgb(255, 255, 255)',
+                color: "rgb(255, 255, 255)",
               },
             },
           },
         ],
         grid: {
           containLabel: true,
-          width: '99%',
+          width: "99%",
           left: 0,
           top: 30,
           bottom: 0,
         },
         series: [
           {
-            name: '预算执行率',
-            type: 'line',
+            name: "预算执行率",
+            type: "line",
             yAxisIndex: 0,
             smooth: false,
-            // 
-            data: list.map(e=>e.rate),
+            //
+            data: list.map((e) => e.rate),
             // data: [80, 70, 80, 70, 80, 70, 80, 70, 80, 70, 80, 70],
             itemStyle: {
-              color: '#1098FF',
+              color: "#1098FF",
             },
             areaStyle: {
               color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                 {
                   offset: 0,
-                  color: 'rgba(16, 152, 255, 1)',
+                  color: "rgba(16, 152, 255, 1)",
                 },
                 {
                   offset: 1,
-                  color: 'rgba(51, 65, 106, 0.18)',
+                  color: "rgba(51, 65, 106, 0.18)",
                 },
               ]),
             },
-            symbol: 'none',
+            symbol: "none",
           },
         ],
-      })
+      });
     },
-    initChart3 (rate) {
-      if(!rate) {
+    initChart3(rate) {
+      if (!rate) {
         return;
       }
-      this.chart3 = echarts.init(this.$refs.chart3, 'macarons')
-      this.setOptions3(rate)
+      this.chart3 = echarts.init(this.$refs.chart3, "macarons");
+      this.setOptions3(rate);
     },
-    setOptions3 (rate) {
+    setOptions3(rate) {
       this.chart3.setOption({
         tooltip: {
-          trigger: 'item',
+          trigger: "item",
         },
         // color: colorList,
         // legend: {
@@ -446,113 +520,113 @@ export default {
         // },
         series: [
           {
-            name: '占比',
-            type: 'pie',
-            center: ['50%', '50%'],
-            radius: ['65%', '85%'],
+            name: "占比",
+            type: "pie",
+            center: ["50%", "50%"],
+            radius: ["65%", "85%"],
             clockWise: false, // 逆时针
             hoverAnimation: false, // hover 效果
             avoidLabelOverlap: false,
             label: {
               show: false,
-              position: 'center',
+              position: "center",
             },
             emphasis: {
               label: {
                 show: false,
-                fontSize: '40',
-                fontWeight: 'bold',
+                fontSize: "40",
+                fontWeight: "bold",
               },
             },
             labelLine: {
               show: false,
             },
             data: [
-              { value: rate.total, name: '总2' },
-              { value: rate.toolingTotal, name: '工装成本占比' },
+              { value: rate.total, name: "总2" },
+              { value: rate.toolingTotal, name: "工装成本占比" },
             ],
-            color: ['#73cdcf', '#2f6a74'],
+            color: ["#73cdcf", "#2f6a74"],
           },
           {
-            name: '占比',
-            type: 'pie',
-            radius: ['30%', '50%'],
-            center: ['50%', '50%'],
+            name: "占比",
+            type: "pie",
+            radius: ["30%", "50%"],
+            center: ["50%", "50%"],
             clockWise: false, // 逆时针
             hoverAnimation: false, // hover 效果
             avoidLabelOverlap: false,
             label: {
               show: false,
-              position: 'center',
+              position: "center",
             },
             emphasis: {
               label: {
                 show: false,
-                fontSize: '40',
-                fontWeight: 'bold',
+                fontSize: "40",
+                fontWeight: "bold",
               },
             },
             labelLine: {
               show: false,
             },
             data: [
-              { value: rate.total, name: '总1' },
-              { value: rate.materialTotal, name: '原材料成本占比' },
+              { value: rate.total, name: "总1" },
+              { value: rate.materialTotal, name: "原材料成本占比" },
             ],
-            color: ['#f6d97e', '#7f7462'],
+            color: ["#f6d97e", "#7f7462"],
           },
         ],
-      })
+      });
     },
 
-    initChart4 () {
+    initChart4() {
       this.request({
-        url: '/hx/operating/getDeptOperateIndexPic',
-        method: 'get',
-        params: { type: 1 }
-      }).then(res => {
+        url: "/hx/operating/getDeptOperateIndexPic",
+        method: "get",
+        params: { type: 1 },
+      }).then((res) => {
         if (200 == res.code) {
           let { list } = res.data;
-          this.chart4 = echarts.init(this.$refs.chart4)
+          this.chart4 = echarts.init(this.$refs.chart4);
           this.chart4.setOption({
             tooltip: {
-              trigger: 'axis',
+              trigger: "axis",
               axisPointer: {
-                type: 'shadow',
+                type: "shadow",
               },
             },
             legend: {
-              orient: 'vertical',
-              x: 'right',
+              orient: "vertical",
+              x: "right",
               // y: 'center',
-              top: '20%',
+              top: "20%",
               textStyle: {
-                color: '#fff', //legend字体颜色
+                color: "#fff", //legend字体颜色
               },
             },
             grid: {
               left: 20,
-              right: '25%',
+              right: "25%",
               top: 30,
               bottom: 50,
               containLabel: true,
             },
             dataZoom: {
-              type: 'slider',
+              type: "slider",
               // start: 0,
               // end: 50,
               textStyle: {
-                color: '#fff',
+                color: "#fff",
               },
             },
             xAxis: [
               {
-                type: 'category',
-                data: list.map(e => e.month),
+                type: "category",
+                data: list.map((e) => e.month),
                 // data: ['2021-01', '2021-02', '2021-03', '2021-04', '2021-05', '2021-06', '2021-07'],
                 axisLine: {
                   lineStyle: {
-                    color: 'rgb(255, 255, 255)',
+                    color: "rgb(255, 255, 255)",
                   },
                 },
               },
@@ -564,22 +638,22 @@ export default {
                   //  改变轴线颜色
                   lineStyle: {
                     // 使用深浅的间隔色
-                    color: ['rgba(255, 255, 255,.5)'],
+                    color: ["rgba(255, 255, 255,.5)"],
                   },
                 },
                 axisLabel: {
-                  formatter: '{value}',
+                  formatter: "{value}",
                 },
                 axisLine: {
                   lineStyle: {
-                    color: 'rgb(255, 255, 255)',
+                    color: "rgb(255, 255, 255)",
                   },
                 },
               },
               {
-                type: 'value',
+                type: "value",
                 axisLabel: {
-                  formatter: '{value} %',
+                  formatter: "{value} %",
                 },
                 splitLine: {
                   show: false, //不显示网格线
@@ -589,125 +663,124 @@ export default {
                 },
                 axisLine: {
                   lineStyle: {
-                    color: 'rgb(255, 255, 255)',
+                    color: "rgb(255, 255, 255)",
                   },
                 },
               },
             ],
             series: [
               {
-                name: 'EVA',
-                type: 'bar',
-                stack: 'Ad',
+                name: "EVA",
+                type: "bar",
+                stack: "Ad",
                 emphasis: {
-                  focus: 'series',
+                  focus: "series",
                 },
                 itemStyle: {
-                  color: '#F6D97E',
+                  color: "#F6D97E",
                 },
                 barWidth: 30,
-                data: list.map(e => e.realEva)
+                data: list.map((e) => e.realEva),
                 // data: [150, 232, 201, 154, 190, 330, 410],
               },
               {
-                name: '两金',
-                type: 'bar',
-                stack: 'Ad',
+                name: "两金",
+                type: "bar",
+                stack: "Ad",
                 emphasis: {
-                  focus: 'series',
+                  focus: "series",
                 },
                 itemStyle: {
-                  color: '#F89343',
+                  color: "#F89343",
                 },
                 barWidth: 30,
-                data: list.map(e => e.realCollection)
+                data: list.map((e) => e.realCollection),
                 // data: [150, 232, 201, 154, 190, 330, 410],
               },
               {
-                name: '利润',
-                type: 'bar',
-                stack: 'Ad',
+                name: "利润",
+                type: "bar",
+                stack: "Ad",
                 emphasis: {
-                  focus: 'series',
+                  focus: "series",
                 },
                 itemStyle: {
-                  color: '#83DDC5',
+                  color: "#83DDC5",
                 },
                 barWidth: 30,
-                data: list.map(e => e.realProfit)
+                data: list.map((e) => e.realProfit),
                 // data: [150, 232, 201, 154, 190, 330, 410],
               },
               {
-                name: '收入',
-                type: 'bar',
-                stack: 'Ad',
+                name: "收入",
+                type: "bar",
+                stack: "Ad",
                 emphasis: {
-                  focus: 'series',
+                  focus: "series",
                 },
                 itemStyle: {
-                  color: '#ADCDFD',
+                  color: "#ADCDFD",
                 },
                 barWidth: 30,
-                data: list.map(e => e.realIncome)
+                data: list.map((e) => e.realIncome),
                 // data: [150, 232, 201, 154, 190, 330, 410],
               },
               {
-                name: '收入完成率',
-                type: 'line',
+                name: "收入完成率",
+                type: "line",
                 smooth: false,
-                data: list.map(e => e.incomeRate),
+                data: list.map((e) => e.incomeRate),
                 // data: [500, 550, 700, 520, 650, 520, 550],
                 itemStyle: {
-                  color: '#8BB1ED',
+                  color: "#8BB1ED",
                 },
-                symbol: 'none',
+                symbol: "none",
               },
               {
-                name: '利润完成率',
-                type: 'line',
+                name: "利润完成率",
+                type: "line",
                 smooth: false,
                 itemStyle: {
-                  color: '#53C19D',
+                  color: "#53C19D",
                 },
-                data: list.map(e => e.profitRate),
+                data: list.map((e) => e.profitRate),
                 // data: [600, 500, 700, 620, 750, 800, 600],
-                symbol: 'none',
+                symbol: "none",
               },
               {
-                name: '两金完成率',
-                type: 'line',
+                name: "两金完成率",
+                type: "line",
                 yAxisIndex: 1,
                 smooth: false,
-                data: list.map(e => e.collectionRate),
+                data: list.map((e) => e.collectionRate),
                 // data: [80, 70, 80, 70, 80, 70, 80, 70, 80, 70, 80, 70],
                 itemStyle: {
-                  color: '#F64F58',
+                  color: "#F64F58",
                 },
-                symbol: 'none',
+                symbol: "none",
               },
               {
-                name: 'EVA完成率',
-                type: 'line',
+                name: "EVA完成率",
+                type: "line",
                 yAxisIndex: 1,
                 smooth: false,
-                data: list.map(e => e.evaRate),
+                data: list.map((e) => e.evaRate),
                 itemStyle: {
-                  color: '#F6D97E',
+                  color: "#F6D97E",
                 },
-                symbol: 'none',
+                symbol: "none",
               },
             ],
-          })
-
+          });
         }
-      })
+      });
 
       //   this.setOptions4()
     },
     // setOptions4 () {
     //   },
   },
-}
+};
 </script>
 
 <style lang="scss" scoped>