icd调整

frontend/src/api/device/icd/index.ts

@@ -4,34 +4,34 @@ import http from '@/api'
 /**
  * @name ICD管理模块
  */
-
-
-
-//获取ICD分页
 export const getICDList = (params: ICD.ReqICDParams) => {
-    return http.post(`/icd/list`,params)
+    return http.post<ICD.ResICDPage>(`/icd/list`, params)
 }
 
-
+export const getICDAllList = () => {
-//获取ICD
+    return http.get<ICD.ResICD[]>(`/icd/listAll`)
-export const getICDAllList = (params: ICD.ResICD) => {
-    return http.get(`/icd/listAll`,params)
 }
 
-//添加ICD
+export const getStandardICDList = () => {
-export const addICD = (params: ICD.ResICD) => {
+    return http.get<ICD.StandardOption[]>(`/icd/standard-list`)
+}
+
+export const getICDById = (id: string) => {
+    return http.get<ICD.ResICD>(`/icd/getById`, { id })
+}
+
+export const addICD = (params: FormData) => {
     return http.upload(`/icd/add`, params)
-  }
+}
 
-  //编辑ICD
+export const updateICD = (params: FormData) => {
-  export const updateICD = (params: ICD.ResICD) => {
     return http.upload(`/icd/update`, params)
-  }
+}
 
-  //删除ICD
+export const deleteICD = (params: string[]) => {
-  export const deleteICD = (params: string[]) => {
     return http.post(`/icd/delete`, params)
-  }
+}
-
-
 
+export const exportICD = (id: string) => {
+    return http.downloadGetWithHeaders(`/icd/export/${id}`)
+}

frontend/src/api/device/interface/icd.ts

@@ -1,38 +1,36 @@
 import type { ReqPage, ResPage } from '@/api/interface'
 
-// ICD模块
 export namespace ICD {
-
-  /**
-   * ICD表格分页查询参数
-   */
     export interface ReqICDParams extends ReqPage {
-    id: string; // 装置序号id 必填
+        name?: string
-    devType?: string; // 设备名称
+        type?: number
-    createTime?: string; //创建时间
+    }
+
+    export interface StandardOption {
+        id: string
+        name: string
+        type?: number
     }
 
-  /**
-   * ICD新增、修改、根据id查询返回的对象
-   */
     export interface ResICD {
-    id: string;     //icdID
+        id: string
-    name: string;//icd名称
+        name: string
-    path: string;//icd存储地址
+        state: number
-    state: number;
+        createBy?: string | null
-    createBy?: string| null; //创建用户
+        createTime?: string | null
-    createTime?: string| null; //创建时间
+        updateBy?: string | null
-    updateBy?: string| null; //更新用户
+        updateTime?: string | null
-    updateTime?: string| null; //更新时间
+        angle: number
-    angle: number; // 是否支持电压相角、电流相角指标
+        usePhaseIndex: number
-    usePhaseIndex: number; // 角型接线时是否使用相别的指标来进行检测
+        jsonStr: string
-    mappingFile: string | null;//映射文件
+        xmlStr: string
+        result: number
+        msg: string | null
+        type: number
+        referenceIcdId: string | null
+        referenceIcdName?: string | null
+        hasIcdFile?: boolean | null
     }
 
-  /**
+    export interface ResICDPage extends ResPage<ResICD> {}
-   * ICD表格查询分页返回的对象；
-   */
-  export interface ResICDPage extends ResPage<ResICD> {
-
-  }
 }

frontend/src/api/index.ts

@@ -214,6 +214,10 @@ class RequestHttp {
         return this.service.post(url, params, { ..._object, responseType: 'blob' })
     }
 
+    downloadGetWithHeaders(url: string, _object = {}): Promise<AxiosResponse<Blob>> {
+        return this.service.get(url, { ..._object, responseType: 'blob' })
+    }
+
     upload(url: string, params?: object, _object = {}): Promise<BlobPart> {
         return this.service.post(url, params, {
             ..._object,

frontend/src/views/machine/devType/components/devTypePopup.vue

@@ -99,7 +99,7 @@
   // 定义弹出组件元信息
   const dialogFormRef = ref()
   const scene = ref('')
-  const icdOptions = ref<ICD.ResICD[]>([])
+  const icdOptions = ref<ICD.StandardOption[]>([])
  function useMetaInfo() {
     const dialogVisible = ref(false)
     const titleType = ref('add')
@@ -209,7 +209,7 @@ const close = () => {
   }
   
   // 打开弹窗，可能是新增，也可能是编辑
-  const open = async (sign: string, data: DevType.ResPqDevType,icd: ICD.ResICD[],currentScene: string) => {
+  const open = async (sign: string, data: DevType.ResPqDevType,icd: ICD.StandardOption[],currentScene: string) => {
     // 重置表单
     dialogFormRef.value?.resetFields()
     titleType.value = sign

frontend/src/views/machine/devType/index.vue

@@ -41,8 +41,8 @@
     getDevTypeList,
     deleteDevType,
   } from '@/api/device/devType/index.ts'
-  import { onBeforeMount, reactive, ref } from 'vue'
+import { onBeforeMount, reactive, ref } from 'vue'
-  import { useModeStore, useAppSceneStore } from '@/stores/modules/mode'
+import { useModeStore, useAppSceneStore } from '@/stores/modules/mode'
 import { getICDAllList } from '@/api/device/icd'
 import type { ICD } from '@/api/device/interface/icd'
   
@@ -55,7 +55,7 @@ import type { ICD } from '@/api/device/interface/icd'
   // ProTable 实例
   const proTable = ref<ProTableInstance>()
   const devTypePopup = ref()
-  const icdOptions = ref<ICD.ResICD[]>([])
+  const icdOptions = ref<ICD.StandardOption[]>([])
   
   const getTableList = async (params: any) => {
     let newParams = JSON.parse(JSON.stringify(params))
@@ -156,17 +156,10 @@ import type { ICD } from '@/api/device/interface/icd'
 
 
   onBeforeMount(async () => {
-    const response = await getICDAllList({
+    const response = await getICDAllList()
-        id: '',
-        name: '',
-        path: '',
-        state: 1
-    })
     icdOptions.value = (response.data as ICD.ResICD[]).map(item => ({
       id: item.id,
-      name: item.name,
+      name: item.name
-      path: item.path,
-      state: item.state,
     }))
 })
   

frontend/src/views/machine/icd/components/icdForm.ts

@@ -0,0 +1,41 @@
+export const ICD_TYPE_OPTIONS = [
+  { value: 1, label: "标准ICD", disabled: false },
+  { value: 2, label: "非标准ICD", disabled: false },
+  { value: 3, label: "上游标准ICD", disabled: true },
+  { value: 4, label: "上游非标准ICD", disabled: true }
+] as const;
+
+export const ICD_REFERENCE_REQUIRED_TYPES = [2, 4] as const;
+
+export const extractIcdName = (fileName: string) =>
+  fileName.toLowerCase().endsWith(".icd") ? fileName.slice(0, -4) : fileName;
+
+export const formatIcdTypeLabel = (type: number | null | undefined) =>
+  ICD_TYPE_OPTIONS.find(item => item.value === type)?.label ?? "--";
+
+export const isValidJsonText = (value: string) => {
+  try {
+    JSON.parse(value);
+    return true;
+  } catch {
+    return false;
+  }
+};
+
+export const isValidXmlText = (value: string) => {
+  const parsed = new DOMParser().parseFromString(value, "application/xml");
+  return parsed.getElementsByTagName("parsererror").length === 0;
+};
+
+export const normalizeIcdSubmitPayload = <T extends {
+  result: number;
+  msg: string | null;
+  type: number;
+  referenceIcdId: string | null;
+}>(form: T) => ({
+  ...form,
+  msg: form.result === 1 ? null : form.msg,
+  referenceIcdId: ICD_REFERENCE_REQUIRED_TYPES.includes(form.type as (typeof ICD_REFERENCE_REQUIRED_TYPES)[number])
+    ? form.referenceIcdId
+    : null
+});

frontend/src/views/machine/icd/components/icdPopup.vue

@@ -1,252 +1,546 @@
 <template>
-    <!-- 基础信息弹出框 -->
+    <el-dialog
-    <el-dialog :model-value="dialogVisible" :title="dialogTitle" v-bind="dialogSmall" @close="close" align-center>
+        :model-value="dialogVisible"
-        <div>
+        :title="dialogTitle"
-            <el-form :model="formContent" label-position="right" label-width="80" ref="dialogFormRef" :rules="rules">
+        v-bind="dialogBig"
-                <el-form-item label="名称" prop="name">
+        class="icd-dialog"
-                    <el-input v-model="formContent.name" placeholder="请输入icd名称" maxlength="32" show-word-limit />
+        top="8vh"
+        @close="close"
+    >
+        <el-form
+            ref="dialogFormRef"
+            :model="formContent"
+            :rules="rules"
+            label-position="right"
+            label-width="auto"
+            class="form-three"
+        >
+            <div class="first-row">
+                <el-form-item label="名称" class="form-item-third">
+                    <el-input v-model="formContent.name" readonly disabled />
                 </el-form-item>
-                <el-form-item label="存储地址" prop="path">
+                <el-form-item label="icd原始文件" class="form-item-third">
-                    <el-input
+                    <div class="upload-field">
-                        v-model="formContent.path"
+                        <div class="upload-actions">
-                        placeholder="请输入icd存储地址"
-                        maxlength="32"
-                        show-word-limit
-                    />
-                </el-form-item>
-                <el-form-item label="映射文件" prop="mappingFile">
                             <el-upload
                                 action="#"
-                        :limit="1"
-                        :on-change='MappingHandleChange'
                                 :auto-upload="false"
-                        :file-list="mappingFileList"
+                                :show-file-list="false"
-                        :on-exceed="MappingHandleExceed"
+                                accept=".icd"
-                        :on-remove="MappingHandleRemove"
-                        style="width: 100% !important;"
-                        accept=".txt"
                                 class="upload-container"
+                                @change="handleIcdFileChange"
                             >
                                 <el-button type="primary">选择文件</el-button>
                             </el-upload>
-                    仅支持上传大小不超过1MB的.txt文件
+                            <div class="upload-file-name" :class="{ 'upload-file-name-empty': !displayIcdFileName }">
+                                {{ displayIcdFileName || '未选择文件' }}
+                            </div>
+                            <el-button v-if="displayIcdFileName" link type="primary" @click="handleIcdFileRemove">
+                                清空
+                            </el-button>
+                        </div>
+                        <div class="form-tip">仅支持 .icd（≤5MB）</div>
+                    </div>
                 </el-form-item>
-                <el-form-item label="是否支持电压相角、电流相角指标" prop="angle" label-width="auto">
+            </div>
-                    <el-switch
+            <el-form-item label="支持相角" prop="angle" class="form-item-third">
-                        v-model="formContent.angle"
+                <el-switch v-model="formContent.angle" :active-value="1" :inactive-value="0" />
-                        :active-value="1"
+            </el-form-item>
-                        :inactive-value="0"
+            <el-form-item label="使用相别指标" prop="usePhaseIndex" class="form-item-third">
-                        inline-prompt
+                <el-switch v-model="formContent.usePhaseIndex" :active-value="1" :inactive-value="0" />
-                        active-text="是"
+            </el-form-item>
-                        inactive-text="否"
+            <div class="type-row">
+                <el-form-item label="类型" prop="type" class="form-item-third form-item-type">
+                    <el-select v-model="formContent.type" placeholder="请选择类型">
+                        <el-option
+                            v-for="item in ICD_TYPE_OPTIONS"
+                            :key="item.value"
+                            :label="item.label"
+                            :value="item.value"
+                            :disabled="item.disabled"
+                        />
+                    </el-select>
+                </el-form-item>
+                <div class="type-row-spacer" />
+                <el-form-item
+                    v-if="shouldShowReferenceIcd"
+                    label="引用标准ICD"
+                    prop="referenceIcdId"
+                    class="form-item-type-reference"
+                >
+                    <el-select v-model="formContent.referenceIcdId" filterable clearable placeholder="请选择标准ICD">
+                        <el-option
+                            v-for="item in visibleStandardOptions"
+                            :key="item.id"
+                            :label="item.name"
+                            :value="item.id"
+                        />
+                    </el-select>
+                </el-form-item>
+            </div>
+            <div class="result-row">
+                <el-form-item label="结论" prop="result" class="form-item-third form-item-result">
+                    <el-switch v-model="formContent.result" :active-value="1" :inactive-value="0" />
+                </el-form-item>
+                <el-form-item
+                    label="描述"
+                    prop="msg"
+                    class="form-item-result-msg"
+                    :class="{ 'form-item-result-msg-hidden': formContent.result === 1 }"
+                >
+                    <el-input
+                        v-model="formContent.msg"
+                        type="textarea"
+                        :rows="3"
+                        maxlength="1024"
+                        :disabled="formContent.result === 1"
                     />
                 </el-form-item>
-                <el-form-item label="角型接线时是否使用相别的指标来进行检测" prop="usePhaseIndex" label-width="auto">
+            </div>
-                    <el-switch
+            <el-form-item label="JSON内容" prop="jsonStr" class="form-item-full">
-                        v-model="formContent.usePhaseIndex"
+                <el-input v-model="formContent.jsonStr" type="textarea" :rows="3" />
-                        :active-value="1"
+            </el-form-item>
-                        :inactive-value="0"
+            <el-form-item label="XML内容" prop="xmlStr" class="form-item-full">
-                        inline-prompt
+                <el-input v-model="formContent.xmlStr" type="textarea" :rows="3" />
-                        active-text="是"
-                        inactive-text="否"
-                    />
             </el-form-item>
         </el-form>
-        </div>
         <template #footer>
             <div class="dialog-footer">
-                <el-button @click="close()">取消</el-button>
+                <el-button @click="close">取消</el-button>
-                <el-button type="primary" @click="save()">保存</el-button>
+                <el-button type="primary" @click="save">保存</el-button>
             </div>
         </template>
     </el-dialog>
 </template>
 
 <script lang="ts" setup>
-import { ElMessage, UploadFile, type FormInstance, type FormItemRule } from 'element-plus'
+import { computed, nextTick, ref, watch, type Ref } from 'vue'
-import { computed, ref, Ref } from 'vue'
+import { ElMessage, type FormInstance, type FormItemRule, type UploadFile, type UploadUserFile } from 'element-plus'
-import { type ICD } from '@/api/device/interface/icd'
+import type { ICD } from '@/api/device/interface/icd'
-import { dialogSmall } from '@/utils/elementBind'
+import { dialogBig } from '@/utils/elementBind'
-import { useDictStore } from '@/stores/modules/dict'
+import { addICD, getICDById, getStandardICDList, updateICD } from '@/api/device/icd'
-import { addICD, updateICD } from '@/api/device/icd'
+import {
+    ICD_TYPE_OPTIONS,
+    ICD_REFERENCE_REQUIRED_TYPES,
+    extractIcdName,
+    isValidJsonText,
+    isValidXmlText,
+    normalizeIcdSubmitPayload
+} from './icdForm'
 
-const dictStore = useDictStore()
-// 定义弹出组件元信息
-const dialogFormRef = ref()
-const mappingFileName = ref('')
-const mappingFileUrl = ref('')
-let excelFormData = new FormData()
-
-
-const mappingFileList = computed(() => {
-  if (mappingFileName.value && mappingFileUrl.value) {
-    return [{name: mappingFileName.value, url: mappingFileUrl.value}];
-  }
-  return [];
-});
-function useMetaInfo() {
-    const dialogVisible = ref(false)
-    const titleType = ref('add')
-    const formContent = ref<ICD.ResICD>({
-        id: '',
-        name: '',
-        path: '',
-        state: 1,
-        angle: 0,
-        usePhaseIndex: 0,
-        mappingFile: ''
-    })
-    return { dialogVisible, titleType, formContent }
-}
-
-const { dialogVisible, titleType, formContent } = useMetaInfo()
-
-// 清空formContent
-const resetFormContent = () => {
-    formContent.value = {
-        id: '',
-        name: '',
-        path: '',
-        state: 1,
-        angle: 0,
-        usePhaseIndex: 0,
-        mappingFile: ''
-    }
-}
-
-let dialogTitle = computed(() => {
-    return titleType.value === 'add' ? '新增ICD' : '编辑ICD'
-})
-
-//定义规则
-const formRuleRef = ref<FormInstance>()
-//定义校验规则
-const rules: Ref<Record<string, Array<FormItemRule>>> = ref({
-    name: [{ required: true, message: 'icd名称必填！', trigger: 'blur' }],
-    path: [{ required: true, message: 'icd存储地址必填！', trigger: 'blur' }],
-    mappingFile: [{required: true, message: '请上传映射文件', trigger: 'change'}],
-})
-
-// 关闭弹窗
-const close = () => {
-    excelFormData = new FormData()
-    dialogVisible.value = false
-    // 清空dialogForm中的值
-    resetFormContent()
-    // 重置表单
-    dialogFormRef.value?.resetFields()
-}
-
-// 保存数据
-const save = () => {
-    try {
-        dialogFormRef.value?.validate(async (valid: boolean) => {
-            if (valid) {
-                // 清空 excelFormData
-                excelFormData.delete('name')
-                excelFormData.delete('path')
-                excelFormData.delete('angle')
-                excelFormData.delete('usePhaseIndex')
-
-                excelFormData.append('name', formContent.value.name)
-                excelFormData.append('path', formContent.value.path)
-                excelFormData.append('angle', formContent.value.angle)
-                excelFormData.append('usePhaseIndex', formContent.value.usePhaseIndex)
-
-                let baseFileFlag = handleFileLimit(excelFormData.get('mappingFile') as File)
-                if (!baseFileFlag) {
-                    return
-                }
-
-                if (formContent.value.id) {
-                     excelFormData.append('id', formContent.value.id)
-                    await updateICD(excelFormData)
-                } else {
-                    await addICD(excelFormData)
-                }
-                ElMessage.success({ message: `${dialogTitle.value}成功！` })
-                close()
-                // 刷新表格
-                await props.refreshTable!()
-            }
-        })
-    } catch (err) {
-        //error('验证过程中出现错误', err)
-    }
-}
-
-// 打开弹窗，可能是新增，也可能是编辑
-const open = async (sign: string, data: ICD.ResICD) => {
-    // 重置表单
-    dialogFormRef.value?.resetFields()
-    titleType.value = sign
-    dialogVisible.value = true
-
-    if (data.id) {
-        formContent.value = { ...data }
-        formContent.value.id = data.id
-        // 文件信息回显
-        if (data.mappingFile) {
-            mappingFileName.value = data.mappingFile.name
-            mappingFileUrl.value = data.mappingFile.url
-            // 模拟文件列表显示
-            formContent.value.mappingFile = data.mappingFile.name
-        }
-      
-
-    } else {
-        mappingFileName.value = ''
-        mappingFileUrl.value = ''
-        resetFormContent()
-        // 清空 excelFormData
-        excelFormData = new FormData();
-    }
-}
-
-const MappingHandleChange = async (param: UploadFile) => {
-  mappingFileName.value = param.name;
-  mappingFileUrl.value = URL.createObjectURL(param.raw as Blob);
-  excelFormData.append('mappingFile', param.raw as Blob, param.name);
-
-  formContent.value.mappingFile = param.name;
-};
-
-const MappingHandleRemove = () => {
-  excelFormData.delete('mappingFile');
-  formContent.value.mappingFile = ''
-};
-
-const MappingHandleExceed = (files: File[]) => {
-  // 移除旧文件
-  excelFormData.delete('mappingFile');
-  // 添加新文件
-  if (files.length > 0) {
-    const newFile = files[0] as unknown as UploadFile;
-    mappingFileName.value = newFile.name;
-    excelFormData.append('mappingFile', newFile as Blob, newFile.name);
-
-    formContent.value.mappingFile = newFile.name
-  }
-
-};
-
-const fileSizeLimit = 1 * 1024 * 1024; // 1MB
-
-const handleFileLimit = (file: File) => {
-  if (file) {
-    if (file.size > fileSizeLimit) {
-      ElMessage.error({message: `文件大小不能超过${fileSizeLimit / 1024 / 1024}MB`});
-      return false;
-    } else {
-      return true;
-    }
-  }
-  return true;
-}
-
-// 对外映射
-defineExpose({ open })
 const props = defineProps<{
     refreshTable: (() => Promise<void>) | undefined
 }>()
+
+const dialogFormRef = ref<FormInstance>()
+const dialogVisible = ref(false)
+const titleType = ref<'add' | 'edit'>('add')
+const standardIcdOptions = ref<ICD.StandardOption[]>([])
+const selectedIcdFile = ref<File | null>(null)
+const icdFileList = ref<UploadUserFile[]>([])
+const originalName = ref('')
+const MAX_ICD_FILE_SIZE = 5 * 1024 * 1024
+
+const createDefaultForm = (): ICD.ResICD => ({
+    id: '',
+    name: '',
+    state: 1,
+    angle: 0,
+    usePhaseIndex: 0,
+    jsonStr: '',
+    xmlStr: '',
+    result: 1,
+    msg: null,
+    type: 1,
+    referenceIcdId: null,
+    referenceIcdName: null,
+    hasIcdFile: false
+})
+
+const formContent = ref<ICD.ResICD>(createDefaultForm())
+
+const dialogTitle = computed(() => (titleType.value === 'add' ? '新增ICD' : '编辑ICD'))
+
+const shouldShowReferenceIcd = computed(() =>
+    ICD_REFERENCE_REQUIRED_TYPES.includes(formContent.value.type as (typeof ICD_REFERENCE_REQUIRED_TYPES)[number])
+)
+
+const visibleStandardOptions = computed(() => {
+    return standardIcdOptions.value.filter(item => item.id !== formContent.value.id)
+})
+
+const currentReferenceName = computed(() => {
+    if (!formContent.value.referenceIcdId) {
+        return ''
+    }
+    return visibleStandardOptions.value.find(item => item.id === formContent.value.referenceIcdId)?.name ?? ''
+})
+
+const displayIcdFileName = computed(() => {
+    if (selectedIcdFile.value?.name) {
+        return selectedIcdFile.value.name
+    }
+    if (titleType.value === 'edit' && formContent.value.hasIcdFile && formContent.value.name) {
+        return `${formContent.value.name}.icd`
+    }
+    return ''
+})
+
+watch(
+    () => formContent.value.result,
+    value => {
+        if (value === 1) {
+            formContent.value.msg = null
+            dialogFormRef.value?.clearValidate(['msg'])
+        }
+    }
+)
+
+watch(
+    () => formContent.value.type,
+    value => {
+        if (!ICD_REFERENCE_REQUIRED_TYPES.includes(value as (typeof ICD_REFERENCE_REQUIRED_TYPES)[number])) {
+            formContent.value.referenceIcdId = null
+            dialogFormRef.value?.clearValidate(['referenceIcdId'])
+        }
+    }
+)
+
+const rules: Ref<Record<string, Array<FormItemRule>>> = ref({
+    type: [{ required: true, message: '请选择ICD类型', trigger: 'change' }],
+    result: [{ required: true, message: '请选择结论', trigger: 'change' }],
+    msg: [
+        {
+            validator: (_rule, value, callback) => {
+                if (formContent.value.result === 0 && !String(value ?? '').trim()) {
+                    callback(new Error('当结论为否时，描述必填'))
+                    return
+                }
+                callback()
+            },
+            trigger: 'blur'
+        }
+    ],
+    referenceIcdId: [
+        {
+            validator: (_rule, value, callback) => {
+                if (shouldShowReferenceIcd.value && !String(value ?? '').trim()) {
+                    callback(new Error('非标准ICD必须选择标准ICD'))
+                    return
+                }
+                callback()
+            },
+            trigger: 'change'
+        }
+    ],
+    jsonStr: [
+        { required: true, message: 'JSON内容必填', trigger: 'blur' },
+        {
+            validator: (_rule, value, callback) => {
+                if (!isValidJsonText(String(value ?? ''))) {
+                    callback(new Error('JSON格式不正确'))
+                    return
+                }
+                callback()
+            },
+            trigger: 'blur'
+        }
+    ],
+    xmlStr: [
+        { required: true, message: 'XML内容必填', trigger: 'blur' },
+        {
+            validator: (_rule, value, callback) => {
+                if (!isValidXmlText(String(value ?? ''))) {
+                    callback(new Error('XML格式不正确'))
+                    return
+                }
+                callback()
+            },
+            trigger: 'blur'
+        }
+    ]
+})
+
+const resetForm = () => {
+    formContent.value = createDefaultForm()
+    standardIcdOptions.value = []
+    selectedIcdFile.value = null
+    icdFileList.value = []
+    originalName.value = ''
+}
+
+const close = () => {
+    dialogVisible.value = false
+    dialogFormRef.value?.resetFields()
+    resetForm()
+}
+
+const handleIcdFileChange = (file: UploadFile) => {
+    const rawFile = file.raw as File | undefined
+    if (!rawFile) {
+        return
+    }
+    if (!file.name.toLowerCase().endsWith('.icd')) {
+        ElMessage.error('仅支持上传 .icd 文件')
+        icdFileList.value = []
+        selectedIcdFile.value = null
+        formContent.value.name = titleType.value === 'edit' ? originalName.value : ''
+        return
+    }
+    if (rawFile.size > MAX_ICD_FILE_SIZE) {
+        ElMessage.error('仅支持上传 5MB 以内的 .icd 文件')
+        icdFileList.value = []
+        selectedIcdFile.value = null
+        formContent.value.name = titleType.value === 'edit' ? originalName.value : ''
+        return
+    }
+    selectedIcdFile.value = rawFile
+    icdFileList.value = [{ name: file.name }]
+    formContent.value.name = extractIcdName(file.name)
+}
+
+const handleIcdFileRemove = () => {
+    selectedIcdFile.value = null
+    icdFileList.value = []
+    formContent.value.name = titleType.value === 'edit' ? originalName.value : ''
+}
+
+const ensureIcdFile = () => {
+    const hasCurrentFile = titleType.value === 'edit' && !!formContent.value.hasIcdFile
+    if (!selectedIcdFile.value && !hasCurrentFile) {
+        ElMessage.warning('请上传 .icd 原始文件')
+        return false
+    }
+    return true
+}
+
+const save = async () => {
+    if (!ensureIcdFile()) {
+        return
+    }
+    await dialogFormRef.value?.validate()
+
+    const normalized = normalizeIcdSubmitPayload({
+        ...formContent.value,
+        msg: formContent.value.msg ?? null,
+        referenceIcdId: formContent.value.referenceIcdId ?? null
+    })
+
+    const payload = new FormData()
+    if (normalized.id) {
+        payload.append('id', normalized.id)
+    }
+    payload.append('angle', String(normalized.angle ?? 0))
+    payload.append('usePhaseIndex', String(normalized.usePhaseIndex ?? 0))
+    payload.append('jsonStr', normalized.jsonStr)
+    payload.append('xmlStr', normalized.xmlStr)
+    payload.append('result', String(normalized.result))
+    payload.append('msg', normalized.msg ?? '')
+    payload.append('type', String(normalized.type))
+    payload.append('referenceIcdId', normalized.referenceIcdId ?? '')
+    if (selectedIcdFile.value) {
+        payload.append('icdFile', selectedIcdFile.value, selectedIcdFile.value.name)
+    }
+
+    if (normalized.id) {
+        await updateICD(payload)
+    } else {
+        await addICD(payload)
+    }
+
+    ElMessage.success(`${dialogTitle.value}成功`)
+    close()
+    await props.refreshTable?.()
+}
+
+const open = async (sign: 'add' | 'edit', data: Partial<ICD.ResICD> = {}) => {
+    titleType.value = sign
+    dialogVisible.value = true
+    resetForm()
+    await nextTick()
+    dialogFormRef.value?.clearValidate()
+
+    const standardPromise = getStandardICDList()
+    const detailPromise = data.id ? getICDById(data.id) : Promise.resolve(null)
+    const [standardResult, detailResult] = await Promise.all([standardPromise, detailPromise])
+
+    standardIcdOptions.value = standardResult.data || []
+    if (detailResult?.data) {
+        formContent.value = {
+            ...createDefaultForm(),
+            ...detailResult.data,
+            msg: detailResult.data.msg ?? null,
+            referenceIcdId: detailResult.data.referenceIcdId ?? null,
+            referenceIcdName: detailResult.data.referenceIcdName ?? null,
+            hasIcdFile: Boolean(detailResult.data.hasIcdFile)
+        }
+        originalName.value = formContent.value.name
+    }
+
+    await nextTick()
+    dialogFormRef.value?.clearValidate()
+}
+
+defineExpose({ open })
 </script>
+
+<style scoped>
+.icd-dialog :deep(.el-dialog__body) {
+    flex: 1;
+    min-height: 0;
+    overflow-y: auto;
+    box-sizing: border-box;
+}
+
+.icd-dialog :deep(.el-dialog) {
+    height: 720px;
+    display: flex;
+    flex-direction: column;
+}
+
+.form-three {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+    width: 100%;
+}
+
+.first-row {
+    display: flex;
+    align-items: flex-start;
+    justify-content: space-between;
+    width: 100%;
+}
+
+.form-three :deep(.el-form-item) {
+    min-width: 0;
+}
+
+.form-three :deep(.el-form-item.form-item-third) {
+    width: 32.3% !important;
+}
+
+.form-three :deep(.el-form-item__content) {
+    min-width: 0;
+}
+
+.form-three :deep(.el-input),
+.form-three :deep(.el-select) {
+    width: 100%;
+}
+
+.form-item-full {
+    width: 100% !important;
+}
+
+.type-row {
+    display: flex;
+    align-items: flex-start;
+    justify-content: space-between;
+    width: 100%;
+    min-height: 88px;
+}
+
+.type-row :deep(.form-item-type) {
+    width: 32.3% !important;
+    margin-bottom: 18px;
+}
+
+.type-row :deep(.form-item-type-reference) {
+    width: 32.3% !important;
+    margin-bottom: 18px;
+}
+
+.type-row-spacer {
+    width: 32.3%;
+}
+
+.type-reference-note {
+    display: flex;
+    align-items: center;
+    min-height: 32px;
+    width: 100%;
+    padding: 0 14px;
+    border: 1px solid #dcdfe6;
+    border-radius: 4px;
+    background-color: #f5f7fa;
+    color: #909399;
+    font-size: 13px;
+    line-height: 1.5;
+    box-sizing: border-box;
+}
+
+.result-row {
+    display: flex;
+    align-items: flex-start;
+    justify-content: space-between;
+    width: 100%;
+    min-height: 110px;
+}
+
+.result-row :deep(.form-item-result) {
+    width: 32.3% !important;
+    margin-bottom: 18px;
+}
+
+.result-row :deep(.form-item-result .el-form-item__content) {
+    display: flex;
+    align-items: center;
+    min-height: 32px;
+}
+
+.result-row :deep(.form-item-result-msg) {
+    width: 66% !important;
+}
+
+.result-row :deep(.form-item-result-msg-hidden) {
+    visibility: hidden;
+    pointer-events: none;
+}
+
+.upload-container {
+    flex: none;
+}
+
+.upload-field {
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    gap: 6px;
+    width: 100%;
+    min-width: 0;
+    min-height: 60px;
+}
+
+.upload-actions {
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    min-height: 32px;
+    width: 100%;
+    min-width: 0;
+}
+
+.upload-file-name {
+    flex: 1;
+    min-width: 0;
+    color: var(--el-text-color-regular);
+    line-height: 32px;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.upload-file-name-empty {
+    color: var(--el-text-color-placeholder);
+}
+
+.form-tip {
+    color: var(--el-text-color-secondary);
+    font-size: 12px;
+    line-height: 1.4;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+</style>

frontend/src/views/machine/icd/index.vue

@@ -1,122 +1,137 @@
 <template>
-    <div class='table-box' ref='popupBaseView'>
+    <div class="table-box">
-      <ProTable
+        <ProTable ref="proTable" :columns="columns" :request-api="getTableList">
-        ref='proTable'
+            <template #tableHeader>
-        :columns='columns'
+                <el-button v-auth.devType="'add'" type="primary" :icon="CirclePlus" @click="openDialog('add')">
-        :request-api='getTableList'
+                    新增
+                </el-button>
+            </template>
+            <template #operation="scope">
+                <el-button
+                    v-auth.devType="'edit'"
+                    type="primary"
+                    link
+                    :icon="EditPen"
+                    @click="openDialog('edit', scope.row)"
+                >
+                    编辑
+                </el-button>
+                <el-button
+                    v-auth.devType="'delete'"
+                    type="primary"
+                    link
+                    :icon="Delete"
+                    @click="handleDelete(scope.row)"
                 >
-        <!-- :requestApi="getRoleList" -->
-        <!-- 表格 header 按钮 -->
-        <template #tableHeader='scope'>
-          <el-button v-auth.devType="'add'" type='primary' :icon='CirclePlus' @click="openDialog('add')">新增</el-button>
-          <el-button v-auth.devType="'delete'" type='danger' :icon='Delete' plain :disabled='!scope.isSelected'
-                     @click='batchDelete(scope.selectedListIds)'>
                     删除
                 </el-button>
+                <el-button type="primary" link :icon="Download" @click="handleExport(scope.row)">导出</el-button>
             </template>
-        <!-- 表格操作 -->
-        <template #operation='scope'>
-          <el-button v-auth.devType="'edit'" type='primary' link :icon='EditPen' :model-value='false'
-                     @click="openDialog('edit', scope.row)">编辑
-          </el-button>
-          <el-button v-auth.devType="'delete'" type='primary' link :icon='Delete' @click='handleDelete(scope.row)'>删除
-          </el-button>
-        </template>
-  
         </ProTable>
     </div>
-    <IcdPopup :refresh-table='proTable?.getTableList' ref='icdPopup' />
+    <IcdPopup ref="icdPopup" :refresh-table="proTable?.getTableList" />
-  </template>
+</template>
 
-  <script setup lang='tsx' name='useRole'>
+<script setup lang="tsx" name="useIcd">
-  import { type ICD } from '@/api/device/interface/icd'
+import { reactive, ref } from 'vue'
-  import { useHandleData } from '@/hooks/useHandleData'
+import { CirclePlus, Delete, Download, EditPen } from '@element-plus/icons-vue'
-  import ProTable from '@/components/ProTable/index.vue'
+import type { ICD } from '@/api/device/interface/icd'
-  import { type ProTableInstance, type ColumnProps } from '@/components/ProTable/interface'
+import ProTable from '@/components/ProTable/index.vue'
-  import { CirclePlus, Delete, EditPen, Download, Upload } from '@element-plus/icons-vue'
+import type { ColumnProps, ProTableInstance } from '@/components/ProTable/interface'
-  import {
+import { useHandleData } from '@/hooks/useHandleData'
-    getICDList,
+import { useDownloadWithServerFileName } from '@/hooks/useDownload'
-    deleteICD,
+import { deleteICD, exportICD, getICDList } from '@/api/device/icd'
-  } from '@/api/device/icd/index.ts'
+import { formatIcdTypeLabel, ICD_TYPE_OPTIONS } from './components/icdForm'
-  import { reactive, ref } from 'vue'
+import IcdPopup from './components/icdPopup.vue'
 
-  defineOptions({
+defineOptions({
-    name: 'devType',
+    name: 'icd'
-  })
+})
 
-  // ProTable 实例
+const proTable = ref<ProTableInstance>()
-  const proTable = ref<ProTableInstance>()
+const icdPopup = ref<InstanceType<typeof IcdPopup>>()
-  const icdPopup = ref()
 
+const getTableList = async (params: ICD.ReqICDParams) => {
+    return getICDList({ ...params })
+}
 
-  const getTableList = async (params: any) => {
+const formatDateTime = (value?: string | null) => {
-    let newParams = JSON.parse(JSON.stringify(params))
+    if (!value) {
-    return getICDList(newParams)
+        return '--'
     }
+    const date = new Date(value)
+    if (Number.isNaN(date.getTime())) {
+        return value
+    }
+    const year = date.getFullYear()
+    const month = String(date.getMonth() + 1).padStart(2, '0')
+    const day = String(date.getDate()).padStart(2, '0')
+    const hours = String(date.getHours()).padStart(2, '0')
+    const minutes = String(date.getMinutes()).padStart(2, '0')
+    const seconds = String(date.getSeconds()).padStart(2, '0')
+    return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
+}
 
-  
+const columns = reactive<ColumnProps<ICD.ResICD>[]>([
-  // 表格配置项
-  const columns = reactive<ColumnProps<ICD.ResICD>[]>([
-    { type: 'selection', fixed: 'left', width: 70 },
     { type: 'index', fixed: 'left', width: 70, label: '序号' },
     {
         prop: 'name',
         label: '名称',
-      search: { el: 'input' },
+        minWidth: 180,
+        search: { el: 'input' }
     },
     {
-      prop: 'path',
+        prop: 'type',
-      label: '存储地址',
+        label: '类型',
-  
+        minWidth: 180,
-    },
+        enum: ICD_TYPE_OPTIONS,
-    {
+        fieldNames: { label: 'label', value: 'value' },
-      prop: 'mappingFile',
+        search: {
-      label: '映射文件路径',
+            el: 'select',
-      minWidth: 150,
+            props: {
-      render: scope => {
+                clearable: true,
-        return scope.row.mappingFile.url
+                filterable: true
             }
         },
+        render: scope => formatIcdTypeLabel(scope.row.type)
+    },
+    {
+        prop: 'result',
+        label: '结论',
+        width: 100,
+        render: scope => (scope.row.result === 1 ? '是' : '否')
+    },
+    {
+        prop: 'msg',
+        label: '描述',
+        minWidth: 220,
+        render: scope => scope.row.msg || '--'
+    },
+    {
+        prop: 'referenceIcdName',
+        label: '引用标准ICD',
+        minWidth: 180,
+        render: scope => scope.row.referenceIcdName || '--'
+    },
     {
         prop: 'createTime',
         label: '创建时间',
-      render: scope => {
+        width: 180,
-        if (scope.row.createTime) {
+        render: scope => formatDateTime(scope.row.createTime)
-        const date = new Date(scope.row.createTime);
-        const year = date.getFullYear();
-        const month = String(date.getMonth() + 1).padStart(2, '0');
-        const day = String(date.getDate()).padStart(2, '0');
-        const hours = String(date.getHours()).padStart(2, '0');
-        const minutes = String(date.getMinutes()).padStart(2, '0');
-        const seconds = String(date.getSeconds()).padStart(2, '0');
-        return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
-      }
-      return '';
-      }
     },
-    { prop: 'operation', label: '操作', fixed: 'right', width: 200 },
+    { prop: 'operation', label: '操作', fixed: 'right', width: 220 }
-  ])
+])
 
-  
+const openDialog = (titleType: 'add' | 'edit', row: Partial<ICD.ResICD> = {}) => {
-  // 打开 drawer(新增、编辑)
-  const openDialog = (titleType: string, row: Partial<ICD.ResICD> = {}) => {
     icdPopup.value?.open(titleType, row)
-  }
+}
 
-  
+const handleDelete = async (row: ICD.ResICD) => {
-  // 批量删除icd
+    await useHandleData(deleteICD, [row.id], `删除【${row.name}】ICD`)
-  const batchDelete = async (id: string[]) => {
-    await useHandleData(deleteICD, id, '删除所选icd')
-    proTable.value?.clearSelection()
     proTable.value?.getTableList()
-  }
+}
-  
-  // 删除设备icd
-  const handleDelete = async (params: ICD.ResICD) => {
-    await useHandleData(deleteICD,  [params.id] , `删除【${params.name}】icd`)
-    proTable.value?.getTableList()
-    
-  }
-  
-  </script>
 
+const handleExport = async (row: ICD.ResICD) => {
+    await useDownloadWithServerFileName(() => exportICD(row.id), row.name, {}, false, '.zip')
+}
+</script>