From 4adc28a055d8565562e102cf626807df004b9f0e Mon Sep 17 00:00:00 2001
From: sjl <1716605279@qq.com>
Date: Tue, 11 Feb 2025 10:40:34 +0800
Subject: [PATCH] =?UTF-8?q?=E8=AE=BE=E5=A4=87=E7=B1=BB=E5=9E=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/api/device/devType/index.ts      |  29 +++
 frontend/src/api/device/icd/index.ts          |  38 +++
 frontend/src/api/device/interface/devType.ts  |  40 ++++
 frontend/src/api/device/interface/icd.ts      |  35 +++
 .../devType/components/devTypePopup.vue       | 222 ++++++++++++++++++
 frontend/src/views/machine/devType/index.vue  | 148 ++++++++++++
 .../machine/device/components/devicePopup.vue |   6 +-
 7 files changed, 516 insertions(+), 2 deletions(-)
 create mode 100644 frontend/src/api/device/devType/index.ts
 create mode 100644 frontend/src/api/device/icd/index.ts
 create mode 100644 frontend/src/api/device/interface/devType.ts
 create mode 100644 frontend/src/api/device/interface/icd.ts
 create mode 100644 frontend/src/views/machine/devType/components/devTypePopup.vue
 create mode 100644 frontend/src/views/machine/devType/index.vue

diff --git a/frontend/src/api/device/devType/index.ts b/frontend/src/api/device/devType/index.ts
new file mode 100644
index 0000000..38d1116
--- /dev/null
+++ b/frontend/src/api/device/devType/index.ts
@@ -0,0 +1,29 @@
+import type { DevType } from '@/api/device/interface/devType'
+import http from '@/api'
+
+/**
+ * @name 设备类型管理模块
+ */
+
+//获取设备类型
+export const getDevTypeList = (params: DevType.ReqPqDevTypeParams) => {
+  return http.post(`/devType/list`, params)
+}
+
+//添加设备类型
+export const addDevType = (params: DevType.ResPqDevType) => {
+    return http.post(`/devType/add`, params)
+  }
+  
+  //编辑设备类型
+  export const updateDevType = (params: DevType.ResPqDevType) => {
+    return http.post(`/devType/update`, params)
+  }
+  
+  //删除设备类型
+  export const deleteDevType = (params: string[]) => {
+    return http.post(`/devType/delete`, params)
+  }
+
+
+
diff --git a/frontend/src/api/device/icd/index.ts b/frontend/src/api/device/icd/index.ts
new file mode 100644
index 0000000..e15caa6
--- /dev/null
+++ b/frontend/src/api/device/icd/index.ts
@@ -0,0 +1,38 @@
+import type { ICD } from '@/api/device/interface/icd'
+import http from '@/api'
+import { pa } from 'element-plus/es/locale/index.mjs'
+
+/**
+ * @name ICD管理模块
+ */
+
+
+
+//获取ICD分页
+export const getICDList = (params: ICD.ReqICDParams) => {
+    return http.get(`/icd/listAll`,params)
+}
+
+
+//获取ICD
+export const getICDAllList = (params: ICD.ResICD) => {
+    return http.get(`/icd/listAll`,params)
+}
+
+//添加ICD
+export const addICD = (params: ICD.ResICD) => {
+    return http.post(`/icd/add`, params)
+  }
+  
+  //编辑ICD
+  export const updateICD = (params: ICD.ResICD) => {
+    return http.post(`/icd/update`, params)
+  }
+  
+  //删除ICD
+  export const deleteICD = (params: string[]) => {
+    return http.post(`/icd/delete`, params)
+  }
+
+
+
diff --git a/frontend/src/api/device/interface/devType.ts b/frontend/src/api/device/interface/devType.ts
new file mode 100644
index 0000000..ce9f635
--- /dev/null
+++ b/frontend/src/api/device/interface/devType.ts
@@ -0,0 +1,40 @@
+import type { ReqPage, ResPage } from '@/api/interface'
+
+// 设备类型模块
+export namespace DevType {
+
+  /**
+   * 设备类型数据表格分页查询参数
+   */
+  export interface ReqPqDevTypeParams extends ReqPage {
+    id: string; // 装置序号id 必填
+    devType?: string; // 设备名称
+    createTime?: string; //创建时间
+  }
+
+  /**
+   * 设备类型新增、修改、根据id查询返回的对象
+   */
+  export interface ResPqDevType {
+    id: string;     //设备类型ID
+    name: string;//设备类型名称
+    icd: string| null;//设备关联的ICD
+    power: string| null;//工作电源
+    devVolt: number;   //额定电压（V）
+    devCurr: number;   //额定电流（A）
+    devChns: number;   //设备通道数
+    reportName: string| null;//报告模版名称
+    state: number;
+    createBy?: string| null; //创建用户
+    createTime?: string| null; //创建时间
+    updateBy?: string| null; //更新用户
+    updateTime?: string| null; //更新时间
+  }
+
+  /**
+   * 设备类型表格查询分页返回的对象；
+   */
+  export interface ResPqDevTypePage extends ResPage<ResPqDevType> {
+
+  }
+}
\ No newline at end of file
diff --git a/frontend/src/api/device/interface/icd.ts b/frontend/src/api/device/interface/icd.ts
new file mode 100644
index 0000000..933d9d4
--- /dev/null
+++ b/frontend/src/api/device/interface/icd.ts
@@ -0,0 +1,35 @@
+import type { ReqPage, ResPage } from '@/api/interface'
+
+// ICD模块
+export namespace ICD {
+
+  /**
+   * ICD表格分页查询参数
+   */
+  export interface ReqICDParams extends ReqPage {
+    id: string; // 装置序号id 必填
+    devType?: string; // 设备名称
+    createTime?: string; //创建时间
+  }
+
+  /**
+   * ICD新增、修改、根据id查询返回的对象
+   */
+  export interface ResICD {
+    id: string;     //icdID
+    name: string;//icd名称
+    path: string;//icd存储地址
+    state: number;
+    createBy?: string| null; //创建用户
+    createTime?: string| null; //创建时间
+    updateBy?: string| null; //更新用户
+    updateTime?: string| null; //更新时间
+  }
+
+  /**
+   * ICD表格查询分页返回的对象；
+   */
+  export interface ResICDPage extends ResPage<ResICD> {
+
+  }
+}
\ No newline at end of file
diff --git a/frontend/src/views/machine/devType/components/devTypePopup.vue b/frontend/src/views/machine/devType/components/devTypePopup.vue
new file mode 100644
index 0000000..cb1e28a
--- /dev/null
+++ b/frontend/src/views/machine/devType/components/devTypePopup.vue
@@ -0,0 +1,222 @@
+<template>
+    <!-- 基础信息弹出框 -->
+  <el-dialog :model-value="dialogVisible" :title="dialogTitle" v-bind="dialogSmall" @close="close" >
+    <div>
+        <el-form :model="formContent"  ref='dialogFormRef' :rules='rules' >
+            <el-form-item label="名称" prop="name" >
+                <el-input v-model='formContent.name' placeholder="请输入设备类型名称"/>
+            </el-form-item>
+            <el-form-item label="工作电源" prop="power" >
+                <el-select v-model="formContent.power"  clearable placeholder="请选择工作电源">
+                    <el-option
+                        v-for="item in dictStore.getDictData('Dev_Power')"
+                        :key="item.code"
+                        :label="item.name"
+                        :value="item.code"
+                    />
+                </el-select>
+            </el-form-item>    
+            <el-form-item label="通道数" prop="devChns" >
+                <el-select v-model="formContent.devChns"  clearable placeholder="请选择设备通道数">
+                    <el-option
+                        v-for="item in dictStore.getDictData('Dev_Chns')"
+                        :key="item.id"
+                        :label="item.name"
+                        :value="item.code"
+                    />
+                </el-select>
+            </el-form-item>            
+            <el-form-item label="额定电压(V)" prop="devVolt" >
+                <el-select v-model="formContent.devVolt"  clearable placeholder="请选择额定电压">
+                    <el-option
+                        v-for="item in dictStore.getDictData('Dev_Volt')"
+                        :key="item.id"
+                        :label="item.name"
+                        :value="item.code"
+                    />
+                </el-select>
+            </el-form-item>           
+            <el-form-item label="额定电流(A)" prop="devCurr" >
+                <el-select v-model="formContent.devCurr"  clearable placeholder="请选择额定电流">
+                    <el-option
+                        v-for="item in dictStore.getDictData('Dev_Curr')"
+                        :key="item.id"
+                        :label="item.name"
+                        :value="item.code"
+                    />
+                </el-select>
+            </el-form-item> 
+            <el-form-item label="报告模版名称" prop="reportName" >
+                <el-select v-model="formContent.reportName"  clearable placeholder="请选择报告模版">
+                    <el-option
+                        v-for="item in dictStore.getDictData('Report_Template')"
+                        :key="item.code"
+                        :label="item.name"
+                        :value="item.code"
+                    />
+                </el-select>
+            </el-form-item>
+            <el-form-item label="设备关联ICD" prop="icd" >
+                <el-select v-model="formContent.icd"  clearable placeholder="请选择ICD">
+                    <el-option
+                        v-for="item in icdOptions"
+                        :key="item.id"
+                        :label="item.name"
+                        :value="item.id"
+                    />
+                </el-select>
+            </el-form-item>
+      </el-form>
+      </div>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="close()">取消</el-button>
+        <el-button type="primary" @click="save()" >
+          保存
+        </el-button>
+      </div>
+    </template>
+  </el-dialog>
+
+  </template>
+  
+  <script lang="ts" setup>
+  import{  ElMessage, type FormInstance,type FormItemRule } from 'element-plus'
+  import type { ProTableInstance } from '@/components/ProTable/interface'
+  import { ref,computed, Ref  } from 'vue'
+  import { type DevType } from '@/api/device/interface/devType'
+   import { type ICD } from '@/api/device/interface/icd'
+  import {dialogSmall} from '@/utils/elementBind'
+  import { useDictStore } from '@/stores/modules/dict'
+  import {addDevType,updateDevType} from '@/api/device/devType'
+  import {getICDAllList} from '@/api/device/icd'
+  const dictStore = useDictStore()
+  // 定义弹出组件元信息
+  const dialogFormRef = ref()
+  const icdOptions = ref<ICD.ResICD[]>([])
+ function useMetaInfo() {
+    const dialogVisible = ref(false)
+    const titleType = ref('add')
+    const formContent = ref<DevType.ResPqDevType>({
+        id: '',     //设备类型ID
+        name: '',//设备类型名称
+        icd: '',//设备关联的ICD
+        power: 'AC/DC 110V-220V',//工作电源
+        devVolt: 57.74,   //额定电压（V）
+        devCurr: 5,   //额定电流（A）
+        devChns: 1,  //设备通道数
+        reportName: '',//报告模版名称
+        state: 1,
+    })
+    return { dialogVisible, titleType, formContent }
+  }
+  
+  const { dialogVisible, titleType, formContent } = useMetaInfo()
+
+
+// 清空formContent
+const resetFormContent = () => {
+    formContent.value = {
+        id: '',     //设备类型ID
+        name: '',//设备类型名称
+        icd: '',//设备关联的ICD
+        power: 'AC/DC 110V-220V',//工作电源
+        devVolt: 57.74,   //额定电压（V）
+        devCurr: 5,   //额定电流（A）
+        devChns: 1,  //设备通道数
+        reportName: '',//报告模版名称
+        state: 1,
+    }
+  }
+  
+  let dialogTitle = computed(() => {
+    return titleType.value === 'add' ? '新增设备类型' : '编辑设备类型'
+  })
+
+
+
+
+  //定义规则
+  const formRuleRef = ref<FormInstance>()
+  //定义校验规则
+  const rules: Ref<Record<string, Array<FormItemRule>>> = ref({
+    name: [{ required: true, message: '设备类型名称必填！', trigger: 'blur' }],
+    power: [
+    { required: true, message: '工作电源必选！', trigger: 'change' }
+  ],
+    devChns: [
+    { required: true, message: '设备通道数必选！', trigger: 'change' }
+  ],
+  devVolt: [
+    { required: true, message: '额定电压必选！', trigger: 'change' }
+  ],
+  devCurr: [
+    { required: true, message: '额定电流必选！', trigger: 'change' }
+  ],
+  })
+
+  
+// 关闭弹窗
+const close = () => {
+    dialogVisible.value = false
+    // 清空dialogForm中的值
+    resetFormContent()
+    // 重置表单
+    dialogFormRef.value?.resetFields()
+  }
+  
+  // 保存数据
+  const save = () => {
+    try {
+        dialogFormRef.value?.validate(async (valid: boolean) => {
+        if (valid) {
+          if (formContent.value.id) {
+              await updateDevType(formContent.value);
+            } else {
+               await addDevType(formContent.value);
+          }
+          ElMessage.success({ message: `${dialogTitle.value}成功！` })
+          close()
+          // 刷新表格
+          await props.refreshTable!()
+        }
+      })
+    } catch (err) {
+      //error('验证过程中出现错误', err)
+    }
+  }
+  
+  // 打开弹窗，可能是新增，也可能是编辑
+  const open = async (sign: string, data: DevType.ResPqDevType) => {
+    // 重置表单
+    dialogFormRef.value?.resetFields()
+    titleType.value = sign
+    dialogVisible.value = true
+
+    const response = await getICDAllList({
+        id: '',
+        name: '',
+        path: '',
+        state: 1
+    })
+    icdOptions.value = (response.data as ICD.ResICD[]).map(item => ({
+      id: item.id,
+      name: item.name,
+      path: item.path,
+      state: item.state,
+    }))
+
+    if (data.id) {
+      formContent.value = { ...data }
+    } else {
+      resetFormContent()
+    }
+  }
+  
+  // 对外映射
+  defineExpose({ open })
+  const props = defineProps<{
+    refreshTable: (() => Promise<void>) | undefined;
+  }>()
+  
+  </script>
\ No newline at end of file
diff --git a/frontend/src/views/machine/devType/index.vue b/frontend/src/views/machine/devType/index.vue
new file mode 100644
index 0000000..44a67bb
--- /dev/null
+++ b/frontend/src/views/machine/devType/index.vue
@@ -0,0 +1,148 @@
+<template>
+    <div class='table-box' ref='popupBaseView'>
+      <ProTable
+        ref='proTable'
+        :columns='columns'
+        :request-api='getTableList'
+      >
+        <!-- :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>
+        </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>
+    <DevTypePopup :refresh-table='proTable?.getTableList' ref='devTypePopup' />
+  </template>
+  
+  <script setup lang='tsx' name='useRole'>
+  import TimeControl from '@/components/TimeControl/index.vue'
+  import { type DevType } from '@/api/device/interface/devType'
+  import { useHandleData } from '@/hooks/useHandleData'
+  import { useDownload } from '@/hooks/useDownload'
+  import ProTable from '@/components/ProTable/index.vue'
+  import { type ProTableInstance, type ColumnProps } from '@/components/ProTable/interface'
+  import { CirclePlus, Delete, EditPen, Download, Upload } from '@element-plus/icons-vue'
+  import { useDictStore } from '@/stores/modules/dict'
+  import {
+    getDevTypeList,
+    deleteDevType,
+  } from '@/api/device/devType/index.ts'
+  import { reactive, ref } from 'vue'
+  import { useModeStore, useAppSceneStore } from '@/stores/modules/mode'
+  
+  defineOptions({
+    name: 'devType',
+  })
+  const modeStore = useModeStore()
+  const dictStore = useDictStore()
+  // ProTable 实例
+  const proTable = ref<ProTableInstance>()
+  const devTypePopup = ref()
+
+  
+  const getTableList = async (params: any) => {
+    let newParams = JSON.parse(JSON.stringify(params))
+    // newParams.searchEndTime = endDate.value
+    // newParams.searchBeginTime = startDate.value
+    // const patternId = dictStore.getDictData('Pattern').find(item => item.name === modeStore.currentMode)?.id//获取数据字典中对应的id
+    // newParams.pattern = patternId
+    return getDevTypeList(newParams)
+  }
+  
+  
+  // 表格配置项
+  const columns = reactive<ColumnProps<DevType.ResPqDevType>[]>([
+    { type: 'selection', fixed: 'left', width: 70 },
+    { type: 'index', fixed: 'left', width: 70, label: '序号' },
+    {
+      prop: 'name',
+      label: '名称',
+      search: { el: 'input' },
+      minWidth: 200,
+    },
+    {
+      prop: 'devChns',
+      label: '通道数',
+      minWidth: 110,
+  
+    },
+    {
+      prop: 'devVolt',
+      label: '额定电压（V）',
+      minWidth: 130,
+  
+    },
+    {
+      prop: 'devCurr',
+      label: '额定电流（A）',
+      minWidth: 130,
+  
+    },
+    {
+      prop: 'createTime',
+      label: '创建时间',
+      width: 200,
+      render: scope => {
+        if (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 },
+  ])
+  
+  
+  // 处理日期变化的回调函数
+  const startDate = ref('')
+  const endDate = ref('')
+  const handleDateChange = (startDateTemp: string, endDateTemp: string) => {
+    startDate.value = startDateTemp
+    endDate.value = endDateTemp
+  }
+  // 打开 drawer(新增、编辑)
+  const openDialog = (titleType: string, row: Partial<DevType.ResPqDevType> = {}) => {
+    devTypePopup.value?.open(titleType, row)
+  }
+  
+  
+  // 批量删除设备
+  const batchDelete = async (id: string[]) => {
+    const patternId = dictStore.getDictData('Pattern').find(item => item.name === modeStore.currentMode)?.id ?? ''//获取数据字典中对应的id
+    await useHandleData(deleteDevType, id, '删除所选设备类型')
+    
+    proTable.value?.clearSelection()
+    proTable.value?.getTableList()
+  }
+  
+  // 删除设备
+  const handleDelete = async (params: DevType.ResPqDevType) => {
+    const patternId = dictStore.getDictData('Pattern').find(item => item.name === modeStore.currentMode)?.id//获取数据字典中对应的id
+    await useHandleData(deleteDevType,  [params.id] , `删除【${params.name}】设备类型`)
+    proTable.value?.getTableList()
+    
+  }
+  
+  </script>
+    
\ No newline at end of file
diff --git a/frontend/src/views/machine/device/components/devicePopup.vue b/frontend/src/views/machine/device/components/devicePopup.vue
index a4e85a2..8ce53a7 100644
--- a/frontend/src/views/machine/device/components/devicePopup.vue
+++ b/frontend/src/views/machine/device/components/devicePopup.vue
@@ -253,8 +253,7 @@ const baseRules: Record<string, Array<FormItemRule>> = {
     { required: true, message: '额定电流必填！', trigger: 'blur' },
     { pattern: /^\d+(\.\d+)?$/, message: '额定电流格式错误', trigger: 'blur' }
   ],
-  createId: [{ required: true, message: '装置编号必填！', trigger: 'blur' },
-  { pattern: /^\d+$/, message: '装置编号为数字', trigger: 'blur' }
+  createId: [{ required: true, message: '装置编号必填！', trigger: 'blur' }
   ],
   ip: [
     { required: true, message: 'IP地址必填！', trigger: 'blur' },
@@ -279,6 +278,9 @@ const rules = computed(() => {
   }
   if (scene.value === '1'){//只有楼下出厂需要展示
     dynamicRules.preinvestmentPlan= [{ required: true, message: '预投计划必选！', trigger: 'change' }];
+    dynamicRules.createId= [{ required: true, message: '装置编号必填！', trigger: 'blur' },
+    { pattern: /^\d+$/, message: '装置编号为数字', trigger: 'blur' }
+    ];
   }
   if (scene.value !== '0') {
     dynamicRules.name = [{ required: true, message: '设备名称必填！', trigger: 'blur' }];