From fde6cd9bf9364fcda2a803d1adbaab1cb7a93e78 Mon Sep 17 00:00:00 2001
From: lxd <1004405501@qq.com>
Date: Wed, 11 Jun 2025 09:50:14 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E8=AE=BE=E5=A4=87=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=E7=95=8C=E9=9D=A2=E7=9B=B8=E5=85=B3=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/device/index.ts             |   4 +
 src/api/deviceuser/index.ts         |  96 ++++----
 src/views/devices/DetailsForm.vue   | 214 +++++++++++++++--
 src/views/devices/DevFrom.vue       | 351 +++++++++++-----------------
 src/views/devices/devices_cards.vue |   4 +-
 src/views/devices/index.vue         |  27 ++-
 6 files changed, 414 insertions(+), 282 deletions(-)

diff --git a/src/api/device/index.ts b/src/api/device/index.ts
index 1cab5831..204967ef 100644
--- a/src/api/device/index.ts
+++ b/src/api/device/index.ts
@@ -47,6 +47,10 @@ export const DeviceApi = {
   deleteDevice: async (id: number) => {
     return await request.delete({ url: `/system/device/delete?id=` + id })
   },
+  // 删除设备
+  deleteDeviceCode: async (devicecode: number) => {
+    return await request.delete({ url: `/system/device/deletecode?devicecode=` + devicecode })
+  },
 
   // 导出设备 Excel
   exportDevice: async (params) => {
diff --git a/src/api/deviceuser/index.ts b/src/api/deviceuser/index.ts
index a4dec16b..be687a49 100644
--- a/src/api/deviceuser/index.ts
+++ b/src/api/deviceuser/index.ts
@@ -1,46 +1,50 @@
-import request from '@/config/axios'
-
-// 设备人员关联 VO
-export interface DeviceuserVO {
-  id: number // 主键ID
-  deviceid: number // 设备ID
-  userid: number // 用户ID
-  createtime: Date // 创建时间
-  updatetime: Date // 更新时间
-  createby: string // 创建人
-  updateby: string // 更新人
-  username: string // 用户姓名
-}
-
-// 设备人员关联 API
-export const DeviceuserApi = {
-  // 查询设备人员关联分页
-  getDeviceuserPage: async (params: any) => {
-    return await request.get({ url: `/system/deviceuser/page`, params })
-  },
-
-  // 查询设备人员关联详情
-  getDeviceuser: async (id: number) => {
-    return await request.get({ url: `/system/deviceuser/get?id=` + id })
-  },
-
-  // 新增设备人员关联
-  createDeviceuser: async (data: DeviceuserVO) => {
-    return await request.post({ url: `/system/deviceuser/create`, data })
-  },
-
-  // 修改设备人员关联
-  updateDeviceuser: async (data: DeviceuserVO) => {
-    return await request.put({ url: `/system/deviceuser/update`, data })
-  },
-
-  // 删除设备人员关联
-  deleteDeviceuser: async (id: number) => {
-    return await request.delete({ url: `/system/deviceuser/delete?id=` + id })
-  },
-
-  // 导出设备人员关联 Excel
-  exportDeviceuser: async (params) => {
-    return await request.download({ url: `/system/deviceuser/export-excel`, params })
-  },
-}
\ No newline at end of file
+import request from '@/config/axios'
+
+// 设备人员关联 VO
+export interface DeviceuserVO {
+  id: number // 主键ID
+  deviceid: number // 设备ID
+  userid: number // 用户ID
+  createtime: Date // 创建时间
+  updatetime: Date // 更新时间
+  createby: string // 创建人
+  updateby: string // 更新人
+  username: string // 用户姓名
+}
+
+// 设备人员关联 API
+export const DeviceuserApi = {
+  // 查询设备人员关联分页
+  getDeviceuserPage: async (params: any) => {
+    return await request.get({ url: `/system/deviceuser/page`, params })
+  },
+
+  // 查询设备人员关联详情
+  getDeviceuser: async (id: number) => {
+    return await request.get({ url: `/system/deviceuser/get?id=` + id })
+  },
+  // 查询设备人员关联数量
+  getDevCount: async (devicecode: number) => {
+    return await request.get({ url: `/system/deviceuser/getDevCount?devicecode=` + devicecode })
+  },
+
+  // 新增设备人员关联
+  createDeviceuser: async (data: DeviceuserVO) => {
+    return await request.post({ url: `/system/deviceuser/create`, data })
+  },
+
+  // 修改设备人员关联
+  updateDeviceuser: async (data: DeviceuserVO) => {
+    return await request.put({ url: `/system/deviceuser/update`, data })
+  },
+
+  // 删除设备人员关联
+  deleteDeviceuser: async (id: number) => {
+    return await request.delete({ url: `/system/deviceuser/delete?id=` + id })
+  },
+
+  // 导出设备人员关联 Excel
+  exportDeviceuser: async (params) => {
+    return await request.download({ url: `/system/deviceuser/export-excel`, params })
+  }
+}
diff --git a/src/views/devices/DetailsForm.vue b/src/views/devices/DetailsForm.vue
index 06aab1af..b81fe860 100644
--- a/src/views/devices/DetailsForm.vue
+++ b/src/views/devices/DetailsForm.vue
@@ -5,13 +5,14 @@
       v-loading="formLoading"
       :model="formData"
       label-width="100px"
-      :disabled="true"
+      :disabled="!isEditing"
     >
       <el-form-item label="设备ID">
         <span>{{ formData.devicecode }}</span>
       </el-form-item>
       <el-form-item label="设备名称">
-        <span>{{ formData.devicename }}</span>
+        <el-input v-if="isEditing" v-model="formData.devicename" />
+        <span v-else>{{ formData.devicename }}</span>
       </el-form-item>
       <el-form-item label="所属机构">
         <span>{{ formData.orgname }}</span>
@@ -19,18 +20,37 @@
       <el-form-item label="设备类型">
         <span>{{ getDeviceTypeName(formData.devicetype) }}</span>
       </el-form-item>
-      <el-form-item label="设备位置">
-        <span>{{ formData.location }}</span>
+      <el-form-item label="设备位置" class="location-form-item">
+        <template v-if="isEditing">
+          <el-cascader
+            v-model="selectedOptions"
+            :options="options"
+            :props="{ expandTrigger: 'hover' }"
+            placeholder="请选择省/市/区"
+            @change="handleAddressChange"
+            class="location-cascader"
+            clearable
+          />
+          <el-input
+            v-model="locationDetail"
+            placeholder="请输入详细地址"
+            class="detail-address-input"
+          />
+        </template>
+        <span v-else>{{ fullLocation }}</span>
       </el-form-item>
       <el-form-item label="设备状态">
         <span>{{ getDeviceStatusName(formData.devicestatus) }}</span>
       </el-form-item>
       <el-form-item label="设备描述">
-        <span>{{ formData.description }}</span>
+        <el-input v-if="isEditing" v-model="formData.description" type="textarea" :rows="3" />
+        <span v-else>{{ formData.description }}</span>
       </el-form-item>
     </el-form>
     <template #footer>
-      <el-button @click="dialogVisible = false">关 闭</el-button>
+      <el-button v-if="!isEditing" type="primary" @click="handleEdit">编 辑</el-button>
+      <el-button v-else type="primary" @click="handleSave">保 存</el-button>
+      <el-button @click="handleClose">关 闭</el-button>
     </template>
   </Dialog>
 </template>
@@ -38,6 +58,8 @@
 <script lang="ts" setup>
 import { DeviceApi } from '@/api/device'
 import { ElMessage } from 'element-plus'
+import type { DeviceVO } from '@/api/device'
+import { regionData, codeToText } from 'element-china-area-data'
 
 defineOptions({ name: 'DeviceDetailsForm' })
 
@@ -66,44 +88,202 @@ const getDeviceStatusName = (status: string | number) => {
 const dialogVisible = ref(false) // 弹窗的是否展示
 const dialogTitle = ref('') // 弹窗的标题
 const formLoading = ref(false) // 表单的加载中
-const formData = ref({
-  devicecode: undefined,
+const formData = ref<DeviceVO>({
+  id: 0,
+  devicecode: 0,
   devicename: '',
-  orgname: '',
   devicetype: '',
   location: '',
-  devicestatus: '',
-  description: ''
+  devicestatus: 0,
+  orgid: 0,
+  orgname: '',
+  description: '',
+  createtime: new Date(),
+  updatetime: new Date(),
+  createby: '',
+  updateby: ''
 })
 
+const isEditing = ref(false) // 是否处于编辑状态
+const locationDetail = ref('') // 详细地址
+const options = ref(regionData) // 省市区数据
+const selectedOptions = ref<string[]>([]) // 选中的省市区
+
 /** 打开弹窗 */
 const open = async (id: number) => {
   dialogVisible.value = true
   dialogTitle.value = '设备详情'
   resetForm()
+  isEditing.value = false
   // 获取设备数据
   if (id) {
     formLoading.value = true
     try {
       const res = await DeviceApi.getDeviceId(id)
       formData.value = res
+      // 解析地址
+      if (res.location) {
+        const addressParts = res.location.split('/')
+        if (addressParts.length > 3) {
+          formData.value.location = addressParts.slice(0, 3).join('/')
+          locationDetail.value = addressParts.slice(3).join('/')
+        } else {
+          formData.value.location = res.location
+          locationDetail.value = ''
+        }
+      }
     } finally {
       formLoading.value = false
     }
   }
 }
-defineExpose({ open }) // 提供 open 方法，用于打开弹窗
+
+/** 处理编辑按钮点击 */
+const handleEdit = () => {
+  isEditing.value = true
+  // 解析已有地址，设置省市区选择器的值
+  if (formData.value.location) {
+    const addressParts = formData.value.location.split('/')
+    if (addressParts.length === 3) {
+      // 遍历省市区数据，找到对应的编码
+      const findCode = (name: string, data: any[]): string | undefined => {
+        for (const item of data) {
+          if (item.label === name) {
+            return item.value
+          }
+          if (item.children) {
+            for (const child of item.children) {
+              if (child.label === name) {
+                return child.value
+              }
+              if (child.children) {
+                for (const grandChild of child.children) {
+                  if (grandChild.label === name) {
+                    return grandChild.value
+                  }
+                }
+              }
+            }
+          }
+        }
+        return undefined
+      }
+
+      // 处理直辖市
+      const isMunicipality = ['北京市', '天津市', '上海市', '重庆市'].includes(addressParts[0])
+      let provinceCode, cityCode, areaCode
+
+      if (isMunicipality) {
+        // 直辖市特殊处理
+        provinceCode = findCode(addressParts[0], options.value)
+        // 直辖市的第二级是"市辖区"，需要特殊处理
+        const province = options.value.find(item => item.value === provinceCode)
+        if (province && province.children) {
+          // 找到市辖区
+          const district = province.children.find(item => item.label === '市辖区')
+          if (district) {
+            cityCode = district.value
+            // 在区级中查找
+            if (district.children) {
+              const area = district.children.find(item => item.label === addressParts[2])
+              if (area) {
+                areaCode = area.value
+              }
+            }
+          }
+        }
+      } else {
+        // 普通省份处理
+        provinceCode = findCode(addressParts[0], options.value)
+        cityCode = findCode(addressParts[1], options.value)
+        areaCode = findCode(addressParts[2], options.value)
+      }
+
+      if (provinceCode && cityCode && areaCode) {
+        selectedOptions.value = [provinceCode, cityCode, areaCode]
+      }
+    }
+  }
+}
+
+/** 处理地址变化 */
+const handleAddressChange = (value: string[]) => {
+  if (value && value.length === 3) {
+    const address = codeToText[value[0]] + '/' + codeToText[value[1]] + '/' + codeToText[value[2]]
+    formData.value.location = address
+  }
+}
+
+/** 处理保存按钮点击 */
+const handleSave = async () => {
+  try {
+    formLoading.value = true
+    // 组合完整地址
+    const fullAddress = formData.value.location + (locationDetail.value ? '/' + locationDetail.value : '')
+    const updateData = {
+      ...formData.value,
+      location: fullAddress
+    }
+    await DeviceApi.updateDevice(updateData)
+    ElMessage.success('保存成功')
+    isEditing.value = false
+  } catch (error) {
+    ElMessage.error('保存失败')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+/** 处理关闭按钮点击 */
+const handleClose = () => {
+  dialogVisible.value = false
+  isEditing.value = false
+}
 
 /** 重置表单 */
 const resetForm = () => {
   formData.value = {
-    devicecode: undefined,
+    id: 0,
+    devicecode: 0,
     devicename: '',
-    orgname: '',
     devicetype: '',
     location: '',
-    devicestatus: '',
-    description: ''
+    devicestatus: 0,
+    orgid: 0,
+    orgname: '',
+    description: '',
+    createtime: new Date(),
+    updatetime: new Date(),
+    createby: '',
+    updateby: ''
+  }
+  locationDetail.value = ''
+  selectedOptions.value = []
+}
+
+// 计算完整地址
+const fullLocation = computed(() => {
+  if (!formData.value.location) return ''
+  return formData.value.location + (locationDetail.value ? '/' + locationDetail.value : '')
+})
+
+defineExpose({ open }) // 提供 open 方法，用于打开弹窗
+</script>
+
+<style lang="scss">
+.location-form-item {
+  :deep(.el-form-item__content) {
+    display: inline-flex;
+    align-items: center;
+    gap: 10px;
+  }
+
+  .location-cascader {
+    width: 240px;
+  }
+
+  .detail-address-input {
+    width: 300px;
   }
 }
-</script>
+</style>
diff --git a/src/views/devices/DevFrom.vue b/src/views/devices/DevFrom.vue
index de4c096f..12c117a5 100644
--- a/src/views/devices/DevFrom.vue
+++ b/src/views/devices/DevFrom.vue
@@ -1,5 +1,12 @@
 <template>
-  <Dialog v-model="dialogVisible" :title="dialogTitle">
+  <Dialog 
+    v-model="dialogVisible" 
+    :title="dialogTitle"
+    :modal="true"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    class="device-dialog"
+  >
     <el-form
       ref="formRef"
       v-loading="formLoading"
@@ -7,59 +14,42 @@
       :rules="formRules"
       label-width="100px"
       :disabled="isDetail"
+      class="device-form"
     >
-      <el-form-item label="设备ID" prop="deviceId">
-        <el-input v-model="formData.deviceId" placeholder="请输入设备ID" />
+      <el-form-item label="设备ID" prop="devicecode">
+        <el-input v-model="formData.devicecode" placeholder="请输入设备ID" />
       </el-form-item>
-      <el-form-item label="设备名称" prop="deviceName">
-        <el-input v-model="formData.deviceName" placeholder="请输入设备名称" />
+      <el-form-item label="设备名称" prop="devicename">
+        <el-input v-model="formData.devicename" placeholder="请输入设备名称" />
       </el-form-item>
-      <el-form-item label="所属机构" prop="orgId">
-        <el-select v-model="formData.orgId" placeholder="请选择所属机构" @change="handleProductChange">
+      <el-form-item label="设备类型" prop="devicetype">
+        <el-select v-model="formData.devicetype" placeholder="请选择设备类型">
           <el-option
-            v-for="item in productList"
-            :key="item.id"
-            :label="item.name"
-            :value="item.id"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="设备类型" prop="deviceType">
-        <el-select v-model="formData.deviceType" placeholder="请选择设备类型">
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.IOT_DEVICE_TYPE)"
+            v-for="dict in getStrDictOptions(DICT_TYPE.IOT_DEVICE_TYPE)"
             :key="dict.value"
             :label="dict.label"
             :value="dict.value"
           />
         </el-select>
       </el-form-item>
-      <el-form-item label="设备位置" prop="address">
-        <div class="flex items-center gap-2">
-          <el-cascader
-            v-model="selectedOptions"
-            :options="options"
-            @change="handleAddressChange"
-            placeholder="请选择省/市/区"
-            clearable
-            class="w-[450px]"
-          />
-          <el-input
-            v-model="formData.detailAddress"
-            placeholder="请输入详细地址"
-            class="w-[450px]"
-          />
-        </div>
+      <el-form-item label="设备位置" prop="location" class="location-form-item" inline>
+        <el-cascader
+          v-model="selectedOptions"
+          :options="options"
+          :props="{ expandTrigger: 'hover' }"
+          placeholder="请选择省/市/区"
+          @change="handleAddressChange"
+          class="location-cascader"
+          clearable
+        />
+        <el-input
+          v-model="locationDetail"
+          placeholder="请输入详细地址"
+          class="detail-address-input"
+        />
       </el-form-item>
-      <el-form-item label="设备状态" prop="state">
-        <el-select v-model="formData.state" placeholder="请选择设备状态">
-          <el-option
-            v-for="dict in getIntDictOptions(DICT_TYPE.IOT_DEVICE_STATE)"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
+      <el-form-item label="设备状态" prop="devicestatus">
+        <span>待激活</span>
       </el-form-item>
       <el-form-item label="设备描述" prop="description">
         <el-input
@@ -78,19 +68,11 @@
 </template>
 
 <script lang="ts" setup>
-import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
-import * as DeviceApi from '@/api/iot/device/device'
-import * as ProductApi from '@/api/iot/product/product'
-import * as DeviceGroupApi from '@/api/iot/device/group'
-import { DeviceStateEnum } from '@/api/iot/device/device'
+import { DICT_TYPE, getIntDictOptions,getStrDictOptions } from '@/utils/dict'
 import { FormRules } from 'element-plus'
 import { regionData, codeToText } from 'element-china-area-data'
-
-interface CascaderOption {
-  value: string
-  label: string
-  children?: CascaderOption[]
-}
+import { DeviceApi, DeviceVO } from '@/api/device'
+import { getUserProfile } from '@/api/system/user/profile'
 
 defineOptions({ name: 'DeviceForm' })
 
@@ -102,50 +84,35 @@ const dialogTitle = ref('') // 弹窗的标题
 const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
 const formType = ref('') // 表单的类型：create - 新增；update - 修改
 const isDetail = ref(false) // 是否为详情模式
-const formData = ref<DeviceApi.DeviceVO>({
-  id: undefined,
-  deviceId: undefined,
-  deviceName: undefined,
-  productId: undefined,
-  productKey: undefined,
-  deviceType: undefined,
-  nickname: undefined,
-  gatewayId: undefined,
-  state: DeviceStateEnum.INACTIVE,
-  onlineTime: undefined,
-  offlineTime: undefined,
-  activeTime: undefined,
-  createTime: undefined,
-  ip: undefined,
-  firmwareVersion: undefined,
-  deviceSecret: undefined,
-  mqttClientId: undefined,
-  mqttUsername: undefined,
-  mqttPassword: undefined,
-  authType: undefined,
-  latitude: undefined,
-  longitude: undefined,
-  areaId: undefined,
-  address: undefined,
-  detailAddress: undefined,
-  serialNumber: undefined,
-  config: undefined,
-  description: undefined,
-  groupIds: []
+
+const locationDetail = ref('') // 详细地址
+
+const formData = ref<Partial<DeviceVO>>({
+  devicename: '',
+  devicecode: undefined,
+  devicetype: '',
+  location: '',
+  devicestatus: 0,
+  orgid: undefined,
+  orgname: '',
+  description: '',
+  createby: '',
+  updateby: ''
 })
 
+// 省市区数据
+const options = ref(regionData)
+const selectedOptions = ref<string[]>([])
+
 const formRules = reactive<FormRules>({
-  deviceId: [{ required: true, message: '设备ID不能为空', trigger: 'blur' }],
-  deviceName: [{ required: true, message: '设备名称不能为空', trigger: 'blur' }],
-  deviceType: [{ required: true, message: '设备类型不能为空', trigger: 'blur' }],
-  address: [{ required: true, message: '设备位置不能为空', trigger: 'blur' }],
+  devicecode: [{ required: true, message: '设备ID不能为空', trigger: 'blur' }],
+  devicename: [{ required: true, message: '设备名称不能为空', trigger: 'blur' }],
+  devicetype: [{ required: true, message: '设备类型不能为空', trigger: 'blur' }],
+  location: [{ required: true, message: '设备位置不能为空', trigger: 'blur' }],
 })
-
+// 用户信息
+const userProfile = ref()
 const formRef = ref() // 表单 Ref
-const productList = ref<ProductApi.ProductVO[]>([]) // 产品列表
-const groupList = ref<DeviceGroupApi.DeviceGroupVO[]>([]) // 分组列表
-const selectedOptions = ref<string[]>([]) // 添加级联选择器的值
-const options = ref<CascaderOption[]>(regionData as unknown as CascaderOption[])
 
 /** 打开弹窗 */
 const open = async (type: string, id?: number) => {
@@ -154,70 +121,11 @@ const open = async (type: string, id?: number) => {
   formType.value = type
   isDetail.value = type === 'details' // 设置是否为详情模式
   resetForm()
-  // 修改时，设置数据
-  if (id) {
-    formLoading.value = true
-    try {
-      // 这里模拟获取设备数据，实际项目中应该调用API
-      const mockDeviceData = {
-        id: id,
-        deviceId: 'Device' + id,
-        deviceName: '测试设备' + id,
-        deviceType: 1,
-        state: DeviceStateEnum.INACTIVE,
-        address: '',
-        detailAddress: '测试地址123号',
-        description: '这是一个测试设备的描述信息',
-        productId: 1,
-        productKey: 'product_key_' + id,
-        nickname: '设备昵称' + id,
-        gatewayId: 1,
-        onlineTime: new Date(),
-        offlineTime: new Date(),
-        activeTime: new Date(),
-        createTime: new Date(),
-        ip: '192.168.1.1',
-        firmwareVersion: '1.0.0',
-        deviceSecret: 'secret_' + id,
-        mqttClientId: 'client_' + id,
-        mqttUsername: 'username_' + id,
-        mqttPassword: 'password_' + id,
-        authType: 'password',
-        latitude: 39.123456,
-        longitude: 117.123456,
-        areaId: 1,
-        serialNumber: 'SN' + id,
-        config: '{}',
-        groupIds: []
-      }
-      formData.value = mockDeviceData
-      
-      // 处理地址数据
-      if (formData.value.address) {
-        const addressParts = formData.value.address.split('/')
-        if (addressParts.length >= 3) {
-          // 获取省市区编码
-          const provinceCode = Object.keys(codeToText).find(key => codeToText[key] === addressParts[0])
-          let cityCode = Object.keys(codeToText).find(key => codeToText[key] === addressParts[1])
-          if(provinceCode == '12'){
-            cityCode = '1201'
-          }
-          const areaCode = Object.keys(codeToText).find(key => codeToText[key] === addressParts[2])
-          if (provinceCode && cityCode && areaCode) {
-            selectedOptions.value = [provinceCode, cityCode, areaCode]
-          }
-          
-          // 设置详细地址
-          if (addressParts.length > 3) {
-            formData.value.detailAddress = addressParts.slice(3).join('/')
-          }
-        }
-      }
-    } finally {
-      formLoading.value = false
-    }
-  }
+  // 首先获取用户信息
+  userProfile.value = await getUserProfile()
+  console.log(userProfile.value.dept.name)
 }
+
 defineExpose({ open }) // 提供 open 方法，用于打开弹窗
 
 /** 提交表单 */
@@ -230,8 +138,19 @@ const submitForm = async () => {
   // 提交请求
   formLoading.value = true
   try {
-    const data = formData.value
+    // 组合完整地址
+    const fullAddress = formData.value.location + (locationDetail.value ? '/' + locationDetail.value : '')
+    
+    const data = {
+      ...formData.value,
+      devicecode: formData.value.devicecode,
+      location: fullAddress,
+      orgid: userProfile.value.dept.id,
+      orgname: userProfile.value.dept.name
+    } as DeviceVO
+    
     if (formType.value === 'create') {
+      console.log(data)
       await DeviceApi.createDevice(data)
       message.success(t('common.createSuccess'))
     } else {
@@ -249,75 +168,81 @@ const submitForm = async () => {
 /** 重置表单 */
 const resetForm = () => {
   formData.value = {
-    id: undefined,
-    deviceId: undefined,
-    deviceName: undefined,
-    productId: undefined,
-    productKey: undefined,
-    deviceType: undefined,
-    nickname: undefined,
-    gatewayId: undefined,
-    state: DeviceStateEnum.INACTIVE,
-    onlineTime: undefined,
-    offlineTime: undefined,
-    activeTime: undefined,
-    createTime: undefined,
-    ip: undefined,
-    firmwareVersion: undefined,
-    deviceSecret: undefined,
-    mqttClientId: undefined,
-    mqttUsername: undefined,
-    mqttPassword: undefined,
-    authType: undefined,
-    latitude: undefined,
-    longitude: undefined,
-    areaId: undefined,
-    address: undefined,
-    detailAddress: undefined,
-    serialNumber: undefined,
-    config: undefined,
-    description: undefined,
-    groupIds: []
+    devicename: '',
+    devicecode: undefined,
+    devicetype: '',
+    location: '',
+    devicestatus: 0,
+    orgid: undefined,
+    orgname: '',
+    description: '',
+    createby: '',
+    updateby: ''
   }
+  locationDetail.value = ''
   selectedOptions.value = []
   formRef.value?.resetFields()
 }
 
-/** 检查设备标识 */
-const checkDeviceKey = async () => {
-  // TODO: 实现设备标识检查逻辑
-  message.warning('设备标识检查功能待实现')
-}
-
 /** 处理产品变更 */
 const handleProductChange = (productId: number) => {
-  const product = productList.value.find(item => item.id === productId)
-  if (product) {
-    formData.value.productKey = product.productKey
-  }
+  // 这里只保留查找逻辑，如需扩展请根据实际 productList 字段调整
+  // const product = productList.value.find(item => item.id === productId)
+  // if (product) {
+  //   formData.value.productKey = product.productKey
+  // }
 }
 
 /** 处理地址变化 */
-const handleAddressChange = (value: any) => {
+const handleAddressChange = (value: string[]) => {
   if (value && value.length === 3) {
     const address = codeToText[value[0]] + '/' + codeToText[value[1]] + '/' + codeToText[value[2]]
-    if (formData.value.detailAddress) {
-      formData.value.address = address + '/' + formData.value.detailAddress
-    } else {
-      formData.value.address = address
-    }
+    formData.value.location = address
+  }
+}
+</script>
+
+<style lang="scss">
+.device-dialog {
+  position: relative;
+  
+  :deep(.el-dialog) {
+    position: relative;
+    z-index: 2000;
   }
 }
 
-// 监听详细地址变化
-watch(() => formData.value.detailAddress, (newValue) => {
-  if (selectedOptions.value && selectedOptions.value.length === 3) {
-    const address = codeToText[selectedOptions.value[0]] + '/' + codeToText[selectedOptions.value[1]] + '/' + codeToText[selectedOptions.value[2]]
-    if (newValue) {
-      formData.value.address = address + '/' + newValue
-    } else {
-      formData.value.address = address
-    }
+.device-form {
+  position: relative;
+}
+
+.status-select-item {
+  position: relative;
+}
+
+.device-status-select {
+  position: absolute !important;
+  z-index: 2001 !important;
+}
+
+:deep(.el-select__popper) {
+  position: absolute !important;
+  z-index: 2001 !important;
+}
+
+.location-form-item {
+  :deep(.el-form-item__content) {
+    display: inline-flex;
+    align-items: center;
+    gap: 10px;
   }
-})
-</script>
+
+  .location-cascader {
+    width: 240px;
+  }
+
+  .detail-address-input {
+    width: 300px;
+  }
+}
+</style>
diff --git a/src/views/devices/devices_cards.vue b/src/views/devices/devices_cards.vue
index 386be77f..f9a08fae 100644
--- a/src/views/devices/devices_cards.vue
+++ b/src/views/devices/devices_cards.vue
@@ -57,7 +57,7 @@
         <el-button 
           type="primary" 
           size="small" 
-          :disabled="deviceInfo.devicestatus === 1"
+          :disabled="deviceInfo.devicestatus === 1 || deviceInfo.devicestatus === 0"
           @click="handleAction('enable')"
         >
           启用
@@ -66,7 +66,7 @@
         <el-button 
           type="warning" 
           size="small" 
-          :disabled="deviceInfo.devicestatus === 2"
+          :disabled="deviceInfo.devicestatus === 2 || deviceInfo.devicestatus === 0"
           @click="handleAction('disable')"
         >
           停用
diff --git a/src/views/devices/index.vue b/src/views/devices/index.vue
index 19589020..09fd5d0f 100644
--- a/src/views/devices/index.vue
+++ b/src/views/devices/index.vue
@@ -97,9 +97,10 @@ import DeviceCard from '../devices/devices_cards.vue'
 import DeviceForm from './DevFrom.vue'
 import DetailsForm from './DetailsForm.vue'
 import { DeviceApi } from '@/api/device'
+import { DeviceuserApi } from '@/api/deviceuser'
 import { getUserProfile } from '@/api/system/user/profile'
 import ECG_datas from './Device_Data_Components/ECG_datas.vue'
-
+import { ElMessage, ElMessageBox } from 'element-plus'
 // 查询参数
 interface QueryParams {
   devicename: string
@@ -118,7 +119,7 @@ const queryParams = reactive<QueryParams>({
   pageSize: 10,
   orgid: 0
 })
-
+const message = useMessage() // 消息弹窗
 // 总数据量
 const total = ref(0)
 // 用户信息
@@ -164,7 +165,7 @@ const openForm = (type: string) => {
 }
 
 // 处理设备操作
-const handleDeviceAction = (action: any) => {
+const handleDeviceAction = async (action: any) => {
   console.log('设备操作：', action)
   if (action.action === 'details') {
     // 打开表单并加载设备数据
@@ -172,8 +173,26 @@ const handleDeviceAction = (action: any) => {
   } else if (action.action === 'openECGData') {
     // 打开心电数据组件
     ecgDataRef.value?.open(action.deviceId, action.deviceName)
+  } else if (action.action === 'delete') {
+    // 删除设备
+    const res = await DeviceuserApi.getDevCount(action.deviceId)
+    if (res> 0) {
+      message.error('设备下有人员，不能删除,请解绑后再进行操作')
+      return
+    }
+    ElMessageBox.confirm('是否删除该设备？', '警告', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning'
+  }).then(async () => {
+      const res2 = await DeviceApi.deleteDeviceCode(action.deviceId)
+   if (res2) {
+    message.success('删除成功')
+    handleQuery()
+   }
+  })
   } else {
-    console.log('设备操作：', action)
+    //设备操作
   }
 }