style:设备管理-任务管理修改项目表单字段/必填校验

liutao_branch
黄伟杰 3 months ago
parent b9c75e12d8
commit 826881f365

@ -19,6 +19,7 @@ export interface OrganizationVO {
export type DeviceParameterAnalysisNodeVO = {
id: number | string
name: string
parentId?: number | string
equipments?: {
id: number | string
name: string

@ -29,17 +29,19 @@
</el-form-item>
<el-form-item label="所属区域" prop="orgId">
<el-select
<el-tree-select
v-model="formData.orgId"
placeholder="根据区域结构筛选列表"
clearable
:data="orgSelectTree"
:props="orgTreeSelectProps"
filterable
check-strictly
clearable
class="!w-full"
placeholder="根据区域结构筛选列表"
:loading="analysisLoading"
:render-after-expand="false"
@change="handleOrgChange"
>
<el-option v-for="org in analysisList" :key="org.id" :label="org.name" :value="org.id" />
</el-select>
/>
</el-form-item>
<el-form-item label="计算规则" prop="operationRulesVOList">
@ -53,7 +55,6 @@
v-model="rule.pointValue"
:data="equipmentTree"
:props="treeSelectProps"
check-strictly
filterable
clearable
class="!w-full"
@ -83,7 +84,7 @@
:disabled="formData.operationRulesVOList.length <= 1"
@click="removeRule"
>
<Icon icon="ep:minus" />
<el-icon><Remove /></el-icon>
</el-button>
</div>
</template>
@ -108,6 +109,8 @@
import { EnergyDeviceApi, EnergyDeviceVO } from '@/api/mes/energydevice'
import {EnergyTypeApi, EnergyTypeVO} from "@/api/mes/energytype";
import { OrganizationApi, DeviceParameterAnalysisNodeVO } from '@/api/mes/organization'
import { Remove } from '@element-plus/icons-vue'
import { handleTree } from '@/utils/tree'
/** 能源设备 表单 */
defineOptions({ name: 'EnergyDeviceForm' })
@ -147,7 +150,52 @@ const formRules = reactive({
const formRef = ref() // Ref
const analysisLoading = ref(false)
const analysisList = ref<DeviceParameterAnalysisNodeVO[]>([])
type OrgAnalysisNode = DeviceParameterAnalysisNodeVO & { children?: OrgAnalysisNode[] }
const analysisList = ref<OrgAnalysisNode[]>([])
const analysisTree = computed(() => {
const list = analysisList.value ?? []
if (!list.length) return [] as OrgAnalysisNode[]
const hasParentId = list.some((n) => (n as any).parentId !== undefined && (n as any).parentId !== null)
if (!hasParentId) {
return list.map((n) => ({ ...n })) as OrgAnalysisNode[]
}
const cloned = list.map((n) => ({ ...n })) as OrgAnalysisNode[]
return handleTree(cloned as any[], 'id', 'parentId', 'children') as OrgAnalysisNode[]
})
type OrgSelectNode = {
id: number | string
name: string
children?: OrgSelectNode[]
}
const orgSelectTree = computed(() => {
const tree = analysisTree.value ?? []
if (!tree.length) return [] as OrgSelectNode[]
const pruneAndAttach = (nodes: OrgAnalysisNode[]): OrgSelectNode[] => {
const kept: OrgSelectNode[] = []
nodes.forEach((node) => {
const childNodes = Array.isArray(node.children) ? pruneAndAttach(node.children) : []
const hasValidEquipment = (node?.equipments ?? []).some((eq) => (eq?.parameters ?? []).length > 0)
if (!hasValidEquipment && !childNodes.length) return
kept.push({ id: node.id, name: node.name, children: childNodes.length ? childNodes : undefined })
})
return kept
}
return pruneAndAttach(tree)
})
const orgTreeSelectProps = {
label: 'name',
children: 'children',
value: 'id'
}
const treeSelectProps = {
label: 'name',
@ -164,15 +212,21 @@ const currentOrgNode = computed(() => {
const equipmentTree = computed(() => {
const equipments = currentOrgNode.value?.equipments ?? []
return equipments.map((eq) => ({
id: `device:${eq.id}`,
name: eq.name,
disabled: true,
children: (eq.parameters ?? []).map((p) => ({
id: `${eq.id}:${p.id}`,
name: `${eq.name}: ${p.name}`
}))
}))
return equipments
.map((eq) => {
const params = eq.parameters ?? []
if (!params.length) return null
return {
id: `device:${eq.id}`,
name: eq.name,
disabled: true,
children: params.map((p) => ({
id: `${eq.id}:${p.id}`,
name: `${eq.name}: ${p.name}`
}))
}
})
.filter(Boolean) as any[]
})
/** 打开弹窗 */

@ -152,7 +152,9 @@ const formData = ref({
const formRules = reactive({
name: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
taskType: [{ required: true, message: '类型不能为空', trigger: 'change' }],
enabled: [{ required: true, message: '是否启用不能为空', trigger: 'change' }]
enabled: [{ required: true, message: '是否启用不能为空', trigger: 'change' }],
deviceList: [{ required: true, message: '设备列表不能为空', trigger: 'change' }],
projectForm: [{ required: true, message: '项目表单不能为空', trigger: 'change' }],
})
const resetForm = () => {

Loading…
Cancel
Save