Browse Source

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

l1448442195@163.com 1 year ago
parent
commit
75dc3ee9a8

BIN
investment/images/alert.png


+ 15 - 3
investment/investHome.html

@@ -15,12 +15,13 @@
     <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="./js/data.js"></script>
     <script src="./libs/vue-seamless-scroll.min.js"></script>
     <script src="./libs/echarts-tooltip-carousel.js"></script>
   </head>
   <body>
     <div id="app">
-      <!-- <dv-full-screen-container> -->
+      <dv-full-screen-container>
         <header class="my-header">
           <span>投资管理数智中心</span>
           <span class="right">{{time}}</span>
@@ -30,7 +31,7 @@
             <dv-border-box-8 :dur="10">
               <div class="my-panel">
                 <div class="panel-title">
-                  <span class="text">投资关键指标</span>
+                  <span class="text" @click="showTip = true">投资关键指标</span>
                   <span class="right-date">
                     <el-date-picker
                       v-model="year"
@@ -196,10 +197,21 @@
             ></dv-border-box-8>
           </div>
         </div>
+        <div class="tip" @click="showTip = false" v-show="showTip">
+          <div class="tip-box">
+            <div class="tip-content flex-between">
+              <div style="position: absolute; top:10px; left: calc(50% - 150px); width: 300px; text-align: center;">123</div>
+              <div ref="echartTip" class="content"></div>
+              <div ref="echartTip2" class="content"></div>
+            </div>
+          </div>
+        </div>
         <!-- <div class="footer">
           <a class="item" v-for="(item,index) in companyList" :key="index">{{item.name}}</a>
         </div> -->
-      <!-- </dv-full-screen-container> -->
+      </dv-full-screen-container>
+
+      
     </div>
     <script src="./js/investHome.js"></script>
   </body>

+ 103 - 0
investment/js/data.js

@@ -0,0 +1,103 @@
+let info = [
+  { name: '投资总额', value: 1324.08 },
+  { name: '项目总数', value: 442 },
+  { name: '固定资产', value: 1169.91 },
+  { name: '股权投资', value: 154.17 },
+]
+let statusList = [
+  { name: '新建项目', value: 345.53 },
+  { name: '续建项目', value: 978.55 }
+]
+let executeList = [
+  { name: '万家寨水控', value: 46.99, value2: 50.89 },
+  { name: '山西建设', value: 218.35, value2: 143.84 },
+  { name: '华新燃气', value: 31.83, value2: 25.20 },
+  { name: '国际能源', value: 64.20, value2: 12.19 },
+  { name: '汾酒集团', value: 14.03, value2: 7.69 },
+  { name: '大地控股', value: 47.05, value2: 23.93 },
+  { name: '晋能控股', value: 385.25, value2: 224.89 },
+  { name: '华远陆港', value: 97.57, value2: 112.67 },
+  { name: '山西焦煤', value: 189.07, value2: 121.59 },
+  { name: '潞安化工', value: 106.84, value2: 59.93 },
+  { name: '华阳新材', value: 82.95, value2: 71.34 },
+  { name: '太重集团', value: 80.01, value2: 42.46 },
+  { name: '文旅集团', value: 26.79, value2: 9.64 },
+  { name: '航产集团', value: 41.09, value2: 42.67 },
+  { name: '华舰体育', value: 5.33, value2: 0.80 },
+  { name: '神农科技', value: 14.76, value2: 5.84 },
+  { name: '云时代', value: 63.45, value2: 32.60 },
+  { name: '山西交控', value: 346.36, value2: 335.91 }
+]
+
+let industryList = [
+  { name: '传统产业投资', value: 405.29, value2: '0.30' },
+  { name: '战略新兴产业投资', value: 196.44, value2: '0.15' },
+  { name: '基础产业投资', value: 722.34, value2: '0.55' }
+
+]
+let amountList = [
+  { value: 283.42, name: '山西焦煤' },
+  { value: 622.16, name: '晋能控股' },
+  { value: 251.91, name: '华阳新材' },
+  { value: 163.19, name: '潞安化工' },
+  { value: 46.44, name: '华新燃气' },
+  { value: 32.07, name: '华远陆港' },
+  { value: 49.99, name: '汾酒集团' }
+
+]
+let projectList = [
+  { value: 35, name: '山煤河曲2×350MW低热值煤发电项目', status: '决策审批中' },
+  { value: 50.09, name: '泊里煤矿项目', status: '决策完成' },
+  { value: 50.77, name: '七元煤矿项目', status: '决策完成' },
+  { value: 9.83, name: '新源智慧建设运行总部', status: '决策完成' },
+  { value: 43.59, name: '潇河国际会展中心', status: '决策完成' },
+  { value: 40.3, name: '山西·潇河新城酒店', status: '决策完成' },
+  { value: 18.62, name: '平舒铁路专用线项目', status: '决策完成' },
+  { value: 9.34, name: '清凉湾温泉康养小镇项目', status: '决策完成' },
+  { value: 0.46, name: '山西省马铃薯工程技术研究中心', status: '决策完成' },
+  { value: 45, name: '山西省文化产业园(历史遗留)', status: '决策完成' },
+  { value: 60.21, name: '吴家峁矿井及选煤厂项目中泰煤业(历史遗留项目)', status: '决策完成' },
+  { value: 20.55, name: '孟母养生健康城(历史遗留)', status: '决策完成' },
+  { value: 22.07, name: '潇河国际会议中心', status: '决策完成' },
+  { value: 8.67, name: '大地控股忻州新店矿业有限公司年产800万吨精品砂石骨料项目', status: '决策完成' },
+  { value: 4.01, name: '晋城市万鑫顺达100MW光伏二期项目', status: '决策审批中' },
+  { value: 72.67, name: '同热三期2×100万千万项目', status: '已立项' },
+  { value: 47.98, name: '山西乡宁矿区谭坪煤矿一期工程项目(历史遗留项目)', status: '决策完成' },
+  { value: 15.25, name: '山西焦煤汾西荣欣矿区铁路专用线(一期)工程', status: '决策完成' },
+  { value: 39.3, name: '山西(太重)智能液压挖掘机产业园区生产线建设项目', status: '决策完成' },
+  { value: 35, name: '山煤河曲2×350MW低热值煤发电项目', status: '决策完成' },
+  { value: 60.21, name: '吴家峁矿井及选煤厂项目(历史遗留项目)', status: '决策完成' },
+  { value: 0.74, name: '有机旱作农业国家重点实验室仪器设备采购项目', status: '决策完成' },
+  { value: 1.72, name: '中国北方林果苗木繁育基地项目', status: '决策完成' },
+  { value: 1.53, name: '智慧农机装备园项目', status: '决策完成' },
+  { value: 9.34, name: '中部引黄交口县域供水工程', status: '决策完成' },
+  { value: 7.88, name: '西范灌区东扩工程', status: '决策完成' },
+  { value: 62.27, name: '灵北煤矿矿井及选煤厂项目(历史遗留项目)', status: '决策完成' },
+  { value: 16.73, name: '山西北方铜业有限公司铜矿峪矿园子沟尾矿库项目(历史遗留项目)', status: '决策完成' },
+  { value: 26.14, name: '山西北铜新材料科技有限公司新建高性能压延铜带箔和覆铜板项目(历史遗留项目)', status: '决策完成' },
+  { value: 34.92, name: '侯马北铜铜业有限公司年处理铜精矿150(优化变更 80)万吨综合回收项目(历史遗留项目)', status: '决策完成' },
+  { value: 2.03, name: '娘子关景区创建国家AAAA旅游景区建设项目', status: '决策完成' },
+  { value: 7.84, name: '平朔矿区150MW农光储氢一体化项目', status: '决策完成' },
+  { value: 10.45, name: '山西国际能源和顺综合清洁能源供应(风光储)一体化项目', status: '已立项' },
+  { value: 4.99, name: '应县100MW农光储氢一体化项目', status: '决策完成' },
+  { value: 4.99, name: '山阴100MW农光储氢一体化项目', status: '决策完成' },
+  { value: 5, name: '山西兆光发电有限责任公司100MW农光储一体化项目', status: '决策完成' },
+  { value: 13.56, name: '马家岩煤业', status: '决策完成' },
+  { value: 3.19, name: '山西省滹沱河重点段河道治理工程', status: '决策完成' },
+  { value: 12.39, name: '山西省泽城西安水电站(二期)工程', status: '决策完成' },
+  { value: 2.58, name: '万家寨引黄南干线滤沱河连通工程', status: '决策完成' },
+  { value: 15, name: '山西省万家寨引黄入晋工程总干线南干线泵站二期扩机工程', status: '决策完成' },
+  { value: 40.32, name: '晋中东山供水工程', status: '决策完成' },
+  { value: 27.3, name: '山西省小浪底引黄工程(灌区、工业及城镇生活供水部分)', status: '决策完成' },
+  { value: 20.21, name: '铂龙煤业', status: '决策完成' },
+  { value: 6.34, name: '世行项目煤层气滚动开发续建工程', status: '决策完成' },
+  { value: 5.52, name: '山西潇河国际会议中心有限公司', status: '决策完成' },
+  { value: 10.08, name: '设立山西潇河新城酒店有限公司', status: '决策完成' },
+  { value: 4.98, name: '保健酒园区新增原酒产能项目', status: '决策完成' },
+  { value: 80.53, name: '三交一号矿井及选煤厂', status: '决策完成' },
+  { value: 2.64, name: '山西省智慧旅游云平台项目(二期)', status: '决策完成' },
+  { value: 3.54, name: '吉县-延长输气管道项目', status: '决策完成' },
+  { value: 226.21, name: '太原武宿国际机场三期改扩建工程机场工程', status: '决策完成' },
+  { value: 60, name: '山西省(太重)智能高端装备产业园区项目', status: '决策完成' },
+  { value: 11.68, name: '太忻一体化经济区滹沱河供水工程', status: '决策完成' }
+]

+ 257 - 146
investment/js/investHome.js

@@ -2,6 +2,7 @@ let app = new Vue({
   el: '#app',
   data () {
     return {
+      showTip: true,
       year: '2022',
       time: '',
       timer: '',
@@ -11,24 +12,7 @@ let app = new Vue({
         number: [100],
         content: '{nt}个',
       },
-      storageRecordConfig: {
-        header: ['项目名称', '投资金额', '项目进度'],
-        headerBGC: '#05507b33',
-        oddRowBGC: '#05507b33',
-        evenRowBGC: '',
-        headerHeight: '40',
-        rowNum: 4,
-        align: ['center', 'center', 'center'],
-        data: [
-          ['山煤河曲2×350MW低热值煤发电项目', '35.00亿', '决策审批中'],
-          ['泊里煤矿项目', '50.09亿', '决策完成'],
-          ['七元煤矿项目', '50.77亿', '决策完成'],
-          ['新源智慧建设运行总部', '9.83亿', '决策完成'],
-          ['潇河国际会展中心', '43.59亿', '决策完成'],
-          ['山西·潇河新城酒店', '40.30亿', '决策完成'],
-          ['平舒铁路专用线项目', '18.62亿', '决策完成'],
-        ],
-      },
+      storageRecordConfig: null,
       companyList: [
         { name: '山西焦煤' },
         { name: '晋能控股' },
@@ -49,36 +33,7 @@ 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'
-        },
-      ],
+      amountList: amountList,
       amountTotal: 0,
       classOption: {
         step: 0.5
@@ -100,11 +55,16 @@ let app = new Vue({
     }
   },
   mounted () {
-    // 左侧图表
-    this.initChartL1()
-    this.initChartL2()
-    this.initChartR1()
-    this.initChinaChart()
+    setTimeout(() => {
+      // 左侧图表
+      this.initChartTip()
+      this.initChartTip2()
+      this.initChartL1()
+      this.initChartL2()
+      this.initChartR1()
+      this.initChinaChart()
+      this.initProjectList()
+    },0)
   },
   methods: {
     numFormat (value) {
@@ -575,7 +535,200 @@ let app = new Vue({
           },
         ],
       }
+      myChart.on('click', function(params) {
+        console.log(params)
+        window.open('https://www.baidu.com')
+      })
+      myChart.setOption(option)
+    },
+    initChartTip(){
+      let myChart = echarts.init(this.$refs['echartTip'])
+      let option = {
+        tooltip: {
+          trigger: 'item',
+        },
+        color: ['#6682f5', '#69c0ff', '#43ede3','#8ba2ff'],
+        legend: {
+          top: '0',
+          orient: 'vertical',
+          left: '2%',
+          textStyle: {
+            color: '#9DB9EB',
+          },
+        },
+        series: [
+          {
+            name: '',
+            type: 'pie',
+            center: ['45%','40%'],
+            radius: ['35%', '50%'],
+            labelLine: {
+              normal: {
+                lineStyle: {
+                  width: 1,
+                },
+              },
+            },
+            data: statusList,
+          },
+        ],
+      }
+      myChart.setOption(option)
+      tools.loopShowTooltip(myChart, option, {
+        nterval: 2000,
+        loopSeries: true,
+      })
+      myChart.on('click', function(param) {
+        console.log(param)
+        window.open('https://www.baidu.com')
+      })
+    },
+    initChartTip2(){
+      let myChart = echarts.init(this.$refs['echartTip2'])
+      let option = {
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {
+            type: 'cross',
+          },
+        },
+        dataZoom:[
+         {
+          // start: 9,//默认为@
+          // end: 100,//黑认认为1@0
+          type: "slider",
+          show: true,
+          // xAxisIndex: [0]
+          handlesize: 0,//滑动条的 左右2个滑动条的大小
+          startValue: 9,// 初始显示值
+          endValue: 6,// 结束显示值
+          height: 10,//组件高度
+          left:"5%",
+          right: "4%",//右边的距离
+          bottom: "25%",//底边的距离
+          borderColor:"#939",
+          fillerColor:"#269cdb",
+          borderRadius: 5,
+          backgroundColor: "#33384b",//两边未选中的滑动条区域的额色
+          showDataShadow: false,//是否显示数据阴影
+          showDetail: false,//即拖拽时候是否显示详细数值信息 
+          truerealtime: true,//是否实时更新
+          filterMode: "filter"
+         },{
+          type:'inside',
+          show: true,
+          start: 1,
+          end: 100
+         }
+        ],
+        grid: {
+          top: '16%',
+          right: '3%',
+          left: '10%',
+          bottom: '38%',
+        },
+        legend: {
+          top: '1',
+          right: '10',
+          textStyle: {
+            color: 'rgba(250,250,250,0.6)',
+          },
+        },
+        xAxis: {
+          data: executeList.map(item=>item.name),
+          axisLine: {
+            show: true, //隐藏X轴轴线
+            lineStyle: {
+              color: '#005094',
+              width: 1,
+            },
+          },
+          axisTick: {
+            show: false, //隐藏X轴刻度
+          },
+          axisLabel: {
+            show: true,
+            rotate: 40,
+            textStyle: {
+              color: 'rgba(255,255,255,0.6)', //X轴文字颜色
+            },
+          },
+        },
+        yAxis: [
+          {
+            type: 'value',
+            nameTextStyle: {
+              color: '#ebf8ac',
+            },
+            splitLine: {
+              show: true,
+              lineStyle: {
+                color: '#68b4dd66',
+                type: 'dashed',
+              },
+            },
+            axisLine: {
+              show: true,
+              lineStyle: {
+                color: '#3D7495',
+              },
+            },
+            axisLabel: {
+              show: true,
+              textStyle: {
+                color: 'rgba(250,250,250,0.6)',
+              },
+            },
+          },
+        ],
+        series: [
+          {
+            name: '计划投资',
+            type: 'bar',
+            barWidth: 10,
+            itemStyle: {
+              normal: {
+                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                  {
+                    offset: 0,
+                    color: '#69c0ff',
+                  },
+                  {
+                    offset: 1,
+                    color: '#082550',
+                  },
+                ]),
+              },
+            },
+            data: executeList.map(item=>item.value),
+          },
+          {
+            name: '实际投资',
+            type: 'bar',
+            barWidth: 10,
+            itemStyle: {
+              normal: {
+                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                  {
+                    offset: 0,
+                    color: '#957DFF',
+                  },
+                  {
+                    offset: 1,
+                    color: '#082550',
+                  },
+                ]),
+              },
+            },
+            data: executeList.map(item=>item.value2),
+          },
+        ],
+      }
       myChart.setOption(option)
+      tools.loopShowTooltip(myChart, option, {
+        nterval: 2000,
+        loopSeries: true,
+      })
     },
     initChartL1 () {
       let myChart = echarts.init(this.$refs['echartL1'])
@@ -583,7 +736,7 @@ let app = new Vue({
         tooltip: {
           trigger: 'item',
         },
-        color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3'],
+        color: ['#6682f5', '#69c0ff', '#43ede3','#8ba2ff'],
         legend: {
           top: 'center',
           orient: 'vertical',
@@ -604,12 +757,7 @@ let app = new Vue({
                 },
               },
             },
-            data: [
-              { value: 1048, name: '煤炭' },
-              { value: 735, name: '火电' },
-              { value: 580, name: '焦化' },
-              { value: 484, name: '风电' },
-            ],
+            data: statusList,
           },
         ],
       }
@@ -618,10 +766,6 @@ let app = new Vue({
         nterval: 2000,
         loopSeries: true,
       })
-      myChart.on('click', function(param) {
-        console.log(param)
-        window.open('https://www.baidu.com')
-      })
     },
     initChartL2 () {
       let myChart = echarts.init(this.$refs['echartL2'])
@@ -636,7 +780,7 @@ let app = new Vue({
           top: '16%',
           right: '3%',
           left: '10%',
-          bottom: '22%',
+          bottom: '23%',
         },
         legend: {
           top: '1',
@@ -646,27 +790,7 @@ let app = new Vue({
           },
         },
         xAxis: {
-          data: [
-            '家寨水控',
-            '山西建设',
-            '华新燃气',
-            '国际能源',
-            '汾酒集团',
-            '大地控股',
-            '晋能控股',
-            '华远陆港',
-            '山西焦煤',
-            '潞安化工',
-            '华阳新材',
-            '太重集团',
-            '文旅集团',
-            '航产集团',
-            '华舰体育',
-            '神农科技',
-            '云时代',
-            '山西交控'
-
-          ],
+          data: executeList.map(item=>item.name),
           axisLine: {
             show: true, //隐藏X轴轴线
             lineStyle: {
@@ -679,7 +803,7 @@ let app = new Vue({
           },
           axisLabel: {
             show: true,
-            rotate: 50,
+            rotate: 40,
             textStyle: {
               color: 'rgba(255,255,255,0.6)', //X轴文字颜色
             },
@@ -731,26 +855,7 @@ let app = new Vue({
                 ]),
               },
             },
-            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
-            ],
+            data: executeList.map(item=>item.value),
           },
           {
             name: '实际投资',
@@ -770,26 +875,7 @@ let app = new Vue({
                 ]),
               },
             },
-            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
-            ],
+            data: executeList.map(item=>item.value2),
           },
         ],
       }
@@ -804,7 +890,7 @@ let app = new Vue({
       let option = {
         tooltip: {
           trigger: 'axis',
-          formatter: '{a0}:{c0}' + '<br/>' + '{a1}:{c1}' + '%',
+          formatter: '{a0}:{c0}' + '亿元' + '<br/>' + '{a1}:{c1}' + '%',
           axisPointer: {
             type: 'cross',
           },
@@ -813,7 +899,7 @@ let app = new Vue({
           top: '16%',
           right: '10%',
           left: '10%',
-          bottom: '15%',
+          bottom: '10%',
         },
         legend: {
           top: '1',
@@ -822,7 +908,7 @@ let app = new Vue({
           },
         },
         xAxis: {
-          data: ['煤炭', '火电', '焦化', '物流贸易', '文旅康养', '水务', '生物', '冶金', '建材'],
+          data: industryList.map(item=> item.name),
           axisLine: {
             show: true, //隐藏X轴轴线
             lineStyle: {
@@ -835,7 +921,7 @@ let app = new Vue({
           },
           axisLabel: {
             show: true,
-            rotate: 20,
+            // rotate: 20,
             textStyle: {
               color: 'rgba(255,255,255,0.6)', //X轴文字颜色
             },
@@ -870,15 +956,11 @@ let app = new Vue({
           },
           {
             type: 'value',
-            name: '',
-            nameTextStyle: {
-              color: 'rgba(255,255,255,0.6)',
-            },
             axisLine: {
               show: false,
-              lineStyle: {
-                color: '#3D7495',
-              },
+            },
+            splitLine: {
+              show: false,
             },
             axisLabel: {
               show: true,
@@ -892,7 +974,7 @@ let app = new Vue({
         series: [
           {
             type: 'bar',
-            name: '柱形数据',
+            name: '投资金额',
             barWidth: 15,
             itemStyle: {
               normal: {
@@ -908,19 +990,31 @@ let app = new Vue({
                 ]),
               },
             },
-            data: [900, 600, 500, 450, 500, 900, 600, 500, 450],
+            data: industryList.map(item=> item.value),
           },
           {
             type: 'line',
-            name: '折线数据',
-            barWidth: 15,
+            name: '投资占比',
+            type: 'line',
             yAxisIndex: 1,
+            smooth: true, //平滑曲线显示
+            showAllSymbol: true, //显示所有图形。
+            symbol: 'circle', //标记的图形为实心圆
+            symbolSize: 4, //标记的大小
+            smooth: false,
             itemStyle: {
-              normal: {
-                color: '#FBE139',
-              },
+              //折线拐点标志的样式
+              color: '#fbe138',
+              borderColor: '#fbe138',
+              width: 1,
+              shadowColor: '#fbe138',
+              shadowBlur: 2,
             },
-            data: [60, 50, 45, 50, 100, 45, 60, 45, 20],
+            lineStyle: {
+              color: '#fbe138',
+              width: 1,
+            },
+            data: industryList.map(item=> item.value2),
           },
         ],
       }
@@ -934,5 +1028,22 @@ let app = new Vue({
         window.open('https://www.baidu.com')
       })
     },
+    initProjectList() {
+      let dataList = []
+      projectList.map(item=> {
+        dataList.push([item.name,item.value+'亿',item.status])
+      })
+      this.storageRecordConfig = {
+        header: ['项目名称', '投资金额', '项目进度'],
+        headerBGC: '#05507b33',
+        oddRowBGC: '#05507b33',
+        evenRowBGC: '',
+        headerHeight: '40',
+        rowNum: 5,
+        columnWidth: [350,100],
+        align: ['center', 'center', 'center'],
+        data: dataList,
+      }
+    }
   },
 })

+ 65 - 1
investment/styles/investHome.css

@@ -207,7 +207,7 @@ a {
   background-size: 100% 100%;
 }
 .my-panel .content {
-  height: calc(100% - 60px);
+  height: calc(28vh - 60px);
 }
 .panel-title {
   position: relative;
@@ -419,3 +419,67 @@ a {
   height: 190px;
   overflow: hidden;
 }
+
+.tip-window {
+  margin-right: 50px;
+  margin-top: 10px;
+  color: #69c0ff;
+  display: inline-block;
+  width: 142px;
+  height: 50px;
+  line-height: 50px;
+  text-align: center;
+  background-color: rgba(64, 169, 255, 0.12);
+  border: 2px solid #40a9ff;
+  border-radius: 8px;
+  cursor: pointer;
+}
+.tip {
+  /* position: fixed;
+  background-color: rgba(0, 0, 0, 0.5);
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0; */
+}
+.tip-box {
+  z-index: 9;
+  position: fixed;
+  /* top: 35%;
+  left: 32.5%; */
+  /* width: 35%;
+  height: 30%; */
+  width: 900px;
+  height: 56vh;
+  top: calc(50% - 26vh);
+  left: calc(50% - 450px);
+  background: url("../images/alert.png") no-repeat center;
+  /* background-color: #133b65; */
+  background-size: 100% 100%;
+  padding: 100px 60px 50px;
+}
+.tip-box > div {
+  font-size: 42px;
+  line-height: 70px;
+}
+.tip-content {
+  height: 56vh;
+  overflow: auto;
+  padding-right: 15px;
+  margin-top: 2%;
+}
+.tip-content .content {
+  height: calc(56vh - 60px);
+  width: 400px;
+}
+div::-webkit-scrollbar {
+  width: 4px;
+}
+div::-webkit-scrollbar-thumb {
+  border-radius: 10px;
+  background: rgba(64, 169, 255, 0.6);
+}
+div::-webkit-scrollbar-track {
+  border-radius: 0;
+  background: rgba(64, 169, 255, 0.3);
+}

+ 3 - 2
manpower/js/data.js

@@ -20,7 +20,7 @@ const companyList = [
 ]
 const data = {
   info: {
-    value1: '5808',
+    value1: '5805',
     value2: '444094',
     value3: '860527',
   },
@@ -44,7 +44,7 @@ const data = {
 }
 const dataL1 = [
   [35, 30, 28, 41, 28, 28, 6, 23, 31, 19, 19, 17, 23, 27, 25, 15, 13, 13],
-  [18, 21, 14, 21, 13, 14, 6, 13, 13, 14, 14, 12, 15, 16, 12, 15, 10, 19],
+  [18, 21, 14, 21, 13, 14, 6, 13, 13, 14, 14, 12, 15, 16, 12, 15, 10, 13],
   [21, 21, 21, 21, 13, 13, 6, 13, 13, 14, 14, 12, 15, 15, 12, 15, 12, 13],
 ]
 const dataL2 = [
@@ -73,6 +73,7 @@ const dataL7 = [
   [-1, -5, -24, 2, 5, -4, -13, -5, -3, 2, -2, -3, 5, 1, 14, -1, 490, 23],
   [34.0, 17.0, 23.0, 26, 2, 7, null, 24.0, 15.0, -33.0, 10.0, -38.0, 12.0, 43.0, -7.0, 6.0, 56.0, 121.0],
 ]
+
 const dataL8 = [
   [-1, -5, -24, 2, 5, -4, -13, -5, -3, 2, -2, -3, 5, 1, 14, -1, 490, 23],
   [145.0, 88.0, 58.0, 70, 8, 33, 98, 21.0, 24.0, -470.0, 69.0, -185.0, 19.0, 33.0, -4.0, 27.0, 76.0, 107.0],

+ 1 - 1
manpower/js/data2.js

@@ -97,8 +97,8 @@ const dataR4 = [
   [19, 62, 70, 3, 347, 23, 50, 2, 566]
 ]
 const dataR5 = [
+  [17117.80, 12669.20, 14311.00, 11220.77, 9302.98, 12107.07, 8637.63, 9259.17, 7301.61],
   [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],

+ 1 - 1
manpower/js/data3.js

@@ -50,7 +50,7 @@ const dataL1 = [
   [17, 27, 47, 4, 36, 43, 33, 36, 34, 17]
 ]
 const dataL2 = [
-  [48, 27, 28, 42, 37, 44, 34, 37, 35, 18]
+  [27, 28, 48, 42, 37, 44, 34, 37, 35, 18]
 ]
 const dataL3 = [
   [34, 54, 94, 8, 72, 86, 66, 72, 68, 34]

+ 4 - 4
manpower/js/data4.js

@@ -39,11 +39,11 @@ const dataL2 = [
   [3, 9, 10, 33, 23, 29, 13, 8]
 ]
 const dataL3 = [
-  [6, 18, 20, 66, 46, 58, 26, 12]
+  [5, 4, 12, 24, 32, 25, 35, 8]
 ]
 const dataL4 = [
   [6, 18, 20, 66, 46, 58, 26, 12],
-  [66.67, 56.25, 27.40, 23.66, 30.46, 46.40, 18.06, 100.00]
+  [55.56, 12.50, 16.44, 8.60, 21.19, 20.00, 24.31, 66.67]
 ]
 const dataL5 = [
   [9, 32, 73, 279, 151, 125, 144, 12],
@@ -88,8 +88,8 @@ const dataR4 = [
   [0, 0, 0, 1, 2, 0, 0, 0]
 ]
 const dataR5 = [
-  [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]
+  [15323.20, 0.00, 9084.66, 10674.11, 12694.67, 10281.05, 4433.65, 0.00],
+  [11000, 0.00, 6666.66, 9492.75, 41783.7, 0, 3387.97, 8333.33]
 ]
 const dataR6 = [
   [0, -100, -920, -239, 38, 27, 30, -2727],

+ 495 - 30
manpower/js/index.js

@@ -4,6 +4,9 @@ let app = new Vue({
   el: '#app',
   data() {
     return {
+      twinkle7: [],
+      twinkle8: [],
+      twinkleR6: [],
       showTip: false,
       showTip2: false,
       tipNum: '',
@@ -19,6 +22,7 @@ let app = new Vue({
         header: ['', '时间', '所属集团', '工作情况'],
         headerBGC: '#05507b33',
         oddRowBGC: '#69c0ff0f',
+        waitTime: '50000',
         evenRowBGC: '',
         headerHeight: '40',
         columnWidth: [150, 150],
@@ -177,6 +181,30 @@ let app = new Vue({
       },
     }
   },
+  beforeMount(){
+    dataL7[0].forEach((item,index) => {
+      if(dataL7[1][index] < 0 &&  dataL7[0][index] > 0){
+        let obj = {value:[companyList[index].name ,dataL7[0][index]],symbolSize:15 }
+        this.twinkle7.push(obj)
+      }
+    })
+    //  if (dataL8[1][params.dataIndex] < 0 && params.value > 0) {
+      dataL8[0].forEach((item,index) => {
+        if(dataL8[1][index] < 0 &&  dataL8[0][index] > 0){
+          let obj = {value:[companyList[index].name ,dataL8[0][index]],symbolSize:15 }
+          this.twinkle8.push(obj)
+        }
+      })
+      // params.value > 0 && fjxdataL2[0][params.dataIndex] < 0
+      fjxdataL2[0].forEach((item,index) => {
+        if(fjxdataL2[1][index] > 0 &&  fjxdataL2[0][index] < 0){
+          let obj = {value:[companyList[index].name ,fjxdataL2[1][index]],symbolSize:15 }
+          this.twinkleR6.push(obj)
+        }
+      })
+      
+    console.log(this.twinkleR6)
+  },
   mounted() {
     this.time = formatDate()
     this.timer = setInterval(() => {
@@ -340,6 +368,25 @@ let app = new Vue({
             name: '当前共享服务中心/事业部数',
             type: 'bar',
             barWidth: 15,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                textStyle: {
+                  color: '#69c0ff',
+                  fontStyle: 'normal',
+                  textAlign: 'left',
+                  fontSize: 16,
+              },
+                formatter: function(data) {
+                    if(data.name == '华阳新材'){
+                      return data.value
+                    } else {
+                      return ''
+                    }
+               }
+             }
+            },
             itemStyle: {
               color: params => {
                 if (params.value > dataL2[1][params.dataIndex]) {
@@ -378,6 +425,25 @@ let app = new Vue({
             symbol: 'circle', //标记的图形为实心圆
             symbolSize: 8, //标记的大小
             smooth: false,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                textStyle: {
+                  color: '#fbe138',
+                  fontStyle: 'normal',
+                  textAlign: 'left',
+                  fontSize: 16,
+              },
+                formatter: function(data) {
+                    if(data.name == '华阳新材'){
+                      return data.value
+                    } else {
+                      return ''
+                    }
+               }
+             }
+            },
             itemStyle: {
               //折线拐点标志的样式
               color: '#fbe138',
@@ -531,6 +597,25 @@ let app = new Vue({
             name: '六定改革前总部中层管理人数',
             type: 'bar',
             barWidth: 15,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                textStyle: {
+                  color: '#69c0ff',
+                  fontStyle: 'normal',
+                  textAlign: 'left',
+                  fontSize: 16,
+              },
+                formatter: function(data) {
+                    if(data.name == '云时代'){
+                      return data.value
+                    } else {
+                      return ''
+                    }
+               }
+             }
+            },
             itemStyle: {
               normal: {
                 color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
@@ -551,6 +636,25 @@ let app = new Vue({
             name: '当前总部中层管理人数',
             type: 'bar',
             barWidth: 15,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                textStyle: {
+                  color: '#6480f3',
+                  fontStyle: 'normal',
+                  textAlign: 'left',
+                  fontSize: 16,
+              },
+                formatter: function(data) {
+                    if(data.name == '云时代'){
+                      return data.value
+                    } else {
+                      return ''
+                    }
+               }
+             }
+            },
             itemStyle: {
               normal: {
                 color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
@@ -576,6 +680,25 @@ let app = new Vue({
             symbol: 'circle', //标记的图形为实心圆
             symbolSize: 8, //标记的大小
             smooth: false,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                textStyle: {
+                  color: '#fbe138',
+                  fontStyle: 'normal',
+                  textAlign: 'left',
+                  fontSize: 16,
+              },
+                formatter: function(data) {
+                    if(data.name == '云时代'){
+                      return data.value
+                    } else {
+                      return ''
+                    }
+               }
+             }
+            },
             itemStyle: {
               //折线拐点标志的样式
               color: '#fbe138',
@@ -614,6 +737,26 @@ let app = new Vue({
             name: '各省属企业总人数',
             type: 'bar',
             barWidth: 15,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                lineHeight:'25',
+                textStyle: {
+                  color: '#69c0ff',
+                  fontStyle: 'normal',
+                  textAlign: 'left',
+                  fontSize: 16,
+              },
+                formatter: function(data) {
+                    if(data.name == '华阳新材' || data.name=='华舰体育'){
+                      return data.value
+                    } else {
+                      return ''
+                    }
+               }
+             }
+            },
             itemStyle: {
               normal: {
                 color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
@@ -639,6 +782,26 @@ let app = new Vue({
             symbol: 'circle', //标记的图形为实心圆
             symbolSize: 8, //标记的大小
             smooth: false,
+            label: {
+              normal: {
+                show: true,
+                position: 'bottom',
+                lineHeight: '25',
+                textStyle: {
+                  color: '#b889ea',
+                  fontStyle: 'normal',
+                  textAlign: 'left',
+                  fontSize: 16,
+              },
+                formatter: function(data) {
+                    if(data.name == '华阳新材' || data.name=='华舰体育'){
+                      return data.value
+                    } else {
+                      return ''
+                    }
+               }
+             }
+            },
             itemStyle: {
               //折线拐点标志的样式
               color: '#b889ea',
@@ -768,6 +931,7 @@ let app = new Vue({
     },
     initChartL7() {
       let myChart = echarts.init(this.$refs['echartL7'])
+      let that = this
       let option = {
         ..._.cloneDeep(this.commonOption),
         color: ['#43ede3'],
@@ -780,6 +944,26 @@ let app = new Vue({
             symbol: 'circle', //标记的图形为实心圆
             symbolSize: 15, //标记的大小
             smooth: false,
+            label: {
+              normal: {
+                show: true,
+                position: 'bottom',
+                lineHeight: '35',
+                textStyle: {
+                  color: '#43ede3',
+                  fontStyle: 'normal',
+                  textAlign: 'left',
+                  fontSize: 16,
+                },
+                formatter: function(data) {
+                    if(data.name == '文旅集团'|| data.name== "大地控股" || data.name=='华舰体育'){
+                      return data.value
+                    } else {
+                      return ''
+                    }
+               }
+             }
+            },
             itemStyle: {
               color: params => {
                 if (dataL7[1][params.dataIndex] < 0 && params.value > 0) {
@@ -803,8 +987,28 @@ let app = new Vue({
             smooth: true, //平滑曲线显示
             showAllSymbol: true, //显示所有图形。
             symbol: 'circle', //标记的图形为实心圆
-            symbolSize: 15, //标记的大小
+            symbolSize: 8, //标记的大小
             smooth: false,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                lineHeight: '25',
+                textStyle: {
+                  color: '#b889ea',
+                  fontStyle: 'normal',
+                  textAlign: 'left',
+                  fontSize: 16,
+                },
+                formatter: function(data) {
+                    if(data.name == '文旅集团'|| data.name== "大地控股" || data.name=='华舰体育'){
+                      return data.value
+                    } else {
+                      return ''
+                    }
+               }
+             }
+            },
             itemStyle: {
               //折线拐点标志的样式
               color: '#b889ea',
@@ -815,6 +1019,26 @@ let app = new Vue({
             },
             data: dataL7[1],
           },
+          {
+            type: 'effectScatter',
+            coordinateSystem: 'cartesian2d',
+            showEffectOn: 'render',
+            rippleEffect: {
+              period: 10,
+              scale: 4,
+              brushType: 'stroke'
+            },
+            hoverAnimation: true,
+            itemStyle: {
+              color: 'red'
+            },
+            lineStyle: {
+              color: '#43ede3',
+              width: 2,
+            },
+            
+            data: that.twinkle7,
+          },
         ],
       }
       option.title.text = '人数变化和全员劳动生产率变化分析'
@@ -865,6 +1089,26 @@ let app = new Vue({
             symbol: 'circle', //标记的图形为实心圆
             symbolSize: 15, //标记的大小
             smooth: false,
+            label: {
+              normal: {
+                show: true,
+                position: 'bottom',
+                lineHeight:'20',
+                textStyle: {
+                  color: '#43ede3',
+                  fontStyle: 'normal',
+                  textAlign: 'left',
+                  fontSize: 16,
+              },
+                formatter: function(data) {
+                    if(data.name == '文旅集团' || data.name=='大地控股'){
+                      return data.value
+                    } else {
+                      return ''
+                    }
+               }
+             }
+            },
             itemStyle: {
               color: params => {
                 if (dataL8[1][params.dataIndex] < 0 && params.value > 0) {
@@ -888,6 +1132,26 @@ let app = new Vue({
             symbol: 'circle', //标记的图形为实心圆
             symbolSize: 15, //标记的大小
             smooth: false,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                lineHeight:'30',
+                textStyle: {
+                  color: '#b889ea',
+                  fontStyle: 'normal',
+                  textAlign: 'left',
+                  fontSize: 16,
+              },
+                formatter: function(data) {
+                    if(data.name == '文旅集团' || data.name=='大地控股'){
+                      return data.value
+                    } else {
+                      return ''
+                    }
+               }
+             }
+            },
             itemStyle: {
               //折线拐点标志的样式
               color: '#b889ea',
@@ -903,6 +1167,46 @@ let app = new Vue({
             },
             data: dataL8[1],
           },
+          {
+            type: 'effectScatter',
+            coordinateSystem: 'cartesian2d',
+            showEffectOn: 'render',
+            rippleEffect: {
+              period: 10,
+              scale: 4,
+              brushType: 'stroke'
+            },
+            hoverAnimation: true,
+            itemStyle: {
+              color: 'red'
+            },
+            lineStyle: {
+              color: '#43ede3',
+              width: 2,
+            },
+            
+            data: this.twinkle8,
+          },
+          // {
+          //   type: 'effectScatter',
+          //   coordinateSystem: 'cartesian2d',
+          //   showEffectOn: 'render',
+          //   rippleEffect: {
+          //     period: 10,
+          //     scale: 4,
+          //     brushType: 'stroke'
+          //   },
+          //   hoverAnimation: true,
+          //   itemStyle: {
+          //     color: 'red'
+          //   },
+          //   lineStyle: {
+          //     color: '#43ede3',
+          //     width: 2,
+          //   },
+            
+          //   data: that.twinkle,
+          // },
         ],
         // tooltip: {
         //   trigger: 'axis',
@@ -930,6 +1234,25 @@ let app = new Vue({
             name: '全员劳动生产率(万/人)',
             type: 'bar',
             barWidth: 15,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                textStyle: {
+                  color: '#fff',
+                  fontStyle: 'normal',
+                  textAlign: 'left',
+                  fontSize: 16,
+              },
+                formatter: function(data) {
+                    if(data.name == '国际能源' || data.name == '汾酒集团'){
+                      return data.value
+                    } else {
+                      return ''
+                    }
+               }
+             }
+            },
             itemStyle: {
               color: params => {
                 if (params.value < 0 && c1[1][params.dataIndex] < 0) {
@@ -950,6 +1273,52 @@ let app = new Vue({
                 }
               },
             },
+
+            // markPoint:{
+            //   symbolSize: 1,
+            //   symbolOffset: [0, '50%'],
+            //   label:{
+            //     show: true,
+            //     fontSize:18,
+            //     color: '#fff',
+            //     backgroundColor: 'rgba(38,48,59,0.6)',
+            //     borderColor: '#aaa',
+            //     borderWidth: 1,
+            //     borderRadius: 4,
+            //     padding: [4, 10],
+            //     lineHeight: 26,
+            //     position: 'top',
+            //     distance: 20,
+            //     // formatter: data =>{
+            //     //   console.log('11',data)
+            //     // },
+            //     formatter: [
+            //       '{a|这段文本采用样式a}',
+            //       '这段用默认样式{x|这段用样式x}'
+            //     ].join('\n'),
+            //     rich: {
+            //       a: {
+            //           color: 'yellow',
+            //           lineHeight: 10
+            //       },
+            //       b: {
+            //           // backgroundColor: {
+            //           //     image: './images/alert.png'
+            //           // },
+            //           height: 40
+            //       },
+            //       x: {
+            //           fontSize: 18,
+            //           borderColor: '#449933',
+            //           borderRadius: 4
+            //       },
+            //     }
+            //   },
+            //   // itemStyle: {
+            //   //   color: 'rgba(38,48,59,0.6)'
+            //   // },
+            //   data:[{value:'117.48', xAxis: '国际能源', yAxis: 127 },{value:'138.83', xAxis: '汾酒集团', yAxis: 148 }]
+            // },
             markLine: {
               data: [
                 {
@@ -1048,32 +1417,11 @@ let app = new Vue({
           },
         },
       })
-      // option.yAxis.push({
-      //   type: 'log',
-      //   min: -1,
-      //   logBase: 10,
-      //   axisLine: {
-      //     show: false,
-      //   },
-      //   splitLine: {
-      //     show: false,
-      //   },
-      //   axisLabel: {
-      //     show: true,
-      //     formatter: function(value) {
-      //       console.log(value,"value")
-      //       // return value === 1 ? 0 : value
-      //     },
-      //     textStyle: {
-      //       color: 'rgba(250,250,250,0.6)',
-      //     },
-      //   },
-      // })
       myChart.setOption(option)
-      tools.loopShowTooltip(myChart, option, {
-        nterval: 2000,
-        loopSeries: true,
-      })
+      // tools.loopShowTooltip(myChart, option, {
+      //   nterval: 2000,
+      //   loopSeries: true,
+      // })
     },
     initChartC2() {
       let myChart = echarts.init(this.$refs['echartC2'])
@@ -1085,6 +1433,25 @@ let app = new Vue({
             name: '人工成本利润率',
             type: 'bar',
             barWidth: 15,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                textStyle: {
+                  color: '#fff',
+                  fontStyle: 'normal',
+                  textAlign: 'left',
+                  fontSize: 16,
+              },
+                formatter: function(data) {
+                    if(data.name == '国际能源' || data.name == '文旅集团' || data.name == '航产集团' || data.name == '华舰体育'){
+                      return data.value
+                    } else {
+                      return ''
+                    }
+               }
+             }
+            },
             markLine: {
               data: [
                 {
@@ -1189,10 +1556,10 @@ let app = new Vue({
         },
       })
       myChart.setOption(option)
-      tools.loopShowTooltip(myChart, option, {
-        nterval: 2000,
-        loopSeries: true,
-      })
+      // tools.loopShowTooltip(myChart, option, {
+      //   nterval: 2000,
+      //   loopSeries: true,
+      // })
     },
     // 右侧图表---------------------------------------------开始
     initChartR1() {
@@ -1386,6 +1753,25 @@ let app = new Vue({
             name: '2022年利润(万)',
             type: 'bar',
             barWidth: 15,
+            label: {
+              normal: {
+                show: true,
+                position: 'bottom',
+                textStyle: {
+                  color: '#69c0ff',
+                  fontStyle: 'normal',
+                  textAlign: 'left',
+                  fontSize: 14,
+              },
+                formatter: function(data) {
+                    if(data.name=="国际能源" || data.name == '文旅集团' || data.name=='航产集团'||data.name == '华舰体育'){
+                      return data.value
+                    } else {
+                      return ''
+                    }
+               }
+             }
+            },
             itemStyle: {
               normal: {
                 color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
@@ -1407,6 +1793,25 @@ let app = new Vue({
             type: 'bar',
             barWidth: 15,
             yAxisIndex: 1,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                textStyle: {
+                  color: '#45DAD1',
+                  fontStyle: 'normal',
+                  textAlign: 'right',
+                  fontSize: 14,
+              },
+                formatter: function(data) {
+                    if(data.name=="国际能源" || data.name == '文旅集团' || data.name=='航产集团'||data.name == '华舰体育'){
+                      return data.value
+                    } else {
+                      return ''
+                    }
+               }
+             }
+            },
             itemStyle: {
               color: params => {
                 if (params.value > 0 && dataR3[0][params.dataIndex] < 0) {
@@ -1685,6 +2090,26 @@ let app = new Vue({
             symbol: 'circle', //标记的图形为实心圆
             symbolSize: 8, //标记的大小
             smooth: false,
+            label: {
+              normal: {
+                show: true,
+                lineHeight:'20',
+                position: 'top',
+                textStyle: {
+                  color: '#B889EA',
+                  fontStyle: 'normal',
+                  textAlign: 'left',
+                  fontSize: 16,
+              },
+                formatter: function(data) {
+                    if(data.name == '文旅集团'){
+                      return data.value
+                    } else {
+                      return ''
+                    }
+               }
+             }
+            },
             itemStyle: {
               //折线拐点标志的样式
               color: '#B889EA',
@@ -1708,6 +2133,26 @@ let app = new Vue({
             symbol: 'circle', //标记的图形为实心圆
             symbolSize: 12, //标记的大小
             smooth: false,
+            label: {
+              normal: {
+                show: true,
+                position: 'top',
+                lineHeight:'35',
+                textStyle: {
+                  color: '#69c0ff',
+                  fontStyle: 'normal',
+                  textAlign: 'left',
+                  fontSize: 16,
+              },
+                formatter: function(data) {
+                    if(data.name == '文旅集团'){
+                      return data.value
+                    } else {
+                      return ''
+                    }
+               }
+             }
+            },
             itemStyle: {
               color: params => {
                 if (params.value > 0 && fjxdataL2[0][params.dataIndex] < 0) {
@@ -1732,6 +2177,26 @@ let app = new Vue({
             },
             data: fjxdataL2[1],
           },
+          {
+            type: 'effectScatter',
+            coordinateSystem: 'cartesian2d',
+            showEffectOn: 'render',
+            rippleEffect: {
+              period: 10,
+              scale: 4,
+              brushType: 'stroke'
+            },
+            hoverAnimation: true,
+            itemStyle: {
+              color: 'yellow'
+            },
+            lineStyle: {
+              color: '#43ede3',
+              width: 2,
+            },
+            
+            data: this.twinkleR6,
+          },
         ],
       }
       option.title.text = '各省属企业利润与薪酬变动情况'

+ 88 - 0
manpower/js/index2.js

@@ -4,6 +4,9 @@ let app = new Vue({
   el: '#app',
   data() {
     return {
+      twinkle7: [],
+      twinkle8: [],
+      twinkleR6: [],
       showTip: false,
       tipNum: '',
       time: '',
@@ -135,6 +138,30 @@ let app = new Vue({
       },
     }
   },
+  beforeMount(){
+    dataL7[0].forEach((item,index) => {
+      if(dataL7[1][index] < 0 &&  dataL7[0][index] > 0){
+        let obj = {value:[companyList[index].name ,dataL7[0][index]],symbolSize:15 }
+        this.twinkle7.push(obj)
+      }
+    })
+    //  if (dataL8[1][params.dataIndex] < 0 && params.value > 0) {
+      dataL8[0].forEach((item,index) => {
+        if(dataL8[1][index] < 0 &&  dataL8[0][index] > 0){
+          let obj = {value:[companyList[index].name ,dataL8[0][index]],symbolSize:15 }
+          this.twinkle8.push(obj)
+        }
+      })
+      // params.value > 0 && fjxdataL2[0][params.dataIndex] < 0
+      dataR6[0].forEach((item,index) => {
+        if(dataR6[1][index] > 0 &&  dataR6[0][index] < 0){
+          let obj = {value:[companyList[index].name ,dataR6[1][index]],symbolSize:15 }
+          this.twinkleR6.push(obj)
+        }
+      })
+      
+    console.log(this.twinkleR6)
+  },
   mounted() {
     this.time = formatDate()
     this.timer = setInterval(() => {
@@ -595,6 +622,27 @@ let app = new Vue({
             // },
             data: dataL7[1],
           },
+
+          {
+            type: 'effectScatter',
+            coordinateSystem: 'cartesian2d',
+            showEffectOn: 'render',
+            rippleEffect: {
+              period: 10,
+              scale: 4,
+              brushType: 'stroke'
+            },
+            hoverAnimation: true,
+            itemStyle: {
+              color: 'red'
+            },
+            lineStyle: {
+              color: '#43ede3',
+              width: 2,
+            },
+            
+            data: this.twinkle7,
+          },
         ],
       }
       option.title.text = '人数变化和全员劳动生产率变化率分析'
@@ -695,6 +743,26 @@ let app = new Vue({
             },
             data: dataL8[1],
           },
+          {
+            type: 'effectScatter',
+            coordinateSystem: 'cartesian2d',
+            showEffectOn: 'render',
+            rippleEffect: {
+              period: 10,
+              scale: 4,
+              brushType: 'stroke'
+            },
+            hoverAnimation: true,
+            itemStyle: {
+              color: 'red'
+            },
+            lineStyle: {
+              color: '#43ede3',
+              width: 2,
+            },
+            
+            data: this.twinkle8,
+          },
         ],
       }
       option.title.text = '人数变化和人工利润率变化分析'
@@ -1393,6 +1461,26 @@ let app = new Vue({
             },
             data: dataR6[1],
           },
+          {
+            type: 'effectScatter',
+            coordinateSystem: 'cartesian2d',
+            showEffectOn: 'render',
+            rippleEffect: {
+              period: 10,
+              scale: 4,
+              brushType: 'stroke'
+            },
+            hoverAnimation: true,
+            itemStyle: {
+              color: 'red'
+            },
+            lineStyle: {
+              color: '#43ede3',
+              width: 2,
+            },
+            
+            data: this.twinkleR6,
+          },
         ],
       }
       option.title.text = '各二级企业利润与薪酬变动情况'

+ 89 - 0
manpower/js/index3.js

@@ -4,6 +4,9 @@ let app = new Vue({
   el: '#app',
   data() {
     return {
+      twinkle7: [],
+      twinkle8: [],
+      twinkleR6: [],
       showTip: false,
       tipNum: '',
       time: '',
@@ -137,6 +140,31 @@ let app = new Vue({
       },
     }
   },
+  beforeMount(){
+    dataL7[0].forEach((item,index) => {
+      if(dataL7[1][index] < 0 &&  dataL7[0][index] > 0){
+        let obj = {value:[companyList[index].name ,dataL7[0][index]],symbolSize:15 }
+        this.twinkle7.push(obj)
+      }
+    })
+    //  if (dataL8[1][params.dataIndex] < 0 && params.value > 0) {
+      dataL8[0].forEach((item,index) => {
+        if(dataL8[1][index] < 0 &&  dataL8[0][index] > 0){
+          let obj = {value:[companyList[index].name ,dataL8[0][index]],symbolSize:15 }
+          this.twinkle8.push(obj)
+        }
+      })
+      //params.value > 0 && dataR6[0][params.dataIndex] < 0
+      // params.value > 0 && fjxdataL2[0][params.dataIndex] < 0
+      dataR6[0].forEach((item,index) => {
+        if(dataR6[1][index] > 0 &&  dataR6[0][index] < 0){
+          let obj = {value:[companyList[index].name ,dataR6[1][index]],symbolSize:15 }
+          this.twinkleR6.push(obj)
+        }
+      })
+      
+    console.log(this.twinkleR6)
+  },
   mounted() {
     this.time = formatDate()
     this.timer = setInterval(() => {
@@ -579,6 +607,26 @@ let app = new Vue({
             },
             data: dataL7[1],
           },
+          {
+            type: 'effectScatter',
+            coordinateSystem: 'cartesian2d',
+            showEffectOn: 'render',
+            rippleEffect: {
+              period: 10,
+              scale: 4,
+              brushType: 'stroke'
+            },
+            hoverAnimation: true,
+            itemStyle: {
+              color: 'red'
+            },
+            lineStyle: {
+              color: '#43ede3',
+              width: 2,
+            },
+            
+            data: this.twinkle7,
+          },
         ],
       }
       option.title.text = '人数变化和全员劳动生产率变化率分析'
@@ -679,6 +727,26 @@ let app = new Vue({
             },
             data: dataL8[1],
           },
+          {
+            type: 'effectScatter',
+            coordinateSystem: 'cartesian2d',
+            showEffectOn: 'render',
+            rippleEffect: {
+              period: 10,
+              scale: 4,
+              brushType: 'stroke'
+            },
+            hoverAnimation: true,
+            itemStyle: {
+              color: 'red'
+            },
+            lineStyle: {
+              color: '#43ede3',
+              width: 2,
+            },
+            
+            data: this.twinkle8,
+          },
         ],
       }
       option.title.text = '人数变化和人工利润率变化分析'
@@ -1438,6 +1506,27 @@ let app = new Vue({
             },
             data: dataR6[1],
           },
+          {
+            yAxisIndex: 1,
+            type: 'effectScatter',
+            coordinateSystem: 'cartesian2d',
+            showEffectOn: 'render',
+            rippleEffect: {
+              period: 10,
+              scale: 4,
+              brushType: 'stroke'
+            },
+            hoverAnimation: true,
+            itemStyle: {
+              color: 'yellow'
+            },
+            lineStyle: {
+              color: '#43ede3',
+              width: 2,
+            },
+            
+            data: this.twinkleR6,
+          },
         ],
       }
       option.title.text = '各三级企业利润与薪酬变动情况'

+ 90 - 1
manpower/js/index4.js

@@ -4,6 +4,9 @@ let app = new Vue({
   el: '#app',
   data() {
     return {
+      twinkle7: [],
+      twinkle8: [],
+      twinkleR6: [],
       showTip: false,
       tipNum: '',
       time: '',
@@ -139,6 +142,31 @@ let app = new Vue({
       },
     }
   },
+  beforeMount(){
+    dataL7[0].forEach((item,index) => {
+      if(dataL7[1][index] < 0 &&  dataL7[0][index] > 0){
+        let obj = {value:[companyList[index].name ,dataL7[0][index]],symbolSize:15 }
+        this.twinkle7.push(obj)
+      }
+    })
+    //  if (dataL8[1][params.dataIndex] < 0 && params.value > 0) {
+      dataL8[0].forEach((item,index) => {
+        if(dataL8[1][index] < 0 &&  dataL8[0][index] > 0){
+          let obj = {value:[companyList[index].name ,dataL8[0][index]],symbolSize:15 }
+          this.twinkle8.push(obj)
+        }
+      })
+      //params.value > 0 && dataR6[0][params.dataIndex] < 0
+      // params.value > 0 && fjxdataL2[0][params.dataIndex] < 0
+      dataR6[0].forEach((item,index) => {
+        if(dataR6[1][index] > 0 &&  dataR6[0][index] < 0){
+          let obj = {value:[companyList[index].name ,dataR6[1][index]],symbolSize:15 }
+          this.twinkleR6.push(obj)
+        }
+      })
+      
+    console.log(this.twinkleR6)
+  },
   mounted() {
     this.time = formatDate()
     this.timer = setInterval(() => {
@@ -367,7 +395,7 @@ let app = new Vue({
                   },
                   {
                     offset: 1,
-                    color: '#082550',
+                    color: '#69c0ff',
                   },
                 ]),
               },
@@ -584,6 +612,26 @@ let app = new Vue({
             },
             data: dataL7[1],
           },
+          {
+            type: 'effectScatter',
+            coordinateSystem: 'cartesian2d',
+            showEffectOn: 'render',
+            rippleEffect: {
+              period: 10,
+              scale: 4,
+              brushType: 'stroke'
+            },
+            hoverAnimation: true,
+            itemStyle: {
+              color: 'red'
+            },
+            lineStyle: {
+              color: '#43ede3',
+              width: 2,
+            },
+            
+            data: this.twinkle7,
+          },
         ],
       }
       option.title.text = '人数变化和全员劳动生产率变化率分析'
@@ -684,6 +732,26 @@ let app = new Vue({
             },
             data: dataL8[1],
           },
+          {
+            type: 'effectScatter',
+            coordinateSystem: 'cartesian2d',
+            showEffectOn: 'render',
+            rippleEffect: {
+              period: 10,
+              scale: 4,
+              brushType: 'stroke'
+            },
+            hoverAnimation: true,
+            itemStyle: {
+              color: 'red'
+            },
+            lineStyle: {
+              color: '#43ede3',
+              width: 2,
+            },
+            
+            data: this.twinkle8,
+          },
         ],
       }
       option.title.text = '人数变化和人工利润率变化分析'
@@ -1415,6 +1483,27 @@ let app = new Vue({
             },
             data: dataR6[1],
           },
+          {
+            yAxisIndex: 1,
+            type: 'effectScatter',
+            coordinateSystem: 'cartesian2d',
+            showEffectOn: 'render',
+            rippleEffect: {
+              period: 10,
+              scale: 4,
+              brushType: 'stroke'
+            },
+            hoverAnimation: true,
+            itemStyle: {
+              color: 'yellow'
+            },
+            lineStyle: {
+              color: '#43ede3',
+              width: 2,
+            },
+            
+            data: this.twinkleR6,
+          },
         ],
       }
 

+ 1 - 1
manpower/js/li.js

@@ -4,7 +4,7 @@ const dataR1 = [
 ]
 const dataR2 = [
   [1, 1, 5, 1, 1, 4, 2, 6, 3, 0, 7, 5, 1, 1, 4, 1, 1, 3],
-  [0, 2290, 1884, 0, 34, 339, 0, 231, 93, 0, 511, 0, 9, 12, 85, 508, 61, 82],
+  [0, 2290, 1884, 0, 34, 339, 6, 231, 93, 0, 511, 0, 9, 12, 85, 508, 61, 82],
 ]
 const dataR3 = [
   [3006606.00, 3262765.00, 751436.00, 1020038.00, 110320.00, 30198.00, -4547.00, 77807.00, 23356.00, -31785.00, 125604.00, -30488.00, 432926.00, 1032546.00, 51752.00, 73106.00, -10784.00, 672.00],

+ 4 - 4
manpower/styles/index.css

@@ -96,7 +96,7 @@ a {
   background-size: 100% 100%;
   text-align: center;
   font-weight: bold;
-  font-size: 56px;
+  font-size: 60px;
   font-weight: 600;
 }
 .my-header span {
@@ -234,7 +234,7 @@ a {
   background-size: 100% 100%;
 }
 .panel-title .text {
-  font-size: 22px;
+  font-size: 32px;
   font-weight: 600;
   color: #daf9ff;
 }
@@ -335,12 +335,12 @@ a {
   margin-left: 10px;
 }
 .dv-scroll-board .header {
-  font-size: 18px !important;
+  font-size: 24px !important;
   font-weight: 600 !important;
   background-color: rgba(105, 192, 255, 0.1) !important;
 }
 .dv-scroll-board .rows .row-item {
-  font-size: 18px !important;
+  font-size: 22px !important;
 }
 .tip-window {
   margin-right: 50px;