manage-client 3.2.16 → 3.2.20

package/src/components/webmeter/newwebmeter/signAnalysisEcharts.vue

@@ -1,266 +1,266 @@
-<template lang="html">
-  <div class="basic-main" style="height: 98%;">
-    <div class="row" style="height: 40px;width: 100%;" v-show="echarts">
-      <div class="col-sm-2" style="display: inline-block;">
-        <button @click="$parent.notShowEcharts()" class="button_clear button_spacing">隐藏图表</button>
-      </div>
-      <!--图显示模板-->
-      <div class="row col-sm-3 mystyle" style="display: inline-block;">
-        <label class="font_normal_body">图表统计项</label>
-        <v-select :options='$parent.getgroupname' :value.sync="groupname"
-                  close-on-select
-                  id="groupname"
-                  placeholder='分组项'
-                  v-model="groupname"
-                  value-single="true"></v-select>
-      </div>
-    </div>
-    <div id="charts" style=" height: 98%;width: 98%;padding: 1% 1%;">
-      <div id="signInfo"></div>
-    </div>
-  </div>
-</template>
-
-<script>
-  import * as Util from '../../../Util'
-  import co from 'co'
-  import echarts from 'echarts'
-  import {HttpResetClass} from 'vue-client'
-
-  let getData = function* (self, condition) {
-    let load = new HttpResetClass()
-    console.log("con:" + self.groupname)
-    load.load('POST', 'rs/sql/selectSignAnalysis',
-      {
-        data: {
-          condition: condition, groupname: self.groupname[0], startDate: self.startdate,
-          endDate: self.enddate
-        }
-      },
-      {resolveMsg: null, rejectMsg: null})
-      .then((res) => {
-        let arrparams = []
-        // let gasdata = []
-        let gettip = []
-        for (var i = 0; i < res.data.length; i++) {
-          arrparams[i] = res.data[i].f_parameter_date
-          gettip[i] = res.data[i].f_parameter_name
-        }
-        console.log("res" + res.data)
-        gettip = uniqueArray(gettip);
-        arrparams = uniqueArray(arrparams);
-        self.set(arrparams, res.data, gettip)
-        console.log("tip", gettip)
-      })
-  }
-
-  function selectArray(res, str) {
-    let j = 0;
-    let sum = 0;
-    let data = []
-    //上一轮是否在data中添加成功
-    let mark = false
-    for (let i = 0; i < res.length; i++) {
-      if (i != 0) {
-        if (res[i].f_parameter_date == res[i - 1].f_parameter_date) {
-          if (res[i].f_parameter_name == str) {
-            data[j] = res[i].s
-            mark = true;
-            j++;
-          }
-        } else {
-          if (!mark) {
-            data[j] = 0;
-            j++;
-            mark = true
-          }
-          if (res[i].f_parameter_name == str) {
-            data[j] = res[i].s
-            mark = true;
-            j++;
-          } else {
-            mark = false;
-          }
-        }
-      } else {
-        if (res[i].f_parameter_name == str) {
-          data[j] = res[i].s
-          mark = true;
-          j++;
-        } else {
-          mark = false;
-        }
-      }
-      if (i == res.length - 1 && !mark) {
-        data[j] = 0;
-      }
-    }
-    console.log("我" + data)
-    return data;
-  }
-
-  function uniqueArray(data) {
-    data = data || [];
-    var a = {};
-    for (var i = 0; i < data.length; i++) {
-      var v = data[i];
-      if (typeof (a[v]) == 'undefined') {
-        a[v] = 1;
-      }
-    }
-    data.length = 0;
-    for (var i in a) {
-      data[data.length] = i;
-    }
-    console.log("data" + data)
-    return data;
-  }
-
-  export default {
-    props: {
-      echarts: {
-        type: Boolean,
-        default:false
-      },
-      startdate: {
-        type: String,
-        default: Util.toStandardDateString()
-      },
-      enddate: {
-        type: String,
-        default: Util.toStandardDateString()
-      },
-      condition: {
-        type: String,
-        default: '1=1'
-      }
-    },
-    data() {
-      title: '业务类型'
-      return {
-        groupname: ['year'],
-        getgroupname: [
-          {label: '年份', value: 'year'},
-          {label: '月份', value: 'month'},
-          {label: '周', value: 'week'},
-          {label: '日', value: 'day'}
-        ],
-        condition: '',
-        xc: '',
-        timer: 0,//定时器
-        height: 0,
-        width: 0
-      }
-    },
-    ready(){
-      console.log(this.groupname[0]+"==="+this.echarts)
-    },
-    methods: {
-      set(arrparams, res, gettip) {
-        let name = ''
-        if (this.groupname[0] === 'year') {
-          name = '年'
-        } else if (this.groupname[0] === 'month') {
-          name = '月'
-        } else if (this.groupname[0] === 'week') {
-          name = '周'
-        } else {
-          name = '日'
-        }
-        let series = [];
-        for (let i = 0; i < gettip.length; i++) {
-          series.push({
-            name: gettip[i],
-            type: 'bar',
-            data: selectArray(res, gettip[i])
-          });
-        }
-        this.xc = echarts.init(document.getElementById('signInfo'))
-        this.xc.setOption({
-          title: {
-            text: '标记' + name + '分析图',
-            'left': 'center',
-            'y': '10',
-            textStyle: {
-              color: '#000',
-              fontSize: 20
-            }
-          },
-          'tooltip': {
-            'trigger': 'axis',
-            'extraCssText': 'width: auto;height: auto;'
-          },
-          toolbox: {
-            show: true,
-            feature: {
-              dataView: {show: true, readOnly: false},
-              magicType: {show: true, type: ['line', 'bar']},
-              restore: {show: true},
-              saveAsImage: {show: true}
-            }
-          },
-          calculable: true,
-          legend: {
-            x: 'left', //靠左
-            data: gettip //这里要与下面的name对应
-          },
-          xAxis: [
-            {
-              name: '日期',
-              nameTextStyle: {
-                fontSize: 15
-              },
-              type: 'category',
-              data: arrparams,
-              axisLabel: {
-                show: true,
-                textStyle: {
-                  fontSize: 15
-                }
-              }
-            }
-          ],
-          yAxis: [
-            {
-              'type': 'value',
-              name: '标记个数',
-              nameTextStyle: {
-                fontSize: 15
-              },
-              'show': true,
-              axisLabel: {
-                show: true,
-                textStyle: {
-                  fontSize: 15,
-                  'color': '#7d8000'
-                }
-              }
-            }
-          ],
-          series: series
-        })
-      },
-      searchdata(condition) {
-        console.log(this.groupname[0])
-        let getGen = getData(this, condition)
-        co(getGen)
-      }
-    },
-    watch: {
-      'echarts'(val){
-        this.searchdata(this.condition)
-      },
-      'groupname'(val) {
-        this.searchdata(this.condition)
-      }
-    }
-  }
-</script>
-
-<style scoped>
-  #signInfo {
-    height: 98%;
-    width: 98%;
-    padding: 1% 1%;
-  }
-</style>
+<template lang="html">
+  <div class="basic-main" style="height: 98%;">
+    <div class="row" style="height: 40px;width: 100%;" v-show="echarts">
+      <div class="col-sm-2" style="display: inline-block;">
+        <button @click="$parent.notShowEcharts()" class="button_clear button_spacing">隐藏图表</button>
+      </div>
+      <!--图显示模板-->
+      <div class="row col-sm-3 mystyle" style="display: inline-block;">
+        <label class="font_normal_body">图表统计项</label>
+        <v-select :options='$parent.getgroupname' :value.sync="groupname"
+                  close-on-select
+                  id="groupname"
+                  placeholder='分组项'
+                  v-model="groupname"
+                  value-single="true"></v-select>
+      </div>
+    </div>
+    <div id="charts" style=" height: 98%;width: 98%;padding: 1% 1%;">
+      <div id="signInfo"></div>
+    </div>
+  </div>
+</template>
+
+<script>
+  import * as Util from '../../../Util'
+  import co from 'co'
+  import echarts from 'echarts'
+  import {HttpResetClass} from 'vue-client'
+
+  let getData = function* (self, condition) {
+    let load = new HttpResetClass()
+    console.log("con:" + self.groupname)
+    load.load('POST', 'rs/sql/selectSignAnalysis',
+      {
+        data: {
+          condition: condition, groupname: self.groupname[0], startDate: self.startdate,
+          endDate: self.enddate
+        }
+      },
+      {resolveMsg: null, rejectMsg: null})
+      .then((res) => {
+        let arrparams = []
+        // let gasdata = []
+        let gettip = []
+        for (var i = 0; i < res.data.length; i++) {
+          arrparams[i] = res.data[i].f_parameter_date
+          gettip[i] = res.data[i].f_parameter_name
+        }
+        console.log("res" + res.data)
+        gettip = uniqueArray(gettip);
+        arrparams = uniqueArray(arrparams);
+        self.set(arrparams, res.data, gettip)
+        console.log("tip", gettip)
+      })
+  }
+
+  function selectArray(res, str) {
+    let j = 0;
+    let sum = 0;
+    let data = []
+    //上一轮是否在data中添加成功
+    let mark = false
+    for (let i = 0; i < res.length; i++) {
+      if (i != 0) {
+        if (res[i].f_parameter_date == res[i - 1].f_parameter_date) {
+          if (res[i].f_parameter_name == str) {
+            data[j] = res[i].s
+            mark = true;
+            j++;
+          }
+        } else {
+          if (!mark) {
+            data[j] = 0;
+            j++;
+            mark = true
+          }
+          if (res[i].f_parameter_name == str) {
+            data[j] = res[i].s
+            mark = true;
+            j++;
+          } else {
+            mark = false;
+          }
+        }
+      } else {
+        if (res[i].f_parameter_name == str) {
+          data[j] = res[i].s
+          mark = true;
+          j++;
+        } else {
+          mark = false;
+        }
+      }
+      if (i == res.length - 1 && !mark) {
+        data[j] = 0;
+      }
+    }
+    console.log("我" + data)
+    return data;
+  }
+
+  function uniqueArray(data) {
+    data = data || [];
+    var a = {};
+    for (var i = 0; i < data.length; i++) {
+      var v = data[i];
+      if (typeof (a[v]) == 'undefined') {
+        a[v] = 1;
+      }
+    }
+    data.length = 0;
+    for (var i in a) {
+      data[data.length] = i;
+    }
+    console.log("data" + data)
+    return data;
+  }
+
+  export default {
+    props: {
+      echarts: {
+        type: Boolean,
+        default:false
+      },
+      startdate: {
+        type: String,
+        default: Util.toStandardDateString()
+      },
+      enddate: {
+        type: String,
+        default: Util.toStandardDateString()
+      },
+      condition: {
+        type: String,
+        default: '1=1'
+      }
+    },
+    data() {
+      title: '业务类型'
+      return {
+        groupname: ['year'],
+        getgroupname: [
+          {label: '年份', value: 'year'},
+          {label: '月份', value: 'month'},
+          {label: '周', value: 'week'},
+          {label: '日', value: 'day'}
+        ],
+        condition: '',
+        xc: '',
+        timer: 0,//定时器
+        height: 0,
+        width: 0
+      }
+    },
+    ready(){
+      console.log(this.groupname[0]+"==="+this.echarts)
+    },
+    methods: {
+      set(arrparams, res, gettip) {
+        let name = ''
+        if (this.groupname[0] === 'year') {
+          name = '年'
+        } else if (this.groupname[0] === 'month') {
+          name = '月'
+        } else if (this.groupname[0] === 'week') {
+          name = '周'
+        } else {
+          name = '日'
+        }
+        let series = [];
+        for (let i = 0; i < gettip.length; i++) {
+          series.push({
+            name: gettip[i],
+            type: 'bar',
+            data: selectArray(res, gettip[i])
+          });
+        }
+        this.xc = echarts.init(document.getElementById('signInfo'))
+        this.xc.setOption({
+          title: {
+            text: '标记' + name + '分析图',
+            'left': 'center',
+            'y': '10',
+            textStyle: {
+              color: '#000',
+              fontSize: 20
+            }
+          },
+          'tooltip': {
+            'trigger': 'axis',
+            'extraCssText': 'width: auto;height: auto;'
+          },
+          toolbox: {
+            show: true,
+            feature: {
+              dataView: {show: true, readOnly: false},
+              magicType: {show: true, type: ['line', 'bar']},
+              restore: {show: true},
+              saveAsImage: {show: true}
+            }
+          },
+          calculable: true,
+          legend: {
+            x: 'left', //靠左
+            data: gettip //这里要与下面的name对应
+          },
+          xAxis: [
+            {
+              name: '日期',
+              nameTextStyle: {
+                fontSize: 15
+              },
+              type: 'category',
+              data: arrparams,
+              axisLabel: {
+                show: true,
+                textStyle: {
+                  fontSize: 15
+                }
+              }
+            }
+          ],
+          yAxis: [
+            {
+              'type': 'value',
+              name: '标记个数',
+              nameTextStyle: {
+                fontSize: 15
+              },
+              'show': true,
+              axisLabel: {
+                show: true,
+                textStyle: {
+                  fontSize: 15,
+                  'color': '#7d8000'
+                }
+              }
+            }
+          ],
+          series: series
+        })
+      },
+      searchdata(condition) {
+        console.log(this.groupname[0])
+        let getGen = getData(this, condition)
+        co(getGen)
+      }
+    },
+    watch: {
+      'echarts'(val){
+        this.searchdata(this.condition)
+      },
+      'groupname'(val) {
+        this.searchdata(this.condition)
+      }
+    }
+  }
+</script>
+
+<style scoped>
+  #signInfo {
+    height: 98%;
+    width: 98%;
+    padding: 1% 1%;
+  }
+</style>