| | |
| | | <template> |
| | | <el-dialog |
| | | :visible="visible" |
| | | v-model="dialogVisible" |
| | | :title="title" |
| | | width="70%" |
| | | :close-on-click-modal="false" |
| | | @close="handleClose" |
| | | @update:visible="(val) => emit('update:visible', val)" |
| | | > |
| | | <el-form |
| | | ref="formRef" |
| | |
| | | |
| | | <el-form-item label="组类型" prop="groupType"> |
| | | <el-select v-model="form.groupType" placeholder="选择组类型"> |
| | | <el-option label="设备组" value="设备组" /> |
| | | <el-option label="管理组" value="管理组" /> |
| | | <el-option label="监控组" value="监控组" /> |
| | | <el-option label="维护组" value="维护组" /> |
| | | <el-option label="生产线" value="生产线" /> |
| | | <el-option label="测试线" value="测试线" /> |
| | | <el-option label="辅助设备组" value="辅助设备组" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | |
| | |
| | | <el-select v-model="form.groupStatus" placeholder="选择组状态"> |
| | | <el-option label="启用" value="ENABLED" /> |
| | | <el-option label="禁用" value="DISABLED" /> |
| | | <el-option label="维护中" value="MAINTENANCE" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="执行模式" prop="executionMode"> |
| | | <el-radio-group v-model="form.executionMode"> |
| | | <el-radio label="SERIAL">串行执行</el-radio> |
| | | <el-radio label="PARALLEL">并行执行</el-radio> |
| | | </el-radio-group> |
| | | <div class="form-tip">串行:按顺序依次执行设备操作;并行:同时执行多个设备操作</div> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="最大设备数" prop="maxDeviceCount"> |
| | |
| | | const testing = ref(false) |
| | | const saving = ref(false) |
| | | const validationResult = ref(null) |
| | | |
| | | // 使用计算属性来同步 visible prop 和内部 dialogVisible |
| | | const dialogVisible = computed({ |
| | | get: () => props.visible, |
| | | set: (val) => emit('update:visible', val) |
| | | }) |
| | | const customParamsText = ref('') |
| | | |
| | | // 表单数据 |
| | | const form = reactive({ |
| | | groupName: '', |
| | | groupCode: '', |
| | | groupType: '设备组', |
| | | groupType: '生产线', |
| | | description: '', |
| | | sortOrder: 0, |
| | | groupStatus: 'ENABLED', |
| | | executionMode: 'SERIAL', // 执行模式:SERIAL串行 / PARALLEL并行 |
| | | maxDeviceCount: 100, |
| | | heartbeatInterval: 30, |
| | | connectionTimeout: 10, |
| | |
| | | } |
| | | }) |
| | | } |
| | | }) |
| | | }, { immediate: true }) |
| | | |
| | | // 方法定义 |
| | | const resetForm = () => { |
| | | Object.assign(form, { |
| | | groupName: '', |
| | | groupCode: '', |
| | | groupType: '设备组', |
| | | groupType: '生产线', |
| | | description: '', |
| | | sortOrder: 0, |
| | | groupStatus: 'ENABLED', |
| | | executionMode: 'SERIAL', |
| | | maxDeviceCount: 100, |
| | | heartbeatInterval: 30, |
| | | connectionTimeout: 10, |
| | |
| | | const loadFormData = () => { |
| | | if (!props.data) return |
| | | |
| | | // 转换后端状态字段到前端格式 |
| | | // 后端 status: 0=停用, 1=启用, 2=维护中 |
| | | // 前端 groupStatus: "ENABLED"/"DISABLED"/"MAINTENANCE" |
| | | let groupStatus = 'ENABLED' |
| | | if (props.data.status !== undefined) { |
| | | // 优先使用后端的 status 字段 |
| | | if (props.data.status === 1) { |
| | | groupStatus = 'ENABLED' |
| | | } else if (props.data.status === 2) { |
| | | groupStatus = 'MAINTENANCE' |
| | | } else { |
| | | groupStatus = 'DISABLED' |
| | | } |
| | | } else if (props.data.groupStatus) { |
| | | // 兼容前端已有的 groupStatus 字段 |
| | | groupStatus = props.data.groupStatus |
| | | } |
| | | |
| | | Object.assign(form, { |
| | | groupName: props.data.groupName || '', |
| | | groupCode: props.data.groupCode || '', |
| | | groupType: props.data.groupType || '设备组', |
| | | groupType: props.data.groupType || '生产线', |
| | | description: props.data.description || '', |
| | | sortOrder: props.data.sortOrder || 0, |
| | | groupStatus: props.data.groupStatus || 'ENABLED', |
| | | groupStatus: groupStatus, |
| | | maxDeviceCount: props.data.maxDeviceCount || 100, |
| | | heartbeatInterval: props.data.heartbeatInterval || 30, |
| | | connectionTimeout: props.data.connectionTimeout || 10, |
| | |
| | | logLevel: props.data.logLevel || 'INFO', |
| | | enableAutoBackup: props.data.enableAutoBackup || false, |
| | | backupInterval: props.data.backupInterval || 24, |
| | | customParams: props.data.customParams || {} |
| | | customParams: props.data.customParams || props.data.extraConfig ? (typeof props.data.extraConfig === 'string' ? JSON.parse(props.data.extraConfig) : props.data.extraConfig) : {} |
| | | }) |
| | | |
| | | // 从customParams或extraConfig中读取executionMode |
| | | let executionMode = 'SERIAL' // 默认串行 |
| | | if (form.customParams && form.customParams.executionMode) { |
| | | executionMode = form.customParams.executionMode |
| | | } else if (props.data.extraConfig) { |
| | | try { |
| | | const extraConfig = typeof props.data.extraConfig === 'string' ? JSON.parse(props.data.extraConfig) : props.data.extraConfig |
| | | if (extraConfig.executionMode) { |
| | | executionMode = extraConfig.executionMode |
| | | } |
| | | } catch (e) { |
| | | console.warn('解析extraConfig失败:', e) |
| | | } |
| | | } |
| | | form.executionMode = executionMode |
| | | |
| | | customParamsText.value = JSON.stringify(form.customParams, null, 2) |
| | | } |
| | |
| | | return |
| | | } |
| | | |
| | | // 转换前端状态字段到后端格式 |
| | | // 前端 groupStatus: "ENABLED"/"DISABLED"/"MAINTENANCE" |
| | | // 后端 status: 0=停用, 1=启用, 2=维护中 |
| | | let status = 1 // 默认启用 |
| | | if (form.groupStatus === 'ENABLED') { |
| | | status = 1 |
| | | } else if (form.groupStatus === 'MAINTENANCE') { |
| | | status = 2 |
| | | } else { |
| | | status = 0 |
| | | } |
| | | |
| | | // 将executionMode保存到customParams中,以便后端从extraConfig中读取 |
| | | const customParams = { |
| | | ...form.customParams, |
| | | executionMode: form.executionMode |
| | | } |
| | | |
| | | const config = { |
| | | ...form, |
| | | customParams: form.customParams |
| | | status: status, // 后端需要的 status 字段 |
| | | customParams: customParams, |
| | | extraConfig: JSON.stringify(customParams) // 后端使用extraConfig字段 |
| | | } |
| | | // 移除前端专用的 groupStatus 和 executionMode 字段,避免后端混淆 |
| | | delete config.groupStatus |
| | | delete config.executionMode |
| | | |
| | | const response = isEdit.value |
| | | ? await deviceGroupApi.update(props.data.id, config) |