merge branch master 20220505

src/componentChart/HorizontalBarChart.vue

@@ -71,10 +71,14 @@ export default {
         tooltip: { trigger: 'axis' },
         legend: {   data:chartData.legendArr, right: 10, show: true, type: 'scroll' },
         grid: { top: '15%', left: '8%', right: '8%', containLabel: true },
-        xAxis: [{ type: 'category',data:chartData.xAxisArr }],
+
+         xAxis: {type: 'value', name: 'kg'},
         yAxis: [
-          {type: 'value'},  
+          { type: 'category',data:chartData.xAxisArr }
+           
         ],
+
+       
          series: function (e) {
             var serie = [];
             for (var i = 0; i < chartData.xAxisArr.length; i++) {

src/componentChart/PieChart.vue

@@ -0,0 +1,138 @@
+<template>
+  <div ref="chart"  style="width:100%;height:385px;"  />
+</template>
+<script>
+import echarts from 'echarts'
+import { GetDataByName } from '@/api/common'
+import draggable from 'vuedraggable'
+import Cookies from 'js-cookie'
+import { parseTime } from '@/utils/index.js'
+import Pagination from '@/components/Pagination'
+require('echarts/theme/macarons')
+
+export default {
+  name: 'PieChart',
+  props: {
+    
+
+    chartData: {
+      type: Object,
+      required: true
+    },
+    //   chartOpt: {
+    //   type: Object,
+    //   required: false
+    // },
+  },
+  data() {
+    return {
+      chart: null
+    }
+  },
+  watch: {
+    chartData: {
+      deep: true,
+      handler: function (chartData) {
+        this.renderChart(chartData)
+      }
+    },
+    // schema: {
+    //   deep: true,
+    //   handler: function () {
+    //     this.renderChart(this.data)
+    //   }
+    // }
+  },
+  mounted() {
+    this.renderChart(this.chartData)
+    this.$on('resized', this.handleResize)
+    window.addEventListener('resize', this.handleResize)
+  },
+
+
+  // created() {
+  //   this.renderChart(this.chartData)
+  // },
+  beforeDestroy() {
+    if (this.chart) {
+      this.chart.dispose()
+    }
+    window.removeEventListener('resize', this.handleResize)
+  },
+  methods: {
+    handleResize() {
+      if (this.chart) {
+        this.chart.resize()
+      }
+    },
+    renderChart(chartData) {
+      const option =  {
+        title: { text: 'Stacked Line' },
+        tooltip: { trigger: 'axis' },
+        legend: {   data:chartData.legendArr, right: 10, show: true, type: 'scroll' },
+        grid: { top: '15%', left: '8%', right: '8%', containLabel: true },
+        xAxis: [{ type: 'category',data:chartData.xAxisArr }],
+        yAxis: [
+          {type: 'value', name: 'kg'},
+           
+        ],
+         series: function (e) {
+             
+              var serie = [
+               {
+                  name: 'Access From',
+                  type: 'pie',
+                  radius: '50%',
+                  data: [
+                    // { value: 1048, name: 'Search Engine' },
+                    // { value: 735, name: 'Direct' },
+                    // { value: 580, name: 'Email' },
+                    // { value: 484, name: 'Union Ads' },
+                    // { value: 300, name: 'Video Ads' }
+                  ],
+                  emphasis: {
+                    itemStyle: {
+                      shadowBlur: 10,
+                      shadowOffsetX: 0,
+                      shadowColor: 'rgba(0, 0, 0, 0.5)'
+                    }
+                  }
+                }
+              ];
+            for (var i = 0; i < chartData.xAxisArr.length; i++) {
+              console.log(i)
+               
+                var item = {
+                  name: chartData.legendArr[i],
+                  value: chartData.dataArr[i],
+                
+                }
+             
+
+              serie[0].data.push(item);
+            }
+
+
+            console.log("饼图：",serie)
+
+            return serie;
+          }()
+      
+      }
+      setTimeout(() => {
+        if (!this.chart) {
+          this.chart = echarts.init(this.$refs.chart, 'macarons')
+        }
+        this.chart.clear()
+        this.chart.setOption(option)
+        // if (this.chartOpt) {
+        //   this.chart.setOption(this.chartOpt)
+        // }
+ 
+        this.chart.setOption(this.chartOpt)
+       
+      }, 0)
+    }
+  }
+}
+</script>

src/views/formulationPlan/pushMaterialPlan/index.vue

@@ -908,7 +908,7 @@ export default {
        row.pastureid =  Cookies.get('pastureid')
        
  
-      if (row.tmrname === '') {
+      if (row.tmrid === '' || row.tmrid == null ) {
         this.$message({ type: 'error', message: '推料车名称不能为空', duration: 2000 })
         return false
       }

src/views/systemManagement/customboard2/ChartPanel2/index.vue

@@ -116,8 +116,8 @@
           
         <BarChart v-if = "chartData.chartType == 'bar'"   :chart-data="chartData" />
         <LineChart v-if = "chartData.chartType == 'line'"   :chart-data="chartData" />
-         <HorizontalBarChart v-if = "chartData.chartType == 'line'"   :chart-data="chartData" />
-
+        <HorizontalBarChart v-if = "chartData.chartType == 'horizontal_bar'"   :chart-data="chartData" />
+        <PieChart v-if = "chartData.chartType == 'pie'"   :chart-data="chartData" />
         
 
           <!-- <div id="chartLine" style="width:100%;height:385px;" >
@@ -163,7 +163,8 @@ import draggable from 'vuedraggable'
 import ChartTable from '@/componentChart/ChartTable.vue'
 import LineChart from '@/componentChart/LineChart.vue'
 import BarChart from '@/componentChart/BarChart.vue'
-// import HorizontalBarChart from '@/componentChart/BarChart.vue'
+import HorizontalBarChart from '@/componentChart/HorizontalBarChart.vue'
+import PieChart from '@/componentChart/PieChart.vue'
 
 
 require('echarts/theme/macarons')
@@ -173,7 +174,7 @@ import Pagination from '@/components/Pagination'
 import { MessageBox } from 'element-ui'
 export default {
   name: 'ChartPanel2',
-  components: { Pagination, draggable , ChartTable ,LineChart,BarChart },
+  components: { Pagination, draggable , ChartTable ,LineChart,BarChart ,HorizontalBarChart, PieChart},
   data() {
     return {
       
@@ -642,7 +643,7 @@ export default {
       console.log('点击了查询 - this.chartLine_data', this.chartLine_data)
 
  
-      this.roadChartLine(this.chartLine_data)
+     // this.roadChartLine(this.chartLine_data)
     },
     form_clear() {
       console.log('点击了重置')
@@ -997,56 +998,7 @@ export default {
       }
       
 
-      // var option_line_bar = {
-
-        
-      //   title: { text: 'Stacked Line' },
-      //   tooltip: { trigger: 'axis' },
-      //   legend: {   data: chartLine_data.legendArr1.concat( chartLine_data.legendArr2)  , right: 10, show: true, type: 'scroll' },
-      //   grid: { top: '15%', left: '8%', right: '8%', containLabel: true },
-      //   xAxis: [{ type: 'category',data:chartLine_data.xAxisArr }],
-      //   yAxis: [
-      //     {type: 'value', name: 'kg'},
-           
-      //   ],
-      //    series: function (e) {
-      //       var serie = [];
-      //       for (var i = 0; i < chartLine_data.xAxisArr.length; i++) {
-           
-      //           var item = {
-      //             name: chartLine_data.legendArr1[i],
-      //             data: chartLine_data.dataArr1[i],
-      //             type: 'line',
-      //             emphasis: { label: { show: true, position: 'inside' } },
-      //           }
- 
-             
-
-      //         serie.push(item);
-      //       }
-
-
-      //        for (var i = 0; i < chartLine_data.xAxisArr.length; i++) {
-             
-      //           var item = {
-      //             name: chartLine_data.legendArr2[i],
-      //             data: chartLine_data.dataArr2[i],
-      //             type: 'bar',
-      //             emphasis: { label: { show: true, position: 'inside' } },
-      //           }
-             
-
-      //         serie.push(item);
-      //       }
-
-
-
-      //       console.log(serie)
-
-      //       return serie;
-      //     }()
       
-      // }
 
       var option_line_bar = {
         tooltip: {
@@ -1190,36 +1142,27 @@ export default {
         this.chartData = {
           chartType:'horizontal_bar',
           xAxisArr: ['2019-01', '2019-02', '2019-03', '2019-04', '2019-05', '2019-06', '2019-07', '2019-08', '2019-09', '2019-10', '2019-11', '2019-12'],
-          legendArr: ['数据1', '数据2', '数据3'],
+          legendArr: ['数据1', '数据2', '数据3', '数据4'],
           dataArr:[
             [1, 10, 7, 0, 1, 7, 7, 6, 4, 4, 1, 6],
             [1, 10, 7, 0, 1, 7, 7, 6, 4, 4, 1, 6],
             [1, 10, 7, 0, 1, 7, 7, 6, 4, 4, 1, 6],
+            [1, 10, 7, 0, 1, 7, 7, 6, 4, 4, 1, 6],
       
           ]
         }
+      }  else if (item.type == 'pie'){
+        console.log("pie!=============")
+        this.chartData = {
+          chartType:'pie',
+          xAxisArr: ['2019-01', '2019-02', '2019-03', '2019-04', '2019-05', '2019-06', '2019-07', '2019-08', '2019-09', '2019-10', '2019-11', '2019-12'],
+          legendArr: ['数据1', '数据2', '数据3', '数据4', '线条1'],
+          dataArr:[1, 10, 7, 0, 1, 7, 7, 6, 4, 4, 1, 6],
+        
+        }
       }  
 
-
-      // if(item.type == 'line'){
-      //   this.chartLine_data.chartType = 'line'
-      //   this.roadChartLine(this.chartLine_data)
-      // } else if(item.type == 'bar'){
-      //   this.chartLine_data.chartType = 'bar'
-      //   this.roadChartLine(this.chartLine_data)
-      // } else if(item.type == 'horizontal_bar'){
-      //   this.chartLine_data.chartType = 'horizontal_bar'
-      //    this.roadChartLine(this.chartLine_data)
-      // }  else if(item.type == 'pie'){
-      //   this.chartLine_data2.chartType = 'pie'
-      //    this.roadChartLine(this.chartLine_data2)
-      // }   else if(item.type == 'line_bar'){
-      //   console.log(1111)
-      //    this.chartLine_data3.chartType = 'line_bar'
-      //    console.log(this.chartLine_data3)
-      //   this.roadChartLine(this.chartLine_data3)
-        
-      // } 
+ 
       
     }