manage-client 3.2.48 → 3.2.49

package/src/components/ManageHomeCS/NewHome/GasProperties.vue

@@ -1,314 +1,314 @@
-<style scoped>
-
-</style>
-<template>
-  <div>
-    <span class="title-1">用气性质分布图</span>
-    <div class="text-1">
-      <div id="TextGasProperties"></div>
-    </div>
-    <img class="img-bottom" src="/static/NewManageHome/1.gif"/>
-  </div>
-</template>
-
-<script>
-  import * as DataSql from '../../../stores/DataSql'
-  import co from 'co'
-  import * as Util from "../../../stores/Util";
-
-
-  export default {
-    name: "TextGasProperties",
-    props: ['orgid'],
-    data() {
-      return {
-
-        xc: '',
-        timer: '',
-        resdata: [],
-        name: [],
-        value: [],
-        start: 0,
-        end: 2,
-        echartData:[]
-      }
-    },
-    methods: {
-      setBar() {
-        this.xc = this.$echarts.init(document.getElementById('TextGasProperties'))
-        var echartData = this.echartData
-        var rich = {
-          blue: {
-            color: '#15dce2',
-            fontSize: 12 ,
-            align: 'center',
-            padding: [15, 0, 15, 0]
-          }
-        }
-        var total = 0; //用户总和
-        var result = ''
-        echartData.forEach(function (value) {
-          total +=value.value;
-        });
-        var index = total.toString().length
-        if (index > 4) {
-          console.log('total---------------------------------')
-          console.log(total)
-          var t = total.toString().substring(0, index - 4)
-          var s = total.toString().substring(index - 4, index - 3)
-          var l = total.toString().substring(index - 3, index - 2)
-          if (l > 4) {
-            s = eval(s + '+1')
-          }
-          if (s > 9) {
-            s = 0
-            t = eval(t + '+1')
-          }
-          result = t + '.' + s + '万'
-        }
-        // else {
-        //   result=total
-        // }
-        var color= ['#6fd9d0', '#ede61f', '#3a6cb2','#6d9bdc']
-        function appendBaseColor(dataList, colorList, opacity){
-          const temp = [];
-          for (let i in dataList) {
-            const tempObj = {
-              ...dataList[i],
-              itemStyle: {
-                color: colorList[i],
-                opacity: opacity
-              }
-            };
-            temp.push(tempObj)
-          }
-          return temp;
-        }
-        var oroptionmapjsonr_charts=this.xc
-        var option={
-          title: [
-            {
-              text: '总客户数',
-              left: '44%',
-              top: '25%',
-              textStyle: {
-                color: '#ffffff',
-                fontSize: 16 ,
-
-              }
-            },
-            {
-              text: result,
-              left: '45%',
-              top: '35%',
-              padding: [10 , 10 ],
-              textStyle: {
-                color: '#00e2ea',
-                fontSize: 16 ,
-
-              }
-            }],
-          tooltip: {
-            show: true,
-            alwaysShowContent:true,
-            backgroundColor:'#01396d',
-            // borderColor :'rgba(13, 109, 180)',
-            borderWidth:0,
-            hideDelay:100,
-            triggerOn:'mousemove',
-            padding:10,
-            textStyle:{
-              fontSize:18
-            },
-            formatter: function (params) {
-              return  params.marker + " <span style=\"font-weight: normal\"> " + params.name + "</span>  <span style=\"color:#e1e52a;font-weight: bolder\">&nbsp;&nbsp;" + params.value + "</span>"
-            },
-            enterable:true,
-            position: function(point, params, dom, rect, size) {
-              //其中point为当前鼠标的位置，size中有两个属性：viewSize和contentSize，分别为外层div和tooltip提示框的大小
-              var x = point[0]; //
-              var y = point[1];
-              var viewWidth = size.viewSize[0];
-              var viewHeight = size.viewSize[1];
-              var boxWidth = size.contentSize[0];
-              var boxHeight = size.contentSize[1];
-              var posX = 0; //x坐标位置
-              var posY = 0; //y坐标位置
-              if (x < boxWidth) { //左边放不开
-                posX = 5;
-              } else { //左边放的下
-                posX = x - boxWidth;
-              }
-
-              if (y < boxHeight) { //上边放不开
-                posY = 5;
-              } else { //上边放得下
-                posY = y - boxHeight;
-              }
-              return [posX, posY];
-            },
-            extraCssText:'width: auto;height:auto;',
-          },
-          legend: {
-            show:false,
-            orient: 'horizontal',
-            icon: 'circle',
-            x: 'center',
-            bottom: '6%',
-            itemWidth: 20 ,
-            itemHeight: 10 ,
-            textStyle: {
-              fontSize: 12 ,
-              padding: [0, 0, 0, 4 ],
-              color: '#ffffff'
-            },
-            data: this.name
-          },
-          series: [
-            {
-              name: '总客户数',
-              type: 'pie',
-              radius: ['45%', '65%'],
-              center: ['50%', '40%'],
-              // minAngle: 15,//最小角度
-              // startAngle: 300, //起始角度
-              hoverAnimation: false,
-              label: {
-                show:false
-              },
-              itemStyle: {
-                opacity:0
-              },
-
-              data: appendBaseColor(echartData,color,1)
-            }
-          ]
-        }
-
-        oroptionmapjsonr_charts.setOption(option);
-
-        // 轮播
-        let idx = 0;
-        var dataLen=echartData.length
-        this.timer=setInterval(()=>{
-          // 取消之前选中的图形
-          oroptionmapjsonr_charts.dispatchAction({
-            type: 'pieUnSelect',
-            seriesIndex: 0,
-            dataIndex: idx,
-          });
-
-          idx = (idx+ 1) % dataLen;
-          //console.log(app.currentIndex);
-          // 选中当前图形
-          oroptionmapjsonr_charts.dispatchAction({
-            type: 'pieSelect',
-            seriesIndex: 0,
-            dataIndex: idx
-          });
-          oroptionmapjsonr_charts.dispatchAction({
-            type: 'showTip',
-            seriesIndex: 0,
-            dataIndex: idx
-          });
-
-        }, 3000)
-
-      },
-      searchdata() {
-        console.log('进入用气性质查询-------------------')
-        let year = Util.toStandardDateString()
-        year = year.toString().substring(0, 4)
-        // startDate.toString().substring(0,4)
-        let sqldata = DataSql.getData(this, 'gasproperties', {orgid: this.orgid}, 'resdata')
-        co(sqldata)
-      },
-    },
-    watch: {
-      'resdata': {
-        deep: true,
-        handler(val) {
-          clearInterval(this.timer);
-          this.echartData=[]
-          this.name=[]
-          this.value=[]
-          console.log('resdata监听 进入用气性质查询====================================')
-          console.log(val)
-          let name=[]
-          for (let i = 0; i < val.length; i++) {
-            console.log('1111111111111111111111111111111111111111111111')
-            console.log(val[i]===null)
-            if(val[i].name===null){
-              name.push('其他')
-            }else{
-              name.push(val[i].name)
-            }
-
-          }
-
-          console.log('--------------------------------==================================sdasgdyjfashdgcqwgujefq3ty')
-          console.log(name)
-          console.log(name[0])
-          if(name[0]==='工业用气'){
-            this.value[0]=0
-            this.name[0]='其他'
-            for (let i = 0; i < val.length; i++) {
-              this.value[i+1]=val[i].value
-              this.name[i+1]=val[i].name
-            }
-          }
-          if(name[0]==='民用用气'){
-            this.value[0]=0
-            this.name[0]='其他'
-            this.value[1]=0
-            this.name[1]='工业用气'
-            for (let i = 0; i < val.length; i++) {
-              this.value[i+2]=val[i].value
-              this.name[i+2]=val[i].name
-            }
-          }
-          if(name[0]==='商业用气'){
-            this.value[0]=0
-            this.name[0]='其他'
-            this.value[1]=0
-            this.name[1]='工业用气'
-            this.value[2]=0
-            this.name[2]='民用用气'
-            for (let i = 0; i < val.length; i++) {
-              this.value[i+3]=val[i].value
-              this.name[i+3]=val[i].name
-            }
-          }
-          if(name[0]==='其他'){
-            for (let i = 0; i < val.length; i++) {
-              var object={
-                name:val[i].name===null?'其他':val[i].name,
-                value:val[i].value,
-              }
-              console.log(val[i].value)
-              console.log(val[i].name)
-              this.echartData.push(object)
-              console.log( this.echartData)
-            }
-          }
-          this.setBar()
-        }
-      },
-      'orgid'(val) {
-        console.log('进入orgid监听===================12312333333333333====')
-        console.log(val)
-        console.log(this.orgid)
-        clearInterval(this.timer);
-
-        this.searchdata()
-      },
-    },
-    ready() {
-      // this.searchdata()
-    }
-  }
-</script>
-
-<style scoped>
-
-</style>
+<style scoped>
+
+</style>
+<template>
+  <div>
+    <span class="title-1">用气性质分布图</span>
+    <div class="text-1">
+      <div id="TextGasProperties"></div>
+    </div>
+    <img class="img-bottom" src="/static/NewManageHome/1.gif"/>
+  </div>
+</template>
+
+<script>
+  import * as DataSql from '../../../stores/DataSql'
+  import co from 'co'
+  import * as Util from "../../../stores/Util";
+
+
+  export default {
+    name: "TextGasProperties",
+    props: ['orgid'],
+    data() {
+      return {
+
+        xc: '',
+        timer: '',
+        resdata: [],
+        name: [],
+        value: [],
+        start: 0,
+        end: 2,
+        echartData:[]
+      }
+    },
+    methods: {
+      setBar() {
+        this.xc = this.$echarts.init(document.getElementById('TextGasProperties'))
+        var echartData = this.echartData
+        var rich = {
+          blue: {
+            color: '#15dce2',
+            fontSize: 12 ,
+            align: 'center',
+            padding: [15, 0, 15, 0]
+          }
+        }
+        var total = 0; //用户总和
+        var result = ''
+        echartData.forEach(function (value) {
+          total +=value.value;
+        });
+        var index = total.toString().length
+        if (index > 4) {
+          console.log('total---------------------------------')
+          console.log(total)
+          var t = total.toString().substring(0, index - 4)
+          var s = total.toString().substring(index - 4, index - 3)
+          var l = total.toString().substring(index - 3, index - 2)
+          if (l > 4) {
+            s = eval(s + '+1')
+          }
+          if (s > 9) {
+            s = 0
+            t = eval(t + '+1')
+          }
+          result = t + '.' + s + '万'
+        }
+        // else {
+        //   result=total
+        // }
+        var color= ['#6fd9d0', '#ede61f', '#3a6cb2','#6d9bdc']
+        function appendBaseColor(dataList, colorList, opacity){
+          const temp = [];
+          for (let i in dataList) {
+            const tempObj = {
+              ...dataList[i],
+              itemStyle: {
+                color: colorList[i],
+                opacity: opacity
+              }
+            };
+            temp.push(tempObj)
+          }
+          return temp;
+        }
+        var oroptionmapjsonr_charts=this.xc
+        var option={
+          title: [
+            {
+              text: '总客户数',
+              left: '44%',
+              top: '25%',
+              textStyle: {
+                color: '#ffffff',
+                fontSize: 16 ,
+
+              }
+            },
+            {
+              text: result,
+              left: '45%',
+              top: '35%',
+              padding: [10 , 10 ],
+              textStyle: {
+                color: '#00e2ea',
+                fontSize: 16 ,
+
+              }
+            }],
+          tooltip: {
+            show: true,
+            alwaysShowContent:true,
+            backgroundColor:'#01396d',
+            // borderColor :'rgba(13, 109, 180)',
+            borderWidth:0,
+            hideDelay:100,
+            triggerOn:'mousemove',
+            padding:10,
+            textStyle:{
+              fontSize:18
+            },
+            formatter: function (params) {
+              return  params.marker + " <span style=\"font-weight: normal\"> " + params.name + "</span>  <span style=\"color:#e1e52a;font-weight: bolder\">&nbsp;&nbsp;" + params.value + "</span>"
+            },
+            enterable:true,
+            position: function(point, params, dom, rect, size) {
+              //其中point为当前鼠标的位置，size中有两个属性：viewSize和contentSize，分别为外层div和tooltip提示框的大小
+              var x = point[0]; //
+              var y = point[1];
+              var viewWidth = size.viewSize[0];
+              var viewHeight = size.viewSize[1];
+              var boxWidth = size.contentSize[0];
+              var boxHeight = size.contentSize[1];
+              var posX = 0; //x坐标位置
+              var posY = 0; //y坐标位置
+              if (x < boxWidth) { //左边放不开
+                posX = 5;
+              } else { //左边放的下
+                posX = x - boxWidth;
+              }
+
+              if (y < boxHeight) { //上边放不开
+                posY = 5;
+              } else { //上边放得下
+                posY = y - boxHeight;
+              }
+              return [posX, posY];
+            },
+            extraCssText:'width: auto;height:auto;',
+          },
+          legend: {
+            show:false,
+            orient: 'horizontal',
+            icon: 'circle',
+            x: 'center',
+            bottom: '6%',
+            itemWidth: 20 ,
+            itemHeight: 10 ,
+            textStyle: {
+              fontSize: 12 ,
+              padding: [0, 0, 0, 4 ],
+              color: '#ffffff'
+            },
+            data: this.name
+          },
+          series: [
+            {
+              name: '总客户数',
+              type: 'pie',
+              radius: ['45%', '65%'],
+              center: ['50%', '40%'],
+              // minAngle: 15,//最小角度
+              // startAngle: 300, //起始角度
+              hoverAnimation: false,
+              label: {
+                show:false
+              },
+              itemStyle: {
+                opacity:0
+              },
+
+              data: appendBaseColor(echartData,color,1)
+            }
+          ]
+        }
+
+        oroptionmapjsonr_charts.setOption(option);
+
+        // 轮播
+        let idx = 0;
+        var dataLen=echartData.length
+        this.timer=setInterval(()=>{
+          // 取消之前选中的图形
+          oroptionmapjsonr_charts.dispatchAction({
+            type: 'pieUnSelect',
+            seriesIndex: 0,
+            dataIndex: idx,
+          });
+
+          idx = (idx+ 1) % dataLen;
+          //console.log(app.currentIndex);
+          // 选中当前图形
+          oroptionmapjsonr_charts.dispatchAction({
+            type: 'pieSelect',
+            seriesIndex: 0,
+            dataIndex: idx
+          });
+          oroptionmapjsonr_charts.dispatchAction({
+            type: 'showTip',
+            seriesIndex: 0,
+            dataIndex: idx
+          });
+
+        }, 3000)
+
+      },
+      searchdata() {
+        console.log('进入用气性质查询-------------------')
+        let year = Util.toStandardDateString()
+        year = year.toString().substring(0, 4)
+        // startDate.toString().substring(0,4)
+        let sqldata = DataSql.getData(this, 'gasproperties', {orgid: this.orgid}, 'resdata')
+        co(sqldata)
+      },
+    },
+    watch: {
+      'resdata': {
+        deep: true,
+        handler(val) {
+          clearInterval(this.timer);
+          this.echartData=[]
+          this.name=[]
+          this.value=[]
+          console.log('resdata监听 进入用气性质查询====================================')
+          console.log(val)
+          let name=[]
+          for (let i = 0; i < val.length; i++) {
+            console.log('1111111111111111111111111111111111111111111111')
+            console.log(val[i]===null)
+            if(val[i].name===null){
+              name.push('其他')
+            }else{
+              name.push(val[i].name)
+            }
+
+          }
+
+          console.log('--------------------------------==================================sdasgdyjfashdgcqwgujefq3ty')
+          console.log(name)
+          console.log(name[0])
+          if(name[0]==='工业用气'){
+            this.value[0]=0
+            this.name[0]='其他'
+            for (let i = 0; i < val.length; i++) {
+              this.value[i+1]=val[i].value
+              this.name[i+1]=val[i].name
+            }
+          }
+          if(name[0]==='民用用气'){
+            this.value[0]=0
+            this.name[0]='其他'
+            this.value[1]=0
+            this.name[1]='工业用气'
+            for (let i = 0; i < val.length; i++) {
+              this.value[i+2]=val[i].value
+              this.name[i+2]=val[i].name
+            }
+          }
+          if(name[0]==='商业用气'){
+            this.value[0]=0
+            this.name[0]='其他'
+            this.value[1]=0
+            this.name[1]='工业用气'
+            this.value[2]=0
+            this.name[2]='民用用气'
+            for (let i = 0; i < val.length; i++) {
+              this.value[i+3]=val[i].value
+              this.name[i+3]=val[i].name
+            }
+          }
+          if(name[0]==='其他'){
+            for (let i = 0; i < val.length; i++) {
+              var object={
+                name:val[i].name===null?'其他':val[i].name,
+                value:val[i].value,
+              }
+              console.log(val[i].value)
+              console.log(val[i].name)
+              this.echartData.push(object)
+              console.log( this.echartData)
+            }
+          }
+          this.setBar()
+        }
+      },
+      'orgid'(val) {
+        console.log('进入orgid监听===================12312333333333333====')
+        console.log(val)
+        console.log(this.orgid)
+        clearInterval(this.timer);
+
+        this.searchdata()
+      },
+    },
+    ready() {
+      // this.searchdata()
+    }
+  }
+</script>
+
+<style scoped>
+
+</style>