Startsida Utforska Hjälp
Logga in
kingdee_large_screen
/
pc_kingdee_large_screen
2
0
Fork 0
Filer Ärenden 0 Pull-förfrågningar 0 Wiki
Bläddra i källkod

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

zhbyyy 2 år sedan
förälder
f210889973 5318f463eb
incheckning
337629f7b8
30 ändrade filer med 2762 tillägg och 440 borttagningar
Delad Vy Visa Diff Statistik
  1. BIN
      investment/images/content-bg2.png
  2. BIN
      investment/images/icon-1-home2.png
  3. BIN
      investment/images/icon-2-home2.png
  4. BIN
      investment/images/icon-3-home2.png
  5. BIN
      investment/images/icon-4-home2.png
  6. BIN
      investment/images/icon-5-home2.png
  7. BIN
      investment/images/icon-6-home2.png
  8. BIN
      investment/images/icon-7-home2.png
  9. BIN
      investment/images/icon-8-home2.png
  10. BIN
      investment/images/left-border2.png
  11. 43 47
      investment/investHome.html
  12. 206 0
      investment/investHome2.html
  13. 174 40
      investment/js/investHome.js
  14. 1228 0
      investment/js/investHome2.js
  15. 0 0
      investment/libs/echarts-liquidfill.min.js
  16. 0 0
      investment/libs/vue-seamless-scroll.min.js
  17. 76 5
      investment/styles/investHome.css
  18. 408 0
      investment/styles/investHome2.css
  19. 19 11
      manpower/index.html
  20. 3 0
      manpower/index4.html
  21. 4 3
      manpower/js/data.js
  22. 4 4
      manpower/js/data2.js
  23. 7 7
      manpower/js/data3.js
  24. 5 4
      manpower/js/data4.js
  25. 38 6
      manpower/js/fjx.js
  26. 175 101
      manpower/js/index.js
  27. 131 76
      manpower/js/index2.js
  28. 110 68
      manpower/js/index3.js
  29. 118 68
      manpower/js/index4.js
  30. 13 0
      manpower/styles/index.css

BIN
investment/images/content-bg2.png
Visa fil


BIN
investment/images/icon-1-home2.png
Visa fil


BIN
investment/images/icon-2-home2.png
Visa fil


BIN
investment/images/icon-3-home2.png
Visa fil


BIN
investment/images/icon-4-home2.png
Visa fil


BIN
investment/images/icon-5-home2.png
Visa fil


BIN
investment/images/icon-6-home2.png
Visa fil


BIN
investment/images/icon-7-home2.png
Visa fil


BIN
investment/images/icon-8-home2.png
Visa fil


BIN
investment/images/left-border2.png
Visa fil


+ 43 - 47
investment/investHome.html
Visa fil 

@@ -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">
 
@@ -29,6 +31,18 @@
 
               <div class="my-panel">
 
                 <div class="panel-title">
 
                   <span class="text">投资关键指标</span>
 
+                  <span class="right-date">
 
+                    <el-date-picker
 
+                      v-model="year"
 
+                      prefix-icon="el-icon-date"
 
+                      size="small"
 
+                      type="year"
 
+                      popper-class="date-popper"
 
+                      :clearable="false"
 
+                      :editable="false"
 
+                      placeholder="选择年">
 
+                    </el-date-picker>
 
+                  </span>
 
                 </div>
 
                 <div class="content">
 
                   <div class="boxs">
 
@@ -38,8 +52,8 @@
 
                         <i class="el-icon-more"></i>
 
                       </p>
 
                       <p>
 
-                        <i><span class="num">825.60</span>亿</i>
 
-                        <span class="change"><img src="./images/down.png" /> 12.1%</span>
 
+                        <i><span class="num">{{numFormat(1324.08)}}</span>亿</i>
 
+                        <!-- <span class="change"><img src="./images/down.png" /> 12.1%</span> -->
 
                       </p>
 
                     </div>
 
                     <div>
 
@@ -48,8 +62,8 @@
 
                         <i class="el-icon-more"></i>
 
                       </p>
 
                       <p>
 
-                        <i><span class="num">654</span>个</i>
 
-                        <span class="change"><img src="./images/down.png" /> 12.1%</span>
 
+                        <i><span class="num">{{numFormat(442)}}</span>个</i>
 
+                        <!-- <span class="change"><img src="./images/down.png" /> 12.1%</span> -->
 
                       </p>
 
                     </div>
 
                     <div>
 
@@ -58,8 +72,8 @@
 
                         <i class="el-icon-more"></i>
 
                       </p>
 
                       <p>
 
-                        <i><span class="num">825.60</span>亿</i>
 
-                        <span class="change up"><img src="./images/up.png" /> 12.1%</span>
 
+                        <i><span class="num">{{numFormat(1169.91)}}</span>亿</i>
 
+                        <!-- <span class="change up"><img src="./images/up.png" /> 12.1%</span> -->
 
                       </p>
 
                     </div>
 
                     <div>
 
@@ -68,8 +82,8 @@
 
                         <i class="el-icon-more"></i>
 
                       </p>
 
                       <p>
 
-                        <i><span class="num">325.00</span>亿</i>
 
-                        <span class="change"><img src="./images/down.png" /> 12.1%</span>
 
+                        <i><span class="num">{{numFormat(154.17)}}</span>亿</i>
 
+                        <!-- <span class="change"><img src="./images/down.png" /> 12.1%</span> -->
 
                       </p>
 
                     </div>
 
                   </div>
 
@@ -79,7 +93,7 @@
 
             <dv-border-box-8 :dur="11">
 
               <div class="my-panel">
 
                 <div class="panel-title">
 
-                  <span class="text">五个一体化</span>
 
+                  <span class="text">投资阶段</span>
 
                 </div>
 
                 <div ref="echartL1" class="content"></div>
 
               </div>
 
@@ -94,7 +108,7 @@
 
             </dv-border-box-8>
 
           </div>
 
           <div class="center">
 
-            <div class="top">
 
+            <!-- <div class="top">
 
               <div class="box">
 
                 <div class="t">
 
                   <img src="./images/center1.png"/>
 
@@ -127,10 +141,12 @@
 
                   </div>
 
                 </div>
 
               </div>
 
-            </div>
 
+            </div> -->
 
             <div class="map-box">
 
               <div ref="echarts-map" style="height: 100%;"></div>
 
-              <div class="status">
 
+            <!-- 项目状态 -->
 
+
 
+              <!-- <div class="status">
 
                 <p>项目状态</p>
 
                 <ul style="padding-left: 30px;">
 
                   <li>完成决策： <i>15</i></li>
 
@@ -138,7 +154,7 @@
 
                   <li>退出： <i>15</i></li>
 
                   <li>终止： <i>15</i></li>
 
                 </ul>
 
-              </div>
 
+              </div> -->
 
             </div>
 
           </div>
 
           <div class="right">
 
@@ -155,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"

+ 206 - 0
investment/investHome2.html
Visa fil 

@@ -0,0 +1,206 @@
 
+<!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/investHome2.css" />
 
+    <!-- 引入js -->
 
+    <script src="./libs/vue@2.7.10.js"></script>
 
+    <script src="./libs/datav.min.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-liquidfill.min.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="left">
 
+            <dv-border-box-8 :dur="10" style="height: calc(100% / 3); margin-bottom: 10px;">
 
+              <div class="title">
 
+                <span class="text">储备项目分析</span>
 
+              </div>
 
+              <div class="content">
 
+                <div class="content-left">
 
+                  <div class="item">
 
+                    <div class="item-title">825.60<span>亿</span></div>
 
+                    <div class="item-img">
 
+                      <img style="width: 100%; height: 100%" src="./images/icon-1-home2.png" alt="">
 
+                    </div>
 
+                    <div class="item-text">储备项目总金额</div>
 
+                  </div>
 
+                  <div class="item">
 
+                    <div class="item-title">786<span>个</span></div>
 
+                    <div class="item-img">
 
+                      <img style="width: 100%; height: 100%" src="./images/icon-2-home2.png" alt="">
 
+                    </div>
 
+                    <div class="item-text">储备项目数量</div>
 
+                  </div>
 
+                  <div class="item">
 
+                    <div class="item-title">23.56<span>%</span></div>
 
+                    <div class="item-img">
 
+                      <img style="width: 100%; height: 100%" src="./images/icon-3-home2.png" alt="">
 
+                    </div>
 
+                    <div class="item-text">储备项目准化率</div>
 
+                  </div>
 
+                </div>
 
+                <div class="content-right">
 
+                  <div ref="echartL1" style="width: 100%; height: 100%;"></div>
 
+                </div>
 
+              </div>
 
+            </dv-border-box-8>
 
+            <dv-border-box-8 :dur="10" style="height: calc(100% / 3); margin-bottom: 10px;">
 
+              <div class="title">
 
+                <span class="text">投资额度分析</span>
 
+                <span class="tip-window">2023年</span>
 
+              </div>
 
+              <div class="content">
 
+                <div class="content-left" style="flex-wrap: wrap;">
 
+                  <div class="item2">
 
+                    <div class="item2-title" style="color: #15FFA2;">574.12<span>亿</span></div>
 
+                    <div class="item2-img">
 
+                      <img style="width: 100%; height: 100%;" src="./images/icon-4-home2.png" alt="">
 
+                    </div>
 
+                    <div class="item2-text">上一年度经营业绩</div>
 
+                  </div>
 
+                  <div class="item2">
 
+                    <div class="item2-title" style="color: #DD9CFF;">212.21<span>亿</span></div>
 
+                    <div class="item2-img">
 
+                      <img style="width: 100%; height: 100%;" src="./images/icon-5-home2.png" alt="">
 
+                    </div>
 
+                    <div class="item2-text">上一年度经营业绩</div>
 
+                  </div>
 
+                  <div class="item2">
 
+                    <div class="item2-title" style="color: #EBC805;">222.31<span>亿</span></div>
 
+                    <div class="item2-img">
 
+                      <img style="width: 100%; height: 100%;" src="./images/icon-6-home2.png" alt="">
 
+                    </div>
 
+                    <div class="item2-text">上一年度经营业绩</div>
 
+                  </div>
 
+                  <div class="item2">
 
+                    <div class="item2-title" style="color: #08E4FA;">523.32<span>亿</span></div>
 
+                    <div class="item2-img">
 
+                      <img style="width: 100%; height: 100%;" src="./images/icon-7-home2.png" alt="">
 
+                    </div>
 
+                    <div class="item2-text">上一年度经营业绩</div>
 
+                  </div>
 
+                </div>
 
+                <div class="content-right">
 
+                  <div ref="echartL2" style="width: 100%; height: 100%;"></div>
 
+                </div>
 
+              </div>
 
+            </dv-border-box-8>
 
+            <dv-border-box-8 :dur="10" style="height: calc(100% / 3);">
 
+              <div class="title">
 
+                <span class="text">重点项目两线指标</span>
 
+              </div>
 
+              <div class="content">
 
+                <div class="content-left">
 
+                  <div ref="echartL3" style="width: 100%; height: 100%;"></div>
 
+                </div>
 
+                <div class="content-con">
 
+                  <div ref="echartL4" style="width: 100%; height: 100%;"></div>
 
+                </div>
 
+                <div class="content-right">
 
+                  <div class="item5">
 
+                    <div class="title">山西焦煤集团</div>
 
+                    <dv-scroll-board :config="storageRecordConfig" style="width: 100%; height:calc(100% - 30px)"/>
 
+                  </div>
 
+                </div>
 
+              </div>
 
+            </dv-border-box-8>
 
+          </div>
 
+          <div class="right">
 
+            <dv-border-box-8 :dur="10" style="height: calc(100% / 3); margin-bottom: 10px;">
 
+              <div class="title">
 
+                <span class="text">投资计划分析</span>
 
+                <span class="tip-window">2023年</span>
 
+              </div>
 
+              <div class="content">
 
+                <div class="content-left">
 
+                  <div class="content-left-l">
 
+                    <div class="item3">
 
+                      <div class="item3-title">450.12<span>亿</span></div>
 
+                      <div class="item3-img">
 
+                        <img style="width: 100%; height: 100%;" src="./images/icon-8-home2.png" alt="">
 
+                      </div>
 
+                      <div class="item4-text">
 
+                        年度投资计划总额
 
+                      </div>
 
+                    </div>
 
+                  </div>
 
+                  <div class="content-left-r">
 
+                    <div class="content-left-r-t">
 
+                      <div class="item4">
 
+                        <div class="item4-title">列入省级项目重点项目</div>
 
+                        <div class="item4-con">
 
+                          <div class="item">
 
+                            <div class="title">200<span>亿</span></div>
 
+                            <div class="text">投资金额</div>
 
+                          </div>
 
+                          <div class="item">
 
+                            <div class="title">20<span>个</span></div>
 
+                            <div class="text">项目数量</div>
 
+                          </div>
 
+                        </div>
 
+                      </div>
 
+                    </div>
 
+                    <div class="content-left-r-b">
 
+                      <div class="item4">
 
+                        <div class="item4-title">国家或省政府决定的重大项目</div>
 
+                        <div class="item4-con">
 
+                          <div class="item">
 
+                            <div class="title">200<span>亿</span></div>
 
+                            <div class="text">投资金额</div>
 
+                          </div>
 
+                          <div class="item">
 
+                            <div class="title">20<span>个</span></div>
 
+                            <div class="text">项目数量</div>
 
+                          </div>
 
+                        </div>
 
+                      </div>
 
+                    </div>
 
+                  </div>
 
+                </div>
 
+                <div class="content-right">
 
+                  <div class="content-right-l">
 
+                    <div ref="echartR1" style="width: 100%; height: 100%;"></div>
 
+                  </div>
 
+                  <div class="content-right-r">
 
+                    <div ref="echartR2" style="width: 100%; height: 100%;"></div>
 
+                  </div>
 
+                </div>
 
+              </div>
 
+            </dv-border-box-8>
 
+            <dv-border-box-8 :dur="10" style="height: calc((100% / 3 + 5px) * 2);">
 
+              <div class="title">
 
+                <span class="text">投前项目阶段分析</span>
 
+                <span class="tip-window">省重点项目</span>
 
+              </div>
 
+              <div class="content" style="flex-direction: column;">
 
+                <div class="content-top">
 
+                  <div ref="echartR3" style="width: 100%; height: 100%;"></div>
 
+                </div>
 
+                <div class="content-bot">
 
+                  <div ref="echartR4" style="width: 100%; height: 100%;"></div>
 
+                </div>
 
+              </div>
 
+            </dv-border-box-8>
 
+          </div>
 
+        </div>
 
+      </dv-full-screen-container>
 
+    </div>
 
+    <script src="./js/investHome2.js"></script>
 
+  </body>
 
+</html>

+ 174 - 40
investment/js/investHome.js
Visa fil 

@@ -1,6 +1,6 @@
 
 let app = new Vue({
 
   el: '#app',
 
-  data() {
 
+  data () {
 
     return {
 
       year: '2022',
 
       time: '',
 
@@ -12,19 +12,21 @@ let app = new Vue({
 
         content: '{nt}个',
 
       },
 
       storageRecordConfig: {
 
-        header: ['项目名称', '投资金额',  '项目进度'],
 
+        header: ['项目名称', '投资金额', '项目进度'],
 
         headerBGC: '#05507b33',
 
         oddRowBGC: '#05507b33',
 
         evenRowBGC: '',
 
         headerHeight: '40',
 
         rowNum: 4,
 
-        align: ['center'],
 
+        align: ['center', 'center', 'center'],
 
         data: [
 
-          ['工程建设项目', '21.2亿', '施工图设计'],
 
-          ['工程建设项目', '21.2亿', '施工图设计'],
 
-          ['工程建设项目', '21.2亿', '施工图设计'],
 
-          ['工程建设项目', '21.2亿', '施工图设计'],
 
-          ['工程建设项目', '21.2亿', '施工图设计'],
 
+          ['山煤河曲2×350MW低热值煤发电项目', '35.00亿', '决策审批中'],
 
+          ['泊里煤矿项目', '50.09亿', '决策完成'],
 
+          ['七元煤矿项目', '50.77亿', '决策完成'],
 
+          ['新源智慧建设运行总部', '9.83亿', '决策完成'],
 
+          ['潇河国际会展中心', '43.59亿', '决策完成'],
 
+          ['山西·潇河新城酒店', '40.30亿', '决策完成'],
 
+          ['平舒铁路专用线项目', '18.62亿', '决策完成'],
 
         ],
 
       },
 
       companyList: [
 
@@ -47,20 +49,57 @@ 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() {
 
+  created () {
 
+    this.amountList.map(item=> {
 
+      this.amountTotal += Number(item.value)
 
+    })
 
     this.time = formatDate()
 
-    this.timer = setInterval(()=> {
 
+    this.timer = setInterval(() => {
 
       this.time = formatDate()
 
-    },1000)
 
+    }, 1000)
 
   },
 
-  beforeDestroy() {
 
+  beforeDestroy () {
 
     if (this.timer) {
 
       clearInterval(this.timer);
 
     }
 
   },
 
-  mounted() {
 
+  mounted () {
 
     // 左侧图表
 
     this.initChartL1()
 
     this.initChartL2()
 
@@ -68,7 +107,26 @@ let app = new Vue({
 
     this.initChinaChart()
 
   },
 
   methods: {
 
-    convertData(data) {
 
+    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++) {
 
         var geoCoord = this.geoCoordMap[data[i].name]
 
@@ -81,7 +139,7 @@ let app = new Vue({
 
       }
 
       return res
 
     },
 
-    initChinaChart() {
 
+    initChinaChart () {
 
       var data = [
 
         { name: '吕梁市', value: 150 },
 
         { name: '大同市', value: 190 },
 
@@ -327,8 +385,9 @@ let app = new Vue({
 
         // 地区经纬度
 
         this.geoCoordMap[name] = v.properties.cp
 
       })
 
-
 
-      myChart.setOption({
 
+      // <p>当前阶段：<span>可论证阶段</span></p>
 
+      // <p>时间节点：<span>2021.10-2022.10</span></p>
 
+      let option = {
 
         tooltip: {
 
           padding: 15,
 
           enterable: true,
 
@@ -338,13 +397,13 @@ let app = new Vue({
 
               <div class="tooltip-cont">
 
                 <p>新开工：<span>工程建设项目</span></p>
 
                 <p>总投资额：<span>${params.data.value}亿</span></p>
 
-                <p>当前阶段：<span>可论证阶段</span></p>
 
-                <p>时间节点：<span>2021.10-2022.10</span></p>
 
             </div>`
 
+            callback(ticket, tipHtml)
 
             return tipHtml
 
           },
 
         },
 
         visualMap: {
 
+          show: false,
 
           min: 0,
 
           max: 300,
 
           right: 0,
 
@@ -354,7 +413,7 @@ let app = new Vue({
 
             color: '#f1f1f1'
 
           },
 
           realtime: false,
 
-          calculable: true,
 
+          calculable: false,
 
           inRange: {
 
             color: ['lightskyblue', '#2754b7']
 
           }
 
@@ -425,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: {
 
@@ -515,15 +574,16 @@ let app = new Vue({
 
             data: moveLine.normal,
 
           },
 
         ],
 
-      })
 
+      }
 
+      myChart.setOption(option)
 
     },
 
-    initChartL1() {
 
+    initChartL1 () {
 
       let myChart = echarts.init(this.$refs['echartL1'])
 
       let option = {
 
         tooltip: {
 
           trigger: 'item',
 
         },
 
-        color: ['#6682f5','#8ba2ff','#69c0ff','#43ede3'],
 
+        color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3'],
 
         legend: {
 
           top: 'center',
 
           orient: 'vertical',
 
@@ -554,21 +614,25 @@ let app = new Vue({
 
         ],
 
       }
 
       myChart.setOption(option)
 
+      tools.loopShowTooltip(myChart, option, {
 
+        nterval: 2000,
 
+        loopSeries: true,
 
+      })
 
     },
 
-    initChartL2() {
 
+    initChartL2 () {
 
       let myChart = echarts.init(this.$refs['echartL2'])
 
       let option = {
 
         tooltip: {
 
           trigger: 'axis',
 
           axisPointer: {
 
-            type: 'shadow',
 
+            type: 'cross',
 
           },
 
         },
 
         grid: {
 
           top: '16%',
 
           right: '3%',
 
           left: '10%',
 
-          bottom: '10%',
 
+          bottom: '22%',
 
         },
 
         legend: {
 
           top: '1',
 
@@ -578,7 +642,27 @@ let app = new Vue({
 
           },
 
         },
 
         xAxis: {
 
-          data: ['山西焦煤', '山西文旅', '潞安化工', '晋能控股', '山西建投'],
 
+          data: [
 
+            '家寨水控',
 
+            '山西建设',
 
+            '华新燃气',
 
+            '国际能源',
 
+            '汾酒集团',
 
+            '大地控股',
 
+            '晋能控股',
 
+            '华远陆港',
 
+            '山西焦煤',
 
+            '潞安化工',
 
+            '华阳新材',
 
+            '太重集团',
 
+            '文旅集团',
 
+            '航产集团',
 
+            '华舰体育',
 
+            '神农科技',
 
+            '云时代',
 
+            '山西交控'
 
+
 
+          ],
 
           axisLine: {
 
             show: true, //隐藏X轴轴线
 
             lineStyle: {
 
@@ -591,6 +675,7 @@ let app = new Vue({
 
           },
 
           axisLabel: {
 
             show: true,
 
+            rotate: 50,
 
             textStyle: {
 
               color: 'rgba(255,255,255,0.6)', //X轴文字颜色
 
             },
 
@@ -627,7 +712,7 @@ let app = new Vue({
 
           {
 
             name: '计划投资',
 
             type: 'bar',
 
-            barWidth: 15,
 
+            barWidth: 10,
 
             itemStyle: {
 
               normal: {
 
                 color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
@@ -642,12 +727,31 @@ let app = new Vue({
 
                 ]),
 
               },
 
             },
 
-            data: [900, 600, 500, 450, 500],
 
+            data: [
 
+              46.99,
 
+              218.3,
 
+              31.83,
 
+              64.20,
 
+              14.03,
 
+              47.05,
 
+              385.2,
 
+              97.57,
 
+              189.0,
 
+              106.8,
 
+              82.95,
 
+              80.01,
 
+              26.79,
 
+              41.09,
 
+              5.33,
 
+              14.76,
 
+              63.45,
 
+              346.36
 
+            ],
 
           },
 
           {
 
             name: '实际投资',
 
             type: 'bar',
 
-            barWidth: 15,
 
+            barWidth: 10,
 
             itemStyle: {
 
               normal: {
 
                 color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
@@ -662,26 +766,50 @@ let app = new Vue({
 
                 ]),
 
               },
 
             },
 
-            data: [500, 900, 600, 800, 450],
 
+            data: [
 
+              50.89,
 
+              143.84,
 
+              25.20,
 
+              12.19,
 
+              7.69,
 
+              23.93,
 
+              224.89,
 
+              112.67,
 
+              121.59,
 
+              59.93,
 
+              71.34,
 
+              42.46,
 
+              9.64,
 
+              42.67,
 
+              0.80,
 
+              5.84,
 
+              32.60,
 
+              335.91
 
+            ],
 
           },
 
         ],
 
       }
 
       myChart.setOption(option)
 
+      tools.loopShowTooltip(myChart, option, {
 
+        nterval: 2000,
 
+        loopSeries: true,
 
+      })
 
     },
 
-    initChartR1() {
 
+    initChartR1 () {
 
       let myChart = echarts.init(this.$refs['echartR1'])
 
       let option = {
 
         tooltip: {
 
           trigger: 'axis',
 
+          formatter: '{a0}：{c0}' + '<br/>' + '{a1}：{c1}' + '%',
 
           axisPointer: {
 
-            type: 'shadow',
 
+            type: 'cross',
 
           },
 
         },
 
         grid: {
 
           top: '16%',
 
           right: '10%',
 
           left: '10%',
 
-          bottom: '10%',
 
+          bottom: '15%',
 
         },
 
         legend: {
 
           top: '1',
 
@@ -690,7 +818,7 @@ let app = new Vue({
 
           },
 
         },
 
         xAxis: {
 
-          data: ['煤炭', '火电', '焦化', '物流贸易', '文旅康养','水务','生物','冶金','建材'],
 
+          data: ['煤炭', '火电', '焦化', '物流贸易', '文旅康养', '水务', '生物', '冶金', '建材'],
 
           axisLine: {
 
             show: true, //隐藏X轴轴线
 
             lineStyle: {
 
@@ -703,6 +831,7 @@ let app = new Vue({
 
           },
 
           axisLabel: {
 
             show: true,
 
+            rotate: 20,
 
             textStyle: {
 
               color: 'rgba(255,255,255,0.6)', //X轴文字颜色
 
             },
 
@@ -737,18 +866,19 @@ let app = new Vue({
 
           },
 
           {
 
             type: 'value',
 
-            name: '%',
 
+            name: '',
 
             nameTextStyle: {
 
               color: 'rgba(255,255,255,0.6)',
 
             },
 
             axisLine: {
 
-              show: true,
 
+              show: false,
 
               lineStyle: {
 
                 color: '#3D7495',
 
               },
 
             },
 
             axisLabel: {
 
               show: true,
 
+              formatter: '{value} %',
 
               textStyle: {
 
                 color: 'rgba(250,250,250,0.6)',
 
               },
 
@@ -774,7 +904,7 @@ let app = new Vue({
 
                 ]),
 
               },
 
             },
 
-            data: [900, 600, 500, 450, 500,900, 600, 500, 450],
 
+            data: [900, 600, 500, 450, 500, 900, 600, 500, 450],
 
           },
 
           {
 
             type: 'line',
 
@@ -786,11 +916,15 @@ let app = new Vue({
 
                 color: '#FBE139',
 
               },
 
             },
 
-            data: [60, 50, 45, 50,100,45,60,45,20],
 
+            data: [60, 50, 45, 50, 100, 45, 60, 45, 20],
 
           },
 
         ],
 
       }
 
       myChart.setOption(option)
 
+      tools.loopShowTooltip(myChart, option, {
 
+        nterval: 2000,
 
+        loopSeries: true,
 
+      })
 
     },
 
   },
 
 })

+ 1228 - 0
investment/js/investHome2.js
Visa fil 

@@ -0,0 +1,1228 @@
 
+let app = new Vue({
 
+  el: '#app',
 
+  data() {
 
+    return {
 
+      year: '2022',
 
+      time: '',
 
+      timer: '',
 
+      mapName: 'shanxi',
 
+      geoCoordMap: {},
 
+      config1: {
 
+        number: [100],
 
+        content: '{nt}个',
 
+      },
 
+      storageRecordConfig: {
 
+        header: [],
 
+        headerBGC: '#05507b33',
 
+        oddRowBGC: '#05507b33',
 
+        evenRowBGC: '',
 
+        headerHeight: '40',
 
+        rowNum: 4,
 
+        align: ['center'],
 
+        data: [
 
+          ['工程建设项目'],
 
+          ['施工图设计'],
 
+          ['工程建设项目'],
 
+          ['施工图设计'],
 
+          ['工程建设项目'],
 
+        ],
 
+      },
 
+      companyList: [
 
+        { name: '山西焦煤' },
 
+        { name: '晋能控股' },
 
+        { name: '华新燃气' },
 
+        { name: '山西建投' },
 
+        { name: '潞安化工' },
 
+        { name: '华远陆港' },
 
+        { name: '航产集团' },
 
+        { name: '大地控股' },
 
+        { name: '国新能源' },
 
+        { name: '汾酒集团' },
 
+        { name: '云时代' },
 
+        { name: '神农科技' },
 
+        { name: '华阳新材' },
 
+        { name: '华舰体育' },
 
+        { name: '交控集团' },
 
+        { name: '文旅集团' },
 
+        { name: '水控集团' },
 
+        { name: '太重集团' },
 
+      ],
 
+    }
 
+  },
 
+  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.initChartR1()
 
+      this.initChartR2()
 
+      this.initChartR3()
 
+      this.initChartR4()
 
+    }, 0)
 
+  },
 
+  methods: {
 
+    convertData(data) {
 
+      var res = []
 
+      for (var i = 0; i < data.length; i++) {
 
+        var geoCoord = this.geoCoordMap[data[i].name]
 
+        if (geoCoord) {
 
+          res.push({
 
+            name: data[i].name,
 
+            value: geoCoord.concat(data[i].value),
 
+          })
 
+        }
 
+      }
 
+      return res
 
+    },
 
+    initChinaChart() {
 
+      var data = [
 
+        { name: '吕梁市', value: 150 },
 
+        { name: '大同市', value: 190 },
 
+        { name: '忻州市', value: 140 },
 
+        { name: '朔州市', value: 160 },
 
+        { name: '晋中市', value: 100 },
 
+        { name: '太原市', value: 300 },
 
+        { name: '临汾市', value: 190 },
 
+        { name: '长治市', value: 100 },
 
+        { name: '晋城市', value: 280 },
 
+        { name: '运城市', value: 180 },
 
+        { name: '阳泉市', value: 110 },
 
+      ]
 
+
 
+      var moveLine = {
 
+        normal: [
 
+          {
 
+            fromName: '太原市',
 
+            toName: '吕梁市',
 
+            coords: [
 
+              [112.3352, 37.9413],
 
+              [111.3574, 37.7325],
 
+            ],
 
+          },
 
+          {
 
+            fromName: '太原市',
 
+            toName: '忻州市',
 
+            coords: [
 
+              [112.3352, 37.9413],
 
+              [112.4561, 38.8971],
 
+            ],
 
+          },
 
+          {
 
+            fromName: '太原市',
 
+            toName: '临汾市',
 
+            coords: [
 
+              [112.3352, 37.9413],
 
+              [111.4783, 36.1615],
 
+            ],
 
+          },
 
+          {
 
+            fromName: '太原市',
 
+            toName: '阳泉市',
 
+            coords: [
 
+              [112.3352, 37.9413],
 
+              [113.4778, 38.0951],
 
+            ],
 
+          },
 
+          {
 
+            fromName: '太原市',
 
+            toName: '晋中市',
 
+            coords: [
 
+              [112.3352, 37.9413],
 
+              [112.7747, 37.37],
 
+            ],
 
+          },
 
+          {
 
+            fromName: '太原市',
 
+            toName: '运城市',
 
+            coords: [
 
+              [112.3352, 37.9413],
 
+              [111.1487, 35.2002],
 
+            ],
 
+          },
 
+          {
 
+            fromName: '太原市',
 
+            toName: '大同市',
 
+            coords: [
 
+              [112.3352, 37.9413],
 
+              [113.7854, 39.8035],
 
+            ],
 
+          },
 
+          {
 
+            fromName: '太原市',
 
+            toName: '晋城市',
 
+            coords: [
 
+              [112.3352, 37.9413],
 
+              [112.7856, 35.6342],
 
+            ],
 
+          },
 
+          {
 
+            fromName: '太原市',
 
+            toName: '长治市',
 
+            coords: [
 
+              [112.3352, 37.9413],
 
+              [112.8625, 36.4746],
 
+            ],
 
+          },
 
+          {
 
+            fromName: '太原市',
 
+            toName: '朔州市',
 
+            coords: [
 
+              [112.3352, 37.9413],
 
+              [113.0713, 39.6991],
 
+            ],
 
+          },
 
+        ],
 
+      }
 
+      /*获取地图数据*/
 
+      let myChart = echarts.init(this.$refs['echarts-map'])
 
+      echarts.registerMap('shanxi', {
 
+        type: 'FeatureCollection',
 
+        features: [
 
+          {
 
+            type: 'Feature',
 
+            id: '1409',
 
+            properties: { name: '忻州市', cp: [112.4561, 38.8971], childNum: 14 },
 
+            geometry: {
 
+              type: 'Polygon',
 
+              coordinates: [
 
+                '@@Vx@lnbn¦WlnnUšmš°š²VšV‚VVVnUn„ºlz@l„„@Jƒ@kXWVXl@Lƒa@„ƒKUL„ŽlbnKlLnK‚LnKÆXn°šbVV@bUVl°Un@LnaVJUbW@UX²l‚@ČwlVVIšWnkÆa°„„anV‚Kn°™UW¯@™aVUVk@Un@„aV@ValwUanmWU„k@WVUUanaVwnLVl°@nk@mVU@UVK@w„LVKVU@ƒ„K@UUKVUV@@bnL„a‚V„aôšlIXmlKX_°KVV@bVV„@šzV`kblI„V„Ul‚šL@bnV@V„Ċll„„VlIXW@k„a‚U²blKšVnIlJ„albXXlWVn°JnšnL@l@XlJlaX@„X˜W²@l_VmnKšU„blU@mnkVK„¯@U@ƒma@kX¥VƒmakkƒLƒa@aƒ@WIUUVXWWnk@a°a@kkm@kUUmJm@WUUUIk`m@V—kaWWkX™KmƒXk¯ƒ@WKƒLkak@±bƒw@ƒaƒa@akaƒ@ma¯@ƒL—KÇÅkKWbkmġ™±ÅUƒLUK™VVkƒm¯LUVVbƒ„UwUW¯bm„ƒULƒxWJ—@ƒklmkUm@@KnwVkVK@akwƒ@@a¯bƒKkn›VUI™b¯mmbk@UbmKUL@xUUƒ@klmLUŽlVXI‚VVVUVUœU`mLXVWbXnW`Ų°xmŽxU@mĉƒƒwU@mbU@UƒmbkVW¦kJ™@ƒX@`¯Im@UlUVVnb@bWJXnmbƒJUU™UUaƒ@UamIkaƒxƒ@@x@b',
 
+              ],
 
+              encodeOffsets: [[113614, 39657]],
 
+            },
 
+          },
 
+          {
 
+            type: 'Feature',
 
+            id: '1411',
 
+            properties: { name: '吕梁市', cp: [111.3574, 37.7325], childNum: 13 },
 
+            geometry: {
 
+              type: 'Polygon',
 
+              coordinates: [
 
+                '@@@a@w„@„wlbnJVb„@VbšVVV„InaWmXI@a‚aUmVUVkn@°J@_„Wš@lIX¥lUnaV„V@naV@„xĊ„n‚V@‚wn¯wƱX_WmXaWUnKV_V›VUUUUWJkUVnKlk¯™@@kmKUaŁ±KkU@WmI@WUIlUUmVwXƒ‚w@ƒUlUVwœV‚@„Lnb‚W@anU@UšaVkô@l»n@na˜JnUÈLVaƃUUVm„VKVƒ²L@mU_lK@UVWkU‚a@a@U¯aUaƒÑóÑUb™„ƒKk@@aƒk¯mVaUwVƒÑkWUmK@UUKmXUWÝwUa™LUU@aWJUUU@Ua݄U@WL@VKVaVI@WnU@alIVKƒƒ@kIƒmIkJ@™m@ƒ™@@_™K@xƒ@kaW@U„@Vmn@ŽUK@mIƒJUXV¤XXWlkKƒkkK@XmJVakImJU@ó™¯LWKUV@nUVƒLkxmKkLma@kXKmmƒLƒab™LmK@V@mXVÆUxƒX@`nL„aV@@VmLUVnLlLš˜„b@„šŽ°²nx@b‚VUxlb@V¯bUV@zV‚XVĊXVx@lVn@VnnmŽUš@LlJXVƒz¯VWVXbšV@bmn™VUVk„Çþń@XVxmbUlV„Uln„W„@„Xl‚@VLXÒ@bÞJ°¦„L˜ò„@nU‚b@°„X@ŽXbmVU„V„nb@x‚x',
 
+              ],
 
+              encodeOffsets: [[113614, 39657]],
 
+            },
 
+          },
 
+          {
 
+            type: 'Feature',
 
+            id: '1410',
 
+            properties: { name: '临汾市', cp: [111.4783, 36.1615], childNum: 17 },
 
+            geometry: {
 
+              type: 'Polygon',
 
+              coordinates: [
 
+                '@@nW‚@@UnLšK‚a„b„KnnWL@lnblKnLlw„KVU@mVUXL°KôšV@nIlJUbnI@WlL„llLXkWWU£VW„InJ‚@VL@nm@UVƒX@lb„@@wšL@`‚@„šn@V@lw„@n„VmVX„WmwnUlƒœa@_lK„wVlUn°xVKVXXWlUšVVI@K@K„n°KœwlVlU@kna@V_„Wn‚m„UVm@kXml_@m„LlKXw°m@_ôJVUV@X™l@UaV@Va°I„lk»VwUkVmwUmmVn@V¯@KƒU—wmK@U¯wUVÝ@mJƒU—nWK™@@UnKVa„_lykUmKÛnm@™x@ƒUUlwVk™ƒXW@ƒa@Uƒ@@K@ƒkIV™nammVakUlƒ@wX@@kƒ™¯@ƒVVbml@„„°UbULmlVbnbÅK±VƒKVXUJWa@ULWaUU@@U@aWK@UkxUKƒLUUUJ±UkL@V±kk@kam@UV@l@LWl@n@VVUx„LlUUx@VUV™U@aƒIUl™L@°mLU‚ƒbkUUaWUUaUU@aWK—LWJ@bUL@VUVVbU@m@a@kmKmnĉlUK™XƒWUblb—xmIkƒƒU@xWb@lkšVx™LXŽmzVV@bklVVUzm˜@bk„@Vx@xlŽU„@lUbVnl@„Wxnl@n@ŽUbV„mL‚mƒb@`X@lUX@@xlnkLWaUJnnWV™Vn@l„@bULVV@l™V@XnJVX',
 
+              ],
 
+              encodeOffsets: [[113063, 37784]],
 
+            },
 
+          },
 
+          {
 
+            type: 'Feature',
 
+            id: '1407',
 
+            properties: { name: '晋中市', cp: [112.7747, 37.37], childNum: 11 },
 
+            geometry: {
 
+              type: 'Polygon',
 
+              coordinates: [
 
+                '@@@šlInJ„lJ„@‚„ULkJ@bmV@XUJUb‚L@UXKV@ރVbV@VVXI@bVVšKVbÞxVXnWVL@VnLV‚lX„ÒUŽVxUb°n„l@bl@„LšƒVaô҄ÒVb°b@VnLnnV@lmn@lb„U„V@„‚JœUVV‚Xkl@lUzmJ@xšXkl‚bUn„JVšUb„nU‚lb„V@nlLX@lakšV`Ub°š@XVJnU‚L²KlxnI@KV@lbUbVV„KnVl@„zlm@Uš@nŽšI@WUaVl@@mVU„@XkW@ƒnkVKVƒ„_Vw„y@knwVa‚@XalU„@šVnml@„X@V„L‚KVaÞbnnlJšI„mVKn„VVVInVlU„@„m@™mXK@UmyUI@mWUUakamw@wUwmLkakwVƒmK™w@wUam£y@am_ƒW@™UU@knmm„amU@WUa@knw@ƒUUUUV@nƒJm@mVUkKVUUUkKmwƒKULƒKUImV@lUn™nŽm@mbUK@°™bUnmbUmkkƒWUb@am@UXkK@a±@™V™@ĉř„V‚UXVxUVkLWl¯@@bULUlm@@nm`—XƒlWakIkm›VUbUL@Vm@kIƒ@@Kšm@—VaX‚I@W@aU@kUƒVU_™KƒbƒJkkǎ™b@nkKmL™wÅW@kVUUƒVU@WUIƒJmIXmma@_kyVaUUlkUm@ƒkU›x¯Lƒm@L@LUJ™UkVWXUWUL¯wVmUkƒxkL@`›bk„mVnxƒXUWUnmƒƒ@kxU@',
 
+              ],
 
+              encodeOffsets: [[114087, 37682]],
 
+            },
 
+          },
 
+          {
 
+            type: 'Feature',
 
+            id: '1408',
 
+            properties: { name: '运城市', cp: [111.1487, 35.2002], childNum: 13 },
 
+            geometry: {
 
+              type: 'Polygon',
 
+              coordinates: [
 
+                '@@„Vl„nJ˜wkaVa„XšWVLĊknmnL‚l@@bn‚V@UaVU@UVK@aXI˜KXL@bVVVbXVVblV„aVnK@¯šKVk„J@bšVVU@UVwkVƒKVwUUm@@Xk@K@kVUn@lbl@²l@UlK²VVIVV„KVLlw@VXL@b@VV@VŽXbVK‚@XbVIUW„L‚U²ÆLmaUankVKVaƒ¯@ƒnkUa„U°@„š‚n@@kWa„UVaXUW@IXKVw@U™ƒ„™WU@W@@UUƒU@mn@ƒ`m@UUULkUmJ™IUƒ@@UƒK@U@›anƒ™ak_@wmKUwmakV™kmK™V™k¯b™wƒ`kwUIÇx¯»ÇaŃmn@@™mƒmUkV@wkKW@kxmL™UkĉLÝk™xÝw¯lóVU„mV@ĀVVX¦W¤kz@`Vx°„²ĸ‚š@„Ul@x„êĸNJ°¤V„VlXLWnXxmV@nUl@„',
 
+              ],
 
+              encodeOffsets: [[113232, 36597]],
 
+            },
 
+          },
 
+          {
 
+            type: 'Feature',
 
+            id: '1402',
 
+            properties: { name: '大同市', cp: [113.7854, 39.8035], childNum: 8 },
 
+            geometry: {
 
+              type: 'Polygon',
 
+              coordinates: [
 
+                '@@²£šyl@Ȑ˜Ė@bĸŽĢbĸ„˜X„a‚KŤnn@ŎôllÈx„nVnÞDŽV@b‚nXllL°KšbVb@J@b—„‚„@ŽU„„xlKXLlKlXk„@Ulk„JlkUƒVKXUƒÇVIVm@_nǚLšašl‚w„VnU@UUwma@aƒaÝaLmUk@@Wƒ@U@@X™wVWÝUUUk@@VmLƒKV»nwUw™aUL@`mzƒJUIVƒUaUw™KUaVIlJôanÑlLVUn@ša„@VV„@@UUwVK°Vn_lJÆLœéW@UUUÅ@»lm@aÞIVwXW˜UUkkm@U@aƒU@mwU£VWU_kWmƒXwW_°yUkkK@UÇK@kkUVymóK—U@KWIƒbUak@mJ@bkbmLkŽ™UmƒkVU„W¦@lnb@„@Vƒ°ULml@nkVƒa™VmLUnk`±@—XƒWW@kbǦXŽ¯„WxI@xmbmxXlWV„„@bŎUz@J‚b@bÞb™ŽU@Wbk@ƒxk@WX¯VۙƒWÝbÝUkVUU@alI@a@akLWa™m@U¯UUmÇL@K@aU@¯VUkƒKmX@`@œkJ@nV‚Ub@lbVÆXVW„ULU`VbkLUV@XWl@bXJ˜@VbV@Vl',
 
+              ],
 
+              encodeOffsets: [[115335, 41209]],
 
+            },
 
+          },
 
+          {
 
+            type: 'Feature',
 
+            id: '1404',
 
+            properties: { name: '长治市', cp: [112.8625, 36.4746], childNum: 12 },
 
+            geometry: {
 
+              type: 'Polygon',
 
+              coordinates: [
 
+                '@@Uk™Lky@I‚JVa@mÞaWšy@_W@_WƒXVlUVwš@nw°K@m„UƒVaƒmVkU@mmmnLVUmKXa™U@IlKVUnK@UmWkX@WV_Vƒ@akU@a„KWIXyƒIUVmUn™Ua@WaXUVKVmkUWVkUƒLU@@VƒbƒKbƒIUmƒ@mbVL—x›WUUkn±V¯wƒbÅJUbmLkbmKÅKƒbVnUbƒV™KUb™KUbmLKmƒb™aƒKkUm@UŽnn‚VnxUVlUxl¼ƒk¯JUbU@Vbk@WšU@UVóI@`¯nWxkLƒK@nk`Wn@lUnƒVnm‚ƒXU`@mb@lkV@„VnklVVUblz@`nbWnnJ„IVJ@XUVV„UV@lÆXšxnKlL@mšaȍll„I„ašLV`„UlVV@@b@XJWUb@˜™n@L„@lJn@@UVKVaœUlnlJXb„k˜Wn_@mn@VkVK@a°@XklKVUUwVWUšƒĊƚ@šU²@@blLVWn@@bVa„XllVnnaVmša@¯VLnan@‚šmVm@knUVJ',
 
+              ],
 
+              encodeOffsets: [[116269, 37637]],
 
+            },
 
+          },
 
+          {
 
+            type: 'Feature',
 
+            id: '1406',
 
+            properties: { name: '朔州市', cp: [113.0713, 39.6991], childNum: 5 },
 
+            geometry: {
 
+              type: 'Polygon',
 
+              coordinates: [
 
+                '@@XXWVXVWnnlnn@èƼ@„„xlš„ŽV„nblšššVŽÈUVl‚š@„blnœL܃ĊmUkU@Ua‚—@WI@aXk@WVUlKUaV_VKXƒWUUÅka@VaU@mlI@›@_nW„LVl°UV@@b@LÈKVn°V@VšnXblK@b@bkJ@bVVlUÞVÞa„Xܚ°UXWl@„wl@XaV@šÝa@aa@IVyƍ@aƒƒXUWknwna@w‚JXw°ƒWÈ¥kI@W@kmKm™¯IUmkXWWkaƒbkImJ™UkL±aVƒb@lWXkJƒUkƒĉkƒ@UmU@a™KkƒVƒUkJlaU_™yƒ@UU@aUU¯LW`kLWnkJó™ƒbUƒbmK@aU@UVVL@VƒL@„UVULƒK@xUL@VUV@nml¯@UkmKUxmbVbUV@XƒlXVmnVbkxUbU@ƒbm@@VUlUVšb°@VX¯šm‚',
 
+              ],
 
+              encodeOffsets: [[114615, 40562]],
 
+            },
 
+          },
 
+          {
 
+            type: 'Feature',
 
+            id: '1405',
 
+            properties: { name: '晋城市', cp: [112.7856, 35.6342], childNum: 6 },
 
+            geometry: {
 
+              type: 'Polygon',
 
+              coordinates: [
 
+                '@@lV„Lšb„an‚LnKVašLVašL„UVaUm„aÆLnLlanKVaÆI„a°x²UlmVVœX˜wUKna„@Vn„J‚a„L„a@UV@@alUkKVKnkmmVwUk„w@ƒ™@kxWUXƒW@@mƒk@aUa@a¯aƒLkKmwkUm@kL@K@aWIXmƒVƒXƒWkUVakL@UVKƒw@aUK@UUKmLU@¯n™KUwVƒUIWJUWmka™@UXƒJƒk@UkmW@kLWKVƒx@bmI@VUaVU@a¯@UUmVKmX@±`kÝKVxUL±akL@V™bƒLkKmVƒ@XWVUbƒVXb@lm@@lW@@xk„lVUbnnmbUšlJ@„@L„@@V„b@‚WXš„UlkxVV@„šwn@ÜmnLlVkzƒ`UbmL@Vš@XL˜m„VnIÞ@VU°x@VnL˜x„V@LU°',
 
+              ],
 
+              encodeOffsets: [[115223, 36895]],
 
+            },
 
+          },
 
+          {
 
+            type: 'Feature',
 
+            id: '1401',
 
+            properties: { name: '太原市', cp: [112.3352, 37.9413], childNum: 5 },
 
+            geometry: {
 
+              type: 'Polygon',
 
+              coordinates: [
 
+                '@@„@VV@wVKnLVal@na°nšaVJœUlm„L°a@b„@lx@bULUlmx@Ln@lVkn„l˜@XI„w‚K„Vnƒ°aVXVx„ƒUaVU°K„nUlšUVL„KÆVš²Ģ‚lnXalLÈƘL„KUaVkUanmWU™a@WwkUWU¯y¯Ñ@anIl@@aVU„m„I„ymUƒLUUVakaU@@LmJkw±LKmVUI@W¯™VaU_l™kbW@kK@mƒUkaVƒmVaU™ƒIVmalk™W@wnIVy@klkWUU›VI@ƒƒUƒVkam@knU@mmmK@bblVUX@VkLV`@n±KU„ULƒ‚UnVVńUbÇKmV—Imbm@k¼ó@Ul™b@VmV@bXmaƒK@›UUxkV‚V@„xW„UxVnkVVJ@XnJ@XlV²LƂVbnL@lš@°',
 
+              ],
 
+              encodeOffsets: [[114503, 39134]],
 
+            },
 
+          },
 
+          {
 
+            type: 'Feature',
 
+            id: '1403',
 
+            properties: { name: '阳泉市', cp: [113.4778, 38.0951], childNum: 3 },
 
+            geometry: {
 
+              type: 'Polygon',
 
+              coordinates: [
 
+                '@@°@nb„@lb@b„b„b‚@„x²al@lb„KXU@m‚kUWkkmUUƒVwV@XUW@™naVklKXblKnL‚ƒnLVanImaXKlL„ašV@U@KUKW„alƒXK@£WKXUV@VU„ƒUUVW„_V™@W@@K„@šƒUƒƒIWmXUmƒULƒn™JkImmÝaUbLƒK@UƒWk@mn™Uƒ@kVWb@Ubmx@lƒzUxƒ`U„ULml@„XWlƒ@UV@nk@U‚Vb@X™Jm™@@Vknƒyk@ƒzƒJƒnUV@bk@mJ@b°Ò°zXVlVXx‚@šbXVmnVbUlVb',
 
+              ],
 
+              encodeOffsets: [[115864, 39336]],
 
+            },
 
+          },
 
+        ],
 
+        UTF8Encoding: true,
 
+      })
 
+      var mapFeatures = echarts.getMap(this.mapName).geoJson.features
 
+      mapFeatures.forEach(v => {
 
+        // 地区名称
 
+        var name = v.properties.name
 
+        // 地区经纬度
 
+        this.geoCoordMap[name] = v.properties.cp
 
+      })
 
+
 
+      myChart.setOption({
 
+        tooltip: {
 
+          padding: 15,
 
+          enterable: true,
 
+          transitionDuration: 1,
 
+          formatter: (params, ticket, callback) => {
 
+            let tipHtml = `
 
+              <div class="tooltip-cont">
 
+                <p>新开工：<span>工程建设项目</span></p>
 
+                <p>总投资额：<span>${params.data.value}亿</span></p>
 
+                <p>当前阶段：<span>可论证阶段</span></p>
 
+                <p>时间节点：<span>2021.10-2022.10</span></p>
 
+            </div>`
 
+            return tipHtml
 
+          },
 
+        },
 
+        visualMap: {
 
+          min: 0,
 
+          max: 300,
 
+          right: 0,
 
+          bottom: 0,
 
+          text: ['高', '低'],
 
+          textStyle: {
 
+            color: '#f1f1f1'
 
+          },
 
+          realtime: false,
 
+          calculable: true,
 
+          inRange: {
 
+            color: ['lightskyblue', '#2754b7']
 
+          }
 
+        },
 
+        geo: {
 
+          show: true,
 
+          map: 'shanxi',
 
+          layoutCenter: ['50%', '50%'], //地图位置
 
+          layoutSize: '100%',
 
+          label: {
 
+            normal: {
 
+              show: false,
 
+            },
 
+            emphasis: {
 
+              show: false,
 
+            },
 
+          },
 
+          roam: false,
 
+          itemStyle: {
 
+            normal: {
 
+              areaColor: '#1946a8',
 
+              shadowColor: '#1946a8',
 
+              borderWidth: 1, //设置外层边框
 
+              borderColor: '#1946a8',
 
+              shadowOffsetX: 10,
 
+              shadowOffsetY: 5,
 
+              shadowBlur: 2,
 
+            },
 
+            emphasis: {
 
+              areaColor: '#1946a8',
 
+              borderColor: '#d4bc1d',
 
+              borderWidth: 2, //设置外层边框
 
+            },
 
+          },
 
+        },
 
+        series: [
 
+          {
 
+            name: '散点',
 
+            type: 'scatter',
 
+            coordinateSystem: 'geo',
 
+            data: this.convertData(data),
 
+            symbolSize: function (val) {
 
+              return 10
 
+            },
 
+            label: {
 
+              normal: {
 
+                formatter: '{b}',
 
+                position: [10, 10],
 
+                fontSize: 15,
 
+                fontWeight: 600,
 
+                fontStyle: 'italic',
 
+                color: '#fff',
 
+                show: true,
 
+              },
 
+              emphasis: {
 
+                show: true,
 
+              },
 
+            },
 
+            itemStyle: {
 
+              normal: {
 
+                color: '#000',
 
+                borderWidth: 2,
 
+                borderColor: '#fff',
 
+              },
 
+            },
 
+          },
 
+          {
 
+            type: 'map',
 
+            map: this.mapName,
 
+            geoIndex: 0,
 
+            aspectScale: 0.75, //长宽比
 
+            showLegendSymbol: true, // 存在legend时显示
 
+            label: {
 
+              normal: {
 
+                show: true,
 
+              },
 
+              emphasis: {
 
+                show: false,
 
+                textStyle: {
 
+                  color: '#fff',
 
+                },
 
+              },
 
+            },
 
+            roam: true,
 
+            itemStyle: {
 
+              normal: {
 
+                areaColor: '#031525',
 
+                borderColor: '#3B5077',
 
+              },
 
+              emphasis: {
 
+                areaColor: '#2B91B7',
 
+              },
 
+            },
 
+            animation: false,
 
+            data: data,
 
+          },
 
+          {
 
+            name: '点',
 
+            type: 'scatter',
 
+            coordinateSystem: 'geo',
 
+            zlevel: 6,
 
+          },
 
+          {
 
+            name: 'Top 5',
 
+            type: 'effectScatter',
 
+            coordinateSystem: 'geo',
 
+            data: this.convertData(
 
+              data
 
+                .sort(function (a, b) {
 
+                  return b.value - a.value
 
+                })
 
+                .slice(0, 5)
 
+            ),
 
+            symbolSize: function (val) {
 
+              return 15
 
+            },
 
+            showEffectOn: 'render',
 
+            rippleEffect: {
 
+              brushType: 'stroke',
 
+            },
 
+            hoverAnimation: true,
 
+            label: {
 
+              normal: {
 
+                formatter: '{b}',
 
+                position: 'left',
 
+                show: false,
 
+              },
 
+            },
 
+            itemStyle: {
 
+              normal: {
 
+                color: 'yellow',
 
+                shadowBlur: 10,
 
+                shadowColor: 'yellow',
 
+              },
 
+            },
 
+            zlevel: 1000,
 
+          },
 
+          {
 
+            name: '线路',
 
+            type: 'lines',
 
+            zlevel: 2,
 
+            effect: {
 
+              show: true,
 
+              period: 4, //箭头指向速度，值越小速度越快
 
+              trailLength: 0.02, //特效尾迹长度[0,1]值越大，尾迹越长重
 
+              symbol: 'arrow', //箭头图标
 
+              symbolSize: 5, //图标大小
 
+            },
 
+            lineStyle: {
 
+              normal: {
 
+                color: '#00FFFF',
 
+                width: 1,
 
+                type: 'dashed',
 
+                opacity: 0.5, //尾迹线条透明度
 
+                curveness: -0.3, //尾迹线条曲直度
 
+              },
 
+            },
 
+            data: moveLine.normal,
 
+          },
 
+        ],
 
+      })
 
+    },
 
+    initChartL1() {
 
+      let myChart = echarts.init(this.$refs['echartL1'])
 
+      let option = {
 
+        title: {
 
+          text: '储备项目产业分布',
 
+          x: 'center',
 
+          y: '87%',
 
+          textStyle: {
 
+            color: 'rgba(255,255,255,0.6)',
 
+            fontSize: 12,
 
+          },
 
+        },
 
+        tooltip: {
 
+          trigger: 'item',
 
+        },
 
+        color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3'],
 
+        legend: {
 
+          icon: 'circle',
 
+          top: 'bottom',
 
+          orient: 'vertical',
 
+          right: '1%',
 
+          textStyle: {
 
+            color: '#9DB9EB',
 
+          },
 
+        },
 
+        series: [
 
+          {
 
+            name: '',
 
+            type: 'pie',
 
+            radius: ['50%','70%',],
 
+            center: ['50%', '45%'],
 
+            itemStyle: {
 
+              normal: {
 
+                label: {
 
+                  show: false,
 
+                },
 
+              },
 
+            },
 
+            labelLine: {
 
+              show: false,
 
+              emphasis: {
 
+                show: true
 
+              }
 
+            },
 
+            data: [
 
+              { value: 1048, name: '煤炭' },
 
+              { value: 735, name: '火电' },
 
+              { value: 580, name: '焦化' },
 
+              { value: 484, name: '风电' },
 
+            ],
 
+          },
 
+        ],
 
+      }
 
+      myChart.setOption(option)
 
+      tools.loopShowTooltip(myChart, option, {
 
+        nterval: 2000,
 
+        loopSeries: true,
 
+      })
 
+    },
 
+    initChartL2() {
 
+      let myChart = echarts.init(this.$refs['echartL2'])
 
+      var value = 0.45;
 
+      var data = [value];
 
+      let option = {
 
+        backgroundColor: 'transparent',
 
+        title: [
 
+          {
 
+            text: '450.12亿',
 
+            x: '38%',
 
+            y: '80%',
 
+            textStyle: {
 
+              fontSize: 24,
 
+              fontWeight: 'bold',
 
+              color: '#2CB7E0',
 
+              lineHeight: 16,
 
+              textAlign: 'center',
 
+            },
 
+          }
 
+        ],
 
+        series: [
 
+          {
 
+            type: 'liquidFill',
 
+            radius: '70%',
 
+            center: ['50%', '40%'],
 
+            color: [
 
+              {
 
+                type: 'linear',
 
+                x: 0,
 
+                y: 0,
 
+                x2: 0,
 
+                y2: 1,
 
+                colorStops: [
 
+                  {
 
+                    offset: 0,
 
+                    color: '#446bf5',
 
+                  },
 
+                  {
 
+                    offset: 1,
 
+                    color: '#2ca3e2',
 
+                  },
 
+                ],
 
+                globalCoord: false,
 
+              },
 
+            ],
 
+            data: [value, value], // data个数代表波浪数
 
+            backgroundStyle: {
 
+              borderWidth: 1,
 
+              color: 'RGBA(51, 66, 127, 0.7)',
 
+            },
 
+            label: {
 
+              normal: {
 
+                textStyle: {
 
+                  fontSize: 30,
 
+                  color: '#fff',
 
+                },
 
+              },
 
+            },
 
+            outline: {
 
+              // show: false
 
+              borderDistance: 0,
 
+              itemStyle: {
 
+                borderWidth: 2,
 
+                borderColor: 'transparent',
 
+              },
 
+            },
 
+          },
 
+        ],
 
+      }
 
+      myChart.setOption(option)
 
+    },
 
+    initChartL3() {
 
+      let myChart = echarts.init(this.$refs['echartL3'])
 
+      let option = {
 
+        tooltip: {
 
+          trigger: 'axis',
 
+          axisPointer: {
 
+            type: 'shadow',
 
+          },
 
+        },
 
+        grid: {
 
+          top: '22%',
 
+          right: '5%',
 
+          left: '10%',
 
+          bottom: '25%',
 
+        },
 
+        xAxis: {
 
+          data: ['总投资收益率', '销售利润率'],
 
+          axisLine: {
 
+            show: true, //隐藏X轴轴线
 
+            lineStyle: {
 
+              color: '#005094',
 
+              width: 1,
 
+            },
 
+          },
 
+          axisTick: {
 
+            show: true, //隐藏X轴刻度
 
+          },
 
+          axisLabel: {
 
+            show: true,
 
+            rotate: 15,
 
+            textStyle: {
 
+              color: 'rgba(255,255,255,0.6)', //X轴文字颜色
 
+              fontSize: 12,
 
+            },
 
+          },
 
+        },
 
+        yAxis: [
 
+          {
 
+            type: 'value',
 
+            splitLine: {
 
+              show: true,
 
+              lineStyle: {
 
+                color: '#68b4dd66',
 
+                type: 'dashed',
 
+              },
 
+            },
 
+            axisLine: {
 
+              show: false
 
+            },
 
+            axisLabel: {
 
+              show: true,
 
+              formatter: '{value}',
 
+              textStyle: {
 
+                color: 'rgba(250,250,250,0.6)',
 
+              },
 
+            },
 
+            nameTextStyle: {
 
+              color: '#ebf8ac',
 
+              fontSize: 16,
 
+            },
 
+          },
 
+        ],
 
+        series: [
 
+          {
 
+            name: '',
 
+            type: 'bar',
 
+            barWidth: 15,
 
+            itemStyle: {
 
+              normal: {
 
+                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
+                  {
 
+                    offset: 0,
 
+                    color: '#69c0ff',
 
+                  },
 
+                  {
 
+                    offset: 1,
 
+                    color: '#082550',
 
+                  },
 
+                ]),
 
+              },
 
+            },
 
+            data: [10, 20],
 
+            markLine: {
 
+              symbol: ['none', 'none'],
 
+              data: [
 
+                {
 
+                  name: '生存线',
 
+                  yAxis: 10,
 
+                  lineStyle: {
 
+                    color: '#FF8F0A',
 
+                  },
 
+                  label: {
 
+                    formatter: '{b}',
 
+                    position: 'middle',
 
+                    color: '#FF8F0A',
 
+                    fontSize: 12,
 
+                  },
 
+                },
 
+                {
 
+                  name: '发展线',
 
+                  yAxis: 15,
 
+                  lineStyle: {
 
+                    color: '#00EEA2',
 
+                  },
 
+                  label: {
 
+                    formatter: '{b}',
 
+                    position: 'middle',
 
+                    color: '#00EEA2',
 
+                    fontSize: 12,
 
+                  },
 
+                },
 
+              ],
 
+              label: {
 
+                distance: [50, 0],
 
+              },
 
+            },
 
+          },
 
+        ],
 
+      }
 
+      myChart.setOption(option)
 
+      tools.loopShowTooltip(myChart, option, {
 
+        nterval: 2000,
 
+        loopSeries: true,
 
+      })
 
+    },
 
+    initChartL4() {
 
+      let myChart = echarts.init(this.$refs['echartL4'])
 
+      let option = {
 
+        title: {
 
+          text: '储备项目产业分布',
 
+          x: 'center',
 
+          y: '87%',
 
+          textStyle: {
 
+            color: 'rgba(255,255,255,0.6)',
 
+            fontSize: 12,
 
+          },
 
+        },
 
+        tooltip: {
 
+          trigger: 'item',
 
+        },
 
+        color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3'],
 
+        legend: {
 
+          icon: 'circle',
 
+          top: 'bottom',
 
+          orient: 'vertical',
 
+          right: '1%',
 
+          textStyle: {
 
+            color: '#9DB9EB',
 
+          },
 
+        },
 
+        series: [
 
+          {
 
+            name: '',
 
+            type: 'pie',
 
+            radius: ['50%', '70%'],
 
+            center: ['50%', '45%'],
 
+            itemStyle: {
 
+              normal: {
 
+                label: {
 
+                  show: false,
 
+                },
 
+              },
 
+            },
 
+            labelLine: {
 
+              show: false,
 
+            },
 
+            data: [
 
+              { value: 1048, name: '煤炭' },
 
+              { value: 735, name: '火电' },
 
+              { value: 580, name: '焦化' },
 
+              { value: 484, name: '风电' },
 
+            ],
 
+          },
 
+        ],
 
+      }
 
+      myChart.setOption(option)
 
+      tools.loopShowTooltip(myChart, option, {
 
+        nterval: 2000,
 
+        loopSeries: true,
 
+      })
 
+    },
 
+    initChartR1() {
 
+      let myChart = echarts.init(this.$refs['echartR1'])
 
+      let option = {
 
+        title: {
 
+          text: '储备项目产业分布',
 
+          x: '15%',
 
+          y: '87%',
 
+          textStyle: {
 
+            color: 'rgba(255,255,255,0.6)',
 
+            fontSize: 12,
 
+          },
 
+        },
 
+        tooltip: {
 
+          trigger: 'item',
 
+        },
 
+        color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3'],
 
+        legend: {
 
+          icon: 'circle',
 
+          top: 'bottom',
 
+          orient: 'vertical',
 
+          right: '1%',
 
+          textStyle: {
 
+            color: '#9DB9EB',
 
+          },
 
+        },
 
+        series: [
 
+          {
 
+            name: '',
 
+            type: 'pie',
 
+            radius: ['40%', '60%'],
 
+            center: ['40%', '45%'],
 
+            itemStyle: {
 
+              normal: {
 
+                label: {
 
+                  show: false,
 
+                },
 
+              },
 
+            },
 
+            labelLine: {
 
+              show: false,
 
+            },
 
+            data: [
 
+              { value: 1048, name: '煤炭' },
 
+              { value: 735, name: '火电' },
 
+              { value: 580, name: '焦化' },
 
+              { value: 484, name: '风电' },
 
+            ],
 
+          },
 
+        ],
 
+      }
 
+      myChart.setOption(option)
 
+      tools.loopShowTooltip(myChart, option, {
 
+        nterval: 2000,
 
+        loopSeries: true,
 
+      })
 
+    },
 
+    initChartR2() {
 
+      let myChart = echarts.init(this.$refs['echartR2'])
 
+      let option = {
 
+        title: {
 
+          text: '储备项目产业分布',
 
+          x: '15%',
 
+          y: '87%',
 
+          textStyle: {
 
+            color: 'rgba(255,255,255,0.6)',
 
+            fontSize: 12,
 
+          },
 
+        },
 
+        tooltip: {
 
+          trigger: 'item',
 
+        },
 
+        color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3'],
 
+        legend: {
 
+          icon: 'circle',
 
+          top: 'bottom',
 
+          orient: 'vertical',
 
+          right: '1%',
 
+          textStyle: {
 
+            color: '#9DB9EB',
 
+          },
 
+        },
 
+        series: [
 
+          {
 
+            name: '',
 
+            type: 'pie',
 
+            radius: ['40%', '60%'],
 
+            center: ['40%', '45%'],
 
+            itemStyle: {
 
+              normal: {
 
+                label: {
 
+                  show: false,
 
+                },
 
+              },
 
+            },
 
+            labelLine: {
 
+              show: false,
 
+            },
 
+            data: [
 
+              { value: 1048, name: '煤炭' },
 
+              { value: 735, name: '火电' },
 
+              { value: 580, name: '焦化' },
 
+              { value: 484, name: '风电' },
 
+            ],
 
+          },
 
+        ],
 
+      }
 
+      myChart.setOption(option)
 
+      tools.loopShowTooltip(myChart, option, {
 
+        nterval: 2000,
 
+        loopSeries: true,
 
+      })
 
+    },
 
+    initChartR3() {
 
+      let myChart = echarts.init(this.$refs['echartR3'])
 
+      let option = {
 
+        title: {
 
+          text: '固定资产项目',
 
+          textStyle: {
 
+            color: '#69C0FF',
 
+          },
 
+          top: '10',
 
+          left: '10'
 
+        },
 
+        textStyle: {
 
+          color: '#fff',
 
+        },
 
+        tooltip: {
 
+          trigger: "axis",
 
+          axisPointer: {
 
+            lineStyle: {
 
+              type: 'dashed',
 
+              width: 2,
 
+              color: 'rgba(255,255,255,0.6)'
 
+            },
 
+            animation: true
 
+          }
 
+        },
 
+        grid: {
 
+          show: false
 
+        },
 
+        yAxis: {
 
+          data: ['批量备案', '特别监管'],
 
+          splitLine: {
 
+            show: true,
 
+            lineStyle: {
 
+              color: '#68b4dd66',
 
+              type: 'dashed',
 
+            },
 
+          },
 
+          axisLine: {
 
+            show: false
 
+          },
 
+          axisLabel: {
 
+            show: true,
 
+            formatter: '{value}',
 
+            textStyle: {
 
+              color: 'rgba(250,250,250,0.6)',
 
+            },
 
+          },
 
+          nameTextStyle: {
 
+            color: '#ebf8ac',
 
+            fontSize: 16,
 
+          },
 
+        },
 
+        xAxis: {
 
+          data: ['项目储备', '项目立项', '项目可研', '可研论证', '投资决策'],
 
+          axisLine: {
 
+            show: true, //隐藏X轴轴线
 
+            lineStyle: {
 
+              color: '#005094',
 
+              width: 1,
 
+            },
 
+          },
 
+          axisTick: {
 
+            show: false, //隐藏X轴刻度
 
+          },
 
+          axisLabel: {
 
+            show: true,
 
+            textStyle: {
 
+              color: 'rgba(255,255,255,0.6)', //X轴文字颜色
 
+              fontSize: 12,
 
+            },
 
+          },
 
+        },
 
+        series: [
 
+          {
 
+            name: '',
 
+            type: 'scatter',
 
+            symbol: 'circle',//'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
 
+            symbolSize: function (data) {
 
+              return Math.sqrt(data[2]) * 0.5;
 
+            },
 
+            label: {
 
+              emphasis: {
 
+                show: true,
 
+                formatter: function (param) {
 
+                  return param.data[2];
 
+                },
 
+                position: 'top'
 
+              }
 
+            },
 
+            itemStyle: {
 
+              normal: {
 
+                color: 'red'
 
+              }
 
+            },
 
+            data: [
 
+              ['项目储备', '批量备案', 200],
 
+              ['项目立项', '批量备案', 1500],
 
+              ['项目可研', '批量备案', 2000],
 
+              ['可研论证', '批量备案', 2500],
 
+              ['投资决策', '批量备案', 3000],
 
+              ['福建', '批量备案', 3500],
 
+            ]
 
+          },
 
+          {
 
+            name: '',
 
+            type: 'scatter',
 
+            symbol: 'circle',//'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
 
+            symbolSize: function (data) {
 
+              return Math.sqrt(data[2]) * 0.5;
 
+            },
 
+            label: {
 
+              emphasis: {
 
+                show: true,
 
+                formatter: function (param) {
 
+                  return param.data[2];
 
+                },
 
+                position: 'top'
 
+              }
 
+            },
 
+            itemStyle: {
 
+              normal: {
 
+                color: '#C94C15'
 
+              }
 
+            },
 
+            data: [
 
+              ['项目储备', '特别监管', 1400],
 
+              ['项目立项', '特别监管', 1500],
 
+              ['项目可研', '特别监管', 5500],
 
+              ['可研论证', '特别监管', 500],
 
+            ]
 
+          }
 
+        ]
 
+      }
 
+      myChart.setOption(option)
 
+      tools.loopShowTooltip(myChart, option, {
 
+        nterval: 2000,
 
+        loopSeries: true,
 
+      })
 
+    },
 
+    initChartR4() {
 
+      let myChart = echarts.init(this.$refs['echartR4'])
 
+      let option = {
 
+        title: {
 
+          text: '股权投资项目',
 
+          textStyle: {
 
+            color: '#69C0FF',
 
+          },
 
+          top: '10',
 
+          left: '10'
 
+        },
 
+        textStyle: {
 
+          color: '#fff',
 
+        },
 
+        tooltip: {
 
+          trigger: "axis",
 
+          axisPointer: {
 
+            lineStyle: {
 
+              type: 'dashed',
 
+              width: 2,
 
+              color: 'rgba(255,255,255,0.6)'
 
+            },
 
+            animation: true
 
+          }
 
+        },
 
+        grid: {
 
+          show: false
 
+        },
 
+        yAxis: {
 
+          data: ['批量备案', '特别监管'],
 
+          splitLine: {
 
+            show: true,
 
+            lineStyle: {
 
+              color: '#68b4dd66',
 
+              type: 'dashed',
 
+            },
 
+          },
 
+          axisLine: {
 
+            show: false
 
+          },
 
+          axisLabel: {
 
+            show: true,
 
+            formatter: '{value}',
 
+            textStyle: {
 
+              color: 'rgba(250,250,250,0.6)',
 
+            },
 
+          },
 
+          nameTextStyle: {
 
+            color: '#ebf8ac',
 
+            fontSize: 16,
 
+          },
 
+        },
 
+        xAxis: {
 
+          data: ['项目储备', '项目立项', '项目可研', '可研论证', '投资决策'],
 
+          axisLine: {
 
+            show: true, //隐藏X轴轴线
 
+            lineStyle: {
 
+              color: '#005094',
 
+              width: 1,
 
+            },
 
+          },
 
+          axisTick: {
 
+            show: false, //隐藏X轴刻度
 
+          },
 
+          axisLabel: {
 
+            show: true,
 
+            textStyle: {
 
+              color: 'rgba(255,255,255,0.6)', //X轴文字颜色
 
+              fontSize: 12,
 
+            },
 
+          },
 
+        },
 
+        series: [
 
+          {
 
+            name: '',
 
+            type: 'scatter',
 
+            symbol: 'circle',//'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
 
+            symbolSize: function (data) {
 
+              return Math.sqrt(data[2]) * 0.5;
 
+            },
 
+            label: {
 
+              emphasis: {
 
+                show: true,
 
+                formatter: function (param) {
 
+                  return param.data[2];
 
+                },
 
+                position: 'top'
 
+              }
 
+            },
 
+            itemStyle: {
 
+              normal: {
 
+                color: 'red'
 
+              }
 
+            },
 
+            data: [
 
+              ['项目储备', '批量备案', 200],
 
+              ['项目立项', '批量备案', 1500],
 
+              ['项目可研', '批量备案', 2000],
 
+              ['可研论证', '批量备案', 2500],
 
+              ['投资决策', '批量备案', 3000],
 
+              ['福建', '批量备案', 3500],
 
+            ]
 
+          },
 
+          {
 
+            name: '',
 
+            type: 'scatter',
 
+            symbol: 'circle',//'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
 
+            symbolSize: function (data) {
 
+              return Math.sqrt(data[2]) * 0.5;
 
+            },
 
+            label: {
 
+              emphasis: {
 
+                show: true,
 
+                formatter: function (param) {
 
+                  return param.data[2];
 
+                },
 
+                position: 'top'
 
+              }
 
+            },
 
+            itemStyle: {
 
+              normal: {
 
+                color: '#C94C15'
 
+              }
 
+            },
 
+            data: [
 
+              ['项目储备', '特别监管', 1400],
 
+              ['项目立项', '特别监管', 1500],
 
+              ['项目可研', '特别监管', 5500],
 
+              ['可研论证', '特别监管', 500],
 
+            ]
 
+          }
 
+        ]
 
+      }
 
+      myChart.setOption(option)
 
+      tools.loopShowTooltip(myChart, option, {
 
+        nterval: 2000,
 
+        loopSeries: true,
 
+      })
 
+    }
 
+  },
 
+})

Filskillnaden har hållts tillbaka eftersom den är för stor
+ 0 - 0
investment/libs/echarts-liquidfill.min.js


Filskillnaden har hållts tillbaka eftersom den är för stor
+ 0 - 0
investment/libs/vue-seamless-scroll.min.js


+ 76 - 5
investment/styles/investHome.css
Visa fil 

@@ -46,7 +46,7 @@ body {
 
   font-size: 12px;
 
 }
 
 .main-color {
 
-  color: #0bf1ff;
 
+  color: #40A9FF;
 
 }
 
 .danger-color {
 
   color: #f15450 !important;
 
@@ -103,7 +103,7 @@ a {
 
   display: flex;
 
   height: calc(100vh - 25px);
 
   background: url('../images/content-bg.png') no-repeat center bottom;
 
-  background-size: 80%;
 
+  background-size: 100% 100%;
 
   display: flex;
 
   padding-bottom: 65px;
 
 }
 
@@ -252,7 +252,7 @@ a {
 
   display: flex;
 
   flex-wrap: wrap;
 
   padding: 10px;
 
-  color: #05fbfe;
 
+  color: #40A9FF;
 
 }
 
 .boxs > div {
 
   flex: 0 0 50%;
 
@@ -310,18 +310,81 @@ a {
 
 .el-progress-bar__outer {
 
   background-color: #005094;
 
 }
 
+.tooltip-cont {
 
+  margin: -15px;
 
+  border: 1px solid #3699FF;
 
+  border-radius: 8px;
 
+  padding: 15px;
 
+  background-color: rgb(39 122 145 / 0.36);
 
+}
 
 .tooltip-cont p {
 
   line-height: 1.8;
 
   color: #f3f3f3;
 
+  position: relative;
 
+  padding-left: 12px;
 
+}
 
+.tooltip-cont p::before {
 
+  position: absolute;
 
+  display: inline-block;
 
+  content: '';
 
+  left: 0px;
 
+  top: 10px;
 
+  width: 5px;
 
+  height: 5px;
 
+  border-radius: 50%;
 
+  background-color: #40A9FF;
 
 }
 
 .tooltip-cont span{
 
-  color: #15F7FF;
 
+  color: #69C0FF;
 
+}
 
+.right-date {
 
+ position: absolute;
 
+  right: 15px;
 
+  width: 85px;
 
+}
 
+.date-popper {
 
+  background-color: #20414b;
 
+  border: 1px solid #3699FF;
 
+  border-radius: 8px;
 
+}
 
+.el-popper[x-placement^=bottom] .popper__arrow {
 
+  border-bottom-color: #3699FF;
 
+}
 
+.el-popper[x-placement^="bottom"] .popper__arrow::after {
 
+  border-bottom-color: #20414b;
 
+}
 
+.date-popper .el-date-picker__header-label {
 
+  color: #d6cfcf;
 
+}
 
+.el-picker-panel__icon-btn {
 
+  color: #fff;
 
+}
 
+.date-popper .el-year-table td {
 
+  padding: 10px 3px;
 
+}
 
+.date-popper .el-year-table td .cell {
 
+  color: #d6cfcf;
 
+}
 
+.right-date .el-date-editor--year {
 
+  width: 100%;
 
+}
 
+.right-date .el-date-editor--year .el-input__inner{
 
+  background: rgba(0,80,148,0.3);
 
+  border: 1px solid #21C1FF;
 
+  border-radius: 4px 12px 4px 4px;
 
+  color: #fff;
 
+  padding: 0 15px;
 
+}
 
+.right-date .el-date-editor--year .el-input__prefix {
 
+  left: auto;
 
+  right: 5px;
 
+  color: #40A9FF;
 
 }
 
 .el-progress__text {
 
   color: #fff;
 
 }
 
 .map-box {
 
-  height: calc(100% - 150px);
 
+  height: 100%;
 
   position: relative;
 
   padding: 30px 0;
 
 }
 
@@ -348,3 +411,11 @@ a {
 
   font-weight: 600;
 
   color: #40A9FF;
 
 }
 
+.dv-scroll-board .header {
 
+  font-weight: 600 !important;
 
+  color: #2ABBFF;
 
+}
 
+.warp {
 
+  height: 190px;
 
+  overflow: hidden;
 
+}

+ 408 - 0
investment/styles/investHome2.css
Visa fil 

@@ -0,0 +1,408 @@
 
+*,
 
+*: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;
 
+  display: flex;
 
+  height: calc(100vh - 25px);
 
+  background: url('../images/content-bg2.png') no-repeat center bottom;
 
+  display: flex;
 
+  padding-bottom: 65px;
 
+}
 
+.left {
 
+  margin-right: 10px;
 
+}
 
+.left,
 
+.right {
 
+  flex: 1;
 
+  display: flex;
 
+  flex-direction: column;
 
+}
 
+.dv-border-box-8 {
 
+  background: url('../images/left-border2.png') no-repeat;
 
+  background-size: 100% 100%;
 
+}
 
+.left .title {
 
+  position: relative;
 
+  text-align: center;
 
+  height: 50px;
 
+  line-height: 50px;
 
+}
 
+.left .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;
 
+}
 
+.left .title .text::before {
 
+  position: absolute;
 
+  content: ' ';
 
+  top: 10px;
 
+  left: -40px;
 
+  width: 30px;
 
+  height: 10px;
 
+  background: url('../images/title-left.png') no-repeat;
 
+}
 
+.left .title .text::after {
 
+  position: absolute;
 
+  content: ' ';
 
+  top: 10px;
 
+  right: -40px;
 
+  width: 30px;
 
+  height: 10px;
 
+  background: url('../images/title-right.png') no-repeat;
 
+}
 
+.left .content {
 
+  height: calc(100% - 60px);
 
+  padding: 0 17px 14px;
 
+  display: flex;
 
+}
 
+.left .content .content-left {
 
+  margin-right: 10px;
 
+  display: flex;
 
+  align-items: center;
 
+  justify-content: space-evenly;
 
+}
 
+.item {
 
+  display: flex;
 
+  align-items: center;
 
+  flex-direction: column;
 
+}
 
+.item .item-title {
 
+  color: #69C0FF;
 
+  font-size: 28px;
 
+  font-weight: bold;
 
+}
 
+.item .item-title span {
 
+  font-weight: 500;
 
+  font-size: 14px;
 
+}
 
+.item .item-img {
 
+  width: 106px;
 
+  height: 106px;
 
+  margin-bottom: 9px;
 
+}
 
+.item .item-text {
 
+  color: rgba(255,255,255,0.6);
 
+  font-size: 14px;
 
+}
 
+
 
+.item2 {
 
+  width: 50%;
 
+  display: flex;
 
+  flex-direction: column;
 
+  align-items: center;
 
+}
 
+.item2 .item2-title {
 
+  font-weight: bold;
 
+  font-size: 18px;
 
+}
 
+.item2 .item2-title span {
 
+  font-weight: 500;
 
+  font-size: 12px;
 
+}
 
+.item2 .item2-img {
 
+  width: 67px;
 
+  height: 66px;
 
+  margin-top: -20px;
 
+}
 
+.item2 .item2-text {
 
+  color: rgba(255,255,255,0.6);
 
+  font-size: 12px;
 
+}
 
+
 
+.item3 {
 
+  display: flex;
 
+  flex-direction: column;
 
+  align-items: center;
 
+}
 
+.item3 .item3-title {
 
+  font-weight: bold;
 
+  font-size: 24px;
 
+  color: #69C0FF;
 
+}
 
+.item3 .item3-title span {
 
+  font-size: 14px;
 
+  font-weight: 500;
 
+}
 
+.item3 .item3-img {
 
+  margin-top: -20px;
 
+  width: 100px;
 
+  height: 102px;
 
+  margin-bottom: 18px;
 
+}
 
+.item3 .item3-text {
 
+  font-size: 14px;
 
+  color: rgba(255,255,255,0.6);
 
+}
 
+.item4 .item4-title {
 
+  position: relative;
 
+  padding-left: 10px;
 
+  color: #69C0FF;
 
+  margin-left: 10px;
 
+  margin-top: 10px;
 
+}
 
+.item4 .item4-title::before {
 
+  content: '';
 
+  position: absolute;
 
+  left: 0;
 
+  top: 50%;
 
+  transform: translate(0, -50%);
 
+  width: 5px;
 
+  height: 5px;
 
+  border-radius: 50%;
 
+  background-color: #69C0FF;
 
+}
 
+
 
+.item4 .item4-con {
 
+  display: flex;
 
+  align-items: center;
 
+  justify-content: space-around;
 
+  height: 100%;
 
+}
 
+.item4 .item4-con .item{
 
+  display: flex;
 
+  flex-direction: column;
 
+  align-items: center;
 
+  justify-content: center;
 
+}
 
+.item4 .item4-con .item .title {
 
+  color: #69C0FF;
 
+  font-weight: bold;
 
+  font-size: 28px;
 
+}
 
+.item4 .item4-con .item .title span {
 
+  font-weight: 500;
 
+  font-size: 14px;
 
+}
 
+.item4 .item4-con .item .text {
 
+  font-size: 14px;
 
+  color: rgba(255,255,255,0.6);
 
+}
 
+
 
+.item5 {
 
+  padding: 14px;
 
+  height: 100%;
 
+}
 
+.item5 .title {
 
+  height: 30px;
 
+  color: #69C0FF;
 
+  border: 1px solid #40A9FF;
 
+  border-radius: 5px;
 
+  display: flex;
 
+  align-items: center;
 
+  justify-content: end;
 
+  padding: 0 6px;
 
+}
 
+
 
+
 
+
 
+
 
+.left .content .content-con {
 
+  margin-right: 10px;
 
+}
 
+.left .content .content-left, .left .content .content-right, .left .content .content-con {
 
+  background-color: rgb(18 81 128 / 22%);
 
+  flex: 1;
 
+}
 
+
 
+
 
+.right .title {
 
+  position: relative;
 
+  text-align: center;
 
+  height: 50px;
 
+  line-height: 50px;
 
+}
 
+.right .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;
 
+}
 
+.right .title .text::before {
 
+  position: absolute;
 
+  content: ' ';
 
+  top: 10px;
 
+  left: -40px;
 
+  width: 30px;
 
+  height: 10px;
 
+  background: url('../images/title-left.png') no-repeat;
 
+}
 
+.right .title .text::after {
 
+  position: absolute;
 
+  content: ' ';
 
+  top: 10px;
 
+  right: -40px;
 
+  width: 30px;
 
+  height: 10px;
 
+  background: url('../images/title-right.png') no-repeat;
 
+}
 
+.right .content {
 
+  height: calc(100% - 60px);
 
+  padding: 0 17px 14px;
 
+  display: flex;
 
+}
 
+.right .content .content-left {
 
+  margin-right: 10px;
 
+}
 
+.right .content .content-left, .right .content .content-right {
 
+  display: flex;
 
+  flex: 1;
 
+}
 
+.right .content .content-top {
 
+  margin-bottom: 10px;
 
+}
 
+.right .content .content-top, .right .content .content-bot {
 
+  background-color: rgb(18 81 128 / 22%);
 
+  flex: 1;
 
+}
 
+.right .content .content-left .content-left-l {
 
+  background-color: rgb(18 81 128 / 22%);
 
+  flex: 1;
 
+  margin-right: 10px;
 
+  display: flex;
 
+  align-items: center;
 
+  justify-content: center;
 
+}
 
+.right .content .content-left .content-left-r {
 
+  flex: 2;
 
+  display: flex;
 
+  flex-direction: column;
 
+}
 
+.right .content .content-left .content-left-r .content-left-r-t {
 
+  margin-bottom: 10px;
 
+}
 
+.right .content .content-left .content-left-r .content-left-r-t, .right .content .content-left .content-left-r .content-left-r-b{
 
+  background-color: rgb(18 81 128 / 22%);
 
+  flex: 1;
 
+}
 
+.right .content .content-right .content-right-l {
 
+  margin-right: 10px;
 
+}
 
+.right .content .content-right .content-right-l, .right .content .content-right .content-right-r{
 
+  background-color: rgb(18 81 128 / 22%);
 
+  flex: 1;
 
+}
 
+
 
+.tip-window {
 
+  display: inline-flex;
 
+  align-items: center;
 
+  justify-content: center;
 
+  position: absolute;
 
+  right: 15px;
 
+  top: 10px;
 
+  height: 30px;
 
+  padding: 0 10px;
 
+  color: #69c0ff;
 
+  background-color: rgba(64, 169, 255, 0.12);
 
+  border: 2px solid #40a9ff;
 
+  border-radius: 5px;
 
+  border-top-right-radius: 10px;
 
+  cursor: pointer;
 
+  box-sizing: border-box;
 
+}

+ 19 - 11
manpower/index.html
Visa fil 

@@ -49,13 +49,13 @@
 
           <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="handleShowTip(1)">智能分析</span>
 
             </div>
 
             <div class="content flex">
 
               <div ref="echartL3" style="flex: 1;height: 100%;"></div>
 
               <div style="flex: 1;height: 100%; position: relative;">
 
                 <div ref="echartL4" style="height: 100%; width: 100%;"></div>
 
-                <div class="icon" @click="handleShowTip(0)">?</div>
 
+                <div class="icon" @click="handleShowTip2(0)">?</div>
 
               </div>
 
             </div>
 
           </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(1)">智能分析</span>
 
+              <span class="tip-window" @click="handleShowTip(2)">智能分析</span>
 
             </div>
 
             <div class="content flex flex-wrap">
 
               <div ref="echartL5" style="flex: 0 0 49.9%;height: 50%;"></div>
 
@@ -161,12 +161,12 @@
 
           <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="handleShowTip(3)">智能分析</span>
 
             </div>
 
             <div class="content flex">
 
               <div style="flex: 1;height: 100%; position: relative;">
 
                 <div ref="echartC1" style="flex: 1;height: 100%;"></div>
 
-                <div class="icon" @click="handleShowTip(0)">?</div>
 
+                <div class="icon" @click="handleShowTip2(1)">?</div>
 
               </div>
 
               <div ref="echartC2" style="flex: 1;height: 100%;"></div>
 
             </div>
 
@@ -196,7 +196,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="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(3)">智能分析</span>
 
+              <span class="tip-window" @click="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(0)">智能分析</span>
 
+              <span class="tip-window" @click="handleShowTip(6)">智能分析</span>
 
             </div>
 
             <div class="content flex">
 
               <div ref="echartR7" style="flex: 1;height: 100%;"></div>
 
@@ -239,9 +239,17 @@
 
 
     <div class="tip" @click="showTip = false" v-if="showTip">
 
       <div class="tip-box">
 
-        <div class="tip-content">{{tipData[tipNum]}}</div>
 
-        <!-- <div class="btm20">全员劳动生产率从去年前的人均XX万元提升到XX万元；在岗职工平均工资从去年前的人均XX万元提升到XX万元。</div>
 
-        <div>打破工资“大锅饭”，所有盈利企业工资增幅不高于利润增幅。实行薪酬“双挂钩”，省属企业负责人绩效年薪与经营业绩考核结果挂钩后，还要与企业经济效益挂钩。</div> -->
 
+        <div class="tip-content">
 
+          <div class="btm10" v-for="(item,index) in tipData[tipNum]" :key="index"> {{item}}</div>
 
+        </div>
 
+      </div>
 
+    </div>
 
+
 
+    <div class="tip" @click="showTip2 = false" v-if="showTip2">
 
+      <div class="tip-box">
 
+        <div class="tip-content">
 
+          <div class="btm10" v-for="(item,index) in tipData2[tipNum]" :key="index"> {{item}}</div>
 
+        </div>
 
       </div>
 
     </div>
 
   </div>

+ 3 - 0
manpower/index4.html
Visa fil 

@@ -27,6 +27,9 @@
 
     <header class="my-header">
 
       <span class="left" @click="handleGoBack"><img style="width: 70px;height: 70px;" src="./images/back.png"></img>
 
       </span>
 
+      <!--  -->
 
+      <span class="left2" @click="handleGoIndex">返回首页</img>
 
+      </span>
 
       <span>山西三元煤业股份有限公司</span>
 
       <span class="right">{{time}}</span>
 
     </header>

+ 4 - 3
manpower/js/data.js
Visa fil 

@@ -48,7 +48,7 @@ const dataL1 = [
 
   [21, 21, 21, 21, 13, 13, 6, 13, 13, 14, 14, 12, 15, 15, 12, 15, 12, 13],
 
 ]
 
 const dataL2 = [
 
-  [16, 8, 12, 10, 11, 1, 0, 8, 8, 0, 7, 0, 5, 10, 0, 0, 0, 6],
 
+  [11, 8, 12, 10, 11, 0, 0, 5, 0, 0, 7, 0, 4, 0, 0, 0, 0, 6],
 
   [11, 10, 6, 10, 12, 0, 0, 5, 0, 5, 7, 0, 4, 0, 0, 0, 0, 10],
 
 ]
 
 const dataL3 = [
 
@@ -57,7 +57,8 @@ const dataL3 = [
 
 ]
 
 const dataL4 = [
 
   [142, 189, 58, 59, 39, 32, 12, 36, 66, 36, 72, 41, 28, 161, 63, 10, 69, 28],
 
-  [109, 65, 42, 44, 36, 34, 8, 62, 45, 28, 51, 98, 40, 30, 20, 99, 51, 24],
 
+  [59, 70, 71, 67, 38, 29, 2, 36, 32, 31, 36, 28, 37, 64, 25, 20, 10, 21],
 
+  [59, 70, 71, 67, 38, 29, 22, 36, 32, 31, 36, 28, 37, 64, 25, 33, 18, 34]
 
 ]
 
 const dataL5 = [
 
   [173826, 352494, 54039, 108985, 23512, 8484, 2430, 16357, 7351, 4452, 38863, 3242, 35183, 13285, 1937, 14733, 302, 1052],
 
@@ -65,7 +66,7 @@ const dataL5 = [
 
 ]
 
 
 const dataL6 = [
 
-  [146, 360, 400, 185, 220, 180, 30, 200, 200, 141, 235, 120, 200, 315, 50, 118, 100, 157],
 
+  [146, 360, 400, 185, 220, 180, 30, 200, 200, 141, 170, 120, 200, 315, 50, 118, 100, 157],
 
   [400, 400, 400, 400, 200, 180, 50, 200, 200, 177, 170, 120, 200, 330, 80, 186, 100, 150],
 
 ]
 
 const dataL7 = [

+ 4 - 4
manpower/js/data2.js
Visa fil 

@@ -77,8 +77,8 @@ const dataC1 = [
 
   [61, -12, 54, 127, 24, 2, 27, -8, 7]
 
 ]
 
 const dataC2 = [
 
-  [305, 8, 120.00, 79, 72, 415, 15, 571, 40],
 
-  [105, 323, 182, 1769.00, 43.00, -30, 686, -33, 78]
 
+  [105, 323, 182, 1769.00, 43.00, -30, 686, -33, 78],
 
+  [305, 8, 120.00, 79, 72, 415, 15, 571, 40]
 
 ]
 
 const dataR1 = [
 
   [1, 1, 1, 1, 1, 1, 1, 1, 1],
 
@@ -97,12 +97,12 @@ const dataR4 = [
 
   [19, 62, 70, 3, 347, 23, 50, 2, 566]
 
 ]
 
 const dataR5 = [
 
-  [17831.10, 13336.00, 15555.43, 11688.30, 9896.79, 13159.86, 9287.77, 9850.18, 7685.91],
 
+  [23923.1, 0, 14081.1, 0, 6077.7, 0, 8196, 10210, 10351.6],
 
   [17117.80, 12669.20, 14311.00, 11220.77, 9302.98, 12107.07, 8637.63, 9259.17, 7301.61]
 
 ]
 
 const dataR6 = [
 
   [183, 372, 221, 268, 51, -25, 676, -31, 62],
 
-  [4.00, 5.00, 5.26, 5.21, 4.98, 5.27, 5.28, 5.26, 5.25]
 
+  [-25, 0, 10, 0, 63, 0, 13, -4, -26]
 
 ]
 
 const dataR7 = [
 
   [100, 100, 100, 100, 100, 100, 100, 100, 100]

+ 7 - 7
manpower/js/data3.js
Visa fil 

@@ -68,19 +68,19 @@ const dataL6 = [
 
 ]
 
 const dataL7 = [
 
   [-57.00, 20.00, -14.00, -8.00, 0.00, 9.00, 0.00, -4.00, 0.00, -2.00],
 
-  [2006, 46, 2, 6, -8, 46, 17, -44, 24, -80]
 
+  [null, 46, 2, 6, -8, 46, 17, -44, 24, -80]
 
 ]
 
 const dataL8 = [
 
   [-57.00, 20.00, -14.00, -8.00, 0.00, 9.00, 0.00, -4.00, 0.00, -2.00],
 
-  [469.09, 117.06, -43.01, -16.89, -33.33, 35.19, 15.56, -75.42, 2733.33, -222.00]
 
+  [469.09, 117.06, -43.01, -16.89, -33.33, 35.19, 15.56, -75.42, null, -222.00]
 
 ]
 
 const dataC1 = [
 
   [321.15, 233.91, 170.76, 157.08, 156.96, 150.38, 114.21, 113.93, 40.54, 3.46],
 
-  [2006, 46, 2, 6, -8, 46, 17, -44, 24, -80]
 
+  [null, 46, 2, 6, -8, 46, 17, -44, 24, -80]
 
 ]
 
 const dataC2 = [
 
-  [812.00, 547.00, 212.00, 251.00, 272.00, 315.00, 401.00, 87.00, 85.00, -161.00],
 
-  [469.09, 117.06, -43.01, -16.89, -33.33, 35.19, 15.56, -75.42, 2733.33, -222.00]
 
+  [469.09, 117.06, -43.01, -16.89, -33.33, 35.19, 15.56, -75.42, null, -222.00],
 
+  [812.00, 547.00, 212.00, 251.00, 272.00, 315.00, 401.00, 87.00, 85.00, -161.00]
 
 ]
 
 const dataR1 = [
 
   [1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
 
@@ -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]

+ 5 - 4
manpower/js/data4.js
Visa fil 

@@ -67,8 +67,9 @@ const dataC1 = [
 
   [-18.20, 0.00, 95.39, -35.61, -71.34, 0.00, 0.00, 0.00]
 
 ]
 
 const dataC2 = [
 
-  [0.00, 0.00, 235.35, -141.02, -138.66, -125.17, -417.93, -3675.51],
 
-  [0.00, 0.00, 780.62, 242.97, 18.09, -52.24, 3.12, 24.68]
 
+  [0.00, 0.00, 780.62, 242.97, 18.09, -52.24, 3.12, 24.68],
 
+  [0.00, 0.00, 235.35, -141.02, -138.66, -125.17, -417.93, -3675.51]
 
+  
 ]
 
 const dataR1 = [
 
   [1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
 
@@ -87,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]

+ 38 - 6
manpower/js/fjx.js
Visa fil 

@@ -1,11 +1,11 @@
 
 const fjxdataL1 = [
 
-    [10226.85, 9429.80, 7604.59, 17031.45, 7766.82, 8136.27, 14014.79, 3988.28, 7380.63, 5391.49, 6583.80, 8483.91, 10743.01, 10065.77, 8277.90, 5706.48, 16517.72, 5255.80],
 
+    [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],
 
-    [5.26, 5.21, 4.98, 5.27, 5.28, 5.26, 5.25, 5.26, 5.25, 5.27, 5.26, 5.27, 5.28, 5.26, 5.24, 5.25, 5.28, 4.98],
 
+    [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 = [
 
@@ -16,8 +16,40 @@ const fjxdataL1 = [
 
   ]
 
 
   const tipData = [
 
-    '全员劳动生产率从去年前的人均XX万元提升到XX万元；在岗职工平均工资从去年前的人均XX万元提升到XX万元。打破工资“大锅饭”，所有盈利企业工资增幅不高于利润增幅。实行薪酬“双挂钩”，省属企业负责人绩效年薪与经营业绩考核结果挂钩后，还要与企业经济效益挂钩。全员劳动生产率从去年前的人均XX万元提升到XX万元；在岗职工平均工资从去年前的人均XX万元提升到XX万元。打破工资“大锅饭”，所有盈利企业工资增幅不高于利润增幅。实行薪酬“双挂钩”，省属企业负责人绩效年薪与经营业绩考核结果挂钩后，还要与企业经济效益挂钩果挂钩后，还要与企业经济效益挂钩。',
 
-    '全员劳动生产率从去年前的人均XX万元提升到XX万元；在岗职工平均工资从去年前的人均XX万元提升到XX万元。打破工资“大锅饭”，所有盈利企业工资增幅不高于利润增幅。实行薪酬“双挂钩”，省属企业负责人绩效年薪与经营业绩考核结果挂钩后，还要与企业经济效益挂钩2。',
 
-    '全员劳动生产率从去年前的人均XX万元提升到XX万元；在岗职工平均工资从去年前的人均XX万元提升到XX万元。打破工资“大锅饭”，所有盈利企业工资增幅不高于利润增幅。实行薪酬“双挂钩”，省属企业负责人绩效年薪与经营业绩考核结果挂钩后，还要与企业经济效益挂钩3。',
 
-    '全员劳动生产率从去年前的人均XX万元提升到XX万元；在岗职工平均工资从去年前的人均XX万元提升到XX万元。打破工资“大锅饭”，所有盈利企业工资增幅不高于利润增幅。实行薪酬“双挂钩”，省属企业负责人绩效年薪与经营业绩考核结果挂钩后，还要与企业经济效益挂钩4。'
 
+    [
 
+      '华阳新材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 tipData2 = [
 
+    ['管理人员是指有直接下属、具有人员管理职责的人员，不包括财务人员、人力资源等管理部门中不负有人员管理职能的具体工作人员。'],
 
+    ['全员劳动生产率＝劳动生产总值/平均在岗职工人数']
 
   ]

+ 175 - 101
manpower/js/index.js
Visa fil 

@@ -5,6 +5,7 @@ let app = new Vue({
 
   data () {
 
     return {
 
       showTip: false,
 
+      showTip2: false,
 
       tipNum: '',
 
       tipData: tipData,
 
       time: '',
 
@@ -57,10 +58,6 @@ let app = new Vue({
 
           ['<span class="lightOut"><span class="	light yellow	"></span></span>', '	2022.12.07	 ', '	华舰体育	 ', '	六定相关文件未按要求备案	 '],
 
           ['<span class="lightOut"><span class="	light yellow	"></span></span>', '	2022.12.07	 ', '	文旅集团	 ', '	六定相关文件未按要求备案	 '],
 
           ['<span class="lightOut"><span class="	light yellow	"></span></span>', '	2022.12.07	 ', '	水控集团	 ', '	六定相关文件未按要求备案	 '],
 
-
 
-
 
-
 
-
 
         ],
 
         // data: [
 
         //   ['<span style-"display:inline-block; width:15px;height:15px;border-radius:50%;background-color:green;"></span>', '2022年1月', '山西焦煤', '已经开展高层次人才引进工作'],
 
@@ -92,7 +89,6 @@ let app = new Vue({
 
           ['<span class="lightOut"><span class="	light yellow	"></span></span>', '	航产集团	 ', '	经营业绩考核12月数据未获取	 ', '	2022.12.01-12.31	 ', '	15	 '],
 
           ['<span class="lightOut"><span class="	light yellow	"></span></span>', '	华舰体育	 ', '	经营业绩考核12月数据未获取	 ', '	2022.12.01-12.31	 ', '	15	 '],
 
           ['<span class="lightOut"><span class="	light yellow	"></span></span>', '	文旅集团	 ', '	六定长效机制情况数据更新错误	 ', '	2022.12.01-12.31	 ', '	-	 '],
 
-
 
         ],
 
       },
 
       companyList: companyList,
 
@@ -219,6 +215,10 @@ let app = new Vue({
 
       this.showTip = true
 
       this.tipNum = index
 
     },
 
+    handleShowTip2(index) {
 
+      this.showTip2 = true
 
+      this.tipNum = index
 
+    },
 
     handleGoPage (url) {
 
       if (url.length) {
 
         window.location.href = url
 
@@ -562,10 +562,33 @@ let app = new Vue({
 
             },
 
             data: dataL4[1],
 
           },
 
+          {
 
+            name: '总部中层管理人数核定上限',
 
+            type: 'line',
 
+            yAxisIndex: 1,
 
+            smooth: true, //平滑曲线显示
 
+            showAllSymbol: true, //显示所有图形。
 
+            symbol: 'circle', //标记的图形为实心圆
 
+            symbolSize: 8, //标记的大小
 
+            smooth: false,
 
+            itemStyle: {
 
+              //折线拐点标志的样式
 
+              color: '#fbe138',
 
+              borderColor: '#fbe138',
 
+              width: 2,
 
+              shadowColor: '#fbe138',
 
+              shadowBlur: 4,
 
+            },
 
+            lineStyle: {
 
+              color: '#fbe138',
 
+              width: 2,
 
+            },
 
+            data: dataL4[2],
 
+          },
 
         ],
 
       }
 
       option.title.text = '各省属企业总部中层管理人数'
 
-      option.legend.data = ['六定改革前总部中层管理人数', '当前总部中层管理人数']
 
+      option.legend.data = ['六定改革前总部中层管理人数', '当前总部中层管理人数','总部中层管理人数核定上限']
 
       option.legend.show = true
 
       option.yAxis.push({
 
         splitLine: {
 
@@ -742,7 +765,7 @@ let app = new Vue({
 
       let myChart = echarts.init(this.$refs['echartL7'])
 
       let option = {
 
         ..._.cloneDeep(this.commonOption),
 
-        color: ['#b889ea'],
 
+        color: ['#43ede3'],
 
         series: [
 
           {
 
             name: '人数变化',
 
@@ -750,15 +773,16 @@ let app = new Vue({
 
             smooth: true, //平滑曲线显示
 
             showAllSymbol: true, //显示所有图形。
 
             symbol: 'circle', //标记的图形为实心圆
 
-            symbolSize: 8, //标记的大小
 
+            symbolSize: 15, //标记的大小
 
             smooth: false,
 
             itemStyle: {
 
-              //折线拐点标志的样式
 
-              color: '#43ede3',
 
-              borderColor: '#43ede3',
 
-              width: 2,
 
-              shadowColor: '#43ede3',
 
-              shadowBlur: 4,
 
+              color: params => {
 
+                if (dataL7[1][params.dataIndex] < 0 && params.value > 0) {
 
+                  return 'red'
 
+                } else {
 
+                  return '#43ede3'
 
+                }
 
+              },
 
             },
 
             lineStyle: {
 
               color: '#43ede3',
 
@@ -766,6 +790,7 @@ let app = new Vue({
 
             },
 
             data: dataL7[0],
 
           },
 
+
 
           {
 
             name: '劳动生产率同比变化',
 
             type: 'line',
 
@@ -776,17 +801,12 @@ let app = new Vue({
 
             symbolSize: 15, //标记的大小
 
             smooth: false,
 
             itemStyle: {
 
-              color: params => {
 
-                if (dataL7[0][params.dataIndex] > 0 && params.value < 0) {
 
-                  return 'red'
 
-                } else {
 
-                  return '#b889ea'
 
-                }
 
-              },
 
-            },
 
-            lineStyle: {
 
+              //折线拐点标志的样式
 
               color: '#b889ea',
 
+              borderColor: '#b889ea',
 
               width: 2,
 
+              shadowColor: '#b889ea',
 
+              shadowBlur: 4,
 
             },
 
             data: dataL7[1],
 
           },
 
@@ -830,7 +850,7 @@ let app = new Vue({
 
       let myChart = echarts.init(this.$refs['echartL8'])
 
       let option = {
 
         ..._.cloneDeep(this.commonOption),
 
-        color: ['#b889ea'],
 
+        color: ['#43ede3'],
 
         series: [
 
           {
 
             name: '人数变化',
 
@@ -838,15 +858,16 @@ let app = new Vue({
 
             smooth: true, //平滑曲线显示
 
             showAllSymbol: true, //显示所有图形。
 
             symbol: 'circle', //标记的图形为实心圆
 
-            symbolSize: 8, //标记的大小
 
+            symbolSize: 15, //标记的大小
 
             smooth: false,
 
             itemStyle: {
 
-              //折线拐点标志的样式
 
-              color: '#43ede3',
 
-              borderColor: '#43ede3',
 
-              width: 2,
 
-              shadowColor: '#43ede3',
 
-              shadowBlur: 4,
 
+              color: params => {
 
+                if (dataL8[1][params.dataIndex] < 0 && params.value > 0) {
 
+                  return 'red'
 
+                } else {
 
+                  return '#43ede3'
 
+                }
 
+              },
 
             },
 
             lineStyle: {
 
               color: '#43ede3',
 
@@ -863,14 +884,14 @@ let app = new Vue({
 
             symbolSize: 15, //标记的大小
 
             smooth: false,
 
             itemStyle: {
 
-              color: params => {
 
-                if (dataL8[0][params.dataIndex] > 0 && params.value < 0) {
 
-                  return 'red'
 
-                } else {
 
-                  return '#b889ea'
 
-                }
 
-              },
 
+              //折线拐点标志的样式
 
+              color: '#b889ea',
 
+              borderColor: '#b889ea',
 
+              width: 2,
 
+              shadowColor: '#b889ea',
 
+              shadowBlur: 4,
 
             },
 
+            
             lineStyle: {
 
               color: '#b889ea',
 
               width: 2,
 
@@ -878,6 +899,13 @@ let app = new Vue({
 
             data: dataL8[1],
 
           },
 
         ],
 
+        // tooltip: {
 
+        //   trigger: 'axis',
 
+        //   formatter(params){
 
+        //     console.log(params)
 
+        //     return params[0]
 
+        //   }
 
+        // }
 
       }
 
       option.title.text = '人数变化和人工成本利润率变化分析'
 
       option.legend.data = ['人数变化', '人工成本利润率同比变化']
 
@@ -917,29 +945,6 @@ let app = new Vue({
 
                 }
 
               },
 
             },
 
-            data: c1[0],
 
-          },
 
-          {
 
-            name: '全员劳动生产率同比',
 
-            type: 'line',
 
-            yAxisIndex: 1,
 
-            smooth: true, //平滑曲线显示
 
-            showAllSymbol: true, //显示所有图形。
 
-            symbol: 'circle', //标记的图形为实心圆
 
-            symbolSize: 8, //标记的大小
 
-            smooth: false,
 
-            itemStyle: {
 
-              //折线拐点标志的样式
 
-              color: '#B889EA',
 
-              borderColor: '#B889EA',
 
-              width: 2,
 
-              shadowColor: '#B889EA',
 
-              shadowBlur: 4,
 
-            },
 
-            lineStyle: {
 
-              color: '#B889EA',
 
-              width: 2,
 
-            },
 
             markLine: {
 
               data: [
 
                 {
 
@@ -955,19 +960,19 @@ let app = new Vue({
 
                     color: '#fff',
 
                   },
 
                 },
 
-                {
 
-                  name: '',
 
-                  yAxis: 0,
 
-                  lineStyle: {
 
-                    color: '#fff',
 
-                  },
 
-                  label: {
 
-                    formatter: '{b}',
 
-                    position: 'end',
 
-                    fontSize: 16,
 
-                    color: '#fff',
 
-                  },
 
-                },
 
+                // {
 
+                //   name: '',
 
+                //   yAxis: 0,
 
+                //   lineStyle: {
 
+                //     color: '#fff',
 
+                //   },
 
+                //   label: {
 
+                //     formatter: '{b}',
 
+                //     position: 'end',
 
+                //     fontSize: 16,
 
+                //     color: '#fff',
 
+                //   },
 
+                // },
 
                 {
 
                   name: '央企平均水平',
 
                   yAxis: 69.4,
 
@@ -986,6 +991,30 @@ let app = new Vue({
 
                 distance: [50, 0],
 
               },
 
             },
 
+            data: c1[0],
 
+          },
 
+          {
 
+            name: '全员劳动生产率同比',
 
+            type: 'line',
 
+            yAxisIndex: 1,
 
+            smooth: true, //平滑曲线显示
 
+            showAllSymbol: true, //显示所有图形。
 
+            symbol: 'circle', //标记的图形为实心圆
 
+            symbolSize: 8, //标记的大小
 
+            smooth: false,
 
+            itemStyle: {
 
+              //折线拐点标志的样式
 
+              color: '#B889EA',
 
+              borderColor: '#B889EA',
 
+              width: 2,
 
+              shadowColor: '#B889EA',
 
+              shadowBlur: 4,
 
+            },
 
+            lineStyle: {
 
+              color: '#B889EA',
 
+              width: 2,
 
+            },
 
+            
             // data: [50, 40, 60, 20, 45, 30, 60, 100, 45, 40, 50, 20, 60, 80, 45, 70, 50, 40],
 
             data: c1[1],
 
           },
 
@@ -1342,6 +1371,7 @@ let app = new Vue({
 
       commonOptions.yAxis[0].splitNumber = 2
 
       let option = {
 
         ..._.cloneDeep(commonOptions),
 
+        color: ['#45DAD1'],
 
         series: [
 
           {
 
             name: '2022年利润(万）',
 
@@ -1369,19 +1399,37 @@ let app = new Vue({
 
             barWidth: 15,
 
             yAxisIndex: 1,
 
             itemStyle: {
 
-              normal: {
 
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
-                  {
 
-                    offset: 0,
 
-                    color: '#45DAD1',
 
-                  },
 
-                  {
 
-                    offset: 1,
 
-                    color: '#082550',
 
-                  },
 
-                ]),
 
+              color: params => {
 
+                if (params.value > 0 && dataR3[0][params.dataIndex] < 0) {
 
+                  return 'red'
 
+                } else {
 
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
+                    {
 
+                      offset: 0,
 
+                      color: '#45DAD1',
 
+                    },
 
+                    {
 
+                      offset: 1,
 
+                      color: '#082550',
 
+                    },
 
+                  ])
 
+                }
 
               },
 
             },
 
+            // itemStyle: {
 
+            //   normal: {
 
+            //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
+            //       {
 
+            //         offset: 0,
 
+            //         color: '#45DAD1',
 
+            //       },
 
+            //       {
 
+            //         offset: 1,
 
+            //         color: '#082550',
 
+            //       },
 
+            //     ]),
 
+            //   },
 
+            // },
 
             data: dataR3[1],
 
           },
 
         ],
 
@@ -1389,21 +1437,19 @@ let app = new Vue({
 
       option.title.text = '各省属企业年利润与当年累计招聘人数'
 
       option.legend.data = ['2022年利润(万）', '2022年累计招聘数']
 
       option.legend.show = true
 
-      option.yAxis[0].max = 
-      option.yAxis[0].min = 
       option.yAxis[0] = {
 
         max: function (value) {
 
           if (Math.abs(value.max) > Math.abs(value.min)) {
 
-            return (Math.abs(value.max) * 1.2).toFixed(2);
 
+            return (Math.abs(value.max) * 1.2).toFixed(2)
 
           } else {
 
-            return (Math.abs(value.min) * 1.2).toFixed(2);
 
+            return (Math.abs(value.min) * 1.2).toFixed(2)
 
           }
 
         },
 
         min: function (value) {
 
           if (Math.abs(value.max) > Math.abs(value.min)) {
 
-            return (-Math.abs(value.max) * 1.2).toFixed(2);
 
+            return (-Math.abs(value.max) * 1.2).toFixed(2)
 
           } else {
 
-            return (-Math.abs(value.min) * 1.2).toFixed(2);
 
+            return (-Math.abs(value.min) * 1.2).toFixed(2)
 
           }
 
         },
 
         type: 'value',
 
@@ -1443,19 +1489,18 @@ let app = new Vue({
 
         },
 
         max: function (value) {
 
           if (Math.abs(value.max) > Math.abs(value.min)) {
 
-            return (Math.abs(value.max) * 1.2).toFixed(2);
 
+            return (Math.abs(value.max) * 1.2).toFixed(2)
 
           } else {
 
-            return (Math.abs(value.min) * 1.2).toFixed(2);
 
+            return (Math.abs(value.min) * 1.2).toFixed(2)
 
           }
 
         },
 
         min: function (value) {
 
           if (Math.abs(value.max) > Math.abs(value.min)) {
 
-            return (-Math.abs(value.max) * 1.2).toFixed(2);
 
+            return (-Math.abs(value.max) * 1.2).toFixed(2)
 
           } else {
 
-            return (-Math.abs(value.min) * 1.2).toFixed(2);
 
+            return (-Math.abs(value.min) * 1.2).toFixed(2)
 
           }
 
-        }
 
-
 
+        },
 
       })
 
       myChart.setOption(option)
 
     },
 
@@ -1546,6 +1591,26 @@ let app = new Vue({
 
             name: '去年同期在岗职工平均薪酬',
 
             type: 'bar',
 
             barWidth: 15,
 
+            markLine: {
 
+              data: [
 
+                {
 
+                  name: '省属企业平均水平',
 
+                  yAxis: 9333.33,
 
+                  lineStyle: {
 
+                    color: '#fff',
 
+                  },
 
+                  label: {
 
+                    formatter: '{b}',
 
+                    position: 'middle',
 
+                    fontSize: 16,
 
+                    color: '#fff',
 
+                  },
 
+                }
 
+              ],
 
+              label: {
 
+                distance: [50, 0],
 
+              },
 
+            },
 
             itemStyle: {
 
               normal: {
 
                 color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
@@ -1694,9 +1759,18 @@ let app = new Vue({
 
         ],
 
       }
 
       option.title.text = '各省属企业全员绩效考核'
 
-      option.legend.show = false
 
-      option.tooltip.formatter = '{a0}：{c0}' + '%'
 
-      option.yAxis[0].axisLabel.formatter = '{value} %'
 
+      option.legend.show = true
 
+      option.tooltip = {
 
+        trigger: 'axis',
 
+        formatter: '{a0}:{c0}' + '%'
 
+      },
 
+        option.yAxis[0].axisLabel = {
 
+          show: true,
 
+          formatter: '{value} %',
 
+          textStyle: {
 
+            color: 'rgba(250,250,250,0.6)',
 
+          },
 
+        }
 
       myChart.setOption(option)
 
     },
 
     initChartR8 () {
 
@@ -1727,7 +1801,7 @@ let app = new Vue({
 
         ],
 
       }
 
       option.title.text = '各省属企业任期制契约化管理'
 
-      option.legend.show = false
 
+      option.legend.show = true
 
       option.tooltip.formatter = '{a0}：{c0}' + '%'
 
       option.yAxis[0].axisLabel.formatter = '{value} %'
 
       myChart.setOption(option)

+ 131 - 76
manpower/js/index2.js
Visa fil 

@@ -535,25 +535,29 @@ let app = new Vue({
 
       let myChart = echarts.init(this.$refs['echartL7'])
 
       let option = {
 
         ..._.cloneDeep(this.commonOption),
 
+        color: ['#43ede3'],
 
         series: [
 
           {
 
             name: '人数变化',
 
             type: 'line',
 
             barWidth: 15,
 
+            showAllSymbol: true, //显示所有图形。
 
+            symbol: 'circle', //标记的图形为实心圆
 
+            symbolSize: 15, //标记的大小
 
+            smooth: false,
 
             itemStyle: {
 
-              normal: {
 
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
-                  {
 
-                    offset: 0,
 
-                    color: '#43ede3',
 
-                  },
 
-                  {
 
-                    offset: 1,
 
-                    color: '#43ede3',
 
-                  },
 
-                ]),
 
+              color: params => {
 
+                if (dataL7[1][params.dataIndex] < 0 && params.value > 0) {
 
+                  return 'red'
 
+                } else {
 
+                  return '#43ede3'
 
+                }
 
               },
 
             },
 
+            lineStyle: {
 
+              color: '#43ede3',
 
+              width: 2,
 
+            },
 
             // markLine: {
 
             //   data: [{ type: 'average', name: 'Avg' }],
 
             // },
 
@@ -564,20 +568,31 @@ let app = new Vue({
 
             type: 'line',
 
             barWidth: 15,
 
             // yAxisIndex: 1,
 
+            showAllSymbol: true, //显示所有图形。
 
+            symbol: 'circle', //标记的图形为实心圆
 
+            symbolSize: 15, //标记的大小
 
             itemStyle: {
 
-              normal: {
 
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
-                  {
 
-                    offset: 0,
 
-                    color: '#b889ea',
 
-                  },
 
-                  {
 
-                    offset: 1,
 
-                    color: '#b889ea',
 
-                  },
 
-                ]),
 
-              },
 
+              //折线拐点标志的样式
 
+              color: '#b889ea',
 
+              borderColor: '#b889ea',
 
+              width: 2,
 
+              shadowColor: '#b889ea',
 
+              shadowBlur: 4,
 
             },
 
+            // itemStyle: {
 
+            //   normal: {
 
+            //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
+            //       {
 
+            //         offset: 0,
 
+            //         color: '#b889ea',
 
+            //       },
 
+            //       {
 
+            //         offset: 1,
 
+            //         color: '#b889ea',
 
+            //       },
 
+            //     ]),
 
+            //   },
 
+            // },
 
             data: dataL7[1],
 
           },
 
         ],
 
@@ -633,25 +648,29 @@ let app = new Vue({
 
       let myChart = echarts.init(this.$refs['echartL8'])
 
       let option = {
 
         ..._.cloneDeep(this.commonOption),
 
+        color: ['#43ede3'],
 
         series: [
 
           {
 
             name: '人数变化',
 
             type: 'line',
 
             barWidth: 15,
 
+            showAllSymbol: true, //显示所有图形。
 
+            symbol: 'circle', //标记的图形为实心圆
 
+            symbolSize: 15, //标记的大小
 
+            smooth: false,
 
             itemStyle: {
 
-              normal: {
 
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
-                  {
 
-                    offset: 0,
 
-                    color: '#43ede3',
 
-                  },
 
-                  {
 
-                    offset: 1,
 
-                    color: '#43ede3',
 
-                  },
 
-                ]),
 
+              color: params => {
 
+                if (dataL8[1][params.dataIndex] < 0 && params.value > 0) {
 
+                  return 'red'
 
+                } else {
 
+                  return '#43ede3'
 
+                }
 
               },
 
             },
 
+            lineStyle: {
 
+              color: '#43ede3',
 
+              width: 2,
 
+            },
 
             // markLine: {
 
             //   data: [{ type: 'average', name: 'Avg' }],
 
             // },
 
@@ -662,19 +681,17 @@ let app = new Vue({
 
             type: 'line',
 
             barWidth: 15,
 
             // yAxisIndex: 1,
 
+            showAllSymbol: true, //显示所有图形。
 
+            symbol: 'circle', //标记的图形为实心圆
 
+            symbolSize: 15, //标记的大小
 
+            smooth: false,
 
             itemStyle: {
 
-              normal: {
 
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
-                  {
 
-                    offset: 0,
 
-                    color: '#b889ea',
 
-                  },
 
-                  {
 
-                    offset: 1,
 
-                    color: '#b889ea',
 
-                  },
 
-                ]),
 
-              },
 
+              //折线拐点标志的样式
 
+              color: '#b889ea',
 
+              borderColor: '#b889ea',
 
+              width: 2,
 
+              shadowColor: '#b889ea',
 
+              shadowBlur: 4,
 
             },
 
             data: dataL8[1],
 
           },
 
@@ -767,13 +784,6 @@ let app = new Vue({
 
               color: '#B889EA',
 
               width: 2,
 
             },
 
-            data: dataC1[0],
 
-
 
-          },
 
-          {
 
-            name: '全员劳动生产率同比变化',
 
-            yAxisIndex: 1, //使用的 y 轴的 index，在单个图表实例中存在多个 y轴的时候有用
 
-            type: 'line',
 
             markLine: {
 
               data: [
 
                 {
 
@@ -805,6 +815,13 @@ let app = new Vue({
 
                 distance: [20, 8],
 
               },
 
             },
 
+            data: dataC1[0],
 
+
 
+          },
 
+          {
 
+            name: '全员劳动生产率同比变化',
 
+            yAxisIndex: 1, //使用的 y 轴的 index，在单个图表实例中存在多个 y轴的时候有用
 
+            type: 'line',
 
             itemStyle: {
 
               normal: {
 
                 color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
@@ -1124,6 +1141,7 @@ let app = new Vue({
 
       commonOptions.yAxis[0].splitNumber = 2
 
       let option = {
 
         ..._.cloneDeep(commonOptions),
 
+        color: ['#45DAD1'],
 
         series: [
 
           {
 
             name: '2022年利润(万）',
 
@@ -1151,17 +1169,21 @@ let app = new Vue({
 
             type: 'bar',
 
             barWidth: 15,
 
             itemStyle: {
 
-              normal: {
 
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
-                  {
 
-                    offset: 0,
 
-                    color: '#45DAD1',
 
-                  },
 
-                  {
 
-                    offset: 1,
 
-                    color: '#082550',
 
-                  },
 
-                ]),
 
+              color: params => {
 
+                if (params.value > 0 && dataR3[0][params.dataIndex] < 0) {
 
+                  return 'red'
 
+                } else {
 
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
+                    {
 
+                      offset: 0,
 
+                      color: '#45DAD1',
 
+                    },
 
+                    {
 
+                      offset: 1,
 
+                      color: '#082550',
 
+                    },
 
+                  ])
 
+                }
 
               },
 
             },
 
             data: dataR3[1],
 
@@ -1181,7 +1203,7 @@ let app = new Vue({
 
         },
 
         axisLabel: {
 
           show: true,
 
-          formatter: '{value} %',
 
+          formatter: '{value} ',
 
           textStyle: {
 
             color: 'rgba(250,250,250,0.6)',
 
           },
 
@@ -1317,6 +1339,7 @@ let app = new Vue({
 
       let myChart = echarts.init(this.$refs['echartR6'])
 
       let option = {
 
         ..._.cloneDeep(this.commonOption),
 
+        color: ['#69c0ff'],
 
         series: [
 
           {
 
             name: '2022年利润累计涨幅率',
 
@@ -1346,17 +1369,21 @@ let app = new Vue({
 
             barWidth: 15,
 
             yAxisIndex: 1,
 
             itemStyle: {
 
-              normal: {
 
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
-                  {
 
-                    offset: 0,
 
-                    color: '#69C0FF',
 
-                  },
 
-                  {
 
-                    offset: 1,
 
-                    color: '#082550',
 
-                  },
 
-                ]),
 
+              color: params => {
 
+                if (params.value > 0 && dataR6[0][params.dataIndex] < 0) {
 
+                  return 'yellow'
 
+                } else {
 
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
+                    {
 
+                      offset: 0,
 
+                      color: '#69c0ff',
 
+                    },
 
+                    {
 
+                      offset: 1,
 
+                      color: '#082550',
 
+                    },
 
+                  ])
 
+                }
 
               },
 
             },
 
             data: dataR6[1],
 
@@ -1371,6 +1398,20 @@ let app = new Vue({
 
       }
 
       option.yAxis = [
 
         {
 
+          max: function (value) {
 
+            if (Math.abs(value.max) > Math.abs(value.min)) {
 
+              return (Math.abs(value.max) * 1.2).toFixed(2);
 
+            } else {
 
+              return (Math.abs(value.min) * 1.2).toFixed(2);
 
+            }
 
+          },
 
+          min: function (value) {
 
+            if (Math.abs(value.max) > Math.abs(value.min)) {
 
+              return (-Math.abs(value.max) * 1.2).toFixed(2);
 
+            } else {
 
+              return (-Math.abs(value.min) * 1.2).toFixed(2);
 
+            }
 
+          },
 
           type: 'value',
 
           axisLine: {
 
             show: false,
 
@@ -1391,6 +1432,20 @@ let app = new Vue({
 
           },
 
         },
 
         {
 
+          max: function (value) {
 
+            if (Math.abs(value.max) > Math.abs(value.min)) {
 
+              return (Math.abs(value.max) * 1.2).toFixed(2);
 
+            } else {
 
+              return (Math.abs(value.min) * 1.2).toFixed(2);
 
+            }
 
+          },
 
+          min: function (value) {
 
+            if (Math.abs(value.max) > Math.abs(value.min)) {
 
+              return (-Math.abs(value.max) * 1.2).toFixed(2);
 
+            } else {
 
+              return (-Math.abs(value.min) * 1.2).toFixed(2);
 
+            }
 
+          },
 
           type: 'value',
 
           splitLine: {
 
             show: false,

+ 110 - 68
manpower/js/index3.js
Visa fil 

@@ -536,23 +536,23 @@ let app = new Vue({
 
       let myChart = echarts.init(this.$refs['echartL7'])
 
       let option = {
 
         ..._.cloneDeep(this.commonOption),
 
+        color: ['#43ede3'],
 
         series: [
 
           {
 
             name: '人数变化',
 
             type: 'line',
 
             barWidth: 15,
 
+            showAllSymbol: true, //显示所有图形。
 
+            symbol: 'circle', //标记的图形为实心圆
 
+            symbolSize: 15, //标记的大小
 
+            smooth: false,
 
             itemStyle: {
 
-              normal: {
 
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
-                  {
 
-                    offset: 0,
 
-                    color: '#43ede3',
 
-                  },
 
-                  {
 
-                    offset: 1,
 
-                    color: '#43ede3',
 
-                  },
 
-                ]),
 
+              color: params => {
 
+                if (dataL7[1][params.dataIndex] < 0 && params.value > 0) {
 
+                  return 'red'
 
+                } else {
 
+                  return '#43ede3'
 
+                }
 
               },
 
             },
 
             // markLine: {
 
@@ -565,19 +565,17 @@ let app = new Vue({
 
             type: 'line',
 
             barWidth: 15,
 
             // yAxisIndex: 1,
 
+            showAllSymbol: true, //显示所有图形。
 
+            symbol: 'circle', //标记的图形为实心圆
 
+            symbolSize: 15, //标记的大小
 
+            smooth: false,
 
             itemStyle: {
 
-              normal: {
 
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
-                  {
 
-                    offset: 0,
 
-                    color: '#b889ea',
 
-                  },
 
-                  {
 
-                    offset: 1,
 
-                    color: '#b889ea',
 
-                  },
 
-                ]),
 
-              },
 
+              //折线拐点标志的样式
 
+              color: '#b889ea',
 
+              borderColor: '#b889ea',
 
+              width: 2,
 
+              shadowColor: '#b889ea',
 
+              shadowBlur: 4,
 
             },
 
             data: dataL7[1],
 
           },
 
@@ -634,25 +632,29 @@ let app = new Vue({
 
       let myChart = echarts.init(this.$refs['echartL8'])
 
       let option = {
 
         ..._.cloneDeep(this.commonOption),
 
+        color: ['#43ede3'],
 
         series: [
 
           {
 
             name: '人数变化',
 
             type: 'line',
 
             barWidth: 15,
 
+            showAllSymbol: true, //显示所有图形。
 
+            symbol: 'circle', //标记的图形为实心圆
 
+            symbolSize: 15, //标记的大小
 
+            smooth: false,
 
             itemStyle: {
 
-              normal: {
 
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
-                  {
 
-                    offset: 0,
 
-                    color: '#43ede3',
 
-                  },
 
-                  {
 
-                    offset: 1,
 
-                    color: '#43ede3',
 
-                  },
 
-                ]),
 
+              color: params => {
 
+                if (dataL8[1][params.dataIndex] < 0 && params.value > 0) {
 
+                  return 'red'
 
+                } else {
 
+                  return '#43ede3'
 
+                }
 
               },
 
             },
 
+            lineStyle: {
 
+              color: '#43ede3',
 
+              width: 2,
 
+            },
 
             // markLine: {
 
             //   data: [{ type: 'average', name: 'Avg' }],
 
             // },
 
@@ -663,19 +665,17 @@ let app = new Vue({
 
             type: 'line',
 
             barWidth: 15,
 
             // yAxisIndex: 1,
 
+            showAllSymbol: true, //显示所有图形。
 
+            symbol: 'circle', //标记的图形为实心圆
 
+            symbolSize: 15, //标记的大小
 
+            smooth: false,
 
             itemStyle: {
 
-              normal: {
 
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
-                  {
 
-                    offset: 0,
 
-                    color: '#b889ea',
 
-                  },
 
-                  {
 
-                    offset: 1,
 
-                    color: '#b889ea',
 
-                  },
 
-                ]),
 
-              },
 
+              //折线拐点标志的样式
 
+              color: '#b889ea',
 
+              borderColor: '#b889ea',
 
+              width: 2,
 
+              shadowColor: '#b889ea',
 
+              shadowBlur: 4,
 
             },
 
             data: dataL8[1],
 
           },
 
@@ -1124,6 +1124,7 @@ let app = new Vue({
 
       commonOptions.yAxis[0].splitNumber = 2
 
       let option = {
 
         ..._.cloneDeep(commonOptions),
 
+        color: ['#45DAD1'],
 
         series: [
 
           {
 
             name: '2022年利润(万）',
 
@@ -1151,17 +1152,21 @@ let app = new Vue({
 
             type: 'bar',
 
             barWidth: 15,
 
             itemStyle: {
 
-              normal: {
 
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
-                  {
 
-                    offset: 0,
 
-                    color: '#45DAD1',
 
-                  },
 
-                  {
 
-                    offset: 1,
 
-                    color: '#082550',
 
-                  },
 
-                ]),
 
+              color: params => {
 
+                if (params.value > 0 && dataR3[0][params.dataIndex] < 0) {
 
+                  return 'red'
 
+                } else {
 
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
+                    {
 
+                      offset: 0,
 
+                      color: '#45DAD1',
 
+                    },
 
+                    {
 
+                      offset: 1,
 
+                      color: '#082550',
 
+                    },
 
+                  ])
 
+                }
 
               },
 
             },
 
             data: dataR3[1],
 
@@ -1375,6 +1380,7 @@ let app = new Vue({
 
       let myChart = echarts.init(this.$refs['echartR6'])
 
       let option = {
 
         ..._.cloneDeep(this.commonOption),
 
+        color: ['#69c0ff'],
 
         series: [
 
           {
 
             name: '2022年利润累计涨幅率',
 
@@ -1403,18 +1409,26 @@ let app = new Vue({
 
             type: 'line',
 
             barWidth: 15,
 
             yAxisIndex: 1,
 
+            showAllSymbol: true, //显示所有图形。
 
+            symbol: 'circle', //标记的图形为实心圆
 
+            symbolSize: 12, //标记的大小
 
+            smooth: false,
 
             itemStyle: {
 
-              normal: {
 
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
-                  {
 
-                    offset: 0,
 
-                    color: '#69C0FF',
 
-                  },
 
-                  {
 
-                    offset: 1,
 
-                    color: '#082550',
 
-                  },
 
-                ]),
 
+              color: params => {
 
+                if (params.value > 0 && dataR6[0][params.dataIndex] < 0) {
 
+                  return 'yellow'
 
+                } else {
 
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
+                    {
 
+                      offset: 0,
 
+                      color: '#69c0ff',
 
+                    },
 
+                    {
 
+                      offset: 1,
 
+                      color: '#082550',
 
+                    },
 
+                  ])
 
+                }
 
               },
 
             },
 
             data: dataR6[1],
 
@@ -1429,6 +1443,20 @@ let app = new Vue({
 
       }
 
       option.yAxis = [
 
         {
 
+          max: function (value) {
 
+            if (Math.abs(value.max) > Math.abs(value.min)) {
 
+              return (Math.abs(value.max) * 1.2).toFixed(2);
 
+            } else {
 
+              return (Math.abs(value.min) * 1.2).toFixed(2);
 
+            }
 
+          },
 
+          min: function (value) {
 
+            if (Math.abs(value.max) > Math.abs(value.min)) {
 
+              return (-Math.abs(value.max) * 1.2).toFixed(2);
 
+            } else {
 
+              return (-Math.abs(value.min) * 1.2).toFixed(2);
 
+            }
 
+          },
 
           splitLine: {
 
             show: true,
 
             lineStyle: {
 
@@ -1448,6 +1476,20 @@ let app = new Vue({
 
           },
 
         },
 
         {
 
+          max: function (value) {
 
+            if (Math.abs(value.max) > Math.abs(value.min)) {
 
+              return (Math.abs(value.max) * 1.2).toFixed(2);
 
+            } else {
 
+              return (Math.abs(value.min) * 1.2).toFixed(2);
 
+            }
 
+          },
 
+          min: function (value) {
 
+            if (Math.abs(value.max) > Math.abs(value.min)) {
 
+              return (-Math.abs(value.max) * 1.2).toFixed(2);
 
+            } else {
 
+              return (-Math.abs(value.min) * 1.2).toFixed(2);
 
+            }
 
+          },
 
           splitLine: {
 
             show: false,
 
           },

+ 118 - 68
manpower/js/index4.js
Visa fil 

@@ -182,6 +182,9 @@ let app = new Vue({
 
         window.location.href = url
 
       }
 
     },
 
+    handleGoIndex () {
 
+      window.location.href = './index.html'
 
+    },
 
     handleGoBack () {
 
       window.history.go(-1)
 
     },
 
@@ -538,23 +541,23 @@ let app = new Vue({
 
       let myChart = echarts.init(this.$refs['echartL7'])
 
       let option = {
 
         ..._.cloneDeep(this.commonOption),
 
+        color: ['#43ede3'],
 
         series: [
 
           {
 
             name: '人数变化',
 
             type: 'line',
 
             barWidth: 15,
 
+            showAllSymbol: true, //显示所有图形。
 
+            symbol: 'circle', //标记的图形为实心圆
 
+            symbolSize: 15, //标记的大小
 
+            smooth: false,
 
             itemStyle: {
 
-              normal: {
 
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
-                  {
 
-                    offset: 0,
 
-                    color: '#43ede3',
 
-                  },
 
-                  {
 
-                    offset: 1,
 
-                    color: '#43ede3',
 
-                  },
 
-                ]),
 
+              color: params => {
 
+                if (dataL7[1][params.dataIndex] < 0 && params.value > 0) {
 
+                  return 'red'
 
+                } else {
 
+                  return '#43ede3'
 
+                }
 
               },
 
             },
 
             // markLine: {
 
@@ -567,19 +570,17 @@ let app = new Vue({
 
             type: 'line',
 
             barWidth: 15,
 
             // yAxisIndex: 1,
 
+            showAllSymbol: true, //显示所有图形。
 
+            symbol: 'circle', //标记的图形为实心圆
 
+            symbolSize: 15, //标记的大小
 
+            smooth: false,
 
             itemStyle: {
 
-              normal: {
 
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
-                  {
 
-                    offset: 0,
 
-                    color: '#b889ea',
 
-                  },
 
-                  {
 
-                    offset: 1,
 
-                    color: '#b889ea',
 
-                  },
 
-                ]),
 
-              },
 
+              //折线拐点标志的样式
 
+              color: '#b889ea',
 
+              borderColor: '#b889ea',
 
+              width: 2,
 
+              shadowColor: '#b889ea',
 
+              shadowBlur: 4,
 
             },
 
             data: dataL7[1],
 
           },
 
@@ -636,25 +637,29 @@ let app = new Vue({
 
       let myChart = echarts.init(this.$refs['echartL8'])
 
       let option = {
 
         ..._.cloneDeep(this.commonOption),
 
+        color: ['#43ede3'],
 
         series: [
 
           {
 
             name: '人数变化',
 
             type: 'line',
 
             barWidth: 15,
 
+            showAllSymbol: true, //显示所有图形。
 
+            symbol: 'circle', //标记的图形为实心圆
 
+            symbolSize: 15, //标记的大小
 
+            smooth: false,
 
             itemStyle: {
 
-              normal: {
 
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
-                  {
 
-                    offset: 0,
 
-                    color: '#43ede3',
 
-                  },
 
-                  {
 
-                    offset: 1,
 
-                    color: '#43ede3',
 
-                  },
 
-                ]),
 
+              color: params => {
 
+                if (dataL8[1][params.dataIndex] < 0 && params.value > 0) {
 
+                  return 'red'
 
+                } else {
 
+                  return '#43ede3'
 
+                }
 
               },
 
             },
 
+            lineStyle: {
 
+              color: '#43ede3',
 
+              width: 2,
 
+            },
 
             // markLine: {
 
             //   data: [{ type: 'average', name: 'Avg' }],
 
             // },
 
@@ -665,19 +670,17 @@ let app = new Vue({
 
             type: 'line',
 
             barWidth: 15,
 
             // yAxisIndex: 1,
 
+            showAllSymbol: true, //显示所有图形。
 
+            symbol: 'circle', //标记的图形为实心圆
 
+            symbolSize: 15, //标记的大小
 
+            smooth: false,
 
             itemStyle: {
 
-              normal: {
 
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
-                  {
 
-                    offset: 0,
 
-                    color: '#b889ea',
 
-                  },
 
-                  {
 
-                    offset: 1,
 
-                    color: '#b889ea',
 
-                  },
 
-                ]),
 
-              },
 
+              //折线拐点标志的样式
 
+              color: '#b889ea',
 
+              borderColor: '#b889ea',
 
+              width: 2,
 
+              shadowColor: '#b889ea',
 
+              shadowBlur: 4,
 
             },
 
             data: dataL8[1],
 
           },
 
@@ -1126,6 +1129,7 @@ let app = new Vue({
 
       commonOptions.yAxis[0].splitNumber = 2
 
       let option = {
 
         ..._.cloneDeep(commonOptions),
 
+        color: ['#45DAD1'],
 
         series: [
 
           {
 
             name: '2022年利润(万）',
 
@@ -1153,17 +1157,21 @@ let app = new Vue({
 
             yAxisIndex: 1, //使用的 y 轴的 index，在单个图表实例中存在多个 y轴的时候有用
 
             barWidth: 15,
 
             itemStyle: {
 
-              normal: {
 
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
-                  {
 
-                    offset: 0,
 
-                    color: '#45DAD1',
 
-                  },
 
-                  {
 
-                    offset: 1,
 
-                    color: '#082550',
 
-                  },
 
-                ]),
 
+              color: params => {
 
+                if (params.value > 0 && dataR3[0][params.dataIndex] < 0) {
 
+                  return 'red'
 
+                } else {
 
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
+                    {
 
+                      offset: 0,
 
+                      color: '#45DAD1',
 
+                    },
 
+                    {
 
+                      offset: 1,
 
+                      color: '#082550',
 
+                    },
 
+                  ])
 
+                }
 
               },
 
             },
 
             data: dataR3[1],
 
@@ -1345,6 +1353,7 @@ let app = new Vue({
 
       let myChart = echarts.init(this.$refs['echartR6'])
 
       let option = {
 
         ..._.cloneDeep(this.commonOption),
 
+        color: ['#69c0ff'],
 
         series: [
 
           {
 
             name: '2022年利润累计涨幅率',
 
@@ -1373,24 +1382,37 @@ let app = new Vue({
 
             type: 'line',
 
             barWidth: 15,
 
             yAxisIndex: 1,
 
+            showAllSymbol: true, //显示所有图形。
 
+            symbol: 'circle', //标记的图形为实心圆
 
+            symbolSize: 12, //标记的大小
 
+            smooth: false,
 
             itemStyle: {
 
-              normal: {
 
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
-                  {
 
-                    offset: 0,
 
-                    color: '#69C0FF',
 
-                  },
 
-                  {
 
-                    offset: 1,
 
-                    color: '#082550',
 
-                  },
 
-                ]),
 
+              color: params => {
 
+                if (params.value > 0 && dataR6[0][params.dataIndex] < 0) {
 
+                  return 'yellow'
 
+                } else {
 
+                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
+                    {
 
+                      offset: 0,
 
+                      color: '#69c0ff',
 
+                    },
 
+                    {
 
+                      offset: 1,
 
+                      color: '#082550',
 
+                    },
 
+                  ])
 
+                }
 
               },
 
             },
 
+            lineStyle: {
 
+              color: '#69C0FF',
 
+              width: 2,
 
+            },
 
             data: dataR6[1],
 
           },
 
         ],
 
       }
 
+      
       option.title.text = '各四级企业利润与薪酬变动情况'
 
       option.legend.data = ['2022年利润累计涨幅率', '2022年薪酬累计涨幅率']
 
       option.tooltip = {
 
@@ -1399,6 +1421,20 @@ let app = new Vue({
 
       }
 
       option.yAxis = [
 
         {
 
+          max: function (value) {
 
+            if (Math.abs(value.max) > Math.abs(value.min)) {
 
+              return (Math.abs(value.max) * 1.2).toFixed(2);
 
+            } else {
 
+              return (Math.abs(value.min) * 1.2).toFixed(2);
 
+            }
 
+          },
 
+          min: function (value) {
 
+            if (Math.abs(value.max) > Math.abs(value.min)) {
 
+              return (-Math.abs(value.max) * 1.2).toFixed(2);
 
+            } else {
 
+              return (-Math.abs(value.min) * 1.2).toFixed(2);
 
+            }
 
+          },
 
           splitLine: {
 
             show: true,
 
             lineStyle: {
 
@@ -1418,6 +1454,20 @@ let app = new Vue({
 
           },
 
         },
 
         {
 
+          max: function (value) {
 
+            if (Math.abs(value.max) > Math.abs(value.min)) {
 
+              return (Math.abs(value.max) * 1.2).toFixed(2);
 
+            } else {
 
+              return (Math.abs(value.min) * 1.2).toFixed(2);
 
+            }
 
+          },
 
+          min: function (value) {
 
+            if (Math.abs(value.max) > Math.abs(value.min)) {
 
+              return (-Math.abs(value.max) * 1.2).toFixed(2);
 
+            } else {
 
+              return (-Math.abs(value.min) * 1.2).toFixed(2);
 
+            }
 
+          },
 
           splitLine: {
 
             show: false,
 
           },

+ 13 - 0
manpower/styles/index.css
Visa fil 

@@ -103,10 +103,23 @@ a {
 
 .my-header span.left {
 
   position: absolute;
 
   left: 100px;
 
+  height: 50px;
 
   top: 40px;
 
   font-size: 30px;
 
   cursor: pointer;
 
 }
 
+.my-header span.left2 {
 
+  position: absolute;
 
+  left: 300px;
 
+  top: 20px;
 
+  height: 100px;
 
+  line-height: 100px;
 
+  display: inline-block;
 
+  width: 180px;
 
+  font-size: 36px;
 
+  cursor: pointer;
 
+}
 
+
 
 .my-header span.right {
 
   position: absolute;
 
   right: 100px;

Vissa filer visades inte eftersom för många filer har ändrats