[0924] 增加中期功率报表日报月报年报页面

forecast-backend-vue/src/api/power/mediumTermForecastReport.js

@@ -0,0 +1,21 @@
+import request from '@/utils/request'
+
+// 查询中期预测报表
+export function queryMediumTermForecastReport(query) {
+  return request({
+    url: '/data/mediumTermPowerForecastReport',
+    method: 'post',
+    data: query
+  })
+}
+
+// 导出中期预测报表
+export function exportMediumTermForecastReport(data) {
+  return request({
+    url: '/data/mediumTermPowerForecastReport/export',
+    method: 'post',
+    data: data,
+    responseType: 'blob',
+    timeout: 120000
+  })
+}

forecast-backend-vue/src/router/electricity.js

@@ -210,6 +210,24 @@ const electricityRoutes = [
         component: () => import('@/views/ufo/electricity/datareport/shorTermForecastYearlyReport.vue'),
         meta: {title: '短期预测年报', icon: 'FileTextOutlined'}
       },
+      {
+        path: 'electricity/medium-term-forecast-daily',
+        name: 'MediumTermForecastDailyReport',
+        component: () => import('@/views/ufo/electricity/datareport/mediumTermForecastDailyReport.vue'),
+        meta: {title: '中期预测日报', icon: 'FileTextOutlined'}
+      },
+      {
+        path: 'electricity/medium-term-forecast-monthly',
+        name: 'MediumTermForecastMonthlyReport',
+        component: () => import('@/views/ufo/electricity/datareport/mediumTermForecastMonthlyReport.vue'),
+        meta: {title: '中期预测月报', icon: 'FileTextOutlined'}
+      },
+      {
+        path: 'electricity/medium-term-forecast-yearly',
+        name: 'MediumTermForecastYearlyReport',
+        component: () => import('@/views/ufo/electricity/datareport/mediumTermForecastYearlyReport.vue'),
+        meta: {title: '中期预测年报', icon: 'FileTextOutlined'}
+      },
       {
         path: 'electricity/ultra-shor-term-forecast-daily',
         name: 'UltraShorTermForecastDailyReport',

forecast-backend-vue/src/views/ufo/electricity/datareport/mediumTermForecastDailyReport.vue

@@ -0,0 +1,160 @@
+<template>
+  <div class="medium-term-forecast-daily-page">
+    <a-card :bordered="false">
+      <a-row :gutter="[12, 12]" align="middle">
+        <a-col :xs="24" :md="6">
+          <StationSelector v-model:value="query.stationId" :options="stationOptions" :multiple="false" />
+        </a-col>
+        <a-col :xs="24" :md="5">
+          <a-date-picker
+            v-model:value="query.startTime"
+            format="YYYY-MM-DD"
+            value-format="YYYY-MM-DD"
+            placeholder="起始时间"
+            class="full-control"
+          />
+        </a-col>
+        <a-col :xs="24" :md="5">
+          <a-date-picker
+            v-model:value="query.endTime"
+            format="YYYY-MM-DD"
+            value-format="YYYY-MM-DD"
+            placeholder="截止时间"
+            class="full-control"
+          />
+        </a-col>
+        <a-col :xs="24" :md="8">
+          <a-space>
+            <a-button type="primary" :loading="loading" :disabled="!queryValid" @click="handleQuery">确认</a-button>
+            <a-button :loading="exporting" :disabled="!queryValid" @click="handleExport">导出</a-button>
+          </a-space>
+        </a-col>
+      </a-row>
+    </a-card>
+
+    <a-card title="数据详情" :bordered="false" style="margin-top: 16px">
+      <BusinessDataTable
+        :columns="tableColumns"
+        :data-source="tableRows"
+        :pagination="{ pageSize: 10 }"
+        :scroll-x="'max-content'"
+      />
+    </a-card>
+  </div>
+</template>
+
+<script setup name="mediumTermForecastDailyReport">
+import { computed, onMounted, reactive, ref } from 'vue';
+import { message } from 'ant-design-vue';
+import dayjs from 'dayjs';
+import { saveAs } from 'file-saver';
+import { blobValidate } from '@/utils/bearjia';
+import { listStation } from '@/api/config/station';
+import { queryMediumTermForecastReport, exportMediumTermForecastReport } from '@/api/power/mediumTermForecastReport';
+import BusinessDataTable from '../components/BusinessDataTable.vue';
+import StationSelector from '../components/StationSelector.vue';
+import { normalizeRows, toStationOptions } from '../components/dataAdapter.js';
+
+const loading = ref(false);
+const exporting = ref(false);
+const stationOptions = ref([]);
+const tableRows = ref([]);
+
+const query = reactive({
+  stationId: undefined,
+  startTime: dayjs(),
+  endTime: dayjs(),
+  type: 'daily'
+})
+
+const tableColumns = [
+  { title: '时间', dataIndex: 'time', width: 120 },
+  { title: '开机容量(MW)', dataIndex: 'operatingCapacity', width: 130 },
+  { title: '实发功率(MW)', dataIndex: 'actualPower', width: 130 },
+  { title: '预测功率(MW)', dataIndex: 'forecastPower', width: 130 },
+  { title: '均方根误差', dataIndex: 'rootMeanSquareError', width: 120 },
+  { title: '平均绝对误差', dataIndex: 'meanAbsoluteError', width: 130 },
+  { title: '相关性系数', dataIndex: 'correlationCoefficientR', width: 130 },
+  { title: '准确率(%)', dataIndex: 'maximumErrorPassRate', width: 120 },
+  { title: '合格率(%)', dataIndex: 'acc', width: 120 }
+]
+
+const queryValid = computed(() => {
+  if (!query.startTime || !query.endTime) return false
+  const start = dayjs(query.startTime)
+  const end = dayjs(query.endTime)
+  if (!start.isValid() || !end.isValid()) return false
+  return !start.isAfter(end)
+})
+
+const loadStationOptions = async () => {
+  const res = await listStation({ pageNum: 1, pageSize: 500 })
+  stationOptions.value = toStationOptions(normalizeRows(res))
+  if (!query.stationId && stationOptions.value.length) {
+    query.stationId = stationOptions.value[0].value
+  }
+}
+
+const buildParams = () => ({
+  type: query.type,
+  entityId: query.stationId,
+  startTime: dayjs(query.startTime).format('YYYY-MM-DD'),
+  endTime: dayjs(query.endTime).format('YYYY-MM-DD')
+})
+
+const handleQuery = async () => {
+  if (!query.stationId) {
+    message.warning('请先选择场站')
+    return
+  }
+  if (!queryValid.value) return
+
+  loading.value = true
+  try {
+    const res = await queryMediumTermForecastReport(buildParams())
+    tableRows.value = normalizeRows(res)
+  } finally {
+    loading.value = false
+  }
+}
+
+const handleExport = async () => {
+  if (!query.stationId) {
+    message.warning('请先选择场站')
+    return
+  }
+  if (!queryValid.value) return
+
+  exporting.value = true
+  try {
+    const res = await exportMediumTermForecastReport(buildParams())
+    const isFile = await blobValidate(res)
+    if (isFile) {
+      const name = `中期预测日报-${dayjs(query.startTime).format('YYYYMMDD')}-${dayjs(query.endTime).format('YYYYMMDD')}.xlsx`
+      saveAs(new Blob([res]), name)
+      message.success('导出成功')
+    } else {
+      const text = await res.text()
+      let msg = '导出失败'
+      try { msg = JSON.parse(text)?.msg || msg } catch (e) { /* ignore */ }
+      message.error(msg)
+    }
+  } finally {
+    exporting.value = false
+  }
+}
+
+onMounted(async () => {
+  await loadStationOptions();
+  await handleQuery();
+});
+</script>
+
+<style lang="less" scoped>
+.medium-term-forecast-daily-page {
+  padding: 16px;
+}
+.full-control {
+  width: 100%;
+}
+</style>

forecast-backend-vue/src/views/ufo/electricity/datareport/mediumTermForecastMonthlyReport.vue

@@ -0,0 +1,158 @@
+<template>
+  <div class="medium-term-forecast-monthly-page">
+    <a-card :bordered="false">
+      <a-row :gutter="[12, 12]" align="middle">
+        <a-col :xs="24" :md="6">
+          <StationSelector v-model:value="query.stationId" :options="stationOptions" :multiple="false" />
+        </a-col>
+        <a-col :xs="24" :md="5">
+          <a-month-picker
+            v-model:value="query.startTime"
+            format="YYYY-MM"
+            placeholder="起始时间"
+            class="full-control"
+          />
+        </a-col>
+        <a-col :xs="24" :md="5">
+          <a-month-picker
+            v-model:value="query.endTime"
+            format="YYYY-MM"
+            placeholder="截止时间"
+            class="full-control"
+          />
+        </a-col>
+        <a-col :xs="24" :md="8">
+          <a-space>
+            <a-button type="primary" :loading="loading" :disabled="!queryValid" @click="handleQuery">确认</a-button>
+            <a-button :loading="exporting" :disabled="!queryValid" @click="handleExport">导出</a-button>
+          </a-space>
+        </a-col>
+      </a-row>
+    </a-card>
+
+    <a-card title="数据详情" :bordered="false" style="margin-top: 16px">
+      <BusinessDataTable
+        :columns="tableColumns"
+        :data-source="tableRows"
+        :pagination="{ pageSize: 10 }"
+        :scroll-x="'max-content'"
+      />
+    </a-card>
+  </div>
+</template>
+
+<script setup name="mediumTermForecastMonthlyReport">
+import { computed, onMounted, reactive, ref } from 'vue';
+import { message } from 'ant-design-vue';
+import dayjs from 'dayjs';
+import { saveAs } from 'file-saver';
+import { blobValidate } from '@/utils/bearjia';
+import { listStation } from '@/api/config/station';
+import { queryMediumTermForecastReport, exportMediumTermForecastReport } from '@/api/power/mediumTermForecastReport';
+import BusinessDataTable from '../components/BusinessDataTable.vue';
+import StationSelector from '../components/StationSelector.vue';
+import { normalizeRows, toStationOptions } from '../components/dataAdapter.js';
+
+const loading = ref(false);
+const exporting = ref(false);
+const stationOptions = ref([]);
+const tableRows = ref([]);
+
+const query = reactive({
+  stationId: undefined,
+  startTime: dayjs(),
+  endTime: dayjs(),
+  type: 'monthly'
+})
+
+const tableColumns = [
+  { title: '时间', dataIndex: 'time', width: 120 },
+  { title: '开机容量(MW)', dataIndex: 'operatingCapacity', width: 130 },
+  { title: '实发功率(MW)', dataIndex: 'actualPower', width: 130 },
+  { title: '预测功率(MW)', dataIndex: 'forecastPower', width: 130 },
+  { title: '均方根误差', dataIndex: 'rootMeanSquareError', width: 120 },
+  { title: '平均绝对误差', dataIndex: 'meanAbsoluteError', width: 130 },
+  { title: '相关性系数', dataIndex: 'correlationCoefficientR', width: 130 },
+  { title: '准确率(%)', dataIndex: 'maximumErrorPassRate', width: 120 },
+  { title: '合格率(%)', dataIndex: 'acc', width: 120 }
+]
+
+const queryValid = computed(() => {
+  if (!query.startTime || !query.endTime) return false
+  const start = dayjs(query.startTime)
+  const end = dayjs(query.endTime)
+  if (!start.isValid() || !end.isValid()) return false
+  return !end.isBefore(start)
+})
+
+const loadStationOptions = async () => {
+  const res = await listStation({ pageNum: 1, pageSize: 500 })
+  stationOptions.value = toStationOptions(normalizeRows(res))
+  if (!query.stationId && stationOptions.value.length) {
+    query.stationId = stationOptions.value[0].value
+  }
+}
+
+const buildParams = () => ({
+  type: query.type,
+  entityId: query.stationId,
+  startTime: dayjs(query.startTime).format('YYYY-MM') + '-01',
+  endTime: dayjs(query.endTime).endOf('month').format('YYYY-MM-DD')
+})
+
+const handleQuery = async () => {
+  if (!query.stationId) {
+    message.warning('请先选择场站')
+    return
+  }
+  if (!queryValid.value) return
+
+  loading.value = true
+  try {
+    const res = await queryMediumTermForecastReport(buildParams())
+    tableRows.value = normalizeRows(res)
+  } finally {
+    loading.value = false
+  }
+}
+
+const handleExport = async () => {
+  if (!query.stationId) {
+    message.warning('请先选择场站')
+    return
+  }
+  if (!queryValid.value) return
+
+  exporting.value = true
+  try {
+    const res = await exportMediumTermForecastReport(buildParams())
+    const isFile = await blobValidate(res)
+    if (isFile) {
+      const name = `中期预测月报-${dayjs(query.startTime).format('YYYYMM')}-${dayjs(query.endTime).format('YYYYMM')}.xlsx`
+      saveAs(new Blob([res]), name)
+      message.success('导出成功')
+    } else {
+      const text = await res.text()
+      let msg = '导出失败'
+      try { msg = JSON.parse(text)?.msg || msg } catch (e) { /* ignore */ }
+      message.error(msg)
+    }
+  } finally {
+    exporting.value = false
+  }
+}
+
+onMounted(async () => {
+  await loadStationOptions();
+  await handleQuery();
+});
+</script>
+
+<style lang="less" scoped>
+.medium-term-forecast-monthly-page {
+  padding: 16px;
+}
+.full-control {
+  width: 100%;
+}
+</style>

forecast-backend-vue/src/views/ufo/electricity/datareport/mediumTermForecastYearlyReport.vue

@@ -0,0 +1,160 @@
+<template>
+  <div class="medium-term-forecast-yearly-page">
+    <a-card :bordered="false">
+      <a-row :gutter="[12, 12]" align="middle">
+        <a-col :xs="24" :md="6">
+          <StationSelector v-model:value="query.stationId" :options="stationOptions" :multiple="false" />
+        </a-col>
+        <a-col :xs="24" :md="5">
+            <a-date-picker
+              v-model:value="query.startTime"
+              picker="year"
+              format="YYYY"
+              placeholder="起始时间"
+              class="full-control"
+            />
+        </a-col>
+        <a-col :xs="24" :md="5">
+            <a-date-picker
+              v-model:value="query.endTime"
+              picker="year"
+              format="YYYY"
+              placeholder="截止时间"
+              class="full-control"
+            />
+        </a-col>
+        <a-col :xs="24" :md="8">
+          <a-space>
+            <a-button type="primary" :loading="loading" :disabled="!queryValid" @click="handleQuery">确认</a-button>
+            <a-button :loading="exporting" :disabled="!queryValid" @click="handleExport">导出</a-button>
+          </a-space>
+        </a-col>
+      </a-row>
+    </a-card>
+
+    <a-card title="数据详情" :bordered="false" style="margin-top: 16px">
+      <BusinessDataTable
+        :columns="tableColumns"
+        :data-source="tableRows"
+        :pagination="{ pageSize: 10 }"
+        :scroll-x="'max-content'"
+      />
+    </a-card>
+  </div>
+</template>
+
+<script setup name="mediumTermForecastYearlyReport">
+import { computed, onMounted, reactive, ref } from 'vue';
+import { message } from 'ant-design-vue';
+import dayjs from 'dayjs';
+import { saveAs } from 'file-saver';
+import { blobValidate } from '@/utils/bearjia';
+import { listStation } from '@/api/config/station';
+import { queryMediumTermForecastReport, exportMediumTermForecastReport } from '@/api/power/mediumTermForecastReport';
+import BusinessDataTable from '../components/BusinessDataTable.vue';
+import StationSelector from '../components/StationSelector.vue';
+import { normalizeRows, toStationOptions } from '../components/dataAdapter.js';
+
+const loading = ref(false);
+const exporting = ref(false);
+const stationOptions = ref([]);
+const tableRows = ref([]);
+
+const query = reactive({
+  stationId: undefined,
+  startTime: dayjs(),
+  endTime: dayjs(),
+  type: 'yearly'
+})
+
+const tableColumns = [
+  { title: '时间', dataIndex: 'time', width: 120 },
+  { title: '开机容量(MW)', dataIndex: 'operatingCapacity', width: 130 },
+  { title: '实发功率(MW)', dataIndex: 'actualPower', width: 130 },
+  { title: '预测功率(MW)', dataIndex: 'forecastPower', width: 130 },
+  { title: '均方根误差', dataIndex: 'rootMeanSquareError', width: 120 },
+  { title: '平均绝对误差', dataIndex: 'meanAbsoluteError', width: 130 },
+  { title: '相关性系数', dataIndex: 'correlationCoefficientR', width: 130 },
+  { title: '准确率(%)', dataIndex: 'maximumErrorPassRate', width: 120 },
+  { title: '合格率(%)', dataIndex: 'acc', width: 120 }
+]
+
+const queryValid = computed(() => {
+  if (!query.startTime || !query.endTime) return false
+  const start = dayjs(query.startTime)
+  const end = dayjs(query.endTime)
+  if (!start.isValid() || !end.isValid()) return false
+  return !end.isBefore(start)
+})
+
+const loadStationOptions = async () => {
+  const res = await listStation({ pageNum: 1, pageSize: 500 })
+  stationOptions.value = toStationOptions(normalizeRows(res))
+  if (!query.stationId && stationOptions.value.length) {
+    query.stationId = stationOptions.value[0].value
+  }
+}
+
+const buildParams = () => ({
+  type: query.type,
+  entityId: query.stationId,
+  startTime: dayjs(query.startTime).startOf('year').format('YYYY-MM-DD'),
+  endTime: dayjs(query.endTime).endOf('year').format('YYYY-MM-DD')
+})
+
+const handleQuery = async () => {
+  if (!query.stationId) {
+    message.warning('请先选择场站')
+    return
+  }
+  if (!queryValid.value) return
+
+  loading.value = true
+  try {
+    const res = await queryMediumTermForecastReport(buildParams())
+    tableRows.value = normalizeRows(res)
+  } finally {
+    loading.value = false
+  }
+}
+
+const handleExport = async () => {
+  if (!query.stationId) {
+    message.warning('请先选择场站')
+    return
+  }
+  if (!queryValid.value) return
+
+  exporting.value = true
+  try {
+    const res = await exportMediumTermForecastReport(buildParams())
+    const isFile = await blobValidate(res)
+    if (isFile) {
+      const name = `中期预测年报-${dayjs(query.startTime).format('YYYY')}-${dayjs(query.endTime).format('YYYY')}.xlsx`
+      saveAs(new Blob([res]), name)
+      message.success('导出成功')
+    } else {
+      const text = await res.text()
+      let msg = '导出失败'
+      try { msg = JSON.parse(text)?.msg || msg } catch (e) { /* ignore */ }
+      message.error(msg)
+    }
+  } finally {
+    exporting.value = false
+  }
+}
+
+onMounted(async () => {
+  await loadStationOptions();
+  await handleQuery();
+});
+</script>
+
+<style lang="less" scoped>
+.medium-term-forecast-yearly-page {
+  padding: 16px;
+}
+.full-control {
+  width: 100%;
+}
+</style>