From 41f383d6ef3812bd81098d03e44cdeab549eeb08 Mon Sep 17 00:00:00 2001 From: zhangxiaoxu123456 <zxx19900626> Date: 星期四, 21 四月 2022 09:14:51 +0800 Subject: [PATCH] 职业培训接口对接 --- src/pages/show/jiuyeAndChuangye/jiuyeChildren/zhiyePeixun.vue | 225 ++++++++++++++++++++++++++++++++++++++++++++------------ 1 files changed, 176 insertions(+), 49 deletions(-) diff --git a/src/pages/show/jiuyeAndChuangye/jiuyeChildren/zhiyePeixun.vue b/src/pages/show/jiuyeAndChuangye/jiuyeChildren/zhiyePeixun.vue index 3cff4c2..ee46b68 100644 --- a/src/pages/show/jiuyeAndChuangye/jiuyeChildren/zhiyePeixun.vue +++ b/src/pages/show/jiuyeAndChuangye/jiuyeChildren/zhiyePeixun.vue @@ -9,7 +9,7 @@ style="width: 100%"> <el-table-column fixed="left" - prop="year" + prop="jyear" label="骞翠唤" align="center"> </el-table-column> @@ -18,107 +18,228 @@ label="琛ヨ创鎬у煿璁�" align="center"> <el-table-column - prop="shengtingjihua" + prop="planTimes" :label="'鐪佸巺璁″垝 \n 锛堜汉娆★級'" align="center"> </el-table-column> <el-table-column - prop="shijipeixunjihua" + prop="realTimes" :label="'瀹為檯鍩硅浜烘暟 \n 锛堜汉娆★級'" align="center"> </el-table-column> <el-table-column - prop="wanchenglv" + prop="completionRate" label="瀹屾垚鐜�" align="center"> </el-table-column> <el-table-column - prop="zhuanzhangzhichu" + prop="expenditure" :label="'涓撹处璧勯噾鏀嚭 \n 锛堜竾鍏冿級'" align="center"> </el-table-column> </el-table-column> <el-table-column - prop="name" label="鍏朵腑搴斿眾姣曚笟瀛﹀勾楂樻牎姣曚笟鐢�" align="center"> <el-table-column - prop="peixunrenshu" + prop="graduateTrains" :label="'鍩硅浜烘暟 \n 锛堜汉娆★級'" align="center"> </el-table-column> <el-table-column - prop="butiejine" + prop="graduateSubsidy" :label="'琛ヨ创閲戦 \n 锛堜竾鍏�)'" align="center"> </el-table-column> </el-table-column> </el-table-column> <el-table-column - prop="year" label="绀句細鎬у煿璁�" align="center"> <el-table-column - prop="peixunrenci" + prop="graduateSubsidy" label="瀹為檯鍩硅浜烘暟 锛堜汉娆★級" align="center"> </el-table-column> </el-table-column> </el-table> - <div class="zhiyepeixun-echarts"></div> + <div class="zhiyepeixun-echarts" id="zhiyepeixunEcharts"></div> </div> </template> <script> + import {getTrainTable, getTrainChart} from '@/api/jiuyeAndChuangye' + import nowSize from "../../../../libs/nowSize"; export default { name: "zhiyePeixun", data() { return { - tableData:[{ - year: '2017骞�', - shengtingjihua: '34212', - shijipeixunjihua: '44333', - wanchenglv: '90%', - zhuanzhangzhichu: '233421', - peixunrenshu: '3222', - butiejine:'2322', - peixunrenci:'34223' - },{ - year: '2018骞�', - shengtingjihua: '34212', - shijipeixunjihua: '44333', - wanchenglv: '90%', - zhuanzhangzhichu: '233421', - peixunrenshu: '3222', - butiejine:'2322', - peixunrenci:'34223' - },{ - year: '2019骞�', - shengtingjihua: '34212', - shijipeixunjihua: '44333', - wanchenglv: '90%', - zhuanzhangzhichu: '233421', - peixunrenshu: '3222', - butiejine:'2322', - peixunrenci:'34223' - },{ - year: '2020骞�', - shengtingjihua: '34212', - shijipeixunjihua: '44333', - wanchenglv: '90%', - zhuanzhangzhichu: '233421', - peixunrenshu: '3222', - butiejine:'2322', - peixunrenci:'34223' - }] + tableData:[], + yearsData: [], //x杞存暟鎹� + numberData: [], //鏌辩姸鍥炬暟鎹紙瀹為檯鍩硅浜烘暟锛� + rateData: [], //鎶樼嚎鏁版嵁锛堝畬鎴愮巼锛� } }, + mounted() { + this.getTrainTable() + this.getTrainChart() + }, methods: { + getTrainTable() { //鏌ヨ鑱屼笟鍩硅缁熻琛ㄦ牸鏁版嵁鎺ュ彛 + getTrainTable().then(res => { + if(res.code == 1000) { + this.tableData = res.list + } + }) + }, + getTrainChart() { + getTrainChart().then(res => { + if(res.code == 1000) { + this.yearsData = res.obj.years + this.numberData = res.obj.number + this.rateData = res.obj.rate + this.zhiyepeixunEcharts() + } + }) + }, handleheader(data) { return { lineHeight: '0', } + }, + zhiyepeixunEcharts() { + let myEchart = this.$echarts.init(document.getElementById('zhiyepeixunEcharts')) + let option = { + tooltip: { + trigger: 'axis', + axisPointer: { + type: 'cross', + crossStyle: { + color: '#999' + } + }, + textStyle: { + color: '#fff', + fontSize: nowSize(28) + } + }, + title: { + text:'鍘嗗勾鑱屼笟鍩硅鎯呭喌鍒嗘瀽鍥�', + left: 'center', + top:'5%', + textStyle: { + color: '#fff', + fontSize: nowSize(30) + } + }, + grid: { + top: '15%', + left: '4%', + right: '18%', + bottom: '3%', + containLabel: true + }, + legend: { + data: ['瀹為檯鍩硅浜烘暟','瀹屾垚鐜�'], + right:'3%', + top:'center', + orient:'vertical', + itemGap: nowSize(50), + textStyle: { + color:'#fff', + fontSize: nowSize(24) + } + }, + xAxis: [ + { + type: 'category', + data: this.yearsData, + axisPointer: { + type: 'shadow' + }, + axisLabel: { + textStyle: { + color: '#fff', + fontSize: nowSize(24) + } + }, + axisLine: { + lineStyle: { + color: "#999999", + width: 1, + type: "solid" + } + } + } + ], + yAxis: [ + { + type: 'value', + axisLabel: { + textStyle: { + color: '#fff', + fontSize: nowSize(24) + } + }, + axisLine: { + lineStyle: { + color: "#999999", + width: 1, + type: "solid" + } + }, + splitLine: { + show: false + } + }, + { + type: 'value', + axisLabel: { + show: false, + formatter: '{value} %' + }, + axisLine: { + show: false, + }, + splitLine: { + show: false + }, + axisTick: { + show: false + } + } + ], + series: [ + { + name: '瀹為檯鍩硅浜烘暟', + type: 'bar', + barWidth: nowSize(48), + color:'#51D2FF', + tooltip: { + valueFormatter: function (value) { + return value + ' ml'; + } + }, + data: this.numberData + }, + { + name: '瀹屾垚鐜�', + type: 'line', + yAxisIndex: 1, + tooltip: { + valueFormatter: function (value) { + return value + ' 掳C'; + } + }, + data: this.rateData + } + ] + }; + myEchart.setOption(option) + window.addEventListener('resize',function () { + myEchart.resize() + }) } } } @@ -130,6 +251,12 @@ width: 100%; height: calc(100% - 0.078125rem /* 20/256 */); margin-top: 0.078125rem /* 20/256 */; + .el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell{ + background: transparent; + } + .el-table__body tr.hover-row.current-row>td.el-table__cell, .el-table__body tr.hover-row.el-table__row--striped.current-row>td.el-table__cell, .el-table__body tr.hover-row.el-table__row--striped>td.el-table__cell, .el-table__body tr.hover-row>td.el-table__cell{ + background: transparent; + } .el-table th.el-table__cell{ background-color:$color-blue; height: 0.3125rem /* 80/256 */; @@ -156,7 +283,7 @@ font-size: $fontSize-28; color: $color-darkGrey; font-weight: 300; - line-height: 1; + line-height: 1.3; white-space:pre-line; } .el-table--border th.el-table__cell, .el-table__fixed-right-patch{ -- Gitblit v1.9.1