1

src/views/modules/load-forecasting-v2/components/forecasting-detail.vue

@@ -10,6 +10,19 @@
         background: '#fff',
       }"
     >
+      <el-row
+        class="actions"
+        :style="{
+          padding: '10px',
+          paddingLeft: '0',
+          margin: '0px 0',
+          flexWrap: 'wrap',
+          background: 'none',
+          display: 'flex',
+        }"
+      >
+        <el-button class="add" @click="back()"> 返回 </el-button>
+      </el-row>
       <el-table
         class="tables"
         :stripe="false"
@@ -28,37 +41,17 @@
         v-loading="dataListLoading"
       >
         <el-table-column :resizable="true" :sortable="true" label="序号" type="index" width="50" />
-        <el-table-column :resizable="true" :sortable="true" prop="substation" label="变电站">
+        <el-table-column :resizable="true" :sortable="true" prop="region" label="所属地区" />
+        <el-table-column :resizable="true" :sortable="true" prop="substation" label="变电站名称">
           <template slot-scope="scope">
             <div style="color: #0977fd; text-decoration: underline; cursor: pointer" @click="handleClick(scope.row)">
               {{ scope.row.substation }}
             </div>
           </template>
         </el-table-column>
-        <el-table-column :resizable="true" :sortable="true" prop="region" label="所属地区" />
-        <!-- <el-table-column :resizable="true" :sortable="true" prop="predictType" label="预测类型" /> -->
-        <el-table-column :resizable="true" :sortable="true" prop="temperatures" label="预测参数">
-          <template slot-scope="scope">
-            {{ '温度' + scope.row.temperatures + '℃' }}
-          </template>
-        </el-table-column>
-        <el-table-column :resizable="true" :sortable="true" prop="dimension" label="预测周期">
-          <template slot-scope="scope">
-            {{ scope.row.dimension == 'daily' ? '按日' : scope.row.dimension == 'monthly' ? '按月' : '按年' }}
-          </template>
-        </el-table-column>
-        <el-table-column :resizable="true" :sortable="true" prop="startTime" label="预测开始时间" />
-        <el-table-column :resizable="true" :sortable="true" prop="endTime" label="预测结束时间" />
-        <el-table-column :resizable="true" :sortable="true" prop="result" label="预测结果">
-          <template slot-scope="scope">
-            {{ scope.row.result == '0' ? '待预测' : scope.row.result == '1' ? '成功' : '失败' }}
-          </template>
-        </el-table-column>
-        <el-table-column :resizable="true" :sortable="true" prop="execTime" label="执行时间">
-          <template slot-scope="scope">
-            {{ scope.row.execTime == null ? '---' : scope.row.execTime }}
-          </template>
-        </el-table-column>
+        <el-table-column :resizable="true" :sortable="true" prop="voltageLevel" label="电压等级" />
+        <el-table-column :resizable="true" :sortable="true" prop="mainNum" label="主变台数" />
+        <el-table-column :resizable="true" :sortable="true" width="180" prop="capacity" label="主变容量（MVA）" />
         <el-table-column :resizable="true" :sortable="true" v-for="key in columns" :key="key" :label="key">
           <el-table-column :prop="`${key}_peakLoad`" label="最大负荷">
             <template slot-scope="scope">
@@ -78,31 +71,6 @@
         </el-table-column>
       </el-table>
     </div>
-    <el-pagination
-      @size-change="sizeChangeHandle"
-      @current-change="currentChangeHandle"
-      :current-page="pageIndex"
-      background
-      :page-sizes="[10, 50, 100, 200]"
-      :page-size="pageSize"
-      :layout="layouts.join()"
-      :total="totalPage"
-      prev-text="< "
-      next-text="> "
-      :hide-on-single-page="false"
-      :style="{
-        padding: '0 20px 20px',
-        margin: '0px auto',
-        whiteSpace: 'nowrap',
-        color: '#333',
-        textAlign: 'left',
-        background: '#fff',
-        width: '100%',
-        fontSize: 'inherit',
-        position: 'relative',
-        fontWeight: '500',
-      }"
-    ></el-pagination>
     <el-dialog :visible.sync="chartVisiable1" title="预测结果详情" width="800">
       <div id="accumulatedrainfallChart1" style="width: 100%; height: 600px"></div>
       <span slot="footer" class="dialog-footer">
@@ -119,11 +87,7 @@ export default {
   data() {
     return {
       dataList: [],
-      pageIndex: 1,
-      pageSize: 10,
-      totalPage: 0,
       dataListLoading: false,
-      layouts: ['prev', 'pager', 'next', 'sizes'],
       chartVisiable1: false,
       columns: [],
     };
@@ -151,10 +115,8 @@ export default {
             });
             return ite;
           });
-          this.totalPage = data.data.total;
         } else {
           this.dataList = [];
-          this.totalPage = 0;
         }
         this.dataListLoading = false;
       });
@@ -166,7 +128,7 @@ export default {
         var accumulatedrainfallChart1 = echarts.init(document.getElementById('accumulatedrainfallChart1'), 'carp');
         accumulatedrainfallChart1.setOption({
           legend: {
-            data: this.columns,
+            data: ['最大负荷', '最大负荷率', '置信度'],
           },
           grid: { bottom: 20 },
           color: ['#0977fd'],
@@ -193,16 +155,19 @@ export default {
           ],
           series: [
             {
+              name: '最大负荷',
               data: this.columns.map(key => row[`${key}_peakLoad`]),
               type: 'line',
               yAxisIndex: 0,
             },
             {
+              name: '最大负荷率',
               data: this.columns.map(key => row[`${key}_loadRate`]),
               type: 'line',
               yAxisIndex: 1,
             },
             {
+              name: '置信度',
               data: this.columns.map(key => row[`${key}_confidence`]),
               type: 'line',
               yAxisIndex: 1,
@@ -215,17 +180,6 @@ export default {
       this.pageIndex = 1;
       this.getDataList();
     },
-    // 每页数
-    sizeChangeHandle(val) {
-      this.pageSize = val;
-      this.pageIndex = 1;
-      this.getDataList();
-    },
-    // 当前页
-    currentChangeHandle(val) {
-      this.pageIndex = val;
-      this.getDataList();
-    },
     // 返回
     back() {
       this.parent.showForecastingFlag = false;