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

修改冲突

l1448442195@163.com 1 year ago
parent
148a0614c9 d1d6af9835
commit
e30f987177
11 changed files with 424 additions and 173 deletions
Split View Show Diff Stats
  1. BIN
      investment/images/left-arrow.png
  2. BIN
      investment/images/page-bg2.png
  3. BIN
      investment/images/title-left2.png
  4. BIN
      investment/images/title-right2.png
  5. 7 6
      investment/investHome.html
  6. 35 36
      investment/investHome2.html
  7. 1 1
      investment/investHome2compound.html
  8. 108 16
      investment/js/investHome.js
  9. 163 67
      investment/js/investHome2.js
  10. 21 21
      investment/js/investHomeChild.js
  11. 89 26
      investment/styles/investHome2.css

BIN
investment/images/left-arrow.png
View File


BIN
investment/images/page-bg2.png
View File


BIN
investment/images/title-left2.png
View File


BIN
investment/images/title-right2.png
View File


+ 7 - 6
investment/investHome.html
View File 

@@ -13,7 +13,7 @@
 
   <script src="./libs/vue@2.7.10.js"></script>
 
   <script src="./libs/datav.min.js"></script>
 
   <script src="./libs/echarts.min2.js"></script>
 
-  <script src="./libs/echarts-gl.min.js"></script>
 
+  <!-- <script src="./libs/echarts-gl.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>
 
@@ -167,10 +167,11 @@
 
           <dv-border-box-8 :dur="11">
 
             <div class="my-panel">
 
               <div class="panel-title">
 
-                <span class="text">投资额度分析</span>
 
+                <span class="text">投资阶段分析</span>
 
               </div>
 
-              <div class="content">
 
-                <vue-seamless-scroll :data="amountList" :class-option="classOption" class="warp">
 
+              <div ref="echartR2" class="content"></div>
 
+               <!-- <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>
 
@@ -182,8 +183,8 @@
 
                       <span class="value">{{item.value}}亿</span>
 
                     </li>
 
                   </ul>
 
-                </vue-seamless-scroll>
 
-              </div>
 
+                </vue-seamless-scroll> 
+              </div>-->
 
             </div>
 
           </dv-border-box-8>
 
           <dv-border-box-8 :dur="12">

+ 35 - 36
investment/investHome2.html
View File 

@@ -18,13 +18,19 @@
 
   <script src="./js/request.js"></script>
 
   <script src="./libs/echarts-liquidfill.min.js"></script>
 
   <script src="./libs/echarts-tooltip-carousel.js"></script>
 
+  <!-- 轮播 -->
 
+  <link rel="stylesheet" href="https://unpkg.com/swiper@8/swiper-bundle.css" />
 
+  <link rel="stylesheet" href="https://unpkg.com/swiper@8/swiper-bundle.min.css" />
 
+  <script src="https://unpkg.com/swiper@8/swiper-bundle.js"></script>
 
+  <script src="https://unpkg.com/swiper@8/swiper-bundle.min.js"></script>
 
+  <script src="https://unpkg.com/swiper@8/swiper-bundle.min.js.map"></script>
 
 </head>
 
 
 <body>
 
   <div id="app">
 
     <dv-full-screen-container>
 
       <header class="my-header">
 
-        <span>数智化投资管理驾驶舱</span>
 
+        <span>数智化投前管理驾驶舱</span>
 
         <span class="right">{{time}}</span>
 
       </header>
 
       <div class="main">
 
@@ -32,58 +38,51 @@
 
           <dv-border-box-8 :dur="10" style="flex: 1; margin-bottom: 10px;">
 
             <div class="title">
 
               <span class="text">投资额度分析</span>
 
-              <span class="tip-window">2023年</span>
 
+              <!-- <span class="tip-window">2023年</span> -->
 
             </div>
 
             <div class="content">
 
               <div class="content-left" style="flex-wrap: wrap;">
 
-                <div class="topChange0">
 
-                  <div>山西焦煤</div>
 
-                  <img src="./images/foot-back.png" style="width:100%;height:auto" alt="">
 
-                </div>
 
-                <div class="topChange1">
 
-                  <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 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">
 
-                    <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 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">
 
-                    <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 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">
 
-                    <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 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" class="topChange2" style="width: 100%; height: 100%;"></div>
 
-                <div class="jt"></div>
 
+                <div ref="echartL2" style="width: 100%; height: 100%;"></div>
 
               </div>
 
             </div>
 
           </dv-border-box-8>
 
           <dv-border-box-8 :dur="10" style="flex: 1; margin-bottom: 10px;">
 
             <div class="title">
 
               <span class="text">企业额度分析</span>
 
-              <span class="tip-window">2023年</span>
 
+              <!-- <span class="tip-window">2023年</span> -->
 
             </div>
 
             <div class="content">
 
-              <div id="echartL1" style="width: 100%; height: 100%"></div>
 
+              <div id="echartL1" style="width: 100%; height: 100%; background-color: #05183c;"></div>
 
             </div>
 
           </dv-border-box-8>
 
           <dv-border-box-8 :dur="10" style="flex: 1;">
 
@@ -104,7 +103,7 @@
 
           <dv-border-box-8 :dur="10" style="flex: 1; margin-bottom: 10px;">
 
             <div class="title">
 
               <span class="text">投资计划分析</span>
 
-              <span class="tip-window">2023年</span>
 
+              <!-- <span class="tip-window">2023年</span> -->
 
             </div>
 
             <div class="content">
 
               <div class="content-left">

+ 1 - 1
investment/investHome2compound.html
View File 

@@ -12,7 +12,7 @@
 
   <!-- 引入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/echarts.min2.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>

+ 108 - 16
investment/js/investHome.js
View File 

@@ -67,6 +67,7 @@ let app = new Vue({
 
       this.initChartL1()
 
       this.initChartL2()
 
       this.initChartR1()
 
+      this.initChartR2()
 
       this.initChinaChart()
 
       this.initProjectList()
 
     }, 0)
 
@@ -692,7 +693,7 @@ let app = new Vue({
 
             show: true,
 
             rotate: 40,
 
             textStyle: {
 
-              color: 'rgba(255,255,255,0.6)', //X轴文字颜色
 
+              color: '#fff',//'rgba(255,255,255,0.6)', //X轴文字颜色
 
             },
 
           },
 
         },
 
@@ -824,7 +825,7 @@ let app = new Vue({
 
             show: true,
 
             rotate: 30,
 
             textStyle: {
 
-              color: 'rgba(255,255,255,0.6)', //X轴文字颜色
 
+              color: '#fff'//color: 'rgba(255,255,255,0.6)', //X轴文字颜色
 
             },
 
           },
 
         },
 
@@ -980,7 +981,7 @@ let app = new Vue({
 
             show: true,
 
             rotate: 30,
 
             textStyle: {
 
-              color: 'rgba(255,255,255,0.6)', //X轴文字颜色
 
+              color: '#fff'//color: 'rgba(255,255,255,0.6)', //X轴文字颜色
 
             },
 
           },
 
         },
 
@@ -1491,6 +1492,7 @@ let app = new Vue({
 
       let option = {
 
         tooltip: {
 
           trigger: 'item',
 
+          position: ['65%', '42%'],
 
           formatter: params => {
 
             return `<span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${params.color}"></span> ${params.name}：${params.value} <br/><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${params.color}"></span> 投资占比：${params.percent}%`
 
           },  //+ '<br/>'+ '{a1}：{c1}' + '%',
 
@@ -1500,8 +1502,9 @@ let app = new Vue({
 
         },
 
         color: ['#6682f5', '#69c0ff', '#43ede3', '#8ba2ff'],
 
         legend: {
 
-          top: '2%',
 
-          //orient: 'vertical',
 
+          left: '2%',
 
+          bottom: '2%',
 
+          orient: 'vertical',
 
           //right: '2%',
 
           textStyle: {
 
             color: '#9DB9EB',
 
@@ -1536,7 +1539,10 @@ let app = new Vue({
 
             name: '',
 
             type: 'pie',
 
             radius: ['50%', '75%'],
 
-            center: ["50%", "57%"],
 
+            center: ["45%", "50%"],
 
+            label:{
 
+              show: false,
 
+            },
 
             itemStyle: {
 
               normal: {
 
                 borderColor: 'rgba(1,31,64,0.7)',
 
@@ -1544,11 +1550,7 @@ let app = new Vue({
 
               }
 
             },
 
             labelLine: {
 
-              normal: {
 
-                lineStyle: {
 
-                  width: 1,
 
-                },
 
-              },
 
+              show: false,
 
             },
 
             data: industryList,
 
           },
 
@@ -1607,7 +1609,7 @@ let app = new Vue({
 
             show: true,
 
             rotate: 40,
 
             textStyle: {
 
-              color: 'rgba(255,255,255,0.6)', //X轴文字颜色
 
+              color: '#fff',//'rgba(255,255,255,0.6)', //X轴文字颜色
 
             },
 
           },
 
         },
 
@@ -1725,7 +1727,7 @@ let app = new Vue({
 
             show: true,
 
             rotate: 20,
 
             textStyle: {
 
-              color: 'rgba(255,255,255,0.6)', //X轴文字颜色
 
+              color: '#fff',//'rgba(255,255,255,0.6)', //X轴文字颜色
 
             },
 
           },
 
         },
 
@@ -1802,19 +1804,109 @@ let app = new Vue({
 
         loopSeries: true,
 
       })
 
     },
 
+
 
+    initChartR2() {
 
+      let myChart = echarts.init(this.$refs['echartR2'])
 
+      let option = {
 
+        tooltip: {
 
+          trigger: 'item',
 
+          position: ['65%', '42%'],
 
+          formatter: params => {
 
+            return `<span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${params.color}"></span> ${params.name}：${params.value} <br/><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${params.color}"></span> 投资占比：${params.percent}%`
 
+          },  //+ '<br/>'+ '{a1}：{c1}' + '%',
 
+          axisPointer: {
 
+            type: 'cross',
 
+          },
 
+        },
 
+        color: ['#6682f5', '#69c0ff', '#43ede3', '#8ba2ff'],
 
+        legend: {
 
+          left: '2%',
 
+          bottom: '2%',
 
+          orient: 'vertical',
 
+          //right: '2%',
 
+          textStyle: {
 
+            color: '#9DB9EB',
 
+          },
 
+        },
 
+        series: [
 
+
 
+          // {
 
+          //   hoverOffset: 0,
 
+          //   startAngle: 90,
 
+          //   type: "pie",
 
+          //   radius: [48, 55],
 
+          //   center: ["50%", "50%"],
 
+          //   itemStyle: {
 
+          //     normal: {
 
+          //         borderColor: 'rgba(1,31,6,0.7)',
 
+          //         borderWidth: 4
 
+          //     }
 
+          //   },
 
+          //   tooltip: {
 
+          //     show: false
 
+          //   },
 
+          //   labelLine: {
 
+          //     show: false
 
+          //   },
 
+          //   label: {
 
+          //     show: false
 
+          //   },
 
+          //   data: industryList
 
+          // },
 
+          {
 
+            name: '',
 
+            type: 'pie',
 
+            radius: ['50%', '75%'],
 
+            center: ["45%", "50%"],
 
+            label:{
 
+              show: false,
 
+            },
 
+            itemStyle: {
 
+              normal: {
 
+                borderColor: 'rgba(1,31,64,0.7)',
 
+                borderWidth: 6
 
+              }
 
+            },
 
+            labelLine: {
 
+              show: false,
 
+            },
 
+            data: industryList,
 
+          },
 
+        ],
 
+      }
 
+      let that = this
 
+      myChart.on('click', function (param) {
 
+        console.log(param)
 
+        if (param.name == '战略新兴产业投资') {
 
+          that.tipTitle2 = param.name
 
+          that.showTip2 = true
 
+        }
 
+
 
+      })
 
+      myChart.setOption(option)
 
+      tools.loopShowTooltip(myChart, option, {
 
+        nterval: 2000,
 
+        loopSeries: true,
 
+      })
 
+      myChart.setOption(option)
 
+      tools.loopShowTooltip(myChart, option, {
 
+        nterval: 2000,
 
+        loopSeries: true,
 
+      })
 
+    },
 
     initProjectList() {
 
       let dataList = []
 
       projectList.map(item => {
 
-        dataList.push([item.name, item.office, item.value + '亿'])
 
+        dataList.push([item.office,item.name,  item.value + '亿'])
 
       })
 
       this.storageRecordConfig = {
 
-        header: ['项目名称', '企业集团', '投资金额'],
 
+        header: ['企业集团', '项目名称',  '投资金额'],
 
         headerBGC: '#05507b33',
 
         oddRowBGC: '#05507b33',
 
         evenRowBGC: '',
 
         headerHeight: '40',
 
         rowNum: 5,
 
-        columnWidth: [350],
 
+        columnWidth: [100, 350],
 
         align: ['center', 'center', 'center'],
 
         data: dataList,
 
       }

+ 163 - 67
investment/js/investHome2.js
View File 

@@ -13,10 +13,15 @@ let app = new Vue({
 
         content: '{nt}个',
 
       },
 
       storageRecordConfig: {
 
-        header: ['项目名称', '所属企业', '总投资额'],
 
+        // waitTime: '2000000',
 
+        header: ['企业集团', '项目名称 ', '投资总额'],
 
+        // headerBGC: '#05507b33',
 
+        // oddRowBGC: '#05507b33',
 
+        // evenRowBGC: '#05507b33',
 
+        headerBGC: '#05183c',
 
         headerBGC: '#05507b33',
 
-        oddRowBGC: '#05507b33',
 
-        evenRowBGC: '',
 
+        oddRowBGC: '#05183c',
 
+        evenRowBGC: '#05183c',
 
         rowNum: 4,
 
         align: ['center'],
 
         data: [
 
@@ -79,6 +84,21 @@ let app = new Vue({
 
       this.initChartR3()
 
       this.initChartR6()
 
     },)
 
+    setTimeout(() => {
 
+      var swiper = new Swiper(".mySwiper", {
 
+        pagination: {
 
+          el: ".swiper-pagination",
 
+          type: "progressbar",
 
+        },
 
+        navigation: {
 
+          nextEl: ".swiper-button-next",
 
+          prevEl: ".swiper-button-prev",
 
+        },
 
+      });
 
+      swiper.el.onmouseout = function () {
 
+        swiper.autoplay.start();
 
+      }
 
+    })
 
   },
 
   methods: {
 
     convertData (data) {
 
@@ -570,7 +590,7 @@ let app = new Vue({
 
           },
 
         },
 
         yAxis: {
 
-          // name: '亿元',
 
+          name: '亿元',
 
           nameTextStyle: {//y轴上方单位的颜色
 
             color: '#fff',
 
           },
 
@@ -690,7 +710,7 @@ let app = new Vue({
 
         title: [
 
           {
 
             text: '450.12亿',
 
-            x: '38%',
 
+            x: '33%',
 
             y: '80%',
 
             textStyle: {
 
               fontSize: 24,
 
@@ -757,15 +777,16 @@ let app = new Vue({
 
       let option = {
 
         tooltip: {
 
           trigger: 'axis',
 
+          formatter: '指标：' + '{c0}' + '<br/>' + '发展线：' + '{c1}' + '<br/>' + '生存线：' + '{c2}',  //+ '<br/>'+ '{a1}：{c1}' + '%',
 
           axisPointer: {
 
             type: 'shadow',
 
           },
 
         },
 
         grid: {
 
-          top: '22%',
 
+          top: '10%',
 
           right: '5%',
 
           left: '10%',
 
-          bottom: '25%',
 
+          bottom: '15%',
 
         },
 
         xAxis: {
 
           data: ['总投资收益率', '销售利润率', '成本费用利润率', '总资产周转率', '财务内部收益率'],
 
@@ -834,48 +855,88 @@ let app = new Vue({
 
               },
 
             },
 
             data: [10, 20, 30, 40, 50],
 
-            markLine: {
 
-              symbol: ['none', 'none'],
 
-              data: [
 
-                {
 
-                  name: '生存线',
 
-                  yAxis: 10,
 
-                  lineStyle: {
 
-                    color: '#FF8F0A',
 
+            // 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],
 
+            //   },
 
+            // },
 
+          },
 
+          {
 
+            name: '',
 
+            type: 'line',
 
+            barWidth: 15,
 
+            itemStyle: {
 
+              normal: {
 
+                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
+                  {
 
+                    offset: 0,
 
+                    color: '#69c0ff',
 
                   },
 
-                  label: {
 
-                    formatter: '{b}',
 
-                    position: 'middle',
 
-                    color: '#FF8F0A',
 
-                    fontSize: 12,
 
+                  {
 
+                    offset: 1,
 
+                    color: 'green',
 
                   },
 
-                },
 
-                {
 
-                  name: '发展线',
 
-                  yAxis: 15,
 
-                  lineStyle: {
 
-                    color: '#00EEA2',
 
+                ]),
 
+              },
 
+            },
 
+            data: [20, 30, 15, 28, 36],
 
+          },
 
+          {
 
+            name: '',
 
+            type: 'line',
 
+            barWidth: 15,
 
+            itemStyle: {
 
+              normal: {
 
+                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
 
+                  {
 
+                    offset: 0,
 
+                    color: '#69c0ff',
 
                   },
 
-                  label: {
 
-                    formatter: '{b}',
 
-                    position: 'middle',
 
-                    color: '#00EEA2',
 
-                    fontSize: 12,
 
+                  {
 
+                    offset: 1,
 
+                    color: 'yellow',
 
                   },
 
-                },
 
-              ],
 
-              label: {
 
-                distance: [50, 0],
 
+                ]),
 
               },
 
             },
 
+            data: [15, 22, 17, 33, 14],
 
           },
 
         ],
 
       }
 
       myChart.setOption(option)
 
-      tools.loopShowTooltip(myChart, option, {
 
-        nterval: 2000,
 
-        loopSeries: true,
 
-      })
 
+      // tools.loopShowTooltip(myChart, option, {
 
+      //   nterval: 2000,
 
+      //   loopSeries: true,
 
+      // })
 
     },
 
     initChartL4 () {
 
       let myChart = echarts.init(this.$refs['echartL4'])
 
@@ -891,26 +952,33 @@ let app = new Vue({
 
         },
 
         tooltip: {
 
           trigger: 'item',
 
+          formatter: '{b}' + '：' + '{c}' + '<br/>' + '占比：' + '{d}%',
 
+          // position: ['30%', '87%'],
 
         },
 
         color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3'],
 
         legend: {
 
-          show: false,
 
+          orient: 'horizontal',
 
+          show: true,
 
           icon: 'circle',
 
           top: 'bottom',
 
           orient: 'vertical',
 
-          right: '1%',
 
+          right: '-3%',
 
           textStyle: {
 
             color: '#9DB9EB',
 
+            fontSize: '10px'
 
           },
 
         },
 
         series: [
 
           {
 
             name: '',
 
             type: 'pie',
 
-            radius: ['0%', '70%'],
 
-            center: ['50%', '60%'],
 
+            // radius: ['0%', '70%'],
 
+            radius: ['40%', '55%'],
 
+            center: ['45%', '55%'],
 
             itemStyle: {
 
               normal: {
 
+                borderColor: 'rgba(1,31,64,0.7)',
 
+                borderWidth: 6,
 
                 label: {
 
                   show: false,
 
                 },
 
@@ -948,26 +1016,32 @@ let app = new Vue({
 
         },
 
         tooltip: {
 
           trigger: 'item',
 
+          formatter: '{b}' + '：' + '{c}' + '<br/>' + '占比：' + '{d}%',
 
+          // position: ['30%', '87%'],
 
         },
 
         color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3'],
 
         legend: {
 
-          show: false,
 
+          show: true,
 
           icon: 'circle',
 
           top: 'bottom',
 
           orient: 'vertical',
 
-          right: '1%',
 
+          right: '-3%',
 
           textStyle: {
 
             color: '#9DB9EB',
 
+            fontSize: '10px'
 
           },
 
         },
 
         series: [
 
           {
 
             name: '',
 
             type: 'pie',
 
-            radius: ['0%', '70%'],
 
-            center: ['50%', '60%'],
 
+            // radius: ['0%', '70%'],
 
+            radius: ['40%', '55%'],
 
+            center: ['45%', '55%'],
 
             itemStyle: {
 
               normal: {
 
+                borderColor: 'rgba(1,31,64,0.7)',
 
+                borderWidth: 6,
 
                 label: {
 
                   show: false,
 
                 },
 
@@ -1004,26 +1078,32 @@ let app = new Vue({
 
         },
 
         tooltip: {
 
           trigger: 'item',
 
+          formatter: '{b}' + '：' + '{c}' + '<br/>' + '占比：' + '{d}%',
 
+          // position: ['30%', '87%'],
 
         },
 
         color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3'],
 
         legend: {
 
-          show: false,
 
+          show: true,
 
           icon: 'circle',
 
           top: 'bottom',
 
           orient: 'vertical',
 
-          right: '1%',
 
+          right: '-3%',
 
           textStyle: {
 
             color: '#9DB9EB',
 
+            fontSize: '10px'
 
           },
 
         },
 
         series: [
 
           {
 
             name: '',
 
             type: 'pie',
 
-            radius: ['0%', '70%'],
 
-            center: ['50%', '60%'],
 
+            // radius: ['0%', '70%'],
 
+            radius: ['40%', '55%'],
 
+            center: ['45%', '55%'],
 
             itemStyle: {
 
               normal: {
 
+                borderColor: 'rgba(1,31,64,0.7)',
 
+                borderWidth: 6,
 
                 label: {
 
                   show: false,
 
                 },
 
@@ -1060,26 +1140,32 @@ let app = new Vue({
 
         },
 
         tooltip: {
 
           trigger: 'item',
 
+          formatter: '{b}' + '：' + '{c}' + '<br/>' + '占比：' + '{d}%',
 
+          // position: ['30%', '87%'],
 
         },
 
         color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3'],
 
         legend: {
 
-          show: false,
 
+          show: true,
 
           icon: 'circle',
 
           top: 'bottom',
 
           orient: 'vertical',
 
-          right: '1%',
 
+          right: '-3%',
 
           textStyle: {
 
             color: '#9DB9EB',
 
+            fontSize: '10px'
 
           },
 
         },
 
         series: [
 
           {
 
             name: '',
 
             type: 'pie',
 
-            radius: ['0%', '70%'],
 
-            center: ['50%', '60%'],
 
+            // radius: ['0%', '70%'],
 
+            radius: ['40%', '55%'],
 
+            center: ['45%', '55%'],
 
             itemStyle: {
 
               normal: {
 
+                borderColor: 'rgba(1,31,64,0.7)',
 
+                borderWidth: 6,
 
                 label: {
 
                   show: false,
 
                 },
 
@@ -1264,7 +1350,7 @@ let app = new Vue({
 
       let myChart = echarts.init(this.$refs['echartR1'])
 
       let option = {
 
         title: {
 
-          text: '储备项目产业分布',
 
+          text: '产业类别分析',
 
           x: 'center',
 
           y: '87%',
 
           textStyle: {
 
@@ -1274,16 +1360,19 @@ let app = new Vue({
 
         },
 
         tooltip: {
 
           trigger: 'item',
 
+          formatter: '{b}' + '：' + '{c}' + '<br/>' + '占比：' + '{d}%',
 
+          // position: ['-5%', '95%'],
 
         },
 
         color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3'],
 
         legend: {
 
-          show: false,
 
+          show: true,
 
           icon: 'circle',
 
           top: 'bottom',
 
           orient: 'vertical',
 
-          right: '1%',
 
+          right: '-3%',
 
           textStyle: {
 
             color: '#9DB9EB',
 
+            fontSize: '10px'
 
           },
 
         },
 
         series: [
 
@@ -1294,6 +1383,8 @@ let app = new Vue({
 
             center: ['50%', '45%'],
 
             itemStyle: {
 
               normal: {
 
+                borderColor: 'rgba(1,31,64,0.7)',
 
+                borderWidth: 6,
 
                 label: {
 
                   show: false,
 
                 },
 
@@ -1321,7 +1412,7 @@ let app = new Vue({
 
       let myChart = echarts.init(this.$refs['echartR2'])
 
       let option = {
 
         title: {
 
-          text: '储备项目产业分布',
 
+          text: '项目阶段分析',
 
           x: 'center',
 
           y: '87%',
 
           textStyle: {
 
@@ -1331,16 +1422,19 @@ let app = new Vue({
 
         },
 
         tooltip: {
 
           trigger: 'item',
 
+          formatter: '{b}' + '：' + '{c}' + '<br/>' + '占比：' + '{d}%',
 
+          // position: ['-5%', '95%'],
 
         },
 
         color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3'],
 
         legend: {
 
-          show: false,
 
+          show: true,
 
           icon: 'circle',
 
           top: 'bottom',
 
           orient: 'vertical',
 
-          right: '1%',
 
+          right: '-3%',
 
           textStyle: {
 
             color: '#9DB9EB',
 
+            fontSize: '10px'
 
           },
 
         },
 
         series: [
 
@@ -1351,6 +1445,8 @@ let app = new Vue({
 
             center: ['50%', '45%'],
 
             itemStyle: {
 
               normal: {
 
+                borderColor: 'rgba(1,31,64,0.7)',
 
+                borderWidth: 6,
 
                 label: {
 
                   show: false,
 
                 },
 
@@ -1406,9 +1502,9 @@ let app = new Vue({
 
           }
 
         },
 
         grid: {
 
-          top: '25%',
 
+          top: '22%',
 
           right: '5%',
 
-          left: '15%',
 
+          left: '10%',
 
           bottom: '15%',
 
         },
 
         yAxis: {
 
@@ -1506,9 +1602,9 @@ let app = new Vue({
 
               }
 
             },
 
             data: [
 
-              ['项目储备', '备案', 200, 100],
 
+              ['项目储备', '备案', 1400, 100],
 
               ['项目立项', '备案', 1500, 90],
 
-              ['可研论证', '备案', 2500, 80],
 
+              ['可研论证', '备案', 500, 80],
 
               ['投资决策', '备案', 3000, 70],
 
             ]
 
           },
 
@@ -1624,9 +1720,9 @@ let app = new Vue({
 
               }
 
             },
 
             data: [
 
-              ['项目储备', '特别监管', 1400, 100],
 
+              ['项目储备', '特别监管', 200, 100],
 
               ['项目立项', '特别监管', 1500, 90],
 
-              ['可研论证', '特别监管', 500, 80],
 
+              ['可研论证', '特别监管', 2500, 80],
 
               ['投资决策', '特别监管', 3000, 70],
 
             ]
 
           },

+ 21 - 21
investment/js/investHomeChild.js
View File 

@@ -31,34 +31,34 @@ let app = new Vue({
 
         waitTime: 1000,
 
         header: ["项目名称", "所属组织", '实施主体', '产业类别I级', '产业类别II级', '2022年投资完成额（万元）'],
 
         data: [
 
-          ["6万吨/年PBAT项目", "华阳新材", "华阳生物降解公司", "战略性新兴产业", "新材料", "20340.00"],
 
-          ["2万吨/年生物降解改性材料及塑料制品项目", "华阳新材", "华阳生物降解公司", "战略性新兴产业", "新材料", "5270.00"],
 
-          ["2万吨/年全系列生物降解新材料项目", "华阳新材", "华阳新材", "战略性新兴产业", "新材料", "5560.00"],
 
+          ["6万吨/年PBAT项目", "华阳新材", "华阳生物降解公司", "战略性新兴产业", "新材料", "20,340.00"],
 
+          ["2万吨/年生物降解改性材料及塑料制品项目", "华阳新材", "华阳生物降解公司", "战略性新兴产业", "新材料", "5,270.00"],
 
+          ["2万吨/年全系列生物降解新材料项目", "华阳新材", "华阳新材", "战略性新兴产业", "新材料", "5,560.00"],
 
           ["开元煤层气发电项目", "华阳新材", "阳煤扬德公司", "战略性新兴产业", "煤层气", "880.00"],
 
           ["平舒翟下庄煤层气发电项目", "华阳新材", "阳煤扬德公司", "战略性新兴产业", "煤层气", "570.00"],
 
-          ["5GW高效光伏组件制造项目一期2GW", "华阳新材", "华储光电公司", "战略性新兴产业", "新能源", "10000.00"],
 
-          ["钠离子电池正极材料千吨级生产项目", "华阳新材", "华钠铜能公司", "战略性新兴产业", "新能源", "6060.00"],
 
-          ["钠离子电池负极材料千吨级生产项目", "华阳新材", "华钠碳能公司", "战略性新兴产业", "新能源", "4080.00"],
 
+          ["5GW高效光伏组件制造项目一期2GW", "华阳新材", "华储光电公司", "战略性新兴产业", "新能源", "10,000.00"],
 
+          ["钠离子电池正极材料千吨级生产项目", "华阳新材", "华钠铜能公司", "战略性新兴产业", "新能源", "6,060.00"],
 
+          ["钠离子电池负极材料千吨级生产项目", "华阳新材", "华钠碳能公司", "战略性新兴产业", "新能源", "4,080.00"],
 
           ["1GWh钠离子Pack电池生产线建设项目", "华阳新材", "华钠芯能公司", "战略性新兴产业", "新能源", "2790.00"],
 
           ["天成光储网充项目", "华阳新材", "新阳公司", "战略性新兴产业", "新能源", "1680.00"],
 
-          ["宏厦三建绿色建材工业园区项目", "华阳新材", "宏厦三建", "战略性新兴产业", "新材料", "2550.00"],
 
-          ["亚美公司超低排放改造及节能技改项目", "华阳新材", "亚美公司", "战略性新兴产业", "其他", "20101.00"],
 
-          ["超净滤材项目", "华阳新材", "华阳科创城", "战略性新兴产业", "新材料", "5510.00"],
 
+          ["宏厦三建绿色建材工业园区项目", "华阳新材", "宏厦三建", "战略性新兴产业", "新材料", "2,550.00"],
 
+          ["亚美公司超低排放改造及节能技改项目", "华阳新材", "亚美公司", "战略性新兴产业", "其他", "20,101.00"],
 
+          ["超净滤材项目", "华阳新材", "华阳科创城", "战略性新兴产业", "新材料", "5,510.00"],
 
           ["华阳集团网络安全工作顶层设计及整体整改项目", "华阳新材", "华阳集团", "战略性新兴产业", "新一代信息技术", "814.00"],
 
-          ["山西科技创新城阳煤设计研发中心项目", "华阳新材", "碳基合成新材料公司", "战略性新兴产业", "其他", "12930.00"],
 
-          ["阳煤西110kv变电站及线路建设工程", "华阳新材", "华阳股份", "战略性新兴产业", "其他", "7060.00"],
 
-          ["郊区35kV输变电工程", "华阳新材", "华储光电公司", "战略性新兴产业", "其他", "1250.00"],
 
-          ["环境保护及治理", "华阳新材", "华阳股份", "战略性新兴产业", "节能环保", "5890.00"],
 
-          ["增资山西新阳清洁能源有限公司", "华阳新材", "华阳股份", "战略性新兴产业", "新能源产业", "101700.00"],
 
-          ["增资阳煤集团纳谷（山西）气凝胶科创城管理有限责任公司", "华阳新材", "华阳集团", "战略性新兴产业", "新材料产业", "34582.00"],
 
-          ["太化集团普田农业有限公司股权收购及增资", "华阳新材", "华阳新材", "战略性新兴产业", "新材料产业", "7400.00"],
 
-          ["山西阳煤道得新材股权投资合伙企业（有限合伙）", "华阳新材", "华阳资本", "战略性新兴产业", "新材料产业", "5000.00"],
 
-          ["阳泉市梧桐树嘉裕阳煤智能制造股权投资合伙企业（有限合伙）", "华阳新材", "华阳资本华阳股份", "战略性新兴产业", "新材料产业", "6576.29"],
 
-          ["阳煤纳谷（山西）气凝胶经销有限责任公司", "华阳新材", "气凝胶科创城", "战略性新兴产业", "新材料产业", "4335.00"],
 
-          ["阳煤纳谷（山西）节能服务有限责任公司", "华阳新材", "气凝胶科创城", "战略性新兴产业", "新材料产业", "3674.00"],
 
+          ["山西科技创新城阳煤设计研发中心项目", "华阳新材", "碳基合成新材料公司", "战略性新兴产业", "其他", "12,930.00"],
 
+          ["阳煤西110kv变电站及线路建设工程", "华阳新材", "华阳股份", "战略性新兴产业", "其他", "7,060.00"],
 
+          ["郊区35kV输变电工程", "华阳新材", "华储光电公司", "战略性新兴产业", "其他", "1,250.00"],
 
+          ["环境保护及治理", "华阳新材", "华阳股份", "战略性新兴产业", "节能环保", "5,890.00"],
 
+          ["增资山西新阳清洁能源有限公司", "华阳新材", "华阳股份", "战略性新兴产业", "新能源产业", "101,700.00"],
 
+          ["增资阳煤集团纳谷（山西）气凝胶科创城管理有限责任公司", "华阳新材", "华阳集团", "战略性新兴产业", "新材料产业", "34,582.00"],
 
+          ["太化集团普田农业有限公司股权收购及增资", "华阳新材", "华阳新材", "战略性新兴产业", "新材料产业", "7,400.00"],
 
+          ["山西阳煤道得新材股权投资合伙企业（有限合伙）", "华阳新材", "华阳资本", "战略性新兴产业", "新材料产业", "5,000.00"],
 
+          ["阳泉市梧桐树嘉裕阳煤智能制造股权投资合伙企业（有限合伙）", "华阳新材", "华阳资本华阳股份", "战略性新兴产业", "新材料产业", "6,576.29"],
 
+          ["阳煤纳谷（山西）气凝胶经销有限责任公司", "华阳新材", "气凝胶科创城", "战略性新兴产业", "新材料产业", "4,335.00"],
 
+          ["阳煤纳谷（山西）节能服务有限责任公司", "华阳新材", "气凝胶科创城", "战略性新兴产业", "新材料产业", "3,674.00"],
 
           ["华阳诺爱特（山西）新材料科技有限公司", "华阳新材", "气凝胶科创城", "战略性新兴产业", "新材料产业", "500.00"],
 
           ["华阳纳谷（北京）新材料科技有限公司", "华阳新材", "气凝胶科创城", "战略性新兴产业", "新材料产业", "250.00"],
 
-          ["山西华储光电有限责任公司", "华阳新材", "山西新阳清洁能源有限公司", "战略性新兴产业", "新材料产业", "45000.00"],
 
+          ["山西华储光电有限责任公司", "华阳新材", "山西新阳清洁能源有限公司", "战略性新兴产业", "新材料产业", "45,000.00"],
 
           ["山西华钠铜能科技有限责任公司", "华阳新材", "山西新阳清洁能源有限公司", "战略性新兴产业", "新能源产业", "900.00"],
 
           ["山西华钠碳能科技有限责任公司", "华阳新材", "山西新阳清洁能源有限公司", "战略性新兴产业", "新能源产业", "450.00"]

+ 89 - 26
investment/styles/investHome2.css
View File 

@@ -103,7 +103,7 @@ a {
 
   padding: 15px;
 
   display: flex;
 
   height: calc(100vh - 25px);
 
-  background: url('../images/content-bg2.png') no-repeat center bottom;
 
+  background: url('../images/page-bg.png') no-repeat center bottom;
 
   display: flex;
 
   padding-bottom: 65px;
 
 }
 
@@ -143,7 +143,7 @@ a {
 
   left: -40px;
 
   width: 30px;
 
   height: 10px;
 
-  background: url('../images/title-left.png') no-repeat;
 
+  background: url('../images/title-left2.png') no-repeat;
 
 }
 
 .left .title .text::after {
 
   position: absolute;
 
@@ -152,7 +152,7 @@ a {
 
   right: -40px;
 
   width: 30px;
 
   height: 10px;
 
-  background: url('../images/title-right.png') no-repeat;
 
+  background: url('../images/title-right2.png') no-repeat;
 
 }
 
 .left .content {
 
   height: calc(100% - 60px);
 
@@ -206,7 +206,7 @@ a {
 
 .item2 .item2-img {
 
   width: 67px;
 
   height: 66px;
 
-  margin-top: -20px;
 
+  /* margin-top: -20px; */
 
 }
 
 .item2 .item2-text {
 
   color: rgba(255, 255, 255, 0.6);
 
@@ -296,19 +296,38 @@ a {
 
   justify-content: end;
 
   padding: 0 6px;
 
 }
 
-
 
+.content {
 
+  /* display: flex;
 
+  align-items: center; */
 
+}
 
 .left .content .content-con {
 
   margin-right: 10px;
 
 }
 
-.left .content .content-left,
 
+/* .left .content .content-left, */
 
 /* .left .content .content-right, */
 
 .topChange2,
 
 .left .content .content-con {
 
-  background-color: rgb(18 81 128 / 22%);
 
+  /* background-color: rgb(18 81 128 / 22%); */
 
+  background-color: #05183c;
 
   flex: 1;
 
 }
 
-.left .content .content-right {
 
+.content-con {
 
+  background-color: #05183c;
 
+  margin: 0 10px;
 
+}
 
+.topChange1 {
 
+  background-color: #05183c;
 
+}
 
+.left .content .content-right,
 
+.left .content .content-left {
 
   flex: 1;
 
+  background-color: #05183c;
 
+}
 
+.left .content .content-right {
 
+  width: 40%;
 
+}
 
+.left .content .content-left {
 
+  width: 100%;
 
 }
 
 .right .title {
 
   position: relative;
 
@@ -333,7 +352,7 @@ a {
 
   left: -40px;
 
   width: 30px;
 
   height: 10px;
 
-  background: url('../images/title-left.png') no-repeat;
 
+  background: url('../images/title-left2.png') no-repeat;
 
 }
 
 .right .title .text::after {
 
   position: absolute;
 
@@ -342,7 +361,7 @@ a {
 
   right: -40px;
 
   width: 30px;
 
   height: 10px;
 
-  background: url('../images/title-right.png') no-repeat;
 
+  background: url('../images/title-right2.png') no-repeat;
 
 }
 
 .right .content {
 
   height: calc(100% - 60px);
 
@@ -361,12 +380,14 @@ a {
 
   margin-bottom: 10px;
 
 }
 
 .right .content .content-top,
 
-.right .content .content-bot, .right .content .content-right{
 
-  background-color: rgb(18 81 128 / 22%);
 
+.right .content .content-bot, .right .content .content-right {
 
+  /* background-color: rgb(18 81 128 / 22%); */
 
+  background-color: #05183c;
 
   flex: 1;
 
 }
 
 .right .content .content-left .content-left-l {
 
-  background-color: rgb(18 81 128 / 22%);
 
+  /* background-color: rgb(18 81 128 / 22%); */
 
+  background-color: #05183c;
 
   flex: 1;
 
   margin-right: 10px;
 
   display: flex;
 
@@ -383,7 +404,8 @@ a {
 
 }
 
 .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%);
 
+  /* background-color: rgb(18 81 128 / 22%); */
 
+  background-color: #05183c;
 
   flex: 1;
 
 }
 
 .right .content .content-right .content-right-l {
 
@@ -391,7 +413,8 @@ a {
 
 }
 
 .right .content .content-right .content-right-l,
 
 .right .content .content-right .content-right-r {
 
-  background-color: rgb(18 81 128 / 22%);
 
+  /* background-color: rgb(18 81 128 / 22%); */
 
+  background-color: #05183c;
 
   flex: 1;
 
 }
 
 
@@ -437,20 +460,19 @@ a {
 
   width: 100%;
 
 }
 
 .topChange0 {
 
-  width: 20%;
 
+  width: 16%;
 
   height: 100%;
 
   text-align: center;
 
-  padding-top: 20px;
 
-  color: #a0ead9;
 
-  font-size: 16px;
 
+  color: #ffffff;
 
+  font-size: 22px;
 
+  display: flex;
 
+  justify-content: center;
 
+  align-items: center;
 
+  background-color: #05183c;
 
+  margin-right: 10px;
 
 }
 
-.jt {
 
-  border-top: 50px solid transparent;
 
-  border-bottom: 50px solid transparent;
 
-  border-left: 30px solid #81c14f;
 
-  width: 0;
 
-  height: 0;
 
-  margin: 0 20px;
 
+.topChange0 > div {
 
+  writing-mode: tb-rl;
 
 }
 
 .content-right {
 
   display: flex;
 
@@ -542,3 +564,44 @@ a {
 
   cursor: pointer;
 
   font-size: 44px;
 
 }
 
+.title-left {
 
+  position: absolute;
 
+  top: 0px;
 
+  left: 20px;
 
+  color: #447ed2;
 
+  font-weight: bold;
 
+  font-size: 22px;
 
+}
 
+.topChange2 {
 
+  margin-right: 15px;
 
+}
 
+.rows > .row-item:nth-child(2) {
 
+  background-color: #79a4db6c !important;
 
+}
 
+.header {
 
+  color: #2abbff;
 
+  font-weight: bold;
 
+}
 
+.row-item {
 
+  color: #ffffff;
 
+}
 
+.swiper {
 
+  width: 600px;
 
+  height: 300px;
 
+  --swiper-theme-color: #ff004c;
 
+  /* 设置Swiper风格 */
 
+  --swiper-navigation-color: #008cff;
 
+  /* 单独设置按钮颜色 */
 
+  --swiper-navigation-size: 40px;
 
+  /* 设置按钮大小 */
 
+}
 
+.swiperChange {
 
+  display: flex;
 
+  width: 100%;
 
+  height: 100%;
 
+  align-items: center;
 
+}
 
+.mySwiper {
 
+  /* width: 100%; */
 
+  overflow: hidden;
 
+}