|
|
|
@ -1,43 +1,81 @@
|
|
|
|
<template>
|
|
|
|
<template>
|
|
|
|
<Dialog :title="dialogTitle" v-model="dialogVisible" width="800px">
|
|
|
|
<Dialog :title="dialogTitle" v-model="dialogVisible" width="800px">
|
|
|
|
<el-form ref="formRef" :model="formData" :rules="formRules" label-width="100px" v-loading="formLoading">
|
|
|
|
<el-form
|
|
|
|
<el-form-item label="表编码" prop="code">
|
|
|
|
ref="formRef"
|
|
|
|
<el-input v-model="formData.code" placeholder="请输入表编码" :disabled="formType === 'update'" />
|
|
|
|
:model="formData"
|
|
|
|
|
|
|
|
:rules="formRules"
|
|
|
|
|
|
|
|
label-width="auto"
|
|
|
|
|
|
|
|
v-loading="formLoading"
|
|
|
|
|
|
|
|
class="energy-device-dialog-form"
|
|
|
|
|
|
|
|
>
|
|
|
|
|
|
|
|
<el-form-item :label="t('EnergyManagement.EnergyDevice.dialogCodeLabel')" prop="code">
|
|
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
|
|
v-model="formData.code"
|
|
|
|
|
|
|
|
:placeholder="t('EnergyManagement.EnergyDevice.dialogCodePlaceholder')"
|
|
|
|
|
|
|
|
:disabled="formType === 'update'"
|
|
|
|
|
|
|
|
/>
|
|
|
|
</el-form-item>
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
|
|
|
|
<el-form-item label="表名称" prop="name">
|
|
|
|
<el-form-item :label="t('EnergyManagement.EnergyDevice.dialogNameLabel')" prop="name">
|
|
|
|
<el-input v-model="formData.name" placeholder="请输入表名称" />
|
|
|
|
<el-input
|
|
|
|
|
|
|
|
v-model="formData.name"
|
|
|
|
|
|
|
|
:placeholder="t('EnergyManagement.EnergyDevice.dialogNamePlaceholder')"
|
|
|
|
|
|
|
|
/>
|
|
|
|
</el-form-item>
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
|
|
|
|
<el-form-item label="能源类型" prop="deviceTypeId">
|
|
|
|
<el-form-item :label="t('EnergyManagement.EnergyDevice.dialogEnergyTypeLabel')" prop="deviceTypeId">
|
|
|
|
<el-select
|
|
|
|
<el-select
|
|
|
|
v-model="formData.deviceTypeId" @change="handleDeviceTypeChange" placeholder="请选择能源类型" clearable
|
|
|
|
v-model="formData.deviceTypeId"
|
|
|
|
filterable class="!w-full">
|
|
|
|
@change="handleDeviceTypeChange"
|
|
|
|
|
|
|
|
:placeholder="t('EnergyManagement.EnergyDevice.dialogEnergyTypePlaceholder')"
|
|
|
|
|
|
|
|
clearable
|
|
|
|
|
|
|
|
filterable
|
|
|
|
|
|
|
|
class="!w-full"
|
|
|
|
|
|
|
|
>
|
|
|
|
<el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id" />
|
|
|
|
<el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id" />
|
|
|
|
</el-select>
|
|
|
|
</el-select>
|
|
|
|
</el-form-item>
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
|
|
|
|
<el-form-item label="所属区域" prop="orgId">
|
|
|
|
<el-form-item :label="t('EnergyManagement.EnergyDevice.dialogOrgLabel')" prop="orgId">
|
|
|
|
<el-tree-select
|
|
|
|
<el-tree-select
|
|
|
|
v-model="formData.orgId" :data="orgSelectTree" :props="orgTreeSelectProps" filterable
|
|
|
|
v-model="formData.orgId"
|
|
|
|
check-strictly clearable class="!w-full" placeholder="根据区域结构筛选列表" :loading="analysisLoading"
|
|
|
|
:data="orgSelectTree"
|
|
|
|
:render-after-expand="false" @change="handleOrgChange" />
|
|
|
|
:props="orgTreeSelectProps"
|
|
|
|
|
|
|
|
filterable
|
|
|
|
|
|
|
|
check-strictly
|
|
|
|
|
|
|
|
clearable
|
|
|
|
|
|
|
|
class="!w-full"
|
|
|
|
|
|
|
|
:placeholder="t('EnergyManagement.EnergyDevice.dialogOrgTreePlaceholder')"
|
|
|
|
|
|
|
|
:loading="analysisLoading"
|
|
|
|
|
|
|
|
:render-after-expand="false"
|
|
|
|
|
|
|
|
@change="handleOrgChange"
|
|
|
|
|
|
|
|
/>
|
|
|
|
</el-form-item>
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
|
|
|
|
<el-form-item label="计算规则" prop="operationRulesVOList">
|
|
|
|
<el-form-item :label="t('EnergyManagement.EnergyDevice.dialogRulesLabel')" prop="operationRulesVOList">
|
|
|
|
<div class="w-full flex flex-col gap-8px">
|
|
|
|
<div class="w-full flex flex-col gap-8px">
|
|
|
|
<div
|
|
|
|
<div
|
|
|
|
v-for="(rule, index) in formData.operationRulesVOList" :key="index"
|
|
|
|
v-for="(rule, index) in formData.operationRulesVOList" :key="index"
|
|
|
|
class="w-full flex items-center gap-8px">
|
|
|
|
class="w-full flex items-center gap-8px">
|
|
|
|
<el-tree-select
|
|
|
|
<el-tree-select
|
|
|
|
v-model="rule.pointValue" :data="equipmentTree" :props="treeSelectProps" filterable
|
|
|
|
v-model="rule.pointValue"
|
|
|
|
clearable class="!w-full" placeholder="根据设备选择点位" :loading="devicePointLoading"
|
|
|
|
:data="equipmentTree"
|
|
|
|
@change="(val) => handlePointSelected(index, val)" />
|
|
|
|
:props="treeSelectProps"
|
|
|
|
|
|
|
|
filterable
|
|
|
|
|
|
|
|
clearable
|
|
|
|
|
|
|
|
class="!w-full"
|
|
|
|
|
|
|
|
:placeholder="t('EnergyManagement.EnergyDevice.dialogRulesPointPlaceholder')"
|
|
|
|
|
|
|
|
:loading="devicePointLoading"
|
|
|
|
|
|
|
|
@change="(val) => handlePointSelected(index, val)"
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
|
|
|
|
<template v-if="index < formData.operationRulesVOList.length - 1">
|
|
|
|
<template v-if="index < formData.operationRulesVOList.length - 1">
|
|
|
|
<el-select
|
|
|
|
<el-select
|
|
|
|
v-model="formData.operationRulesVOList[index].operator" placeholder="运算符" class="!w-110px"
|
|
|
|
v-model="formData.operationRulesVOList[index].operator"
|
|
|
|
clearable>
|
|
|
|
:placeholder="t('EnergyManagement.EnergyDevice.dialogOperatorPlaceholder')"
|
|
|
|
|
|
|
|
class="!w-110px"
|
|
|
|
|
|
|
|
clearable
|
|
|
|
|
|
|
|
>
|
|
|
|
<el-option v-for="op in operatorOptions" :key="op" :label="op" :value="op" />
|
|
|
|
<el-option v-for="op in operatorOptions" :key="op" :label="op" :value="op" />
|
|
|
|
</el-select>
|
|
|
|
</el-select>
|
|
|
|
</template>
|
|
|
|
</template>
|
|
|
|
@ -57,7 +95,7 @@ v-model="formData.operationRulesVOList[index].operator" placeholder="运算符"
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</el-form-item>
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
|
|
|
|
<el-form-item label="是否启用" prop="isEnable">
|
|
|
|
<el-form-item :label="t('EnergyManagement.EnergyDevice.dialogIsEnableLabel')" prop="isEnable">
|
|
|
|
<el-switch v-model="formData.isEnable" />
|
|
|
|
<el-switch v-model="formData.isEnable" />
|
|
|
|
</el-form-item>
|
|
|
|
</el-form-item>
|
|
|
|
</el-form>
|
|
|
|
</el-form>
|
|
|
|
@ -65,8 +103,12 @@ v-model="formData.operationRulesVOList[index].operator" placeholder="运算符"
|
|
|
|
<Editor v-model="formData.info" height="250px" />
|
|
|
|
<Editor v-model="formData.info" height="250px" />
|
|
|
|
</el-form-item> -->
|
|
|
|
</el-form-item> -->
|
|
|
|
<template #footer>
|
|
|
|
<template #footer>
|
|
|
|
<el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
|
|
|
|
<el-button @click="submitForm" type="primary" :disabled="formLoading">
|
|
|
|
<el-button @click="dialogVisible = false">取 消</el-button>
|
|
|
|
{{ t('EnergyManagement.EnergyDevice.dialogSubmitButtonText') }}
|
|
|
|
|
|
|
|
</el-button>
|
|
|
|
|
|
|
|
<el-button @click="dialogVisible = false">
|
|
|
|
|
|
|
|
{{ t('EnergyManagement.EnergyDevice.dialogCancelButtonText') }}
|
|
|
|
|
|
|
|
</el-button>
|
|
|
|
</template>
|
|
|
|
</template>
|
|
|
|
</Dialog>
|
|
|
|
</Dialog>
|
|
|
|
</template>
|
|
|
|
</template>
|
|
|
|
@ -107,11 +149,11 @@ const formData = ref({
|
|
|
|
operationRulesVOList: [{ deviceId: undefined, pointId: undefined, operator: undefined, pointValue: undefined }],
|
|
|
|
operationRulesVOList: [{ deviceId: undefined, pointId: undefined, operator: undefined, pointValue: undefined }],
|
|
|
|
})
|
|
|
|
})
|
|
|
|
const formRules = reactive({
|
|
|
|
const formRules = reactive({
|
|
|
|
name: [{ required: true, message: '表名称不能为空', trigger: 'blur' }],
|
|
|
|
name: [{ required: true, message: t('EnergyManagement.EnergyDevice.validatorNameRequired'), trigger: 'blur' }],
|
|
|
|
code: [{ required: true, message: '表编码不能为空', trigger: 'blur' }],
|
|
|
|
code: [{ required: true, message: t('EnergyManagement.EnergyDevice.validatorCodeRequired'), trigger: 'blur' }],
|
|
|
|
orgId: [{ required: true, message: '所属区域不能为空', trigger: 'change' }],
|
|
|
|
orgId: [{ required: true, message: t('EnergyManagement.EnergyDevice.validatorOrgRequired'), trigger: 'change' }],
|
|
|
|
operationRulesVOList: [{ required: true, validator: (_rule, _value, callback) => validateRules(callback), trigger: 'change' }],
|
|
|
|
operationRulesVOList: [{ required: true, validator: (_rule, _value, callback) => validateRules(callback), trigger: 'change' }],
|
|
|
|
isEnable: [{ required: true, message: '是否启用不能为空', trigger: 'blur' }]
|
|
|
|
isEnable: [{ required: true, message: t('EnergyManagement.EnergyDevice.validatorIsEnableRequired'), trigger: 'blur' }]
|
|
|
|
})
|
|
|
|
})
|
|
|
|
const formRef = ref() // 表单 Ref
|
|
|
|
const formRef = ref() // 表单 Ref
|
|
|
|
|
|
|
|
|
|
|
|
@ -441,20 +483,26 @@ const hydratePointValues = () => {
|
|
|
|
const validateRules = (callback: any) => {
|
|
|
|
const validateRules = (callback: any) => {
|
|
|
|
const list = formData.value.operationRulesVOList ?? []
|
|
|
|
const list = formData.value.operationRulesVOList ?? []
|
|
|
|
if (!list.length) {
|
|
|
|
if (!list.length) {
|
|
|
|
callback(new Error('计算规则不能为空'))
|
|
|
|
callback(new Error(t('EnergyManagement.EnergyDevice.validatorRulesRequired')))
|
|
|
|
return
|
|
|
|
return
|
|
|
|
}
|
|
|
|
}
|
|
|
|
for (let i = 0; i < list.length; i++) {
|
|
|
|
for (let i = 0; i < list.length; i++) {
|
|
|
|
const r = list[i] as any
|
|
|
|
const r = list[i] as any
|
|
|
|
if (!r?.deviceId || !r?.pointId) {
|
|
|
|
if (!r?.deviceId || !r?.pointId) {
|
|
|
|
callback(new Error('请选择设备点位'))
|
|
|
|
callback(new Error(t('EnergyManagement.EnergyDevice.validatorRulesPointRequired')))
|
|
|
|
return
|
|
|
|
return
|
|
|
|
}
|
|
|
|
}
|
|
|
|
if (i > 0 && !list[i - 1]?.operator) {
|
|
|
|
if (i > 0 && !list[i - 1]?.operator) {
|
|
|
|
callback(new Error('请选择运算符'))
|
|
|
|
callback(new Error(t('EnergyManagement.EnergyDevice.validatorRulesOperatorRequired')))
|
|
|
|
return
|
|
|
|
return
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
callback()
|
|
|
|
callback()
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<style scoped>
|
|
|
|
|
|
|
|
.energy-device-dialog-form :deep(.el-form-item__label) {
|
|
|
|
|
|
|
|
min-width: 100px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
</style>
|
|
|
|
|
