From 08b5ddfa9a0a2ed52bd7d7b98ca16ef4dcc610a6 Mon Sep 17 00:00:00 2001
From: zhangxiaoxu123 <819527061@qq.com>
Date: 星期二, 13 九月 2022 14:19:43 +0800
Subject: [PATCH] 页面修改

---
 src/pages/show/jiuyeAndChuangye/jiuyeChildren/zhiyePeixun.vue |  159 +++++++++++++++++++++++++++++-----------------------
 1 files changed, 89 insertions(+), 70 deletions(-)

diff --git a/src/pages/show/jiuyeAndChuangye/jiuyeChildren/zhiyePeixun.vue b/src/pages/show/jiuyeAndChuangye/jiuyeChildren/zhiyePeixun.vue
index f66d23e..1fe2376 100644
--- a/src/pages/show/jiuyeAndChuangye/jiuyeChildren/zhiyePeixun.vue
+++ b/src/pages/show/jiuyeAndChuangye/jiuyeChildren/zhiyePeixun.vue
@@ -4,12 +4,13 @@
       stripe
       border
       :data="tableData"
-      max-height="640"
+      max-height="tableHeight"
       :header-cell-style="handleheader"
+      :cell-style="handleCellStyle"
       style="width: 100%">
       <el-table-column
         fixed="left"
-        prop="year"
+        prop="jyear"
         label="骞翠唤"
         align="center">
       </el-table-column>
@@ -18,48 +19,46 @@
           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>
@@ -70,58 +69,50 @@
 </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: [],  //鎶樼嚎鏁版嵁锛堝畬鎴愮巼锛�
+                tableHeight: window.innerHeight - nowSize(1000)
             }
         },
         mounted() {
-          this.zhiyepeixunEcharts()
+          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',
 
+                }
+            },
+            handleCellStyle({rowIndex, columnIndex}) {
+                if(columnIndex == 0) {
+                    return { background:'#51D2FF' }
                 }
             },
             zhiyepeixunEcharts() {
@@ -134,20 +125,34 @@
                             crossStyle: {
                                 color: '#999'
                             }
+                        },
+                        textStyle: {
+                            color: '#fff',
+                            fontSize: nowSize(28)
                         }
                     },
                     title: {
                       text:'鍘嗗勾鑱屼笟鍩硅鎯呭喌鍒嗘瀽鍥�',
                       left: 'center',
-                      top:'3%',
+                      top:'5%',
                       textStyle: {
                           color: '#fff',
                           fontSize: nowSize(30)
                       }
                     },
+                    grid: {
+                        top: '15%',
+                        left: '4%',
+                        right: '18%',
+                        bottom: '3%',
+                        containLabel: true
+                    },
                     legend: {
+                        data: ['瀹為檯鍩硅浜烘暟','瀹屾垚鐜�'],
                         right:'3%',
-                        top:'3%',
+                        top:'center',
+                        orient:'vertical',
+                        itemGap: nowSize(50),
                         textStyle: {
                             color:'#fff',
                             fontSize: nowSize(24)
@@ -156,7 +161,7 @@
                     xAxis: [
                         {
                             type: 'category',
-                            data: ['2017骞�', '2018骞�', '2019骞�', '2020骞�', '2021骞�', '2022骞�', '2023骞�'],
+                            data: this.yearsData,
                             axisPointer: {
                                 type: 'shadow'
                             },
@@ -178,47 +183,55 @@
                     yAxis: [
                         {
                             type: 'value',
-                            name: 'Precipitation',
-                            min: 0,
-                            max: 250,
-                            interval: 50,
                             axisLabel: {
-                                formatter: '{value} ml',
                                 textStyle: {
                                     color: '#fff',
                                     fontSize: nowSize(24)
                                 }
                             },
                             axisLine: {
-
+                              lineStyle: {
+                                  color: "#999999",
+                                  width: 1,
+                                  type: "solid"
+                              }
+                            },
+                            splitLine: {
+                               show: false
                             }
                         },
                         {
                             type: 'value',
-                            name: 'Temperature',
-                            min: 0,
-                            max: 25,
-                            interval: 5,
                             axisLabel: {
-                                formatter: '{value} 掳C'
+                                show: false,
+                                formatter: '{value} %'
+                            },
+                            axisLine: {
+                                show: false,
+                            },
+                            splitLine: {
+                                show: false
+                            },
+                            axisTick: {
+                                show: false
                             }
                         }
                     ],
                     series: [
                         {
-                            name: 'Evaporation',
+                            name: '瀹為檯鍩硅浜烘暟',
                             type: 'bar',
+                            barWidth: nowSize(48),
+                            color:'#51D2FF',
                             tooltip: {
                                 valueFormatter: function (value) {
                                     return value + ' ml';
                                 }
                             },
-                            data: [
-                                2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3
-                            ]
+                            data: this.numberData
                         },
                         {
-                            name: 'Temperature',
+                            name: '瀹屾垚鐜�',
                             type: 'line',
                             yAxisIndex: 1,
                             tooltip: {
@@ -226,7 +239,7 @@
                                     return value + ' 掳C';
                                 }
                             },
-                            data: [2.0, 4.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2]
+                            data: this.rateData
                         }
                     ]
                 };
@@ -245,6 +258,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 */;
@@ -271,7 +290,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