能源管理修改

src/views/module_ems/energyAnalyse/balanceAnalysis/index.vue

@@ -5,6 +5,7 @@
 </template>
 // 用能平衡分析
 <script>
+import { httpAction, getAction } from '@/api/manage'
   export default {
     name: '',
     data () {
@@ -21,4 +22,7 @@
 </script>
 
 <style lang="less" scoped>
+  @import '~@/assets/less/uStyle.less';
+</style>
+<style lang="less" scoped>
 </style>

src/views/module_ems/energyAnalyse/components/commonSearch.vue

@@ -4,15 +4,16 @@
       <a-row :gutter="24">
         <a-col :xl="6" :lg="7" :md="8" :sm="24">
           <a-form-item label="区域" prop="spaceId">
-            <a-cascader
+            <j-tree-select
+              ref="treeSelect"
+              placeholder="请选择上级"
               v-model="queryParams.spaceId"
-              placeholder="请选择区域"
-              :allowClear="true"
-              :props="{ multiple: true, checkStrictly: true }"
-              filterable
-              :options="spaceOptions"
-              :field-names="spaceProps"
-            ></a-cascader>
+              dict="base_space,name,id"
+              pidField="parentid"
+              pidValue="0"
+              hasChildField="has_child"
+            >
+            </j-tree-select>
           </a-form-item>
         </a-col>
         <a-col :xl="6" :lg="7" :md="8" :sm="24" v-if="type !== 'nodate'">
@@ -70,17 +71,9 @@ export default {
   },
   data() {
     return {
-      spaceOptions: [],
-      spaceProps: {
-        value: 'id',
-        label: 'name',
-        children: 'children',
-        emitPath: false,
-        checkStrictly: true,
-      },
       showSearch: false,
       queryParams: {
-        spaceId: 288348631531521,
+        spaceId: '288348631531521',
         beginTime: null, // 只有能耗总览不需要
         endTime: null, // 只有能耗总览不需要
         date: [],
@@ -95,29 +88,14 @@ export default {
         pageNo: '1',
         pageSize: '100',
       },
-      url: {
-        // list: "/space/space/rootList",
-        list: '/space/space/list',
-        childList: '/space/space/childList',
-        getChildListBatch: '/space/space/getChildListBatch',
-      },
+      url: {},
     }
   },
   created() {
-    this.getList()
     this.getNowDate()
   },
   mounted() {},
   methods: {
-    /** 查询区域管理列表 */
-    getList() {
-      // this.loading = true;
-      getAction(this.url.list, this.params).then((response) => {
-        this.spaceOptions = this.handleTree(response.result, 'id', 'parentid')
-        console.log('区域信息', this.spaceOptions)
-        // this.loading = false;
-      })
-    },
     /**
      * 查询当天日期
      */

src/views/module_ems/energyAnalyse/demandAnalysis/index.vue

@@ -1,193 +1,197 @@
 <template>
-  <div class="demand-analysis" v-loading="loading">
+  <div class="demand-analysis" :loading="loading">
     <commonSearch ref="commonSearch" type="daterange" @search="handleSearch"></commonSearch>
-    <div class="item-echarts" ref="echarts" :style="{height: echartsHeight + 'px'}"></div>
+    <div class="item-echarts" ref="echarts" :style="{ height: echartsHeight + 'px' }"></div>
   </div>
 </template>
 // 需量分析
 <script>
-  import * as echarts from 'echarts';
-  import commonSearch from '../components/commonSearch.vue'
-  export default {
-    name: '',
-    components: {
-      commonSearch
-    },
-    data () {
-      return {
-        loading: true,
-        echartsHeight: window.innerHeight - 84 - 60 - 30,
-        myChart: null,
-        url: {
-          list: "/ems/statistics/demandanalysis",
-        },
-        monthsplit: [],
-        // monthsplit: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
-        // mubiao: [],
-        mubiao: [153, 160, 145, 145, 125 ],
-        // mubiao: [153, 160, 145, 145, 125, 195, 210, 145, 180, 160, 210, 170 ],
-        shiji: [],
-        // shiji: [120, 132, 101, 134, 90, 230, 210, 160, 175, 150, 195, 180]
-      }
-    },
-    created () {
+import * as echarts from 'echarts'
+import commonSearch from '../components/commonSearch.vue'
+import { httpAction, getAction } from '@/api/manage'
+import { testdata } from '../testdata';
+export default {
+  name: '',
+  components: {
+    commonSearch,
+  },
+  data() {
+    return {
+      loading: true,
+      echartsHeight: window.innerHeight - 84 - 60 - 30,
+      myChart: null,
+      url: {
+        list: '/ems/statistics/demandanalysis',
+      },
+      monthsplit: [],
+      mubiao: [153, 160, 145, 145, 125],
+      shiji: [],
+    }
+  },
+  created() {},
+  mounted() {
+    this.$nextTick(() => {
+      this.getTest()
+      // this.getDemandanalysis()
+    })
+  },
+  methods: {
+    // 后端好了需要删掉
+    getTest() {
+      this.monthsplit = testdata.demanddata.monthsplit
+      this.mubiao = testdata.demanddata.mubiao
+      this.shiji = testdata.demanddata.shiji
+      this.initEcharts()
     },
-    mounted() {
-      this.$nextTick(() => {
-        this.getDemandanalysis()
+    async getDemandanalysis() {
+      this.loading = true
+      var data = this.$refs.commonSearch.queryParams
+      console.log(data)
+      getAction(this.url.list, data).then((response) => {
+        console.log(response)
+        this.monthsplit = response.data.monthsplit
+        this.mubiao = response.data.mubiao
+        this.shiji = response.data.shiji
+        this.loading = false
       })
+      this.initEcharts()
     },
-    methods: {
-      async getDemandanalysis(){
-        this.loading = true
-        var data = this.$refs.commonSearch.queryParams
-        console.log(data)
-        getAction(this.url.list, data).then(response => {
-          console.log(response)
-          this.monthsplit = response.data.monthsplit
-          this.mubiao = response.data.mubiao
-          this.shiji = response.data.shiji
-          this.loading = false
-        })
-        this.initEcharts()
-      },
-      /**
-       * @param span series 中最大值与最小值的差值
-       * @param splitNumber 坐标轴分割段数
-       * @param round 折线图中需要传 true
-       * @returns {number} 处理后 max 的最后结果
-       */
-      nice(span, splitNumber, round) {
-        let val = span / splitNumber
-        var exponent = Math.floor(Math.log(val) / Math.LN10);
-        var exp10 = Math.pow(10, exponent);
-        var f = val / exp10; // 1 <= f < 10
-      
-        var nf;
-      
-        if (round) {
-          if (f < 1.5) {
-            nf = 1;
-          } else if (f < 2.5) {
-            nf = 2;
-          } else if (f < 4) {
-            nf = 3;
-          } else if (f < 7) {
-            nf = 5;
-          } else {
-            nf = 10;
-          }
+    /**
+     * @param span series 中最大值与最小值的差值
+     * @param splitNumber 坐标轴分割段数
+     * @param round 折线图中需要传 true
+     * @returns {number} 处理后 max 的最后结果
+     */
+    nice(span, splitNumber, round) {
+      let val = span / splitNumber
+      var exponent = Math.floor(Math.log(val) / Math.LN10)
+      var exp10 = Math.pow(10, exponent)
+      var f = val / exp10 // 1 <= f < 10
+
+      var nf
+
+      if (round) {
+        if (f < 1.5) {
+          nf = 1
+        } else if (f < 2.5) {
+          nf = 2
+        } else if (f < 4) {
+          nf = 3
+        } else if (f < 7) {
+          nf = 5
         } else {
-          if (f < 1) {
-            nf = 1;
-          } else if (f < 2) {
-            nf = 2;
-          } else if (f < 3) {
-            nf = 3;
-          } else if (f < 5) {
-            nf = 5;
-          } else {
-            nf = 10;
-          }
+          nf = 10
         }
-      
-        val = nf * exp10; // Fix 3 * 0.1 === 0.30000000000000004 issue (see IEEE 754).
-        // 20 is the uppper bound of toFixed.
-      
-        const step = exponent >= -20 ? +val.toFixed(exponent < 0 ? -exponent : 0) : val;
-      
-        let result
-        for(let i = splitNumber - 3; i < splitNumber + 3; i++) {
-          result = step * i
-          if (result > span) break
+      } else {
+        if (f < 1) {
+          nf = 1
+        } else if (f < 2) {
+          nf = 2
+        } else if (f < 3) {
+          nf = 3
+        } else if (f < 5) {
+          nf = 5
+        } else {
+          nf = 10
         }
-      
-        return result
-      },
-      initEcharts(){
-        var _this = this
-        var chartDom = _this.$refs.echarts
-        _this.myChart = echarts.init(chartDom);
-        var option;
+      }
 
-        option = {
-          title: {
-            text: '需量分析'
-          },
-          tooltip: {
-            trigger: 'axis'
-          },
-          legend: {
-            data: ['实际需量', '目标需量']
-          },
-          toolbox: {
-            show: true,
-            feature: {
-              // magicType: { type: ['line', 'bar'] },
-              saveAsImage: {}
-            }
-          },
-          xAxis: {
-            type: 'category',
-            boundaryGap: false,
-            data: this.monthsplit,
+      val = nf * exp10 // Fix 3 * 0.1 === 0.30000000000000004 issue (see IEEE 754).
+      // 20 is the uppper bound of toFixed.
+
+      const step = exponent >= -20 ? +val.toFixed(exponent < 0 ? -exponent : 0) : val
+
+      let result
+      for (let i = splitNumber - 3; i < splitNumber + 3; i++) {
+        result = step * i
+        if (result > span) break
+      }
+
+      return result
+    },
+    initEcharts() {
+      var _this = this
+      var chartDom = _this.$refs.echarts
+      _this.myChart = echarts.init(chartDom)
+      var option
+
+      option = {
+        title: {
+          text: '需量分析',
+        },
+        tooltip: {
+          trigger: 'axis',
+        },
+        legend: {
+          data: ['实际需量', '目标需量'],
+        },
+        toolbox: {
+          show: true,
+          feature: {
+            // magicType: { type: ['line', 'bar'] },
+            saveAsImage: {},
           },
-          yAxis: {
-            type: 'value',
-            axisLabel: {
-              formatter: '{value}kVA'
-            }
+        },
+        xAxis: {
+          type: 'category',
+          boundaryGap: false,
+          data: this.monthsplit,
+        },
+        yAxis: {
+          type: 'value',
+          axisLabel: {
+            formatter: '{value}kVA',
           },
-          series: [
-            {
-              name: '实际需量',
-              type: 'line',
-              // smooth: true, //平滑曲线显示
-              barWidth: '55%',
-              itemStyle: {
-                normal: {
-                  color: function (params) {
-                    console.log(params)
-                    if(params.data > _this.mubiao[params.dataIndex]){
-                      return '#F5B544'
-                    } else {
-                      return '#0C75FF'
-                    }
-                  },
-                  // barBorderRadius: 11,
-                }
-                
-              },
-              markPoint: {
-                data: [
-                  { type: 'max', name: 'Max' },
-                  { type: 'min', name: 'Min' }
-                ]
+        },
+        series: [
+          {
+            name: '实际需量',
+            type: 'line',
+            // smooth: true, //平滑曲线显示
+            barWidth: '55%',
+            itemStyle: {
+              normal: {
+                color: function (params) {
+                  console.log(params)
+                  if (params.data > _this.mubiao[params.dataIndex]) {
+                    return '#F5B544'
+                  } else {
+                    return '#0C75FF'
+                  }
+                },
+                // barBorderRadius: 11,
               },
-              // markLine: {
-              //   data: [{ type: 'average', name: 'Avg' }]
-              // }
-              data: this.shiji,
             },
-            {
-              name: '目标需量',
-              type: 'line',
-              // smooth: true, //平滑曲线显示
-              step: 'middle',
-              symbol: 'none',
-              // showAllSymbol: true, //显示所有图形。
-              // symbol: "circle", //标记的图形为实心圆
-              // symbolSize: 1, //标记的大小
-              itemStyle: {
-                //折线拐点标志的样式
-                color: "rgba(5,140,255, 0.2)"
-              },
-              lineStyle: {
-                  color: "rgba(5,140,255, 0.2)"
-              },
-              areaStyle:{
-                  color: "rgba(5,140,255, 0.2)"
-              },
+            markPoint: {
+              data: [
+                { type: 'max', name: 'Max' },
+                { type: 'min', name: 'Min' },
+              ],
+            },
+            // markLine: {
+            //   data: [{ type: 'average', name: 'Avg' }]
+            // }
+            data: this.shiji,
+          },
+          {
+            name: '目标需量',
+            type: 'line',
+            // smooth: true, //平滑曲线显示
+            step: 'middle',
+            symbol: 'none',
+            // showAllSymbol: true, //显示所有图形。
+            // symbol: "circle", //标记的图形为实心圆
+            // symbolSize: 1, //标记的大小
+            itemStyle: {
+              //折线拐点标志的样式
+              color: 'rgba(5,140,255, 0.2)',
+            },
+            lineStyle: {
+              color: 'rgba(5,140,255, 0.2)',
+            },
+            areaStyle: {
+              color: 'rgba(5,140,255, 0.2)',
+            },
             //   areaStyle: {
             //     normal: {
             //         color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
@@ -203,66 +207,69 @@
             //         shadowBlur: 20
             //     }
             // },
-              data: this.mubiao,
-              
-              // markPoint: {
-              //   data: [{ name: '周最低', value: -2, xAxis: 1, yAxis: -1.5 }]
-              // },
-              // markLine: {
-              //   data: [
-              //     { type: 'average', name: 'Avg' },
-              //     [
-              //       {
-              //         symbol: 'none',
-              //         x: '90%',
-              //         yAxis: 'max'
-              //       },
-              //       {
-              //         symbol: 'circle',
-              //         label: {
-              //           position: 'start',
-              //           formatter: 'Max'
-              //         },
-              //         type: 'max',
-              //         name: '最高点'
-              //       }
-              //     ]
-              //   ]
-              // }
-            }
-          ]
-        };
+            data: this.mubiao,
 
-        option && _this.myChart.setOption(option);
-        window.addEventListener("resize",function (){
-          _this.myChart.resize();
-        });
-      },
-      /** 搜索按钮操作 */
-      handleSearch(param) {
-        console.log(param)
-        this.getDemandanalysis()
-      },
-    }
-  }
+            // markPoint: {
+            //   data: [{ name: '周最低', value: -2, xAxis: 1, yAxis: -1.5 }]
+            // },
+            // markLine: {
+            //   data: [
+            //     { type: 'average', name: 'Avg' },
+            //     [
+            //       {
+            //         symbol: 'none',
+            //         x: '90%',
+            //         yAxis: 'max'
+            //       },
+            //       {
+            //         symbol: 'circle',
+            //         label: {
+            //           position: 'start',
+            //           formatter: 'Max'
+            //         },
+            //         type: 'max',
+            //         name: '最高点'
+            //       }
+            //     ]
+            //   ]
+            // }
+          },
+        ],
+      }
+
+      option && _this.myChart.setOption(option)
+      window.addEventListener('resize', function () {
+        _this.myChart.resize()
+      })
+    },
+    /** 搜索按钮操作 */
+    handleSearch(param) {
+      this.getTest()
+      // this.getDemandanalysis()
+    },
+  },
+}
 </script>
 
 <style lang="less" scoped>
-.demand-analysis{
+  @import '~@/assets/less/uStyle.less';
+</style>
+<style lang="less" scoped>
+.demand-analysis {
   min-height: calc(100vh - 84px);
   padding: 10px;
-  .search-container{
-    box-shadow: 0 2px 10px rgba(0,0,0,.1);
+  .search-container {
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
     padding-top: 12px;
     margin-bottom: 10px;
-    .el-form-item--small.el-form-item{
+    .el-form-item--small.el-form-item {
       margin-bottom: 14px;
     }
   }
-  .item-echarts{
+  .item-echarts {
     // min-height: calc(100vh - 174px);
     padding: 10px;
-    box-shadow: 0 2px 10px rgba(0,0,0,.1);
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
   }
 }
 </style>

src/views/module_ems/energyAnalyse/electricityDay/index.vue

@@ -69,6 +69,7 @@
 
 <script>
 
+import { httpAction, getAction } from '@/api/manage'
 export default {
   name: "emselectricityday",
   data() {

src/views/module_ems/energyAnalyse/energyDashboard/index.vue

@@ -1,64 +1,71 @@
 <template>
-  <div class="page-header-index-wide">
-    <!-- <div class="energy-overView" :loading="loading"> -->
+  <div class="energy-overView" :loading="loading">
     <commonSearch hasAreaSearch ref="commonSearch" type="nodate" @search="handleSearch"></commonSearch>
-    <a-row :gutter="24">
-      <a-col :sm="24" :md="12" :xl="6">
-      <div class="top-container u-flex">
-        <div class="louyu u-flex common-box">
-          <div class="common-title">区域基本信息</div>
-          <img src="../../../../assets/louyu.png" alt="" />
-        </div>
-        <div class="sort-top5-container common-box">
-          <div class="common-title">当月用电量TOP5(kWh)</div>
-          <div class="sort-top5" ref="sortTop5"></div>
+    <div class="top-container u-flex">
+      <div class="louyu u-flex common-box">
+        <div class="common-title">区域基本信息</div>
+        <img src="../../../../assets/louyu.png" alt="" />
+        <a-descriptions :column="2">
+          <a-descriptions-item label="建筑名称">{{ energySpace.name }}</a-descriptions-item>
+          <a-descriptions-item label="建筑面积">{{ energySpace.builtarea }} ㎡</a-descriptions-item>
+          <a-descriptions-item label="空调面积">{{ energySpace.aircondarea }} ㎡</a-descriptions-item>
+          <a-descriptions-item label="采暖面积">{{ energySpace.heatarea }} ㎡</a-descriptions-item>
+          <!-- <el-descriptions-item label="用能人数">{{energySpace.}}</el-descriptions-item> -->
+          <!-- <el-descriptions-item label="建筑年代">{{energySpace.}}</el-descriptions-item> -->
+          <!-- <el-descriptions-item label="建筑用途">{{energySpace.}}</el-descriptions-item> -->
+        </a-descriptions>
+      </div>
+      <div class="sort-top5-container common-box">
+        <div class="common-title">当月用电量TOP5(kWh)</div>
+        <div class="sort-top5" ref="sortTop5"></div>
+      </div>
+      <div class="info-total">
+        <div class="yongdian-xuliang common-box">
+          <div class="common-title">用电需量(kVA)</div>
+          <div class="info-container u-flex-jaa">
+            <div class="item-info">
+              <div class="name">即时需量</div>
+              <div class="value">{{ demandStatistics.jishi }}</div>
+            </div>
+            <el-divider direction="vertical"></el-divider>
+            <div class="item-info">
+              <div class="name">需量峰值</div>
+              <div class="value">{{ demandStatistics.fengzhi }}</div>
+            </div>
+            <el-divider direction="vertical"></el-divider>
+            <div class="item-info">
+              <div class="name">目标需量</div>
+              <div class="value">{{ demandStatistics.mubiao }}</div>
+            </div>
+          </div>
         </div>
-        <div class="info-total">
-          <div class="yongdian-xuliang common-box">
-            <div class="common-title">用电需量(kVA)</div>
+        <div class="u-flex co2-tianqi">
+          <div class="co2 common-box">
+            <div class="common-title">CO2排放</div>
             <div class="info-container u-flex-jaa">
               <div class="item-info">
-                <div class="name">即时需量</div>
-                <div class="value">{{ demandStatistics.jishi }}</div>
-              </div>
-              <div class="item-info">
-                <div class="name">需量峰值</div>
-                <div class="value">{{ demandStatistics.fengzhi }}</div>
-              </div>
-              <div class="item-info">
-                <div class="name">目标需量</div>
-                <div class="value">{{ demandStatistics.mubiao }}</div>
+                <div class="name">本月排放(Kg)</div>
+                <div class="value">{{ demandStatistics.co2 }}</div>
               </div>
             </div>
           </div>
-          <div class="u-flex co2-tianqi">
-            <div class="co2 common-box">
-              <div class="common-title">CO2排放</div>
-              <div class="info-container u-flex-jaa">
-                <div class="item-info">
-                  <div class="name">本月排放(Kg)</div>
-                  <div class="value">{{ demandStatistics.co2 }}</div>
-                </div>
+          <div class="tianqi common-box">
+            <div class="common-title">环境信息</div>
+            <div class="info-container u-flex-jaa">
+              <div class="item-info">
+                <div class="name">湿度(%)</div>
+                <div class="value">{{ demandStatistics.shidu }}</div>
               </div>
-            </div>
-            <div class="tianqi common-box">
-              <div class="common-title">环境信息</div>
-              <div class="info-container u-flex-jaa">
-                <div class="item-info">
-                  <div class="name">湿度(%)</div>
-                  <div class="value">{{ demandStatistics.shidu }}</div>
-                </div>
-                <div class="item-info">
-                  <div class="name">温度(℃)</div>
-                  <div class="value">{{ demandStatistics.wendu }}</div>
-                </div>
+              <el-divider direction="vertical"></el-divider>
+              <div class="item-info">
+                <div class="name">温度(℃)</div>
+                <div class="value">{{ demandStatistics.wendu }}</div>
               </div>
             </div>
           </div>
         </div>
       </div>
-      </a-col>
-    </a-row>
+    </div>
     <div class="bottom-container u-flex">
       <div class="xiaohao common-box">
         <div class="common-title">当月能源消耗总标煤(kg)</div>
@@ -78,11 +85,12 @@
     </div>
   </div>
 </template>
-// 能耗总览
+
 <script>
 import * as echarts from 'echarts'
 import commonSearch from '../components/commonSearch'
 import { httpAction, getAction } from '@/api/manage'
+import { testdata } from '../testdata';
 export default {
   name: '',
   components: {
@@ -123,348 +131,20 @@ export default {
       url: {
         list: '/ems/statistics/energyoverview',
       },
-      testdata: {
-        qita: [
-          0, 0, 51.2, 90.4, 1251, 824.2, 1099.2, 1309, 1691.2, 1940.6, 2342.2, 2702.6, 2462.4, 2631.2, 2486, 2799.6,
-          1307, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
-        ],
-        environmentStatistics: [
-          {
-            equipmentid: null,
-            equipmentname: null,
-            year: null,
-            month: null,
-            week: null,
-            day: null,
-            yearmonth: null,
-            dayofweek: null,
-            howManyTimes: null,
-            howManyTimes2: null,
-            howManyValue: 3988.544,
-            howManyValue2: 0,
-            ids: null,
-            type: 'CO2排放',
-            otherValue: 0,
-            otherValue2: 0,
-          },
-          {
-            equipmentid: null,
-            equipmentname: null,
-            year: null,
-            month: null,
-            week: null,
-            day: null,
-            yearmonth: null,
-            dayofweek: null,
-            howManyTimes: null,
-            howManyTimes2: null,
-            howManyValue: 46.3,
-            howManyValue2: 0,
-            ids: null,
-            type: '室外湿度',
-            otherValue: 0,
-            otherValue2: 0,
-          },
-          {
-            equipmentid: null,
-            equipmentname: null,
-            year: null,
-            month: null,
-            week: null,
-            day: null,
-            yearmonth: null,
-            dayofweek: null,
-            howManyTimes: null,
-            howManyTimes2: null,
-            howManyValue: 25.1,
-            howManyValue2: 0,
-            ids: null,
-            type: '室外温度',
-            otherValue: 0,
-            otherValue2: 0,
-          },
-        ],
-        dongli: [
-          0, 0, 47.2, 84.4, 1152, 893, 1096.2, 1118.6, 1940.4, 1988.4, 1569.6, 1498.8, 1294.8, 1308, 1293.6, 1482,
-          988.8, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
-        ],
-        demandStatistics: [
-          {
-            equipmentid: null,
-            equipmentname: null,
-            year: null,
-            month: null,
-            week: null,
-            day: null,
-            yearmonth: null,
-            dayofweek: null,
-            howManyTimes: null,
-            howManyTimes2: null,
-            howManyValue: 19583.7,
-            howManyValue2: 0,
-            ids: null,
-            type: '需量峰值',
-            otherValue: 0,
-            otherValue2: 0,
-          },
-          {
-            equipmentid: null,
-            equipmentname: null,
-            year: null,
-            month: null,
-            week: null,
-            day: null,
-            yearmonth: null,
-            dayofweek: null,
-            howManyTimes: null,
-            howManyTimes2: null,
-            howManyValue: 19430.1,
-            howManyValue2: 0,
-            ids: null,
-            type: '即时需量',
-            otherValue: 0,
-            otherValue2: 0,
-          },
-          {
-            equipmentid: null,
-            equipmentname: null,
-            year: null,
-            month: null,
-            week: null,
-            day: null,
-            yearmonth: null,
-            dayofweek: null,
-            howManyTimes: null,
-            howManyTimes2: null,
-            howManyValue: 0,
-            howManyValue2: 0,
-            ids: null,
-            type: '目标需量',
-            otherValue: 0,
-            otherValue2: 0,
-          },
-        ],
-        kgceStatistics: [
-          {
-            equipmentid: null,
-            equipmentname: null,
-            year: null,
-            month: null,
-            week: null,
-            day: null,
-            yearmonth: null,
-            dayofweek: null,
-            howManyTimes: null,
-            howManyTimes2: null,
-            howManyValue: 2166.208,
-            howManyValue2: 0,
-            ids: null,
-            type: '动力用电',
-            otherValue: 0,
-            otherValue2: 0,
-          },
-          {
-            equipmentid: null,
-            equipmentname: null,
-            year: null,
-            month: null,
-            week: null,
-            day: null,
-            yearmonth: null,
-            dayofweek: null,
-            howManyTimes: null,
-            howManyTimes2: null,
-            howManyValue: 12.249,
-            howManyValue2: 0,
-            ids: null,
-            type: '空调用电',
-            otherValue: 0,
-            otherValue2: 0,
-          },
-          {
-            equipmentid: null,
-            equipmentname: null,
-            year: null,
-            month: null,
-            week: null,
-            day: null,
-            yearmonth: null,
-            dayofweek: null,
-            howManyTimes: null,
-            howManyTimes2: null,
-            howManyValue: 3048.512,
-            howManyValue2: 0,
-            ids: null,
-            type: '其它用电',
-            otherValue: 0,
-            otherValue2: 0,
-          },
-        ],
-        kongtiao: [
-          0, 0, 0, 0, 0, 0, 0, 2.8, 10.4, 10, 10, 11.2, 10.8, 8.8, 8.8, 16.4, 11.2, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
-          0,
-        ],
-        daysplit: [
-          '01',
-          '02',
-          '03',
-          '04',
-          '05',
-          '06',
-          '07',
-          '08',
-          '09',
-          '10',
-          '11',
-          '12',
-          '13',
-          '14',
-          '15',
-          '16',
-          '17',
-          '18',
-          '19',
-          '20',
-          '21',
-          '22',
-          '23',
-          '24',
-          '25',
-          '26',
-          '27',
-          '28',
-          '29',
-          '30',
-        ],
-        top5Statistics: [
-          {
-            equipmentid: 301155974447105,
-            equipmentname: '生产线1米1',
-            year: 2023,
-            month: 10,
-            week: null,
-            day: null,
-            yearmonth: null,
-            dayofweek: null,
-            howManyTimes: null,
-            howManyTimes2: null,
-            howManyValue: 1096.4,
-            howManyValue2: 1745.2,
-            ids: null,
-            type: null,
-            otherValue: 0,
-            otherValue2: 0,
-          },
-          {
-            equipmentid: 300984435802113,
-            equipmentname: '零件清洗机',
-            year: 2023,
-            month: 10,
-            week: null,
-            day: null,
-            yearmonth: null,
-            dayofweek: null,
-            howManyTimes: null,
-            howManyTimes2: null,
-            howManyValue: 953.6,
-            howManyValue2: 0,
-            ids: null,
-            type: null,
-            otherValue: 0,
-            otherValue2: 0,
-          },
-          {
-            equipmentid: 300986291781633,
-            equipmentname: '清洗机',
-            year: 2023,
-            month: 10,
-            week: null,
-            day: null,
-            yearmonth: null,
-            dayofweek: null,
-            howManyTimes: null,
-            howManyTimes2: null,
-            howManyValue: 734,
-            howManyValue2: 646.4,
-            ids: null,
-            type: null,
-            otherValue: 0,
-            otherValue2: 0,
-          },
-          {
-            equipmentid: 301149691379713,
-            equipmentname: '双工位焊接机器人NZCR-500YGD×2M',
-            year: 2023,
-            month: 10,
-            week: null,
-            day: null,
-            yearmonth: null,
-            dayofweek: null,
-            howManyTimes: null,
-            howManyTimes2: null,
-            howManyValue: 725.2,
-            howManyValue2: 1505.6,
-            ids: null,
-            type: null,
-            otherValue: 0,
-            otherValue2: 0,
-          },
-          {
-            equipmentid: 300988051292161,
-            equipmentname: '摩擦焊MCH-110T',
-            year: 2023,
-            month: 10,
-            week: null,
-            day: null,
-            yearmonth: null,
-            dayofweek: null,
-            howManyTimes: null,
-            howManyTimes2: null,
-            howManyValue: 550.4,
-            howManyValue2: 613.2,
-            ids: null,
-            type: null,
-            otherValue: 0,
-            otherValue2: 0,
-          },
-        ],
-        zhaoming: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
-        energySpace: {
-          createBy: 'admin',
-          createTime: '2023-05-11 17:09:03',
-          updateBy: null,
-          updateTime: null,
-          remark: null,
-          params: {},
-          spaceid: 288348631531521,
-          parentid: 0,
-          name: '生产车间',
-          serialnum: 'AREA0002',
-          spacetype: null,
-          deptid: 100,
-          builtarea: 1000,
-          aircondsys: '0',
-          heatsys: '0',
-          aircondarea: 0,
-          heatarea: 0,
-          parentName: null,
-          children: [],
-        },
-      },
     }
   },
   created() {},
   mounted() {
     this.$nextTick(() => {
       this.getTest()
-      // this.initSortTop5()
-      // this.initPieDianliang()
-      // this.initTotalEleTrend()
+      // this.getEnergyoverview()
     })
   },
   methods: {
+    // 后端好了需要删掉
     getTest() {
-      var listData = this.testdata
+      var listData = testdata.dashboarddata
+      console.log(listData)
       // 用电需量
       this.demandStatistics.jishi = listData.demandStatistics.find((item) => item.type === '即时需量').howManyValue
       this.demandStatistics.fengzhi = listData.demandStatistics.find((item) => item.type === '需量峰值').howManyValue
@@ -505,6 +185,9 @@ export default {
       this.totalEleTrend.qita = listData.qita
       this.energySpace = listData.energySpace
       this.loading = false
+      this.initSortTop5()
+      this.initPieDianliang()
+      this.initTotalEleTrend()
     },
     async getEnergyoverview() {
       // {spaceId: 277797283102721}
@@ -561,8 +244,10 @@ export default {
       })
     },
     handleSearch(param) {
-      this.getEnergyoverview()
+      this.getTest()
+      // this.getEnergyoverview()
     },
+    // 当月用电量TOP5 柱状图
     initSortTop5() {
       var _this = this
       var chartDom = this.$refs.sortTop5
@@ -752,13 +437,13 @@ export default {
           },
         ],
       }
-
       option && myChart.setOption(option)
 
       window.addEventListener('resize', function () {
         myChart.resize()
       })
     },
+    // 当月能源消耗总标煤 饼图
     initPieDianliang1() {
       var chartDom = this.$refs.zongbiao
       var myChart = echarts.init(chartDom)
@@ -877,6 +562,7 @@ export default {
         myChart.resize()
       })
     },
+    // 总用电趋势图 柱状图
     initPieDianliang() {
       var chartDom = this.$refs.zongbiao
       var myChart = echarts.init(chartDom)
@@ -1037,7 +723,9 @@ export default {
   },
 }
 </script>
-
+<style lang="less" scoped>
+  @import '~@/assets/less/uStyle.less';
+</style>
 <style lang="less" scoped>
 .energy-overView {
   min-height: calc(100vh - 84px);
@@ -1081,6 +769,9 @@ export default {
       img {
         object-fit: contain;
       }
+      .ant-descriptions {
+        background-color: #ffffff;
+      }
     }
     .sort-top5-container {
       flex: 1.2;

src/views/module_ems/energyAnalyse/energyItem/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="item-zedEnergy" v-loading="loading">
+  <div class="item-zedEnergy" :loading="loading">
     <commonSearch ref="commonSearch" type="day" @search="handleSearch"></commonSearch>
     <div class="statistics-container u-flex">
       <!-- 日 -->
@@ -74,6 +74,8 @@
 <script>
   import * as echarts from 'echarts';
   import commonSearch from '../components/commonSearch.vue'
+  import { httpAction, getAction } from '@/api/manage'
+  import { testdata } from '../testdata';
   export default {
     name: '',
     components: {
@@ -115,10 +117,68 @@
     },
     mounted() {
       this.$nextTick(() => {
-        this.getItemizedenergy()
+        this.getTest()
+        // this.getItemizedenergy()
       })
     },
     methods: {
+      // 后端好了需要删掉
+      getTest() {
+        var listData = testdata.itemdata
+        // 日
+        this.itemizedStatistics.nowDay = (listData.dayStatistics.find(item=>item.type === '当日用能')).howManyValue
+        this.itemizedStatistics.lastDay = (listData.dayStatistics.find(item=>item.type === '昨日用能')).howManyValue
+        this.itemizedStatistics.huanbiDay = (listData.dayStatistics.find(item=>item.type === '环比')).howManyValue
+        // 月
+        this.itemizedStatistics.nowMonth = (listData.monthStatistics.find(item=>item.type === '当月用能')).howManyValue
+        this.itemizedStatistics.lastMonth = (listData.monthStatistics.find(item=>item.type === '上月用能')).howManyValue
+        this.itemizedStatistics.huanbiMonth = (listData.monthStatistics.find(item=>item.type === '环比')).howManyValue
+        // listData.monthStatistics.find(item=>if (item.type === '环比') {return item.howManyValue})
+        // 周
+        this.itemizedStatistics.nowWeek = (listData.weekStatistics.find(item=>item.type === '当周用能')).howManyValue
+        this.itemizedStatistics.lastWeek = (listData.weekStatistics.find(item=>item.type === '上周用能')).howManyValue
+        this.itemizedStatistics.huanbiWeek = (listData.weekStatistics.find(item=>item.type === '环比')).howManyValue
+
+        this.dayPieData = listData.dayStatistics.map(res => {
+          if(res.type === '能耗分项'){
+            var item ={
+              name: res.equipmentname,
+              value: res.howManyValue,
+            }
+            return item
+          } 
+          
+        })
+        this.weekPieData = listData.weekStatistics.map(res => {
+          if(res.type === '能耗分项'){
+            var item ={
+              name: res.equipmentname,
+              value: res.howManyValue,
+            }
+            return item
+          }
+        })
+        this.monthPieData = listData.monthStatistics.map(res => {
+          if(res.type === '能耗分项'){
+            var item ={
+              name: res.equipmentname,
+              value: res.howManyValue,
+            }
+            return item
+          }
+        })
+        
+        this.hours = listData.hours
+        this.kongtiao = listData.kongtiao
+        this.dongli = listData.dongli
+        this.zhaoming = listData.zhaoming
+        this.qita = listData.qita
+      
+        this.initDayPieCharts()
+        this.initWeekPieCharts()
+        this.initMonthPieCharts()
+        this.initEcharts()
+      },
       async getItemizedenergy(){
         this.loading = true
         var data = this.$refs.commonSearch.queryParams
@@ -435,14 +495,17 @@
       },
       /** 搜索按钮操作 */
       handleSearch(param) {
-        console.log(param)
-        this.getItemizedenergy()
+        this.getTest()
+        // this.getItemizedenergy()
       }
     },
   }
 </script>
 
 <style lang="less" scoped>
+  @import '~@/assets/less/uStyle.less';
+</style>
+<style lang="less" scoped>
 .item-zedEnergy{
   min-height: calc(100vh - 84px);
   padding: 10px;

src/views/module_ems/energyAnalyse/energyRank/index.vue

@@ -1,152 +1,281 @@
 <template>
-  <div class="energy-analysis ranking" v-loading="loading">
+  <div class="energy-analysis ranking" :loading="loading">
     <commonSearch ref="commonSearch" type="daterange" @search="handleSearch"></commonSearch>
     <div class="item-echarts" ref="echarts"></div>
-    <el-table :data="tableData" border style="width: 100%" height="280">
-      <el-table-column prop="equipmentname" label="设备" align="center"></el-table-column>
-      <el-table-column prop="howManyValue" label="总用电(KWH)" align="center"></el-table-column>
-      <el-table-column prop="otherValue" label="占比(%)" align="center"></el-table-column>
-      <el-table-column prop="howManyValue2" label="去年同期(KWH)" align="center"></el-table-column>
-      <el-table-column prop="otherValue2" label="同比增长率(%)" align="center"></el-table-column>
-    </el-table>
+    <a-table
+      rowKey="id"
+      size="middle"
+      bordered
+      :columns="columns"
+      :dataSource="tableData"
+      :pagination="false"
+    >
+      <template slot="htmlSlot" slot-scope="text">
+        <div v-html="text"></div>
+      </template>
+
+      <template slot="imgSlot" slot-scope="text, record">
+        <div style="font-size: 12px; font-style: italic">
+          <span v-if="!text">无图片</span>
+          <img v-else :src="getImgView(text)" :preview="record.id" alt="" style="max-width: 80px; height: 25px" />
+        </div>
+      </template>
+
+      <template slot="fileSlot" slot-scope="text">
+        <span v-if="!text" style="font-size: 12px; font-style: italic">无文件</span>
+        <a-button v-else ghost type="primary" icon="download" size="small" @click="downloadFile(text)">
+          <span>下载</span>
+        </a-button>
+      </template>
+    </a-table>
+    <!-- <a-table :data="tableData" border style="width: 100%" height="280">
+      <a-table-column prop="equipmentname" label="设备" align="center"></a-table-column>
+      <a-table-column prop="howManyValue" label="总用电(KWH)" align="center"></a-table-column>
+      <a-table-column prop="otherValue" label="占比(%)" align="center"></a-table-column>
+      <a-table-column prop="howManyValue2" label="去年同期(KWH)" align="center"></a-table-column>
+      <a-table-column prop="otherValue2" label="同比增长率(%)" align="center"></a-table-column>
+    </a-table> -->
   </div>
 </template>
 // 能耗排名
 <script>
-  import * as echarts from 'echarts';
-  import commonSearch from '../components/commonSearch.vue'
-  export default {
-    name: '',
-    components: {
-      commonSearch
-    },
-    data () {
-      return {
-        loading: true,
-        tableData: [
-          { equipmentname: '园区A栋3FAXA_P电', howManyValue: '301672', zhanbi: '21.73', otherValue: '--', otherValue2: '--' },
-          { equipmentname: '园区A栋2FAXA_L3电', howManyValue: '230412', zhanbi: '16.60', otherValue: '--', otherValue2: '--' },
-          { equipmentname: '园区A栋4FAXA_L3电', howManyValue: '226125', zhanbi: '16.29', otherValue: '--', otherValue2: '--' },
-          { equipmentname: '园区A栋2FAXA_LR电', howManyValue: '212633', zhanbi: '15.32', otherValue: '--', otherValue2: '--' },
-          { equipmentname: '园区A栋3FAXA_AC电', howManyValue: '185498', zhanbi: '13.36', otherValue: '--', otherValue2: '--' },
-          { equipmentname: '园区A栋2FAXA_P电', howManyValue: '181028', zhanbi: '13.23', otherValue: '--', otherValue2: '--' },
-          { equipmentname: '园区A栋1FAXA_L3电', howManyValue: '176050', zhanbi: '12.31', otherValue: '--', otherValue2: '--' },
-        ],
-        yuanquName: ['园区A栋1FAXA_L3电', '园区A栋2FAXA_P电', '园区A栋3FAXA_AC电', '园区A栋2FAXA_LR电', '园区A栋4FAXA_L3电', '园区A栋2FAXA_L3电', '园区A栋3FAXA_P电'],
-        numbers: [176050, 181028, 185498, 212633, 226125, 230412, 301672],
-        url: {
-          list: "/ems/statistics/ranking",
+import * as echarts from 'echarts'
+import commonSearch from '../components/commonSearch.vue'
+import { httpAction, getAction } from '@/api/manage'
+import { JeecgListMixin } from '@/mixins/JeecgListMixin'
+import { testdata } from '../testdata';
+export default {
+  name: '',
+  components: {
+    commonSearch,
+    JeecgListMixin,
+  },
+  data() {
+    return {
+      loading: true,
+      columns: [
+        {
+          title: '设备',
+          align: 'center',
+          dataIndex: 'equipmentname',
         },
-      }
-    },
-    created () {
-    },
-    mounted() {
-      this.$nextTick(() => {
-        this.getRanking()
+        {
+          title: '总用电(KWH)',
+          align: 'center',
+          dataIndex: 'howManyValue',
+        },
+        {
+          title: '占比(%)',
+          align: 'center',
+          dataIndex: 'otherValue',
+        },
+        {
+          title: '去年同期(KWH)',
+          align: 'center',
+          dataIndex: 'howManyValue2',
+        },
+        {
+          title: '同比增长率(%)',
+          align: 'center',
+          dataIndex: 'otherValue2',
+        },
+      ],
+      tableData: [
+        {
+          equipmentname: '园区A栋3FAXA_P电',
+          howManyValue: '301672',
+          zhanbi: '21.73',
+          otherValue: '--',
+          otherValue2: '--',
+        },
+        {
+          equipmentname: '园区A栋2FAXA_L3电',
+          howManyValue: '230412',
+          zhanbi: '16.60',
+          otherValue: '--',
+          otherValue2: '--',
+        },
+        {
+          equipmentname: '园区A栋4FAXA_L3电',
+          howManyValue: '226125',
+          zhanbi: '16.29',
+          otherValue: '--',
+          otherValue2: '--',
+        },
+        {
+          equipmentname: '园区A栋2FAXA_LR电',
+          howManyValue: '212633',
+          zhanbi: '15.32',
+          otherValue: '--',
+          otherValue2: '--',
+        },
+        {
+          equipmentname: '园区A栋3FAXA_AC电',
+          howManyValue: '185498',
+          zhanbi: '13.36',
+          otherValue: '--',
+          otherValue2: '--',
+        },
+        {
+          equipmentname: '园区A栋2FAXA_P电',
+          howManyValue: '181028',
+          zhanbi: '13.23',
+          otherValue: '--',
+          otherValue2: '--',
+        },
+        {
+          equipmentname: '园区A栋1FAXA_L3电',
+          howManyValue: '176050',
+          zhanbi: '12.31',
+          otherValue: '--',
+          otherValue2: '--',
+        },
+      ],
+      yuanquName: [
+        '园区A栋1FAXA_L3电',
+        '园区A栋2FAXA_P电',
+        '园区A栋3FAXA_AC电',
+        '园区A栋2FAXA_LR电',
+        '园区A栋4FAXA_L3电',
+        '园区A栋2FAXA_L3电',
+        '园区A栋3FAXA_P电',
+      ],
+      numbers: [176050, 181028, 185498, 212633, 226125, 230412, 301672],
+      url: {
+        list: '/ems/statistics/ranking',
+      },
+    }
+  },
+  created() {},
+  mounted() {
+    this.$nextTick(() => {
+      this.getTest()
+      // this.getRanking()
+    })
+  },
+  methods: {
+    // 后端好了需要删掉
+    getTest() {
+      this.tableData = testdata.rankdata
+      var yuanquName, numbers
+      yuanquName = this.tableData.map((obj) => {
+        return obj.equipmentname
+      })
+      numbers = this.tableData.map((obj) => {
+        return obj.howManyValue
       })
+      this.yuanquName = yuanquName.filter((item, index) => index < 10)
+      this.numbers = numbers.filter((item, index) => index < 10)
+      this.yuanquName.reverse()
+      this.numbers.reverse()
+      this.initEcharts()
     },
-    methods: {
-      async getRanking(){
-        this.loading = true
-        var data = this.$refs.commonSearch.queryParams
-        getAction(this.url.list, data).then(response => {
-          this.tableData = response.data
-          var yuanquName, numbers
-          yuanquName = this.tableData.map(obj => {return obj.equipmentname})
-          numbers = this.tableData.map(obj => {return obj.howManyValue})
-          this.yuanquName = yuanquName.filter((item, index) => index < 10)
-          this.numbers = numbers.filter((item, index) => index < 10)
-          this.yuanquName.reverse()
-          this.numbers.reverse()
-          this.loading = false
+    async getRanking() {
+      this.loading = true
+      var data = this.$refs.commonSearch.queryParams
+      getAction(this.url.list, data).then((response) => {
+        this.tableData = response.data
+        var yuanquName, numbers
+        yuanquName = this.tableData.map((obj) => {
+          return obj.equipmentname
         })
-        this.initEcharts()
-      },
-      initEcharts(){
-        var _this = this
-        var chartDom = this.$refs.echarts
-        var myChart = echarts.init(chartDom);
-        var option;
+        numbers = this.tableData.map((obj) => {
+          return obj.howManyValue
+        })
+        this.yuanquName = yuanquName.filter((item, index) => index < 10)
+        this.numbers = numbers.filter((item, index) => index < 10)
+        this.yuanquName.reverse()
+        this.numbers.reverse()
+        this.loading = false
+      })
+      this.initEcharts()
+    },
+    initEcharts() {
+      var _this = this
+      var chartDom = this.$refs.echarts
+      var myChart = echarts.init(chartDom)
+      var option
 
-        option = {
-          title: {
-            text: '能耗排名TOP10',
-            left: 'center'
-          },
-          tooltip: {
-            trigger: 'axis',
-            axisPointer: {
-              type: 'shadow'
-            }
-          },
-          legend: {
-            top: 'bottom',
+      option = {
+        title: {
+          text: '能耗排名TOP10',
+          left: 'center',
+        },
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {
+            type: 'shadow',
           },
-          grid: {
-            left: '3%',
-            right: '4%',
-            bottom: '15px',
-            top: '20px',
-            containLabel: true
+        },
+        legend: {
+          top: 'bottom',
+        },
+        grid: {
+          left: '3%',
+          right: '4%',
+          bottom: '15px',
+          top: '20px',
+          containLabel: true,
+        },
+        toolbox: {
+          show: true,
+          feature: {
+            saveAsImage: {},
           },
-          toolbox: {
-            show: true,
-            feature: {
-              saveAsImage: {},
-            }
+        },
+        xAxis: {
+          type: 'value',
+          boundaryGap: [0, 0.01],
+        },
+        yAxis: {
+          type: 'category',
+          axisTick: {
+            show: false,
           },
-          xAxis: {
-            type: 'value',
-            boundaryGap: [0, 0.01]
+          axisLine: {
+            show: false,
           },
-          yAxis: {
-            type: 'category',
-            axisTick: {
-              show: false
-            },
-            axisLine: {
-              show: false
-            },
-            data: this.yuanquName
+          data: this.yuanquName,
+        },
+        series: [
+          {
+            name: '本期',
+            type: 'bar',
+            // barWidth: 17,
+            data: this.numbers,
           },
-          series: [
-            {
-              name: '本期',
-              type: 'bar',
-              // barWidth: 17,
-              data: this.numbers
-            }
-          ]
-        };
+        ],
+      }
 
-        option && myChart.setOption(option);
-        window.addEventListener("resize",function (){
-          myChart.resize();
-        });
-      },
-      /** 搜索按钮操作 */
-      handleSearch(param) {
-        // this.getList();
-        console.log(param)
-        this.getRanking()
-      },
-    }
-  }
+      option && myChart.setOption(option)
+      window.addEventListener('resize', function () {
+        myChart.resize()
+      })
+    },
+    /** 搜索按钮操作 */
+    handleSearch(param) {
+      this.getTest()
+      // this.getRanking()
+    },
+  },
+}
 </script>
 
 <style lang="less" scoped>
-.ranking{
+@import '~@/assets/less/uStyle.less';
+</style>
+<style lang="less" scoped>
+.ranking {
   padding: 10px;
-  .item-echarts{
+  .item-echarts {
     padding: 10px;
     min-height: calc(100vh - 464px);
-    box-shadow: 0 2px 10px rgba(0,0,0,.1);
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
   }
-  .el-table{
+  .ant-table-wrapper {
     // padding: 10px;
     margin-top: 10px;
-    box-shadow: 0 2px 10px rgba(0,0,0,.1);
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
   }
 }
 </style>

src/views/module_ems/energyAnalyse/flowAnalysis/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="energyFlow-analysis" v-loading="loading">
+  <div class="energyFlow-analysis" :loading="loading">
     <commonSearch ref="commonSearch" type="daterange" @search="handleSearch"></commonSearch>
     <div class="sankey-chart" ref="sankeyChart" style="height:1800px"></div>
   </div>
@@ -8,6 +8,8 @@
 <script>
   import * as echarts from 'echarts';
   import commonSearch from '../components/commonSearch.vue'
+  import { httpAction, getAction } from '@/api/manage'
+  import { testdata } from '../testdata';
   export default {
     name: '',
     components: {
@@ -29,10 +31,17 @@
     },
     mounted() {
       this.$nextTick(() => {
-        this.getEnergyflowAnalysis()
+        // this.getEnergyflowAnalysis()
+        this.getTest()
       })
     },
     methods: {
+    // 后端好了需要删掉
+    getTest() {
+      this.sourceData = testdata.flowdata.sourceData
+      this.linksData = testdata.flowdata.linksData
+      this.initEcharts()
+    },
       async getEnergyflowAnalysis(){
         var _this = this
         _this.loading = true
@@ -120,13 +129,17 @@
       },
       /** 搜索按钮操作 */
       handleSearch(param) {
-        this.getEnergyflowAnalysis()
+        this.getTest()
+        // this.getEnergyflowAnalysis()
       }
     },
   }
 </script>
 
 <style lang="less" scoped>
+  @import '~@/assets/less/uStyle.less';
+</style>
+<style lang="less" scoped>
 .energyFlow-analysis{
   min-height: calc(100vh - 84px);
   padding: 10px;

src/views/module_ems/energyAnalyse/peakValleyAnalysis/index.vue

@@ -57,6 +57,8 @@
 <script>
   import * as echarts from 'echarts';
   import commonSearch from '../components/commonSearch.vue'
+  import { httpAction, getAction } from '@/api/manage'
+  import { testdata } from '../testdata';
   export default {
     name: '',
     components: {
@@ -419,14 +421,16 @@
       },
       /** 搜索按钮操作 */
       handleSearch(param) {
-        // this.getList();
-        console.log(param)
+        this.getTest()
       },
     }
   }
 </script>
 
 <style lang="less" scoped>
+  @import '~@/assets/less/uStyle.less';
+</style>
+<style lang="less" scoped>
 .peakValley-statistics{
   min-height: calc(100vh - 84px);
   padding: 10px;

src/views/module_ems/energyAnalyse/savingAnalysis/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="saving-analysis" v-loading="loading">
+  <div class="saving-analysis" :loading="loading">
     <commonSearch ref="commonSearch" :type="'month'" @search="handleSearch"></commonSearch>
     <div class="text-detail-container u-flex">
       <div class="u-flex-cjac item">
@@ -24,318 +24,343 @@
 </template>
 // 节能分析
 <script>
-  import * as echarts from 'echarts';
-  import commonSearch from '../components/commonSearch.vue'
-  export default {
-    name: '',
-    components: {
-      commonSearch
+import * as echarts from 'echarts'
+import commonSearch from '../components/commonSearch.vue'
+import { httpAction, getAction } from '@/api/manage'
+import { testdata } from '../testdata';
+export default {
+  name: '',
+  components: {
+    commonSearch,
+  },
+  data() {
+    return {
+      loading: true,
+      anlysis: null,
+      shijiAll: null,
+      jihuaAll: null,
+      leijiAll: null,
+      monthDate: ['08/01', '08/02','08/03', '04', '05', '06', '07','08', '09', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29' ,'30', '31'],
+      jienengData: [ 6256,13954,14856,14236,14368,14000,0,0,14056,14265,5999,0,14666,5258,6489,14888,0,14257,13999,14879,8899,8159,14148,14942,14025,14356,14943,0,0,14678,14977 ],
+      chaobiaoData: [ 0,0,0,0,0,0,9204,9015,0,0,0,18999,0,0,0,0,15111,0,0,0,0,0,0,0,0,0,0,10056,9752,0,0 ],
+      jihuaData: [ 9000, 15000, 15000, 15000, 15000, 15000, 9000, 9000, 15000, 15000, 15000, 15000, 15000, 9000, 9000, 15000, 15000, 15000, 15000, 15000, 9000, 9000, 15000, 15000, 15000, 15000, 15000, 9000, 9000, 15000, 15000],
+      leijiData: [2743,4100,4828,5768,6670,7929,7424,7315,8338,9193,18252,14124,14547.7,18245,20942.6,22420,22314.5,23049.2,24237.6,24572.8,24638.3,25072.3,25846.9,26014.3,26956.7,27639.2,27859.5,27213.1,26854,27254,27440.8],
+      url: {
+        list: "/ems/statistics/savinganalysis",
+      },
+    }
+  },
+  created() {},
+  mounted() {
+    this.$nextTick(() => {
+      this.getTest()
+      // this.getSavinganalysis()
+    })
+  },
+  methods: {
+    // 后端好了需要删掉
+    getTest() {
+        this.jienengData = testdata.savedata.jienengData
+        this.chaobiaoData = testdata.savedata.chaobiaoData
+        this.jihuaData = testdata.savedata.jihuaData
+        this.leijiData = testdata.savedata.leijiData
+        this.monthDate = testdata.savedata.monthDate
+        this.anlysis = testdata.savedata.anlysis
+        this.jihuaAll = testdata.savedata.jihuaAll
+        this.shijiAll = testdata.savedata.shijiAll
+        this.leijiAll = testdata.savedata.leijiAll
+      this.initEcharts()
     },
-    data () {
-      return {
-        loading: true,
-        anlysis: null,
-        shijiAll: null,
-        jihuaAll: null,
-        leijiAll: null,
-        monthDate: ['08/01', '08/02','08/03', '04', '05', '06', '07','08', '09', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29' ,'30', '31'],
-        jienengData: [ 6256,13954,14856,14236,14368,14000,0,0,14056,14265,5999,0,14666,5258,6489,14888,0,14257,13999,14879,8899,8159,14148,14942,14025,14356,14943,0,0,14678,14977 ],
-        chaobiaoData: [ 0,0,0,0,0,0,9204,9015,0,0,0,18999,0,0,0,0,15111,0,0,0,0,0,0,0,0,0,0,10056,9752,0,0 ],
-        jihuaData: [ 9000, 15000, 15000, 15000, 15000, 15000, 9000, 9000, 15000, 15000, 15000, 15000, 15000, 9000, 9000, 15000, 15000, 15000, 15000, 15000, 9000, 9000, 15000, 15000, 15000, 15000, 15000, 9000, 9000, 15000, 15000],
-        leijiData: [2743,4100,4828,5768,6670,7929,7424,7315,8338,9193,18252,14124,14547.7,18245,20942.6,22420,22314.5,23049.2,24237.6,24572.8,24638.3,25072.3,25846.9,26014.3,26956.7,27639.2,27859.5,27213.1,26854,27254,27440.8],
-        url: {
-          list: "/ems/statistics/savinganalysis",
-        },
-      }
+    async getSavinganalysis() {
+      this.loading = true
+      var data = this.$refs.commonSearch.queryParams
+      console.log(data)
+      getAction(this.url.list, data).then((response) => {
+        console.log(response)
+        this.jienengData = response.data.jienengData
+        this.chaobiaoData = response.data.chaobiaoData
+        this.jihuaData = response.data.jihuaData
+        this.leijiData = response.data.leijiData
+        this.monthDate = response.data.monthDate
+        this.anlysis = response.data.anlysis
+        this.jihuaAll = response.data.jihuaAll
+        this.shijiAll = response.data.shijiAll
+        this.leijiAll = response.data.leijiAll
+        this.loading = false
+      })
+      this.initEcharts()
     },
-    created () {
+    // 计算最大值
+    _calcMaxNumber(arr) {
+      let max = Math.max(...arr)
+      let maxInt = Math.ceil(max / 9.5)
+      let maxVal = maxInt * 10
+      return maxVal
     },
-    mounted() {
-      this.$nextTick(() => {
-        this.getSavinganalysis()
-      })
+    // 计算最小值
+    _calcMinNumber(arr) {
+      let min = Math.min(...arr)
+      let minInt = Math.floor(min / 10)
+      let minVal = minInt * 10
+      return minVal
     },
-    methods: {
-      async getSavinganalysis(){
-        this.loading = true
-        var data = this.$refs.commonSearch.queryParams
-        console.log(data)
-        getAction(this.url.list,data).then(response => {
-          console.log(response)
-          this.jienengData = response.data.jienengData
-          this.chaobiaoData = response.data.chaobiaoData
-          this.jihuaData = response.data.jihuaData
-          this.leijiData = response.data.leijiData
-          this.monthDate = response.data.monthDate
-          this.anlysis = response.data.anlysis
-          this.jihuaAll = response.data.jihuaAll
-          this.shijiAll = response.data.shijiAll
-          this.leijiAll = response.data.leijiAll
-          this.loading = false
-        })
-        this.initEcharts()
-      },
-      // 计算最大值
-      _calcMaxNumber(arr){
-        let max = Math.max(...arr);
-        let maxInt = Math.ceil(max/9.5);
-        let maxVal = maxInt*10;
-        return maxVal;
-      },
-      // 计算最小值
-      _calcMinNumber(arr){
-        let min = Math.min(...arr);
-        let minInt = Math.floor(min/10);
-        let minVal = minInt*10;
-        return minVal;
-      },
-      initEcharts(){
-        var _this = this
-        var chartDom = this.$refs.echarts
-        var myChart = echarts.init(chartDom);
-        var option;
+    initEcharts() {
+      var _this = this
+      var chartDom = this.$refs.echarts
+      var myChart = echarts.init(chartDom)
+      var option
 
-        // let uvMax = this._calcMaxNumber(this.uvDet);
-        // let uvMin = this._calcMinNumber(this.uvDet);
-        // let cliMax = this._calcMaxNumber(this.cliDet);
-        // let cliMin = this._calcMinNumber(this.cliDet);
+      // let uvMax = this._calcMaxNumber(this.uvDet);
+      // let uvMin = this._calcMinNumber(this.uvDet);
+      // let cliMax = this._calcMaxNumber(this.cliDet);
+      // let cliMin = this._calcMinNumber(this.cliDet);
 
-        //yMax1 第一条y轴的最大值   yMax2 第二条y轴的最大值
-        // var divisor = 5;
-        // var lcmVal = this.chartlcm(yMax1, yMax2)//获取两条y轴的最大公约数
-        // var Ymaxval_interval = this.YmaxvalAndinterval(yMax1, yMax2, lcmVal, divisor);//计算y轴最大值和间隔值
+      //yMax1 第一条y轴的最大值   yMax2 第二条y轴的最大值
+      // var divisor = 5;
+      // var lcmVal = this.chartlcm(yMax1, yMax2)//获取两条y轴的最大公约数
+      // var Ymaxval_interval = this.YmaxvalAndinterval(yMax1, yMax2, lcmVal, divisor);//计算y轴最大值和间隔值
 
-        option = {
-          title: {
-            text: '节能分析趋势',
-            left: 'center'
-          },
-          tooltip: {
-            trigger: 'axis',
-            axisPointer: { // 横纵坐标虚线链接显示
-              type: 'cross',
-              crossStyle: {
-                color: '#999'
-              }
+      option = {
+        title: {
+          text: '节能分析趋势',
+          left: 'center',
+        },
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {
+            // 横纵坐标虚线链接显示
+            type: 'cross',
+            crossStyle: {
+              color: '#999',
             },
-            formatter: function (params) {
-              // console.log(params)
-              // var res = `${params[0].name} <br/>`
-              var res = ''
-              for (const item of params) {
-                if(item.value === 0 && item.seriesType === 'bar'){
-                } else {
-                  res += `<span style="background: ${item.color}; height:10px; width: 10px; border-radius: 50%;display: inline-block;margin-right:10px;"></span> ${item.seriesName} ：${item.value} KWh<br/>`
-                }
+          },
+          formatter: function (params) {
+            // console.log(params)
+            // var res = `${params[0].name} <br/>`
+            var res = ''
+            for (const item of params) {
+              if (item.value === 0 && item.seriesType === 'bar') {
+              } else {
+                res += `<span style="background: ${item.color}; height:10px; width: 10px; border-radius: 50%;display: inline-block;margin-right:10px;"></span> ${item.seriesName} ：${item.value} KWh<br/>`
               }
-              return res
             }
+            return res
           },
-          toolbox: {
-            show: true,
-            feature: {
-              saveAsImage: {},
-            }
+        },
+        toolbox: {
+          show: true,
+          feature: {
+            saveAsImage: {},
           },
-          legend: {
-            top: 'bottom',
-            // data: ['Evaporation', 'Precipitation', 'Temperature']
+        },
+        legend: {
+          top: 'bottom',
+          // data: ['Evaporation', 'Precipitation', 'Temperature']
+        },
+        xAxis: [
+          {
+            type: 'category',
+            data: this.monthDate,
+            axisPointer: {
+              type: 'shadow',
+            },
           },
-          xAxis: [
-            {
-              type: 'category',
-              data: this.monthDate,
-              axisPointer: {
-                type: 'shadow'
-              },
-            }
-          ],
-          yAxis: [
-            {
-              type: 'value',
-              name: '实际能耗(KWh)',
-              // min:uvMin,
-              // max:uvMax,
-              // splitNumber:5,
-              // interval:(uvMax-uvMin)/5,
+        ],
+        yAxis: [
+          {
+            type: 'value',
+            name: '实际能耗(KWh)',
+            // min:uvMin,
+            // max:uvMax,
+            // splitNumber:5,
+            // interval:(uvMax-uvMin)/5,
 
-              // min: 0,//最小值
-              // max: Ymaxval_interval.max1,//最大值
-              // interval: Ymaxval_interval.interval1,//每个刻度的间隔值
-            },
-            {
-              type: 'value',
-              name: '累计节能(KWh)',
-              // min:cliMin,
-              // max:cliMax,
-              // splitNumber:5,
-              // interval:(cliMax-cliMin)/5,
+            // min: 0,//最小值
+            // max: Ymaxval_interval.max1,//最大值
+            // interval: Ymaxval_interval.interval1,//每个刻度的间隔值
+          },
+          {
+            type: 'value',
+            name: '累计节能(KWh)',
+            // min:cliMin,
+            // max:cliMax,
+            // splitNumber:5,
+            // interval:(cliMax-cliMin)/5,
 
-              // min: 0,
-              // max: Ymaxval_interval.max2,
-              // interval: Ymaxval_interval.interval2,
-            }
-          ],
-          series: [
-            {
-              name: '实际能耗(节能)',
-              type: 'bar',
-              stack: 'total', // 设置堆叠图，因为后端会分开返回两个数据，而必有一个为0
-              barWidth: '55%',
-              itemStyle: {
-                normal: {
-                  color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+            // min: 0,
+            // max: Ymaxval_interval.max2,
+            // interval: Ymaxval_interval.interval2,
+          },
+        ],
+        series: [
+          {
+            name: '实际能耗(节能)',
+            type: 'bar',
+            stack: 'total', // 设置堆叠图，因为后端会分开返回两个数据，而必有一个为0
+            barWidth: '55%',
+            itemStyle: {
+              normal: {
+                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                  {
                     offset: 0,
-                    color: '#248ff7'
-                  }, {
+                    color: '#248ff7',
+                  },
+                  {
                     offset: 1,
-                    color: '#6851f1'
-                  }]),
-                  barBorderRadius: 12,
-                },
+                    color: '#6851f1',
+                  },
+                ]),
+                barBorderRadius: 12,
               },
-              data: this.jienengData
             },
-            {
-              name: '实际能耗(超标)',
-              type: 'bar',
-              stack: 'total',
-              barWidth: '55%',
-              itemStyle: {
-                normal: {
-                  color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+            data: this.jienengData,
+          },
+          {
+            name: '实际能耗(超标)',
+            type: 'bar',
+            stack: 'total',
+            barWidth: '55%',
+            itemStyle: {
+              normal: {
+                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                  {
                     offset: 0,
-                    color: '#fb734e'
+                    color: '#fb734e',
                     // color: '#fccb05'
-                  }, {
+                  },
+                  {
                     offset: 1,
-                    color: '#e32f46'
+                    color: '#e32f46',
                     // color: '#f5804d'
-                  }]),
-                  barBorderRadius: 11,
-                }
-                
+                  },
+                ]),
+                barBorderRadius: 11,
               },
-              data: this.chaobiaoData
             },
-            {
-              name: '计划用能',
-              type: 'line',
-              step: 'middle',
-              symbol: 'none',
-              // tooltip: { // 单独设置显示的样式
-              //   valueFormatter: function (value) {
-              //     return value + ' KWh';
-              //   }
-              // },
-              itemStyle: {
-                color: '#FAC858'
-              },
-              lineStyle: {
-                join: 'round'
-              },
-              data: this.jihuaData
+            data: this.chaobiaoData,
+          },
+          {
+            name: '计划用能',
+            type: 'line',
+            step: 'middle',
+            symbol: 'none',
+            // tooltip: { // 单独设置显示的样式
+            //   valueFormatter: function (value) {
+            //     return value + ' KWh';
+            //   }
+            // },
+            itemStyle: {
+              color: '#FAC858',
             },
-            {
-              name: '累计节能',
-              type: 'line',
-              yAxisIndex: 1, // 依据哪儿个y周坐标显示数据
-              symbol: 'circle',
-              symbolSize: 8,
-              // tooltip: { // 单独设置显示的样式
-              //   valueFormatter: function (value) {
-              //     return value + ' KWh';
-              //   }
-              // },
-              itemStyle: {
-                normal: {
-                  width: 12,
-                  color: '#8bd46e'
-                  // color: '#09bcb7'
-                }
+            lineStyle: {
+              join: 'round',
+            },
+            data: this.jihuaData,
+          },
+          {
+            name: '累计节能',
+            type: 'line',
+            yAxisIndex: 1, // 依据哪儿个y周坐标显示数据
+            symbol: 'circle',
+            symbolSize: 8,
+            // tooltip: { // 单独设置显示的样式
+            //   valueFormatter: function (value) {
+            //     return value + ' KWh';
+            //   }
+            // },
+            itemStyle: {
+              normal: {
+                width: 12,
+                color: '#8bd46e',
+                // color: '#09bcb7'
               },
-              data: this.leijiData
-            }
-          ]
-        };
+            },
+            data: this.leijiData,
+          },
+        ],
+      }
 
-        option && myChart.setOption(option);
-        window.addEventListener("resize",function (){
-          myChart.resize();
-        });
-      },
-      //echarts专用求最大公约数 不含小数
-      chartlcm(a, b) {
-        var result = 1;
-        for (var i = 1; i <= a && i <= b; i++) {
-          if (a % i == 0 && b % i == 0) {
-            result = i;
-          }
-          if (result > 1 && i >= 10)//公约数大于10的时候 直接跳出 避免y轴刻度太多  (如果不介意刻度太多可以把这一段去掉）
-              break;
-        }
-        return result;
-      },
-      //获取echarts  多Y轴的最大值和间隔值 lcmval 最大公约数   divisor 间隔数量
-      YmaxvalAndinterval(m, n, lcmval, divisor) {
-        var interval1 = Math.ceil(m / lcmval);
-        var interval2 = Math.ceil(n / lcmval);
-        if (lcmval != 1 && lcmval != 0 && lcmval <= 10){
-          return { max1: m, max2: n, interval1: interval1, interval2: interval2 }
+      option && myChart.setOption(option)
+      window.addEventListener('resize', function () {
+        myChart.resize()
+      })
+    },
+    //echarts专用求最大公约数 不含小数
+    chartlcm(a, b) {
+      var result = 1
+      for (var i = 1; i <= a && i <= b; i++) {
+        if (a % i == 0 && b % i == 0) {
+          result = i
         }
-        if (divisor == undefined || divisor == null)
-            divisor = 5;
-        //var mval = m % divisor;
-        //if (mval > 0) {
-        //    m = ((m - mval) / divisor + 1) * divisor
-        //}
-        m = Math.ceil(m / divisor) * divisor
-        n = Math.ceil(n / divisor) * divisor
-        interval1 = Math.ceil(m / divisor );
-        interval2 = Math.ceil(n / divisor);
+        if (result > 1 && i >= 10)
+          //公约数大于10的时候 直接跳出 避免y轴刻度太多  (如果不介意刻度太多可以把这一段去掉）
+          break
+      }
+      return result
+    },
+    //获取echarts  多Y轴的最大值和间隔值 lcmval 最大公约数   divisor 间隔数量
+    YmaxvalAndinterval(m, n, lcmval, divisor) {
+      var interval1 = Math.ceil(m / lcmval)
+      var interval2 = Math.ceil(n / lcmval)
+      if (lcmval != 1 && lcmval != 0 && lcmval <= 10) {
         return { max1: m, max2: n, interval1: interval1, interval2: interval2 }
-      },
-      /** 搜索按钮操作 */
-      handleSearch(param) {
-        this.getSavinganalysis()
-      },
-    }
-  }
+      }
+      if (divisor == undefined || divisor == null) divisor = 5
+      //var mval = m % divisor;
+      //if (mval > 0) {
+      //    m = ((m - mval) / divisor + 1) * divisor
+      //}
+      m = Math.ceil(m / divisor) * divisor
+      n = Math.ceil(n / divisor) * divisor
+      interval1 = Math.ceil(m / divisor)
+      interval2 = Math.ceil(n / divisor)
+      return { max1: m, max2: n, interval1: interval1, interval2: interval2 }
+    },
+    /** 搜索按钮操作 */
+    handleSearch(param) {
+      this.getTest()
+      // this.getSavinganalysis()
+    },
+  },
+}
 </script>
 
 <style lang="less" scoped>
-.saving-analysis{
+@import '~@/assets/less/uStyle.less';
+</style>
+<style lang="less" scoped>
+.saving-analysis {
   min-height: calc(100vh - 84px);
   padding: 10px;
-  .text-detail-container{
-    .item{
+  .text-detail-container {
+    .item {
       height: 100px;
-      box-shadow: 0 2px 10px rgba(0,0,0,.1);
+      box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
       flex: 1;
       margin-right: 10px;
       padding: 10px;
-      .name{
+      .name {
         font-size: 14px;
       }
-      .value{
+      .value {
         margin-top: 8px;
         font-size: 1.5vw;
       }
     }
-    .analysis-text{
+    .analysis-text {
       flex: 4;
       margin-right: 0;
-      .text{
+      .text {
         margin-top: 8px;
         font-size: 1.1vw;
       }
     }
   }
-  .item-echarts{
+  .item-echarts {
     min-height: calc(100vh - 284px);
     padding: 10px;
     margin-top: 10px;
-    box-shadow: 0 2px 10px rgba(0,0,0,.1);
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
   }
 }
 </style>

src/views/module_ems/energyAnalyse/testdata.js

@@ -0,0 +1 @@
+export const testdata = require('./testdata.json');