代码提交

src/api/deviceCheck/index.ts

@@ -0,0 +1,59 @@
+import request from '@/utils/request';
+
+/**
+ * 查询巡检班组列表
+ * @param query
+ * @returns {*}
+ */
+export const listInspectionTeam = (query) => {
+    return request({
+        url: '/jdyw/inspectionTeam/list',
+        method: 'get',
+        params: query
+    });
+};
+/**
+ * 查询巡检班组信息详细
+ * @param id
+ */
+export const getInspectionTeam = (id) => {
+    return request({
+        url: '/jdyw/inspectionTeam/' + id,
+        method: 'get'
+    });
+};
+
+/**
+ * 新增巡检班组信息
+ * @param data
+ */
+export const addInspectionTeam = (data) => {
+    return request({
+        url: '/jdyw/inspectionTeam',
+        method: 'post',
+        data: data
+    });
+};
+
+/**
+ * 修改巡检班组信息
+ * @param data
+ */
+export const updateInspectionTeam = (data) => {
+    return request({
+        url: '/jdyw/inspectionTeam',
+        method: 'put',
+        data: data
+    });
+};
+
+/**
+ * 删除巡检班组信息
+ * @param id
+ */
+export const delInspectionTeam = (id: string | number | Array<string | number>) => {
+    return request({
+        url: '/jdyw/inspectionTeam/' + id,
+        method: 'delete'
+    });
+};

src/views/deviceCheck/checkTeam/index.vue

@@ -0,0 +1,366 @@
+<template>
+  <div class="p-2">
+    <transition :enter-active-class="proxy?.animate.searchAnimate.enter"
+      :leave-active-class="proxy?.animate.searchAnimate.leave">
+      <div v-show="showSearch" class="mb-[10px]">
+        <el-card shadow="hover">
+          <el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="100px">
+            <el-form-item label="巡检班组名称" prop="name">
+              <el-input v-model="queryParams.name" placeholder="请输入巡检班组名称" clearable @keyup.enter="handleQuery" />
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" icon="Search" @click="handleQuery"> 搜索 </el-button>
+              <el-button icon="Refresh" @click="resetQuery"> 重置 </el-button>
+            </el-form-item>
+          </el-form>
+        </el-card>
+      </div>
+    </transition>
+
+    <el-card shadow="never">
+      <template #header>
+        <el-row :gutter="10" class="mb8">
+          <el-col :span="1.5">
+            <el-button type="primary" plain icon="Plus" @click="handleAdd"> 新增 </el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate"> 修改 </el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete"> 删除 </el-button>
+          </el-col>
+          <right-toolbar v-model:showSearch="showSearch" @query-table="getList" />
+        </el-row>
+      </template>
+
+      <el-table v-loading="loading" :data="tableList" @selection-change="handleSelectionChange">
+        <el-table-column type="selection" width="55" align="center" />
+        <el-table-column label="巡检班组名称" align="center" prop="name" width="150" />
+        <el-table-column label="班组负责人" align="center" prop="phone" width="150" />
+        <el-table-column label="联系电话" align="center" prop="city" width="100" />
+        <el-table-column label="班次" align="center" prop="address" show-overflow-tooltip width="180" />
+        <el-table-column label="成员数" align="center" show-overflow-tooltip prop="remark" width="150" />
+        <el-table-column label="备注" align="center" prop="createTime" width="180" />
+        <el-table-column label="创建时间" align="center" prop="createTime" width="180" />
+        <el-table-column label="操作" align="center" width="100" fixed="right" class-name="small-padding fixed-width">
+          <template #default="scope">
+            <el-button size="small" link type="primary" @click="handleUpdate(scope.row)">修改</el-button>
+            <el-button size="small" link type="danger" @click="handleDelete(scope.row)">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination v-show="total > 0" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize"
+        :total="total" @pagination="getList" />
+    </el-card>
+    <!-- 添加或修改对话框 -->
+    <el-dialog v-model="dialog.visible" :title="dialog.title" width="900px" append-to-body>
+      <el-form ref="addFormRef" :model="form" label-width="100px">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="班组名称" prop="name" :rules="[{ required: true, message: '班组名称不能为空', trigger: 'blur' }]">
+              <el-input v-model="form.name" placeholder="请输入班组名称" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="班组负责人" prop="headerId"
+              :rules="[{ required: true, message: '班组负责人不能为空', trigger: 'change' }]">
+              <el-select v-model="form.headerId" clearable @change="setUserInfo('leader')">
+                <el-option v-for="item in userList" :key="item.userId" :label="item.nickName" :value="item.userId"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="联系电话" prop="ext1.phone">
+              <el-input v-model="form.ext1.phone" disabled  />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="负责路线" prop="ext1.route">
+              <el-select v-model="form.ext1.route" clearable >
+                <el-option label="路线一" value="1"></el-option>
+                <el-option label="路线二" value="2"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="班次" prop="workSquence" :rules="[{ required: true, message: '班次不能为空', trigger: 'blur' }]">
+              <el-input v-model="form.workSquence" placeholder="请输入联系电话" />
+            </el-form-item>
+          </el-col>
+          <!-- <el-col :span="12">
+            <el-form-item label="负责设备" prop="deviceTypeIds"
+              :rules="[{ required: true, message: '负责设备不能为空', trigger: 'change' }]">
+              <el-select v-model="form.deviceTypeIds" multiple clearable placeholder="请选择负责设备">
+                <el-option v-for="dict in dictGroup.deviceTypeDetailOptions" :key="dict.id"
+                  :label="`${dict.ext1.brand}${dict.xh}`" :value="dict.id">
+                  <span style="float: left">{{ dict.ext1.brand }}</span>
+                  <span style="float: right;color: var(--el-text-color-secondary);font-size: 13px;">
+                    {{ dict.xh }}
+                  </span>
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col> -->
+          <el-col :span="12">
+            <el-form-item label="备注" prop="remark">
+              <el-input v-model="form.remark" placeholder="请输入备注" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <SubTitle title="班组成员" />
+        <el-table :data="form.members">
+          <el-table-column label="班组成员" align="center" prop="name" />
+          <el-table-column label="联系方式" align="center" prop="name" />
+          <el-table-column label="技能描述" align="center" prop="name" />
+          <el-table-column label="负责设备类型" align="center" prop="name" />
+          <el-table-column label="操作" align="center" prop="name" />
+        </el-table>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button :loading="buttonLoading" type="primary" @click="submitForm"> 确 定 </el-button>
+          <el-button @click="cancel"> 取 消 </el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup name="CheckTeam" lang="ts">
+import { listInspectionTeam, getInspectionTeam, delInspectionTeam, addInspectionTeam, updateInspectionTeam } from '@/api/deviceCheck/index';
+import {
+  getDeviceTypeDetailList
+} from '@/api/deviceManage/deviceType';
+import {listUser} from '@/api/system/user/index'
+const { proxy } = getCurrentInstance() as ComponentInternalInstance;
+
+const tableList = ref([]);
+const buttonLoading = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref<Array<string | number>>([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const queryFormRef = ref<ElFormInstance>();
+const addFormRef = ref<ElFormInstance>();
+const dialog = reactive<DialogOption>({
+  visible: false,
+  title: ''
+});
+const dictGroup = reactive({
+  productorOptions: [],
+  deviceTypeDetailOptions: []
+})
+const initFormData = {
+  id: undefined,
+  name: undefined,
+  headerId: undefined,
+  workSquence: undefined,
+  remark: undefined,
+  members: [],
+  ext1: <any>{
+    phone: '',
+    route:''
+  },
+  ext2: undefined
+};
+const formData = reactive({
+  form: { ...initFormData },
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    name: undefined,
+    params: {}
+  }
+});
+
+const { queryParams, form } = toRefs(formData);
+const userList = ref([])
+/** 查询列表 */
+const getList = async () => {
+  loading.value = true;
+  const res = await listInspectionTeam(queryParams.value);
+  tableList.value = res.rows.map((item) => ({
+    ...item,
+    ext1: item.ext1 ? JSON.parse(item.ext1) : null
+  }));
+  total.value = res.total;
+  loading.value = false;
+};
+
+/** 取消按钮 */
+const cancel = () => {
+  reset();
+  dialog.visible = false;
+};
+
+/** 表单重置 */
+const reset = () => {
+  form.value = { ...initFormData };
+  addFormRef.value?.resetFields();
+};
+
+/** 搜索按钮操作 */
+const handleQuery = () => {
+  queryParams.value.pageNum = 1;
+  getList();
+};
+
+/** 重置按钮操作 */
+const resetQuery = () => {
+  queryFormRef.value?.resetFields();
+  handleQuery();
+};
+
+/** 多选框选中数据 */
+const handleSelectionChange = (selection) => {
+  ids.value = selection.map((item) => item.id);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+};
+
+/** 新增按钮操作 */
+const handleAdd = () => {
+  reset();
+  dialog.visible = true;
+  dialog.title = '新增巡检班组';
+};
+
+/** 修改按钮操作 */
+const handleUpdate = async (row) => {
+  reset();
+  const _id = row?.id || ids.value[0];
+  const { data } = await getInspectionTeam(_id);
+  data.ext1 = data.ext1 && JSON.parse(data.ext1);
+  deviceTypeDetailList(data.productorId)
+  data.deviceTypeIds = data.deviceTypeIds.split(',');
+  Object.assign(form.value, data);
+  dialog.visible = true;
+  dialog.title = '修改巡检班组';
+};
+
+/** 提交按钮 */
+const submitForm = () => {
+  addFormRef.value?.validate(async (valid: boolean) => {
+    if (valid) {
+      buttonLoading.value = true;
+      const { ext1, deviceTypeIds } = form.value;
+      const params = Object.assign(form.value, { ext1: JSON.stringify(ext1), deviceTypeIds: deviceTypeIds.join() });
+      if (form.value.id) {
+        await updateInspectionTeam(params).finally(() => (buttonLoading.value = false));
+      } else {
+        await addInspectionTeam(params).finally(() => (buttonLoading.value = false));
+      }
+      proxy?.$modal.msgSuccess('操作成功');
+      dialog.visible = false;
+      await getList();
+    }
+  });
+};
+
+/** 删除按钮操作 */
+const handleDelete = async (row) => {
+  const _ids = row?.id || ids.value;
+  await proxy?.$modal.confirm('是否确认删除？').finally(() => (loading.value = false));
+  await delInspectionTeam(_ids);
+  proxy?.$modal.msgSuccess('删除成功');
+  await getList();
+};
+const deviceTypeDetailList = async (productorId = '') => {
+  const res = await getDeviceTypeDetailList({ productorId });
+  dictGroup.deviceTypeDetailOptions = res.rows.map((item) => ({
+    ...item,
+    ext1: item.ext1 ? JSON.parse(item.ext1) : null
+  }));
+};
+const formatDevice = (val) => {
+  const arr = val.split(',')
+  let label = ''
+  dictGroup.deviceTypeDetailOptions.forEach((item) => {
+    arr.forEach(el => {
+      if (el === item.id) {
+        label += `${item.ext1.brand}${item.xh},`
+      }
+    })
+  })
+  return label.substring(0, label.length - 1)
+}
+const formatDict = (val, option: string) => {
+  let label = '';
+  dictGroup[option].forEach((item) => {
+    if (val === item.id) {
+      label = item.name;
+    }
+  });
+  return label;
+};
+const getUserList = () => {
+  listUser({ status: '0', pageSize: 10000, pageNum: 1 }).then(({ code,rows}) => {
+    if (code===200) {
+      userList.value = rows
+    }
+  })
+}
+const setUserInfo = (type) => {
+  const {headerId } = form.value
+  userList.value.forEach(item => {
+    if (headerId===item.userId) {
+      form.value.ext1.phone = item.phonenumber
+    }
+  })
+}
+onMounted(() => {
+  getList();
+  deviceTypeDetailList()
+  getUserList()
+});
+</script>
+<style lang="scss" scoped>
+.card-header {
+  display: flex;
+  justify-content: space-between;
+
+  .el-icon {
+    cursor: pointer;
+  }
+}
+
+.custom-tree-node {
+  flex: 1;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding-right: 5px;
+}
+
+.node-operateBtns {
+  div {
+    margin-top: 3px;
+    text-align: center;
+    cursor: pointer;
+
+    &:hover {
+      color: #409eff;
+    }
+  }
+}
+</style>
+<style lang="scss">
+.customDrawer {
+  .el-drawer__header {
+    align-items: flex-start !important;
+    margin-bottom: 10px;
+
+    .drawer-title {
+      .title-name {
+        color: #000;
+      }
+    }
+  }
+
+  .el-drawer__body {
+    padding-top: 0;
+  }
+}
+</style>

src/views/deviceManage/archives/index.vue

@@ -1,213 +1,368 @@
 <template>
-    <div class="p-2">
-        <transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
-            <div v-show="showSearch" class="mb-[10px]">
-                <el-card shadow="hover">
-                    <el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="80px">
-                        <el-form-item label="设备名称" prop="name">
-                            <el-input v-model="queryParams.name" placeholder="请输入设备名称" clearable @keyup.enter="handleQuery" />
-                        </el-form-item>
-                        <el-form-item label="设备编号" prop="sn">
-                            <el-input v-model="queryParams.sn" placeholder="请输入设备编号" clearable @keyup.enter="handleQuery" />
-                        </el-form-item>
-                        <el-form-item label="使用状态" prop="status">
-                            <el-select v-model="form.deviceTypeId" clearable placeholder="请选择使用状态">
-                                <el-option v-for="dict in use_status" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
-                            </el-select>
-                        </el-form-item>
-                        <el-form-item>
-                            <el-button type="primary" icon="Search" @click="handleQuery"> 搜索 </el-button>
-                            <el-button icon="Refresh" @click="resetQuery"> 重置 </el-button>
-                        </el-form-item>
-                    </el-form>
-                </el-card>
-            </div>
-        </transition>
+  <div class="p-2">
+    <transition :enter-active-class="proxy?.animate.searchAnimate.enter"
+      :leave-active-class="proxy?.animate.searchAnimate.leave">
+      <div v-show="showSearch" class="mb-[10px]">
+        <el-card shadow="hover">
+          <el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="80px">
+            <el-form-item label="设备名称" prop="name">
+              <el-input v-model="queryParams.name" placeholder="请输入设备名称" clearable @keyup.enter="handleQuery" />
+            </el-form-item>
+            <el-form-item label="设备编号" prop="sn">
+              <el-input v-model="queryParams.sn" placeholder="请输入设备编号" clearable @keyup.enter="handleQuery" />
+            </el-form-item>
+            <el-form-item label="使用状态" prop="status">
+              <el-select v-model="queryParams.status" clearable placeholder="请选择使用状态">
+                <el-option v-for="dict in use_status" :key="dict.value" :label="dict.label"
+                  :value="dict.value"></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" icon="Search" @click="handleQuery"> 搜索 </el-button>
+              <el-button icon="Refresh" @click="resetQuery"> 重置 </el-button>
+            </el-form-item>
+          </el-form>
+        </el-card>
+      </div>
+    </transition>
 
-        <el-card shadow="never">
-            <template #header>
-                <el-row :gutter="10" class="mb8">
-                    <el-col :span="1.5">
-                        <el-button v-hasPermi="['jdyw:deviceType:add']" type="primary" plain icon="Plus" @click="handleAdd"> 新增 </el-button>
-                    </el-col>
-                    <el-col :span="1.5">
-                        <el-button v-hasPermi="['jdyw:deviceType:edit']" type="success" plain icon="Edit" :disabled="single" @click="handleUpdate">
-                            修改
-                        </el-button>
-                    </el-col>
-                    <el-col :span="1.5">
-                        <el-button
-                            v-hasPermi="['jdyw:deviceType:remove']"
-                            type="danger"
-                            plain
-                            icon="Delete"
-                            :disabled="multiple"
-                            @click="handleDelete"
-                        >
-                            删除
-                        </el-button>
-                    </el-col>
-                    <right-toolbar v-model:showSearch="showSearch" @query-table="getList" />
-                </el-row>
-            </template>
+    <el-card shadow="never">
+      <template #header>
+        <el-row :gutter="10" class="mb8">
+          <el-col :span="1.5">
+            <el-button v-hasPermi="['jdyw:deviceType:add']" type="primary" plain icon="Plus" @click="handleAdd"> 新增
+            </el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button v-hasPermi="['jdyw:deviceType:edit']" type="success" plain icon="Edit" :disabled="single"
+              @click="handleUpdate">
+              修改
+            </el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button v-hasPermi="['jdyw:deviceType:remove']" type="danger" plain icon="Delete" :disabled="multiple"
+              @click="handleDelete">
+              删除
+            </el-button>
+          </el-col>
+          <right-toolbar v-model:showSearch="showSearch" @query-table="getList" />
+        </el-row>
+      </template>
 
-            <el-table v-loading="loading" :data="deviceList" @selection-change="handleSelectionChange">
-                <el-table-column type="selection" width="55" align="center" />
-                <el-table-column label="设备名称" align="center" prop="name" />
-                <el-table-column label="设备编号" align="center" prop="sn" />
-                <el-table-column label="所属系统" align="center" prop="deviceSystem" />
-                <el-table-column label="品牌" align="center" prop="brand" />
-                <el-table-column label="型号" align="center" prop="xh" />
-                <el-table-column label="固定资产编号" align="center" prop="fixedId" width="120" />
-                <el-table-column label="领用日期" align="center" prop="useDate" width="120" />
-                <el-table-column label="质保日期" align="center" prop="qaDate" width="120" />
-                <el-table-column label="维保状态" align="center" prop="qaStatus" />
-                <el-table-column label="使用状态" align="center">
-                    <template #default="scope">
-                        <dict-tag :options="use_status" :value="scope.row.useStatus" />
-                    </template>
-                </el-table-column>
-                <el-table-column label="运行状态" align="center" prop="runningStatus" />
-                <el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width" width="180">
-                    <template #default="scope">
-                        <el-button size="small" link type="primary">详情</el-button>
-                        <el-button size="small" link type="primary" @click="showQrCode(scope.row)">二维码</el-button>
-                        <el-button size="small" link type="primary" @click="handleUpdate(scope.row)">修改</el-button>
-                        <el-button size="small" link type="danger" @click="handleScrap(scope.row)">报废</el-button>
-                    </template>
-                </el-table-column>
-            </el-table>
-            <pagination
-                v-show="total > 0"
-                v-model:page="queryParams.pageNum"
-                v-model:limit="queryParams.pageSize"
-                :total="total"
-                @pagination="getList"
-            />
-        </el-card>
+      <el-table v-loading="loading" :data="deviceList" @selection-change="handleSelectionChange">
+        <el-table-column type="selection" width="55" align="center" />
+        <el-table-column label="设备名称" align="center" prop="name" width="120" />
+        <el-table-column label="设备编号" align="center" prop="sn" />
+        <!-- <el-table-column label="所属系统" align="center" prop="deviceSystem" /> -->
+        <el-table-column label="品牌" align="center" prop="ext1.brand" />
+        <el-table-column label="型号" align="center" prop="ext1.xh" />
+        <!-- <el-table-column label="固定资产编号" align="center" prop="fixedId" width="120" /> -->
+        <el-table-column label="领用日期" align="center" width="100">
+          <template #default="scope">
+            {{ scope.row.useTime.substring(0, 10) }}
+          </template>
+        </el-table-column>
+        <el-table-column label="质保日期" align="center" width="100">
+          <template #default="scope">
+            {{ scope.row.qualityEndTime.substring(0, 10) }}
+          </template>
+        </el-table-column>
+        <!-- <el-table-column label="维保状态" align="center" prop="qaStatus" /> -->
+        <el-table-column label="使用状态" align="center">
+          <template #default="scope">
+            <dict-tag :options="use_status" :value="scope.row.status" />
+          </template>
+        </el-table-column>
+        <!-- <el-table-column label="运行状态" align="center" prop="runningStatus" /> -->
+        <el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width" width="180">
+          <template #default="scope">
+            <el-button size="small" link type="primary" @click="showDetail(scope.row)">详情</el-button>
+            <el-button size="small" link type="primary" @click="showQrCode(scope.row)">二维码</el-button>
+            <el-button v-if="scope.row.status != 3" size="small" link type="primary"
+              @click="handleUpdate(scope.row)">修改</el-button>
+            <el-button v-if="scope.row.status != 3" size="small" link type="danger"
+              @click="handleScrap(scope.row)">报废</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination v-show="total > 0" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize"
+        :total="total" @pagination="getList" />
+    </el-card>
 
-        <!-- 添加或修改设备类型信息对话框 -->
-        <el-dialog v-model="dialog.visible" :title="dialog.title" width="800px" append-to-body>
-            <el-form ref="deviceFormRef" :model="form" label-width="80px">
-                <el-row :gutter="20">
-                    <el-col :span="12">
-                        <el-form-item
-                            label="设备名称"
-                            prop="deviceTypeId"
-                            :disabled="ifEdit"
-                            :rules="[{ required: true, message: '设备名称不能为空', trigger: 'blur' }]"
-                        >
-                            <el-input v-model="form.brand" placeholder="请输入设备名称" />
-                        </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                        <el-form-item
-                            label="设备编号"
-                            prop="deviceTypeId"
-                            :disabled="ifEdit"
-                            :rules="[{ required: true, message: '设备编号不能为空', trigger: 'blur' }]"
-                        >
-                            <el-input v-model="form.brand" placeholder="请输入（支持批量新增，以逗号分隔）" />
-                        </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                        <el-form-item
-                            label="设备类型"
-                            prop="deviceTypeId"
-                            :disabled="ifEdit"
-                            :rules="[{ required: true, message: '设备类型不能为空', trigger: 'change' }]"
-                        >
-                            <el-select v-model="form.deviceTypeId" placeholder="请选择设备类型">
-                                <el-option v-for="dict in deviceTypeOptions" :key="dict.id" :label="dict.name" :value="dict.id"></el-option>
-                            </el-select>
-                        </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                        <el-form-item label="品牌" prop="brand">
-                            <el-input v-model="form.brand" disabled />
-                        </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                        <el-form-item label="型号" prop="xh">
-                            <el-input v-model="form.xh" disabled />
-                        </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                        <el-form-item label="领用日期" prop="xh">
-                            <el-date-picker v-model="form.xh" style="width: 100%" :disabled="ifEdit" type="date" placeholder="领用日期" />
-                        </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                        <el-form-item label="质保日期" prop="xh">
-                            <el-date-picker v-model="form.xh" style="width: 100%" :disabled="ifEdit" type="date" placeholder="领用日期" />
-                        </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                        <el-form-item label="使用状态" prop="xh">
-                            <el-select v-model="form.deviceTypeId" clearable placeholder="请选择使用状态">
-                                <el-option v-for="dict in use_status" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
-                            </el-select>
-                        </el-form-item>
-                    </el-col>
-                </el-row>
-                <el-form-item label="备注" prop="remark">
-                    <el-input v-model="form.remark" type="textarea" placeholder="请输入备注" />
-                </el-form-item>
-                <el-form-item label="地理位置" prop="remark">
-                    <div id="map" class="bdmap"></div>
-                </el-form-item>
-            </el-form>
-            <template #footer>
-                <div class="dialog-footer">
-                    <el-button :loading="buttonLoading" type="primary" @click="submitForm"> 确 定 </el-button>
-                    <el-button @click="cancel"> 取 消 </el-button>
+    <!-- 添加或修改设备类型信息对话框 -->
+    <el-dialog v-model="dialog.visible" :title="dialog.title" width="800px" append-to-body>
+      <el-form ref="deviceFormRef" :model="form" label-width="80px">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="设备名称" prop="name" :rules="[{ required: true, message: '设备名称不能为空', trigger: 'blur' }]">
+              <el-input v-model="form.name" :disabled="ifEdit" placeholder="请输入设备名称" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="设备编号" prop="sn" :rules="[{ required: true, message: '设备编号不能为空', trigger: 'blur' }]">
+              <el-input v-model="form.sn" :disabled="ifEdit" placeholder="请输入设备编号" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="设备类型" prop="devTypeDetailId"
+              :rules="[{ required: true, message: '设备类型不能为空', trigger: 'change' }]">
+              <el-select v-model="form.devTypeDetailId" :disabled="ifEdit" clearable placeholder="请选择设备类型"
+                @change="devTypeDetailChange">
+                <el-option v-for="dict in dictGroup.deviceTypeDetailOptions" :key="dict.id"
+                  :label="dict.deviceType.name" :value="dict.id">
+                  <span style="float: left">{{ dict.deviceType.name }}</span>
+                  <span style="float: right;color: var(--el-text-color-secondary);font-size: 13px;">
+                    {{ dict.ext1.brand }}{{ dict.xh }}
+                  </span>
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="品牌" prop="ext1.brand">
+              <el-input v-model="form.ext1.brand" disabled />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="型号" prop="ext1.xh">
+              <el-input v-model="form.ext1.xh" disabled />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="领用日期" prop="useTime"
+              :rules="[{ required: true, message: '领用日期不能为空', trigger: 'change' }]">
+              <el-date-picker v-model="form.useTime" value-format="YYYY-MM-DD hh:mm:ss" style="width: 100%"
+                :disabled="ifEdit" type="date" placeholder="请选择领用日期" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="质保日期" prop="qualityEndTime"
+              :rules="[{ required: true, message: '质保日期不能为空', trigger: 'change' }]">
+              <el-date-picker v-model="form.qualityEndTime" value-format="YYYY-MM-DD hh:mm:ss" style="width: 100%"
+                :disabled="ifEdit" type="date" placeholder="请选择质保日期" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="使用状态" prop="status"
+              :rules="[{ required: true, message: '使用状态不能为空', trigger: 'change' }]">
+              <el-select v-model="form.status" clearable placeholder="请选择使用状态">
+                <el-option v-for="dict in use_status.filter(item => item.value != 3)" :key="dict.value"
+                  :label="dict.label" :value="dict.value"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark" type="textarea" placeholder="请输入备注" />
+        </el-form-item>
+        <el-form-item label="地理位置">
+          <div id="map" class="bdmap"></div>
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button :loading="buttonLoading" type="primary" @click="submitForm"> 确 定 </el-button>
+          <el-button @click="cancel"> 取 消 </el-button>
+        </div>
+      </template>
+    </el-dialog>
+    <el-drawer v-model="drawer" class="customDrawer" size="40%">
+      <template #header>
+        <div class="drawer-title">
+          <div class="title-name">报废设备</div>
+        </div>
+      </template>
+      <el-form ref="deviceScrapFormRef" :model="scrapForm" label-width="80px">
+        <el-form-item label="设备名称">
+          <div>{{ scrapForm.name }}</div>
+        </el-form-item>
+        <el-form-item label="设备编号">
+          <div>{{ scrapForm.sn }}</div>
+        </el-form-item>
+        <el-form-item label="品牌">
+          <div>{{ scrapForm.ext1.brand }}</div>
+        </el-form-item>
+        <el-form-item label="型号">
+          <div>{{ scrapForm.ext1.xh }}</div>
+        </el-form-item>
+        <el-form-item label="报废理由" prop="reason" :rules="[{ required: true, message: '报废理由不能为空', trigger: 'blur' }]">
+          <el-input v-model="scrapForm.reason" placeholder="请输入" />
+        </el-form-item>
+        <el-form-item label="报废时间" prop="scrapDate"
+          :rules="[{ required: true, message: '报废时间不能为空', trigger: 'change' }]">
+          <el-date-picker v-model="scrapForm.scrapDate" style="width: 100%" type="date" placeholder="请选择" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div style="flex: auto">
+          <el-button @click="drawer = false">取消</el-button>
+          <el-button type="primary" @click="confirmClick">确认</el-button>
+        </div>
+      </template>
+    </el-drawer>
+    <el-dialog v-model="qrDialog" title="设备二维码" width="600px" append-to-body>
+      <el-descriptions class="custom-descriptions" title="" :column="1" border>
+        <el-descriptions-item label="设备名称"> {{ qrInfo.name }} </el-descriptions-item>
+        <el-descriptions-item label="设备编号"> {{ qrInfo.sn }} </el-descriptions-item>
+        <el-descriptions-item label="设备品牌"> {{ qrInfo.ext1.brand }} </el-descriptions-item>
+        <el-descriptions-item label="设备型号"> {{ qrInfo.ext1.xh }} </el-descriptions-item>
+        <el-descriptions-item label="存放位置"> {{ qrInfo.ext1.address }} </el-descriptions-item>
+      </el-descriptions>
+      <img class="qrImg" src="@/assets/images/qrcode.png" alt="" />
+    </el-dialog>
+    <el-drawer v-model="detailDrawer" class="customDrawer" size="70%">
+      <template #header>
+        <div class="drawer-title">
+          <div class="title-name">设备详情</div>
+          <el-descriptions title="" direction="vertical" :column="5">
+            <el-descriptions-item align="left" label="设备名称">{{ curRow.name }}</el-descriptions-item>
+            <el-descriptions-item align="left" label="设备编号">{{ curRow.sn }}</el-descriptions-item>
+            <el-descriptions-item align="left" width="150" label="品牌">{{ curRow.ext1.brand }}</el-descriptions-item>
+            <el-descriptions-item align="left" label="设备型号">{{ curRow.ext1.xh }}</el-descriptions-item>
+            <el-descriptions-item align="left" label="所属系统">{{ curRow.systemName }}</el-descriptions-item>
+          </el-descriptions>
+        </div>
+      </template>
+      <div>
+        <el-tabs v-model="detailTab">
+          <el-tab-pane label="基础信息" name="1">
+            <el-collapse v-model="detailCollapse">
+              <el-collapse-item name="1">
+                <template #title>
+                  <SubTitle title="设备信息" />
+                </template>
+                <div>
+                  <el-descriptions class="detail-descriptions" :column="2" border>
+                    <el-descriptions-item label-align="right" label="设备名称">{{ curRow.name }}</el-descriptions-item>
+                    <el-descriptions-item label-align="right" label="设备编号">{{ curRow.sn }}</el-descriptions-item>
+                    <el-descriptions-item label-align="right" label="所属系统">{{ curRow.systemName
+                      }}</el-descriptions-item>
+                    <el-descriptions-item label-align="right" label="品牌">{{ curRow.ext1.brand }}</el-descriptions-item>
+                    <el-descriptions-item label-align="right" label="设备型号">{{ curRow.ext1.xh }}</el-descriptions-item>
+                    <el-descriptions-item label-align="right" label="供应商">{{ curRow.productorName
+                      }}</el-descriptions-item>
+                    <el-descriptions-item label-align="right" label="供应商联系人">{{ curRow.linkName
+                      }}</el-descriptions-item>
+                    <el-descriptions-item label-align="right" label="联系方式">{{ curRow.linkPhone }}</el-descriptions-item>
+                    <el-descriptions-item label-align="right" label="领用日期">{{
+                      curRow.useTime && curRow.useTime.substring(0, 11)
+                    }}</el-descriptions-item>
+                    <el-descriptions-item label-align="right" label="质保日期">{{
+                      curRow.qualityEndTime && curRow.qualityEndTime.substring(0, 11) }}</el-descriptions-item>
+                    <el-descriptions-item label-align="right" label="使用状态">
+                      <dict-tag :options="use_status" :value="curRow.status" />
+                    </el-descriptions-item>
+                    <el-descriptions-item label-align="right" label="备注">{{ curRow.remark }}</el-descriptions-item>
+                  </el-descriptions>
                 </div>
-            </template>
-        </el-dialog>
-        <el-drawer v-model="drawer" title="报废设备" size="40%">
-            <el-form ref="deviceScrapFormRef" :model="scrapForm" label-width="80px">
-                <el-form-item label="设备名称">
-                    <div>{{ scrapForm.name }}</div>
-                </el-form-item>
-                <el-form-item label="设备编号">
-                    <div>{{ scrapForm.sn }}</div>
-                </el-form-item>
-                <el-form-item label="品牌">
-                    <div>{{ scrapForm.brand }}</div>
-                </el-form-item>
-                <el-form-item label="型号">
-                    <div>{{ scrapForm.xh }}</div>
-                </el-form-item>
-                <el-form-item label="报废理由" prop="reason" :rules="[{ required: true, message: '报废理由不能为空', trigger: 'blur' }]">
-                    <el-input v-model="scrapForm.reason" placeholder="请输入" />
-                </el-form-item>
-                <el-form-item label="报废时间" prop="scrapDate" :rules="[{ required: true, message: '报废时间不能为空', trigger: 'change' }]">
-                    <el-date-picker v-model="scrapForm.scrapDate" style="width: 100%" type="date" placeholder="请选择" />
-                </el-form-item>
-            </el-form>
-            <template #footer>
-                <div style="flex: auto">
-                    <el-button @click="drawer = false">取消</el-button>
-                    <el-button type="primary" @click="confirmClick">确认</el-button>
+              </el-collapse-item>
+              <el-collapse-item name="2">
+                <template #title>
+                  <SubTitle title="位置信息" />
+                </template>
+                <div>
+                  <div id="positionMap" class="bdmap"></div>
                 </div>
-            </template>
-        </el-drawer>
-        <el-dialog v-model="qrDialog" title="设备二维码" width="600px" append-to-body>
-            <el-descriptions class="custom-descriptions" title="" :column="1" border>
-                <el-descriptions-item label="设备名称"> {{ qrInfo.name }} </el-descriptions-item>
-                <el-descriptions-item label="设备编号"> {{ qrInfo.sn }} </el-descriptions-item>
-                <el-descriptions-item label="设备品牌"> {{ qrInfo.brand }} </el-descriptions-item>
-                <el-descriptions-item label="设备型号"> {{ qrInfo.xh }} </el-descriptions-item>
-                <el-descriptions-item label="存放位置"> {{ qrInfo.position }} </el-descriptions-item>
-            </el-descriptions>
-            <img class="qrImg" src="@/assets/images/qrcode.png" alt="" />
-        </el-dialog>
-    </div>
+              </el-collapse-item>
+              <el-collapse-item name="3">
+                <template #title>
+                  <SubTitle title="设备图片" />
+                </template>
+                <div>
+                </div>
+              </el-collapse-item>
+            </el-collapse>
+          </el-tab-pane>
+          <el-tab-pane label="生命历程" name="2">
+            <el-timeline style="max-width: 800px">
+              <el-timeline-item center timestamp="" placement="top">
+                <el-card>
+                  <div class="timeline-label">
+                    <div>领用</div>
+                    <div>张姗姗</div>
+                    <div>2024/08/12 12:00:00</div>
+                    <div>备件库领用</div>
+                  </div>
+                </el-card>
+              </el-timeline-item>
+              <el-timeline-item center timestamp="" placement="top">
+                <el-card>
+                  <div class="timeline-label">
+                    <div>使用</div>
+                    <div>王网</div>
+                    <div>2024/08/24 12:00:00</div>
+                    <div>用于项目</div>
+                  </div>
+                </el-card>
+              </el-timeline-item>
+            </el-timeline>
+          </el-tab-pane>
+          <el-tab-pane label="物模型" name="3">
+            <el-tabs v-model="detailModel" type="card">
+              <el-tab-pane label="属性" name="1">
+                <el-table :data="curRow.dataPoints">
+                  <el-table-column label="属性" align="center" prop="name" />
+                  <el-table-column label="属性值" align="center" prop="value" />
+                  <el-table-column label="单位" align="center" prop="unit" />
+                  <el-table-column label="描述" align="center" prop="remark" />
+                </el-table>
+              </el-tab-pane>
+              <el-tab-pane label="能力" name="2">
+                <el-table :data="curRow.controlFuncs" >
+                  <el-table-column label="能力名称" align="center" prop="name" />
+                  <el-table-column label="下发参数" align="center" prop="value" />
+                  <el-table-column label="描述" align="center" prop="remark" />
+                </el-table>
+              </el-tab-pane>
+              <el-tab-pane label="事件" name="3">
+                <el-table :data="curRow.events" >
+                  <el-table-column label="事件名称" align="center" prop="name" />
+                  <el-table-column label="事件类型" align="center" prop="type" />
+                  <el-table-column label="事件代码" align="center" prop="code" />
+                  <el-table-column label="外部事件代码" align="center" prop="outerCode" />
+                  <el-table-column label="描述" align="center" prop="remark" />
+                </el-table>
+              </el-tab-pane>
+            </el-tabs>
+          </el-tab-pane>
+          <el-tab-pane label="运行状态" name="4"></el-tab-pane>
+          <el-tab-pane label="维修记录" name="5">
+            <el-table :data="repairData" >
+                  <el-table-column label="报修工单" align="center" prop="name" />
+                  <el-table-column label="报修人" align="center" prop="type" />
+                  <el-table-column label="报修部门" align="center" prop="code" />
+                  <el-table-column label="故障时间" align="center" prop="outerCode" />
+                  <el-table-column label="故障等级" align="center" prop="remark" />
+                  <el-table-column label="是否停机" align="center" prop="remark" />
+                  <el-table-column label="维修人员" align="center" prop="remark" />
+                  <el-table-column label="工单完工时间" align="center" prop="remark" />
+                  <el-table-column label="维修备注说明" align="center" prop="remark" />
+                </el-table>
+          </el-tab-pane>
+          <el-tab-pane label="巡检记录" name="6">
+            <el-table :data="recordData" >
+                  <el-table-column label="工单号" align="center" prop="name" />
+                  <el-table-column label="计划名称" align="center" prop="type" />
+                  <el-table-column label="计划编号" align="center" prop="code" />
+                  <el-table-column label="巡检周期（天）" align="center" prop="outerCode" />
+                  <el-table-column label="巡检项" align="center" prop="remark" />
+                  <el-table-column label="计划巡检日期" align="center" prop="remark" />
+                  <el-table-column label="巡检完成日期" align="center" prop="remark" />
+                  <el-table-column label="执行人" align="center" prop="remark" />
+                </el-table>
+          </el-tab-pane>
+          <el-tab-pane label="附件" name="7"></el-tab-pane>
+        </el-tabs>
+      </div>
+    </el-drawer>
+  </div>
 </template>
 
 <script setup name="Archives" lang="ts">
 import { listDevice, getDevice, delDevice, addDevice, updateDevice } from '@/api/deviceManage/device';
-import { listDeviceType } from '@/api/deviceManage/deviceType';
+import { listDeviceType, getDeviceType, getDeviceTypeDetail, getDeviceTypeDetailList, getModels } from '@/api/deviceManage/deviceType';
+import { getProductor } from '@/api/supplierManage/index';
+import { deepClone } from '@/utils';
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 const deviceList = ref([]);
 const buttonLoading = ref(false);
@@ -221,204 +376,403 @@ const queryFormRef = ref<ElFormInstance>();
 const deviceFormRef = ref<ElFormInstance>();
 const deviceScrapFormRef = ref<ElFormInstance>();
 const dialog = reactive<DialogOption>({
-    visible: false,
-    title: ''
+  visible: false,
+  title: ''
 });
 const qrDialog = ref(false);
-const deviceTypeOptions = ref([]);
+const dictGroup = reactive({
+  deviceTypeDetailOptions: [],
+})
 const { use_status } = toRefs<any>(proxy?.useDict('use_status'));
 const bdmap = ref(null);
+const positionMap = ref(null);
 const scrapForm = ref<any>({
-    reason: '',
-    scrapDate: ''
+  reason: '',
+  scrapDate: ''
 });
 const qrInfo = ref<any>({});
 const initFormData = {
-    id: undefined,
-    deviceTypeId: undefined,
-    xh: null,
-    remark: undefined,
-    brand: undefined,
-    linkName: '',
-    linkPhone: '',
-    ext1: undefined,
-    ext2: undefined
+  id: '',
+  name: '',
+  sn: '',
+  devTypeDetailId: '',
+  productorId: '',
+  modelId: '',
+  useTime: '',
+  qualityEndTime: '',
+  status: '',
+  remark: '',
+  dataPoints: '{}',
+  controlFuncs: '{}',
+  events: '{}',
+  ext1: <any>{
+    brand: '',
+    xh: '',
+    longitude: '',
+    latitude: '',
+    address: ''
+  },
+  ext2: '{}'
 };
 const formData = reactive({
-    form: { ...initFormData },
-    queryParams: {
-        pageNum: 1,
-        pageSize: 10,
-        name: undefined,
-        sn: undefined,
-        status: undefined,
-        params: {}
-    }
+  form: { ...initFormData },
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    name: undefined,
+    sn: undefined,
+    status: undefined,
+    params: {}
+  }
 });
 
 const { queryParams, form } = toRefs(formData);
 let ifEdit = computed(() => {
-    return dialog.title.includes('修改');
+  return dialog.title.includes('修改');
 });
 const drawer = ref(false);
+const detailDrawer = ref(false);
+const curRow = ref<any>({ ext1: {} })
+const detailTab = ref('1')
+const detailCollapse = ref(['1', '2'])
+const detailModel = ref('1')
+const repairData = ref([]);
+const recordData = ref([]);
 /** 查询设备类型信息列表 */
 const getList = async () => {
-    loading.value = true;
-    const res = await listDevice(queryParams.value);
-    deviceList.value = res.rows;
-    deviceList.value = [
-        {
-            name: '设备一',
-            deviceSystem: '制冷系统',
-            sn: '1002301',
-            brand: '格力',
-            xh: 'GL18L',
-            fixedId: '202410280101',
-            useDate: '2024-10-28',
-            qaDate: '2028-10-29',
-            qaStatus: '在保',
-            useStatus: '1',
-            runningStatus: '在线'
-        }
-    ];
-    total.value = res.total;
-    loading.value = false;
+  loading.value = true;
+  const res = await listDevice(queryParams.value);
+  deviceList.value = res.rows.map((item) => ({
+    ...item,
+    controlFuncs: item.controlFuncs !== '{}' ? JSON.parse(item.controlFuncs) : [],
+    dataPoints: item.dataPoints !== '{}' ? JSON.parse(item.dataPoints) : [],
+    events: item.events !== '{}' ? JSON.parse(item.events) : [],
+    ext1: item.ext1 ? JSON.parse(item.ext1) : null
+  }));;
+  total.value = res.total;
+  loading.value = false;
 };
 const showQrCode = (row) => {
-    qrDialog.value = true;
-    Object.assign(qrInfo.value, row);
+  qrDialog.value = true;
+  Object.assign(qrInfo.value, row);
 };
 const initMap = () => {
-    var map = new BMapGL.Map('map'); // 创建地图实例
-    var point = new BMapGL.Point(118.879999, 32.016216); // 创建点坐标
-    map.centerAndZoom(point, 20);
-    map.enableScrollWheelZoom(true);
-    map.addEventListener('click', (evt) => {
-        bdmap.value.clearOverlays();
-        const { lng, lat } = evt.latlng;
-        const pt = new BMapGL.Point(lng, lat);
-        const marker = new BMapGL.Marker(pt);
-        bdmap.value.addOverlay(marker);
-    });
-    bdmap.value = map;
+  var map = new BMapGL.Map('map'); // 创建地图实例
+  var point = new BMapGL.Point(118.879999, 32.016216); // 创建点坐标
+  map.centerAndZoom(point, 20);
+  map.enableScrollWheelZoom(true);
+  const geoc = new BMapGL.Geocoder();
+  map.addEventListener('click', (evt) => {
+    bdmap.value.clearOverlays();
+    const { lng, lat } = evt.latlng;
+    form.value.ext1.longitude = lng
+    form.value.ext1.latitude = lat
+    const pt = new BMapGL.Point(lng, lat);
+    const marker = new BMapGL.Marker(pt);
+    bdmap.value.addOverlay(marker);
+    geoc.getLocation(pt, function (rs) {
+      var addComp = rs.addressComponents;
+      var address = addComp.province + addComp.city + addComp.district + addComp.street + addComp.streetNumber;
+      form.value.ext1.address = address
+      var label = new BMapGL.Label(address, {       // 创建文本标注
+        position: pt,                          // 设置标注的地理位置
+        offset: new BMapGL.Size(-90, 0)           // 设置标注的偏移量
+      })
+      label.setStyle({                              // 设置label的样式
+        color: '#000',
+        fontSize: '14px',
+        border: 'none',
+        background: 'transparent',
+        fontWeight: 400
+      })
+      bdmap.value.addOverlay(label);
+    })
+
+  });
+  bdmap.value = map;
 };
 /** 取消按钮 */
 const cancel = () => {
-    reset();
-    dialog.visible = false;
+  reset();
+  dialog.visible = false;
 };
 
 /** 表单重置 */
 const reset = () => {
-    form.value = { ...initFormData };
-    deviceFormRef.value?.resetFields();
+  form.value = deepClone(initFormData);
+  deviceFormRef.value?.resetFields();
 };
 
 /** 搜索按钮操作 */
 const handleQuery = () => {
-    queryParams.value.pageNum = 1;
-    getList();
+  queryParams.value.pageNum = 1;
+  getList();
 };
 
 /** 重置按钮操作 */
 const resetQuery = () => {
-    queryFormRef.value?.resetFields();
-    handleQuery();
+  queryFormRef.value?.resetFields();
+  handleQuery();
 };
 
 /** 多选框选中数据 */
 const handleSelectionChange = (selection) => {
-    ids.value = selection.map((item) => item.id);
-    single.value = selection.length != 1;
-    multiple.value = !selection.length;
+  ids.value = selection.map((item) => item.id);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
 };
 
 /** 新增按钮操作 */
 const handleAdd = () => {
-    reset();
-    dialog.visible = true;
-    dialog.title = '新增设备';
-    setTimeout(() => {
-        initMap();
-    }, 100);
+  reset();
+  dialog.visible = true;
+  dialog.title = '新增设备';
+  setTimeout(() => {
+    initMap();
+  }, 100);
 };
 
 /** 修改按钮操作 */
 const handleUpdate = async (row) => {
-    reset();
-    // const _id = row?.id || ids.value[0];
-    // const res = await getDevice(_id);
-    // Object.assign(form.value, res.data);
-    dialog.visible = true;
-    dialog.title = '修改设备';
-    setTimeout(() => {
-        initMap();
-    }, 100);
+  reset();
+  const _id = row?.id || ids.value[0];
+  const res = await getDevice(_id);
+  res.data.ext1 = res.data.ext1 && JSON.parse(res.data.ext1);
+  Object.assign(form.value, res.data);
+  dialog.visible = true;
+  dialog.title = '修改设备';
+  setTimeout(() => {
+    initMap();
+    const { longitude, latitude, address } = form.value.ext1
+    if (longitude) {
+      const pt = new BMapGL.Point(longitude, latitude);
+      const marker = new BMapGL.Marker(pt);
+      bdmap.value.addOverlay(marker);
+      var label = new BMapGL.Label(address, {       // 创建文本标注
+        position: pt,                          // 设置标注的地理位置
+        offset: new BMapGL.Size(-90, 0)           // 设置标注的偏移量
+      })
+      label.setStyle({                              // 设置label的样式
+        color: '#000',
+        fontSize: '14px',
+        border: 'none',
+        background: 'transparent',
+        fontWeight: 400
+      })
+      bdmap.value.addOverlay(label);
+      bdmap.value.centerAndZoom(pt, 20);
+    }
+  }, 100);
 };
 const handleScrap = (row) => {
-    drawer.value = true;
-    deviceScrapFormRef.value?.resetFields();
-    Object.assign(scrapForm.value, row);
+  drawer.value = true;
+  deviceScrapFormRef.value?.resetFields();
+  Object.assign(scrapForm.value, deepClone(row));
 };
 /** 提交按钮 */
 const submitForm = () => {
-    deviceFormRef.value?.validate(async (valid: boolean) => {
-        if (valid) {
-            buttonLoading.value = true;
-            if (form.value.id) {
-                await updateDevice(form.value).finally(() => (buttonLoading.value = false));
-            } else {
-                await addDevice(form.value).finally(() => (buttonLoading.value = false));
-            }
-            proxy?.$modal.msgSuccess('操作成功');
-            dialog.visible = false;
-            await getList();
-        }
-    });
+  deviceFormRef.value?.validate(async (valid: boolean) => {
+    if (valid) {
+      buttonLoading.value = true;
+      const { ext1 } = form.value;
+      const params = Object.assign(form.value, { ext1: JSON.stringify(ext1) });
+      if (form.value.id) {
+        await updateDevice(params).finally(() => (buttonLoading.value = false));
+      } else {
+        await addDevice(params).finally(() => (buttonLoading.value = false));
+      }
+      proxy?.$modal.msgSuccess('操作成功');
+      dialog.visible = false;
+      await getList();
+    }
+  });
 };
 
 /** 删除按钮操作 */
 const handleDelete = async (row) => {
-    const _ids = row?.id || ids.value;
-    await proxy?.$modal.confirm('是否确认删除？').finally(() => (loading.value = false));
-    await delDevice(_ids);
-    proxy?.$modal.msgSuccess('删除成功');
-    await getList();
+  const _ids = row?.id || ids.value;
+  await proxy?.$modal.confirm('是否确认删除？').finally(() => (loading.value = false));
+  await delDevice(_ids);
+  proxy?.$modal.msgSuccess('删除成功');
+  await getList();
 };
-const getDeviceTypeList = () => {
-    listDeviceType({}).then(({ code, rows }) => {
-        if (code === 200) {
-            deviceTypeOptions.value = rows;
-        }
-    });
+const getDeviceTypeList = async () => {
+  let deviceTypeList = []
+  await listDeviceType({}).then(({ code, rows }) => {
+    if (code === 200) {
+      deviceTypeList = rows || []
+    }
+  })
+  let deviceTypeDetailList = []
+  await getDeviceTypeDetailList({}).then(({ code, rows }) => {
+    if (code === 200) {
+      deviceTypeDetailList = rows.map((item) => ({
+        ...item,
+        deviceType: {},
+        ext1: item.ext1 ? JSON.parse(item.ext1) : null
+      }));
+    }
+  });
+  deviceTypeDetailList.forEach(item => {
+    deviceTypeList.forEach(el => {
+      if (item.deviceTypeId === el.id) {
+        item.deviceType = el
+      }
+    })
+  })
+  dictGroup.deviceTypeDetailOptions = deviceTypeDetailList
 };
-const confirmClick = () => {
-    deviceScrapFormRef.value?.validate(async (valid: boolean) => {
-        if (valid) {
-            drawer.value = false;
-        }
+const devTypeDetailChange = (val) => {
+  if (val) {
+    const [{ ext1: { brand }, xh, productorId, deviceType: { modeId } }] = dictGroup.deviceTypeDetailOptions.filter(item => item.id === val)
+    form.value.ext1.brand = brand
+    form.value.ext1.xh = xh
+    form.value.productorId = productorId
+    form.value.modelId = modeId
+    getModels(modeId).then(({ code, data }) => {
+      if (code === 200) {
+        form.value.dataPoints = data.dataPoints || '{}';
+        form.value.controlFuncs = data.controlFuncs || '{}';
+        form.value.events = data.events || '{}';
+      }
     });
+  }
+
+}
+const confirmClick = () => {
+  deviceScrapFormRef.value?.validate(async (valid: boolean) => {
+    if (valid) {
+      drawer.value = false;
+      const { ext1, reason, scrapDate } = scrapForm.value;
+      ext1.reason = reason
+      ext1.scrapDate = scrapDate
+      const params = Object.assign(scrapForm.value, { ext1: JSON.stringify(ext1), status: '3' });
+      await updateDevice(params)
+      proxy?.$modal.msgSuccess('操作成功');
+      dialog.visible = false;
+      await getList();
+    }
+  });
 };
+const initPositionMap = () => {
+  const map = new BMapGL.Map('positionMap'); // 创建地图实例
+  map.enableScrollWheelZoom(true);
+  positionMap.value = map;
+  const { longitude, latitude, address } = curRow.value.ext1
+  if (longitude) {
+    const pt = new BMapGL.Point(longitude, latitude);
+    const marker = new BMapGL.Marker(pt);
+    positionMap.value.addOverlay(marker);
+    var label = new BMapGL.Label(address, {       // 创建文本标注
+      position: pt,                          // 设置标注的地理位置
+      offset: new BMapGL.Size(-90, 0)           // 设置标注的偏移量
+    })
+    label.setStyle({                              // 设置label的样式
+      color: '#000',
+      fontSize: '14px',
+      border: 'none',
+      background: 'transparent',
+      fontWeight: 400
+    })
+    positionMap.value.addOverlay(label);
+    positionMap.value.centerAndZoom(pt, 20);
+  }
+}
+const showDetail = async (row) => {
+  detailDrawer.value = true
+  detailTab.value = '1'
+  detailCollapse.value = ['1', '2']
+  detailModel.value = '1'
+  curRow.value = row
+  await getProductor(row.productorId).then(({ data }) => {
+    curRow.value.productorName = data.name
+    curRow.value.linkName = data.contact
+    curRow.value.linkPhone = data.phone
+  })
+  await getDeviceTypeDetail(row.devTypeDetailId).then(res => {
+    getDeviceType(res.data.deviceTypeId).then(result => {
+      if (result.data.ext1) {
+        curRow.value.systemName = JSON.parse(result.data.ext1).systemName
+      }
+    })
+  })
+  initPositionMap()
+}
 onMounted(() => {
-    getList();
-    getDeviceTypeList();
+  getList();
+  getDeviceTypeList();
 });
 </script>
 <style lang="scss" scoped>
 .bdmap {
-    width: 100%;
-    height: 250px;
+  width: 100%;
+  height: 250px;
 }
+
 .custom-descriptions {
-    :deep(.is-bordered-label) {
-        width: 25%;
-        font-weight: 500;
+  :deep(.is-bordered-label) {
+    width: 25%;
+    font-weight: 500;
+  }
+}
+
+.detail-descriptions {
+  :deep(.is-bordered-label) {
+    width: 15%;
+  }
+}
+
+.timeline-label {
+  display: flex;
+  align-items: center;
+
+  >div {
+    flex: 1;
+
+    &:first-child {
+      font-weight: 500;
     }
+  }
+
 }
+
 .qrImg {
-    position: absolute;
-    bottom: 35px;
-    right: 35px;
-    height: 150px;
+  position: absolute;
+  bottom: 35px;
+  right: 35px;
+  height: 150px;
+}
+</style>
+<style lang="scss">
+.customDrawer {
+  .el-drawer__header {
+    align-items: flex-start !important;
+    margin-bottom: 10px;
+
+    .drawer-title {
+      .el-descriptions__body {
+        margin-top: 10px;
+        background-color: #F4F5F7;
+        border-radius: 2px;
+        padding: 10px 10px 0 10px;
+      }
+
+      .el-descriptions__label {
+        padding-bottom: 5px;
+      }
+
+      .title-name {
+        color: #000;
+      }
+    }
+  }
+
+  .el-drawer__body {
+    padding-top: 0;
+
+    .el-collapse-item__content {
+      padding-bottom: 8px;
+    }
+  }
 }
 </style>

src/views/deviceManage/deviceType/index.vue

@@ -1,313 +1,278 @@
 <template>
-    <div class="p-2">
-        <el-row :gutter="10">
-            <el-col :span="5">
-                <el-card>
-                    <template #header>
-                        <div class="card-header">
-                            <span>分项系统</span>
-                            <el-icon color="#409EFF" @click="addSystem">
-                                <Plus />
-                            </el-icon>
-                        </div>
-                    </template>
-                    <div>
-                        <el-input v-model="filterText" style="width: 200px" placeholder="请输入关键字" />
-                        <el-tree
-                            ref="treeRef"
-                            style="max-width: 600px; margin-top: 5px"
-                            class="filter-tree"
-                            :props="defaultProps"
-                            :data="treeData"
-                            node-key="id"
-                            default-expand-all
-                            highlight-current
-                            :expand-on-click-node="false"
-                            :filter-node-method="filterNode"
-                            @node-click="handleNodeClick"
-                        >
-                            <template #default="{ node, data }">
-                                <div class="custom-tree-node">
-                                    <span>{{ node.label }}</span>
-                                    <el-popover placement="bottom" :popper-style="{ 'width': '70px', 'min-width': '70px' }" trigger="click">
-                                        <div class="node-operateBtns">
-                                            <div @click="addSystem(data)">新增</div>
-                                            <div @click="editSystem(node, data)">编辑</div>
-                                            <div @click="delSystem(node, data)">删除</div>
-                                        </div>
-                                        <template #reference>
-                                            <el-icon>
-                                                <Setting />
-                                            </el-icon>
-                                        </template>
-                                    </el-popover>
-                                </div>
-                            </template>
-                        </el-tree>
-                    </div>
-                </el-card>
-            </el-col>
-            <el-col :span="19">
-                <transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
-                    <div v-show="showSearch" class="mb-[10px]">
-                        <el-card shadow="hover">
-                            <el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="100px">
-                                <el-form-item label="设备类型名称" prop="name">
-                                    <el-input v-model="queryParams.name" placeholder="请输入设备类型名称" clearable @keyup.enter="handleQuery" />
-                                </el-form-item>
-                                <el-form-item>
-                                    <el-button type="primary" icon="Search" @click="handleQuery"> 搜索 </el-button>
-                                    <el-button icon="Refresh" @click="resetQuery"> 重置 </el-button>
-                                </el-form-item>
-                            </el-form>
-                        </el-card>
+  <div class="p-2">
+    <el-row :gutter="10">
+      <el-col :span="5">
+        <el-card>
+          <template #header>
+            <div class="card-header">
+              <span>分项系统</span>
+              <el-icon color="#409EFF" @click="addSystem">
+                <Plus />
+              </el-icon>
+            </div>
+          </template>
+          <div>
+            <el-input v-model="filterText" style="width: 200px" placeholder="请输入关键字" />
+            <el-tree ref="treeRef" style="max-width: 600px; margin-top: 5px" class="filter-tree" :props="defaultProps"
+              :data="treeData" node-key="id" default-expand-all highlight-current :expand-on-click-node="false"
+              :filter-node-method="filterNode" @node-click="handleNodeClick">
+              <template #default="{ node, data }">
+                <div class="custom-tree-node">
+                  <span>{{ node.label }}</span>
+                  <el-popover placement="bottom" :popper-style="{ 'width': '70px', 'min-width': '70px' }"
+                    trigger="click">
+                    <div class="node-operateBtns">
+                      <div @click="addSystem(data)">新增</div>
+                      <div @click="editSystem(node, data)">编辑</div>
+                      <div @click="delSystem(node, data)">删除</div>
                     </div>
-                </transition>
-
-                <el-card shadow="never">
-                    <template #header>
-                        <el-row :gutter="10" class="mb8">
-                            <el-col :span="1.5">
-                                <el-button v-hasPermi="['jdyw:deviceType:add']" type="primary" plain icon="Plus" @click="handleAdd"> 新增 </el-button>
-                            </el-col>
-                            <el-col :span="1.5">
-                                <el-button
-                                    v-hasPermi="['jdyw:deviceType:edit']"
-                                    type="success"
-                                    plain
-                                    icon="Edit"
-                                    :disabled="single"
-                                    @click="handleUpdate"
-                                >
-                                    修改
-                                </el-button>
-                            </el-col>
-                            <el-col :span="1.5">
-                                <el-button
-                                    v-hasPermi="['jdyw:deviceType:remove']"
-                                    type="danger"
-                                    plain
-                                    icon="Delete"
-                                    :disabled="multiple"
-                                    @click="handleDelete"
-                                >
-                                    删除
-                                </el-button>
-                            </el-col>
-                            <right-toolbar v-model:showSearch="showSearch" @query-table="getList" />
-                        </el-row>
+                    <template #reference>
+                      <el-icon>
+                        <Setting />
+                      </el-icon>
                     </template>
-
-                    <el-table v-loading="loading" :data="deviceTypeList" @selection-change="handleSelectionChange">
-                        <el-table-column type="selection" width="55" align="center" />
-                        <el-table-column label="设备类型名称" align="center" prop="name" />
-                        <el-table-column label="设备等级" align="center" prop="deviceLevel" />
-                        <el-table-column label="分项系统" align="center" show-overflow-tooltip prop="systemId">
-                            <template #default="scope">
-                                {{ findNameWithParents(treeData, scope.row.systemId, '') }}
-                            </template>
-                        </el-table-column>
-                        <el-table-column label="备注" align="center" prop="remark" />
-                        <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
-                            <template #default="scope">
-                                <el-button v-hasPermi="['jdyw:deviceType:edit']" size="small" link type="primary" @click="handleUpdate(scope.row)"
-                                    >修改</el-button
-                                >
-                                <el-button v-hasPermi="['jdyw:deviceType:edit']" size="small" link type="primary" @click="handleModel(scope.row)"
-                                    >物模型</el-button
-                                >
-                                <el-button v-hasPermi="['jdyw:deviceType:remove']" size="small" link type="danger" @click="handleDelete(scope.row)"
-                                    >删除</el-button
-                                >
-                            </template>
-                        </el-table-column>
-                    </el-table>
-                    <pagination
-                        v-show="total > 0"
-                        v-model:page="queryParams.pageNum"
-                        v-model:limit="queryParams.pageSize"
-                        :total="total"
-                        @pagination="getList"
-                    />
-                </el-card>
-            </el-col>
-        </el-row>
-
-        <!-- 添加或修改设备类型信息对话框 -->
-        <el-dialog v-model="dialog.visible" :title="dialog.title" width="500px" append-to-body>
-            <el-form ref="deviceTypeFormRef" :model="form" :rules="rules" label-width="110px">
-                <el-form-item label="设备类型名称" prop="name">
-                    <el-input v-model="form.name" placeholder="请输入设备类型名称" />
-                </el-form-item>
-                <el-form-item label="设备等级" prop="deviceLevel">
-                    <el-select v-model="form.deviceLevel" placeholder="请选择设备等级">
-                        <el-option v-for="dict in device_level" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item label="分项系统" prop="systemId">
-                    <el-tree-select
-                        v-model="form.systemId"
-                        :props="defaultProps"
-                        node-key="id"
-                        :data="treeData"
-                        default-expand-all
-                        :check-strictly="true"
-                        :render-after-expand="false"
-                    />
-                </el-form-item>
-                <el-form-item label="备注" prop="remark">
-                    <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
-                </el-form-item>
-            </el-form>
-            <template #footer>
-                <div class="dialog-footer">
-                    <el-button :loading="buttonLoading" type="primary" @click="submitForm"> 确 定 </el-button>
-                    <el-button @click="cancel"> 取 消 </el-button>
-                </div>
-            </template>
-        </el-dialog>
-        <el-dialog v-model="systemDialog.visible" :title="systemDialog.title" width="500px" append-to-body>
-            <el-form ref="deviceSystemFormRef" :model="systemForm" label-width="120px">
-                <el-form-item label="上级分项系统" prop="parentName" required>
-                    <el-input v-model="systemForm.parentName" disabled placeholder="请选择上级分项系统" />
-                </el-form-item>
-                <el-form-item label="系统名称" prop="name" required :rules="[{ required: true, message: '请输入系统名称' }]">
-                    <el-input v-model="systemForm.name" placeholder="请输入系统名称" />
-                </el-form-item>
-            </el-form>
-            <template #footer>
-                <div class="dialog-footer">
-                    <el-button :loading="buttonLoading" type="primary" @click="submitSystemForm"> 确 定 </el-button>
-                    <el-button @click="systemDialog.visible = false"> 取 消 </el-button>
-                </div>
-            </template>
-        </el-dialog>
-        <el-drawer v-model="rightDrawer" size="70%" class="customDrawer">
-            <template #header>
-                <div class="drawer-title">
-                    <div class="title-name">物模型</div>
-                    <el-descriptions style="margin-top: 10px" direction="vertical" title="" :column="4" border>
-                        <el-descriptions-item label="设备名称">{{ curRow.name }}</el-descriptions-item>
-                        <el-descriptions-item label="分项系统">{{ findNameWithParents(treeData, curRow.systemId, '') }}</el-descriptions-item>
-                        <el-descriptions-item label="设备等级">{{ curRow.deviceLevel }}</el-descriptions-item>
-                    </el-descriptions>
+                  </el-popover>
                 </div>
-            </template>
-            <el-tabs v-model="activeName" class="demo-tabs">
-                <el-tab-pane label="属性定义" name="dataPoints">
-                    <el-button size="small" type="primary" @click="addModel">新增</el-button>
-                    <el-table :data="modelData.dataPoints" style="margin-top: 10px">
-                        <el-table-column label="属性" align="center" prop="name" />
-                        <el-table-column label="属性值" align="center" prop="value" />
-                        <el-table-column label="单位" align="center" prop="unit" />
-                        <el-table-column label="描述" align="center" prop="remark" />
-                        <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
-                            <template #default="scope">
-                                <el-button size="small" link type="primary" @click="editModel(scope.$index)">修改</el-button>
-                                <el-button size="small" link type="danger" @click="delModel(scope.$index)">删除</el-button>
-                            </template>
-                        </el-table-column>
-                    </el-table>
-                </el-tab-pane>
-                <el-tab-pane label="能力定义" name="controlFuncs">
-                    <el-button size="small" type="primary" @click="addModel">新增</el-button>
-                    <el-table :data="modelData.controlFuncs" style="margin-top: 10px">
-                        <el-table-column label="能力名称" align="center" prop="name" />
-                        <el-table-column label="下发参数" align="center" prop="value" />
-                        <el-table-column label="描述" align="center" prop="remark" />
-                        <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
-                            <template #default="scope">
-                                <el-button size="small" link type="primary" @click="editModel(scope.$index)">修改</el-button>
-                                <el-button size="small" link type="danger" @click="delModel(scope.$index)">删除</el-button>
-                            </template>
-                        </el-table-column>
-                    </el-table>
-                </el-tab-pane>
-                <el-tab-pane label="事件定义" name="events">
-                    <el-button size="small" type="primary" @click="addModel">新增</el-button>
-                    <el-table :data="modelData.events" style="margin-top: 10px">
-                        <el-table-column label="事件名称" align="center" prop="name" />
-                        <el-table-column label="事件类型" align="center" prop="type" />
-                        <el-table-column label="事件代码" align="center" prop="code" />
-                        <el-table-column label="外部事件代码" align="center" prop="outerCode" />
-                        <el-table-column label="描述" align="center" prop="remark" />
-                        <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
-                            <template #default="scope">
-                                <el-button size="small" link type="primary" @click="editModel(scope.$index)">修改</el-button>
-                                <el-button size="small" link type="danger" @click="delModel(scope.$index)">删除</el-button>
-                            </template>
-                        </el-table-column>
-                    </el-table>
-                </el-tab-pane>
-            </el-tabs>
-        </el-drawer>
-        <el-dialog v-model="modelDialog.visible" :title="modelDialog.title" width="500px" append-to-body>
-            <el-form v-if="activeName == 'dataPoints'" ref="modelFormRef" :model="modelData.dataPointsForm" label-width="120px">
-                <el-form-item label="属性名称" prop="name" :rules="[{ required: true, message: '请输入属性名称' }]">
-                    <el-input v-model="modelData.dataPointsForm.name" placeholder="请输入属性名称" />
-                </el-form-item>
-                <el-form-item label="属性值" prop="value" :rules="[{ required: true, message: '请输入属性值' }]">
-                    <el-input v-model="modelData.dataPointsForm.value" placeholder="请输入属性值" />
-                </el-form-item>
-                <el-form-item label="单位" prop="unit" :rules="[{ required: true, message: '请输入单位' }]">
-                    <el-input v-model="modelData.dataPointsForm.unit" placeholder="请输入单位" />
-                </el-form-item>
-                <el-form-item label="描述" prop="remark">
-                    <el-input v-model="modelData.dataPointsForm.remark" placeholder="请输入描述" />
-                </el-form-item>
-            </el-form>
-            <el-form v-else-if="activeName == 'controlFuncs'" ref="modelFormRef" :model="modelData.controlFuncsForm" label-width="120px">
-                <el-form-item label="能力名称" prop="name" :rules="[{ required: true, message: '请输入能力名称' }]">
-                    <el-input v-model="modelData.controlFuncsForm.name" placeholder="请输入能力名称" />
-                </el-form-item>
-                <el-form-item label="下发参数" prop="value" :rules="[{ required: true, message: '请输入下发参数' }]">
-                    <el-input v-model="modelData.controlFuncsForm.value" placeholder="请输入下发参数" />
-                </el-form-item>
-                <el-form-item label="描述" prop="remark">
-                    <el-input v-model="modelData.controlFuncsForm.unit" placeholder="请输入描述" />
-                </el-form-item>
-            </el-form>
-            <el-form v-else-if="activeName == 'events'" ref="modelFormRef" :model="modelData.eventsForm" label-width="120px">
-                <el-form-item label="事件名称" prop="name" :rules="[{ required: true, message: '请输入事件名称' }]">
-                    <el-input v-model="modelData.eventsForm.name" placeholder="请输入事件名称" />
-                </el-form-item>
-                <el-form-item label="事件类型" prop="type" :rules="[{ required: true, message: '请输入事件类型' }]">
-                    <el-input v-model="modelData.eventsForm.type" placeholder="请输入事件类型" />
-                </el-form-item>
-                <el-form-item label="事件代码" prop="code" :rules="[{ required: true, message: '请输入事件代码' }]">
-                    <el-input v-model="modelData.eventsForm.code" placeholder="请输入事件代码" />
-                </el-form-item>
-                <el-form-item label="外部事件代码" prop="outerCode" :rules="[{ required: true, message: '请输入外部事件代码' }]">
-                    <el-input v-model="modelData.eventsForm.outerCode" placeholder="请输入外部事件代码" />
+              </template>
+            </el-tree>
+          </div>
+        </el-card>
+      </el-col>
+      <el-col :span="19">
+        <transition :enter-active-class="proxy?.animate.searchAnimate.enter"
+          :leave-active-class="proxy?.animate.searchAnimate.leave">
+          <div v-show="showSearch" class="mb-[10px]">
+            <el-card shadow="hover">
+              <el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="100px">
+                <el-form-item label="设备类型名称" prop="name">
+                  <el-input v-model="queryParams.name" placeholder="请输入设备类型名称" clearable @keyup.enter="handleQuery" />
                 </el-form-item>
-                <el-form-item label="描述" prop="remark">
-                    <el-input v-model="modelData.eventsForm.remark" placeholder="请输入描述" />
+                <el-form-item>
+                  <el-button type="primary" icon="Search" @click="handleQuery"> 搜索 </el-button>
+                  <el-button icon="Refresh" @click="resetQuery"> 重置 </el-button>
                 </el-form-item>
-            </el-form>
-            <template #footer>
-                <div class="dialog-footer">
-                    <el-button :loading="buttonLoading" type="primary" @click="submitModelForm"> 确 定 </el-button>
-                    <el-button @click="modelDialog.visible = false"> 取 消 </el-button>
-                </div>
-            </template>
-        </el-dialog>
-    </div>
+              </el-form>
+            </el-card>
+          </div>
+        </transition>
+
+        <el-card shadow="never">
+          <template #header>
+            <el-row :gutter="10" class="mb8">
+              <el-col :span="1.5">
+                <el-button v-hasPermi="['jdyw:deviceType:add']" type="primary" plain icon="Plus" @click="handleAdd"> 新增
+                </el-button>
+              </el-col>
+              <el-col :span="1.5">
+                <el-button v-hasPermi="['jdyw:deviceType:edit']" type="success" plain icon="Edit" :disabled="single"
+                  @click="handleUpdate">
+                  修改
+                </el-button>
+              </el-col>
+              <el-col :span="1.5">
+                <el-button v-hasPermi="['jdyw:deviceType:remove']" type="danger" plain icon="Delete"
+                  :disabled="multiple" @click="handleDelete">
+                  删除
+                </el-button>
+              </el-col>
+              <right-toolbar v-model:showSearch="showSearch" @query-table="getList" />
+            </el-row>
+          </template>
+
+          <el-table v-loading="loading" :data="deviceTypeList" @selection-change="handleSelectionChange">
+            <el-table-column type="selection" width="55" align="center" />
+            <el-table-column label="设备类型名称" align="center" prop="name" />
+            <el-table-column label="设备等级" align="center" prop="deviceLevel" />
+            <el-table-column label="分项系统" align="center" show-overflow-tooltip prop="ext1.systemName" />
+            <el-table-column label="备注" align="center" prop="remark" />
+            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+              <template #default="scope">
+                <el-button v-hasPermi="['jdyw:deviceType:edit']" size="small" link type="primary"
+                  @click="handleUpdate(scope.row)">修改</el-button>
+                <el-button v-hasPermi="['jdyw:deviceType:edit']" size="small" link type="primary"
+                  @click="handleModel(scope.row)">物模型</el-button>
+                <el-button v-hasPermi="['jdyw:deviceType:remove']" size="small" link type="danger"
+                  @click="handleDelete(scope.row)">删除</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+          <pagination v-show="total > 0" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize"
+            :total="total" @pagination="getList" />
+        </el-card>
+      </el-col>
+    </el-row>
+
+    <!-- 添加或修改设备类型信息对话框 -->
+    <el-dialog v-model="dialog.visible" :title="dialog.title" width="500px" append-to-body>
+      <el-form ref="deviceTypeFormRef" :model="form" :rules="rules" label-width="110px">
+        <el-form-item label="设备类型名称" prop="name">
+          <el-input v-model="form.name" placeholder="请输入设备类型名称" />
+        </el-form-item>
+        <el-form-item label="设备等级" prop="deviceLevel">
+          <el-select v-model="form.deviceLevel" placeholder="请选择设备等级">
+            <el-option v-for="dict in device_level" :key="dict.value" :label="dict.label"
+              :value="dict.value"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="分项系统" prop="systemId">
+          <el-tree-select v-model="form.systemId" :props="defaultProps" node-key="id" :data="treeData" default-expand-all
+            :check-strictly="true" :render-after-expand="false" @change="getSystemName" />
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button :loading="buttonLoading" type="primary" @click="submitForm"> 确 定 </el-button>
+          <el-button @click="cancel"> 取 消 </el-button>
+        </div>
+      </template>
+    </el-dialog>
+    <el-dialog v-model="systemDialog.visible" :title="systemDialog.title" width="500px" append-to-body>
+      <el-form ref="deviceSystemFormRef" :model="systemForm" label-width="120px">
+        <el-form-item label="上级分项系统" prop="parentName" required>
+          <el-input v-model="systemForm.parentName" disabled placeholder="请选择上级分项系统" />
+        </el-form-item>
+        <el-form-item label="系统名称" prop="name" required :rules="[{ required: true, message: '请输入系统名称' }]">
+          <el-input v-model="systemForm.name" placeholder="请输入系统名称" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button :loading="buttonLoading" type="primary" @click="submitSystemForm"> 确 定 </el-button>
+          <el-button @click="systemDialog.visible = false"> 取 消 </el-button>
+        </div>
+      </template>
+    </el-dialog>
+    <el-drawer v-model="rightDrawer" size="70%" class="customDrawer">
+      <template #header>
+        <div class="drawer-title">
+          <div class="title-name">物模型</div>
+          <el-descriptions style="margin-top: 10px" direction="vertical" title="" :column="4" border>
+            <el-descriptions-item label="设备名称">{{ curRow.name }}</el-descriptions-item>
+            <el-descriptions-item label="分项系统">{{ curRow.ext1&&curRow.ext1.systemName}}</el-descriptions-item>
+            <el-descriptions-item label="设备等级">{{ curRow.deviceLevel }}</el-descriptions-item>
+          </el-descriptions>
+        </div>
+      </template>
+      <el-tabs v-model="activeName" class="demo-tabs">
+        <el-tab-pane label="属性定义" name="dataPoints">
+          <el-button size="small" type="primary" @click="addModel">新增</el-button>
+          <el-table :data="modelData.dataPoints" style="margin-top: 10px">
+            <el-table-column label="属性" align="center" prop="name" />
+            <el-table-column label="属性值" align="center" prop="value" />
+            <el-table-column label="单位" align="center" prop="unit" />
+            <el-table-column label="描述" align="center" prop="remark" />
+            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+              <template #default="scope">
+                <el-button size="small" link type="primary" @click="editModel(scope.$index)">修改</el-button>
+                <el-button size="small" link type="danger" @click="delModel(scope.$index)">删除</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </el-tab-pane>
+        <el-tab-pane label="能力定义" name="controlFuncs">
+          <el-button size="small" type="primary" @click="addModel">新增</el-button>
+          <el-table :data="modelData.controlFuncs" style="margin-top: 10px">
+            <el-table-column label="能力名称" align="center" prop="name" />
+            <el-table-column label="下发参数" align="center" prop="value" />
+            <el-table-column label="描述" align="center" prop="remark" />
+            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+              <template #default="scope">
+                <el-button size="small" link type="primary" @click="editModel(scope.$index)">修改</el-button>
+                <el-button size="small" link type="danger" @click="delModel(scope.$index)">删除</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </el-tab-pane>
+        <el-tab-pane label="事件定义" name="events">
+          <el-button size="small" type="primary" @click="addModel">新增</el-button>
+          <el-table :data="modelData.events" style="margin-top: 10px">
+            <el-table-column label="事件名称" align="center" prop="name" />
+            <el-table-column label="事件类型" align="center" prop="type" />
+            <el-table-column label="事件代码" align="center" prop="code" />
+            <el-table-column label="外部事件代码" align="center" prop="outerCode" />
+            <el-table-column label="描述" align="center" prop="remark" />
+            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+              <template #default="scope">
+                <el-button size="small" link type="primary" @click="editModel(scope.$index)">修改</el-button>
+                <el-button size="small" link type="danger" @click="delModel(scope.$index)">删除</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </el-tab-pane>
+      </el-tabs>
+    </el-drawer>
+    <el-dialog v-model="modelDialog.visible" :title="modelDialog.title" width="500px" append-to-body>
+      <el-form v-if="activeName == 'dataPoints'" ref="modelFormRef" :model="modelData.dataPointsForm"
+        label-width="120px">
+        <el-form-item label="属性名称" prop="name" :rules="[{ required: true, message: '请输入属性名称' }]">
+          <el-input v-model="modelData.dataPointsForm.name" placeholder="请输入属性名称" />
+        </el-form-item>
+        <el-form-item label="属性值" prop="value" :rules="[{ required: true, message: '请输入属性值' }]">
+          <el-input v-model="modelData.dataPointsForm.value" placeholder="请输入属性值" />
+        </el-form-item>
+        <el-form-item label="单位" prop="unit" :rules="[{ required: true, message: '请输入单位' }]">
+          <el-input v-model="modelData.dataPointsForm.unit" placeholder="请输入单位" />
+        </el-form-item>
+        <el-form-item label="描述" prop="remark">
+          <el-input v-model="modelData.dataPointsForm.remark" placeholder="请输入描述" />
+        </el-form-item>
+      </el-form>
+      <el-form v-else-if="activeName == 'controlFuncs'" ref="modelFormRef" :model="modelData.controlFuncsForm"
+        label-width="120px">
+        <el-form-item label="能力名称" prop="name" :rules="[{ required: true, message: '请输入能力名称' }]">
+          <el-input v-model="modelData.controlFuncsForm.name" placeholder="请输入能力名称" />
+        </el-form-item>
+        <el-form-item label="下发参数" prop="value" :rules="[{ required: true, message: '请输入下发参数' }]">
+          <el-input v-model="modelData.controlFuncsForm.value" placeholder="请输入下发参数" />
+        </el-form-item>
+        <el-form-item label="描述" prop="remark">
+          <el-input v-model="modelData.controlFuncsForm.unit" placeholder="请输入描述" />
+        </el-form-item>
+      </el-form>
+      <el-form v-else-if="activeName == 'events'" ref="modelFormRef" :model="modelData.eventsForm" label-width="120px">
+        <el-form-item label="事件名称" prop="name" :rules="[{ required: true, message: '请输入事件名称' }]">
+          <el-input v-model="modelData.eventsForm.name" placeholder="请输入事件名称" />
+        </el-form-item>
+        <el-form-item label="事件类型" prop="type" :rules="[{ required: true, message: '请输入事件类型' }]">
+          <el-input v-model="modelData.eventsForm.type" placeholder="请输入事件类型" />
+        </el-form-item>
+        <el-form-item label="事件代码" prop="code" :rules="[{ required: true, message: '请输入事件代码' }]">
+          <el-input v-model="modelData.eventsForm.code" placeholder="请输入事件代码" />
+        </el-form-item>
+        <el-form-item label="外部事件代码" prop="outerCode" :rules="[{ required: true, message: '请输入外部事件代码' }]">
+          <el-input v-model="modelData.eventsForm.outerCode" placeholder="请输入外部事件代码" />
+        </el-form-item>
+        <el-form-item label="描述" prop="remark">
+          <el-input v-model="modelData.eventsForm.remark" placeholder="请输入描述" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button :loading="buttonLoading" type="primary" @click="submitModelForm"> 确 定 </el-button>
+          <el-button @click="modelDialog.visible = false"> 取 消 </el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
 </template>
 
 <script setup name="DeviceType" lang="ts">
 import {
-    listDeviceType,
-    getDeviceType,
-    delDeviceType,
-    addDeviceType,
-    updateDeviceType,
-    getDeviceSystemTree,
-    addDeviceSystem,
-    editDeviceSystem,
-    delDeviceSystem,
-    addModels,
-    editModels,
-    getModels
+  listDeviceType,
+  getDeviceType,
+  delDeviceType,
+  addDeviceType,
+  updateDeviceType,
+  getDeviceSystemTree,
+  addDeviceSystem,
+  editDeviceSystem,
+  delDeviceSystem,
+  addModels,
+  editModels,
+  getModels
 } from '@/api/deviceManage/deviceType';
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 
@@ -326,389 +291,408 @@ const modelFormRef = ref<ElFormInstance>();
 const filterText = ref('');
 const treeRef = ref<ElTreeInstance>();
 const filterNode = (value: string, data) => {
-    if (!value) return true;
-    return data.name.includes(value);
+  if (!value) return true;
+  return data.name.includes(value);
 };
 watch(filterText, (val) => {
-    treeRef.value!.filter(val);
+  treeRef.value!.filter(val);
 });
 const defaultProps = {
-    children: 'children',
-    label: 'name'
+  children: 'children',
+  label: 'name'
 };
 const treeData = ref([]);
 const dialog = reactive<DialogOption>({
-    visible: false,
-    title: ''
+  visible: false,
+  title: ''
 });
 const systemDialog = reactive<DialogOption>({
-    visible: false,
-    title: ''
+  visible: false,
+  title: ''
 });
 const { device_level } = toRefs<any>(proxy?.useDict('device_level'));
 const rightDrawer = ref(false);
 const curRow = ref<any>({});
 const activeName = ref('dataPoints');
 const systemForm = reactive({
-    id: '',
-    name: '',
-    parentId: 0,
-    parentName: ''
+  id: '',
+  name: '',
+  parentId: 0,
+  parentName: ''
 });
 
 const modelData = reactive<any>({
-    id: '',
+  id: '',
+  name: '',
+  dataPoints: [],
+  controlFuncs: [],
+  events: [],
+  dataPointsForm: {
     name: '',
-    dataPoints: [],
-    controlFuncs: [],
-    events: [],
-    dataPointsForm: {
-        name: '',
-        value: '',
-        unit: '',
-        remark: ''
-    },
-    controlFuncsForm: {
-        name: '',
-        value: '',
-        remark: ''
-    },
-    eventsForm: {
-        name: '',
-        type: '',
-        code: '',
-        outerCode: '',
-        remark: ''
-    }
+    value: '',
+    unit: '',
+    remark: ''
+  },
+  controlFuncsForm: {
+    name: '',
+    value: '',
+    remark: ''
+  },
+  eventsForm: {
+    name: '',
+    type: '',
+    code: '',
+    outerCode: '',
+    remark: ''
+  }
 });
 const editIndex = ref(null);
 const modelDialog = reactive<DialogOption>({
-    visible: false,
-    title: ''
+  visible: false,
+  title: ''
 });
 const initFormData = {
-    id: undefined,
-    name: undefined,
-    deviceLevel: undefined,
-    systemId: null,
-    modeId: undefined,
-    remark: undefined,
-    ext1: undefined,
-    ext2: undefined
+  id: undefined,
+  name: undefined,
+  deviceLevel: undefined,
+  systemId: null,
+  modeId: undefined,
+  remark: undefined,
+  ext1: {
+    systemName:'',
+  },
+  ext2: undefined
 };
 const formData = reactive({
-    form: { ...initFormData },
-    queryParams: {
-        pageNum: 1,
-        pageSize: 10,
-        name: undefined,
-        systemId: undefined,
-        params: {}
-    },
-    rules: {
-        name: [{ required: true, message: '设备类型名称不能为空', trigger: 'blur' }],
-        deviceLevel: [{ required: true, message: '设备等级不能为空', trigger: 'change' }],
-        systemId: [{ required: true, message: '分项系统不能为空', trigger: 'change' }]
-    }
+  form: { ...initFormData },
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    name: undefined,
+    systemId: undefined,
+    params: {}
+  },
+  rules: {
+    name: [{ required: true, message: '设备类型名称不能为空', trigger: 'blur' }],
+    deviceLevel: [{ required: true, message: '设备等级不能为空', trigger: 'change' }],
+    systemId: [{ required: true, message: '分项系统不能为空', trigger: 'change' }]
+  }
 });
 
 const { queryParams, form, rules } = toRefs(formData);
 
 /** 查询设备类型信息列表 */
 const getList = async () => {
-    loading.value = true;
-    const res = await listDeviceType(queryParams.value);
-    deviceTypeList.value = res.rows;
-    total.value = res.total;
-    loading.value = false;
+  loading.value = true;
+  const res = await listDeviceType(queryParams.value);
+  deviceTypeList.value = res.rows.map((item) => ({
+    ...item,
+    ext1: item.ext1 ? JSON.parse(item.ext1) : {}
+  }));;
+  total.value = res.total;
+  loading.value = false;
 };
 
 /** 取消按钮 */
 const cancel = () => {
-    reset();
-    dialog.visible = false;
+  reset();
+  dialog.visible = false;
 };
 
 /** 表单重置 */
 const reset = () => {
-    form.value = { ...initFormData };
-    deviceTypeFormRef.value?.resetFields();
+  form.value = { ...initFormData };
+  deviceTypeFormRef.value?.resetFields();
 };
 
 /** 搜索按钮操作 */
 const handleQuery = () => {
-    queryParams.value.pageNum = 1;
-    getList();
+  queryParams.value.pageNum = 1;
+  getList();
 };
 
 /** 重置按钮操作 */
 const resetQuery = () => {
-    queryFormRef.value?.resetFields();
-    handleQuery();
+  queryFormRef.value?.resetFields();
+  handleQuery();
 };
 
 /** 多选框选中数据 */
 const handleSelectionChange = (selection) => {
-    ids.value = selection.map((item) => item.id);
-    single.value = selection.length != 1;
-    multiple.value = !selection.length;
+  ids.value = selection.map((item) => item.id);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
 };
 
 /** 新增按钮操作 */
 const handleAdd = () => {
-    reset();
-    dialog.visible = true;
-    dialog.title = '新增设备类型信息';
+  reset();
+  dialog.visible = true;
+  dialog.title = '新增设备类型信息';
 };
 
 /** 修改按钮操作 */
 const handleUpdate = async (row) => {
-    reset();
-    const _id = row?.id || ids.value[0];
-    const res = await getDeviceType(_id);
-    Object.assign(form.value, res.data);
-    dialog.visible = true;
-    dialog.title = '修改设备类型信息';
+  reset();
+  const _id = row?.id || ids.value[0];
+  const res = await getDeviceType(_id);
+  res.data.ext1 = JSON.parse(res.data.ext1||'{}');
+  Object.assign(form.value, res.data);
+  dialog.visible = true;
+  dialog.title = '修改设备类型信息';
 };
 
 /** 提交按钮 */
 const submitForm = () => {
-    deviceTypeFormRef.value?.validate(async (valid: boolean) => {
-        if (valid) {
-            buttonLoading.value = true;
-            if (form.value.id) {
-                await updateDeviceType(form.value).finally(() => (buttonLoading.value = false));
-            } else {
-                await addDeviceType(form.value).finally(() => (buttonLoading.value = false));
-            }
-            proxy?.$modal.msgSuccess('操作成功');
-            dialog.visible = false;
-            await getList();
-        }
-    });
+  deviceTypeFormRef.value?.validate(async (valid: boolean) => {
+    if (valid) {
+      buttonLoading.value = true;
+      const { ext1 } = form.value;
+      const params = Object.assign(form.value, { ext1: JSON.stringify(ext1) });
+      if (form.value.id) {
+        await updateDeviceType(params).finally(() => (buttonLoading.value = false));
+      } else {
+        await addDeviceType(params).finally(() => (buttonLoading.value = false));
+      }
+      proxy?.$modal.msgSuccess('操作成功');
+      dialog.visible = false;
+      await getList();
+    }
+  });
 };
 
 /** 删除按钮操作 */
 const handleDelete = async (row) => {
-    const _ids = row?.id || ids.value;
-    await proxy?.$modal.confirm('是否确认删除设备类型信息编号为"' + _ids + '"的数据项？').finally(() => (loading.value = false));
-    await delDeviceType(_ids);
-    proxy?.$modal.msgSuccess('删除成功');
-    await getList();
+  const _ids = row?.id || ids.value;
+  await proxy?.$modal.confirm('是否确认删除设备类型信息编号为"' + _ids + '"的数据项？').finally(() => (loading.value = false));
+  await delDeviceType(_ids);
+  proxy?.$modal.msgSuccess('删除成功');
+  await getList();
 };
 
 const getTreeData = async () => {
-    getDeviceSystemTree({}).then(({ code, rows }) => {
-        if (code === 200) {
-            treeData.value = convertToTree(rows);
-            if (treeData.value.length === 0) {
-                treeData.value = [];
-            }
-        }
-    });
+  getDeviceSystemTree({}).then(({ code, rows }) => {
+    if (code === 200) {
+      treeData.value = convertToTree(rows);
+      if (treeData.value.length === 0) {
+        treeData.value = [];
+      }
+    }
+  });
 };
 const convertToTree = (list) => {
-    let map = new Map();
-    let root = [];
-    for (let item of list) {
-        map.set(item.id, { ...item });
-    }
-    for (let item of list) {
-        if (item.parentId !== 0) {
-            let parent = map.get(item.parentId);
-            if (!parent.children) {
-                parent.children = [];
-            }
-            parent.children.push(map.get(item.id));
-        } else {
-            root.push(map.get(item.id));
-        }
+  let map = new Map();
+  let root = [];
+  for (let item of list) {
+    map.set(item.id, { ...item });
+  }
+  for (let item of list) {
+    if (item.parentId !== 0) {
+      let parent = map.get(item.parentId);
+      if (!parent.children) {
+        parent.children = [];
+      }
+      parent.children.push(map.get(item.id));
+    } else {
+      root.push(map.get(item.id));
     }
-    return root;
+  }
+  return root;
 };
 const findNameWithParents = (data, idToFind, parentName = '') => {
-    for (let item of data) {
-        let fullName = parentName ? `${parentName}/${item.name}` : item.name;
-        if (item.id === idToFind) {
-            return fullName;
-        }
-        if (item.children && Array.isArray(item.children)) {
-            let result = findNameWithParents(item.children, idToFind, fullName);
-            if (result) {
-                return result;
-            }
-        }
+  for (let item of data) {
+    let fullName = parentName ? `${parentName}/${item.name}` : item.name;
+    if (item.id === idToFind) {
+      return fullName;
+    }
+    if (item.children && Array.isArray(item.children)) {
+      let result = findNameWithParents(item.children, idToFind, fullName);
+      if (result) {
+        return result;
+      }
     }
-    return null; // 如果没有找到对应的 ID，则返回 null
+  }
+  return null; // 如果没有找到对应的 ID，则返回 null
 };
+const getSystemName = (val) => {
+  form.value.ext1.systemName = findNameWithParents(treeData.value, val, '')
+}
 const addSystem = (data) => {
-    systemDialog.visible = true;
-    systemDialog.title = '新增分项系统';
-    deviceSystemFormRef.value?.resetFields();
-    Object.keys(systemForm).forEach((key) => {
-        systemForm[key] = '';
-    });
-    if (data.name) {
-        systemForm.parentName = data.name;
-        systemForm.parentId = data.id;
-    } else {
-        systemForm.parentName = '根节点';
-        systemForm.parentId = 0;
-    }
+  systemDialog.visible = true;
+  systemDialog.title = '新增分项系统';
+  deviceSystemFormRef.value?.resetFields();
+  Object.keys(systemForm).forEach((key) => {
+    systemForm[key] = '';
+  });
+  if (data.name) {
+    systemForm.parentName = data.name;
+    systemForm.parentId = data.id;
+  } else {
+    systemForm.parentName = '根节点';
+    systemForm.parentId = 0;
+  }
 };
 const editSystem = (node, data) => {
-    systemDialog.visible = true;
-    systemDialog.title = '修改分项系统';
-    deviceSystemFormRef.value?.resetFields();
-    Object.keys(systemForm).forEach((key) => {
-        systemForm[key] = data[key];
-    });
-    if (data.parentId === 0) {
-        systemForm.parentName = '根节点';
-    } else {
-        systemForm.parentName = node.parent.data.name;
-    }
+  systemDialog.visible = true;
+  systemDialog.title = '修改分项系统';
+  deviceSystemFormRef.value?.resetFields();
+  Object.keys(systemForm).forEach((key) => {
+    systemForm[key] = data[key];
+  });
+  if (data.parentId === 0) {
+    systemForm.parentName = '根节点';
+  } else {
+    systemForm.parentName = node.parent.data.name;
+  }
 };
 const delSystem = async (node, data) => {
-    if (node.childNodes.length) return proxy?.$modal.msgWarning('存在子节点，请先删除子节点');
-    await delDeviceSystem(data.id);
-    proxy?.$modal.msgSuccess('删除成功');
-    await getTreeData();
+  if (node.childNodes.length) return proxy?.$modal.msgWarning('存在子节点，请先删除子节点');
+  await delDeviceSystem(data.id);
+  proxy?.$modal.msgSuccess('删除成功');
+  await getTreeData();
 };
 const handleNodeClick = (data, node) => {
-    queryParams.value.systemId = data.id;
-    handleQuery();
+  queryParams.value.systemId = data.id;
+  handleQuery();
 };
 const submitSystemForm = () => {
-    deviceSystemFormRef.value?.validate(async (valid: boolean) => {
-        if (valid) {
-            buttonLoading.value = true;
-            if (systemForm.id) {
-                await editDeviceSystem(systemForm).finally(() => (buttonLoading.value = false));
-            } else {
-                await addDeviceSystem(systemForm).finally(() => (buttonLoading.value = false));
-            }
-            proxy?.$modal.msgSuccess('操作成功');
-            systemDialog.visible = false;
-            await getTreeData();
-        }
-    });
+  deviceSystemFormRef.value?.validate(async (valid: boolean) => {
+    if (valid) {
+      buttonLoading.value = true;
+      if (systemForm.id) {
+        await editDeviceSystem(systemForm).finally(() => (buttonLoading.value = false));
+      } else {
+        await addDeviceSystem(systemForm).finally(() => (buttonLoading.value = false));
+      }
+      proxy?.$modal.msgSuccess('操作成功');
+      systemDialog.visible = false;
+      await getTreeData();
+    }
+  });
 };
+const resetModelData = () => {
+  modelData.id=''
+  modelData.name=''
+  modelData.dataPoints=[]
+  modelData.controlFuncs=[]
+  modelData.events=[]
+}
 const handleModel = (row) => {
-    rightDrawer.value = true;
-    curRow.value = row;
-    if (row.modeId) {
-        getModels(row.modeId).then(({ code, data }) => {
-            if (code === 200) {
-                modelData.id = data.id;
-                modelData.name = data.name;
-                modelData.dataPoints = JSON.parse(data.dataPoints || '[]');
-                modelData.controlFuncs = JSON.parse(data.controlFuncs || '[]');
-                modelData.events = JSON.parse(data.events || '[]');
-            }
-        });
-    }
+  rightDrawer.value = true;
+  curRow.value = row;
+  resetModelData();
+  if (row.modeId) {
+    getModels(row.modeId).then(({ code, data }) => {
+      if (code === 200) {
+        modelData.id = data.id;
+        modelData.name = data.name;
+        modelData.dataPoints = JSON.parse(data.dataPoints || '[]');
+        modelData.controlFuncs = JSON.parse(data.controlFuncs || '[]');
+        modelData.events = JSON.parse(data.events || '[]');
+      }
+    });
+  }
 };
 const addModel = () => {
-    modelDialog.visible = true;
-    modelDialog.title = activeName.value === 'dataPoints' ? '新增属性' : activeName.value === 'controlFuncs' ? '新增能力' : '新增事件';
-    editIndex.value = null;
-    modelFormRef.value?.resetFields();
-    Object.keys(modelData[`${activeName.value}Form`]).forEach((key) => {
-        modelData[`${activeName.value}Form`][key] = '';
-    });
+  modelDialog.visible = true;
+  modelDialog.title = activeName.value === 'dataPoints' ? '新增属性' : activeName.value === 'controlFuncs' ? '新增能力' : '新增事件';
+  editIndex.value = null;
+  modelFormRef.value?.resetFields();
+  Object.keys(modelData[`${activeName.value}Form`]).forEach((key) => {
+    modelData[`${activeName.value}Form`][key] = '';
+  });
 };
 const editModel = (index) => {
-    modelDialog.visible = true;
-    modelDialog.title = activeName.value === 'dataPoints' ? '修改属性' : activeName.value === 'controlFuncs' ? '修改能力' : '修改事件';
-    editIndex.value = index;
-    modelFormRef.value?.resetFields();
-    Object.assign(modelData[`${activeName.value}Form`], modelData[`${activeName.value}`][index]);
+  modelDialog.visible = true;
+  modelDialog.title = activeName.value === 'dataPoints' ? '修改属性' : activeName.value === 'controlFuncs' ? '修改能力' : '修改事件';
+  editIndex.value = index;
+  modelFormRef.value?.resetFields();
+  Object.assign(modelData[`${activeName.value}Form`], modelData[`${activeName.value}`][index]);
 };
 const delModel = async (index) => {
-    modelData[activeName.value].splice(index, 1);
-    const params = {};
-    params[activeName.value] = JSON.stringify(modelData[activeName.value]);
-    await editModels({ id: modelData.id, ...params });
-    proxy?.$modal.msgSuccess('删除成功');
+  modelData[activeName.value].splice(index, 1);
+  const params = {};
+  params[activeName.value] = JSON.stringify(modelData[activeName.value]);
+  await editModels({ id: modelData.id, ...params });
+  proxy?.$modal.msgSuccess('删除成功');
 };
 const submitModelForm = () => {
-    modelFormRef.value?.validate(async (valid: boolean) => {
-        if (valid) {
-            if (editIndex.value !== null) {
-                modelData[activeName.value].splice(editIndex.value, 1, modelData[`${activeName.value}Form`]);
-            } else {
-                modelData[activeName.value].push(modelData[`${activeName.value}Form`]);
-            }
-            const params = { name: `${curRow.value.name}物模型` };
-            params[activeName.value] = JSON.stringify(modelData[activeName.value]);
-            buttonLoading.value = true;
-            if (modelData.id) {
-                await editModels({ id: modelData.id, ...params });
-                proxy?.$modal.msgSuccess('修改成功');
-            } else {
-                await addModels(params).then(({ code, data }) => {
-                    if (code === 200) {
-                        updateDeviceType({ id: curRow.value.id, modeId: data.id });
-                    }
-                });
-                proxy?.$modal.msgSuccess('新增成功');
-            }
-            modelDialog.visible = false;
-            buttonLoading.value = false;
-        }
-    });
+  modelFormRef.value?.validate(async (valid: boolean) => {
+    if (valid) {
+      if (editIndex.value !== null) {
+        modelData[activeName.value].splice(editIndex.value, 1, modelData[`${activeName.value}Form`]);
+      } else {
+        modelData[activeName.value].push(modelData[`${activeName.value}Form`]);
+      }
+      const params = { name: `${curRow.value.name}物模型` };
+      params[activeName.value] = JSON.stringify(modelData[activeName.value]);
+      buttonLoading.value = true;
+      if (modelData.id) {
+        await editModels({ id: modelData.id, ...params });
+        proxy?.$modal.msgSuccess('修改成功');
+      } else {
+        await addModels(params).then(({ code, data }) => {
+          if (code === 200) {
+            updateDeviceType({ id: curRow.value.id, modeId: data.id });
+          }
+        });
+        proxy?.$modal.msgSuccess('新增成功');
+      }
+      modelDialog.visible = false;
+      buttonLoading.value = false;
+    }
+  });
 };
 onMounted(() => {
-    getList();
-    getTreeData();
+  getList();
+  getTreeData();
 });
 </script>
 <style lang="scss" scoped>
 .card-header {
-    display: flex;
-    justify-content: space-between;
+  display: flex;
+  justify-content: space-between;
 
-    .el-icon {
-        cursor: pointer;
-    }
+  .el-icon {
+    cursor: pointer;
+  }
 }
 
 .custom-tree-node {
-    flex: 1;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding-right: 5px;
+  flex: 1;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding-right: 5px;
 }
 
 .node-operateBtns {
-    div {
-        margin-top: 3px;
-        text-align: center;
-        cursor: pointer;
+  div {
+    margin-top: 3px;
+    text-align: center;
+    cursor: pointer;
 
-        &:hover {
-            color: #409eff;
-        }
+    &:hover {
+      color: #409eff;
     }
+  }
 }
 </style>
 <style lang="scss">
 .customDrawer {
-    .el-drawer__header {
-        align-items: flex-start !important;
-        margin-bottom: 10px;
+  .el-drawer__header {
+    align-items: flex-start !important;
+    margin-bottom: 10px;
 
-        .drawer-title {
-            .title-name {
-                color: #000;
-            }
-        }
+    .drawer-title {
+      .title-name {
+        color: #000;
+      }
     }
+  }
 
-    .el-drawer__body {
-        padding-top: 0;
-    }
+  .el-drawer__body {
+    padding-top: 0;
+  }
 }
 </style>

src/views/deviceManage/versionManage/index.vue

@@ -56,7 +56,7 @@
 
           <el-table v-loading="loading" :data="deviceTypeList" @selection-change="handleSelectionChange">
             <el-table-column type="selection" width="55" align="center" />
-            <el-table-column label="设备名称" align="center">
+            <el-table-column label="设备类型名称" width="120" align="center">
               <template #default="scope">
                 {{ formatDict(scope.row.deviceTypeId, 'deviceTypeOptions') }}
               </template>
@@ -349,8 +349,9 @@ const getProductorList = () => {
   });
 };
 const setProductorInfo = (val) => {
-  const [{ contact, phone }] = dictGroup.productorOptions.filter((item) => item.id === val);
+  const [{ contact, phone,name }] = dictGroup.productorOptions.filter((item) => item.id === val);
   form.value.ext1.linkName = contact;
+  form.value.ext1.productorName = name;
   form.value.ext1.linkPhone = phone;
 };
 const handleNodeClick = (data, node) => {

src/views/supplierManage/supplierRelations/index.vue

@@ -1,130 +1,130 @@
 <template>
-    <div class="p-2">
-        <transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
-            <div v-show="showSearch" class="mb-[10px]">
-                <el-card shadow="hover">
-                    <el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="100px">
-                        <el-form-item label="供应商名称" prop="name">
-                            <el-input v-model="queryParams.name" placeholder="请输入供应商名称" clearable @keyup.enter="handleQuery" />
-                        </el-form-item>
-                        <el-form-item label="供应商类型" prop="productType">
-                            <el-select v-model="queryParams.productType" clearable placeholder="请选择供应商类型">
-                                <el-option v-for="dict in product_type" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
-                            </el-select>
-                        </el-form-item>
-                        <el-form-item>
-                            <el-button type="primary" icon="Search" @click="handleQuery"> 搜索 </el-button>
-                            <el-button icon="Refresh" @click="resetQuery"> 重置 </el-button>
-                        </el-form-item>
-                    </el-form>
-                </el-card>
-            </div>
-        </transition>
+  <div class="p-2">
+    <transition :enter-active-class="proxy?.animate.searchAnimate.enter"
+      :leave-active-class="proxy?.animate.searchAnimate.leave">
+      <div v-show="showSearch" class="mb-[10px]">
+        <el-card shadow="hover">
+          <el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="100px">
+            <el-form-item label="供应商名称" prop="name">
+              <el-input v-model="queryParams.name" placeholder="请输入供应商名称" clearable @keyup.enter="handleQuery" />
+            </el-form-item>
+            <el-form-item label="供应商类型" prop="productType">
+              <el-select v-model="queryParams.productType" clearable placeholder="请选择供应商类型">
+                <el-option v-for="dict in product_type" :key="dict.value" :label="dict.label"
+                  :value="dict.value"></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" icon="Search" @click="handleQuery"> 搜索 </el-button>
+              <el-button icon="Refresh" @click="resetQuery"> 重置 </el-button>
+            </el-form-item>
+          </el-form>
+        </el-card>
+      </div>
+    </transition>
 
-        <el-card shadow="never">
-            <template #header>
-                <el-row :gutter="10" class="mb8">
-                    <el-col :span="1.5">
-                        <el-button type="primary" plain icon="Plus" @click="handleAdd"> 新增 </el-button>
-                    </el-col>
-                    <el-col :span="1.5">
-                        <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate"> 修改 </el-button>
-                    </el-col>
-                    <el-col :span="1.5">
-                        <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete"> 删除 </el-button>
-                    </el-col>
-                    <right-toolbar v-model:showSearch="showSearch" @query-table="getList" />
-                </el-row>
-            </template>
+    <el-card shadow="never">
+      <template #header>
+        <el-row :gutter="10" class="mb8">
+          <el-col :span="1.5">
+            <el-button type="primary" plain icon="Plus" @click="handleAdd"> 新增 </el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate"> 修改 </el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete"> 删除 </el-button>
+          </el-col>
+          <right-toolbar v-model:showSearch="showSearch" @query-table="getList" />
+        </el-row>
+      </template>
 
-            <el-table v-loading="loading" :data="tableList" @selection-change="handleSelectionChange">
-                <el-table-column type="selection" width="55" align="center" />
-                <el-table-column label="供应商名称" align="center" prop="name" width="150" />
-                <el-table-column label="供应商类型" align="center" width="100">
-                    <template #default="scope">
-                        <dict-tag :options="product_type" :value="scope.row.productType" />
-                    </template>
-                </el-table-column>
-                <el-table-column label="联系人" align="center" prop="contact" />
-                <el-table-column label="联系电话" align="center" prop="phone" width="150" />
-                <el-table-column label="联系人邮箱" align="center" prop="ext1.email" width="150" />
-                <el-table-column label="联系人职位" align="center" prop="ext1.job" width="100" />
-                <el-table-column label="联系人地址" align="center" prop="ext1.address" show-overflow-tooltip width="180" />
-                <el-table-column label="备注" align="center" show-overflow-tooltip prop="ext1.remark" width="150" />
-                <el-table-column label="创建时间" align="center" prop="createTime" width="180" />
-                <el-table-column label="操作" align="center" width="100" fixed="right" class-name="small-padding fixed-width">
-                    <template #default="scope">
-                        <el-button v-hasPermi="['jdyw:deviceType:edit']" size="small" link type="primary" @click="handleUpdate(scope.row)">修改</el-button>
-                        <el-button v-hasPermi="['jdyw:deviceType:remove']" size="small" link type="danger" @click="handleDelete(scope.row)">删除</el-button>
-                    </template>
-                </el-table-column>
-            </el-table>
-            <pagination
-                v-show="total > 0"
-                v-model:page="queryParams.pageNum"
-                v-model:limit="queryParams.pageSize"
-                :total="total"
-                @pagination="getList"/>
-        </el-card>
-        <!-- 添加或修改对话框 -->
-        <el-dialog v-model="dialog.visible" :title="dialog.title" width="800px" append-to-body>
-            <el-form ref="addFormRef" :model="form" label-width="100px">
-                <el-row :gutter="20">
-                    <el-col :span="12">
-                        <el-form-item label="供应商名称" prop="name" :rules="[{ required: true, message: '供应商名称不能为空', trigger: 'blur' }]">
-                            <el-input v-model="form.name" placeholder="请输入供应商名称" />
-                        </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                        <el-form-item
-                            label="供应商类型"
-                            prop="productType"
-                            :rules="[{ required: true, message: '供应商类型不能为空', trigger: 'change' }]">
-                            <el-select v-model="form.productType" clearable placeholder="请选择供应商类型">
-                                <el-option v-for="dict in product_type" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
-                            </el-select>
-                        </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                        <el-form-item label="联系人" prop="contact" :rules="[{ required: true, message: '联系人不能为空', trigger: 'blur' }]">
-                            <el-input v-model="form.contact" placeholder="请输入联系人" />
-                        </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                        <el-form-item label="联系电话" prop="phone" :rules="[{ required: true, message: '联系电话不能为空', trigger: 'blur' }]">
-                            <el-input v-model="form.phone" placeholder="请输入联系电话" />
-                        </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                        <el-form-item label="联系人邮箱" prop="ext1.email">
-                            <el-input v-model="form.ext1.email" placeholder="请输入联系人邮箱" />
-                        </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                        <el-form-item label="联系人职位" prop="ext1.job">
-                            <el-input v-model="form.ext1.job" placeholder="请输入联系人职位" />
-                        </el-form-item>
-                    </el-col>
-                    <el-col :span="24">
-                        <el-form-item label="联系人地址" prop="ext1.address">
-                            <el-input v-model="form.ext1.address"  placeholder="请输入联系人地址" />
-                        </el-form-item>
-                    </el-col>
-                    <el-col :span="24">
-                        <el-form-item label="备注" prop="ext1.remark">
-                            <el-input v-model="form.ext1.remark" type="textarea" placeholder="请输入备注" />
-                        </el-form-item>
-                    </el-col>
-                </el-row>
-            </el-form>
-            <template #footer>
-                <div class="dialog-footer">
-                    <el-button :loading="buttonLoading" type="primary" @click="submitForm"> 确 定 </el-button>
-                    <el-button @click="cancel"> 取 消 </el-button>
-                </div>
-            </template>
-        </el-dialog>
-    </div>
+      <el-table v-loading="loading" :data="tableList" @selection-change="handleSelectionChange">
+        <el-table-column type="selection" width="55" align="center" />
+        <el-table-column label="供应商名称" align="center" prop="name" width="150" />
+        <el-table-column label="供应商类型" align="center" width="100">
+          <template #default="scope">
+            <dict-tag :options="product_type" :value="scope.row.productType" />
+          </template>
+        </el-table-column>
+        <el-table-column label="联系人" align="center" prop="contact" />
+        <el-table-column label="联系电话" align="center" prop="phone" width="150" />
+        <el-table-column label="联系人邮箱" align="center" prop="ext1.email" width="150" />
+        <el-table-column label="联系人职位" align="center" prop="ext1.job" width="100" />
+        <el-table-column label="联系人地址" align="center" prop="ext1.address" show-overflow-tooltip width="180" />
+        <el-table-column label="备注" align="center" show-overflow-tooltip prop="ext1.remark" width="150" />
+        <el-table-column label="创建时间" align="center" prop="createTime" width="180" />
+        <el-table-column label="操作" align="center" width="100" fixed="right" class-name="small-padding fixed-width">
+          <template #default="scope">
+            <el-button v-hasPermi="['jdyw:deviceType:edit']" size="small" link type="primary"
+              @click="handleUpdate(scope.row)">修改</el-button>
+            <el-button v-hasPermi="['jdyw:deviceType:remove']" size="small" link type="danger"
+              @click="handleDelete(scope.row)">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination v-show="total > 0" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize"
+        :total="total" @pagination="getList" />
+    </el-card>
+    <!-- 添加或修改对话框 -->
+    <el-dialog v-model="dialog.visible" :title="dialog.title" width="800px" append-to-body>
+      <el-form ref="addFormRef" :model="form" label-width="100px">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="供应商名称" prop="name"
+              :rules="[{ required: true, message: '供应商名称不能为空', trigger: 'blur' }]">
+              <el-input v-model="form.name" placeholder="请输入供应商名称" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="供应商类型" prop="productType"
+              :rules="[{ required: true, message: '供应商类型不能为空', trigger: 'change' }]">
+              <el-select v-model="form.productType" clearable placeholder="请选择供应商类型">
+                <el-option v-for="dict in product_type" :key="dict.value" :label="dict.label"
+                  :value="dict.value"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="联系人" prop="contact" :rules="[{ required: true, message: '联系人不能为空', trigger: 'blur' }]">
+              <el-input v-model="form.contact" placeholder="请输入联系人" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="联系电话" prop="phone" :rules="[{ required: true, message: '联系电话不能为空', trigger: 'blur' }]">
+              <el-input v-model="form.phone" placeholder="请输入联系电话" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="联系人邮箱" prop="ext1.email">
+              <el-input v-model="form.ext1.email" placeholder="请输入联系人邮箱" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="联系人职位" prop="ext1.job">
+              <el-input v-model="form.ext1.job" placeholder="请输入联系人职位" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="联系人地址" prop="ext1.address">
+              <el-input v-model="form.ext1.address" placeholder="请输入联系人地址" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="备注" prop="ext1.remark">
+              <el-input v-model="form.ext1.remark" type="textarea" placeholder="请输入备注" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button :loading="buttonLoading" type="primary" @click="submitForm"> 确 定 </el-button>
+          <el-button @click="cancel"> 取 消 </el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
 </template>
 
 <script setup name="SupplierRelations" lang="ts">
@@ -142,169 +142,169 @@ const total = ref(0);
 const queryFormRef = ref<ElFormInstance>();
 const addFormRef = ref<ElFormInstance>();
 const dialog = reactive<DialogOption>({
-    visible: false,
-    title: ''
+  visible: false,
+  title: ''
 });
 const { product_type } = toRefs<any>(proxy?.useDict('product_type'));
 const initFormData = {
-    id: undefined,
-    name: undefined,
-    productType: undefined,
-    contact: undefined,
-    phone: undefined,
-    ext1: <any>{},
-    ext2: undefined
+  id: undefined,
+  name: undefined,
+  productType: undefined,
+  contact: undefined,
+  phone: undefined,
+  ext1: <any>{},
+  ext2: undefined
 };
 const formData = reactive({
-    form: { ...initFormData },
-    queryParams: {
-        pageNum: 1,
-        pageSize: 10,
-        name: undefined,
-        productType: undefined,
-        params: {}
-    }
+  form: { ...initFormData },
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    name: undefined,
+    productType: undefined,
+    params: {}
+  }
 });
 
 const { queryParams, form } = toRefs(formData);
 
 /** 查询设备类型信息列表 */
 const getList = async () => {
-    loading.value = true;
-    const res = await listProductor(queryParams.value);
-    tableList.value = res.rows.map((item) => ({
-        ...item,
-        ext1: item.ext1 ? JSON.parse(item.ext1) : null
-    }));
-    total.value = res.total;
-    loading.value = false;
+  loading.value = true;
+  const res = await listProductor(queryParams.value);
+  tableList.value = res.rows.map((item) => ({
+    ...item,
+    ext1: item.ext1 ? JSON.parse(item.ext1) : null
+  }));
+  total.value = res.total;
+  loading.value = false;
 };
 
 /** 取消按钮 */
 const cancel = () => {
-    reset();
-    dialog.visible = false;
+  reset();
+  dialog.visible = false;
 };
 
 /** 表单重置 */
 const reset = () => {
-    form.value = { ...initFormData };
-    addFormRef.value?.resetFields();
+  form.value = { ...initFormData };
+  addFormRef.value?.resetFields();
 };
 
 /** 搜索按钮操作 */
 const handleQuery = () => {
-    queryParams.value.pageNum = 1;
-    getList();
+  queryParams.value.pageNum = 1;
+  getList();
 };
 
 /** 重置按钮操作 */
 const resetQuery = () => {
-    queryFormRef.value?.resetFields();
-    handleQuery();
+  queryFormRef.value?.resetFields();
+  handleQuery();
 };
 
 /** 多选框选中数据 */
 const handleSelectionChange = (selection) => {
-    ids.value = selection.map((item) => item.id);
-    single.value = selection.length != 1;
-    multiple.value = !selection.length;
+  ids.value = selection.map((item) => item.id);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
 };
 
 /** 新增按钮操作 */
 const handleAdd = () => {
-    reset();
-    dialog.visible = true;
-    dialog.title = '新增供应商';
+  reset();
+  dialog.visible = true;
+  dialog.title = '新增供应商';
 };
 
 /** 修改按钮操作 */
 const handleUpdate = async (row) => {
-    reset();
-    const _id = row?.id || ids.value[0];
-    const res = await getProductor(_id);
-    res.data.ext1 = res.data.ext1 && JSON.parse(res.data.ext1);
-    Object.assign(form.value, res.data);
-    dialog.visible = true;
-    dialog.title = '修改供应商';
+  reset();
+  const _id = row?.id || ids.value[0];
+  const res = await getProductor(_id);
+  res.data.ext1 = res.data.ext1 && JSON.parse(res.data.ext1);
+  Object.assign(form.value, res.data);
+  dialog.visible = true;
+  dialog.title = '修改供应商';
 };
 
 /** 提交按钮 */
 const submitForm = () => {
-    addFormRef.value?.validate(async (valid: boolean) => {
-        if (valid) {
-            buttonLoading.value = true;
-            const { ext1 } = form.value;
-            const params = Object.assign(form.value, { ext1: JSON.stringify(ext1) });
-            if (form.value.id) {
-                await updateProductor(params).finally(() => (buttonLoading.value = false));
-            } else {
-                await addProductor(params).finally(() => (buttonLoading.value = false));
-            }
-            proxy?.$modal.msgSuccess('操作成功');
-            dialog.visible = false;
-            await getList();
-        }
-    });
+  addFormRef.value?.validate(async (valid: boolean) => {
+    if (valid) {
+      buttonLoading.value = true;
+      const { ext1 } = form.value;
+      const params = Object.assign(form.value, { ext1: JSON.stringify(ext1) });
+      if (form.value.id) {
+        await updateProductor(params).finally(() => (buttonLoading.value = false));
+      } else {
+        await addProductor(params).finally(() => (buttonLoading.value = false));
+      }
+      proxy?.$modal.msgSuccess('操作成功');
+      dialog.visible = false;
+      await getList();
+    }
+  });
 };
 
 /** 删除按钮操作 */
 const handleDelete = async (row) => {
-    const _ids = row?.id || ids.value;
-    await proxy?.$modal.confirm('是否确认删除？').finally(() => (loading.value = false));
-    await delProductor(_ids);
-    proxy?.$modal.msgSuccess('删除成功');
-    await getList();
+  const _ids = row?.id || ids.value;
+  await proxy?.$modal.confirm('是否确认删除？').finally(() => (loading.value = false));
+  await delProductor(_ids);
+  proxy?.$modal.msgSuccess('删除成功');
+  await getList();
 };
 onMounted(() => {
-    getList();
+  getList();
 });
 </script>
 <style lang="scss" scoped>
 .card-header {
-    display: flex;
-    justify-content: space-between;
+  display: flex;
+  justify-content: space-between;
 
-    .el-icon {
-        cursor: pointer;
-    }
+  .el-icon {
+    cursor: pointer;
+  }
 }
 
 .custom-tree-node {
-    flex: 1;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding-right: 5px;
+  flex: 1;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding-right: 5px;
 }
 
 .node-operateBtns {
-    div {
-        margin-top: 3px;
-        text-align: center;
-        cursor: pointer;
+  div {
+    margin-top: 3px;
+    text-align: center;
+    cursor: pointer;
 
-        &:hover {
-            color: #409eff;
-        }
+    &:hover {
+      color: #409eff;
     }
+  }
 }
 </style>
 <style lang="scss">
 .customDrawer {
-    .el-drawer__header {
-        align-items: flex-start !important;
-        margin-bottom: 10px;
+  .el-drawer__header {
+    align-items: flex-start !important;
+    margin-bottom: 10px;
 
-        .drawer-title {
-            .title-name {
-                color: #000;
-            }
-        }
+    .drawer-title {
+      .title-name {
+        color: #000;
+      }
     }
+  }
 
-    .el-drawer__body {
-        padding-top: 0;
-    }
+  .el-drawer__body {
+    padding-top: 0;
+  }
 }
 </style>