独立图标配置

src/dataSchema/color.js

@@ -0,0 +1,8 @@
+/*
+ * @LastEditors: gcz
+ */
+let themeColor = {
+    mainColor: '#02EEFF'
+};
+
+export default themeColor;

src/dataSchema/page1Char2Schema.js

@@ -0,0 +1,33 @@
+/*
+ * @LastEditors: gcz
+ */
+let page1Char2Schema = {
+    title: {
+        text: '储蓄量统计(立方米111)',
+        textStyle: {
+            color: '#fff',
+        }
+
+    },
+    tooltip: {},
+    xAxis: {
+        data: ['三都林场', '清镇林场', '榕江林场', '水东林场', '甜蜜林场', '贵阳林场'],
+        axisLabel: {
+            color: "rgba(255, 255, 255, 1)"
+        }
+    },
+    yAxis: {
+        axisLabel: {
+            color: "rgba(255, 255, 255, 1)"
+        }
+    },
+    series: [
+        {
+            name: '储蓄量',
+            type: 'bar',
+            data: [5000, 6000, 3000, 9000, 4500, 7000],
+
+        }
+    ]
+}
+export default page1Char2Schema

src/dataSchema/page2Char1Schema.js

@@ -0,0 +1,43 @@
+/*
+ * @LastEditors: gcz
+ */
+import themeColor from "./color"
+let page2Char1Schema = {
+    title: {
+        text: '树种占比',
+        left: 'center',
+        textStyle: {
+            color: themeColor.mainColor,
+        }
+    },
+    tooltip: {
+        trigger: 'item',
+        formatter: '{b} : {c} ({d}%)'
+    },
+    legend: {
+        show: false,
+        orient: 'vertical',
+        left: 'left'
+    },
+    series: [
+        {
+            name: 'Access From',
+            type: 'pie',
+            radius: '50%',
+            data: [
+                // { value: 120, name: '柏类' },
+                // { value: 20, name: '杉树' },
+                // { value: 5, name: '松树' },
+                // { value: 80, name: '枫叶类' }
+            ],
+            emphasis: {
+                itemStyle: {
+                    shadowBlur: 10,
+                    shadowOffsetX: 0,
+                    shadowColor: 'rgba(0, 0, 0, 0.5)'
+                }
+            }
+        }
+    ]
+}
+export default page2Char1Schema

src/dataSchema/page2Char2Schema.js

@@ -0,0 +1,83 @@
+/*
+ * @LastEditors: gcz
+ */
+
+import themeColor from "./color"
+let page2Char2Schema = {
+    title: {
+        text: '树种分布统计',
+        textStyle: {
+            color: themeColor.mainColor,
+        }
+    },
+    tooltip: {
+        trigger: 'axis',
+        axisPointer: {
+            type: 'shadow'
+        }
+    },
+    legend: {
+        textStyle: {
+            color: '#fff',
+        }
+    },
+    grid: {
+        left: '3%',
+        right: '4%',
+        bottom: '3%',
+        containLabel: true
+    },
+    yAxis: {
+        type: 'value',
+        axisLabel: {
+            color: "rgba(255, 255, 255, 1)"
+        }
+    },
+    xAxis: {
+        type: 'category',
+        data: ['1', '2', '3', '4', '5', '6', '7'],
+        axisLabel: {
+            color: "rgba(255, 255, 255, 1)"
+        }
+    },
+    series: [
+        {
+            name: '松树',
+            type: 'bar',
+            stack: 'total',
+            label: {
+                show: false
+            },
+            emphasis: {
+                focus: 'series'
+            },
+            data: [1, 1, 1, 2, 2, 1, 0]
+        },
+        {
+            name: '马尾松',
+            type: 'bar',
+            stack: 'total',
+            label: {
+                show: false
+            },
+            emphasis: {
+                focus: 'series'
+            },
+            data: [1, 8, 8, 2, 6, 9, 9]
+        },
+        {
+            name: '杉树',
+            type: 'bar',
+            stack: 'total',
+            label: {
+                show: false
+            },
+            emphasis: {
+                focus: 'series'
+            },
+            data: [8, 1, 1, 6, 2, 0, 1]
+        }
+    ]
+
+}
+export default page2Char2Schema

src/dataSchema/page6Char1Schema.js

@@ -0,0 +1,68 @@
+/*
+ * @LastEditors: gcz
+ */
+/*
+ * @LastEditors: gcz
+ */
+
+import themeColor from "./color"
+let page6Char1Schema = {
+    title: {
+        show: true,
+        text: '事件统计(件)',
+        textStyle: {
+            color: themeColor.mainColor,
+        }
+    },
+    tooltip: {
+        trigger: 'axis'
+    },
+    legend: {
+        data: ['火灾', '乱砍乱伐', '病虫害'],
+        textStyle: {
+            color: '#fff',
+        }
+    },
+    calculable: true,
+    xAxis: [
+        {
+            type: 'category',
+            data: ['马鞍村', '三盘村', '灵家村', '龙子田'],
+            axisLabel: {
+                color: "rgba(255, 255, 255, 1)"
+            }
+        }
+    ],
+    yAxis: [
+        {
+            type: 'value',
+            axisLabel: {
+                color: "rgba(255, 255, 255, 1)"
+            }
+        }
+    ],
+    series: [
+        {
+            name: '火灾',
+            type: 'bar',
+            data: [
+                2.0, 4.9, 7.0, 23.2
+            ]
+        },
+        {
+            name: '乱砍乱伐',
+            type: 'bar',
+            data: [
+                2.6, 5.9, 9.0, 26.4
+            ]
+        },
+        {
+            name: '病虫害',
+            type: 'bar',
+            data: [
+                2.6, 1.5, 10, 3
+            ]
+        }
+    ]
+}
+export default page6Char1Schema

src/dataSchema/scrollBoardSchema.js

@@ -0,0 +1,14 @@
+/*
+ * @LastEditors: gcz
+ */
+let scrollBoardSchema = {
+    header: ['小班号', '树种组成', '每亩蓄积', '小班面积'],
+    data: [],
+    headerBGC: 'transparent',//表头背景色
+    // headerBGC:'rgba(38,80,179,1)',//表头背景色
+    // oddRowBGC:'rgba(38,80,179,.5)',//奇数行背景色
+    oddRowBGC: 'transparent',//奇数行背景色
+    evenRowBGC: 'transparent',//偶数行背景色	
+    align: ['center', 'center', 'center', 'center'],//列对齐方式
+}
+export default scrollBoardSchema

src/views/index.vue

@@ -86,10 +86,15 @@
     page5echarts02,
     page6numerical,
     page6echarts01,
-  } from "../service/index"
+  } from "../service/index";
+
+  import scrollBoardSchema from '../dataSchema/scrollBoardSchema';
+  import page1Char2Schema from '../dataSchema/page1Char2Schema';
+  import page2Char1Schema from '../dataSchema/page2Char1Schema';
+  import page2Char2Schema from '../dataSchema/page2Char2Schema';
+  import page6Char1Schema from '../dataSchema/page6Char1Schema';
 
   // import { provinceAndCityData, regionData, provinceAndCityDataPlus, regionDataPlus, CodeToText, TextToCode } from 'element-china-area-data';
-  let mainColor='#02EEFF';
   export default {
     name: '',
     components: {
@@ -114,16 +119,7 @@
           {text:'林业经济'},
           {text:'事件信息'},
         ],
-        scrollBoardConfig:{
-          header: ['小班号', '树种组成', '每亩蓄积','小班面积'],
-          data: [],
-          headerBGC:'transparent',//表头背景色
-          // headerBGC:'rgba(38,80,179,1)',//表头背景色
-          // oddRowBGC:'rgba(38,80,179,.5)',//奇数行背景色
-           oddRowBGC:'transparent',//奇数行背景色
-          evenRowBGC:'transparent',//偶数行背景色	
-          align:['center','center','center','center'],//列对齐方式
-        },
+        scrollBoardConfig:scrollBoardSchema,
         page1numerical:[
           {name:'储蓄量',number:'2309',unit:'立方米'},
           {name:'储蓄量',number:'2309',unit:'立方米'},
@@ -135,138 +131,15 @@
           // {msg:'测试22222222！'},
         ],
         page1Char1:{},
-        page1Char2:{
-            title: {
-            text: '储蓄量统计(立方米)',
-            textStyle:{
-                color: '#fff',
-            }
-            
-            },
-            tooltip: {},
-            xAxis: {
-            data: ['三都林场', '清镇林场', '榕江林场', '水东林场', '甜蜜林场', '贵阳林场'],
-            axisLabel: {
-                color: "rgba(255, 255, 255, 1)"
-            }
-            },
-            yAxis: {
-            axisLabel: {
-                color: "rgba(255, 255, 255, 1)"
-            }
-            },
-            series: [
-            {
-                name: '储蓄量',
-                type: 'bar',
-                data: [5000, 6000, 3000, 9000, 4500, 7000],
-                
-            }
-            ]
-        },
-        page2Char1:{
-          title: {
-          text: '树种占比',
-          left: 'center',
-          textStyle:{
-              color: mainColor,
-          }
-        },
-        tooltip: {
-          trigger: 'item',
-          formatter: '{b} : {c} ({d}%)'
-        },
-        legend: {
-          show:false,
-          orient: 'vertical',
-          left: 'left'
-        },
-        series: [
-          {
-            name: 'Access From',
-            type: 'pie',
-            radius: '50%',
-            data: [
-              // { value: 120, name: '柏类' },
-              // { value: 20, name: '杉树' },
-              // { value: 5, name: '松树' },
-              // { value: 80, name: '枫叶类' }
-            ],
-            emphasis: {
-              itemStyle: {
-                shadowBlur: 10,
-                shadowOffsetX: 0,
-                shadowColor: 'rgba(0, 0, 0, 0.5)'
-              }
-            }
-          }
-          ]
-        },
-        page2Char2:{},
+        page1Char2:page1Char2Schema,
+        page2Char1:page2Char1Schema,
+        page2Char2:page2Char2Schema,
         page5numerical:[],
         typeSlideData:[],
         page5Char1:{},
         page5Char2:{},
         page6numerical:[],
-        page6Char1:{
-          title: {
-            show:true,
-            text: '事件统计(件)',
-            textStyle:{
-              color: '#02EEFF',
-            }
-          },
-          tooltip: {
-            trigger: 'axis'
-          },
-          legend: {
-            data: ['火灾', '乱砍乱伐','病虫害'],
-            textStyle:{
-                color: '#fff',
-            }
-          },
-          calculable: true,
-          xAxis: [
-            {
-              type: 'category',
-              data: ['马鞍村', '三盘村', '灵家村', '龙子田'],
-              axisLabel: {
-                color: "rgba(255, 255, 255, 1)"
-              }
-            }
-          ],
-          yAxis: [
-            {
-              type: 'value',
-              axisLabel: {
-                color: "rgba(255, 255, 255, 1)"
-              }
-            }
-          ],
-          series: [
-            {
-              name: '火灾',
-              type: 'bar',
-              data: [
-                2.0, 4.9, 7.0, 23.2
-              ]
-            },
-            {
-              name: '乱砍乱伐',
-              type: 'bar',
-              data: [
-                2.6, 5.9, 9.0, 26.4
-              ]
-            },
-            {
-              name: '病虫害',
-              type: 'bar',
-              data: [
-                2.6, 1.5, 10, 3
-              ]
-            }
-          ]
-        },
+        page6Char1:page6Char1Schema,
         xiaobaninput:'',
 
         
@@ -398,7 +271,17 @@
       getPage2echarts02(){
         page2echarts02().then(res=>{
           // console.log('res',res);
-          this.page2Char2 = res.data;
+          // this.page2Char2 = res.data;
+          
+          // this.page2Char2.xAxis[0] = [];
+          // this.page2Char2.series[0] = [];
+          // res.data&&res.data.forEach(element=>{
+          //   this.page2Char2.xAxis[0].push(element.smallNumber);
+          //   this.page2Char2.series[0].push({
+
+          //   });
+          // })
+
           let charUuid = this.$refs.page2Char2.mid;
           this.$refs.page2Char2.intChar(charUuid)
         }).catch(err=>{