manage-client 3.2.86-4 → 3.2.86-aodeToV4

package/src/components/ManageHomeCS/Home/GasValue.vue

@@ -1,466 +1,377 @@
-<template>
-  <div class="gasvalue">
-    <div class="label">销售气量</div>
-    <!--<div>-->
-    <!--<div class="div-select">-->
-    <!--<select v-model="date" >-->
-    <!--<option :value="date" v-for="s in date">{{s}}</option>-->
-    <!--</select>-->
-    <!--</div>-->
-    <div class="d1">
-      <div class="d11">
-        <table class="backgroundimg">
-
-          <tr>
-            <td class="td5"><span  class="td-title">民用气量销售&emsp;</span><span v-for="a in totalgasarrary" style="color: #62e7ff" track-by="$index">{{a}}</span><span class="span-unit" style="color: #62e7ff">{{unit}}方</span>
-            </td>
-          </tr>
-          <tr>
-            <td class="td5"><span  class="td-title">非民用销售&emsp;&emsp;</span><span v-for="a in totalgasarrary1" style="color: #f29961"  track-by="$index">{{a}}</span><span class="span-unit" style="color: #f29961" >{{unit}}方</span>
-            </td>
-          </tr>
-          <tr>
-            <td class="td5"><span  class="td-title">混合型气量销售</span><span v-for="a in totalgasarrary2" style="color: #748bf0"  track-by="$index">{{a}}</span><span class="span-unit" style="color: #748bf0" >{{unit}}方</span>
-            </td>
-          </tr>
-        </table>
-      </div>
-
-    </div>
-    <!--</div>-->
-  </div>
-</template>
-
-<script>
-  import * as DataSql from '../../../stores/DataSql'
-  import * as Util from '../../../Util'
-  import co from 'co'
-
-  export default {
-    name: "gasvalue",
-    props: {
-      f_filiale:String,
-    },
-    data() {
-      return {
-        sqlcondition: '',
-        unit: '',
-        resdata: '',
-        resdata1: '',
-        resdata2: '',
-        totalgas:'',
-        totalgas1:'',
-        totalgas2:'',
-        totalgasarrary:[],
-        totalgasarrary1:[],
-        totalgasarrary2:[],
-      }
-    },
-    methods: {
-      //请求后台数据
-      searchdata(year) {
-        console.log('searchdata--------------------------------------------------searchdata')
-        console.log(DataSql.getData(this, 'pregas', {},'resdata'))
-        let sqldata = DataSql.getData(this, 'pregas', {},'resdata')
-        co(sqldata)
-        let sqldata1 = DataSql.getData(this, 'civilgas', {},'resdata1')
-        co(sqldata1)
-        let sqldata2 = DataSql.getData(this, 'hybridgas', {},'resdata2')
-        co(sqldata2)
-      },
-      getValueInt() {
-        var index = this.totalgas.toString().indexOf('.');
-        var s = 0
-        if (index > -1) {
-          s = this.totalgas.toString().substring(0, index);
-        } else {
-          s = this.totalgas
-        }
-
-        var a = s + ''
-        if (a.length > 9) {
-          a = a.substring(0, a.length - 8);
-          this.unit = '亿'
-        }
-        if (a.length > 5) {
-          a = a.substring(0, a.length - 4);
-          this.unit = '万'
-        }
-        this.totalgasarrary = []
-        for (var i = 0; i < a.length; i++) {
-          this.totalgasarrary.push(a.charAt(i))
-        }
-
-      } ,
-      getValueInt1() {
-        var index = this.totalgas1.toString().indexOf('.');
-        var s = 0
-        if (index > -1) {
-          s = this.totalgas1.toString().substring(0, index);
-        } else {
-          s = this.totalgas1
-        }
-
-        var a = s + ''
-        if (a.length > 9) {
-          a = a.substring(0, a.length - 8);
-          this.unit = '亿'
-        }
-        if (a.length > 5) {
-          a = a.substring(0, a.length - 4);
-          this.unit = '万'
-        }
-        this.totalgasarrary1 = []
-        for (var i = 0; i < a.length; i++) {
-          this.totalgasarrary1.push(a.charAt(i))
-        }
-
-      } ,
-      getValueInt2() {
-        var index = this.totalgas2.toString().indexOf('.');
-        var s = 0
-        if (index > -1) {
-          s = this.totalgas2.toString().substring(0, index);
-        } else {
-          s = this.totalgas2
-        }
-
-        var a = s + ''
-        if (a.length > 9) {
-          a = a.substring(0, a.length - 8);
-          this.unit = '亿'
-        }
-        if (a.length > 5) {
-          a = a.substring(0, a.length - 4);
-          this.unit = '万'
-        }
-        this.totalgasarrary2 = []
-        for (var i = 0; i < a.length; i++) {
-          this.totalgasarrary2.push(a.charAt(i))
-        }
-
-      }
-    },
-    watch: {
-      'resdata':{
-        deep: true,
-        handler(val) {
-          console.log('------------民用销售气量===================民用销售气量----------------------------')
-          console.log(this.resdata,'民用销售气量')
-          console.log(this.resdata[0],'民用销售气量-----------------')
-          if(this.resdata[0]!==undefined){
-            this.totalgas=this.resdata[0].value
-
-          }
-
-
-        }
-      },
-      'resdata1':{
-        deep: true,
-        handler(val) {
-          console.log('------------非民用销售气量非民用销售气量----------------------------')
-          console.log(this.resdata1,'非民用销售气量')
-          if(this.resdata1[0]!==undefined){
-            this.totalgas1=this.resdata1[0].value
-
-          }
-
-          // this.resdata1=this.resdata1[0].value
-        }
-      },
-      'resdata2':{
-        deep: true,
-        handler(val) {
-          console.log('---混合销售气量------------------------混合销售气量-------------')
-          console.log(this.resdata2,'混合销售气量')
-          if(this.resdata2[0]!==undefined){
-            this.totalgas2=this.resdata2[0].value
-
-          }
-        }
-      },
-      'totalgas'(val) {
-        this.getValueInt()
-        this.$parent.loaddata++
-      },
-      'totalgas1'(val) {
-        this.getValueInt1()
-        this.$parent.loaddata++
-      },
-      'totalgas2'(val) {
-        this.getValueInt2()
-        this.$parent.loaddata++
-      },
-
-      'f_filiale'(){
-        var date = Util.toStandardDateString();
-        var year = date.substring(0, 4)-4
-        this.searchdata(year)
-      }
-    },
-    ready() {
-      // 拼接sql
-      var date = Util.toStandardDateString();
-      var year = date.substring(0, 4)-4
-      this.searchdata(year)
-    }
-  }
-</script>
-
-<style scoped>
-  @media screen and (max-width: 1920px) {/*标题样式*/
-    .label {
-      font-size: 1.85rem;
-      color: #fff;
-      height: 8%;
-      width: 100%;
-      margin-left: 6%;
-    }
-    table {
-      width: 100%;
-      height: 100%;
-    }
-
-    span {
-      border: solid 1px #00f7ff;
-      /*margin: 0px 5px;*/
-      /*padding: 1px 6px;*/
-      background-color: #01363f;
-      color: #f7cb32;
-      font-size: 2.6rem;
-      font-weight: bolder;
-      /*width: 30px;*/
-      /*height: 44px;*/
-      margin: 0% 1%;
-      padding: 1% 2%;
-      border-radius: 4px;
-    }
-
-    .backgroundimg td {
-      text-align: center;
-      /*width: 486px;*/
-      height: 20%;
-      width: 100%;
-      color: #ffffff;
-      font-size: 2.4rem;
-    }
-
-    .td1 {
-      width: 50%;
-      font-size: 1.75rem;
-      color: #ffffff;
-    }
-
-    .td2 {
-      /*height: 24px;*/
-      /*height: 10%;*/
-      font-size: 1.9rem;
-    }
-
-    .td3 {
-      /*height: 76px;*/
-      /*height: 40%;*/
-      padding-left: 4%;
-      text-align: center;
-    }
-
-    .td4 {
-      /*height: 40px;*/
-      /*width: 100px*/
-      /*height: 10%;*/
-      /*width: 24%;*/
-    }
-
-    .div-select {
-      height: 9%;
-      margin-left: 10%;
-      margin-top: 2%;
-    }
-
-    select {
-      padding-left: 6px;
-      border: none;
-      appearance: none;
-      -moz-appearance: none;
-      -webkit-appearance: none;
-      background: #001521 url('../../../../static/ManageHomePic/图层5拷贝4.png') no-repeat right center;
-      color: #15dce2;
-      font-size: 1.4rem;
-      width: 62px;
-    }
-
-    .span-unit {
-      margin-left: 1px;
-      font-size: 1.8rem;
-      border: none;
-      background-color: rgba(1, 207, 242, 0);
-    }
-
-    .gasdata {
-      color: #f7cb32;
-      font-size: 1.5rem;
-      background-size: 60% 20%;
-      background: url('../../../../static/ManageHomePic/椭圆6拷贝3.png') no-repeat bottom;
-    }
-
-    .backgroundimg {
-      /*background-image: url('../../../../static/ManageHomePic/gasborder.png');*/
-      background-size: 90% 75%;
-      background: no-repeat center;
-    }
-
-    .d1 {
-      /*height: 250px;*/
-      width: 100%;
-      height: 100%;
-      padding-top: 5%;
-    }
-
-    .d11 {
-      /*height: 140px*/
-      width: 100%;
-      height: 90%;
-    }
-
-    .d12 {
-      /*height: 114px;*/
-      width: 100%;
-      height: 45%;
-    }
-
-    .td-title{
-      color: #ffffff;
-      font-size: 1.6rem;
-      border: none;
-      background-color: rgba(1, 207, 242, 0);
-    }}
-  @media screen and (max-width: 1366px) {/*标题样式*/
-    .label {
-      font-size: 1.85rem;
-      color: #fff;
-      height: 8%;
-      width: 100%;
-      margin-left: 6%;
-    }
-    table {
-      width: 100%;
-      height: 100%;
-    }
-
-    span {
-      border: solid 1px #00f7ff;
-      /*margin: 0px 5px;*/
-      /*padding: 1px 6px;*/
-      background-color: #01363f;
-      color: #f7cb32;
-      font-size: 1.8rem;
-      font-weight: bolder;
-      /*width: 30px;*/
-      /*height: 44px;*/
-      margin: 0% 1%;
-      padding: 1% 2%;
-      border-radius: 4px;
-    }
-
-    .backgroundimg td {
-      text-align: center;
-      /*width: 486px;*/
-      height: 20%;
-      width: 100%;
-      color: #ffffff;
-      font-size: 1.8rem;
-    }
-
-    .td1 {
-      width: 50%;
-      font-size: 1.4rem;
-      color: #ffffff;
-    }
-
-    .td2 {
-      /*height: 24px;*/
-      /*height: 10%;*/
-      font-size: 1.6rem;
-    }
-
-    .td3 {
-      /*height: 76px;*/
-      /*height: 40%;*/
-      padding-left: 4%;
-      text-align: center;
-    }
-
-    .td4 {
-      /*height: 40px;*/
-      /*width: 100px*/
-      /*height: 10%;*/
-      /*width: 24%;*/
-    }
-
-    .div-select {
-      height: 9%;
-      margin-left: 10%;
-      margin-top: 2%;
-    }
-
-    select {
-      padding-left: 6px;
-      border: none;
-      appearance: none;
-      -moz-appearance: none;
-      -webkit-appearance: none;
-      background: #001521 url('../../../../static/ManageHomePic/图层5拷贝4.png') no-repeat right center;
-      color: #15dce2;
-      font-size: 1rem;
-      width: 62px;
-    }
-
-    .span-unit {
-      margin-left: 1px;
-      font-size: 1.6rem;
-      border: none;
-      background-color: rgba(1, 207, 242, 0);
-    }
-
-    .gasdata {
-      color: #f7cb32;
-      font-size: 1.1rem;
-      background-size: 60% 20%;
-      background: url('../../../../static/ManageHomePic/椭圆6拷贝3.png') no-repeat bottom;
-    }
-
-    .backgroundimg {
-      /*background-image: url('../../../../static/ManageHomePic/gasborder.png');*/
-      background-size: 90% 75%;
-      background: no-repeat center;
-    }
-
-    .d1 {
-      /*height: 250px;*/
-      width: 100%;
-      height: 100%;
-      padding-top: 5%;
-    }
-
-    .d11 {
-      /*height: 140px*/
-      width: 100%;
-      height: 90%;
-    }
-
-    .d12 {
-      /*height: 114px;*/
-      width: 100%;
-      height: 45%;
-    }
-
-    .td-title{
-      color: #ffffff;
-      font-size: 1.3rem;
-      border: none;
-      background-color: rgba(1, 207, 242, 0);
-    }}
-
-
-</style>
+<template>
+  <div class="gasvalue">
+    <div class="label">销售气量</div>
+    <!--<div>-->
+    <!--<div class="div-select">-->
+    <!--<select v-model="date" >-->
+    <!--<option :value="date" v-for="s in date">{{s}}</option>-->
+    <!--</select>-->
+    <!--</div>-->
+    <div class="d1">
+      <div class="d11">
+        <table class="backgroundimg">
+          <tr>
+            <td class="td3"><span class="td-title">城镇气化销售&nbsp;&nbsp;&nbsp;</span><span v-for="a in totalgasarrary" track-by="$index">{{a}}</span><span class="span-unit">{{unit}}方</span>
+            </td>
+          </tr>
+          <tr>
+            <td class="td3"><span  class="td-title">LNG加气站销售&nbsp;</span><span v-for="a in totalgasarrary" style="color: #62e7ff" track-by="$index">{{a}}</span><span class="span-unit" style="color: #62e7ff">{{unit}}方</span>
+            </td>
+          </tr>
+          <tr>
+            <td class="td3"><span  class="td-title">CNG加气站销售&nbsp;</span><span v-for="a in totalgasarrary" style="color: #f29961"  track-by="$index">{{a}}</span><span class="span-unit" style="color: #f29961" >{{unit}}方</span>
+            </td>
+          </tr>
+          <tr>
+            <td class="td3"><span  class="td-title">CNG公司销售&nbsp;&nbsp;&nbsp;&nbsp;</span><span v-for="a in totalgasarrary" style="color: #748bf0"  track-by="$index">{{a}}</span><span class="span-unit" style="color: #748bf0" >{{unit}}方</span>
+            </td>
+          </tr>
+        </table>
+      </div>
+
+    </div>
+    <!--</div>-->
+  </div>
+</template>
+
+<script>
+  import * as DataSql from '../../../stores/DataSql'
+  import * as Util from '../../../Util'
+  import co from 'co'
+
+  export default {
+    name: "gasvalue",
+    props: {
+      f_filiale:String,
+    },
+    data() {
+      return {
+        totalgas: '',
+        totalgasarrary: [],
+        date: [2018, 2017, 2016],
+        sqlcondition: '',
+        result: [],
+        unit: '',
+        resdata: []
+      }
+    },
+    methods: {
+      //请求后台数据
+      searchdata(year) {
+        let sqldata = DataSql.getData(this, 'pregas',{startDate:year,f_filiale:this.$parent.$parent.f_filiale}, 'resdata')
+        co(sqldata)
+      },
+      // 将数值打碎成数组
+      gasValueStyle(s) {
+        this.totalgasarrary = []
+        for (var i = 0; i < s.length; i++) {
+          this.totalgasarrary.push(s.charAt(i))
+        }
+      },
+      // 数据增加单位
+      datafix(data) {
+        var s = data + ''
+        if (s.length > 9) {
+          s = s.substring(0, s.length - 8);
+          this.unit = '亿'
+        }
+        if (s.length > 5) {
+          s = s.substring(0, s.length - 4);
+          this.unit = '万'
+        }
+        this.gasValueStyle(s)
+      },
+      //取整
+      getValueInt() {
+        var index = this.totalgas.toString().indexOf('.');
+        var s = 0
+        if (index > -1) {
+          s = this.totalgas.toString().substring(0, index);
+        } else {
+          s = this.totalgas
+        }
+        this.datafix(s)
+      }
+    },
+    watch: {
+      'resdata':{
+        deep: true,
+        handler(val) {
+          this.totalgas = this.resdata[0].value
+        }
+      },
+      'totalgas'(val) {
+        this.getValueInt()
+        this.$parent.loaddata++
+      },
+      'f_filiale'(){
+        var date = Util.toStandardDateString();
+        var year = date.substring(0, 4)-4
+        this.searchdata(year)
+      }
+    },
+    ready() {
+      // 拼接sql
+      var date = Util.toStandardDateString();
+      var year = date.substring(0, 4)-4
+      this.searchdata(year)
+    }
+  }
+</script>
+
+<style scoped>
+  @media screen and (max-width: 1920px) {/*标题样式*/
+    .label {
+      font-size: 1.85rem;
+      color: #fff;
+      height: 8%;
+      width: 100%;
+      margin-left: 6%;
+    }
+    table {
+      width: 100%;
+      height: 100%;
+    }
+
+    span {
+      border: solid 1px #00f7ff;
+      /*margin: 0px 5px;*/
+      /*padding: 1px 6px;*/
+      background-color: #01363f;
+      color: #f7cb32;
+      font-size: 2.6rem;
+      font-weight: bolder;
+      /*width: 30px;*/
+      /*height: 44px;*/
+      margin: 0% 1%;
+      padding: 1% 2%;
+      border-radius: 4px;
+    }
+
+    .backgroundimg td {
+      text-align: center;
+      /*width: 486px;*/
+      height: 20%;
+      width: 100%;
+      color: #ffffff;
+      font-size: 2.4rem;
+    }
+
+    .td1 {
+      width: 50%;
+      font-size: 1.75rem;
+      color: #ffffff;
+    }
+
+    .td2 {
+      /*height: 24px;*/
+      /*height: 10%;*/
+      font-size: 1.9rem;
+    }
+
+    .td3 {
+      /*height: 76px;*/
+      /*height: 40%;*/
+      padding-left: 4%;
+      text-align: center;
+    }
+
+    .td4 {
+      /*height: 40px;*/
+      /*width: 100px*/
+      /*height: 10%;*/
+      /*width: 24%;*/
+    }
+
+    .div-select {
+      height: 9%;
+      margin-left: 10%;
+      margin-top: 2%;
+    }
+
+    select {
+      padding-left: 6px;
+      border: none;
+      appearance: none;
+      -moz-appearance: none;
+      -webkit-appearance: none;
+      background: #001521 url('../../../../static/ManageHomePic/图层5拷贝4.png') no-repeat right center;
+      color: #15dce2;
+      font-size: 1.4rem;
+      width: 62px;
+    }
+
+    .span-unit {
+      margin-left: 1px;
+      font-size: 1.8rem;
+      border: none;
+      background-color: rgba(1, 207, 242, 0);
+    }
+
+    .gasdata {
+      color: #f7cb32;
+      font-size: 1.5rem;
+      background-size: 60% 20%;
+      background: url('../../../../static/ManageHomePic/椭圆6拷贝3.png') no-repeat bottom;
+    }
+
+    .backgroundimg {
+      /*background-image: url('../../../../static/ManageHomePic/gasborder.png');*/
+      background-size: 90% 75%;
+      background: no-repeat center;
+    }
+
+    .d1 {
+      /*height: 250px;*/
+      width: 100%;
+      height: 100%;
+      padding-top: 5%;
+    }
+
+    .d11 {
+      /*height: 140px*/
+      width: 100%;
+      height: 90%;
+    }
+
+    .d12 {
+      /*height: 114px;*/
+      width: 100%;
+      height: 45%;
+    }
+
+    .td-title{
+      color: #ffffff;
+      font-size: 1.6rem;
+      border: none;
+      background-color: rgba(1, 207, 242, 0);
+    }}
+  @media screen and (max-width: 1366px) {/*标题样式*/
+    .label {
+      font-size: 1.85rem;
+      color: #fff;
+      height: 8%;
+      width: 100%;
+      margin-left: 6%;
+    }
+    table {
+      width: 100%;
+      height: 100%;
+    }
+
+    span {
+      border: solid 1px #00f7ff;
+      /*margin: 0px 5px;*/
+      /*padding: 1px 6px;*/
+      background-color: #01363f;
+      color: #f7cb32;
+      font-size: 1.8rem;
+      font-weight: bolder;
+      /*width: 30px;*/
+      /*height: 44px;*/
+      margin: 0% 1%;
+      padding: 1% 2%;
+      border-radius: 4px;
+    }
+
+    .backgroundimg td {
+      text-align: center;
+      /*width: 486px;*/
+      height: 20%;
+      width: 100%;
+      color: #ffffff;
+      font-size: 1.8rem;
+    }
+
+    .td1 {
+      width: 50%;
+      font-size: 1.4rem;
+      color: #ffffff;
+    }
+
+    .td2 {
+      /*height: 24px;*/
+      /*height: 10%;*/
+      font-size: 1.6rem;
+    }
+
+    .td3 {
+      /*height: 76px;*/
+      /*height: 40%;*/
+      padding-left: 4%;
+      text-align: center;
+    }
+
+    .td4 {
+      /*height: 40px;*/
+      /*width: 100px*/
+      /*height: 10%;*/
+      /*width: 24%;*/
+    }
+
+    .div-select {
+      height: 9%;
+      margin-left: 10%;
+      margin-top: 2%;
+    }
+
+    select {
+      padding-left: 6px;
+      border: none;
+      appearance: none;
+      -moz-appearance: none;
+      -webkit-appearance: none;
+      background: #001521 url('../../../../static/ManageHomePic/图层5拷贝4.png') no-repeat right center;
+      color: #15dce2;
+      font-size: 1rem;
+      width: 62px;
+    }
+
+    .span-unit {
+      margin-left: 1px;
+      font-size: 1.6rem;
+      border: none;
+      background-color: rgba(1, 207, 242, 0);
+    }
+
+    .gasdata {
+      color: #f7cb32;
+      font-size: 1.1rem;
+      background-size: 60% 20%;
+      background: url('../../../../static/ManageHomePic/椭圆6拷贝3.png') no-repeat bottom;
+    }
+
+    .backgroundimg {
+      /*background-image: url('../../../../static/ManageHomePic/gasborder.png');*/
+      background-size: 90% 75%;
+      background: no-repeat center;
+    }
+
+    .d1 {
+      /*height: 250px;*/
+      width: 100%;
+      height: 100%;
+      padding-top: 5%;
+    }
+
+    .d11 {
+      /*height: 140px*/
+      width: 100%;
+      height: 90%;
+    }
+
+    .d12 {
+      /*height: 114px;*/
+      width: 100%;
+      height: 45%;
+    }
+
+    .td-title{
+      color: #ffffff;
+      font-size: 1.3rem;
+      border: none;
+      background-color: rgba(1, 207, 242, 0);
+    }}
+
+
+</style>