feat：添加能源报表页面

src/api/erp/mold/index.ts

@@ -81,6 +81,10 @@ export const MoldBrandApi = {
   getMoldPage: async (params) => {
     return await request.get({ url: `/erp/mold-brand/mold/page`, params })
   },
+
+  getMoldPageWithoutPaging: async () => {
+    return await request.get({ url: `/erp/mold-brand/mold/page` })
+  },
   // 新增模具
   createMold: async (data) => {
     return await request.post({ url: `/erp/mold-brand/mold/create`, data })

src/api/mes/energydevice/index.ts

@@ -25,6 +25,23 @@ export interface EnergyDeviceVO {
   operationRulesVOList?: EnergyDeviceOperationRuleVO[]
 }
 
+export interface EnergyDeviceDataRecordVO {
+  id: number
+  name?: string
+  deviceTypeName?: string
+  orgId?: number | string
+  orgName?: string
+  operationRulesVOMap?: Record<string, string | number | null>
+  energyConsumption?: string | number
+  energyAllocationConsumption?: string | number
+  energyActualConsumption?: string | number
+  shift?: string
+  startTime?: string
+  endTime?: string
+  earliestDataTime?: string
+  latestDataTime?: string
+}
+
 // 能源设备 API
 export const EnergyDeviceApi = {
   // 查询能源设备分页
@@ -41,6 +58,14 @@ export const EnergyDeviceApi = {
     return await request.get({ url: `/mes/energy-device/getList`, params })
   },
 
+  queryDataRecords: async (params: any) => {
+    return await request.get({ url: `/mes/energy-device/queryDataRecords`, params })
+  },
+
+  exportQueryDataRecords: async (params: any) => {
+    return await request.download({ url: `/mes/energy-device/record-export-excel`, params })
+  },
+
   // 新增能源设备
   createEnergyDevice: async (data: EnergyDeviceVO) => {
     return await request.post({ url: `/mes/energy-device/create`, data })

src/views/iot/deviceParamAnalysis/index.vue

@@ -4,7 +4,8 @@
       <ContentWrap class="h-1/1">
         <el-input v-model="keyword" clearable placeholder="搜索设备或参数" class="!w-1/1" @input="handleKeywordChange" />
         <div class="mt-12px">
-          <el-tree ref="treeRef" v-loading="treeLoading" :data="treeData" :props="treeProps" node-key="id"
+          <el-tree
+ref="treeRef" v-loading="treeLoading" :data="treeData" :props="treeProps" node-key="id"
             highlight-current @node-click="handleTreeNodeClick" />
         </div>
       </ContentWrap>
@@ -14,7 +15,8 @@
       <ContentWrap>
         <el-form class="-mb-15px" :inline="true">
           <el-form-item label="时间">
-            <el-date-picker v-model="dateRange" type="daterange" start-placeholder="开始日期" end-placeholder="结束日期"
+            <el-date-picker
+v-model="dateRange" type="daterange" start-placeholder="开始日期" end-placeholder="结束日期"
               value-format="YYYY-MM-DD" :shortcuts="dateShortcuts"
               :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]" class="!w-360px" />
           </el-form-item>

src/views/mes/energydevice/EnergyDeviceForm.vue

@@ -10,28 +10,33 @@
       </el-form-item>
 
       <el-form-item label="能源类型" prop="deviceTypeId">
-        <el-select v-model="formData.deviceTypeId" @change="handleDeviceTypeChange" placeholder="请选择能源类型" clearable
+        <el-select
+v-model="formData.deviceTypeId" @change="handleDeviceTypeChange" placeholder="请选择能源类型" clearable
           filterable class="!w-full">
           <el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id" />
         </el-select>
       </el-form-item>
 
       <el-form-item label="所属区域" prop="orgId">
-        <el-tree-select v-model="formData.orgId" :data="orgSelectTree" :props="orgTreeSelectProps" filterable
+        <el-tree-select
+v-model="formData.orgId" :data="orgSelectTree" :props="orgTreeSelectProps" filterable
           check-strictly clearable class="!w-full" placeholder="根据区域结构筛选列表" :loading="analysisLoading"
           :render-after-expand="false" @change="handleOrgChange" />
       </el-form-item>
 
       <el-form-item label="计算规则" prop="operationRulesVOList">
         <div class="w-full flex flex-col gap-8px">
-          <div v-for="(rule, index) in formData.operationRulesVOList" :key="index"
+          <div
+v-for="(rule, index) in formData.operationRulesVOList" :key="index"
             class="w-full flex items-center gap-8px">
-            <el-tree-select v-model="rule.pointValue" :data="equipmentTree" :props="treeSelectProps" filterable
+            <el-tree-select
+v-model="rule.pointValue" :data="equipmentTree" :props="treeSelectProps" filterable
               clearable class="!w-full" placeholder="根据设备选择点位" :loading="devicePointLoading"
               @change="(val) => handlePointSelected(index, val)" />
 
             <template v-if="index < formData.operationRulesVOList.length - 1">
-              <el-select v-model="formData.operationRulesVOList[index].operator" placeholder="运算符" class="!w-110px"
+              <el-select
+v-model="formData.operationRulesVOList[index].operator" placeholder="运算符" class="!w-110px"
                 clearable>
                 <el-option v-for="op in operatorOptions" :key="op" :label="op" :value="op" />
               </el-select>

src/views/mes/energydevice/index.vue

@@ -34,8 +34,16 @@ type="success" plain @click="handleExport" :loading="exportLoading"
   <!-- 列表 -->
   <ContentWrap>
     <el-table
-v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true" highlight-current-row
+      v-loading="loading"
-      @current-change="handleCurrentChange">
+      :data="list"
+      :stripe="true"
+      :show-overflow-tooltip="true"
+      highlight-current-row
+      row-key="id"
+      @current-change="handleCurrentChange"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column type="selection" width="50" align="center" />
       <el-table-column label="表编码" align="center" prop="code" />
       <el-table-column label="表名称" align="center" prop="name" />
       <el-table-column label="能耗类型" align="center" prop="deviceTypeName" />
@@ -132,6 +140,7 @@ const typeList = ref<EnergyTypeVO[]>([]) // 列表
 const loading = ref(true) // 列表的加载中
 const list = ref<EnergyDeviceVO[]>([]) // 列表的数据
 const total = ref(0) // 列表的总页数
+const selectedIds = ref<Array<number | string>>([])
 const queryParams = reactive({
   pageNo: 1,
   pageSize: 10,
@@ -199,6 +208,12 @@ const handleDelete = async (id: number) => {
   } catch { }
 }
 
+const handleSelectionChange = (rows: EnergyDeviceVO[]) => {
+  selectedIds.value = rows
+    .map((item) => item.id)
+    .filter((id): id is number | string => id !== undefined && id !== null)
+}
+
 /** 导出按钮操作 */
 const handleExport = async () => {
   try {
@@ -206,7 +221,11 @@ const handleExport = async () => {
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await EnergyDeviceApi.exportEnergyDevice(queryParams)
+    const params: any = { ...queryParams }
+    if (selectedIds.value.length) {
+      params.ids = selectedIds.value.join(',')
+    }
+    const data = await EnergyDeviceApi.exportEnergyDevice(params)
     download.excel(data, '能源设备.xls')
   } catch {
   } finally {

src/views/mes/energydevicecheck/index.vue

@@ -1,252 +1,181 @@
 <template>
-  <!-- 列表 -->
   <ContentWrap>
-    <el-tabs v-model="activeName" @tab-click="handleTabClick">
+    <el-form class="-mb-15px" :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
-      <el-tab-pane label="抄表明细" name="first">
+      <el-form-item label="表名称" prop="name">
-        <el-form
+        <el-input v-model="queryParams.name" placeholder="请输入表名称" clearable @keyup.enter="handleQuery" class="!w-240px" />
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="能源设备" prop="deviceId">
-        <el-select
-          v-model="queryParams.deviceId"
-          @change="handleQuery"
-          clearable
-          filterable
-          placeholder="请选择"
-          class="!w-180px"
-        >
-          <el-option
-            v-for="item in deviceList"
-            :key="item.id"
-            :label="item.name"
-            :value="item.id"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="抄表时间" prop="checkTime">
-        <el-date-picker
-          v-model="queryParams.checkTime"
-          value-format="YYYY-MM-DD HH:mm:ss"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
-        />
       </el-form-item>
-      <!-- <el-form-item label="备注" prop="remark">
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item> -->
-      <el-form-item>
-        <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-        <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button
-          type="success"
-          plain
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['mes:energy-device-check-record:export']"
-        >
-          <Icon icon="ep:download" class="mr-5px" /> 导出
-        </el-button>
-      </el-form-item>
-      <el-text>本页总差值：{{erpNumberFormatter(totalDiffValue,3)}}</el-text>
-    </el-form>
-        <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true" style="margin-top:20px">
-          <el-table-column label="能源设备" align="center" prop="deviceName" sortable/>
-          <el-table-column label="抄表值" align="center" prop="checkValue" />
-          <el-table-column label="差值" align="center" prop="diffValue" />
-          <el-table-column label="上次抄表值" align="center" prop="lastCheckValue" />
-          <el-table-column
-            label="抄表时间"
-            align="center"
-            prop="checkTime"
-            :formatter="dateFormatter"
-            width="170px"
-            sortable
-          />
-          <el-table-column
-            label="上次抄表时间"
-            align="center"
-            prop="lastCheckTime"
-            :formatter="dateFormatter"
-            width="170px"
-            sortable
-          />
-          <el-table-column label="单价" align="center" prop="unitPrice" />
-          <el-table-column label="备注" align="center" prop="remark" />
-          <el-table-column
-            label="创建时间"
-            align="center"
-            prop="createTime"
-            :formatter="dateFormatter"
-            width="170px"
-          />
 
-        </el-table>
+      <el-form-item label="所属区域" prop="orgId">
-        <!-- 分页 -->
+        <el-select v-model="queryParams.orgId" filterable clearable placeholder="请选择所属区域" class="!w-240px">
-        <Pagination
+          <el-option v-for="opt in orgOptions" :key="String(opt.value)" :label="opt.label" :value="opt.value" />
-          :total="total"
-          v-model:page="queryParams.pageNo"
-          v-model:limit="queryParams.pageSize"
-          @pagination="getList"
-        />
-      </el-tab-pane>
-      <el-tab-pane label="能源报表" name="second" >
-        <el-form
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      label-width="68px"
-    >
-      <el-form-item label="能源设备" prop="deviceId">
-        <el-select
-          v-model="queryParams.deviceId"
-          @change="handleQuery"
-          clearable
-          filterable
-          placeholder="请选择"
-          class="!w-180px"
-        >
-          <el-option
-            v-for="item in deviceList"
-            :key="item.id"
-            :label="item.name"
-            :value="item.id"
-          />
         </el-select>
       </el-form-item>
-      <el-form-item label="抄表时间" prop="checkTime">
+
+      <el-form-item label="时间范围" prop="timeRange">
         <el-date-picker
-          v-model="queryParams.checkTime"
+          v-model="queryParams.timeRange"
           value-format="YYYY-MM-DD HH:mm:ss"
           type="daterange"
-          start-placeholder="开始日期"
+          start-placeholder="请选择开始日期与时间"
-          end-placeholder="结束日期"
+          end-placeholder="请选择结束日期与时间"
           :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-          class="!w-240px"
+          class="!w-360px"
         />
       </el-form-item>
-      <!-- <el-form-item label="备注" prop="remark">
+
-        <el-input
-          v-model="queryParams.remark"
-          placeholder="请输入备注"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
-      </el-form-item> -->
       <el-form-item>
-        <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
+        <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 查询</el-button>
         <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-        <el-button
+        <el-button type="success" plain @click="handleExport" :loading="exportLoading">
-          type="success"
-          plain
-          @click="handleExport"
-          :loading="exportLoading"
-          v-hasPermi="['mes:energy-device-check-record:export']"
-        >
           <Icon icon="ep:download" class="mr-5px" /> 导出
         </el-button>
       </el-form-item>
-      <el-text>本页总差值：{{erpNumberFormatter(totalDiffValue,3)}}</el-text>
-      <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true" style="margin-top:20px">
-          <el-table-column label="编码" align="center" prop="code" />
-          <el-table-column label="名称" align="center" prop="name" sortable/>
-          <el-table-column label="能源类型" align="center" prop="deviceType" />
-          <el-table-column label="所属区域" align="center" prop="orgName" />
-          <el-table-column label="班次" align="center" prop="shift" />
-          <el-table-column
-            label="开始时间"
-            align="center"
-            prop="startTime"
-            :formatter="dateFormatter"
-            width="170px"
-            sortable
-          />
-          <el-table-column
-            label="结束时间"
-            align="center"
-            prop="endTime"
-            :formatter="dateFormatter"
-            width="170px"
-            sortable
-          />
-
-        </el-table>
-        <!-- 分页 -->
-        <Pagination
-          :total="total"
-          v-model:page="queryParams.pageNo"
-          v-model:limit="queryParams.pageSize"
-          @pagination="getList"
-        />
     </el-form>
-      </el-tab-pane>
-    </el-tabs>
 
+    <el-table
+      ref="tableRef"
+      v-loading="loading"
+      :data="list"
+      :stripe="true"
+      :show-overflow-tooltip="true"
+      row-key="id"
+      :expand-row-keys="expandRowKeys"
+      :row-class-name="getRowClassName"
+      style="margin-top: 20px"
+      @row-click="handleRowClick"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column type="selection" width="50" align="center" />
+      <el-table-column type="expand" width="52">
+        <template #default="scope">
+          <el-table
+            v-if="getOperationRuleRows(scope.row).length"
+            :data="getOperationRuleRows(scope.row)"
+            :show-overflow-tooltip="true"
+            size="small"
+            border
+          >
+            <el-table-column label="指标" prop="name" min-width="140" />
+            <el-table-column label="值" prop="value" min-width="120" />
+          </el-table>
+        </template>
+      </el-table-column>
+      <el-table-column label="序号" align="center" width="70">
+        <template #default="scope">
+          {{ (queryParams.pageNo - 1) * queryParams.pageSize + scope.$index + 1 }}
+        </template>
+      </el-table-column>
+      <el-table-column label="表名称" align="center" prop="name" min-width="120" />
+      <el-table-column label="能源类型" align="center" prop="deviceTypeName" min-width="100" />
+      <el-table-column label="所属区域" align="center" prop="orgName" min-width="100" />
+      <el-table-column label="能源用量" align="center" prop="energyConsumption" min-width="120" />
+      <el-table-column label="班次" align="center" min-width="90">
+        <template #default>
+          <el-tag type="success">早班</el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column label="开始时间" align="center" min-width="170">
+        <template #default="scope">
+          {{ scope.row.startTime ?? scope.row.earliestDataTime ?? '-' }}
+        </template>
+      </el-table-column>
+      <el-table-column label="结束时间" align="center" min-width="170">
+        <template #default="scope">
+          {{ scope.row.endTime ?? scope.row.latestDataTime ?? '-' }}
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <Pagination :total="total" v-model:page="queryParams.pageNo" v-model:limit="queryParams.pageSize" @pagination="getList" />
   </ContentWrap>
-
-  <!-- 表单弹窗：添加/修改 -->
-  <EnergyDeviceCheckRecordForm ref="formRef" @success="getList" />
 </template>
 
 <script setup lang="ts">
-import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
-import { EnergyDeviceCheckRecordApi, EnergyDeviceCheckRecordVO } from '@/api/mes/energydevicecheck'
+import { EnergyDeviceApi, EnergyDeviceDataRecordVO } from '@/api/mes/energydevice'
-import EnergyDeviceCheckRecordForm from './EnergyDeviceCheckRecordForm.vue'
+import { OrganizationApi, OrganizationVO } from '@/api/mes/organization'
-import {EnergyDeviceVO, EnergyDeviceApi} from "@/api/mes/energydevice";
-import {erpNumberFormatter} from "../../../utils";
 
-/** 抄表记录 列表 */
 defineOptions({ name: 'EnergyDeviceCheckRecord' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
 const loading = ref(true) // 列表的加载中
-const list = ref<EnergyDeviceCheckRecordVO[]>([]) // 列表的数据
+const list = ref<EnergyDeviceDataRecordVO[]>([]) // 列表的数据
-const deviceList = ref<EnergyDeviceVO[]>([]) // 列表
-const totalDiffValue = ref(0) // 列表的总页数
 const total = ref(0) // 列表的总页数
+const tableRef = ref()
+const expandRowKeys = ref<Array<string | number>>([])
+const selectedIds = ref<Array<number | string>>([])
+
+const orgOptions = ref<{ label: string; value: string | number; raw?: OrganizationVO }[]>([])
+
 const queryParams = reactive({
   pageNo: 1,
   pageSize: 10,
-  deviceId: undefined,
+  name: undefined as string | undefined,
-  checkTime: [],
+  orgId: undefined as string | number | undefined,
-  diffValue: undefined,
+  timeRange: [] as string[],
-  remark: undefined,
+  startTime: undefined as string | undefined,
-  createTime: []
+  endTime: undefined as string | undefined
 })
 const queryFormRef = ref() // 搜索的表单
 const exportLoading = ref(false) // 导出的加载中
 
+const getOperationRuleRows = (row: EnergyDeviceDataRecordVO) => {
+  const map = row?.operationRulesVOMap
+  if (!map) return []
+  const entries = Object.entries(map).filter(([k]) => !!k)
+  if (!entries.length) return []
+  return entries.map(([name, value]) => ({ name, value: value ?? '-' }))
+}
+
+const getRowClassName = ({ row }: { row: EnergyDeviceDataRecordVO }) => {
+  return getOperationRuleRows(row).length ? '' : 'row-no-expand'
+}
+
+const handleRowClick = (row: EnergyDeviceDataRecordVO) => {
+  const rows = getOperationRuleRows(row)
+  if (!rows.length) return
+  const key = row.id
+  const idx = expandRowKeys.value.findIndex((k) => k === key)
+  if (idx >= 0) {
+    expandRowKeys.value.splice(idx, 1)
+  } else {
+    expandRowKeys.value.push(key)
+  }
+}
+
+const handleSelectionChange = (rows: EnergyDeviceDataRecordVO[]) => {
+  selectedIds.value = rows
+    .map((item) => item.id)
+    .filter((id): id is number | string => id !== undefined && id !== null)
+}
+
 /** 查询列表 */
 const getList = async () => {
   loading.value = true
   try {
-    const data = await EnergyDeviceCheckRecordApi.getEnergyDeviceCheckRecordPage(queryParams)
+    queryParams.startTime = queryParams.timeRange?.[0]
-    list.value = data.list
+    queryParams.endTime = queryParams.timeRange?.[1]
-    total.value = data.total
+    const params = {
-   // 初始化总和为 0
+      pageNo: queryParams.pageNo,
-    let sum = 0;
+      pageSize: queryParams.pageSize,
-   // 遍历列表，累加每个实体对象的 value 属性值
+      name: queryParams.name,
-    for (let entity of list.value) {
+      orgId: queryParams.orgId,
-      sum += entity.diffValue;
+      startTime: queryParams.startTime,
+      endTime: queryParams.endTime
     }
-    totalDiffValue.value = sum
+    const res: any = await EnergyDeviceApi.queryDataRecords(params)
+    const rows = (Array.isArray(res)
+      ? res
+      : Array.isArray(res?.list)
+        ? res.list
+        : Array.isArray(res?.data)
+          ? res.data
+          : []) as EnergyDeviceDataRecordVO[]
+    list.value = rows
+    total.value = Number(res?.total ?? rows.length)
+    expandRowKeys.value = []
   } finally {
     loading.value = false
   }
@@ -261,28 +190,10 @@ const handleQuery = () => {
 /** 重置按钮操作 */
 const resetQuery = () => {
   queryFormRef.value.resetFields()
+  queryParams.timeRange = []
   handleQuery()
 }
 
-/** 添加/修改操作 */
-const formRef = ref()
-const openForm = (type: string, id?: number) => {
-  formRef.value.open(type, id)
-}
-
-/** 删除按钮操作 */
-const handleDelete = async (id: number) => {
-  try {
-    // 删除的二次确认
-    await message.delConfirm()
-    // 发起删除
-    await EnergyDeviceCheckRecordApi.deleteEnergyDeviceCheckRecord(id)
-    message.success(t('common.delSuccess'))
-    // 刷新列表
-    await getList()
-  } catch {}
-}
-
 /** 导出按钮操作 */
 const handleExport = async () => {
   try {
@@ -290,24 +201,43 @@ const handleExport = async () => {
     await message.exportConfirm()
     // 发起导出
     exportLoading.value = true
-    const data = await EnergyDeviceCheckRecordApi.exportEnergyDeviceCheckRecord(queryParams)
+    queryParams.startTime = queryParams.timeRange?.[0]
-    download.excel(data, '抄表记录.xls')
+    queryParams.endTime = queryParams.timeRange?.[1]
+    const params: any = {
+      name: queryParams.name,
+      orgId: queryParams.orgId,
+      startTime: queryParams.startTime,
+      endTime: queryParams.endTime
+    }
+    if (selectedIds.value.length) {
+      params.ids = selectedIds.value.join(',')
+    }
+    const data = await EnergyDeviceApi.exportQueryDataRecords(params)
+    download.excel(data, '能源报表.xls')
   } catch {
   } finally {
     exportLoading.value = false
   }
 }
 
+const loadOrgOptions = async () => {
+  if (orgOptions.value.length) return
+  const data: any = await OrganizationApi.getOrganizationList({})
+  const rows = (Array.isArray(data) ? data : data?.list ?? data?.data ?? []) as OrganizationVO[]
+  orgOptions.value = rows
+    .filter((r) => r?.id !== undefined && r?.name)
+    .map((r) => ({ label: r.name, value: r.id, raw: r }))
+}
+
 /** 初始化 **/
 onMounted(async () => {
+  await loadOrgOptions()
   await getList()
-  deviceList.value = await EnergyDeviceApi.getList()
 })
+</script>
 
-/** tab 切换 */
+<style scoped>
-let activeName = 'first'
+:deep(.row-no-expand .el-table__expand-icon) {
-const handleTabClick = (tab: TabsPaneContext) => {
+  display: none;
-  // queryParams.status = tab.paneName
-  // handleQuery()
 }
-</script>
+</style>