telephone-clients 3.0.104-54 → 3.0.104-56

package/src/components/eachart/workorderchart.vue

@@ -1,183 +1,183 @@
-<template>
-  <div class="workordersum">
-    <div id="mainworksum" style="width:650px ;height:310px;"></div>
-  </div>
-</template>
-
-<script>
-import * as echarts from 'echarts'
-import {HttpResetClass} from 'vue-client'
-
-export default {
-  name: 'workorderchart',
-  props: ['sel'],
-  data () {
-    return {
-      yongqiyichang: [], //用气异常
-      tongqidianhuo: [], //通气点火
-      yingjiqiangxian: [], //应急抢险
-      biaojugenghuan: [] //表具更换
-    }
-  },
-  ready () {
-    this.getWorkOrderNian()
-    setInterval(() => {
-      this.sel = this.sel % 3 + 1
-      this.getWorkOrderNian()
-    }, 10000)
-    this.$nextTick(function () {
-      this.getworkorder()
-    })
-  },
-  methods: {
-    getWorkOrderNian () {
-      let http = new HttpResetClass()
-      http.load('post', 'rs/sql/workordersum-nian', {
-        data: {}
-      }, {rejectMsg: null, resolveMsg: null}).then((res) => {
-        this.yongqiyichang = []
-        this.tongqidianhuo = []
-        this.yingjiqiangxian = []
-        this.biaojugenghuan = []
-        for (const resdata of res.data) {
-          this.yongqiyichang.push(resdata.yongqiyichang)
-          this.tongqidianhuo.push(resdata.tongqidianhuo)
-          this.yingjiqiangxian.push(resdata.yingjiqiangxian)
-          this.biaojugenghuan.push(resdata.biaojugenghuan)
-        }
-        this.getworkorder()
-      })
-    },
-    getWorkOrderYue () {
-      let http = new HttpResetClass()
-      http.load('post', 'rs/sql/workordersum-yue', {
-        data: {}
-      }, {rejectMsg: null, resolveMsg: null}).then((res) => {
-        this.yongqiyichang = []
-        this.tongqidianhuo = []
-        this.yingjiqiangxian = []
-        this.biaojugenghuan = []
-        for (const resdata of res.data) {
-          this.yongqiyichang.push(resdata.yongqiyichang)
-          this.tongqidianhuo.push(resdata.tongqidianhuo)
-          this.yingjiqiangxian.push(resdata.yingjiqiangxian)
-          this.biaojugenghuan.push(resdata.biaojugenghuan)
-        }
-        this.getworkorder()
-      })
-    },
-    getWorkOrderZhou () {
-      let http = new HttpResetClass()
-      http.load('post', 'rs/sql/workordersum-zhou', {
-        data: {}
-      }, {rejectMsg: null, resolveMsg: null}).then((res) => {
-        this.yongqiyichang = []
-        this.tongqidianhuo = []
-        this.yingjiqiangxian = []
-        this.biaojugenghuan = []
-        for (const resdata of res.data) {
-          this.yongqiyichang.push(resdata.yongqiyichang)
-          this.tongqidianhuo.push(resdata.tongqidianhuo)
-          this.yingjiqiangxian.push(resdata.yingjiqiangxian)
-          this.biaojugenghuan.push(resdata.biaojugenghuan)
-        }
-        this.getworkorder()
-      })
-    },
-    getworkorder () {
-      var myChart = this.$echarts.init(document.getElementById('mainworksum'))
-      var option = {
-        //鼠标划过时饼状图上显示的数据
-        tooltip: {
-          trigger: 'item',
-          formatter: '{a}<br/>{b}:{c} ({d}%)'
-        },
-        //图例
-        legend: {
-          top: '93%',
-          //图例  标注各种颜色代表的模块
-          // orient: 'vertical',//图例的显示方式  默认横向显示
-          bottom: 10, //控制图例出现的距离  默认左上角
-          left: 'center', //控制图例的位置
-          // itemWidth: 16,//图例颜色块的宽度和高度
-          // itemHeight: 12,
-          textStyle: {
-            //图例中文字的样式
-            color: '#f5f5f5',
-            fontSize: 16
-          },
-          data: ['用气异常', '通气点火', '应急抢险', '表具更换'] //图例上显示的饼图各模块上的名字
-        },
-        //饼图中各模块的颜色#
-        color: ['#f83131', '#5384fc', '#1ea3f1', '#33a642'],
-        // 饼图数据
-        series: {
-          name: '工单类型统计',
-          type: 'pie', //echarts图的类型   pie代表饼图
-          radius: '70%', //饼图中饼状部分的大小所占整个父元素的百分比
-          center: ['50%', '50%'], //整个饼图在整个父元素中的位置
-          // data:''               //饼图数据
-          data: [
-            //每个模块的名字和值
-            {name: '用气异常', value: this.yongqiyichang},
-            {name: '通气点火', value: this.tongqidianhuo},
-            {name: '应急抢险', value: this.yingjiqiangxian},
-            {name: '表具更换', value: this.biaojugenghuan}
-          ],
-          itemStyle: {
-            normal: {
-              label: {
-                show: true //饼图上是否出现标注文字 标注各模块代表什么  默认是true
-                // position: 'inner',//控制饼图上标注文字相对于饼图的位置  默认位置在饼图外
-              },
-              labelLine: {
-                show: true //官网demo里外部标注上的小细线的显示隐藏    默认显示
-              }
-            }
-          }
-        },
-        itemStyle: {
-          normal: {
-            label: {
-              show: true//饼图上是否出现标注文字 标注各模块代表什么  默认是true
-              // position: 'inner',//控制饼图上标注文字相对于饼图的位置  默认位置在饼图外
-            },
-            labelLine: {
-              show: true//官网demo里外部标注上的小细线的显示隐藏    默认显示
-            }
-          }
-        }
-      }
-      // 使用刚指定的配置项和数据显示图表。
-      option && myChart.setOption(option)
-    }
-  },
-  watch: {
-    'sel' (val) {
-      if (val === 1) {
-        this.getWorkOrderNian()
-      } else if (val === 2) {
-        this.getWorkOrderYue()
-      } else {
-        this.getWorkOrderZhou()
-      }
-    }
-  }
-}
-</script>
-
-<style lang="less">
-.workordersum {
-  position: fixed;
-  left: 1243px;
-  top: 595px;
-  width: 650px;
-  height: 310px;
-}
-
-#mainworksum {
-  div {
-    height: auto !important;
-  }
-}
-</style>
+<template>
+  <div class="workordersum">
+    <div id="mainworksum" style="width:650px ;height:310px;"></div>
+  </div>
+</template>
+
+<script>
+import * as echarts from 'echarts'
+import {HttpResetClass} from 'vue-client'
+
+export default {
+  name: 'workorderchart',
+  props: ['sel'],
+  data () {
+    return {
+      yongqiyichang: [], //用气异常
+      tongqidianhuo: [], //通气点火
+      yingjiqiangxian: [], //应急抢险
+      biaojugenghuan: [] //表具更换
+    }
+  },
+  ready () {
+    this.getWorkOrderNian()
+    setInterval(() => {
+      this.sel = this.sel % 3 + 1
+      this.getWorkOrderNian()
+    }, 10000)
+    this.$nextTick(function () {
+      this.getworkorder()
+    })
+  },
+  methods: {
+    getWorkOrderNian () {
+      let http = new HttpResetClass()
+      http.load('post', 'rs/sql/workordersum-nian', {
+        data: {}
+      }, {rejectMsg: null, resolveMsg: null}).then((res) => {
+        this.yongqiyichang = []
+        this.tongqidianhuo = []
+        this.yingjiqiangxian = []
+        this.biaojugenghuan = []
+        for (const resdata of res.data) {
+          this.yongqiyichang.push(resdata.yongqiyichang)
+          this.tongqidianhuo.push(resdata.tongqidianhuo)
+          this.yingjiqiangxian.push(resdata.yingjiqiangxian)
+          this.biaojugenghuan.push(resdata.biaojugenghuan)
+        }
+        this.getworkorder()
+      })
+    },
+    getWorkOrderYue () {
+      let http = new HttpResetClass()
+      http.load('post', 'rs/sql/workordersum-yue', {
+        data: {}
+      }, {rejectMsg: null, resolveMsg: null}).then((res) => {
+        this.yongqiyichang = []
+        this.tongqidianhuo = []
+        this.yingjiqiangxian = []
+        this.biaojugenghuan = []
+        for (const resdata of res.data) {
+          this.yongqiyichang.push(resdata.yongqiyichang)
+          this.tongqidianhuo.push(resdata.tongqidianhuo)
+          this.yingjiqiangxian.push(resdata.yingjiqiangxian)
+          this.biaojugenghuan.push(resdata.biaojugenghuan)
+        }
+        this.getworkorder()
+      })
+    },
+    getWorkOrderZhou () {
+      let http = new HttpResetClass()
+      http.load('post', 'rs/sql/workordersum-zhou', {
+        data: {}
+      }, {rejectMsg: null, resolveMsg: null}).then((res) => {
+        this.yongqiyichang = []
+        this.tongqidianhuo = []
+        this.yingjiqiangxian = []
+        this.biaojugenghuan = []
+        for (const resdata of res.data) {
+          this.yongqiyichang.push(resdata.yongqiyichang)
+          this.tongqidianhuo.push(resdata.tongqidianhuo)
+          this.yingjiqiangxian.push(resdata.yingjiqiangxian)
+          this.biaojugenghuan.push(resdata.biaojugenghuan)
+        }
+        this.getworkorder()
+      })
+    },
+    getworkorder () {
+      var myChart = this.$echarts.init(document.getElementById('mainworksum'))
+      var option = {
+        //鼠标划过时饼状图上显示的数据
+        tooltip: {
+          trigger: 'item',
+          formatter: '{a}<br/>{b}:{c} ({d}%)'
+        },
+        //图例
+        legend: {
+          top: '93%',
+          //图例  标注各种颜色代表的模块
+          // orient: 'vertical',//图例的显示方式  默认横向显示
+          bottom: 10, //控制图例出现的距离  默认左上角
+          left: 'center', //控制图例的位置
+          // itemWidth: 16,//图例颜色块的宽度和高度
+          // itemHeight: 12,
+          textStyle: {
+            //图例中文字的样式
+            color: '#f5f5f5',
+            fontSize: 16
+          },
+          data: ['用气异常', '通气点火', '应急抢险', '表具更换'] //图例上显示的饼图各模块上的名字
+        },
+        //饼图中各模块的颜色#
+        color: ['#f83131', '#5384fc', '#1ea3f1', '#33a642'],
+        // 饼图数据
+        series: {
+          name: '工单类型统计',
+          type: 'pie', //echarts图的类型   pie代表饼图
+          radius: '70%', //饼图中饼状部分的大小所占整个父元素的百分比
+          center: ['50%', '50%'], //整个饼图在整个父元素中的位置
+          // data:''               //饼图数据
+          data: [
+            //每个模块的名字和值
+            {name: '用气异常', value: this.yongqiyichang},
+            {name: '通气点火', value: this.tongqidianhuo},
+            {name: '应急抢险', value: this.yingjiqiangxian},
+            {name: '表具更换', value: this.biaojugenghuan}
+          ],
+          itemStyle: {
+            normal: {
+              label: {
+                show: true //饼图上是否出现标注文字 标注各模块代表什么  默认是true
+                // position: 'inner',//控制饼图上标注文字相对于饼图的位置  默认位置在饼图外
+              },
+              labelLine: {
+                show: true //官网demo里外部标注上的小细线的显示隐藏    默认显示
+              }
+            }
+          }
+        },
+        itemStyle: {
+          normal: {
+            label: {
+              show: true//饼图上是否出现标注文字 标注各模块代表什么  默认是true
+              // position: 'inner',//控制饼图上标注文字相对于饼图的位置  默认位置在饼图外
+            },
+            labelLine: {
+              show: true//官网demo里外部标注上的小细线的显示隐藏    默认显示
+            }
+          }
+        }
+      }
+      // 使用刚指定的配置项和数据显示图表。
+      option && myChart.setOption(option)
+    }
+  },
+  watch: {
+    'sel' (val) {
+      if (val === 1) {
+        this.getWorkOrderNian()
+      } else if (val === 2) {
+        this.getWorkOrderYue()
+      } else {
+        this.getWorkOrderZhou()
+      }
+    }
+  }
+}
+</script>
+
+<style lang="less">
+.workordersum {
+  position: fixed;
+  left: 1243px;
+  top: 595px;
+  width: 650px;
+  height: 310px;
+}
+
+#mainworksum {
+  div {
+    height: auto !important;
+  }
+}
+</style>