feat:添加能源报表页面

main
黄伟杰 3 weeks ago
parent c605c4ac82
commit a3e46c89f8

@ -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 })

@ -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 })

@ -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>

@ -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>

@ -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
@current-change="handleCurrentChange">
v-loading="loading"
: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 {

@ -1,252 +1,181 @@
<template>
<!-- 列表 -->
<ContentWrap>
<el-tabs v-model="activeName" @tab-click="handleTabClick">
<el-tab-pane label="抄表明细" name="first">
<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-form class="-mb-15px" :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
<el-form-item label="表名称" prop="name">
<el-input v-model="queryParams.name" placeholder="请输入表名称" clearable @keyup.enter="handleQuery" class="!w-240px" />
</el-form-item>
<el-form-item label="所属区域" prop="orgId">
<el-select v-model="queryParams.orgId" filterable clearable placeholder="请选择所属区域" class="!w-240px">
<el-option v-for="opt in orgOptions" :key="String(opt.value)" :label="opt.label" :value="opt.value" />
</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="开始日期"
end-placeholder="结束日期"
start-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
type="success"
plain
@click="handleExport"
:loading="exportLoading"
v-hasPermi="['mes:energy-device-check-record:export']"
>
<el-button type="success" plain @click="handleExport" :loading="exportLoading">
<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>
<!-- 分页 -->
<Pagination
: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-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-form-item label="能源设备" prop="deviceId">
<el-select
v-model="queryParams.deviceId"
@change="handleQuery"
clearable
filterable
placeholder="请选择"
class="!w-180px"
<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-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-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-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"
/>
</el-form>
</el-tab-pane>
</el-tabs>
<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 EnergyDeviceCheckRecordForm from './EnergyDeviceCheckRecordForm.vue'
import {EnergyDeviceVO, EnergyDeviceApi} from "@/api/mes/energydevice";
import {erpNumberFormatter} from "../../../utils";
import { EnergyDeviceApi, EnergyDeviceDataRecordVO } from '@/api/mes/energydevice'
import { OrganizationApi, OrganizationVO } from '@/api/mes/organization'
/** 抄表记录 列表 */
defineOptions({ name: 'EnergyDeviceCheckRecord' })
const message = useMessage() //
const { t } = useI18n() //
const loading = ref(true) //
const list = ref<EnergyDeviceCheckRecordVO[]>([]) //
const deviceList = ref<EnergyDeviceVO[]>([]) //
const totalDiffValue = ref(0) //
const list = ref<EnergyDeviceDataRecordVO[]>([]) //
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,
checkTime: [],
diffValue: undefined,
remark: undefined,
createTime: []
name: undefined as string | undefined,
orgId: undefined as string | number | undefined,
timeRange: [] as string[],
startTime: undefined as string | undefined,
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)
list.value = data.list
total.value = data.total
// 0
let sum = 0;
// value
for (let entity of list.value) {
sum += entity.diffValue;
queryParams.startTime = queryParams.timeRange?.[0]
queryParams.endTime = queryParams.timeRange?.[1]
const params = {
pageNo: queryParams.pageNo,
pageSize: queryParams.pageSize,
name: queryParams.name,
orgId: queryParams.orgId,
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)
download.excel(data, '抄表记录.xls')
queryParams.startTime = queryParams.timeRange?.[0]
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 切换 */
let activeName = 'first'
const handleTabClick = (tab: TabsPaneContext) => {
// queryParams.status = tab.paneName
// handleQuery()
<style scoped>
:deep(.row-no-expand .el-table__expand-icon) {
display: none;
}
</script>
</style>

Loading…
Cancel
Save