From 9efb4e77cf44f0adaf677662c6779b45954a0a2b Mon Sep 17 00:00:00 2001 From: 付延余 <f-yanyu@outlook.com> Date: 星期五, 22 四月 2022 16:20:04 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/master' --- src/pages/show/jiuyeAndChuangye/jiuyeChildren/workStatistics.vue | 212 ++++++++++++++++++++++++++++++++++++++++++---------- 1 files changed, 171 insertions(+), 41 deletions(-) diff --git a/src/pages/show/jiuyeAndChuangye/jiuyeChildren/workStatistics.vue b/src/pages/show/jiuyeAndChuangye/jiuyeChildren/workStatistics.vue index a6afceb..fb0decd 100644 --- a/src/pages/show/jiuyeAndChuangye/jiuyeChildren/workStatistics.vue +++ b/src/pages/show/jiuyeAndChuangye/jiuyeChildren/workStatistics.vue @@ -11,124 +11,251 @@ border style="width: 100%"> <el-table-column + :formatter="dataTypeFormatter" align="center" - prop="date" + prop="dataType" label="鎸囨爣鍚嶇О" fixed="left"> </el-table-column> <el-table-column - prop="name" + prop="yearFinish" align="center" label="鍘诲勾瀹屾垚"> </el-table-column> <el-table-column - prop="address" + prop="january" align="center" label="1鏈�"> </el-table-column> <el-table-column - prop="address" + prop="february" align="center" label="2鏈�"> </el-table-column> <el-table-column - prop="address" + prop="march" align="center" label="3鏈�"> </el-table-column> <el-table-column - prop="address" + prop="april" align="center" label="4鏈�"> </el-table-column> <el-table-column - prop="address" + prop="may" align="center" label="5鏈�"> </el-table-column> <el-table-column - prop="address" + prop="june" align="center" label="6鏈�"> </el-table-column> <el-table-column - prop="address" + prop="july" align="center" label="7鏈�"> </el-table-column> <el-table-column - prop="address" + prop="august" align="center" label="8鏈�"> </el-table-column> <el-table-column - prop="address" + prop="september" align="center" label="9鏈�"> </el-table-column> <el-table-column - prop="address" + prop="october" align="center" label="10鏈�"> </el-table-column> <el-table-column - prop="address" + prop="november" align="center" label="11鏈�"> </el-table-column> <el-table-column - prop="address" + prop="december" align="center" label="12鏈�"> </el-table-column> <el-table-column - prop="address" + prop="plan" align="center" label="鐪佸巺璁″垝"> </el-table-column> <el-table-column - prop="address" + prop="finish" align="center" label="褰撳墠瀹屾垚鐜�"> </el-table-column> </el-table> + <div class="laogongJiuyeEcharts" id="laogongJiuyeEcharts"></div> </div> </div> </template> <script> + import nowSize from "../../../../libs/nowSize"; + import { getLabourTable, getLabourLine } from '@/api/jiuyeAndChuangye' export default { name: "workStatistics", data() { return { - tableData: [{ - date: '鍩庨晣鏂板灏变笟浜烘暟', - name: '122', - address: '32111' - }, { - date: '鍩庨晣澶变笟浜哄憳瀹炵幇鍐嶅氨涓氫汉鏁�', - name: '233', - address: '34222' - }, { - date: '鍐滄潙鍔冲姩鍔涘悜闈炲啘浜т笟杞Щ浜烘暟', - name: '23222', - address: '3112222' - }, { - date: '鍏朵腑锛氬姵鍔¤緭鍑�', - name: '34221', - address: '122222' - }, { - date: '寮�灞曡ˉ璐存�ц亴涓氭妧鑳藉煿璁汉鏁�', - name: '2333', - address: '1232233' - }, { - date: '鍩庨晣鐧昏澶变笟鐜�', - name: '222', - address: '2222' - }] + tableData: [], + newEmployment:[], //鏂板灏变笟 + loseReEmployment:[], //澶变笟浜哄憳鍐嶅氨涓� + diffReEmployment: [], //灏变笟鍥伴毦浜哄憳鍐嶅氨涓� + xdata:[], } }, + mounted() { + this.getLabourTable() + this.getLabourLine() + this.laogongJiuyeEcharts() + }, methods: { + getLabourTable() { //鏌ヨ鍔冲姩灏变笟琛ㄦ牸鏁版嵁鎺ュ彛 + getLabourTable().then(res => { + if(res.code == 1000) { + this.tableData = res.list + } + }) + }, + dataTypeFormatter(row,column) { + let name = row.dataType + if(name == 1) { + return '鍩庨晣鏂板灏变笟浜烘暟' + }else if(name == 2) { + return '鍩庨晣澶变笟浜哄憳瀹炵幇鍐嶅氨涓氫汉鏁�' + }else if(name == 3) { + return '鍩庨晣灏变笟鍥伴毦浜哄憳瀹炵幇鍐嶅氨涓氫汉鏁�' + }else if(name == 4) { + return '鍐滄潙鍔冲姩鍔涘悜闈炲啘浜т笟杞Щ浜烘暟' + }else if(name == 5) { + return '鍔冲姟杈撳嚭' + }else if(name == 6) { + return '寮�灞曡ˉ璐存�ц亴涓氭妧鑳藉煿璁汉鏁�' + }else if(name == 7) { + return '鍩庨晣鐧昏澶变笟鐜�' + } + }, + /*鏌ヨ鍔冲姩灏变笟鎶樼嚎鍥炬暟鎹帴鍙�*/ + getLabourLine() { + getLabourLine().then(res => { + if(res.code == 1000) { + this.newEmployment = res.list[0][1] || [] + this.loseReEmployment = res.list[1][2] || [] + this.diffReEmployment = res.list[2][3] || [] + this.xdata = res.obj || [] + this.laogongJiuyeEcharts() + } + }) + }, + laogongJiuyeEcharts() { + let myEchart = this.$echarts.init(document.getElementById('laogongJiuyeEcharts')) + let option = { + color : ['#FF5151','#51FF5D','#FFD151'], + title: { + text: '鍘嗗勾鍩庨晣灏变笟浜烘暟鍒嗘瀽鍥�', + left: 'center', + top: '8%', + textStyle: { + color: '#FFFFFF', + fontSize: nowSize(30) + }, + }, + tooltip: { + trigger: 'axis' + }, + legend: { + itemWidth: nowSize(30), + itemHeight: nowSize(4), + itemGap: nowSize(50), + right:'2%', + top: 'center', + orient: 'vertical', + textStyle: { + color: '#FFFFFF', + fontSize: nowSize(24), + } + }, + grid: { + top: '15%', + left: '4%', + right: '18%', + bottom: '3%', + containLabel: true + }, + xAxis: { + type: 'category', + boundaryGap: false, + data: this.xdata, + axisLabel: { + show: true, + textStyle: { + color: "#fff", + fontSize:nowSize(24) + } + }, + axisLine: { + lineStyle: { + color: "#999999", + width: 1, + type: "solid" + } + }, + splitLine: { + show: false + } + }, + yAxis: { + type: 'value', + axisLabel: { + show: true, + textStyle: { + color: "#fff", + fontSize:nowSize(24) + } + }, + axisLine: { + lineStyle: { + color: "#999999", + width: 1, + type: "solid" + } + }, + splitLine: { + show: false + } + }, + series: [ + { + name: '鏂板灏变笟', + type: 'line', + data: this.newEmployment + }, + { + name: '澶变笟浜哄憳鍐嶅氨涓�', + type: 'line', + data: this.loseReEmployment + }, + { + name: '灏变笟鍥伴毦浜哄憳鍐嶅氨涓�', + type: 'line', + data: this.diffReEmployment + } + ] + }; + myEchart.setOption(option) + window.addEventListener('resize',function () { + myEchart.resize() + }) + + }, handleheader(data) { return { lineHeight: '0', @@ -200,5 +327,8 @@ line-height: 2.5; } } + .laogongJiuyeEcharts{ + height: calc(100% - 640px - 0.33203125rem /* 85/256 */); + } } </style> -- Gitblit v1.9.1