manage-client 3.2.83-aode → 3.2.83-jb

package/src/components/statistical/DendrogramsManage.vue

@@ -0,0 +1,308 @@
+<template>
+  <div>
+    <div novalidate class="form-horizontal select-overspread container-fluid auto" partial >
+      <div class="col-sm-3 form-group">
+        <label class="font_normal_body" for="startDate">开始日期:</label>
+        <datepicker id="startDate" placeholder="开始日期"
+                    style="width:60%"
+                    v-model="models.startDate"
+                    :value.sync="models.startDate"
+                    :disabled-days-of-Week="[]"
+                    class="datepicker"
+                    :format="'yyyy-MM-dd'"
+                    :show-reset-button="reset">
+        </datepicker>
+      </div>
+      <div class="col-sm-3 form-group">
+        <label class="font_normal_body" for="endDate">结束日期:</label>
+        <datepicker id="endDate" placeholder="结束日期"
+                    style="width:60%"
+                    class="datepicker"
+                    v-model="models.endDate"
+                    :value.sync="models.endDate"
+                    :disabled-days-of-Week="[]"
+                    :format="'yyyy-MM-dd'"
+                    :show-reset-button="reset">
+        </datepicker>
+      </div>
+    </div>
+    <div class="text-1">
+      <div id="chart"></div>
+    </div>
+  </div>
+</template>
+
+<script>
+import {HttpResetClass} from "vue-client";
+import * as Util from "../../Util";
+
+export default {
+  title: "树状图2",
+  data() {
+    return {
+      model: {},
+      models: {
+        startDate: Util.toStandardDateString(),
+        endDate: Util.toStandardDateString()
+      },
+      gasmoney: '',
+      fengasmoney:'',
+      zone: ''
+    }
+  },
+  watch: {
+    'models.startDate'(val) {
+      if (val) {
+        console.log(val)
+        this.ks()
+      }
+
+    },
+    'models.endDate'(val) {
+      if (val) {
+        console.log(val)
+        this.ks()
+      }
+    },
+  },
+  methods: {
+    setBar() {
+      console.log('进入画图~~~~~~~~~~~~~~~~~~~')
+      console.log(this.model)
+      this.xc = this.$echarts.init(document.getElementById('chart'))
+      this.xc.setOption({
+        tooltip: {
+          trigger: 'item',
+          triggerOn: 'mousemove'
+        },
+        legend: {
+          top: '2%',
+          left: '3%',
+          orient: 'vertical',
+          data: [{
+            name: 'tree1',
+            icon: 'rectangle'
+          }],
+          borderColor: '#c23531'
+        },
+        series: [
+          {
+            type: 'tree',
+
+            data: [this.model],
+
+            top: '5%',
+            left: '10%',
+            bottom: '2%',
+            right: '20%',
+
+            symbolSize: 7,
+
+            label: {
+              position: 'left',
+              verticalAlign: 'middle',
+              align: 'right'
+            },
+
+            leaves: {
+              label: {
+                position: 'right',
+                verticalAlign: 'middle',
+                align: 'left'
+              }
+            },
+
+            emphasis: {
+              focus: 'descendant'
+            },
+
+            expandAndCollapse: true,
+
+            animationDuration: 550,
+            animationDurationUpdate: 750
+
+          },
+        ]
+      })
+    },
+    async getgasmoney() {
+      let HttpReset = new HttpResetClass()
+      //获取公司的总用气量和总金额
+      let getgasmoney = await HttpReset.load('post', 'rs/sql/getGasmoney', {
+        data: {
+          startDate: this.models.startDate,
+          endDate: this.models.endDate
+        }
+      })
+      console.log("111111111111111", getgasmoney)
+      this.gasmoney = getgasmoney.data
+    },
+    async getfengasmoney() {
+      let HttpReset = new HttpResetClass()
+      //获取分公司总用气量和总金额
+      let getfengasmoney = await HttpReset.load('post', 'rs/sql/getFengasmoney', {
+        data: {
+          startDate: this.models.startDate,
+          endDate: this.models.endDate
+        }
+      })
+      console.log("2222222222222222", getfengasmoney)
+      this.fengasmoney = getfengasmoney.data
+    },
+    async getzone() {
+      let HttpReset = new HttpResetClass()
+      //获取分公司总用气量和总金额
+      let getzone = await HttpReset.load('post', 'rs/sql/getZone', {
+        data: {
+          startDate: this.models.startDate,
+          endDate: this.models.endDate
+        }
+      })
+      console.log("2222222222222222", getzone)
+      this.zone = getzone.data
+    },
+    // dataGeneration() {
+    //   let group = this.quchong(this.fengasmoney, 'name')
+    //   console.log('筛选', group)
+    //   let model = {
+    //     name: '渭南天然气公司' + `\n (${this.gasmoney[0].f_meter_classify})` + `\n '金额:'(${this.gasmoney[0].money})`
+    //       + `\n '气量:'(${this.gasmoney[0].gas})` + `\n (${this.gasmoney[1].f_meter_classify})` + `\n '金额:'(${this.gasmoney[1].money})`
+    //       + `\n '气量:'(${this.gasmoney[1].gas})`,
+    //     children: []
+    //   }
+    //   for (let row2 of group) {
+    //     let obj1 = {
+    //
+    //     }
+    //
+    //     const filter1 = this.conditionGenerate(this.fengasmoney, 'name', row2)
+    //     for(let row3 of filter1){
+    //       let obj1 = {
+    //         name: row3.name
+    //           + `\n (${row3.f_meter_classify})` + `\n '金额:'(${row3.money})`
+    //           + `\n '气量:'(${row3.gas})` + `\n (${row3.f_meter_classify})` + `\n '金额:'(${row3.money})`
+    //           + `\n '气量:'(${row3.gas})`,
+    //         children: []
+    //       }
+    //       console.log("obj1",obj1)
+    //       model.children.push(obj1)
+    //     }
+    //   }
+    //
+    //   this.model=m
+    dataGeneration() {
+      let model = {
+        name: '渭南天然气公司',
+        children: []
+      }
+      console.log('aaaa')
+      for (let i = 0; i < this.gasmoney.length; i++) {
+        let obj = {
+          name: this.gasmoney[i].f_meter_classify + `\n '气量:'(${this.gasmoney[i].gas})` + `\n '金额:'(${this.gasmoney[i].money})`,
+          children: []
+        }
+        if (i == 1) {
+          let obj_xs1 = {
+            name: '详情',
+            children: []
+          }
+          model.children.push(obj_xs1)
+          let group = this.quchong(this.fengasmoney, 'name')
+          for (let row of group) {
+            let obj1 = {
+              name: row,
+              children: []
+            }
+            let filter1 = this.conditionGenerate(this.fengasmoney, 'name', row)
+            for (let j = 0; j < filter1.length; j++) {
+              let obj2 = {
+                name: filter1[j].f_meter_classify + `\n '气量:'(${filter1[j].gas})` + `\n '金额:'(${filter1[j].money})`,
+                children: []
+              }
+              if (j == 1) {
+                let obj_xs2 = {
+                  name: '详情',
+                  children: []
+                }
+                let data1 = this.conditionGenerate(this.zone, 'name', row)
+                let group1 = this.quchong(data1, 'f_district')
+                // let data1 = this.conditionGenerate(this.zone, ['name',''], [row,group1])
+                obj1.children.push(obj_xs2)
+                for (let row2 of group1) {
+                  let obj3 = {
+                    name: row2,
+                    children: []
+                  }
+                  let filter2 = this.conditionGenerate(data1, 'f_district', row2)
+                  for (let row3 of filter2) {
+                    let obj4 = {
+                      name: row3.f_meter_classify + `\n '气量:'(${row3.gas})` + `\n '金额:'(${row3.money})`,
+                      children: []
+                    }
+                    obj3.children.push(obj4)
+                  }
+                  obj_xs2.children.push(obj3)
+                }
+              }
+              obj1.children.push(obj2)
+            }
+            obj_xs1.children.push(obj1)
+          }
+        }
+        model.children.push(obj)
+      }
+      console.log('ppp')
+      this.model = model
+    },
+    /**
+     * 数组筛选
+     * @param data 要筛选的数组
+     * @param key 筛选的key,可以是数组
+     * @param value 筛选key对应的value值,可以是数组
+     * @returns {Array}
+     */
+    conditionGenerate(data, key, value) {
+      const group = []
+      for (let row of data) {
+        if (key instanceof Array) {
+          let flag = true
+          for (let [index, item] of key.entries()) {
+            if (row[item] != value[index]) {
+              flag = false
+            }
+          }
+          if (flag) group.push(row)
+        } else {
+          if (row[key] == value) {
+            group.push(row)
+          }
+        }
+      }
+      return group
+    },
+    quchong(data, key) {
+      const group = []
+      for (let row of data) {
+        if (!group.includes(row[key])) {
+          group.push(row[key])
+        }
+      }
+      return group
+    },
+    async ks() {
+      await this.getgasmoney()
+      await this.getfengasmoney()
+      await this.getzone()
+      this.dataGeneration()
+      this.setBar()
+    }
+  },
+  ready() {
+    this.ks()
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

package/src/components/statistical/StatisticalAnalysis.vue

@@ -0,0 +1,252 @@
+<template lang="html">
+  <div :class="classname"  :style="{width:width,height:height}">
+    <div style="height: 97%;">
+      <div class="col-sm-3" style="height: 97%">
+        <div class="row form-group" style="height: 5%">
+            <label class="font_normal_body" >使用公司:</label>
+          <res-select :initresid='model.orgid'
+                      @res-select="getorg"
+                      :is-mul="false"
+                      class="select select_list"
+                      restype='organization'
+                      style="width: 60%">
+          </res-select>
+        </div>
+        <div class="row" style="margin-left: 5%;margin-right: 5%;height: 15%;text-align:center;" >
+          <h4 style="font-size: 18px;">用户数量</h4>
+          <table class="col-sm-12 table table-bordered table-striped" style="font-size: 16px;">
+            <tr class="text-center">
+              <th style="text-align:center;"><nobr>现有户数</nobr></th>
+              <th style="text-align:center;"><nobr>年度新增</nobr></th>
+              <th style="text-align:center;"><nobr>本月新增</nobr></th>
+              <th style="text-align:center;"><nobr>未开户数</nobr></th>
+            </tr>
+            <tr>
+              <td style="text-align:center;"><nobr>{{num}}</nobr></td>
+              <td style="text-align:center;"><nobr>{{year}}</nobr></td>
+              <td style="text-align:center;"><nobr>{{month}}</nobr></td>
+              <td style="text-align:center;"><nobr>{{noopen}}</nobr></td>
+            </tr>
+          </table>
+        </div>
+        <div style="width: 100%;height: 40%;margin-top: 10%;text-align:center;">
+          <h4 style="font-size: 18px;">民用分类实有户数</h4>
+          <ring-chart :sdata="sdata2" ></ring-chart>
+        </div>
+        <div style="width: 100%;height: 40%;text-align:center;">
+          <h4 style="font-size: 18px;">工商业分类实有户数</h4>
+          <ring-chart :sdata="sdata1" ></ring-chart>
+        </div>
+      </div>
+      <div class="col-sm-6" style="height: 97%;text-align:center;">
+        <h3>营收系统数据统计信息</h3>
+        <div style="width: 100%;height: 50%">
+          <div>
+            <bar-chart :xdata="xdata" :sdata="sdata" :legend="legendData" :xname="xname" :yname="yname"> </bar-chart>
+          </div>
+        </div>
+        <div style="width: 100%;height: 50%">
+        <div>
+<!--          <bussiness-type :orgid='model.orgid[0]' v-ref:pay ></bussiness-type>-->
+          <bar-chart :xdata="xdata3" :sdata="sdata3" :legend="legendData1" :xname="xname" :yname="yname"> </bar-chart>
+        </div>
+        </div>
+      </div>
+      <div class="col-sm-3" style="height: 97%">
+          <div style="width: 100%;height: 95%;margin-top: 10%;margin-right: 5%;" align="center">
+            <h4 style="font-size: 18px;">各类表具在用用户数量</h4>
+            <data-grid :model=mood class="table_sy"  partial='list' >
+              <template partial='head' >
+                <tr>
+                  <th><nobr>气表品牌</nobr></th>
+                  <th><nobr>使用户数</nobr></th>
+                  <th><nobr>异常户数</nobr></th>
+                </tr>
+              </template>
+              <template partial='body' >
+                <tr>
+                  <td><nobr>{{row.f_meter_brand}}</nobr></td>
+                  <td><nobr>{{row.num}}</nobr></td>
+                  <td><nobr>{{row.c}}</nobr></td>
+                </tr>
+              </template>
+            </data-grid>
+        </div>
+      </div>
+    </div>
+  </div>
+
+</template>
+
+<script>
+import * as Util from '../../Util'
+import { HttpResetClass } from 'vue-client'
+
+export default {
+  title: '分析统计',
+  props: {
+    classname: {
+      type: String,
+      default: 'basic-main'
+    },
+    width: {
+      type: String,
+      default: '98.5%'
+    },
+    height: {
+      type: String,
+      default: '98%'
+    }
+  },
+  watch:{
+    'f_orgid'(val) {
+      // if (val) {
+        this.ks()
+      // }
+    }
+  },
+  data() {
+    return {
+      jurisdiction: this.$login.r,
+      model: {
+        orgid: [this.$login.f.orgid],
+        startDate: Util.toStandardDateString(),
+        endDate: Util.toStandardDateString()
+      },
+      f_orgid: '',
+      xdata:[],
+      sdata: [],
+      legendData: ['民用'],
+      sdata1:[],
+      sdata2:[],
+      legendData1: ['非民用'],
+      xdata3: [],
+      sdata3: [],
+      xname:"年份",
+      yname:"户数",
+      num:'',
+      year:'',
+      month:'',
+      noopen:'',
+      arr:[],
+      arrs:[],
+      mood:'',
+      resoptions: []
+    }
+
+  },
+  ready() {
+
+  },
+  methods: {
+    ks(){
+        this.xdata = []
+        this.sdata =  []
+        this.sdata1 = []
+        this.sdata2 = []
+        this.xdata3 =  []
+        this.sdata3 =  []
+        this.num = ''
+        this.year = ''
+        this.month = ''
+        this.noopen = ''
+        this.arr = []
+        this.arrs = []
+        this.mood = ''
+      this.getuser()
+      this.getType()
+      this.getType1()
+      this.getnumber()
+      this.getnumber1()
+      this.getmeterbrand()
+      console.log("7777777777777",this.sdata)
+    },
+    getorg (val) {
+      this.f_orgid = this.$login.convertToIn(val)
+      // this.$parent.f_orgid = this.f_orgid
+    },
+    async getuser (){
+      let load = new HttpResetClass()
+      // let id = this.model.orgid.toString()
+      await load.load('POST','rs/sql/getUser', {data: {f_orgid: this.f_orgid}}).then((res) => {
+          console.log("加载res",res)
+        for (var i = 0; i < res.data.length; i++) {
+          this.num = res.data[i].number
+          this.year = res.data[i].year
+          this.month = res.data[i].month
+          this.noopen = res.data[i].noopen
+        }
+        })
+    },
+    async getType (){
+      let load = new HttpResetClass()
+      // let id = this.model.orgid.toString()
+      await load.load('POST','rs/sql/getTypess', {data: {f_orgid: this.f_orgid}}).then((res) => {
+        const rdata = res.data
+        for (let i = 0; i < rdata.length; i++) {
+          const object={
+              value: rdata[i].f_type,
+              name: rdata[i].f_devices_type
+          }
+          this.sdata2.push(object)
+        }
+      })
+    },
+    async getType1 (){
+      let load = new HttpResetClass()
+      // let id = this.model.orgid.toString()
+      await load.load('POST','rs/sql/getTypek', {data: {f_orgid: this.f_orgid}}).then((res) => {
+        const rdata = res.data
+        for (let i = 0; i < rdata.length; i++) {
+          const object = {
+            value:rdata[i].f_type,
+            name:rdata[i].f_devices_type
+          }
+          this.sdata1.push(object)
+        }
+      })
+    },
+    async getnumber (){
+      let load = new HttpResetClass()
+      // let id = this.model.orgid.toString()
+      await load.load('POST','rs/sql/getNumberss', {data: {f_orgid: this.f_orgid}}).then((res) => {
+        const rdata=res.data
+        for (let i = 0; i < rdata.length; i++) {
+          this.arr.push(rdata[i].num)
+          this.xdata.push(rdata[i].f_gas_date)
+        }
+        this.sdata.push(this.arr)
+      })
+    },
+    async getnumber1 (){
+      let load = new HttpResetClass()
+      // let id = this.model.orgid.toString()
+      await load.load('POST','rs/sql/getNumbers', {data: {f_orgid: this.f_orgid}}).then((res) => {
+        console.log("加载res3",res)
+        const rdata=res.data
+        for (let i = 0; i < rdata.length; i++) {
+          console.log(rdata[i].f_gas_date)
+          console.log(rdata[i].num)
+          this.arrs.push(rdata[i].num)
+          this.xdata3.push(rdata[i].f_gas_date)
+        }
+        console.log("222222222222222222222222",this.xdata3)
+        this.sdata3.push(this.arrs)
+      })
+    },
+    async getmeterbrand (){
+      let load = new HttpResetClass()
+      // let id = this.model.orgid.toString()
+      await load.load('POST','rs/sql/getMeterbrand', {data: {f_orgid: this.f_orgid}}).then((res) => {
+        this.mood=res
+      })
+    }
+    // searchdata () {
+    //   this.$refs.pay.searchdata()
+    // },
+  }
+}
+</script>
+
+<style lang="css">
+</style>