修改样式

2 years ago · acc5ed372d
parent f01a3e5566
commit acc5ed372d
13 changed files with 48 additions and 60 deletions
--- a/src/views/energySources/component/all.vue
+++ b/src/views/energySources/component/all.vue
@ -11,7 +11,7 @@
      <div class="tit-r">
        <span style="color: #fff;">选择时间：</span>
        <el-date-picker size="mini" v-model="selectMonth" type="month" placeholder="选择月" @change="changeMonth"
-          style="width: 1.2rem;margin-right: 0.26rem;" format="yyyy-MM" value-format="yyyy-MM">
+          :clearable="false" style="width: 1.2rem;margin-right: 0.26rem;" format="yyyy-MM" value-format="yyyy-MM">
        </el-date-picker>
        单位：kw·h
      </div>
@ -84,7 +84,7 @@
 <script>
 import tit from "./tit.vue";
 import { mapGetters } from "vuex";
-import {getTotalElectricity,getMonthElectricity} from "@/api/energySources/energySources"
+import { getTotalElectricity, getMonthElectricity } from "@/api/energySources/energySources"
 export default {
  props: {
    deptName: {
@ -95,13 +95,13 @@ export default {
  data() {
    return {
      num: 0,
-      yearNum:0,
-      monthNum:0,
-      yesterdayNum:0,
-      todayNum:0,
-      selectMonth:'',
-      currentMonthData:[120, 200, 150, 80, 70, 110, 130],
-      lastMonthData:[150, 120, 180, 60, 40, 130, 150],
+      yearNum: 0,
+      monthNum: 0,
+      yesterdayNum: 0,
+      todayNum: 0,
+      selectMonth: '',
+      currentMonthData: [120, 200, 150, 80, 70, 110, 130],
+      lastMonthData: [150, 120, 180, 60, 40, 130, 150],
      timeFun: null
    };
  },
@ -110,7 +110,7 @@ export default {
  },
  created() {
    this.selectMonth = this.$moment().format('YYYY-MM')
-    if(this.deptName){
+    if (this.deptName) {
      this.getTotal()
      this.$nextTick(() => {
        this.getTrend()
@ -120,15 +120,15 @@ export default {
      }, 300000)
    }
  },
-  beforeDestroyed() {
+  beforeDestroy() {
    clearInterval(this.timeFun)
  },
-  computed:{
+  computed: {
    ...mapGetters(["userInfo", "permission"]),
  },
  methods: {
-    getTotal(){
-      getTotalElectricity({manufacturerBrand:this.deptName}).then(res =>{
+    getTotal() {
+      getTotalElectricity({ manufacturerBrand: this.deptName }).then(res => {
        let data = res.data.data
        this.yearNum = data.currentYear.toString().split('')
        this.monthNum = data.currentMonth.toString().split('')
@ -136,10 +136,10 @@ export default {
        this.todayNum = data.today.toString().split('')
      })
    },
-    getTrend(){
+    getTrend() {
      this.currentMonthData = [];
      this.lastMonthData = []
-      getMonthElectricity({manufacturerBrand:this.deptName,currentMonth:this.selectMonth}).then(res =>{
+      getMonthElectricity({ manufacturerBrand: this.deptName, currentMonth: this.selectMonth }).then(res => {
        let currData = res.data.data.currentMonth
        let lastData = res.data.data.lastMonth
        Object.keys(currData).forEach((key) => {
@ -148,12 +148,12 @@ export default {
        Object.keys(lastData).forEach((key) => {
          this.lastMonthData.push(lastData[key])
        });
-        this.$nextTick(() =>{
+        this.$nextTick(() => {
          this.echartsInit()
        })
      })
    },
-    changeMonth(){
+    changeMonth() {
      this.getTrend()
    },
    echartsInit() {
--- a/src/views/energySources/component/dosage.vue
+++ b/src/views/energySources/component/dosage.vue
@ -7,7 +7,7 @@
        &nbsp;&nbsp;&nbsp;
        <span style="color: #fff;">选择时间：</span>
        <el-date-picker size="mini" v-model="selectDay" type="date" placeholder="选择月" @change="changeDate"
-          style="width: 1.3rem;margin-right: 0.26rem;" value-format="yyyy-MM-dd" format="yyyy-MM-dd">
+          :clearable="false" style="width: 1.3rem;margin-right: 0.26rem;" value-format="yyyy-MM-dd" format="yyyy-MM-dd">
        </el-date-picker>
        单位：kw·h
      </div>
@ -112,14 +112,14 @@ export default {
  },
  created() {
    this.selectDay = this.$moment().format('YYYY-MM-DD')
-    if(this.deptName){
+    if (this.deptName) {
      this.getPeriodData()
      this.timeFun = setInterval(() => {
        this.getPeriodData()
      }, 300000)
    }
  },
-  beforeDestroyed() {
+  beforeDestroy() {
    clearInterval(this.timeFun)
  },
  computed: {
--- a/src/views/energySources/component/equipmentAnalyze.vue
+++ b/src/views/energySources/component/equipmentAnalyze.vue
@ -4,7 +4,7 @@
      <div class="tit-r">
        <span style="color: #fff;">选择时间：</span>
        <el-date-picker size="mini" v-model="selectDay" type="date" placeholder="选择月" @change="changeDate"
-          style="width: 1.3rem;margin-right: 0.26rem;" value-format="yyyy-MM-dd" format="yyyy-MM-dd">
+          :clearable="false" style="width: 1.3rem;margin-right: 0.26rem;" value-format="yyyy-MM-dd" format="yyyy-MM-dd">
        </el-date-picker>
      </div>
    </tit>
@ -77,14 +77,14 @@ export default {
  },
  created() {
    this.selectDay = this.$moment().format('YYYY-MM-DD')
-    if(this.deptName){
+    if (this.deptName) {
      this.getTotalData()
      this.timeFun = setInterval(() => {
        this.getTotalData()
      }, 300000)
    }
  },
-  beforeDestroyed() {
+  beforeDestroy() {
    clearInterval(this.timeFun)
  },
  methods: {
--- a/src/views/energySources/component/equipmentLoad.vue
+++ b/src/views/energySources/component/equipmentLoad.vue
@ -40,7 +40,8 @@ export default {
  data() {
    return {
      tableData: [],
-      visible: false
+      visible: false,
+      timeFun: null
    };
  },
  components: {
@ -58,7 +59,7 @@ export default {
      }, 300000)
    }
  },
-  beforeDestroyed() {
+  beforeDestroy() {
    clearInterval(this.timeFun)
  },
  methods: {
--- a/src/views/energySources/component/equipmentStatus.vue
+++ b/src/views/energySources/component/equipmentStatus.vue
@ -28,7 +28,7 @@ export default {
    tit
  },
  created() {
-    if(this.deptName){
+    if (this.deptName) {

      this.$nextTick(() => {

@ -39,7 +39,7 @@ export default {
      })
    }
  },
-  beforeDestroyed() {
+  beforeDestroy() {
    clearInterval(this.funt)
  },
  computed: {
@ -81,22 +81,27 @@ export default {
      let yAxisData = arr.map(r => r.name)
      let d = yAxisData.map(r => day20)
      let source = arr.map(r => r.list)
+      let maxLengthArr = this.getLongestSubArray(source)
      let seriesArr = []

-      for (let i = 0; i < source[0].length; i++) {
+      for (let i = 0; i < maxLengthArr.length; i++) {
+        // for (let i = 0; i < source[0].length; i++) {
        let arr = []
        source.forEach(e => {
          arr.push(e[i])
        })
        seriesArr = [...seriesArr, arr]
      }
+      console.log(source, 'source')
+      console.log(seriesArr, 'seriesArr')
      let seriesData = []
      seriesArr.forEach((e, idx) => {
        let sdata = e.map(m => {
          let y = this.$moment().format('yyyy-MM-DD')
-          // let s = `${y} ${m.time}`
+          let value = m ? this.$moment(`${y} ${m ? m.time : null}`).valueOf() : ''
          return {
-            value: this.$moment(`${y} ${m ? m.time : null}`).valueOf(),
+            // value: this.$moment(`${y} ${m ? m.time : null}`).valueOf(),
+            value,
            itemStyle: {
              normal: {
                color: m ? m.runStatus == 2 ? "#44516d" : '#0084FF' : '',
@ -114,26 +119,7 @@ export default {
          z: seriesArr.length - idx
        })
      })
-      // let seriesDataF = seriesData[seriesData.length - 1].data
-      // for (let k in seriesDataF) {
-      //   if (seriesDataF[k].runStatus == 1) {
-      //     seriesDataF[k].itemStyle.normal.color = '#0084FF'
-      //   }
-      // }
-      console.log(seriesData)
-      // return {
-      // type: 'bar',
-      // stack: 'Total',
-      // barWidth: "14",
-      // showBackground: false,
-      // itemStyle: {
-      //   normal: {
-      //     color: "#44516d",
-      //   },
-      // },
-      // data: [1704675600000, '-'],
-      // z: 5
-      //     }
+      console.log(seriesData, 'seriesData')
      const chartDom = document.getElementById('mainEquipmentStatus');
      const myChart = this.$echarts.init(chartDom);
      const option = {
@ -223,7 +209,7 @@ export default {
        ]

      }
-      console.log(option.series)
+      console.log(option.series, 'option.series')
      myChart.setOption(option);
    }
  }
--- a/src/views/energySources/component/header.vue
+++ b/src/views/energySources/component/header.vue
@ -65,7 +65,7 @@ export default {
  },
  methods: {
  },
-  beforeDestroyed() {
+  beforeDestroy() {
    clearInterval(this.timeFun)
  },
 };
--- a/src/views/energySources/component/load.vue
+++ b/src/views/energySources/component/load.vue
@ -3,7 +3,7 @@
    <tit :title="'负荷分析'">
      <div class="tit-r">
        <span style="color: #fff;">选择时间：</span>
-        <el-date-picker size="mini" v-model="selectDate" type="date" placeholder="选择月" :prefix-icon="null"
+        <el-date-picker size="mini" v-model="selectDate" type="date" placeholder="选择月" :prefix-icon="null" :clearable="false"
          style="width: 1.3rem;margin-right: 0.26rem;" format="yyyy-MM-dd" value-format="yyyy-MM-dd" @change="changeDate">
        </el-date-picker>
        单位：kw·h
--- a/src/views/energySourcesProvince/component/electricity.vue
+++ b/src/views/energySourcesProvince/component/electricity.vue
@ -53,7 +53,7 @@ export default {
          if (i == 0) {
            e.label.offset = [12, 0]
          } else if (i == arr.length - 1) {
-            e.label.offset = [-12, 0]
+            e.label.offset = [-30, 0]
          } else { 
            e.label.offset = [0, 0]
          }
--- a/src/views/energySourcesProvince/component/emissionAll.vue
+++ b/src/views/energySourcesProvince/component/emissionAll.vue
@ -47,7 +47,7 @@ export default {
      this.getData()
    }, 300000)
  },
-  beforeDestroyed() {
+  beforeDestroy() {
    clearInterval(this.timeFun)
  },
  methods: {
--- a/src/views/energySourcesProvince/component/header.vue
+++ b/src/views/energySourcesProvince/component/header.vue
@ -53,7 +53,7 @@ export default {
  },
  methods: {
  },
-  beforeDestroyed() {
+  beforeDestroy() {
    clearInterval(this.timesFun)
  },
 };
--- a/src/views/energySourcesProvince/component/intensity.vue
+++ b/src/views/energySourcesProvince/component/intensity.vue
@ -43,7 +43,7 @@ export default {
          if (i == 0) {
            json.label.offset = [12, 0]
          } else if (i == datas.length - 1) {
-            json.label.offset = [-12, 0]
+            json.label.offset = [-20, 0]
          } else {
            json.label.offset = [0, 0]
          }
--- a/src/views/energySourcesProvince/component/statistics.vue
+++ b/src/views/energySourcesProvince/component/statistics.vue
@ -65,7 +65,7 @@ export default {
    }, 300000)
  },
 
-  beforeDestroyed() {
+  beforeDestroy() {
    clearInterval(this.timeFun)
  },
  methods: {
--- a/src/views/energySourcesProvince/component/tendency.vue
+++ b/src/views/energySourcesProvince/component/tendency.vue
@ -42,12 +42,13 @@ export default {
          if (i == 0) {
            json.label.offset = [12, 0]
          } else if (i == datas.length - 1) {
-            json.label.offset = [-12, 0]
+            json.label.offset = [-20, 0]
          } else {
            json.label.offset = [0, 0]
          }
          return json
        })
+        
        this.echartsInit(xAxisData, seriesData)
      })
    },