manage-client 3.2.88 → 3.2.89-aodeToV4

package/src/components/qinhua/BarChart.vue

@@ -1,258 +0,0 @@
-<template>
-  <div id="barchart" style="height: 100%;width:100%">
-  </div>
-</template>
-
-<script>
-  import {HttpResetClass} from 'vue-client'
-  export default {
-    title: '收费',
-    data() {
-      return{
-
-        xData : ['1', '2', '3', '4', '5', '6'],
-        yData : [12944, 72188, 55748, 36948, 28498, 27358]
-        // yData2 : [25968, 13128, 47838, 23148, 23498, 26538],
-      }
-    },
-    methods: {
-      init() {
-        var xData = this.xData,
-          yData = this.yData,
-          // yData2 = this.yData2,
-          borderData = [],
-          legend = ['总气量'],
-          colorArr = [{
-            start: 'rgba(242,153,97)',
-            mid: 'rgba(242,153,97,0.7)',
-            end: 'rgba(0, 0, 0,0.5)'
-          },
-            {
-              end: 'rgba(0, 0, 0,0.5)',
-              mid: 'rgba(111,217,208,0.7)',
-              start: 'rgba(111,217,208)'
-            },
-            {
-              color: '#00EAFF'
-            }
-          ]
-        let normalColor = 'rgba(8,115,142)'
-        let seriesData = []
-        var borderHeight = 4
-        xData.forEach(element => {
-          borderData.push(borderHeight)
-        });
-        [yData].forEach((item, index) => {
-          var obj1 = {}
-          obj1 = {
-            name: legend[index],
-            type: 'bar',
-            stack: legend[index],
-            data: item,
-            barWidth: '12px',
-            itemStyle: {
-              normal: {
-                barBorderRadius: [30, 30, 0, 0],
-                color: {
-                  type: 'linear',
-                  x: 0,
-                  y: 0,
-                  x2: 0,
-                  y2: 1,
-                  colorStops: [{
-                    offset: 0,
-                    color: colorArr[index].start
-                  },
-                    {
-                      offset: 1,
-                      color: colorArr[index].start
-                    },
-                    {
-                      offset: 1,
-                      color: colorArr[index].start
-                    }
-                  ],
-                  globalCoord: false
-                }
-              }
-            }
-          }
-          seriesData.push(obj1)
-        })
-        console.log(seriesData)
-        // 更改柱状图位置
-        let option = {
-          title:{
-            text:'总售气量分布',
-            x:'center',
-            y:'20',
-            backgroundColor: '#002c45', //标题背景颜色，默认'rgba(0,0,0,0)'透明
-            borderColor: '#01fee8', //标题边框颜色,默认'#ccc'
-            borderWidth: 1, //标题边框线宽，单位px，默认为0（无边框）
-            padding:5,
-            textStyle: {
-              fontSize: 12,
-              fontWeight: 'normal',
-              fontFamily: 'pFBold',
-              lineHeight: 26,
-              color: '#24d4d4',
-              align: 'center'
-            }},
-          backgroundColor: '#ffffff00',
-          grid: {
-            left: '2%',
-            top: '20%',
-            right: '10%',
-            bottom: '2%',
-            containLabel: true
-          },
-          legend: {
-            show: true,
-            icon: 'rect',
-            itemWidth: 15,
-            itemHeight: 10,
-            top: '10%',
-            right:'10%',
-            textStyle: {
-              color: '#fff'
-            },
-            data: legend
-          },
-          tooltip: {
-            position: function (pos, params, dom, rect, size) {
-              let yPos = '20%'
-              let xPos = 0
-              if (pos[0] < size.viewSize[0] / 2) {
-                xPos = pos[0] + 10
-              } else {
-                xPos = pos[0] - dom.offsetWidth - 10
-              }
-              return [xPos, yPos]
-            },
-            trigger: 'axis',
-            extraCssText: 'width:auto;height:30%;border:1px solid #015999;background:#032f53 ',
-            formatter: function (params) {
-              var str = ''
-              for (var i = 0; i < params.length; i++) {
-                if (params[i].seriesName !== '') {
-                  str += `<span>${params[i].seriesName}：</span><span style="color:gold">${params[i].value}</span> <br />`
-                }
-              }
-              return str
-            }
-          },
-          xAxis: [{
-            name: '近6月',
-            type: 'category',
-            nameTextStyle: {
-              color: '#95bad7',
-              fontSize: 12
-            },
-            data: xData,
-            interval: 0,
-            axisPointer: {
-              type: 'shadow'
-            },
-            axisLabel: {
-              textStyle: {
-                color: '#95bad7',
-                fontSize: '1vw'
-              }
-            },
-            axisLine: {
-              lineStyle: {
-                color: normalColor
-              }
-            },
-            axisTick: {
-              show: false
-            },
-            splitLine: {
-              show: false
-            }
-          }],
-          yAxis: [{
-            name: '单位（万方）',
-            type: 'value',
-            nameTextStyle: {
-              color: '#95bad7',
-              fontSize: 12
-            },
-            splitNumber : 3,
-            // 'min': 0,
-            // 'max': 50,
-            axisLabel: {
-              formatter: '{value}',
-              textStyle: {
-                color: '#95bad7',
-                fontSize: '1vw'
-              }
-            },
-            axisLine: {
-              lineStyle: {
-                color: normalColor
-              }
-            },
-            axisTick: {
-              show: false
-            },
-            splitLine: {
-              show: false,
-              lineStyle: {
-                type: 'dashed',
-                color: normalColor
-              }
-            }
-          }],
-          series: seriesData
-        }
-        console.log(option)
-        let barchart = this.$echarts.init(document.getElementById('barchart'))
-        console.log(option)
-        barchart.setOption(option)
-        var index = 0
-        // var mTime = setInterval(function () {
-        //   barchart.dispatchAction({
-        //     type: 'showTip',
-        //     seriesIndex: 0,
-        //     dataIndex: index
-        //   })
-        //   index++
-        //   if (index > xData.length) {
-        //     index = 0
-        //   }
-        // }, 1000)
-      }
-    },
-    ready() {
-      let http = new HttpResetClass()
-      http.load('post', '/rs/sql/getSellSumByMonth', {data:{}}, {rejectMsg: null, resolveMsg: null}).then((res)=>{
-        this.yData = res.data.map((item)=> (item.sumgas/10000).toFixed(2))
-        this.xData = res.data.map((item)=> item.time)
-        // console.log(this.yData1)
-        // this.yData1 =[]
-        // this.yData2=[]
-        // this.xData = []
-        // for(let i=0;i<res.data.length;i++){
-        //   if(res.data[i].natures==='民用'){
-        //     this.xData.push(res.data[i].time)
-        //     this.yData1.push((res.data[i].sumgas/10000).toFixed(2))
-        //   }
-        //   if(res.data[i].natures==='非民用'){
-        //     this.yData2.push((res.data[i].sumgas/10000).toFixed(2))
-        //   }
-        //
-        // }
-        this.init()
-
-      })
-    },
-    props: {}
-  }
-</script>
-<style scoped>
-  /*div{*/
-  /*height: auto;*/
-  /*}*/
-</style>
-

package/src/components/qinhua/BarChartLine.vue

@@ -1,288 +0,0 @@
-<template>
-  <div class="flex" style="width: 100%;height: 100%">
-
-    <div class="col-sm-12 auto" style="height: 30%;padding:1em">
-      <div class="row auto col-sm-12" style="padding-left: 4%">
-        <div class="col-sm-6">
-          <span class="font-title">热线</span>
-        </div>
-
-      </div>
-      <div class="col-sm-12 auto" style="padding: 1em">
-        <div class="col-sm-6 ">
-          <span class="normal-font" >当年呼入量</span><span id="huru">1314434</span>
-        </div>
-        <div class="col-sm-6 ">
-          <span class="normal-font" >人工接听量</span><span id="jieting">1206259</span>
-        </div>
-        <div class="col-sm-6 ">
-          <span class="normal-font" >报修工单量</span><span id="baoxiu">296043</span>
-        </div>
-        <div class="col-sm-6 ">
-          <span class="normal-font" >多媒体工单</span><span id="weixiu">117</span>
-        </div>
-      </div>
-    </div>
-    <div id="barchart-line" style="height: 70%;width:100%">
-    </div>
-  </div>
-</template>
-
-<script>
-  export default {
-    title: '收费',
-    data() {
-    },
-    methods: {
-      init() {
-        var xData = ['1', '2', '3', '4', '5', '6', '7', '8', '9'],
-          yData1 = [157595, 168477, 154318, 135130, 137892, 134554, 149184, 190880, 86404],
-          yData2 = [148245, 157585, 144000, 126401, 128889, 124933, 137133, 165645, 73428],
-          yData3 = [33357, 14893, 32526, 32559, 37335, 36626, 39419, 47411, 21917],
-          borderData = [],
-          legend = ['呼入量', '人工接听量', '报修工单量'],
-          colorArr = [{
-            start: 'rgba(242,153,97)',
-            mid: 'rgba(242,153,97,0.7)',
-            end: 'rgba(0, 0, 0,0.5)'
-          },
-            {
-              end: 'rgba(0, 0, 0,0.5)',
-              mid: 'rgba(111,217,208,0.7)',
-              start: 'rgba(111,217,208)'
-            },
-            {
-              color: '#e5925e'
-            }
-          ]
-        let normalColor = 'rgba(8,115,142)'
-        let seriesData = []
-        var borderHeight = 4
-        xData.forEach(element => {
-          borderData.push(borderHeight)
-        });
-        [yData1, yData2, yData3].forEach((item, index) => {
-          var obj1 = {}
-          if (index < 2) {
-            obj1 = {
-              name: legend[index],
-              type: 'bar',
-              stack: legend[index],
-              data: item,
-              barWidth: '20%',
-              itemStyle: {
-                normal: {
-                  barBorderRadius: [30, 30, 30, 30],
-                  color: {
-                    type: 'linear',
-                    x: 0,
-                    y: 0,
-                    x2: 0,
-                    y2: 1,
-                    colorStops: [{
-                      offset: 0,
-                      color: colorArr[index].start
-                    },
-                      {
-                        offset: 0.5,
-                        color: colorArr[index].mid
-                      },
-                      {
-                        offset: 1,
-                        color: colorArr[index].end
-                      }
-                    ],
-                    globalCoord: false
-                  }
-                }
-              }
-            }
-            seriesData.push(obj1)
-          } else {
-            var obj3 = {
-              data: item,
-              type: 'line',
-              smooth: true,
-              name: legend[index],
-              symbol: 'circle',
-              symbolSize: 10,
-              lineStyle: {
-                color: colorArr[index].color,
-                width: 1,
-                shadowColor: 'rgba(0, 0, 0, 0.3)', //设置折线阴影
-                shadowBlur: 15,
-                shadowOffsetY: 20,
-              }
-            }
-            seriesData.push(obj3)
-          }
-        })
-        console.log(seriesData)
-        // 更改柱状图位置
-        let option = {
-          backgroundColor: '#ffffff00',
-          grid: {
-            left: '2%',
-            right: '10%',
-            bottom: '20%',
-            containLabel: true
-          },
-          legend: {
-            show: true,
-            itemWidth: 30,
-            itemHeight: 20,
-            bottom: '5%',
-            textStyle: {
-              color: '#fff'
-            },
-            data: legend
-          },
-          tooltip: {
-            position: function (pos, params, dom, rect, size) {
-              let yPos = '20%'
-              let xPos = 0
-              if (pos[0] < size.viewSize[0] / 2) {
-                xPos = pos[0] + 10
-              } else {
-                xPos = pos[0] - dom.offsetWidth - 10
-              }
-              return [xPos, yPos]
-            },
-            trigger: 'axis',
-            extraCssText: 'width:15%;height:30%;',
-            formatter: function (params) {
-              var str = ''
-              for (var i = 0; i < params.length; i++) {
-                if (params[i].seriesName !== '') {
-                  str += `<span>${params[i].name}月${params[i].seriesName}</span><span style="color:gold">${params[i].value}</span> <br />`
-                }
-              }
-              return str
-            }
-          },
-          xAxis: [{
-            name: '月份',
-            type: 'category',
-            data: xData,
-            interval: 0,
-            axisPointer: {
-              type: 'shadow'
-            },
-            axisLabel: {
-              textStyle: {
-                color: normalColor,
-                fontSize: 12
-              }
-            },
-            axisLine: {
-              lineStyle: {
-                color: normalColor
-              }
-            },
-            axisTick: {
-              show: false
-            },
-            splitLine: {
-              show: false
-            }
-          }],
-          yAxis: [{
-            type: 'value',
-            nameTextStyle: {
-              color: normalColor,
-              fontSize: 12
-            },
-            // 'min': 0,
-            // 'max': 50,
-            axisLabel: {
-              formatter: '{value}',
-              textStyle: {
-                color: normalColor,
-                fontSize: 12
-              }
-            },
-            axisLine: {
-              lineStyle: {
-                color: normalColor
-              }
-            },
-            axisTick: {
-              show: false
-            },
-            splitLine: {
-              show: true,
-              lineStyle: {
-                type: 'dashed',
-                color: normalColor
-              }
-            }
-          }],
-          series: seriesData
-        }
-        console.log(option)
-        let barchart = this.$echarts.init(document.getElementById('barchart-line'))
-        console.log(option)
-        barchart.setOption(option)
-        var index = 0
-        // var mTime = setInterval(function () {
-        //   barchart.dispatchAction({
-        //     type: 'showTip',
-        //     seriesIndex: 0,
-        //     dataIndex: index
-        //   })
-        //   index++
-        //   if (index > xData.length) {
-        //     index = 0
-        //   }
-        // }, 1000)
-      }
-    },
-    ready() {
-      this.init()
-    },
-    props: {}
-  }
-</script>
-<style scoped>
-
-  #huru {
-    font-family: PingFang-SC-Bold;
-    font-size: 26px;
-    font-weight: bold;
-    font-stretch: normal;
-    line-height: 35px;
-    letter-spacing: 0px;
-    color: #35ffff;
-  }
-
-  #jieting {
-    font-family: PingFang-SC-Bold;
-    font-size: 26px;
-    font-weight: bold;
-    font-stretch: normal;
-    line-height: 35px;
-    letter-spacing: 0px;
-    color: #e5925e;
-  }
-
-  #baoxiu {
-    font-family: PingFang-SC-Bold;
-    font-size: 26px;
-    font-weight: bold;
-    font-stretch: normal;
-    line-height: 35px;
-    letter-spacing: 0px;
-    color: #f27c79;
-  }
-
-  #weixiu {
-    font-family: PingFang-SC-Bold;
-    font-size: 26px;
-    font-weight: bold;
-    font-stretch: normal;
-    line-height: 35px;
-    letter-spacing: 0px;
-    color: #2490d9;
-  }
-</style>
-

package/src/components/qinhua/ManageMain.vue

@@ -1,162 +0,0 @@
-<template>
-  <div class=' main background-qinhua' style="overflow: hidden" >
-    <div class="title-main" style="height: 7%">
-      <img src="../../../static/NewManageHome/title_left.png" alt="" style="vertical-align:middle">
-      <span class="title-font" style="text-align:justify;">秦华燃气数据展示</span>
-      <img src="../../../static/NewManageHome/title_right.png" alt="" style="vertical-align:middle">
-    </div>
-    <div class="flex-row" style="height: 46%">
-      <div id="top-left">
-        <scada></scada>
-      </div>
-      <div id="top-mid" >
-        <qinhua-map  class="qinhuamap" mode="1" idname="shanximap"></qinhua-map>
-      </div>
-      <div id="top-right" >
-        <bar-chart-line class="background-left-top">
-        </bar-chart-line>
-      </div>
-    </div>
-    <div class="flex-row " style="height: 42%;margin-top: 1em;">
-      <div class="flex background-left-bottom" style="width: 100%;width: 50%">
-        <div class="flex-row" style="width: 100%;height:60%">
-            <div style="width:35%;height:100%;">
-              <sell-echarts class=""></sell-echarts>
-            </div>
-            <div   style="width:65%;height:100%;">
-              <bar-chart></bar-chart>
-            </div>
-        </div>
-        <div class="flex-row" style="width: 100%;height:40%">
-          <div id="pie-one" >
-            <pie-sell></pie-sell>
-          </div>
-          <div  style="width:65%;height: 100%">
-            <ring-sell></ring-sell>
-          </div>
-          </div>
-        </div>
-      <div class="flex background-left-bottom" style="width: 100%;width: 50%;">
-        <div class="flex" >
-          <div class="flex-row" style="height: 40%">
-
-            <div  class="auto col-sm-12" style="width: 40%;height: 100%;padding: 1em" >
-              <div class=" col-sm-12 auto" style="padding-left: 1em">
-                <span class="font-title">安检</span>
-              </div>
-              <div  class="flex-inline col-sm-6 auto" >
-                <span id="weiruhu">121万</span>
-              </div>
-              <div  class="flex-inline col-sm-6 auto" >
-                <span id="anjian">73万</span>
-              </div>
-              <div class="flex-inline col-sm-6 auto" >
-               <span class="normal-font" >三年未入户总数</span>
-              </div>
-
-              <div class="flex-inline col-sm-6 auto" >
-                <span class="normal-font" >计划安检量</span>
-              </div>
-            </div>
-            <div style="width: 60%">
-            <ring-safecheck></ring-safecheck>
-            </div>
-          </div>
-          <div  style="height: 58%">
-            <safecheck-barchart></safecheck-barchart>
-          </div>
-        </div>
-      </div>
-    </div>
-
-  </div>
-</template>
-
-<script>
-  export default {
-    title: '收费',
-    data() {
-    },
-    methods: {},
-    ready () {
-    },
-    props: {}
-  }
-</script>
-<style scoped>
-  .main {
-    height: 100%;
-    padding: 1em;
-    flex: 1 1 auto;
-    flex-direction: column;
-    display: flex;
-  }
-
-
-  #top-left {
-    /*padding: 1em;*/
-    width: 37%;
-    height: 100%;
-  }
-
-  #top-mid {
-    /*padding: 1em;*/
-    width: 30%;
-    height: 100%;
-  }
-
-  #top-right {
-    width: 33%;
-    height: 100%;
-  }
-
-  .title-font {
-    font-family: HYk2gj;
-    font-size: 40px;
-    font-weight: normal;
-    font-stretch: normal;
-    line-height: 26px;
-    letter-spacing: 2px;
-    color: #ffffff;
-  }
-
-  .title-main {
-    margin: 0 auto;
-    height: 10%;
-    width: 50%
-  }
-  .flex-inline{
-    display: inline-flex;
-    justify-content: space-around;
-  }
-  #pie-one{
-    height: 100%;
-    width: 35%;
-  }
-  #weiruhu {
-    font-family: PingFang-SC-Bold;
-    font-size: 26px;
-    font-weight: bold;
-    font-stretch: normal;
-    line-height: 35px;
-    letter-spacing: 0px;
-    color: #f27c79;
-  }
-  #anjian {
-    font-family: PingFang-SC-Bold;
-    font-size: 26px;
-    font-weight: bold;
-    font-stretch: normal;
-    line-height: 35px;
-    letter-spacing: 0px;
-    color: #2490d9;
-  }
-  .qinhuamap{
-    position: absolute;
-    top: 2%;
-    left: 40%;
-    width: 28%;
-    height: 57%;
-  }
-</style>
-