linweidong
/
besure_web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add energy device

Browse Source
main
chenshuichuan 2 years ago
parent 004fcbecd2
commit 42760dff79
10 changed files with 1223 additions and 2 deletions
Show Stats Download Patch File Download Diff File

74
src/api/mes/energydevice/index.ts
Unescape Escape View File

@ -0,0 +1,74 @@
import request from '@/config/axios'
// 能源设备 VO
export interface EnergyDeviceVO {
id: number // ID
name: string // 名称
code: string // 编码
deviceType: string // 设备类型
info: string // 信息资料
checkCron: string // 抄表周期cron
lastCheckTime: Date // 最后抄表时间
lastCheckValue: number // 最后抄表值
unitName: string // 单位
isEnable: boolean // 是否启用
}
// 能源设备 API
export const EnergyDeviceApi = {
// 查询能源设备分页
getEnergyDevicePage: async (params: any) => {
return await request.get({ url: `/mes/energy-device/page`, params })
},
// 查询能源设备详情
getEnergyDevice: async (id: number) => {
return await request.get({ url: `/mes/energy-device/get?id=` + id })
},
// 新增能源设备
createEnergyDevice: async (data: EnergyDeviceVO) => {
return await request.post({ url: `/mes/energy-device/create`, data })
},
// 修改能源设备
updateEnergyDevice: async (data: EnergyDeviceVO) => {
return await request.put({ url: `/mes/energy-device/update`, data })
},
// 删除能源设备
deleteEnergyDevice: async (id: number) => {
return await request.delete({ url: `/mes/energy-device/delete?id=` + id })
},
// 导出能源设备 Excel
exportEnergyDevice: async (params) => {
return await request.download({ url: `/mes/energy-device/export-excel`, params })
},
// ==================== 子表（抄表记录） ====================
// 获得抄表记录分页
getEnergyDeviceCheckRecordPage: async (params) => {
return await request.get({ url: `/mes/energy-device/energy-device-check-record/page`, params })
},
// 新增抄表记录
createEnergyDeviceCheckRecord: async (data) => {
return await request.post({ url: `/mes/energy-device/energy-device-check-record/create`, data })
},
// 修改抄表记录
updateEnergyDeviceCheckRecord: async (data) => {
return await request.put({ url: `/mes/energy-device/energy-device-check-record/update`, data })
},
// 删除抄表记录
deleteEnergyDeviceCheckRecord: async (id: number) => {
return await request.delete({ url: `/mes/energy-device/energy-device-check-record/delete?id=` + id })
},
// 获得抄表记录
getEnergyDeviceCheckRecord: async (id: number) => {
return await request.get({ url: `/mes/energy-device/energy-device-check-record/get?id=` + id })
}
}

47
src/api/mes/energydevicecheck/index.ts
Unescape Escape View File

@ -0,0 +1,47 @@
import request from '@/config/axios'
// 抄表记录 VO
export interface EnergyDeviceCheckRecordVO {
id: number // ID
deviceId: number // 能源设备Id
lastCheckTime: Date // 上次抄表时间
lastCheckValue: number // 上次抄表值
checkValue: number // 抄表值
checkTime: Date // 抄表时间
diffValue: number // 差值
unitPrice: number // 单价
remark: string // 备注
}
// 抄表记录 API
export const EnergyDeviceCheckRecordApi = {
// 查询抄表记录分页
getEnergyDeviceCheckRecordPage: async (params: any) => {
return await request.get({ url: `/mes/energy-device-check-record/page`, params })
},
// 查询抄表记录详情
getEnergyDeviceCheckRecord: async (id: number) => {
return await request.get({ url: `/mes/energy-device-check-record/get?id=` + id })
},
// 新增抄表记录
createEnergyDeviceCheckRecord: async (data: EnergyDeviceCheckRecordVO) => {
return await request.post({ url: `/mes/energy-device-check-record/create`, data })
},
// 修改抄表记录
updateEnergyDeviceCheckRecord: async (data: EnergyDeviceCheckRecordVO) => {
return await request.put({ url: `/mes/energy-device-check-record/update`, data })
},
// 删除抄表记录
deleteEnergyDeviceCheckRecord: async (id: number) => {
return await request.delete({ url: `/mes/energy-device-check-record/delete?id=` + id })
},
// 导出抄表记录 Excel
exportEnergyDeviceCheckRecord: async (params) => {
return await request.download({ url: `/mes/energy-device-check-record/export-excel`, params })
}
}

1
src/utils/dict.ts
Unescape Escape View File

@ -247,6 +247,7 @@ export enum DICT_TYPE {
MES_STOCK_WORKSHOP_DETAIL_TYPE = "mes_stock_workshop_detail_type",
MES_STOCK_OUT_TYPE = "mes_stock_out_type",
MES_PRODUCE_REPORT_TYPE = "mes_produce_report_type",
MES_ENERGY_DEVICE_TYPE = "mes_energy_device_type",
//====iot
IOT_SIEMENS_TYPE = "iot_siemens_type",
IOT_MODBUS_TYPE = "iot_modbus_type",

5
src/views/Login/components/LoginForm.vue
Unescape Escape View File

@ -18,6 +18,7 @@
<el-col :span="24" style="padding-right: 10px; padding-left: 10px">
<el-form-item v-if="loginData.tenantEnable === 'true'" prop="tenantName">
<el-input
disabled
v-model="loginData.loginForm.tenantName"
:placeholder="t('login.tenantNamePlaceholder')"
:prefix-icon="iconHouse"
@ -171,8 +172,8 @@ const loginData = reactive({
tenantEnable: import.meta.env.VITE_APP_TENANT_ENABLE,
loginForm: {
tenantName: '内蒙必硕',
username: 'admin',
password: 'admin123',
username: '',
password: '',
captchaVerification: '',
rememberMe: true // 默认记录我。如果不需要，可手动修改
}

163
src/views/mes/energydevice/EnergyDeviceForm.vue
Unescape Escape View File

@ -0,0 +1,163 @@
<template>
<Dialog :title="dialogTitle" v-model="dialogVisible" width="800px">
<el-form
ref="formRef"
:model="formData"
:rules="formRules"
label-width="100px"
v-loading="formLoading"
>
<el-row>
<el-col :span="12">
<el-form-item label="名称" prop="name">
<el-input v-model="formData.name" placeholder="请输入名称" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="编码" prop="code">
<el-input v-model="formData.code" placeholder="" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="设备类型" prop="deviceType">
<el-radio-group v-model="formData.deviceType">
<el-radio
v-for="dict in getStrDictOptions(DICT_TYPE.MES_ENERGY_DEVICE_TYPE)"
:key="dict.value"
:label="dict.value"
>
{{ dict.label }}
</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="抄表周期cron" prop="checkCron">
<el-input v-model="formData.checkCron" placeholder="" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="单位" prop="unitName">
<el-input v-model="formData.unitName" placeholder="" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="是否启用" prop="isEnable">
<el-radio-group v-model="formData.isEnable">
<el-radio
v-for="dict in getBoolDictOptions(DICT_TYPE.INFRA_BOOLEAN_STRING)"
:key="dict.value"
:label="dict.value"
>
{{ dict.label }}
</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-form-item label="信息资料" prop="info">
<Editor v-model="formData.info" height="250px" />
</el-form-item>
<template #footer>
<el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
<el-button @click="dialogVisible = false">取 消</el-button>
</template>
</Dialog>
</template>
<script setup lang="ts">
import {getStrDictOptions, DICT_TYPE, getBoolDictOptions} from '@/utils/dict'
import { EnergyDeviceApi, EnergyDeviceVO } from '@/api/mes/energydevice'
/** 能源设备 表单 */
defineOptions({ name: 'EnergyDeviceForm' })
const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
const dialogVisible = ref(false) // 弹窗的是否展示
const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formType = ref('') // 表单的类型：create - 新增；update - 修改
const formData = ref({
id: undefined,
name: undefined,
code: undefined,
deviceType: undefined,
info: undefined,
checkCron: undefined,
lastCheckTime: undefined,
lastCheckValue: undefined,
unitName: undefined,
isEnable: undefined
})
const formRules = reactive({
name: [{ required: true, message: '设备名称不能为空', trigger: 'blur' }],
deviceType: [{ required: true, message: '设备类型不能为空', trigger: 'blur' }],
isEnable: [{ required: true, message: '是否启用不能为空', trigger: 'blur' }]
})
const formRef = ref() // 表单 Ref
/** 打开弹窗 */
const open = async (type: string, id?: number) => {
dialogVisible.value = true
dialogTitle.value = t('action.' + type)
formType.value = type
resetForm()
// 修改时，设置数据
if (id) {
formLoading.value = true
try {
formData.value = await EnergyDeviceApi.getEnergyDevice(id)
} finally {
formLoading.value = false
}
}
}
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
/** 提交表单 */
const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
const submitForm = async () => {
// 校验表单
await formRef.value.validate()
// 提交请求
formLoading.value = true
try {
const data = formData.value as unknown as EnergyDeviceVO
if (formType.value === 'create') {
await EnergyDeviceApi.createEnergyDevice(data)
message.success(t('common.createSuccess'))
} else {
await EnergyDeviceApi.updateEnergyDevice(data)
message.success(t('common.updateSuccess'))
}
dialogVisible.value = false
// 发送操作成功的事件
emit('success')
} finally {
formLoading.value = false
}
}
/** 重置表单 */
const resetForm = () => {
formData.value = {
id: undefined,
name: undefined,
code: undefined,
deviceType: '电表',
info: undefined,
checkCron: undefined,
lastCheckTime: undefined,
lastCheckValue: undefined,
unitName: undefined,
isEnable: true
}
formRef.value?.resetFields()
}
</script>

163
src/views/mes/energydevice/components/EnergyDeviceCheckRecordForm.vue
Unescape Escape View File

@ -0,0 +1,163 @@
<template>
<Dialog :title="dialogTitle" v-model="dialogVisible" width="800px">
<el-form
ref="formRef"
:model="formData"
:rules="formRules"
label-width="100px"
v-loading="formLoading"
>
<el-row>
<el-col :span="12">
<el-form-item label="上次抄表时间" prop="lastCheckTime">
<el-date-picker
disabled
v-model="formData.lastCheckTime"
type="date"
value-format="x"
placeholder="选择上次抄表时间"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="上次抄表值" prop="lastCheckValue">
<el-input-number disabled v-model="formData.lastCheckValue" :min="0" :precision="2" placeholder="" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="抄表时间" prop="checkTime">
<el-date-picker
v-model="formData.checkTime"
type="date"
value-format="x"
placeholder="选择抄表时间"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="抄表值" prop="checkValue">
<el-input-number v-model="formData.checkValue" @change="changeValue" :min="0" :precision="2" placeholder=""/>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="差值" prop="diffValue">
<el-input-number disabled v-model="formData.diffValue" :min="0" :precision="2" placeholder="" />
</el-form-item>
<el-row>
<el-col :span="12">
<el-form-item label="单价" prop="unitPrice">
<el-input-number v-model="formData.unitPrice" :min="0" :precision="2" placeholder="" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="备注" prop="remark">
<el-input v-model="formData.remark" placeholder="请输入备注" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
<el-button @click="dialogVisible = false">取 消</el-button>
</template>
</Dialog>
</template>
<script setup lang="ts">
import {EnergyDeviceApi, EnergyDeviceVO} from '@/api/mes/energydevice'
const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
const dialogVisible = ref(false) // 弹窗的是否展示
const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formType = ref('') // 表单的类型：create - 新增；update - 修改
const formData = ref({
id: undefined,
deviceId: undefined,
lastCheckTime: undefined,
lastCheckValue: undefined,
checkValue: undefined,
checkTime: undefined,
diffValue: undefined,
unitPrice: undefined,
remark: undefined
})
const formRules = reactive({
deviceId: [{ required: true, message: '能源设备Id不能为空', trigger: 'blur' }],
checkValue: [{ required: true, message: '抄表值不能为空', trigger: 'blur' }]
})
const formRef = ref() // 表单 Ref
/** 打开弹窗 */
const open = async (type: string, id?: number, deviceId: number) => {
dialogVisible.value = true
dialogTitle.value = t('action.' + type)
formType.value = type
resetForm()
formData.value.deviceId = deviceId
// 修改时，设置数据
// if (id) {
// formLoading.value = true
// try {
// formData.value = await EnergyDeviceApi.getEnergyDeviceCheckRecord(id)
// } finally {
// formLoading.value = false
// }
// }
const data = await EnergyDeviceApi.getEnergyDevice(deviceId)
formData.value.lastCheckValue = data.lastCheckValue
formData.value.lastCheckTime = data.lastCheckTime
}
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
/** 提交表单 */
const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
const submitForm = async () => {
// 校验表单
await formRef.value.validate()
// 提交请求
formLoading.value = true
try {
const data = formData.value
if (formType.value === 'create') {
await EnergyDeviceApi.createEnergyDeviceCheckRecord(data)
message.success(t('common.createSuccess'))
} else {
await EnergyDeviceApi.updateEnergyDeviceCheckRecord(data)
message.success(t('common.updateSuccess'))
}
dialogVisible.value = false
// 发送操作成功的事件
emit('success')
} finally {
formLoading.value = false
}
}
/** 重置表单 */
const resetForm = () => {
formData.value = {
id: undefined,
deviceId: undefined,
lastCheckTime: undefined,
lastCheckValue: undefined,
checkValue: undefined,
checkTime: undefined,
diffValue: undefined,
unitPrice: undefined,
remark: undefined
}
formRef.value?.resetFields()
}
const changeValue = () => {
if(!formData.value.lastCheckValue)
formData.value.diffValue =formData.value.checkValue;
}
</script>

144
src/views/mes/energydevice/components/EnergyDeviceCheckRecordList.vue
Unescape Escape View File

@ -0,0 +1,144 @@
<template>
<!-- 列表 -->
<ContentWrap>
<el-button
type="primary"
plain
@click="openForm('create')"
v-hasPermi="['mes:energy-device:create']"
>
<Icon icon="ep:plus" class="mr-5px" /> 新增抄表
</el-button>
<el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
<el-table-column
label="上次抄表时间"
align="center"
prop="lastCheckTime"
:formatter="dateFormatter"
width="150px"
/>
<el-table-column label="上次抄表值" align="center" prop="lastCheckValue" />
<el-table-column
label="抄表时间"
align="center"
prop="checkTime"
:formatter="dateFormatter"
width="150px"
/>
<el-table-column label="抄表值" align="center" prop="checkValue" />
<el-table-column label="差值" align="center" prop="diffValue" />
<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="180px"
/>
<el-table-column label="操作" align="center">
<template #default="scope">
<!-- <el-button-->
<!-- link-->
<!-- type="primary"-->
<!-- @click="openForm('update', scope.row.id)"-->
<!-- v-hasPermi="['mes:energy-device:update']"-->
<!-- >-->
<!-- 编辑-->
<!-- </el-button>-->
<el-button
link
type="danger"
@click="handleDelete(scope.row.id)"
v-hasPermi="['mes:energy-device:delete']"
>
删除
</el-button>
</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 { EnergyDeviceApi } from '@/api/mes/energydevice'
import EnergyDeviceCheckRecordForm from './EnergyDeviceCheckRecordForm.vue'
const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
const props = defineProps<{
deviceId?: number // 能源设备Id（主表的关联字段）
}>()
const loading = ref(false) // 列表的加载中
const list = ref([]) // 列表的数据
const total = ref(0) // 列表的总页数
const queryParams = reactive({
pageNo: 1,
pageSize: 10,
deviceId: undefined as unknown
})
/** 监听主表的关联字段的变化，加载对应的子表数据 */
watch(
() => props.deviceId,
(val: number) => {
if (!val) {
return
}
queryParams.deviceId = val
handleQuery()
},
{ immediate: true, deep: true }
)
/** 查询列表 */
const getList = async () => {
loading.value = true
try {
const data = await EnergyDeviceApi.getEnergyDeviceCheckRecordPage(queryParams)
list.value = data.list
total.value = data.total
} finally {
loading.value = false
}
}
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.pageNo = 1
getList()
}
/** 添加/修改操作 */
const formRef = ref()
const openForm = (type: string, id?: number) => {
if (!props.deviceId) {
message.error('请选择一个能源设备')
return
}
formRef.value.open(type, id, props.deviceId)
}
/** 删除按钮操作 */
const handleDelete = async (id: number) => {
try {
// 删除的二次确认
await message.delConfirm()
// 发起删除
await EnergyDeviceApi.deleteEnergyDeviceCheckRecord(id)
message.success(t('common.delSuccess'))
// 刷新列表
await getList()
} catch {}
}
</script>

245
src/views/mes/energydevice/index.vue
Unescape Escape View File

@ -0,0 +1,245 @@
<template>
<ContentWrap>
<!-- 搜索工作栏 -->
<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="deviceType">
<el-select
v-model="queryParams.deviceType"
placeholder="请选择设备类型"
clearable
class="!w-240px"
>
<el-option
v-for="dict in getStrDictOptions(DICT_TYPE.MES_ENERGY_DEVICE_TYPE)"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</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="primary"
plain
@click="openForm('create')"
v-hasPermi="['mes:energy-device:create']"
>
<Icon icon="ep:plus" class="mr-5px" /> 新增
</el-button>
<el-button
type="success"
plain
@click="handleExport"
:loading="exportLoading"
v-hasPermi="['mes:energy-device:export']"
>
<Icon icon="ep:download" class="mr-5px" /> 导出
</el-button>
</el-form-item>
</el-form>
</ContentWrap>
<!-- 列表 -->
<ContentWrap>
<el-table
v-loading="loading"
:data="list"
:stripe="true"
:show-overflow-tooltip="true"
highlight-current-row
@current-change="handleCurrentChange"
>
<el-table-column label="名称" align="center" prop="name" />
<el-table-column label="编码" align="center" prop="code" />
<el-table-column label="设备类型" align="center" prop="deviceType">
<template #default="scope">
<dict-tag :type="DICT_TYPE.MES_ENERGY_DEVICE_TYPE" :value="scope.row.deviceType" />
</template>
</el-table-column>
<el-table-column label="抄表周期" align="center" prop="checkCron" />
<el-table-column
label="最后抄表时间"
align="center"
prop="lastCheckTime"
:formatter="dateFormatter"
width="180px"
/>
<el-table-column label="最后抄表值" align="center" prop="lastCheckValue" />
<el-table-column label="单位" align="center" prop="unitName" />
<el-table-column label="设备资料" align="center" prop="info" />
<el-table-column label="是否启用" align="center" prop="isEnable">
<template #default="scope">
<dict-tag :type="DICT_TYPE.INFRA_BOOLEAN_STRING" :value="scope.row.isEnable" />
</template>
</el-table-column>
<el-table-column
label="创建时间"
align="center"
prop="createTime"
:formatter="dateFormatter"
width="180px"
/>
<el-table-column label="操作" fixed="right" align="center" width="130px">
<template #default="scope">
<el-button
link
type="primary"
@click="openForm('update', scope.row.id)"
v-hasPermi="['mes:energy-device:update']"
>
编辑
</el-button>
<el-button
link
type="danger"
@click="handleDelete(scope.row.id)"
v-hasPermi="['mes:energy-device:delete']"
>
删除
</el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<Pagination
:total="total"
v-model:page="queryParams.pageNo"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
</ContentWrap>
<!-- 表单弹窗：添加/修改 -->
<EnergyDeviceForm ref="formRef" @success="getList" />
<!-- 子表的列表 -->
<ContentWrap>
<el-tabs model-value="energyDeviceCheckRecord">
<el-tab-pane label="抄表记录" name="energyDeviceCheckRecord">
<EnergyDeviceCheckRecordList :device-id="currentRow.id" />
</el-tab-pane>
</el-tabs>
</ContentWrap>
</template>
<script setup lang="ts">
import { getStrDictOptions, DICT_TYPE } from '@/utils/dict'
import { dateFormatter } from '@/utils/formatTime'
import download from '@/utils/download'
import { EnergyDeviceApi, EnergyDeviceVO } from '@/api/mes/energydevice'
import EnergyDeviceForm from './EnergyDeviceForm.vue'
import EnergyDeviceCheckRecordList from './components/EnergyDeviceCheckRecordList.vue'
/** 能源设备 列表 */
defineOptions({ name: 'EnergyDevice' })
const message = useMessage() // 消息弹窗
const { t } = useI18n() // 国际化
const loading = ref(true) // 列表的加载中
const list = ref<EnergyDeviceVO[]>([]) // 列表的数据
const total = ref(0) // 列表的总页数
const queryParams = reactive({
pageNo: 1,
pageSize: 10,
name: undefined,
code: undefined,
deviceType: undefined,
info: undefined,
checkCron: undefined,
lastCheckTime: [],
lastCheckValue: undefined,
unitName: undefined,
isEnable: undefined,
createTime: []
})
const queryFormRef = ref() // 搜索的表单
const exportLoading = ref(false) // 导出的加载中
/** 查询列表 */
const getList = async () => {
loading.value = true
try {
const data = await EnergyDeviceApi.getEnergyDevicePage(queryParams)
list.value = data.list
total.value = data.total
} finally {
loading.value = false
}
}
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.pageNo = 1
getList()
}
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value.resetFields()
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 EnergyDeviceApi.deleteEnergyDevice(id)
message.success(t('common.delSuccess'))
// 刷新列表
await getList()
} catch {}
}
/** 导出按钮操作 */
const handleExport = async () => {
try {
// 导出的二次确认
await message.exportConfirm()
// 发起导出
exportLoading.value = true
const data = await EnergyDeviceApi.exportEnergyDevice(queryParams)
download.excel(data, '能源设备.xls')
} catch {
} finally {
exportLoading.value = false
}
}
/** 选中行操作 */
const currentRow = ref({}) // 选中行
const handleCurrentChange = (row) => {
currentRow.value = row
}
/** 初始化 **/
onMounted(() => {
getList()
})
</script>

165
src/views/mes/energydevicecheck/EnergyDeviceCheckRecordForm.vue
Unescape Escape View File

@ -0,0 +1,165 @@
<template>
<Dialog :title="dialogTitle" v-model="dialogVisible">
<el-form
ref="formRef"
:model="formData"
:rules="formRules"
label-width="100px"
v-loading="formLoading"
>
<el-row>
<el-col :span="12">
<el-form-item label="能源设备Id" prop="deviceId">
<el-input v-model="formData.deviceId" placeholder="请输入能源设备Id" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="能源设备Id" prop="deviceId">
<el-input v-model="formData.deviceId" placeholder="请输入能源设备Id" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="上次抄表时间" prop="lastCheckTime">
<el-date-picker
v-model="formData.lastCheckTime"
type="date"
value-format="x"
placeholder="选择上次抄表时间"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="上次抄表值" prop="lastCheckValue">
<el-input v-model="formData.lastCheckValue" placeholder="请输入上次抄表值" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="抄表时间" prop="checkTime">
<el-date-picker
v-model="formData.checkTime"
type="date"
value-format="x"
placeholder="选择抄表时间"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="抄表值" prop="checkValue">
<el-input v-model="formData.checkValue" placeholder="请输入抄表值" />
</el-form-item>
</el-col>
</el-row>
<el-form-item label="差值" prop="diffValue">
<el-input v-model="formData.diffValue" placeholder="请输入差值" />
</el-form-item>
<el-row>
<el-col :span="12">
<el-form-item label="单价" prop="unitPrice">
<el-input v-model="formData.unitPrice" placeholder="请输入单价" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="备注" prop="remark">
<el-input v-model="formData.remark" placeholder="请输入备注" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
<el-button @click="dialogVisible = false">取 消</el-button>
</template>
</Dialog>
</template>
<script setup lang="ts">
import { EnergyDeviceCheckRecordApi, EnergyDeviceCheckRecordVO } from '@/api/mes/energydevicecheck'
/** 抄表记录 表单 */
defineOptions({ name: 'EnergyDeviceCheckRecordForm' })
const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
const dialogVisible = ref(false) // 弹窗的是否展示
const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formType = ref('') // 表单的类型：create - 新增；update - 修改
const formData = ref({
id: undefined,
deviceId: undefined,
lastCheckTime: undefined,
lastCheckValue: undefined,
checkValue: undefined,
checkTime: undefined,
diffValue: undefined,
unitPrice: undefined,
remark: undefined
})
const formRules = reactive({
deviceId: [{ required: true, message: '能源设备Id不能为空', trigger: 'blur' }],
checkValue: [{ required: true, message: '抄表值不能为空', trigger: 'blur' }]
})
const formRef = ref() // 表单 Ref
/** 打开弹窗 */
const open = async (type: string, id?: number) => {
dialogVisible.value = true
dialogTitle.value = t('action.' + type)
formType.value = type
resetForm()
// 修改时，设置数据
if (id) {
formLoading.value = true
try {
formData.value = await EnergyDeviceCheckRecordApi.getEnergyDeviceCheckRecord(id)
} finally {
formLoading.value = false
}
}
}
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
/** 提交表单 */
const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
const submitForm = async () => {
// 校验表单
await formRef.value.validate()
// 提交请求
formLoading.value = true
try {
const data = formData.value as unknown as EnergyDeviceCheckRecordVO
if (formType.value === 'create') {
await EnergyDeviceCheckRecordApi.createEnergyDeviceCheckRecord(data)
message.success(t('common.createSuccess'))
} else {
await EnergyDeviceCheckRecordApi.updateEnergyDeviceCheckRecord(data)
message.success(t('common.updateSuccess'))
}
dialogVisible.value = false
// 发送操作成功的事件
emit('success')
} finally {
formLoading.value = false
}
}
/** 重置表单 */
const resetForm = () => {
formData.value = {
id: undefined,
deviceId: undefined,
lastCheckTime: undefined,
lastCheckValue: undefined,
checkValue: undefined,
checkTime: undefined,
diffValue: undefined,
unitPrice: undefined,
remark: undefined
}
formRef.value?.resetFields()
}
</script>

218
src/views/mes/energydevicecheck/index.vue
Unescape Escape View File

@ -0,0 +1,218 @@
<template>
<ContentWrap>
<!-- 搜索工作栏 -->
<el-form
class="-mb-15px"
:model="queryParams"
ref="queryFormRef"
:inline="true"
label-width="68px"
>
<el-form-item label="能源设备" prop="deviceId">
<el-input
v-model="queryParams.deviceId"
placeholder="请输入能源设备"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</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="primary"
plain
@click="openForm('create')"
v-hasPermi="['mes:energy-device-check-record:create']"
>
<Icon icon="ep:plus" 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-form>
</ContentWrap>
<!-- 列表 -->
<ContentWrap>
<el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
<el-table-column label="能源设备" align="center" prop="deviceId" />
<el-table-column
label="上次抄表时间"
align="center"
prop="lastCheckTime"
:formatter="dateFormatter"
width="180px"
/>
<el-table-column label="上次抄表值" align="center" prop="lastCheckValue" />
<el-table-column label="抄表值" align="center" prop="checkValue" />
<el-table-column
label="抄表时间"
align="center"
prop="checkTime"
:formatter="dateFormatter"
width="180px"
/>
<el-table-column label="差值" align="center" prop="diffValue" />
<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="180px"
/>
<el-table-column label="操作" align="center">
<template #default="scope">
<el-button
link
type="primary"
@click="openForm('update', scope.row.id)"
v-hasPermi="['mes:energy-device-check-record:update']"
>
编辑
</el-button>
<el-button
link
type="danger"
@click="handleDelete(scope.row.id)"
v-hasPermi="['mes:energy-device-check-record:delete']"
>
删除
</el-button>
</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 EnergyDeviceCheckRecordForm from './EnergyDeviceCheckRecordForm.vue'
/** 抄表记录 列表 */
defineOptions({ name: 'EnergyDeviceCheckRecord' })
const message = useMessage() // 消息弹窗
const { t } = useI18n() // 国际化
const loading = ref(true) // 列表的加载中
const list = ref<EnergyDeviceCheckRecordVO[]>([]) // 列表的数据
const total = ref(0) // 列表的总页数
const queryParams = reactive({
pageNo: 1,
pageSize: 10,
deviceId: undefined,
checkTime: [],
diffValue: undefined,
remark: undefined,
createTime: []
})
const queryFormRef = ref() // 搜索的表单
const exportLoading = ref(false) // 导出的加载中
/** 查询列表 */
const getList = async () => {
loading.value = true
try {
const data = await EnergyDeviceCheckRecordApi.getEnergyDeviceCheckRecordPage(queryParams)
list.value = data.list
total.value = data.total
} finally {
loading.value = false
}
}
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.pageNo = 1
getList()
}
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value.resetFields()
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 {
// 导出的二次确认
await message.exportConfirm()
// 发起导出
exportLoading.value = true
const data = await EnergyDeviceCheckRecordApi.exportEnergyDeviceCheckRecord(queryParams)
download.excel(data, '抄表记录.xls')
} catch {
} finally {
exportLoading.value = false
}
}
/** 初始化 **/
onMounted(() => {
getList()
})
</script>
Write Preview
Loading…
Cancel
Save