Home Explore Help
Sign In
kingdee_large_screen
/
pc_kingdee_large_screen
2
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

Merge branch 'main' of https://git.sxidc.com/kingdee_large_screen/pc_kingdee_large_screen

l1448442195@163.com 1 year ago
parent
db4e94602f 95dc839b83
commit
bc842ae321
27 changed files with 1944 additions and 142 deletions
Split View Show Diff Stats
  1. BIN
      investment/images3/back-big.png
  2. BIN
      investment/images3/big.png
  3. BIN
      investment/images3/down-back.png
  4. BIN
      investment/images3/down.png
  5. BIN
      investment/images3/group.png
  6. BIN
      investment/images3/light.png
  7. BIN
      investment/images3/small.png
  8. 20 38
      investment/investHome.html
  9. 192 0
      investment/investHome3.html
  10. 72 4
      investment/js/investHome.js
  11. 19 19
      investment/js/investHome2.js
  12. 777 0
      investment/js/investHome3.js
  13. 0 0
      investment/libs/datav.min2.js
  14. 0 0
      investment/libs/vue-seamless-scroll.min.js
  15. 4 0
      investment/styles/investHome.css
  16. 777 0
      investment/styles/investHome3.css
  17. 8 8
      manpower/index.html
  18. 1 1
      manpower/index2.html
  19. 1 1
      manpower/js/data2.js
  20. 2 2
      manpower/js/data3.js
  21. 2 2
      manpower/js/data4.js
  22. 49 51
      manpower/js/fjx.js
  23. 0 0
      manpower/js/index.js
  24. 0 0
      manpower/js/index2.js
  25. 0 0
      manpower/js/index3.js
  26. 0 0
      manpower/js/index4.js
  27. 20 16
      manpower/styles/index.css

BIN
investment/images3/back-big.png
View File


BIN
investment/images3/big.png
View File


BIN
investment/images3/down-back.png
View File


BIN
investment/images3/down.png
View File


BIN
investment/images3/group.png
View File


BIN
investment/images3/light.png
View File


BIN
investment/images3/small.png
View File


+ 20 - 38
investment/investHome.html
View File 

@@ -15,6 +15,8 @@
 
     <script src="./libs/element-ui@2.15.9.js"></script>
 
     <script src="./libs/axios.min.js"></script>
 
     <script src="./js/request.js"></script>
 
+    <script src="./libs/vue-seamless-scroll.min.js"></script>
 
+    <script src="./libs/echarts-tooltip-carousel.js"></script>
 
   </head>
 
   <body>
 
     <div id="app">
 
@@ -50,7 +52,7 @@
 
                         <i class="el-icon-more"></i>
 
                       </p>
 
                       <p>
 
-                        <i><span class="num">1324.08</span>亿</i>
 
+                        <i><span class="num">{{numFormat(1324.08)}}</span>亿</i>
 
                         <!-- <span class="change"><img src="./images/down.png" /> 12.1%</span> -->
 
                       </p>
 
                     </div>
 
@@ -60,7 +62,7 @@
 
                         <i class="el-icon-more"></i>
 
                       </p>
 
                       <p>
 
-                        <i><span class="num">442</span>个</i>
 
+                        <i><span class="num">{{numFormat(442)}}</span>个</i>
 
                         <!-- <span class="change"><img src="./images/down.png" /> 12.1%</span> -->
 
                       </p>
 
                     </div>
 
@@ -70,7 +72,7 @@
 
                         <i class="el-icon-more"></i>
 
                       </p>
 
                       <p>
 
-                        <i><span class="num">1169.91</span>亿</i>
 
+                        <i><span class="num">{{numFormat(1169.91)}}</span>亿</i>
 
                         <!-- <span class="change up"><img src="./images/up.png" /> 12.1%</span> -->
 
                       </p>
 
                     </div>
 
@@ -80,7 +82,7 @@
 
                         <i class="el-icon-more"></i>
 
                       </p>
 
                       <p>
 
-                        <i><span class="num">154.17</span>亿</i>
 
+                        <i><span class="num">{{numFormat(154.17)}}</span>亿</i>
 
                         <!-- <span class="change"><img src="./images/down.png" /> 12.1%</span> -->
 
                       </p>
 
                     </div>
 
@@ -169,40 +171,20 @@
 
                 <div class="panel-title">
 
                   <span class="text">投资额度分析</span>
 
                 </div>
 
-                <ul class="list content">
 
-                  <li class="list-item">
 
-                    <i>NO.1</i>
 
-                    <div class="flex1">
 
-                      <p>山西焦煤</p>
 
-                      <el-progress percentage="80" stroke-width="10" :show-text="false"></el-progress>
 
-                    </div>
 
-                    <span class="value">234亿</span>
 
-                  </li>
 
-                  <li class="list-item">
 
-                    <i>NO.2</i>
 
-                    <div class="flex1">
 
-                      <p>晋能控股</p>
 
-                      <el-progress percentage="70" stroke-width="10" :show-text="false"></el-progress>
 
-                    </div>
 
-                    <span class="value">234亿</span>
 
-                  </li>
 
-                  <li class="list-item">
 
-                    <i>NO.3</i>
 
-                    <div class="flex1">
 
-                      <p>华阳新材</p>
 
-                      <el-progress percentage="60" stroke-width="10" :show-text="false"></el-progress>
 
-                    </div>
 
-                    <span class="value">234亿</span>
 
-                  </li>
 
-                  <li class="list-item">
 
-                    <i>NO.4</i>
 
-                    <div class="flex1">
 
-                      <p>陆港国际</p>
 
-                      <el-progress percentage="50" stroke-width="10" :show-text="false"></el-progress>
 
-                    </div>
 
-                    <span class="value">234亿</span>
 
-                  </li>
 
-                </ul>
 
+                <div class="content">
 
+                  <vue-seamless-scroll :data="amountList" :class-option="classOption" class="warp">
 
+                    <ul class="list">
 
+                      <li class="list-item" v-for="(item,index) in amountList" ::key="index">
 
+                        <i>NO.{{index+1}}</i>
 
+                        <div class="flex1">
 
+                          <p>{{item.name}}</p>
 
+                          <el-progress :percentage="item.value / amountTotal * 100" stroke-width="10" :show-text="false"></el-progress>
 
+                        </div>
 
+                        <span class="value">{{item.value}}亿</span>
 
+                      </li>
 
+                    </ul>
 
+                  </vue-seamless-scroll>
 
+                </div>
 
               </div>
 
             </dv-border-box-8>
 
             <dv-border-box-8 :dur="12"

+ 192 - 0
investment/investHome3.html
View File 

@@ -0,0 +1,192 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+
 
+<head>
 
+  <meta charset="utf-8" />
 
+  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
 
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
 
+  <!-- 引入样式 -->
 
+  <link rel="stylesheet" href="./styles/element-ui@2.15.9.css" />
 
+  <!-- <link rel="stylesheet" href="./styles/normalize.css" /> -->
 
+  <link rel="stylesheet" href="./styles/investHome3.css" />
 
+  <!-- 引入js -->
 
+  <script src="./libs/vue@2.7.10.js"></script>
 
+  <script src="./libs/datav.min2.js"></script>
 
+  <script src="./libs/echarts.min.js"></script>
 
+  <script src="./libs/element-ui@2.15.9.js"></script>
 
+  <script src="./libs/axios.min.js"></script>
 
+  <script src="./js/request.js"></script>
 
+  <script src="./libs/echarts-tooltip-carousel.js"></script>
 
+</head>
 
+
 
+<body>
 
+  <div id="app">
 
+    <dv-full-screen-container>
 
+      <header class="my-header">
 
+        <span>投资管理数智中心</span>
 
+        <span class="right">{{time}}</span>
 
+      </header>
 
+      <div class="main">
 
+        <div class="top">
 
+          <div class="top-left">
 
+            <dv-border-box-8>
 
+              <div class="panel-title">
 
+                <span class="text">投资关键指标</span>
 
+              </div>
 
+              <div class="top-left-bottom flex items-center justify-between">
 
+                <div class="top-left-bottom-left flex items-center justify-center">
 
+                  <img src="./images3/light.png" alt="">
 
+                  <div class="num">651<span style="font-size: 14px;font-weight: normal;">个</span></div>
 
+                </div>
 
+                <div class="top-left-bottom-right flex items-center">
 
+                  <div ref="tl1" style="height:100%;width: 25%;"></div>
 
+                  <div ref="tl2" style="height:100%;width: 25%;"></div>
 
+                  <div ref="tl3" style="height:100%;width: 25%;"></div>
 
+                  <div ref="tl4" style="height:100%;width: 25%;"></div>
 
+                </div>
 
+              </div>
 
+            </dv-border-box-8>
 
+          </div>
 
+          <div class="top-right">
 
+            <dv-border-box-8>
 
+              <div class="panel-title">
 
+                <span class="text">投资额完成分析</span>
 
+              </div>
 
+              <div class="top-right-bottom">
 
+                <div id="aiQuality" class="mx-auto" style="width: 100%; height: 100%"></div>
 
+              </div>
 
+              <div class="downList  flex items-center justify-center">
 
+                <span>2023</span>
 
+                <img src="./images3/down.png" alt="">
 
+              </div>
 
+            </dv-border-box-8>
 
+          </div>
 
+        </div>
 
+        <div class="center">
 
+          <div class="center-right">
 
+            <dv-border-box-8>
 
+              <div class="panel-title">
 
+                <span class="text">两个转型</span>
 
+              </div>
 
+              <div class="center-right-bottom">
 
+                <div ref="cl1" style="height:100%;width: 100%;"></div>
 
+                <div class="center-right-bottom-right flex items-center justify-center flex-col">
 
+                  <img src="./images3/group.png" alt="">
 
+                  <div class="center-right-bottom-right-text">24.12<span style="font-size: 14px;">亿</span></div>
 
+                  <div style="height:20px;line-height: 20px">数字转型实际投资</div>
 
+                </div>
 
+              </div>
 
+            </dv-border-box-8>
 
+          </div>
 
+          <div class="center-center">
 
+            <dv-border-box-8>
 
+              <div class="panel-title">
 
+                <span class="text">重点项目进度</span>
 
+              </div>
 
+              <div class="center-center-bottom">
 
+                <div>
 
+                  <div><span style="color:#3AF7FE;margin-right: 10px;">按进度排序</span><span
 
+                      style="color:#B889EA">偏差率排序</span></div>
 
+                  <div class="center-center-bottom-list">
 
+                    <p>煤焦化矿井升级改造项目</p>
 
+                    <el-progress percentage="80" color="#FBE139" :show-text="true"></el-progress>
 
+                    <p>煤焦化矿井升级改造项目</p>
 
+                    <el-progress percentage="30" color="#FBE139" :show-text="true"></el-progress>
 
+                    <p>煤焦化矿井升级改造项目</p>
 
+                    <el-progress percentage="60" color="#FBE139" :show-text="true"></el-progress>
 
+                  </div>
 
+                </div>
 
+                <div class="center-center-bottom-right" style="margin-right: 10px;">
 
+                  <div></div>
 
+                  <div>总体偏离度</div>
 
+                  <div>+12%</div>
 
+                  <div>-5%</div>
 
+                  <div>+18%</div>
 
+                </div>
 
+              </div>
 
+            </dv-border-box-8>
 
+          </div>
 
+          <div class="center-left">
 
+            <dv-border-box-8>
 
+              <div class="panel-title">
 
+                <span class="text">项目风险画像</span>
 
+              </div>
 
+              <div class="center-left-bottom">
 
+                <div ref="cr1" style="height:100%;width: 100%;"></div>
 
+                <div class="flex justify-center items-center">
 
+                  <div class="center-left-bottom-list flex justify-center items-center flex-col">
 
+                    <span>维度</span>
 
+                    <span>进度</span>
 
+                    <span>质量</span>
 
+                    <span>预算</span>
 
+                    <span>证照</span>
 
+                    <span>合同</span>
 
+                  </div>
 
+                </div>
 
+              </div>
 
+            </dv-border-box-8>
 
+          </div>
 
+        </div>
 
+        <div class="footer">
 
+          <div class="footer-right">
 
+            <dv-border-box-8>
 
+              <div class="panel-title">
 
+                <span class="text">五个一体化</span>
 
+              </div>
 
+              <div class="footer-right-bottom flex justify-around flex-col">
 
+                <p>煤焦化矿井升级改造项目</p>
 
+                <div class="flex items-center">
 
+                  <el-progress percentage="80" color="#FBE139" :show-text="false"></el-progress>
 
+                  <span style="margin-left: 20px;">230.10亿</span>
 
+                </div>
 
+                <p>煤炭和新能源一体化</p>
 
+                <div class="flex items-center">
 
+                  <el-progress percentage="50" color="#FBE139" :show-text="false"></el-progress>
 
+                  <span style="margin-left: 20px;">200.1亿</span>
 
+                </div>
 
+                <p>煤炭和新能源一体化</p>
 
+                <div class="flex items-center">
 
+                  <el-progress percentage="20" color="#FBE139" :show-text="false"></el-progress>
 
+                  <span style="margin-left: 20px;">160亿</span>
 
+                </div>
 
+                <p>煤炭和数字技术一体化</p>
 
+                <div class="flex items-center">
 
+                  <el-progress percentage="40" color="#FBE139" :show-text="false"></el-progress>
 
+                  <span style="margin-left: 20px;">143亿</span>
 
+                </div>
 
+                <p>煤炭和降碳一体化</p>
 
+                <div class="flex items-center">
 
+                  <el-progress percentage="10" color="#FBE139" :show-text="false"></el-progress>
 
+                  <span style="margin-left: 20px;">140亿</span>
 
+                </div>
 
+              </div>
 
+            </dv-border-box-8>
 
+          </div>
 
+          <div class="footer-center">
 
+            <dv-border-box-8>
 
+              <div class="panel-title">
 
+                <span class="text">项目成本分析</span>
 
+              </div>
 
+              <div class="footer-center-bottom">
 
+                <div id="aiQuality2" class="mx-auto" style="width: 100%; height: 100%"></div>
 
+              </div>
 
+            </dv-border-box-8>
 
+          </div>
 
+          <div class="footer-left">
 
+            <dv-border-box-8>
 
+              <div class="panel-title">
 
+                <span class="text">风险事项列表</span>
 
+              </div>
 
+              <div class="footer-left-bottom">
 
+                <dv-scroll-board :config="config5" style="width: 100%; height: 80%" />
 
+              </div>
 
+            </dv-border-box-8>
 
+          </div>
 
+        </div>
 
+      </div>
 
+    </dv-full-screen-container>
 
+  </div>
 
+  <script src="./js/investHome3.js"></script>
 
+</body>
 
+
 
+</html>

+ 72 - 4
investment/js/investHome.js
View File 

@@ -49,9 +49,46 @@ let app = new Vue({
 
         { name: '水控集团' },
 
         { name: '太重集团' },
 
       ],
 
+      amountList: [
 
+        {
 
+          name: '山西焦煤',
 
+          value: '283.42'
 
+        },
 
+        {
 
+          name: '晋能控股',
 
+          value: '622.15'
 
+        },
 
+        {
 
+          name: '华阳新材',
 
+          value: '251.91'
 
+        },
 
+        {
 
+          name: '潞安化工',
 
+          value: '163.19'
 
+        },
 
+        {
 
+          name: '华新燃气',
 
+          value: '46.44'
 
+        },
 
+        {
 
+          name: '华远陆港',
 
+          value: '32.07'
 
+        },
 
+        {
 
+          name: '汾酒集团',
 
+          value: '49.99'
 
+        },
 
+      ],
 
+      amountTotal: 0,
 
+      classOption: {
 
+        step: 0.5
 
+      }
 
     }
 
   },
 
   created () {
 
+    this.amountList.map(item=> {
 
+      this.amountTotal += Number(item.value)
 
+    })
 
     this.time = formatDate()
 
     this.timer = setInterval(() => {
 
       this.time = formatDate()
 
@@ -70,6 +107,25 @@ let app = new Vue({
 
     this.initChinaChart()
 
   },
 
   methods: {
 
+    numFormat (value) {
 
+      if (!value) return '0'
 
+      var intPart = Number(value).toFixed(0) // 获取整数部分
 
+      var intPartFormat = intPart.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') // 将整数部分逢三一断
 
+      var floatPart = '.00' // 预定义小数部分
 
+      var value2Array = value.toString().split('.')
 
+      // =2表示数据有小数位
 
+      if (value2Array.length === 2) {
 
+        floatPart = value2Array[1].toString() // 拿到小数部分
 
+        if (floatPart.length === 1) {
 
+          // 补0
 
+          return intPartFormat + '.' + floatPart + '0'
 
+        } else {
 
+          return intPartFormat + '.' + floatPart
 
+        }
 
+      } else {
 
+        return intPartFormat
 
+      }
 
+    },
 
     convertData (data) {
 
       var res = []
 
       for (var i = 0; i < data.length; i++) {
 
@@ -331,8 +387,7 @@ let app = new Vue({
 
       })
 
       // <p>当前阶段：<span>可论证阶段</span></p>
 
       // <p>时间节点：<span>2021.10-2022.10</span></p>
 
-
 
-      myChart.setOption({
 
+      let option = {
 
         tooltip: {
 
           padding: 15,
 
           enterable: true,
 
@@ -429,7 +484,7 @@ let app = new Vue({
 
             type: 'map',
 
             map: this.mapName,
 
             geoIndex: 0,
 
-            aspectScale: 0.75, //长宽比
 
+            aspectScale: 1.5, //长宽比
 
             showLegendSymbol: true, // 存在legend时显示
 
             label: {
 
               normal: {
 
@@ -519,7 +574,8 @@ let app = new Vue({
 
             data: moveLine.normal,
 
           },
 
         ],
 
-      })
 
+      }
 
+      myChart.setOption(option)
 
     },
 
     initChartL1 () {
 
       let myChart = echarts.init(this.$refs['echartL1'])
 
@@ -558,6 +614,10 @@ let app = new Vue({
 
         ],
 
       }
 
       myChart.setOption(option)
 
+      tools.loopShowTooltip(myChart, option, {
 
+        nterval: 2000,
 
+        loopSeries: true,
 
+      })
 
     },
 
     initChartL2 () {
 
       let myChart = echarts.init(this.$refs['echartL2'])
 
@@ -730,6 +790,10 @@ let app = new Vue({
 
         ],
 
       }
 
       myChart.setOption(option)
 
+      tools.loopShowTooltip(myChart, option, {
 
+        nterval: 2000,
 
+        loopSeries: true,
 
+      })
 
     },
 
     initChartR1 () {
 
       let myChart = echarts.init(this.$refs['echartR1'])
 
@@ -857,6 +921,10 @@ let app = new Vue({
 
         ],
 
       }
 
       myChart.setOption(option)
 
+      tools.loopShowTooltip(myChart, option, {
 
+        nterval: 2000,
 
+        loopSeries: true,
 
+      })
 
     },
 
   },
 
 })

+ 19 - 19
investment/js/investHome2.js
View File 

@@ -1,6 +1,6 @@
 
 let app = new Vue({
 
   el: '#app',
 
-  data() {
 
+  data () {
 
     return {
 
       year: '2022',
 
       time: '',
 
@@ -49,18 +49,18 @@ let app = new Vue({
 
       ],
 
     }
 
   },
 
-  created() {
 
+  created () {
 
     this.time = formatDate()
 
     this.timer = setInterval(() => {
 
       this.time = formatDate()
 
     }, 1000)
 
   },
 
-  beforeDestroy() {
 
+  beforeDestroy () {
 
     if (this.timer) {
 
       clearInterval(this.timer);
 
     }
 
   },
 
-  mounted() {
 
+  mounted () {
 
     // 左侧图表
 
     setTimeout(() => {
 
       this.initChartL1()
 
@@ -74,7 +74,7 @@ let app = new Vue({
 
     }, 0)
 
   },
 
   methods: {
 
-    convertData(data) {
 
+    convertData (data) {
 
       var res = []
 
       for (var i = 0; i < data.length; i++) {
 
         var geoCoord = this.geoCoordMap[data[i].name]
 
@@ -87,7 +87,7 @@ let app = new Vue({
 
       }
 
       return res
 
     },
 
-    initChinaChart() {
 
+    initChinaChart () {
 
       var data = [
 
         { name: '吕梁市', value: 150 },
 
         { name: '大同市', value: 190 },
 
@@ -523,7 +523,7 @@ let app = new Vue({
 
         ],
 
       })
 
     },
 
-    initChartL1() {
 
+    initChartL1 () {
 
       let myChart = echarts.init(this.$refs['echartL1'])
 
       let option = {
 
         title: {
 
@@ -552,7 +552,7 @@ let app = new Vue({
 
           {
 
             name: '',
 
             type: 'pie',
 
-            radius: ['50%','70%',],
 
+            radius: ['50%', '70%',],
 
             center: ['50%', '45%'],
 
             itemStyle: {
 
               normal: {
 
@@ -582,7 +582,7 @@ let app = new Vue({
 
         loopSeries: true,
 
       })
 
     },
 
-    initChartL2() {
 
+    initChartL2 () {
 
       let myChart = echarts.init(this.$refs['echartL2'])
 
       var value = 0.45;
 
       var data = [value];
 
@@ -653,7 +653,7 @@ let app = new Vue({
 
       }
 
       myChart.setOption(option)
 
     },
 
-    initChartL3() {
 
+    initChartL3 () {
 
       let myChart = echarts.init(this.$refs['echartL3'])
 
       let option = {
 
         tooltip: {
 
@@ -778,7 +778,7 @@ let app = new Vue({
 
         loopSeries: true,
 
       })
 
     },
 
-    initChartL4() {
 
+    initChartL4 () {
 
       let myChart = echarts.init(this.$refs['echartL4'])
 
       let option = {
 
         title: {
 
@@ -834,7 +834,7 @@ let app = new Vue({
 
         loopSeries: true,
 
       })
 
     },
 
-    initChartR1() {
 
+    initChartR1 () {
 
       let myChart = echarts.init(this.$refs['echartR1'])
 
       let option = {
 
         title: {
 
@@ -890,7 +890,7 @@ let app = new Vue({
 
         loopSeries: true,
 
       })
 
     },
 
-    initChartR2() {
 
+    initChartR2 () {
 
       let myChart = echarts.init(this.$refs['echartR2'])
 
       let option = {
 
         title: {
 
@@ -946,7 +946,7 @@ let app = new Vue({
 
         loopSeries: true,
 
       })
 
     },
 
-    initChartR3() {
 
+    initChartR3 () {
 
       let myChart = echarts.init(this.$refs['echartR3'])
 
       let option = {
 
         title: {
 
@@ -1037,7 +1037,7 @@ let app = new Vue({
 
             },
 
             itemStyle: {
 
               normal: {
 
-                color: 'red'
 
+                color: '#45DAD1'
 
               }
 
             },
 
             data: [
 
@@ -1066,7 +1066,7 @@ let app = new Vue({
 
             },
 
             itemStyle: {
 
               normal: {
 
-                color: '#C94C15'
 
+                color: '#40A9FF'
 
               }
 
             },
 
             data: [
 
@@ -1084,7 +1084,7 @@ let app = new Vue({
 
         loopSeries: true,
 
       })
 
     },
 
-    initChartR4() {
 
+    initChartR4 () {
 
       let myChart = echarts.init(this.$refs['echartR4'])
 
       let option = {
 
         title: {
 
@@ -1175,7 +1175,7 @@ let app = new Vue({
 
             },
 
             itemStyle: {
 
               normal: {
 
-                color: 'red'
 
+                color: '#45DAD1'
 
               }
 
             },
 
             data: [
 
@@ -1204,7 +1204,7 @@ let app = new Vue({
 
             },
 
             itemStyle: {
 
               normal: {
 
-                color: '#C94C15'
 
+                color: '#40A9FF'
 
               }
 
             },
 
             data: [

+ 777 - 0
investment/js/investHome3.js
View File 

@@ -0,0 +1,777 @@
 
+let app = new Vue({
 
+  el: '#app',
 
+  data () {
 
+    return {
 
+      time: '',
 
+      timer: '',
 
+      config5: {
 
+        waitTime: 2000,
 
+        header: ["风险类型", "风险说明", '提出人', '时间', '风险等级'],
 
+        data: [
 
+          ["风险等级", "WBS:012工程", "杨志宇", "2022.9.12", '<span class="lightOut"><span class="blue">一级</span></span>'],
 
+          ["风险等级", "WBS:012工程", "杨志宇", "2022.9.12", '<span class="lightOut"><span class="yellow">二级</span></span>'],
 
+          ["风险等级", "WBS:012工程", "杨志宇", "2022.9.12", '<span class="lightOut"><span class="pink">三级</span></span>'],
 
+          ["风险等级", "WBS:012工程", "杨志宇", "2022.9.12", '<span class="lightOut"><span class="blue">一级</span></span>'],
 
+          ["风险等级", "WBS:012工程", "杨志宇", "2022.9.12", '<span class="lightOut"><span class="yellow">二级</span></span>'],
 
+          ["风险等级", "WBS:012工程", "杨志宇", "2022.9.12", '<span class="lightOut"><span class="pink">三级</span></span>']
 
+        ],
 
+        align: ["center", "center", "center", "center", "center"],
 
+        headerBGC: "#1C537D",
 
+        oddRowBGC: "#09335C"
 
+      },
 
+    }
 
+  },
 
+  created () {
 
+    this.time = formatDate()
 
+    this.timer = setInterval(() => {
 
+      this.time = formatDate()
 
+    }, 1000)
 
+  },
 
+  beforeDestroy () {
 
+    if (this.timer) {
 
+      clearInterval(this.timer);
 
+    }
 
+  },
 
+  mounted () {
 
+    setTimeout(() => {
 
+      this.initChartL1()
 
+      this.initChartL2()
 
+      this.initChartL3()
 
+      this.initChartL4()
 
+      this.initChartL5()
 
+      this.initChartL6()
 
+      this.aiQualityECharts();
 
+      this.aiQualityECharts2();
 
+    })
 
+  },
 
+  methods: {
 
+    initChartL1 () {
 
+      let myChart = echarts.init(this.$refs['tl1'])
 
+      let option = {
 
+        grid: {
 
+          top: 0,
 
+          right: 0,
 
+          left: 0,
 
+          bottom: 0,
 
+        },
 
+        tooltip: {
 
+          trigger: 'item',
 
+        },
 
+        color: ['#6682f5', '#40A9FF'],
 
+        legend: {
 
+          // icon: 'circle',
 
+          bottom: 0,
 
+          left: 'center',
 
+          // itemHeight: 10,
 
+          // itemWidth: 10,
 
+          textStyle: {
 
+            color: '#9DB9EB',
 
+          },
 
+        },
 
+        graphic: {
 
+          elements: [{
 
+            type: "text",
 
+            left: "center",
 
+            top: "77%",
 
+            style: {
 
+              text: "投资类别",
 
+              textAlign: "center",
 
+              fill: "#fff",
 
+              fontSize: 15,
 
+              fontWeight: 500
 
+            }
 
+          }]
 
+        },
 
+        series: [
 
+          {
 
+            center: ['50%', '40%'],
 
+            radius: ['45%', '60%'],
 
+            name: '',
 
+            type: 'pie',
 
+            labelLine: {
 
+              normal: {
 
+                lineStyle: {
 
+                  width: 1,
 
+                },
 
+              },
 
+            },
 
+            label: {
 
+              show: false,
 
+              position: 'center'
 
+            },
 
+            data: [
 
+              { value: 1048, name: '数据1' },
 
+              { value: 735, name: '数据2' }
 
+            ],
 
+          },
 
+        ],
 
+      }
 
+      tools.loopShowTooltip(myChart, option, {
 
+        interval: 2000,
 
+        loopSeries: true,
 
+      });
 
+      myChart.setOption(option)
 
+    },
 
+    initChartL2 () {
 
+      let myChart = echarts.init(this.$refs['tl2'])
 
+      let option = {
 
+        grid: {
 
+          top: 0,
 
+          right: 0,
 
+          left: 0,
 
+          bottom: 0,
 
+        },
 
+        tooltip: {
 
+          trigger: 'item',
 
+        },
 
+        color: ['#40A9FF', '#45DAD1'],
 
+        legend: {
 
+          bottom: 0,
 
+          left: 'center',
 
+          textStyle: {
 
+            color: '#9DB9EB',
 
+          },
 
+        },
 
+        graphic: {
 
+          elements: [{
 
+            type: "text",
 
+            left: "center",
 
+            top: "77%",
 
+            style: {
 
+              text: "投资阶段",
 
+              textAlign: "center",
 
+              fill: "#fff",
 
+              fontSize: 15,
 
+              fontWeight: 500
 
+            }
 
+          }]
 
+        },
 
+        series: [
 
+          {
 
+            center: ['50%', '40%'],
 
+            radius: ['45%', '60%'],
 
+            name: '',
 
+            type: 'pie',
 
+            labelLine: {
 
+              normal: {
 
+                lineStyle: {
 
+                  width: 1,
 
+                },
 
+              },
 
+            },
 
+            label: {
 
+              show: false,
 
+              position: 'center'
 
+            },
 
+            data: [
 
+              { value: 1048, name: '数据1' },
 
+              { value: 735, name: '数据2' }
 
+            ],
 
+          },
 
+        ],
 
+      }
 
+      tools.loopShowTooltip(myChart, option, {
 
+        interval: 2500,
 
+        loopSeries: true,
 
+      });
 
+      myChart.setOption(option)
 
+    },
 
+    initChartL3 () {
 
+      let myChart = echarts.init(this.$refs['tl3'])
 
+      let option = {
 
+        grid: {
 
+          top: 0,
 
+          right: 0,
 
+          left: 0,
 
+          bottom: 0,
 
+        },
 
+        tooltip: {
 
+          trigger: 'item',
 
+        },
 
+        color: ['#40A9FF', '#8BA2FF'],
 
+        legend: {
 
+          bottom: 0,
 
+          left: 'center',
 
+          textStyle: {
 
+            color: '#9DB9EB',
 
+          },
 
+        },
 
+        graphic: {
 
+          elements: [{
 
+            type: "text",
 
+            left: "center",
 
+            top: "77%",
 
+            style: {
 
+              text: "管理类别",
 
+              textAlign: "center",
 
+              fill: "#fff",
 
+              fontSize: 15,
 
+              fontWeight: 500
 
+            }
 
+          }]
 
+        },
 
+        series: [
 
+          {
 
+            center: ['50%', '40%'],
 
+            radius: ['45%', '60%'],
 
+            name: '',
 
+            type: 'pie',
 
+            labelLine: {
 
+              normal: {
 
+                lineStyle: {
 
+                  width: 1,
 
+                },
 
+              },
 
+            },
 
+            label: {
 
+              show: false,
 
+              position: 'center'
 
+            },
 
+            data: [
 
+              { value: 1048, name: '数据1' },
 
+              { value: 735, name: '数据2' }
 
+            ],
 
+          },
 
+        ],
 
+      }
 
+      tools.loopShowTooltip(myChart, option, {
 
+        interval: 3000,
 
+        loopSeries: true,
 
+      });
 
+      myChart.setOption(option)
 
+    },
 
+    initChartL4 () {
 
+      let myChart = echarts.init(this.$refs['tl4'])
 
+      let option = {
 
+        grid: {
 
+          top: 0,
 
+          right: 0,
 
+          left: 0,
 
+          bottom: 0,
 
+        },
 
+        tooltip: {
 
+          trigger: 'item',
 
+        },
 
+        color: ['#45DAD1', '#40A9FF'],
 
+        legend: {
 
+          bottom: 0,
 
+          left: 'center',
 
+          textStyle: {
 
+            color: '#9DB9EB',
 
+          },
 
+        },
 
+        graphic: {
 
+          elements: [{
 
+            type: "text",
 
+            left: "center",
 
+            top: "77%",
 
+            style: {
 
+              text: "投资领域",
 
+              textAlign: "center",
 
+              fill: "#fff",
 
+              fontSize: 15,
 
+              fontWeight: 500
 
+            }
 
+          }]
 
+        },
 
+        series: [
 
+          {
 
+            center: ['50%', '40%'],
 
+            radius: ['45%', '60%'],
 
+            name: '',
 
+            type: 'pie',
 
+            labelLine: {
 
+              normal: {
 
+                lineStyle: {
 
+                  width: 1,
 
+                },
 
+              },
 
+            },
 
+            label: {
 
+              show: false,
 
+              position: 'center'
 
+            },
 
+            data: [
 
+              { value: 1048, name: '数据1' },
 
+              { value: 735, name: '数据2' }
 
+            ],
 
+          },
 
+        ],
 
+      }
 
+      tools.loopShowTooltip(myChart, option, {
 
+        interval: 3500,
 
+        loopSeries: true,
 
+      });
 
+      myChart.setOption(option)
 
+    },
 
+    initChartL5 () {
 
+      let myChart = echarts.init(this.$refs['cl1'])
 
+      let option = {
 
+        grid: {
 
+          top: 0,
 
+          right: 0,
 
+          left: 0,
 
+          bottom: 0,
 
+        },
 
+        tooltip: {
 
+          trigger: 'item',
 
+        },
 
+        color: ['#45DAD1', '#40A9FF'],
 
+        legend: {
 
+          bottom: 0,
 
+          left: 'center',
 
+          textStyle: {
 
+            color: '#9DB9EB',
 
+          },
 
+        },
 
+        graphic: {
 
+          elements: [{
 
+            type: "text",
 
+            left: "center",
 
+            top: "77%",
 
+            style: {
 
+              text: "投资情况",
 
+              textAlign: "center",
 
+              fill: "#fff",
 
+              fontSize: 15,
 
+              fontWeight: 500
 
+            }
 
+          }]
 
+        },
 
+        series: [
 
+          {
 
+            center: ['50%', '40%'],
 
+            radius: ['45%', '60%'],
 
+            name: '',
 
+            type: 'pie',
 
+            labelLine: {
 
+              normal: {
 
+                lineStyle: {
 
+                  width: 1,
 
+                },
 
+              },
 
+            },
 
+            label: {
 
+              show: false,
 
+              position: 'center'
 
+            },
 
+            data: [
 
+              { value: 1048, name: '数据1' },
 
+              { value: 735, name: '数据2' }
 
+            ],
 
+          },
 
+        ],
 
+      }
 
+      tools.loopShowTooltip(myChart, option, {
 
+        interval: 4000,
 
+        loopSeries: true,
 
+      });
 
+      myChart.setOption(option)
 
+    },
 
+    initChartL6 () {
 
+      let myChart = echarts.init(this.$refs['cr1'])
 
+      option = {
 
+        title: {
 
+          text: ''
 
+        },
 
+        legend: {
 
+          data: ['类型1', '类型2', '类型3', '类型4', '类型5'],
 
+          bottom: 0,
 
+          left: 'center',
 
+          textStyle: {
 
+            color: '#9DB9EB',
 
+          },
 
+        },
 
+        splitArea: { // 坐标轴在 grid 区域中的分隔区域，默认不显示。
 
+          show: true,
 
+          areaStyle: { // 分隔区域的样式设置。
 
+            color: ['yellow'],
 
+            // 分隔区域颜色。分隔区域会按数组中颜色的顺序依次循环设置颜色。默认是一个深浅的间隔色。
 
+          }
 
+        },
 
+        radar: {
 
+          // shape: 'circle',
 
+          center: ['50%', '50%'],
 
+          radius: 60,
 
+          indicator: [
 
+            { name: '类型1', max: 100000 },
 
+            { name: '类型2', max: 100000 },
 
+            { name: '类型3', max: 100000 },
 
+            { name: '类型4', max: 100000 },
 
+            { name: '类型5', max: 100000 },
 
+          ],
 
+          axisLine: {  // 设置雷达图中间射线的颜色
 
+            lineStyle: {
 
+              color: '#c0c0c0',
 
+            },
 
+          },
 
+          splitLine: { //网格颜色设置
 
+            show: true,
 
+            lineStyle: {
 
+              width: 1,
 
+              color: '#1e83e4',
 
+            },
 
+          },
 
+          splitArea: {  //设置图表颜色，show的值为true
 
+            show: false,
 
+            areaStyle: {
 
+              // color:"#c1ddf8", //一般设置方式
 
+              //设置渐变背景色 new echarts.graphic.LinearGradient(a,b,c,d,arr)
 
+              //a ,b,c,d值可为0，1 a:1表示arr中的颜色右到左；c:1 arr中的颜色左到右
 
+              //b:1表示arr中的颜色下到上；d:1表示arr中的颜色上到下
 
+              color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
 
+                { offset: 0, color: '#c1ddf8' }, // 0% 处的颜色 
+                { offset: 1, color: '#1e83e4' }// 100% 处的颜色
 
+              ], false)
 
+            }
 
+          }
 
+        },
 
+        series: [
 
+          {
 
+            name: '',
 
+            type: 'radar',
 
+            symbol: 'circle', // 单个数值点的样式，还可以取值'rect','angle'等
 
+            symbolSize: 0, // 数值点的大小
 
+            data: [
 
+              {
 
+                value: [4200, 3000, 20000, 35000, 50000, 18000],
 
+                name: '类型1',
 
+                itemStyle: { //该数值区域样式设置
 
+                  normal: {
 
+                    color: '#2CC6FF', //背景颜色，还需设置areaStyle
 
+                    lineStyle: {
 
+                      color: '#2CC6FF', //边框颜色
 
+                    },
 
+                  },
 
+                },
 
+                label: {  //显示value中具体的数值
 
+                  normal: {
 
+                    show: false,
 
+                    textStyle: {  //更改数值样式
 
+                      color: '#43EDE3'
 
+                    }
 
+                  },
 
+                },
 
+                areaStyle: { //设置区域背景颜色透明度
 
+                  normal: {
 
+                    width: 1,
 
+                    opacity: 0.8,
 
+                  },
 
+                },
 
+              },
 
+              {
 
+                value: [8000, 3000, 38000, 76000, 32000, 71000],
 
+                name: '类型2',
 
+                itemStyle: { //该数值区域样式设置
 
+                  normal: {
 
+                    color: '#D87AFF', //背景颜色，还需设置areaStyle
 
+                    lineStyle: {
 
+                      color: '#2CC6FF', //边框颜色
 
+                    },
 
+                  },
 
+                },
 
+                label: {  //显示value中具体的数值
 
+                  normal: {
 
+                    show: false,
 
+                    textStyle: {  //更改数值样式
 
+                      color: '#43EDE3'
 
+                    }
 
+                  },
 
+                },
 
+                areaStyle: { //设置区域背景颜色透明度
 
+                  normal: {
 
+                    width: 1,
 
+                    opacity: 0.8,
 
+                  },
 
+                },
 
+              }
 
+            ]
 
+          }
 
+        ]
 
+      };
 
+      tools.loopShowTooltip(myChart, option, {
 
+        interval: 2000,
 
+        loopSeries: true,
 
+      });
 
+      myChart.setOption(option)
 
+    },
 
+    aiQualityECharts () {
 
+      let chart = echarts.init(document.getElementById("aiQuality"));
 
+      let option = {
 
+        grid: {
 
+          top: 35,
 
+          right: 40,
 
+          left: 60,
 
+          bottom: 20,
 
+        },
 
+        tooltip: {
 
+          show: true,
 
+          trigger: "axis",
 
+          axisPointer: {
 
+            // 坐标轴指示器，坐标轴触发有效
 
+            type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
 
+          },
 
+        },
 
+        xAxis: {
 
+          data: ["集团本部", "晋能控股", "潞安化工", "华阳新材", "山西文旅", "太重集团", "山焦人力", "华远陆港", "汾酒集团", "云时代"],
 
+          axisTick: {
 
+            show: false,
 
+          },
 
+          // x轴的字体颜色
 
+          axisLabel: {
 
+            textStyle: {
 
+              color: "white",
 
+            },
 
+          },
 
+          //y轴线的颜色以及宽度
 
+          axisLine: {
 
+            show: true,
 
+            lineStyle: {
 
+              color: "#1E5389",
 
+              width: 1,
 
+              type: "solid",
 
+            },
 
+          },
 
+        },
 
+        yAxis: {
 
+          name: '亿元',
 
+          nameTextStyle: {//y轴上方单位的颜色
 
+            color: '#fff',
 
+          },
 
+          axisTick: {
 
+            lineStyle: {
 
+              color: "#18416F",
 
+            },
 
+          },
 
+          // y轴的字体颜色
 
+          axisLabel: {
 
+            textStyle: {
 
+              color: "white",
 
+            },
 
+          },
 
+          splitLine: {
 
+            show: false,
 
+            lineStyle: {
 
+              color: "#204561",
 
+              width: 1,
 
+              type: "dotted",
 
+            },
 
+          },
 
+          //y轴线的颜色以及宽度
 
+          axisLine: {
 
+            show: true,
 
+            lineStyle: {
 
+              color: "#1E5389",
 
+              width: 1,
 
+              type: "solid",
 
+            },
 
+          },
 
+        },
 
+        series: [
 
+          {
 
+            name: "计划投资额",
 
+            type: "bar",
 
+            data: [1200, 680, 562, 268, 717, 843, 987, 126, 723, 569],
 
+            showBackground: false,
 
+            backgroundStyle: {
 
+              color: "#18416F",
 
+            },
 
+            barWidth: "10%",
 
+            itemStyle: {
 
+              barBorderRadius: [10, 10, 0, 0],
 
+              color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
 
+                {
 
+                  offset: 0,
 
+                  color: "#132543",
 
+                }, //柱图渐变色
 
+                {
 
+                  offset: 1,
 
+                  color: "#897DFF",
 
+                },
 
+              ]),
 
+            },
 
+          },
 
+          {
 
+            name: "实际投资额",
 
+            type: "bar",
 
+            data: [658, 1125, 658, 999, 643, 675, 743, 724, 733, 725],
 
+            showBackground: false,
 
+            backgroundStyle: {
 
+              color: "#18416F",
 
+            },
 
+            barWidth: "10%",
 
+            itemStyle: {
 
+              barBorderRadius: [10, 10, 0, 0],
 
+              color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
 
+                {
 
+                  offset: 0,
 
+                  color: "#132543",
 
+                }, //柱图渐变色
 
+                {
 
+                  offset: 1,
 
+                  color: "#FED95B",
 
+                },
 
+              ]),
 
+            },
 
+          },
 
+        ],
 
+        legend: {
 
+          data: ["计划投资额", "实际投资额"],
 
+          textStyle: {
 
+            // 图列内容样式
 
+            color: "#fff", // 字体颜色
 
+            // fontSize: "10",
 
+          },
 
+          right: 30,
 
+          icon: "roundRect",
 
+          // 小图标的宽高
 
+          itemHeight: 5,
 
+        },
 
+      };
 
+      chart.setOption(option);
 
+      tools.loopShowTooltip(chart, option, {
 
+        interval: 2000,
 
+        loopSeries: true,
 
+      });
 
+    },
 
+    aiQualityECharts2 () {
 
+      let chart = echarts.init(document.getElementById("aiQuality2"));
 
+      let option = {
 
+        grid: {
 
+          top: 35,
 
+          right: 40,
 
+          left: 60,
 
+          bottom: 20,
 
+        },
 
+        tooltip: {
 
+          show: true,
 
+          trigger: "axis",
 
+          axisPointer: {
 
+            // 坐标轴指示器，坐标轴触发有效
 
+            type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
 
+          },
 
+        },
 
+        xAxis: {
 
+          data: ["工程费用", "设备费用", "人员费用", "材料费用", "管理费用"],
 
+          axisTick: {
 
+            show: false,
 
+          },
 
+          // x轴的字体颜色
 
+          axisLabel: {
 
+            textStyle: {
 
+              color: "white",
 
+            },
 
+          },
 
+          //y轴线的颜色以及宽度
 
+          axisLine: {
 
+            show: true,
 
+            lineStyle: {
 
+              color: "#1E5389",
 
+              width: 1,
 
+              type: "solid",
 
+            },
 
+          },
 
+        },
 
+        yAxis: {
 
+          name: '亿元',
 
+          nameTextStyle: {//y轴上方单位的颜色
 
+            color: '#fff',
 
+          },
 
+          axisTick: {
 
+            lineStyle: {
 
+              color: "#18416F",
 
+            },
 
+          },
 
+          // y轴的字体颜色
 
+          axisLabel: {
 
+            textStyle: {
 
+              color: "white",
 
+            },
 
+          },
 
+          splitLine: {
 
+            show: false,
 
+            lineStyle: {
 
+              color: "#204561",
 
+              width: 1,
 
+              type: "dotted",
 
+            },
 
+          },
 
+          //y轴线的颜色以及宽度
 
+          axisLine: {
 
+            show: true,
 
+            lineStyle: {
 
+              color: "#1E5389",
 
+              width: 1,
 
+              type: "solid",
 
+            },
 
+          },
 
+        },
 
+        series: [
 
+          {
 
+            name: "预算金额",
 
+            type: "bar",
 
+            data: [843, 987, 126, 723, 569],
 
+            showBackground: false,
 
+            backgroundStyle: {
 
+              color: "#18416F",
 
+            },
 
+            barWidth: "10%",
 
+            itemStyle: {
 
+              barBorderRadius: [10, 10, 0, 0],
 
+              color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
 
+                {
 
+                  offset: 0,
 
+                  color: "#132543",
 
+                }, //柱图渐变色
 
+                {
 
+                  offset: 1,
 
+                  color: "#40A9FF",
 
+                },
 
+              ]),
 
+            },
 
+          },
 
+          {
 
+            name: "实际金额",
 
+            type: "bar",
 
+            data: [675, 743, 724, 733, 725],
 
+            showBackground: false,
 
+            backgroundStyle: {
 
+              color: "#18416F",
 
+            },
 
+            barWidth: "10%",
 
+            itemStyle: {
 
+              barBorderRadius: [10, 10, 0, 0],
 
+              color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
 
+                {
 
+                  offset: 0,
 
+                  color: "#132543",
 
+                }, //柱图渐变色
 
+                {
 
+                  offset: 1,
 
+                  color: "#45DAD1",
 
+                },
 
+              ]),
 
+            },
 
+          },
 
+        ],
 
+        legend: {
 
+          data: ["预算金额", "实际金额"],
 
+          textStyle: {
 
+            // 图列内容样式
 
+            color: "#fff", // 字体颜色
 
+            // fontSize: "10",
 
+          },
 
+          right: 30,
 
+          icon: "roundRect",
 
+          // 小图标的宽高
 
+          itemHeight: 5,
 
+        },
 
+      };
 
+      chart.setOption(option);
 
+      tools.loopShowTooltip(chart, option, {
 
+        interval: 2000,
 
+        loopSeries: true,
 
+      });
 
+    }
 
+  },
 
+})

File diff suppressed because it is too large
+ 0 - 0
investment/libs/datav.min2.js


File diff suppressed because it is too large
+ 0 - 0
investment/libs/vue-seamless-scroll.min.js


+ 4 - 0
investment/styles/investHome.css
View File 

@@ -415,3 +415,7 @@ a {
 
   font-weight: 600 !important;
 
   color: #2ABBFF;
 
 }
 
+.warp {
 
+  height: 190px;
 
+  overflow: hidden;
 
+}

+ 777 - 0
investment/styles/investHome3.css
View File 

@@ -0,0 +1,777 @@
 
+*,
 
+*:before,
 
+*:after {
 
+  padding: 0;
 
+  margin: 0;
 
+  box-sizing: border-box;
 
+}
 
+html,
 
+body {
 
+  height: 100%;
 
+  font-size: 14px;
 
+  background-color: #ecffff;
 
+  font-family: 'Microsoft YaHei', 'Helvetica Neue', Helvetica, 'PingFang SC',
 
+    'Hiragino Sans GB', Arial, sans-serif;
 
+}
 
+
 
+.flex {
 
+  display: flex;
 
+}
 
+.flex1 {
 
+  flex: 1;
 
+}
 
+.flex2 {
 
+  flex: 2;
 
+}
 
+.flex-around {
 
+  display: flex;
 
+  justify-content: space-around;
 
+}
 
+.flex-between {
 
+  display: flex;
 
+  justify-content: space-between;
 
+  align-items: center;
 
+}
 
+.flex-end {
 
+  display: flex;
 
+  justify-content: flex-end;
 
+}
 
+.flex-align-center {
 
+  display: flex;
 
+  align-items: center;
 
+}
 
+.text-center {
 
+  text-align: center;
 
+}
 
+.font12 {
 
+  font-size: 12px;
 
+}
 
+.main-color {
 
+  color: #0bf1ff;
 
+}
 
+.danger-color {
 
+  color: #f15450 !important;
 
+}
 
+.error-color {
 
+  color: #ffc704 !important;
 
+}
 
+.btm10 {
 
+  margin-bottom: 10px;
 
+}
 
+.btm20 {
 
+  margin-bottom: 20px;
 
+}
 
+a {
 
+  text-decoration: none;
 
+  cursor: pointer;
 
+}
 
+
 
+[v-cloak] {
 
+  display: none;
 
+}
 
+#app {
 
+  background: url('../images/page-bg.png') center center no-repeat;
 
+  background-size: 100% 100%;
 
+  padding-top: 10px;
 
+  height: 100vh;
 
+  overflow: hidden;
 
+  color: #fff;
 
+}
 
+.my-header {
 
+  position: relative;
 
+  height: 70px;
 
+  line-height: 70px;
 
+  background: url('../images/header-bg.png') center center no-repeat;
 
+  background-size: 100% 100%;
 
+  text-align: center;
 
+  font-weight: bold;
 
+  font-size: 32px;
 
+  font-weight: 600;
 
+}
 
+.my-header span {
 
+  background: linear-gradient(-3deg, #99eeff 0%, #99eeff 30%, #ffffff 91%);
 
+  -webkit-background-clip: text;
 
+  -webkit-text-fill-color: transparent;
 
+}
 
+.my-header span.right {
 
+  position: absolute;
 
+  right: 60px;
 
+  top: 0px;
 
+  font-size: 16px;
 
+}
 
+.main {
 
+  padding: 15px;
 
+  height: calc(100vh - 25px);
 
+  background: url('../images/back-big.png') no-repeat center bottom;
 
+  padding-bottom: 65px;
 
+  display: grid;
 
+  grid-template-rows: repeat(3, minmax(0, 1fr));
 
+  gap: 10px;
 
+}
 
+.top {
 
+  display: grid;
 
+  grid-template-columns: repeat(2, minmax(0, 1fr));
 
+  gap: 10px;
 
+}
 
+.center,
 
+.footer {
 
+  display: grid;
 
+  grid-template-columns: repeat(3, minmax(0, 1fr));
 
+  gap: 10px;
 
+}
 
+.top-left,
 
+.top-right {
 
+  height: 100%;
 
+  background: url('../images3/big.png') no-repeat;
 
+  background-size: 100% 100%;
 
+  position: relative;
 
+}
 
+.panel-title {
 
+  position: relative;
 
+  text-align: center;
 
+  height: 50px;
 
+  line-height: 50px;
 
+}
 
+.panel-title .text {
 
+  font-size: 20px;
 
+  font-weight: 600;
 
+  color: #05fbfe;
 
+  text-shadow: 0px 2px 10px rgba(10, 30, 52, 0.48);
 
+  background: linear-gradient(0deg, #ffffff 0%, #63dcff 0%, #e0f3ff 100%);
 
+  -webkit-background-clip: text;
 
+  -webkit-text-fill-color: transparent;
 
+  position: relative;
 
+}
 
+.panel-title .text::before {
 
+  position: absolute;
 
+  content: ' ';
 
+  top: 10px;
 
+  left: -40px;
 
+  width: 30px;
 
+  height: 10px;
 
+  background: url('../images/title-left.png') no-repeat;
 
+}
 
+.panel-title .text::after {
 
+  position: absolute;
 
+  content: ' ';
 
+  top: 10px;
 
+  right: -40px;
 
+  width: 30px;
 
+  height: 10px;
 
+  background: url('../images/title-right.png') no-repeat;
 
+}
 
+.top-left-bottom,
 
+.top-right-bottom,
 
+.center-right-bottom,
 
+.center-center-bottom,
 
+.center-left-bottom,
 
+.footer-right-bottom,
 
+.footer-center-bottom {
 
+  height: calc(100% - 50px);
 
+  width: 100%;
 
+  padding: 10px;
 
+}
 
+.top-left-bottom-left {
 
+  height: 100%;
 
+  width: 20%;
 
+  background: url('../images3/big.png') no-repeat;
 
+  background-size: 100% 100%;
 
+  position: relative;
 
+}
 
+.top-left-bottom-right {
 
+  height: 100%;
 
+  width: calc(80% - 10px);
 
+  background: url('../images3/big.png') no-repeat;
 
+  background-size: 100% 100%;
 
+}
 
+.light {
 
+  width: 120px;
 
+  height: 100px;
 
+}
 
+.top-left-bottom-left > .num {
 
+  color: #69c0ff;
 
+  font-size: 20px;
 
+  font-weight: bold;
 
+  position: absolute;
 
+  top: 50px;
 
+}
 
+.downList {
 
+  background: url('../images3/down-back.png') no-repeat;
 
+  background-size: 100% 100%;
 
+  width: 85px;
 
+  height: 30px;
 
+  position: absolute;
 
+  right: 10px;
 
+  top: 10px;
 
+}
 
+.downList > img {
 
+  width: 11px;
 
+  height: 7px;
 
+  margin-left: 10px;
 
+}
 
+.center-right,
 
+.center-center,
 
+.center-left,
 
+.footer-right,
 
+.footer-center,
 
+.footer-left {
 
+  background: url('../images3/small.png') no-repeat;
 
+  background-size: 100% 100%;
 
+}
 
+.center-right-bottom {
 
+  display: grid;
 
+  grid-template-columns: repeat(2, minmax(0, 1fr));
 
+  gap: 10px;
 
+}
 
+.center-right-bottom > div,
 
+.center-center-bottom > div {
 
+  background: url('../images3/small.png') no-repeat;
 
+  background-size: 100% 100%;
 
+}
 
+.center-right-bottom-right {
 
+  width: 100%;
 
+  height: 100%;
 
+  position: relative;
 
+}
 
+.center-right-bottom-right-text {
 
+  color: #40a9ff;
 
+  font-size: 18px;
 
+  font-weight: bold;
 
+  position: absolute;
 
+  width: 100px;
 
+  height: 40px;
 
+  line-height: 40px;
 
+  text-align: center;
 
+  left: calc(50% - 50px);
 
+  top: calc(50% - 30px);
 
+}
 
+.center-center-bottom,
 
+.center-left-bottom {
 
+  width: 100%;
 
+  display: grid;
 
+  grid-template-columns: 60% 40%;
 
+  gap: 10px;
 
+}
 
+.center-center-bottom > div:nth-child(1) > div:nth-child(1) {
 
+  height: 20%;
 
+  padding-bottom: 10px;
 
+}
 
+.center-center-bottom-list {
 
+  height: 80%;
 
+  display: flex;
 
+  flex-direction: column;
 
+  justify-content: space-between;
 
+}
 
+.center-center-bottom-list .el-progress-bar__inner {
 
+  background: linear-gradient(to right, #092854, #00aeff);
 
+}
 
+.center-center-bottom-list .el-progress__text {
 
+  color: #fff;
 
+}
 
+.el-progress {
 
+  border: 1px solid #115079;
 
+}
 
+.center-center-bottom > div {
 
+  padding: 10px;
 
+}
 
+.center-center-bottom-right {
 
+  display: flex;
 
+  justify-content: center;
 
+  align-items: center;
 
+  position: relative;
 
+}
 
+.center-center-bottom-right > div:nth-child(1) {
 
+  border: 1px dashed #00ffff;
 
+  width: 1px;
 
+  height: 80%;
 
+}
 
+.center-center-bottom-right > div:nth-child(2) {
 
+  position: absolute;
 
+  top: calc(20% - 30px);
 
+  left: calc(50% - 95px);
 
+  background-color: #166592;
 
+  color: #2cc6ff;
 
+  width: 190px;
 
+  height: 20px;
 
+  line-height: 20px;
 
+  text-align: center;
 
+}
 
+.center-center-bottom-right > div:nth-child(3) {
 
+  position: absolute;
 
+  top: 60px;
 
+  left: 117px;
 
+  background-color: #166592;
 
+  color: #2cc6ff;
 
+  width: 60px;
 
+  height: 20px;
 
+  line-height: 20px;
 
+  text-align: center;
 
+}
 
+.center-center-bottom-right > div:nth-child(4) {
 
+  position: absolute;
 
+  top: 100px;
 
+  left: 55px;
 
+  background-color: #416d63;
 
+  color: #ffd802;
 
+  width: 60px;
 
+  height: 20px;
 
+  line-height: 20px;
 
+  text-align: center;
 
+}
 
+.center-center-bottom-right > div:nth-child(5) {
 
+  position: absolute;
 
+  top: 140px;
 
+  left: 117px;
 
+  background-color: #166592;
 
+  color: #2cc6ff;
 
+  width: 60px;
 
+  height: 20px;
 
+  line-height: 20px;
 
+  text-align: center;
 
+}
 
+.center-left-bottom-list {
 
+  border: 1px solid #06345e;
 
+}
 
+.center-left-bottom-list > span {
 
+  display: inline-block;
 
+  padding: 5px 30px;
 
+  cursor: pointer;
 
+}
 
+.center-left-bottom-list > span:hover {
 
+  color: #2abbff;
 
+}
 
+.center-left-bottom-list > span:nth-child(odd) {
 
+  background-color: #1a426c;
 
+}
 
+.footer-right-bottom {
 
+  padding: 0 50px !important;
 
+  padding-bottom: 20px !important;
 
+}
 
+.footer-right-bottom .el-progress-bar__inner {
 
+  background: linear-gradient(to right, #092854, #00aeff);
 
+}
 
+.footer-right-bottom .el-progress {
 
+  width: 85%;
 
+}
 
+.el-progress-bar__outer {
 
+  background-color: #6fa0ce;
 
+}
 
+.blue {
 
+  color: #3af7fe;
 
+}
 
+.yellow {
 
+  color: #ffd200;
 
+}
 
+.pink {
 
+  color: #d87aff;
 
+}
 
+.footer-left-bottom {
 
+  height: 100%;
 
+  padding: 10px;
 
+  font-size: 14px;
 
+}
 
+/* zhb */
 
+/* 宽高纵横比 */
 
+.aspect-auto {
 
+  aspect-ratio: auto;
 
+}
 
+.aspect-square {
 
+  aspect-ratio: 1 / 1;
 
+}
 
+.aspect-video {
 
+  aspect-ratio: 16 / 9;
 
+}
 
+/* aspect-[4/3] */
 
+
 
+/* 居中 */
 
+.mx-auto {
 
+  margin: 0 auto;
 
+}
 
+
 
+/* 设置容器内的列数/每列距离 */
 
+.columns-1 {
 
+  columns: 1;
 
+}
 
+/* columns-[20px] */
 
+
 
+/* 盒子模型 */
 
+.box-border {
 
+  box-sizing: border-box;
 
+}
 
+.box-content {
 
+  box-sizing: content-box;
 
+}
 
+/* 消失 */
 
+.hidden {
 
+  display: none;
 
+}
 
+
 
+/* 块级元素 */
 
+.block {
 
+  display: block;
 
+}
 
+/* 行内块 */
 
+.inline-block {
 
+  display: inline-block;
 
+}
 
+/* 行内元素 */
 
+.inline {
 
+  display: inline;
 
+}
 
+
 
+/* 弹性布局 */
 
+.flex {
 
+  display: flex;
 
+}
 
+/* 主轴起点在左边 */
 
+.flex-row {
 
+  flex-direction: row;
 
+}
 
+/* 主轴起点在右边 */
 
+.flex-row-reverse {
 
+  flex-direction: row-reverse;
 
+}
 
+/* 主轴竖向排列，在上面 */
 
+.flex-col {
 
+  flex-direction: column;
 
+}
 
+/* 主轴竖向排列，在下面 */
 
+.flex-col-reverse {
 
+  flex-direction: column-reverse;
 
+}
 
+/* 自动换行 */
 
+.flex-wrap {
 
+  flex-wrap: wrap;
 
+}
 
+/* 自动换行下起点 */
 
+.flex-wrap-reverse {
 
+  flex-wrap: wrap-reverse;
 
+}
 
+/* 不换行 */
 
+.flex-nowrap {
 
+  flex-wrap: nowrap;
 
+}
 
+/* 弹性成长 */
 
+.grow {
 
+  flex-grow: 1;
 
+}
 
+/* 不允许弹性成长 */
 
+.grow-0 {
 
+  flex-grow: 0;
 
+}
 
+/* 主轴从左开始 */
 
+.justify-start {
 
+  justify-content: flex-start;
 
+}
 
+/* 主轴从右开始 */
 
+.justify-end {
 
+  justify-content: flex-end;
 
+}
 
+/* 主轴剧中 */
 
+.justify-center {
 
+  justify-content: center;
 
+}
 
+/* 主轴两端无间隔 */
 
+.justify-between {
 
+  justify-content: space-between;
 
+}
 
+/* 主轴两端有间隔 */
 
+.justify-around {
 
+  justify-content: space-around;
 
+}
 
+/* 所有间隔相等 */
 
+.justify-evenly {
 
+  justify-content: space-evenly;
 
+}
 
+/* 纵向起点最上方 */
 
+.items-start {
 
+  align-items: flex-start;
 
+}
 
+/* 纵向起点最下方 */
 
+.items-end {
 
+  align-items: flex-end;
 
+}
 
+.items-center {
 
+  align-items: center;
 
+}
 
+/* 网格布局 */
 
+.grid {
 
+  display: grid;
 
+}
 
+/* 有几列 */
 
+.grid-cols-4 {
 
+  grid-template-columns: repeat(4, minmax(0, 1fr));
 
+}
 
+/* 有几行 */
 
+.grid-rows-3 {
 
+  grid-template-rows: repeat(3, minmax(0, 1fr));
 
+}
 
+
 
+/* 间距 */
 
+.gap-7 {
 
+  gap: 1.75rem;
 
+}
 
+/* 允许弹性成长 */
 
+.shrink {
 
+  flex-shrink: 1;
 
+}
 
+/* 不允许弹性成长 */
 
+.shrink-0 {
 
+  flex-shrink: 0;
 
+}
 
+/* 不允许成长也不允许收缩 */
 
+.flex-none {
 
+  flex: none;
 
+}
 
+/* 浮动布局 */
 
+.float-right {
 
+  float: right;
 
+}
 
+.float-left {
 
+  float: left;
 
+}
 
+.clear-both {
 
+  clear: both;
 
+}
 
+
 
+/* 溢出 */
 
+.overflow-auto {
 
+  overflow: auto;
 
+}
 
+.overflow-hidden {
 
+  overflow: hidden;
 
+}
 
+.overflow-scroll {
 
+  overflow: scroll;
 
+}
 
+.overflow-x-auto {
 
+  overflow-x: auto;
 
+}
 
+.overflow-y-auto {
 
+  overflow-y: auto;
 
+}
 
+
 
+/* 定位 */
 
+.fixed {
 
+  position: fixed;
 
+}
 
+.absolute {
 
+  position: absolute;
 
+}
 
+.relative {
 
+  position: relative;
 
+}
 
+.top-0 {
 
+  top: 0px;
 
+}
 
+.right-0 {
 
+  right: 0px;
 
+}
 
+.bottom-0 {
 
+  bottom: 0px;
 
+}
 
+.left-0 {
 
+  left: 0px;
 
+}
 
+/* top-[3px] */
 
+/* z-[100] */
 
+
 
+/* 显示隐藏未脱离文档流 */
 
+.visible {
 
+  visibility: visible;
 
+}
 
+.invisible {
 
+  visibility: hidden;
 
+}
 
+
 
+/* 内边距 */
 
+.p-0 {
 
+  padding: 0px;
 
+}
 
+.px-0 {
 
+  padding-left: 0px;
 
+  padding-right: 0px;
 
+}
 
+.py-0 {
 
+  padding-top: 0px;
 
+  padding-bottom: 0px;
 
+}
 
+.pt-0 {
 
+  padding-top: 0px;
 
+}
 
+.pr-0 {
 
+  padding-right: 0px;
 
+}
 
+.pb-0 {
 
+  padding-bottom: 0px;
 
+}
 
+.pl-0 {
 
+  padding-left: 0px;
 
+}
 
+/* p-[5px] */
 
+
 
+/* 外边距 */
 
+.m-0 {
 
+  margin: 0px;
 
+}
 
+.mx-0 {
 
+  margin-left: 0px;
 
+  margin-right: 0px;
 
+}
 
+.my-0 {
 
+  margin-top: 0px;
 
+  margin-bottom: 0px;
 
+}
 
+.mt-0 {
 
+  margin-top: 0px;
 
+}
 
+.mr-0 {
 
+  margin-right: 0px;
 
+}
 
+.mb-0 {
 
+  margin-bottom: 0px;
 
+}
 
+.ml-0 {
 
+  margin-left: 0px;
 
+}
 
+/* m-[5px] */
 
+
 
+/* 宽度 */
 
+.w-full {
 
+  width: 100%;
 
+}
 
+.w-screen {
 
+  width: 100vw;
 
+}
 
+/* w-[32rem] */
 
+/* min-w-[50%] */
 
+/* max-w-[50%] */
 
+
 
+/* 高度 */
 
+.h-full {
 
+  height: 100%;
 
+}
 
+.h-screen {
 
+  height: 100vh;
 
+}
 
+/* h-[32rem] */
 
+/* min-h-[50%] */
 
+/* max-h-[32rem] */
 
+
 
+/* 字体 */
 
+.text-xs {
 
+  font-size: 0.75rem; /* 12px */
 
+  line-height: 1rem; /* 16px */
 
+}
 
+.text-sm {
 
+  font-size: 0.875rem; /* 14px */
 
+  line-height: 1.25rem; /* 20px */
 
+}
 
+.text-base {
 
+  font-size: 1rem; /* 16px */
 
+  line-height: 1.5rem; /* 24px */
 
+}
 
+.text-lg {
 
+  font-size: 1.125rem; /* 18px */
 
+  line-height: 1.75rem; /* 28px */
 
+}
 
+.text-xl {
 
+  font-size: 1.25rem; /* 20px */
 
+  line-height: 1.75rem; /* 28px */
 
+}
 
+.text-2xl {
 
+  font-size: 1.5rem; /* 24px */
 
+  line-height: 2rem; /* 32px */
 
+}
 
+.text-3xl {
 
+  font-size: 1.875rem; /* 30px */
 
+  line-height: 2.25rem; /* 36px */
 
+}
 
+.text-4xl {
 
+  font-size: 2.25rem; /* 36px */
 
+  line-height: 2.5rem; /* 40px */
 
+}
 
+.text-5xl {
 
+  font-size: 3rem; /* 48px */
 
+  line-height: 1;
 
+}
 
+.text-6xl {
 
+  font-size: 3.75rem; /* 60px */
 
+  line-height: 1;
 
+}
 
+.text-7xl {
 
+  font-size: 4.5rem; /* 72px */
 
+  line-height: 1;
 
+}
 
+.text-8xl {
 
+  font-size: 6rem; /* 96px */
 
+  line-height: 1;
 
+}
 
+.text-9xl {
 
+  font-size: 8rem; /* 128px */
 
+  line-height: 1;
 
+}
 
+/* text-[14px] */
 
+/* 字体粗细font-weight */
 
+/* font-[1100] */
 
+/* https://tailwindcss.com/docs/font-weight */
 
+/* 字体间距letter-spacing */
 
+/* tracking-[.25em] */
 
+/* 行高line-height */
 
+/* leading-[3rem] */
 
+/* 无列表样式 */
 
+.list-none {
 
+  list-style-type: none;
 
+}
 
+/* 小圆点 */
 
+.list-disc {
 
+  list-style-type: disc;
 
+}
 
+/* 数字列表 */
 
+.list-decimal {
 
+  list-style-type: decimal;
 
+}
 
+.text-left {
 
+  text-align: left;
 
+}
 
+.text-center {
 
+  text-align: center;
 
+}
 
+.text-right {
 
+  text-align: right;
 
+}
 
+/* 所有文本头尾对齐 */
 
+.text-justify {
 
+  text-align: justify;
 
+}
 
+/* 文本颜色 */
 
+/* text-[#50d71e] */
 
+/* https://tailwindcss.com/docs/text-color */
 
+/* 下划线 */
 
+.underline {
 
+  text-decoration-line: underline;
 
+}
 
+/* 上划线 */
 
+.overline {
 
+  text-decoration-line: overline;
 
+}
 
+/* 中划线 */
 
+.line-through {
 
+  text-decoration-line: line-through;
 
+}
 
+/* 无划线 */
 
+.no-underline {
 
+  text-decoration-line: none;
 
+}
 
+/* 全小写 */
 
+.lowercase {
 
+  text-transform: lowercase;
 
+}
 
+/* 全大写 */
 
+.uppercase {
 
+  text-transform: uppercase;
 
+}
 
+/* 首字母大写 */
 
+.capitalize {
 
+  text-transform: capitalize;
 
+}

+ 8 - 8
manpower/index.html
View File 

@@ -26,7 +26,7 @@
 
 </head>
 
 
 <body>
 
-  <div id="app" v-cloak>
 
+  <div id="app" v-cloak @click="showTip = false">
 
     <header class="my-header">
 
       <span>国有资本数智化平台人力资源系统</span>
 
       <span class="right">{{time}}</span>
 
@@ -37,7 +37,7 @@
 
           <div class="my-panel">
 
             <div class="panel-title flex-between ">
 
               <span class="text">定机构</span>
 
-              <span class="tip-window" @click="handleShowTip(0)">智能分析</span>
 
+              <span class="tip-window" @click.stop="handleShowTip(0)">智能分析</span>
 
             </div>
 
             <div class="content flex">
 
               <div ref="echartL1" style="flex: 1;height: 100%;"></div>
 
@@ -49,7 +49,7 @@
 
           <div class="my-panel">
 
             <div class="panel-title flex-between">
 
               <span class="text">定职数</span>
 
-              <span class="tip-window" @click="handleShowTip(1)">智能分析</span>
 
+              <span class="tip-window" @click.stop="handleShowTip(1)">智能分析</span>
 
             </div>
 
             <div class="content flex">
 
               <div ref="echartL3" style="flex: 1;height: 100%;"></div>
 
@@ -64,7 +64,7 @@
 
           <div class="my-panel">
 
             <div class="panel-title flex-between">
 
               <span class="text">定员额</span>
 
-              <span class="tip-window" @click="handleShowTip(2)">智能分析</span>
 
+              <span class="tip-window" @click.stop="handleShowTip(2)">智能分析</span>
 
             </div>
 
             <div class="content flex flex-wrap">
 
               <div ref="echartL5" style="flex: 0 0 49.9%;height: 50%;"></div>
 
@@ -161,7 +161,7 @@
 
           <div class="my-panel">
 
             <div class="panel-title flex-between">
 
               <span class="text">核心指标监测</span>
 
-              <span class="tip-window" @click="handleShowTip(3)">智能分析</span>
 
+              <span class="tip-window" @click.stop="handleShowTip(3)">智能分析</span>
 
             </div>
 
             <div class="content flex">
 
               <div style="flex: 1;height: 100%; position: relative;">
 
@@ -196,7 +196,7 @@
 
           <div class="my-panel">
 
             <div class="panel-title flex-between">
 
               <span class="text">定机制</span>
 
-              <span class="tip-window" @click="handleShowTip(4)">智能分析</span>
 
+              <span class="tip-window" @click.stop="handleShowTip(4)">智能分析</span>
 
             </div>
 
             <div class="content flex flex-wrap">
 
               <div ref="echartR1" style="flex: 0 0 49.9%;height: 50%;"></div>
 
@@ -210,7 +210,7 @@
 
           <div class="my-panel">
 
             <div class="panel-title flex-between">
 
               <span class="text">定薪酬</span>
 
-              <span class="tip-window" @click="handleShowTip(5)">智能分析</span>
 
+              <span class="tip-window" @click.stop="handleShowTip(5)">智能分析</span>
 
             </div>
 
             <div class="content flex">
 
               <div ref="echartR5" style="flex: 1;height: 100%;"></div>
 
@@ -222,7 +222,7 @@
 
           <div class="my-panel">
 
             <div class="panel-title flex-between">
 
               <span class="text">定任期</span>
 
-              <span class="tip-window" @click="handleShowTip(6)">智能分析</span>
 
+              <span class="tip-window" @click.stop="handleShowTip(6)">智能分析</span>
 
             </div>
 
             <div class="content flex">
 
               <div ref="echartR7" style="flex: 1;height: 100%;"></div>

+ 1 - 1
manpower/index2.html
View File 

@@ -161,7 +161,7 @@
 
               <span class="tip-window" @click="handleShowTip(2)">智能分析</span>
 
             </div>
 
             <div class="content flex">
 
-              <div ref="echartC1" style="flex: 1;height: 100%;"></div>
 
+              <div ref="echartC1" style="flex: 1;height: 90%;"></div>
 
               <div ref="echartC2" style="flex: 1;height: 100%;"></div>
 
             </div>
 
           </div>

+ 1 - 1
manpower/js/data2.js
View File 

@@ -102,7 +102,7 @@ const dataR5 = [
 
 ]
 
 const dataR6 = [
 
   [183, 372, 221, 268, 51, -25, 676, -31, 62],
 
-  [-34, 0, 9, 0, 39, 0, 12, -4, -35]
 
+  [-25, 0, 10, 0, 63, 0, 13, -4, -26]
 
 ]
 
 const dataR7 = [
 
   [100, 100, 100, 100, 100, 100, 100, 100, 100]

+ 2 - 2
manpower/js/data3.js
View File 

@@ -99,12 +99,12 @@ const dataR4 = [
 
   [2, 4, 10, 2, 7, 6, 6, 7, 5, 2]
 
 ]
 
 const dataR5 = [
 
-  [34409.3, 22500.0, 15100.0, 27930.8, 19637.2, 16528.1, 26904.4, 35046.6, 22500.0, 4072.1],
 
+  [43240, 8019.8, 15874.4, 29026.3, 19815.07, 8486.45, 7865.4, 14039.6, 8894.4, 7326.7],
 
   [32620, 21120.75, 14255.91, 26785, 18356, 15658, 25738, 33585, 21078, 3683]
 
 ]
 
 const dataR6 = [
 
   [359, 141, -26, -8, -23, 90, 20, -68, 1769, -221],
 
-  [-36, 11, 30, 11, 16, 45, 2, 23, -45, -10]
 
+  [-25, -6, -6, -8, -7, 85, 227, 139, -6, -50]
 
 ]
 
 const dataR7 = [
 
   [100, 100, 100, 100, 100, 100, 100, 100, 100, 100]

+ 2 - 2
manpower/js/data4.js
View File 

@@ -88,12 +88,12 @@ const dataR4 = [
 
   [0, 0, 0, 1, 2, 0, 0, 0]
 
 ]
 
 const dataR5 = [
 
-  [16000.00, 0.00, 9589.04, 11260.80, 13360.00, 10853.00, 4680.80, 0.00],
 
+  [11000, 0.00, 6666.66, 9492.75, 41783.7, 0, 3387.97, 8333.33],
 
   [15323.20, 0.00, 9084.66, 10674.11, 12694.67, 10281.05, 4433.65, 0.00]
 
 ]
 
 const dataR6 = [
 
   [0, -100, -920, -239, 38, 27, 30, -2727],
 
-  [4, 5, 5.26, 5.21, 4.98, 5.27, 5.28, 5.26]
 
+  [45.45, 0, 43.84, 18.63, -68.03, 0, 38.16, 0]
 
 ]
 
 const dataR7 = [
 
   [100, 100, 100, 100, 100, 100, 100, 100, 100]

+ 49 - 51
manpower/js/fjx.js
View File 

@@ -1,55 +1,53 @@
 
 const fjxdataL1 = [
 
-    [10399.32, 7126.2, 8643.4, 15964.2, 9733.9, 8070.8, 11564.4, 4233.6, 7927.05, 5298.9, 6001.3, 9010.1, 11370.3, 10170.1, 15123.3, 6103.5, 18555.5, 7293.3],
 
-    [10765.11, 9926.11, 8004.83, 17927.84, 8175.60, 8564.49, 14752.41, 4198.19, 7769.08, 5675.25, 6930.32, 8930.43, 11308.43, 10595.55, 8713.58, 6006.82, 17387.07, 5532.42],
 
-  ]
 
-  
-  const fjxdataL2 = [
 
-    [172, 89, 80, 117, 23, 38, 99, 30, 34, -524, 64, -160,31, 53, 2, 27, -20, 109],
 
-    [3.40, 28.21, -7.98, 10.95, -19.06, 5.76, 21.61, -0.84, -2.03, 6.63, 13.41, -0.89, -0.55, 4.02, -73.56, -1.61, -6.72, -31.83],
 
-  ]
 
-  
-  const fjxdataL3 = [
 
-    [100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100,100],
 
-  ]
 
-  const fjxdataL4 = [
 
-    [100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100,100],
 
-  ]
 
+  [10399.32, 7126.2, 8643.4, 15964.2, 9733.9, 8070.8, 11564.4, 4233.6, 7927.05, 5298.9, 6001.3, 9010.1, 11370.3, 10170.1, 15123.3, 6103.5, 18555.5, 7293.3],
 
+  [10765.11, 9926.11, 8004.83, 17927.84, 8175.60, 8564.49, 14752.41, 4198.19, 7769.08, 5675.25, 6930.32, 8930.43, 11308.43, 10595.55, 8713.58, 6006.82, 17387.07, 5532.42],
 
+]
 
+
 
+const fjxdataL2 = [
 
+  [172, 89, 80, 117, 23, 38, 99, 30, 34, -524, 64, -160, 31, 53, 2, 27, -20, 109],
 
+  [3.52, 39.29, -7.39, 12.30, -16.01, 6.12, 27.57, -0.84, -1.99, 7.10, 15.48, -0.88, -0.54, 4.18, -42.38, -1.58, -6.30, -24.14],
 
+]
 
+
 
+const fjxdataL3 = [
 
+  [100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100],
 
+]
 
+const fjxdataL4 = [
 
+  [100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100],
 
+]
 
 
-  const tipData = [
 
-    [
 
-      '华阳新材12月总部设立的共享服务中心及事业部数共12个，“六定”常态机制核定上限为6个，未严格执行机构配置限额有关规定'
 
-    ],
 
-    [
 
-      '云时代中层管理人员对比六定前有所增长，是因为在此期间发生了组织兼并。'
 
-    ],
 
-    [
 
-      '1.	华舰体育总人数比去年同期增长490%，主要原因是业务发展需要；',
 
-      '2.	华阳新材人数下降了24%，主要是自然减员结果；',
 
-      '3.	文旅集团全员劳动生产率同比下降33%，人工成本利润率同比下降470%，企业总人数增长2%；',
 
-      '4.	大地控股的全员劳动生产率同比下降7%，人工成本利润率同比下降4%，企业总人数增长14%；',
 
-      '5.	华舰体育全员劳动生产率同比增长56%，同时企业总人数增长490%，明显高于全员劳动率增长幅度，值得关注；',
 
-    ],
 
-    [
 
-      '1.	国际能源全员劳动生产率较高，因为扭亏减亏成效显著；',
 
-      '2.	汾酒集团全员劳动生产率较高，因为企业效益好人均产值较高；',
 
-      '3.	文旅集团、航产集团人工成本利润率为负，且与去年同期比有所下降，需重点关注；',
 
-      '4.	国际能源、华舰体育人工成本利润率为负，但相比去年有所改善；',
 
-      '5.	山西焦煤、晋能控股、华阳新材、太重集团、国际能源、华远陆港、交控集团等8家企业人工成本利润率增长且总人数下降；',
 
-    ],
 
-    [
 
-      '1.	文旅集团2022年利润为负，同时累计招聘46人；',
 
-      '2.	航产集团2022年利润为负，同时累计招聘199人；',
 
-      '3.	国际能源2022年利润为负，同时累计招聘190人',
 
-      '4.	华舰体育2022年利润为负，同时累计招聘12人；',
 
-    ],
 
-    [
 
-      '1.	文旅集团2022年利润同比降低524%，同时薪酬总额增长5.27%；',
 
-      '2.	航产集团2022年利润同比降低160%，同时薪酬总额增长5.27%；',
 
-      '3.	华舰体育2022年利润同比降低20%，同时薪酬总额增长5.28%',
 
-    ]
 
+const tipData = [
 
+  [
 
+    '华阳新材12月总部设立的共享服务中心及事业部数共12个，“六定”常态机制核定上限为6个，未严格执行机构配置限额有关规定'
 
+  ],
 
+  [
 
+    '云时代中层管理人员对比六定前有所增长，是因为在此期间发生了组织兼并。'
 
+  ],
 
+  [
 
+    '1.	华舰体育总人数比去年同期增长490%，主要原因是业务发展需要；',
 
+    '2.	华阳新材人数下降了24%，主要是自然减员结果；',
 
+    '3.	文旅集团全员劳动生产率同比下降33%，人工成本利润率同比下降470%，企业总人数增长2%；',
 
+    '4.	大地控股的全员劳动生产率同比下降7%，人工成本利润率同比下降4%，企业总人数增长14%；',
 
+    '5.	华舰体育全员劳动生产率同比增长56%，同时企业总人数增长490%，明显高于全员劳动率增长幅度，值得关注；',
 
+  ],
 
+  [
 
+    '1.	国际能源全员劳动生产率较高，因为扭亏减亏成效显著；',
 
+    '2.	汾酒集团全员劳动生产率较高，因为企业效益好人均产值较高；',
 
+    '3.	文旅集团、航产集团人工成本利润率为负，且与去年同期比有所下降，需重点关注；',
 
+    '4.	国际能源、华舰体育人工成本利润率为负，但相比去年有所改善；',
 
+    '5.	山西焦煤、晋能控股、华阳新材、太重集团、国际能源、华远陆港、交控集团等8家企业人工成本利润率增长且总人数下降；',
 
+  ],
 
+  [
 
+    '1. 国际能源2022年利润为负，同年累计招聘190人；',
 
+    '2.	文旅集团2022年利润为负，同年累计招聘46人；',
 
+    '3.	航产集团2022年利润为负，同年累计招聘199人；',
 
+    '4.	华舰体育2022年利润为负，同年累计招聘12人；',
 
+  ],
 
+  [
 
+    '文旅集团2022年利润同比降低524%，同时在岗职工平均薪酬增长7.1%；',
 
   ]
 
+]
 
 
-  const tipData2 = [
 
-    ['管理人员是指有直接下属、具有人员管理职责的人员，不包括财务人员、人力资源等管理部门中不负有人员管理职能的具体工作人员。'],
 
-    ['全员劳动生产率＝劳动生产总值/平均在岗职工人数']
 
-  ]
 
+const tipData2 = [
 
+  ['管理人员是指有直接下属、具有人员管理职责的人员，不包括财务人员、人力资源等管理部门中不负有人员管理职能的具体工作人员。'],
 
+  ['全员劳动生产率＝劳动生产总值/平均在岗职工人数']
 
+]

File diff suppressed because it is too large
+ 0 - 0
manpower/js/index.js


File diff suppressed because it is too large
+ 0 - 0
manpower/js/index2.js


File diff suppressed because it is too large
+ 0 - 0
manpower/js/index3.js


File diff suppressed because it is too large
+ 0 - 0
manpower/js/index4.js


+ 20 - 16
manpower/styles/index.css
View File 

@@ -10,8 +10,10 @@ body {
 
   min-width: 7640px;
 
   font-size: 20px;
 
   color: #fff;
 
-  font-family: 'Microsoft YaHei', 'Helvetica Neue', Helvetica, 'PingFang SC',
 
-    'Hiragino Sans GB', Arial, sans-serif;
 
+  font-family: "Microsoft YaHei", "Helvetica Neue", Helvetica, "PingFang SC",
 
+    "Hiragino Sans GB", Arial, sans-serif;
 
+    height: 100vh;
 
+    overflow-y: hidden;
 
 }
 
 [v-cloak] {
 
   display: none;
 
@@ -79,16 +81,18 @@ a {
 
   display: none;
 
 }
 
 #app {
 
-  background: url('../images/page-bg.png') center center no-repeat;
 
+  background: url("../images/page-bg.png") center center no-repeat;
 
   background-size: 100% 100%;
 
   padding-top: 10px;
 
   position: relative;
 
+  height:100vh;
 
+  overflow-y: hidden;
 
 }
 
 .my-header {
 
   position: relative;
 
   height: 140px;
 
   line-height: 140px;
 
-  background: url('../images/header-bg2.png') center center no-repeat;
 
+  background: url("../images/header-bg2.png") center center no-repeat;
 
   background-size: 100% 100%;
 
   text-align: center;
 
   font-weight: bold;
 
@@ -205,7 +209,7 @@ a {
 
   color: #fff;
 
   font-weight: 600;
 
   font-size: 22px;
 
-  background: url('../images/footer-item.png') no-repeat;
 
+  background: url("../images/footer-item.png") no-repeat;
 
   background-size: 100% 100%;
 
 }
 
 .footer a img {
 
@@ -214,7 +218,7 @@ a {
 
   margin-right: 15px;
 
 }
 
 .footer a:hover {
 
-  background: url('../images/footer-item-checked.png') no-repeat;
 
+  background: url("../images/footer-item-checked.png") no-repeat;
 
   background-size: 100% 100%;
 
   color: #15f7ff;
 
 }
 
@@ -226,7 +230,7 @@ a {
 
   height: 60px;
 
   line-height: 60px;
 
   padding-left: 6%;
 
-  background: url('../images/title-bg.png') no-repeat;
 
+  background: url("../images/title-bg.png") no-repeat;
 
   background-size: 100% 100%;
 
 }
 
 .panel-title .text {
 
@@ -292,7 +296,7 @@ a {
 
   flex: 1;
 
   display: flex;
 
   flex-direction: column;
 
-  background: url('../images/sex-bg.png') no-repeat center;
 
+  background: url("../images/sex-bg.png") no-repeat center;
 
   background-size: 100% 100%;
 
   padding: 1.5%;
 
   margin: 0 10px;
 
@@ -353,12 +357,12 @@ a {
 
   cursor: pointer;
 
 }
 
 .tip {
 
-  position: fixed;
 
+  /* position: fixed;
 
   background-color: rgba(0, 0, 0, 0.5);
 
   width: 100%;
 
   height: 100%;
 
   top: 0;
 
-  left: 0;
 
+  left: 0; */
 
 }
 
 .tip-box {
 
   position: absolute;
 
@@ -370,8 +374,8 @@ a {
 
   height: 850px;
 
   top: calc(50% - 375px);
 
   left: calc(50% - 600px);
 
-  background: url('../images/alert.png') no-repeat center;
 
-  /* background-color: #133B65; */
 
+  background: url("../images/alert.png") no-repeat center;
 
+  background-color: #133b65;
 
   background-size: 100% 100%;
 
   padding: 100px 60px 50px;
 
 }
 
@@ -387,13 +391,13 @@ a {
 
   background-size: 100% 100%;
 
 }
 
 .red {
 
-  background: url('../images/red.png');
 
+  background: url("../images/red.png");
 
 }
 
 .green {
 
-  background: url('../images/green.png');
 
+  background: url("../images/green.png");
 
 }
 
 .yellow {
 
-  background: url('../images/yellow.png');
 
+  background: url("../images/yellow.png");
 
 }
 
 .lightOut {
 
   display: flex;
 
@@ -434,4 +438,4 @@ div::-webkit-scrollbar-track {
 
   cursor: pointer;
 
   border-radius: 50%;
 
   font-size: 24px;
 
-}
 
+}

Some files were not shown because too many files changed in this diff