{"remainingRequest":"D:\\jenkins\\workspace\\reform-fvue\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\jenkins\\workspace\\reform-fvue\\src\\views\\BigScreen\\components\\subComponents\\projectLineChartDialog.vue?vue&type=script&lang=js&","dependencies":[{"path":"D:\\jenkins\\workspace\\reform-fvue\\src\\views\\BigScreen\\components\\subComponents\\projectLineChartDialog.vue","mtime":1716801010586},{"path":"D:\\jenkins\\workspace\\reform-fvue\\node_modules\\babel-loader\\lib\\index.js","mtime":315532800000},{"path":"D:\\jenkins\\workspace\\reform-fvue\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\reform-fvue\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n\r\nimport * as echarts from 'echarts'\r\nimport apiList from '@/api/bigScreen/majorView.js'\r\nexport default {\r\n name: 'projectLinechartDialog',\r\n data() {\r\n return {\r\n title: '',\r\n dialogVisible: false,\r\n trendChart: null,\r\n trendChartOption: null,\r\n legendData: [],\r\n xAxisData: [],\r\n seriesData: [],\r\n valueData: [],\r\n rateData: null,\r\n loading: false,\r\n }\r\n },\r\n beforeDestroy() {\r\n this.$bus.$off('changeDate')\r\n },\r\n mounted() {\r\n // this.$bus.$on('changeDate', () => {\r\n // this.loadData()\r\n // })\r\n },\r\n methods: {\r\n initTrendChart() {\r\n let chartDom = document.getElementById('trend-chart')\r\n this.trendChart = echarts.init(chartDom)\r\n this.trendChartOption = {\r\n title: {\r\n text: this.title + '年度核心指标完成情况趋势图',\r\n left: 'center',\r\n bottom: '1%',\r\n textStyle: {\r\n color: '#ffffff',\r\n fontSize: 18,\r\n fontFamily: 'Microsoft YaHei, Microsoft YaHei',\r\n },\r\n },\r\n tooltip: {\r\n trigger: 'item', //'axis item',\r\n backgroundColor: 'rgba(6, 47, 107, 1)',\r\n borderColor: 'rgba(2, 115, 233, 1)',\r\n textStyle: {\r\n color: '#fff',\r\n fontSize: 18,\r\n },\r\n formatter: (arg) => {\r\n console.log(arg, 'arg')\r\n // let str = '截止' + arg[0].axisValue + ''\r\n // arg.forEach((item) => {\r\n // let index = item.dataIndex\r\n // let value = 0\r\n // if (\r\n // this.valueData[item.seriesName][index]\r\n // .actualIndexCompleteRate\r\n // ) {\r\n // value =\r\n // this.valueData[item.seriesName][index]\r\n // .actualIndexCompleteRate\r\n // }\r\n\r\n // str =\r\n // str +\r\n // '' +\r\n // `` +\r\n // item.seriesName +\r\n // ' ' +\r\n // value +\r\n // '%'\r\n // })\r\n\r\n let str = '截止' + arg.name + ''\r\n str =\r\n str +\r\n '' +\r\n `` +\r\n arg.seriesName +\r\n ' ' +\r\n arg.data.actualRate +\r\n '%'\r\n\r\n return str\r\n },\r\n },\r\n legend: {\r\n // top: '0',\r\n // left: 'center',\r\n type: 'plain',\r\n icon: 'rect',\r\n inactiveColor: '#333333',\r\n itemWidth: 20,\r\n itemHeight: 6,\r\n textStyle: {\r\n color: '#B1E3FF',\r\n fontSize: 15,\r\n },\r\n data: this.legendData,\r\n },\r\n grid: {\r\n left: '2%',\r\n right: '120',\r\n bottom: '10%',\r\n top: '15%',\r\n containLabel: true,\r\n },\r\n\r\n xAxis: {\r\n type: 'category',\r\n type: 'category',\r\n boundaryGap: ['0%', '0%'],\r\n axisLine: {\r\n lineStyle: {\r\n color: 'rgba(154,199,220, 0.2)',\r\n },\r\n },\r\n axisLabel: {\r\n color: '#D7F1FF',\r\n align: 'center',\r\n fontSize: 16,\r\n padding: [0, 0, 0, 10],\r\n },\r\n boundaryGap: false,\r\n data: [\r\n '1月',\r\n '2月',\r\n '3月',\r\n '4月',\r\n '5月',\r\n '6月',\r\n '7月',\r\n '8月',\r\n '9月',\r\n '10月',\r\n '11月',\r\n '12月',\r\n ],\r\n splitLine: {\r\n show: false,\r\n },\r\n },\r\n yAxis: {\r\n // min: 0, //取0为最小刻度\r\n max: 110,\r\n type: 'value',\r\n axisLabel: {\r\n color: '#D7F1FF',\r\n interval: 0,\r\n showMinLabel: false,\r\n showMaxLabel: false,\r\n fontSize: 16,\r\n formatter: function (value) {\r\n return value + '%'\r\n },\r\n },\r\n axisLine: {\r\n lineStyle: {\r\n color: 'rgba(154,199,220, 0.2)',\r\n },\r\n },\r\n splitLine: {\r\n lineStyle: {\r\n color: 'rgba(154,199,220, 0.2)',\r\n },\r\n },\r\n },\r\n series: this.seriesData,\r\n }\r\n this.trendChartOption &&\r\n this.trendChart.setOption(this.trendChartOption)\r\n window.addEventListener('resize', () => this.trendChart.resize())\r\n },\r\n loadData() {\r\n this.loading = true\r\n let data = JSON.parse(sessionStorage.getItem('searchDate'))\r\n data.projectId = this.projectId\r\n apiList.getProjectLineChartData(data, (res) => {\r\n this.valueData = res.data\r\n this.legendData = Object.keys(res.data)\r\n this.legendData.forEach((legend, index) => {\r\n this.seriesData[index] = {\r\n name: legend,\r\n type: 'line',\r\n data: res.data[legend].map((item) => {\r\n let actualRate = item.actualIndexCompleteRate\r\n let value\r\n if (actualRate > 100) {\r\n value = 105\r\n }\r\n // else if (actualRate < 0) {\r\n // value = 0\r\n // }\r\n else {\r\n value = actualRate\r\n }\r\n let objData = {\r\n value,\r\n actualRate,\r\n }\r\n return objData\r\n }),\r\n emphasis: {\r\n focus: 'series',\r\n endLabel: {\r\n show: true,\r\n formatter: (arg) => {\r\n let seriesName = arg.seriesName\r\n let lines = Math.ceil(seriesName.length / 8)\r\n let str = '',\r\n start = 0,\r\n end = 8\r\n for (let i = 1; i <= lines; i++) {\r\n if (i > 1) {\r\n start = end\r\n end = i * 8\r\n } else if (i == lines) {\r\n end = str.length\r\n }\r\n str += `{a|${seriesName.slice(\r\n start,\r\n end\r\n )}}\\n`\r\n }\r\n\r\n return str\r\n },\r\n rich: {\r\n a: {\r\n backgroundColor: 'rgba(6, 47, 107, 1)',\r\n },\r\n },\r\n color: '#D7F1FF',\r\n fontSize: 14,\r\n lineHeight: 20,\r\n },\r\n },\r\n }\r\n })\r\n console.log(this.seriesData, 'this.seriesData')\r\n this.initTrendChart()\r\n this.loading = false\r\n })\r\n },\r\n open(data) {\r\n let {projectName, projectId} = data\r\n this.projectId = projectId\r\n this.title = projectName\r\n this.dialogVisible = true\r\n this.$nextTick(() => {\r\n this.initTrendChart()\r\n this.loadData()\r\n })\r\n },\r\n handleClose() {\r\n this.trendChart.clear\r\n this.dialogVisible = false\r\n },\r\n },\r\n}\r\n",null]}