manage-client 3.2.83-aode → 3.2.83-jb

package/src/components/daping/SellBarEcharts.vue

@@ -0,0 +1,220 @@
+<template>
+ <div id="sellGAS" style="height: 100%;width:100%"></div>
+</template>
+
+<script>
+
+import {HttpResetClass } from 'vue-client'
+
+export default {
+  name: 'sellBarEcharts',
+  data() {
+    return {
+      xc: '',
+      legend: [],
+      sdata: [],
+      yeartotal: 0,
+      resdata: []
+    }
+  },
+  ready(){
+    this.setBar()
+  },
+  methods:{
+    async setBar(){
+      let http = new HttpResetClass()
+      await  http.load('post','rs/sql/getDapingSalesVolume',{data:{}}, {rejectMsg: null, resolveMsg: null}).then((res)=>{
+        console.log('res=======================')
+        console.log(res.data)
+        this.resdata= res.data
+
+        // this.year =  (res.data[0].gas_year/10000).toFixed(2)
+        // this.day =  (res.data[0].gas_day/10000).toFixed(2)
+      })
+      console.log(' this.resdata', this.resdata)
+      for (let i = 0; i < this.resdata.length; i++) {
+        let data = {
+          name: this.resdata[i].sjmc,
+          value: this.resdata[i].sbsjfl
+        }
+        if(this.resdata[i].sjmc !== '年销气量'){
+          this.sdata.push(data)
+          this.legend.push(this.resdata[i].sjmc)
+        }
+       else{
+          this.yeartotal = Number(this.resdata[i].sbsjfl)
+        }
+      }
+      // this.yeartotal = (this.yeartotal / 10000).toFixed(2)
+      console.log('数据出来了')
+      console.log(this.legend)
+      console.log(this.sdata)
+      this.xc = this.$echarts.init(document.getElementById('sellGAS'))
+      let option = {
+        title: [{
+          text: "年总销气量",
+          top: 6,
+          left: 110,
+          textStyle: {
+            fontSize: 12,
+            color: '#fff'
+          },
+
+        }, {
+          text: this.yeartotal + "万方",
+          left: 210,
+          textStyle: {
+            fontSize: 22,
+            color: '#FEE449'
+          }
+        }],
+        tooltip: {
+          trigger: 'item',
+          extraCssText: 'width:auto;height:auto;'
+        },
+        grid: {
+          left: '30%',
+          right: '10%',
+          top: '0',
+          bottom: '0'
+        },
+        legend: {
+          left: "20%",
+          width: "70%",
+          textStyle: {
+            "color": "#fff",
+            "fontSize": 10
+          },
+          icon: "circle",
+          right: "0",
+          bottom: "0",
+          itemHeight: 14,
+          padding: [220, 0, 20, 20],
+          itemGap: 13,
+          data: this.legend
+        },
+        series: [{
+          type: "pie",
+          width: '45%',
+          center: ["100%", "40%"],
+          radius: ["40%", "53%"],
+          color:['#D9C701','#00BAFF','#F38051','#E7536B','#8ADAF4','#01B3B3','#F39800','#16B05C','#9A7EFA'],
+          startAngle: 135,
+          labelLine: {
+            show:true,
+            length: 5,
+            length2: 10
+          },
+
+          label: {
+            color:"rgba(255,255,255,.45)",
+            fontSize: 12,
+            show:true,
+            position:'outside',
+            normal: {
+              formatter: function (params){
+                return  params.name +'\n '+ (params.value/10000).toFixed(2)+'万方'
+
+              },
+            },
+
+
+          },
+          // labelLine: {
+          //   normal: {
+          //     length: 10
+          //   }
+          // },
+          // label: {
+          //   normal: {
+          //     formatter: "{b|{b}:}{c}NM3",
+          //     backgroundColor: "rgba(255, 147, 38, 0)",
+          //     borderColor: "transparent",
+          //     borderRadius: 4,
+          //     rich: {
+          //       a: {
+          //         "color": "#999",
+          //         "lineHeight": 14,
+          //         "align": "center"
+          //       },
+          //       hr: {
+          //         "borderColor": "#aaa",
+          //         "width": "100%",
+          //         "borderWidth": 1,
+          //         "height": 0
+          //       },
+          //       b: {
+          //         "color": "#b3e5ff",
+          //         "fontSize": 14,
+          //         "lineHeight": 33
+          //       },
+          //       c: {
+          //         "fontSize": 14,
+          //         "color": "#eee"
+          //       },
+          //       per: {
+          //         "color": "#FDF44E",
+          //         "fontSize": 14,
+          //         "padding": [5, 8],
+          //         "borderRadius": 2
+          //       }
+          //     },
+          //     textStyle: {
+          //       "color": "#fff",
+          //       "fontSize": 14
+          //     }
+          //   }
+          // },
+          // emphasis: {
+          //   label: {
+          //     "show": false,
+          //     "formatter": "{b}:{c} NM3",
+          //     "backgroundColor": "rgba(255, 147, 38, 0)",
+          //     "borderColor": "transparent",
+          //     "borderRadius": 4,
+          //     "rich": {
+          //       "a": {
+          //         "color": "#668fcd",
+          //         "lineHeight": 16,
+          //         "align": "center"
+          //       },
+          //       "hr": {
+          //         "borderColor": "#668fcd",
+          //         "width": "100%",
+          //         "borderWidth": 1,
+          //         "height": 0
+          //       },
+          //       "b": {
+          //         "color": "#FDF44E",
+          //         "fontSize": 16,
+          //         "lineHeight": 33
+          //       },
+          //       "c": {
+          //         "fontSize": 16,
+          //         "color": "#FDF44E"
+          //       },
+          //       "per": {
+          //         "color": "#FDF44E",
+          //         "fontSize": 14,
+          //         "padding": [5, 6],
+          //         "borderRadius": 2
+          //       }
+          //     }
+          //   }
+          // },
+          data: this.sdata
+        },
+        ]
+      }
+      this.xc.setOption(option)
+      console.log('aaaaaaaaa')
+      console.log('执行了~~~~~~~~~~~~~~~')
+    }
+  },
+
+}
+</script>
+
+<style scoped>
+
+</style>

package/src/components/daping/SellEcharts.vue

@@ -0,0 +1,219 @@
+<template>
+  <div class="sell" style="padding: 1em;height:auto">
+      <div class="col-sm-12" style="height: auto;padding-left: 4%;margin:2%">
+      <span class="pf-title">收费</span>
+    </div>
+    <div id="sell_left" style="width:100%">
+      <div class="col-sm-3">
+        <img src="../../../static/NewManageHome/图层4.png"  style="padding-left:2vw">
+      </div>
+     <div class="col-sm-9" style="text-align:center">
+
+         <span class="text-2" style="margin-left:1em">当年总售气量(万方)</span>
+       <span style="margin-left:1em" class="s1">{{year}}</span><br/>
+      </div>
+            <div class="col-sm-3">
+        <img src="../../../static/NewManageHome/图层5.png"  style="padding-left:2vw">
+      </div>
+     <div class="col-sm-9" style="text-align:center">
+
+         <span class="text-2" style="margin-left:1em">昨日总售气量(万方)</span>
+       <span style="margin-left:1em" class="s2">{{day}}</span> <br/>
+      </div>
+      <!-- <table>
+        <tr>
+          <td class="td1" rowspan="2"><img src="../../../static/NewManageHome/图层4.png"  style="width: 36px"></td>
+          <td ><nobr><span style="margin-left:1em" class="s1">{{year}}万</span></nobr></td>
+        </tr>
+        <tr>
+          <td style="">
+          <nobr></nobr><br/>&nbsp;<nobr></nobr>
+          </td>
+        </tr>
+        <tr>
+          <td class="td1"  rowspan="2" ><img src="../../../static/NewManageHome/图层5.png" style="width: 34px"></td>
+
+          <td >&nbsp;<span class="s2" style="margin-left:1em">{{day}}万</span></td>
+        </tr>
+        <tr>
+
+        <td>
+          <nobr><span class="text-2" style="margin-left:1em">昨日总售气量<br/></span></nobr>
+        </td>
+        </tr>
+      </table> -->
+    </div>
+
+    <!--</div>-->
+  </div>
+</template>
+
+<script>
+  import {HttpResetClass} from 'vue-client'
+  export default {
+    name: 'sellEcharts',
+
+    ready(){
+         let http = new HttpResetClass()
+      http.load('post','rs/sql/getSellSum',{data:{}}, {rejectMsg: null, resolveMsg: null}).then((res)=>{
+          this.year =  (res.data[0].gas_year/10000).toFixed(2)
+          this.day =  (res.data[0].gas_day/10000).toFixed(2)
+        })
+    },
+    data() {
+      return {
+     year:0,
+     day:0
+      }
+    }
+  }
+</script>
+
+<style scoped>
+  @media screen and (max-width: 1920px) {
+    .text-1 {
+      font-family: pFMedium;
+      font-size: 16px;
+      font-weight: normal;
+      font-stretch: normal;
+      line-height: 35px;
+      letter-spacing: 0px;
+      color: #b8cee4;
+    }
+    .text-2 {
+      font-family: pFBold;
+      font-size: 16px;
+      font-weight: normal;
+      font-stretch: normal;
+      line-height: 35px;
+      letter-spacing: 0px;
+      color: #b8cee4;
+    }
+
+    .s1 {
+      font-family: tRENDS;
+      font-size: 28px;
+      font-weight: normal;
+      font-stretch: normal;
+      line-height: 35px;
+      letter-spacing: 0px;
+      color: #00f6ff;
+    }
+
+    .s2 {
+      font-family: tRENDS;
+      font-size: 28px;
+      font-weight: normal;
+      font-stretch: normal;
+      line-height: 35px;
+      letter-spacing: 0px;
+      color: #ffc21f;
+    }
+
+    .label {
+      margin-left: 6%;
+      font-size: 1.85rem;
+      float: left;
+      color: #fff;
+      height: 8%;
+    }
+
+    table {
+      width: 100%;
+      height: 100%;
+    }
+
+    td {
+      /*width: 94px;*/
+      text-align: center;
+      /*height: 120px;*/
+      font-size: 1.4rem;
+      padding-left: 6%;
+      width: 70%;
+      height: 50%;
+      color: #ffffff;
+    }
+
+    .td1 {
+      width: 33%;
+    }
+
+    #sell_left {
+      height: 90%;
+      width: 45%;
+    }
+  }
+  @media screen and (max-width: 1440px) {
+    .text-1 {
+      font-family: pFMedium;
+      font-size: 12px;
+      font-weight: normal;
+      font-stretch: normal;
+      line-height: 35px;
+      letter-spacing: 0px;
+      color: #b8cee4;
+    }
+    .text-2 {
+      font-family: pFBold;
+      font-size: 12px;
+      font-weight: normal;
+      font-stretch: normal;
+      line-height: 35px;
+      letter-spacing: 0px;
+      color: #b8cee4;
+    }
+
+    .s1 {
+      font-family: tRENDS;
+      font-size: 20px;
+      font-weight: normal;
+      font-stretch: normal;
+      line-height: 35px;
+      letter-spacing: 0px;
+      color: #00f6ff;
+    }
+
+    .s2 {
+      font-family: tRENDS;
+      font-size: 20px;
+      font-weight: normal;
+      font-stretch: normal;
+      line-height: 35px;
+      letter-spacing: 0px;
+      color: #ffc21f;
+    }
+
+    .label {
+      margin-left: 6%;
+      font-size: 1.85rem;
+      float: left;
+      color: #fff;
+      height: 8%;
+    }
+
+    table {
+      width: 100%;
+      height: 100%;
+    }
+
+    td {
+      /*width: 94px;*/
+      text-align: center;
+      /*height: 120px;*/
+      font-size: 1.4rem;
+      padding-left: 6%;
+      width: 70%;
+      height: 50%;
+      color: #ffffff;
+    }
+
+    .td1 {
+      width: 33%;
+    }
+
+    #sell_left {
+      height: 90%;
+      width: 45%;
+    }
+  }
+</style>

package/src/components/daping/Style/qinhuaStyle.less

@@ -0,0 +1,224 @@
+.background-qinhua {
+  font-family: PingFangSC-Regular;
+  background-image: url('../../../../static/NewManageHome/background_qinhua.png');
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  /*width: 2304px;*/
+  /*height: 775px;*/
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  //position: absolute;
+}
+.background-left-top {
+  font-family: PingFangSC-Regular;
+  background-image: url('../../../../static/NewManageHome/左上.png');
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  /*width: 2304px;*/
+  /*height: 775px;*/
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  /*position: absolute;*/
+}
+.background-right-top {
+  font-family: PingFangSC-Regular;
+  background-image: url('../../../../static/NewManageHome/右上.png');
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  /*width: 2304px;*/
+  /*height: 775px;*/
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  /*position: absolute;*/
+}
+.background-content-img {
+  background-image: url('../../../../static/NewManageHome/组45.png');
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  /*width: 2304px;*/
+  /*height: 775px;*/
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  /*position: absolute;*/
+}
+.background-content-img1 {
+  background-image: url('../../../../static/NewManageHome/组43.png');
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  /*width: 2304px;*/
+  /*height: 775px;*/
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  /*position: absolute;*/
+}
+.background-left-bottom {
+  font-family: PingFangSC-Regular;
+  background-image: url('../../../../static/NewManageHome/左下.png');
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  /*width: 2304px;*/
+  /*height: 775px;*/
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  /*position: absolute;*/
+}
+.background-right-bottom {
+  font-family: PingFangSC-Regular;
+  background-image: url('../../../../static/NewManageHome/右下.png');
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  /*width: 2304px;*/
+  /*height: 775px;*/
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  /*position: absolute;*/
+}
+.normal-font {
+  font-family: PingFang-SC-Medium;
+  font-size: 14px;
+  font-weight: normal;
+  font-stretch: normal;
+  line-height: 30px;
+  letter-spacing: 0px;
+  color: #b7cee6;
+}
+.title{
+  width: 47px;
+	height: 23px;
+	font-family: PingFangSC-Bold;
+	font-size: 24px;
+	font-weight: normal;
+	font-stretch: normal;
+	line-height: 26px;
+	letter-spacing: 0px;
+	color: #ffffff;
+}
+.font-title {
+  font-family: PingFangSC-Medium;
+  font-size: 24px;
+  font-weight: normal;
+  font-stretch: normal;
+  line-height: 26px;
+  letter-spacing: 0px;
+  color: #ffffff;
+}
+.lable-title {
+  font-family: PingFangSC-Bold;
+  margin-left: 1em;
+  font-size: 18px;
+  font-weight: normal;
+  color: #e79450;
+}
+.normal-font {
+  font-family: PingFang-SC-Medium;
+  font-size: 14px;
+  font-weight: normal;
+  font-stretch: normal;
+  line-height: 35px;
+  letter-spacing: 0px;
+  color: #246fc0;
+}
+
+.value-font {
+  font-family: PingFang-SC-Bold;
+  font-size: 18px;
+  font-weight: normal;
+  font-stretch: normal;
+  line-height: 35px;
+  letter-spacing: 0px;
+  color: #00f6ff;
+}
+
+@font-pingfang-bold{
+  //font-family: pFBold;
+  //src:url(../../../../static/font/pingfang/PFBold_1.otf)
+}
+@font-pingfang-extralight{
+  //font-family: pFExtraLight;
+  //src:url(../../../../static/font/pingfang/PFExtraLight_1.otf)
+}
+@font-pingfang-heavy{
+  //font-family: pFHeavy;
+  //src:url(../../../../static/font/pingfang/PFHeavy_1.otf)
+}
+@font-pingfang-light{
+  //font-family: pFLight;
+  //src:url(../../../../static/font/pingfang/PFLight_1.otf)
+}
+@font-pingfang-medium{
+  //font-family: pFMedium;
+  //src:url(../../../../static/font/pingfang/PFMedium_1.otf)
+}
+@font-pingfang-regular{
+  //font-family: pFRegular;
+  //src:url(../../../../static/font/pingfang/PFRegular_1.otf)
+}
+@font-trends{
+  //font-family: tRends;
+  //src:url(../../../../static/font/pingfang/TRENDS.ttf)
+}
+.pf-title{
+  font-family: pFBold;
+	font-size: 24px;
+	font-weight: normal;
+	font-stretch: normal;
+	line-height: 26px;
+	letter-spacing: 0px;
+	color: #ffffff;
+}
+.font-14-medium{
+  color: #ffffff;
+line-height: 18px;
+  font-size: 14px;
+font-family: font-pingfang-medium;
+}
+.bottom-center.amap-info-contentContainer{
+  height: auto;
+  //height: 300px;
+  //width: 180px;
+  //background-color: #084a78;
+  //border: 1px solid #0389db;
+  //padding: 5px 0;
+  //border-radius: 6px;
+}
+.amap-marker-content{
+  height: auto;
+}
+.tooltip {
+  width: 200px;
+  background-color: #084a78;
+  border: 1px solid #0389db;
+  padding: 5px;
+  border-radius: 6px;
+  //text-align: center;
+  /* 定位 */
+  //position: absolute;
+  z-index: 1;
+}
+.t2 {
+  color: white;
+}
+
+.t3 {
+  color: #ffc21f;
+}
+.amap-info-content{
+  background: transparent;
+}
+.amap-info-close{
+  display: none;
+}
+.amap-info-content.amap-info-outer{
+  //display: contents;
+  display: inline;
+}
+div{
+  display: block;
+}