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

投资首页替换真数据

liyongyong 1 year ago
parent
c5ca32ff0a
commit
414f0c9fca
4 changed files with 168 additions and 145 deletions
Unified View Show Diff Stats
  1. 3 2
      investment/investHome.html
  2. 103 0
      investment/js/data.js
  3. 61 142
      investment/js/investHome.js
  4. 1 1
      investment/styles/investHome.css

+ 3 - 2
investment/investHome.html
View File 

@@ -15,12 +15,13 @@
 
     <script src="./libs/element-ui@2.15.9.js"></script>
 
     <script src="./libs/element-ui@2.15.9.js"></script>
 
     <script src="./libs/axios.min.js"></script>
 
     <script src="./libs/axios.min.js"></script>
 
     <script src="./js/request.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/vue-seamless-scroll.min.js"></script>
 
     <script src="./libs/echarts-tooltip-carousel.js"></script>
 
     <script src="./libs/echarts-tooltip-carousel.js"></script>
 
   </head>
 
   </head>
 
   <body>
 
   <body>
 
     <div id="app">
 
     <div id="app">
 
-      <!-- <dv-full-screen-container> -->
 
+      <dv-full-screen-container>
 
         <header class="my-header">
 
         <header class="my-header">
 
           <span>投资管理数智中心</span>
 
           <span>投资管理数智中心</span>
 
           <span class="right">{{time}}</span>
 
           <span class="right">{{time}}</span>
 
@@ -199,7 +200,7 @@
 
         <!-- <div class="footer">
 
         <!-- <div class="footer">
 
           <a class="item" v-for="(item,index) in companyList" :key="index">{{item.name}}</a>
 
           <a class="item" v-for="(item,index) in companyList" :key="index">{{item.name}}</a>
 
         </div> -->
 
         </div> -->
 
-      <!-- </dv-full-screen-container> -->
 
+      </dv-full-screen-container>
 
     </div>
 
     </div>
 
     <script src="./js/investHome.js"></script>
 
     <script src="./js/investHome.js"></script>
 
   </body>
 
   </body>

+ 103 - 0
investment/js/data.js
View File 

@@ -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: '决策完成' }
 
+]

+ 61 - 142
investment/js/investHome.js
View File 

@@ -11,24 +11,7 @@ let app = new Vue({
 
         number: [100],
 
         number: [100],
 
         content: '{nt}个',
 
         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: [
 
       companyList: [
 
         { name: '山西焦煤' },
 
         { name: '山西焦煤' },
 
         { name: '晋能控股' },
 
         { name: '晋能控股' },
 
@@ -49,36 +32,7 @@ let app = new Vue({
 
         { name: '水控集团' },
 
         { name: '水控集团' },
 
         { 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,
 
       amountTotal: 0,
 
       classOption: {
 
       classOption: {
 
         step: 0.5
 
         step: 0.5
 
@@ -100,11 +54,14 @@ let app = new Vue({
 
     }
 
     }
 
   },
 
   },
 
   mounted () {
 
   mounted () {
 
-    // 左侧图表
 
-    this.initChartL1()
 
-    this.initChartL2()
 
-    this.initChartR1()
 
-    this.initChinaChart()
 
+    setTimeout(() => {
 
+      // 左侧图表
 
+      this.initChartL1()
 
+      this.initChartL2()
 
+      this.initChartR1()
 
+      this.initChinaChart()
 
+      this.initProjectList()
 
+    },0)
 
   },
 
   },
 
   methods: {
 
   methods: {
 
     numFormat (value) {
 
     numFormat (value) {
 
@@ -583,7 +540,7 @@ let app = new Vue({
 
         tooltip: {
 
         tooltip: {
 
           trigger: 'item',
 
           trigger: 'item',
 
         },
 
         },
 
-        color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3'],
 
+        color: ['#6682f5', '#69c0ff', '#43ede3','#8ba2ff'],
 
         legend: {
 
         legend: {
 
           top: 'center',
 
           top: 'center',
 
           orient: 'vertical',
 
           orient: 'vertical',
 
@@ -604,12 +561,7 @@ let app = new Vue({
 
                 },
 
                 },
 
               },
 
               },
 
             },
 
             },
 
-            data: [
 
-              { value: 1048, name: '煤炭' },
 
-              { value: 735, name: '火电' },
 
-              { value: 580, name: '焦化' },
 
-              { value: 484, name: '风电' },
 
-            ],
 
+            data: statusList,
 
           },
 
           },
 
         ],
 
         ],
 
       }
 
       }
 
@@ -632,7 +584,7 @@ let app = new Vue({
 
           top: '16%',
 
           top: '16%',
 
           right: '3%',
 
           right: '3%',
 
           left: '10%',
 
           left: '10%',
 
-          bottom: '22%',
 
+          bottom: '23%',
 
         },
 
         },
 
         legend: {
 
         legend: {
 
           top: '1',
 
           top: '1',
 
@@ -642,27 +594,7 @@ let app = new Vue({
 
           },
 
           },
 
         },
 
         },
 
         xAxis: {
 
         xAxis: {
 
-          data: [
 
-            '家寨水控',
 
-            '山西建设',
 
-            '华新燃气',
 
-            '国际能源',
 
-            '汾酒集团',
 
-            '大地控股',
 
-            '晋能控股',
 
-            '华远陆港',
 
-            '山西焦煤',
 
-            '潞安化工',
 
-            '华阳新材',
 
-            '太重集团',
 
-            '文旅集团',
 
-            '航产集团',
 
-            '华舰体育',
 
-            '神农科技',
 
-            '云时代',
 
-            '山西交控'
 
-
 
-          ],
 
+          data: executeList.map(item=>item.name),
 
           axisLine: {
 
           axisLine: {
 
             show: true, //隐藏X轴轴线
 
             show: true, //隐藏X轴轴线
 
             lineStyle: {
 
             lineStyle: {
 
@@ -675,7 +607,7 @@ let app = new Vue({
 
           },
 
           },
 
           axisLabel: {
 
           axisLabel: {
 
             show: true,
 
             show: true,
 
-            rotate: 50,
 
+            rotate: 40,
 
             textStyle: {
 
             textStyle: {
 
               color: 'rgba(255,255,255,0.6)', //X轴文字颜色
 
               color: 'rgba(255,255,255,0.6)', //X轴文字颜色
 
             },
 
             },
 
@@ -727,26 +659,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: '实际投资',
 
             name: '实际投资',
 
@@ -766,26 +679,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),
 
           },
 
           },
 
         ],
 
         ],
 
       }
 
       }
 
@@ -800,7 +694,7 @@ let app = new Vue({
 
       let option = {
 
       let option = {
 
         tooltip: {
 
         tooltip: {
 
           trigger: 'axis',
 
           trigger: 'axis',
 
-          formatter: '{a0}：{c0}' + '<br/>' + '{a1}：{c1}' + '%',
 
+          formatter: '{a0}：{c0}' + '亿元' + '<br/>' + '{a1}：{c1}' + '%',
 
           axisPointer: {
 
           axisPointer: {
 
             type: 'cross',
 
             type: 'cross',
 
           },
 
           },
 
@@ -809,7 +703,7 @@ let app = new Vue({
 
           top: '16%',
 
           top: '16%',
 
           right: '10%',
 
           right: '10%',
 
           left: '10%',
 
           left: '10%',
 
-          bottom: '15%',
 
+          bottom: '10%',
 
         },
 
         },
 
         legend: {
 
         legend: {
 
           top: '1',
 
           top: '1',
 
@@ -818,7 +712,7 @@ let app = new Vue({
 
           },
 
           },
 
         },
 
         },
 
         xAxis: {
 
         xAxis: {
 
-          data: ['煤炭', '火电', '焦化', '物流贸易', '文旅康养', '水务', '生物', '冶金', '建材'],
 
+          data: industryList.map(item=> item.name),
 
           axisLine: {
 
           axisLine: {
 
             show: true, //隐藏X轴轴线
 
             show: true, //隐藏X轴轴线
 
             lineStyle: {
 
             lineStyle: {
 
@@ -831,7 +725,7 @@ let app = new Vue({
 
           },
 
           },
 
           axisLabel: {
 
           axisLabel: {
 
             show: true,
 
             show: true,
 
-            rotate: 20,
 
+            // rotate: 20,
 
             textStyle: {
 
             textStyle: {
 
               color: 'rgba(255,255,255,0.6)', //X轴文字颜色
 
               color: 'rgba(255,255,255,0.6)', //X轴文字颜色
 
             },
 
             },
 
@@ -866,15 +760,11 @@ let app = new Vue({
 
           },
 
           },
 
           {
 
           {
 
             type: 'value',
 
             type: 'value',
 
-            name: '',
 
-            nameTextStyle: {
 
-              color: 'rgba(255,255,255,0.6)',
 
-            },
 
             axisLine: {
 
             axisLine: {
 
               show: false,
 
               show: false,
 
-              lineStyle: {
 
-                color: '#3D7495',
 
-              },
 
+            },
 
+            splitLine: {
 
+              show: false,
 
             },
 
             },
 
             axisLabel: {
 
             axisLabel: {
 
               show: true,
 
               show: true,
 
@@ -888,7 +778,7 @@ let app = new Vue({
 
         series: [
 
         series: [
 
           {
 
           {
 
             type: 'bar',
 
             type: 'bar',
 
-            name: '柱形数据',
 
+            name: '投资金额',
 
             barWidth: 15,
 
             barWidth: 15,
 
             itemStyle: {
 
             itemStyle: {
 
               normal: {
 
               normal: {
 
@@ -904,19 +794,31 @@ let app = new Vue({
 
                 ]),
 
                 ]),
 
               },
 
               },
 
             },
 
             },
 
-            data: [900, 600, 500, 450, 500, 900, 600, 500, 450],
 
+            data: industryList.map(item=> item.value),
 
           },
 
           },
 
           {
 
           {
 
             type: 'line',
 
             type: 'line',
 
-            name: '折线数据',
 
-            barWidth: 15,
 
+            name: '投资占比',
 
+            type: 'line',
 
             yAxisIndex: 1,
 
             yAxisIndex: 1,
 
+            smooth: true, //平滑曲线显示
 
+            showAllSymbol: true, //显示所有图形。
 
+            symbol: 'circle', //标记的图形为实心圆
 
+            symbolSize: 4, //标记的大小
 
+            smooth: false,
 
             itemStyle: {
 
             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),
 
           },
 
           },
 
         ],
 
         ],
 
       }
 
       }
 
@@ -926,5 +828,22 @@ let app = new Vue({
 
         loopSeries: true,
 
         loopSeries: true,
 
       })
 
       })
 
     },
 
     },
 
+    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,
 
+      }
 
+    }
 
   },
 
   },
 
 })
 
 })

+ 1 - 1
investment/styles/investHome.css
View File 

@@ -207,7 +207,7 @@ a {
 
   background-size: 100% 100%;
 
   background-size: 100% 100%;
 
 }
 
 }
 
 .my-panel .content {
 
 .my-panel .content {
 
-  height: calc(100% - 60px);
 
+  height: calc(28vh - 60px);
 
 }
 
 }
 
 .panel-title {
 
 .panel-title {
 
   position: relative;
 
   position: relative;