feat: update

.env.development

@@ -1,2 +1,2 @@
 VITE_API_BASE_URL = "https://coldverify.coldbaozhida.com/api"
-VITE_API_LOCAL_BASE_URL = "http://coldverifylocal.coldbaozhida.com/api"
+VITE_API_LOCAL_BASE_URL = "http://192.168.1.23:6400"

package.json

@@ -15,6 +15,7 @@
     }
   },
   "dependencies": {
+    "@vueuse/core": "^9.13.0",
     "axios": "^1.3.2",
     "highcharts": "^10.3.3",
     "highcharts-vue": "^1.4.0",

pnpm-lock.yaml

@@ -5,6 +5,7 @@ specifiers:
   '@vicons/antd': ^0.12.0
   '@vitejs/plugin-vue': ^4.0.0
   '@vue/eslint-config-prettier': ^7.0.0
+  '@vueuse/core': ^9.13.0
   axios: ^1.3.2
   cz-git: ^1.4.1
   eslint: ^8.22.0
@@ -27,6 +28,7 @@ specifiers:
   windicss: ^3.5.6
 
 dependencies:
+  '@vueuse/core': 9.13.0_vue@3.2.47
   axios: 1.3.2
   highcharts: 10.3.3
   highcharts-vue: 1.4.0_x2ttk5sq3pjxzxl7cjqodvt53e
@@ -48,7 +50,7 @@ devDependencies:
   naive-ui: 2.34.3_vue@3.2.47
   prettier: 2.8.4
   sass: 1.58.0
-  unplugin-auto-import: 0.14.2
+  unplugin-auto-import: 0.14.2_@vueuse+core@9.13.0
   unplugin-vue-components: 0.23.0_vue@3.2.47
   vite: 4.1.1_sass@1.58.0
   vite-plugin-windicss: 1.8.10_vite@4.1.1
@@ -674,6 +676,9 @@ packages:
     resolution: {integrity: sha512-BdZ5BCCvho3EIXw6wUCXHe7rS53AIDPLE+JzwgT+OsJk53oBfbSmZZ7CX4VaRoN78N+TJpFi9QPlfIVNmJYWxQ==}
     dev: true
 
+  /@types/web-bluetooth/0.0.16:
+    resolution: {integrity: sha512-oh8q2Zc32S6gd/j50GowEjKLoOVOwHP/bWVjKJInBwQqdOYMdPrf1oVlelTlyfFK3CKxL1uahMDAr+vy8T7yMQ==}
+
   /@vicons/antd/0.12.0:
     resolution: {integrity: sha512-C0p6aO1EmGG1QHrqgUWQS1No20934OdWSRQshM5NIDK5H1On6tC26U0hT6Rmp40KfUsvhvX5YW8BoWJdNFifPg==}
     dev: true
@@ -778,6 +783,28 @@ packages:
   /@vue/shared/3.2.47:
     resolution: {integrity: sha512-BHGyyGN3Q97EZx0taMQ+OLNuZcW3d37ZEVmEAyeoA9ERdGvm9Irc/0Fua8SNyOtV1w6BS4q25wbMzJujO9HIfQ==}
 
+  /@vueuse/core/9.13.0_vue@3.2.47:
+    resolution: {integrity: sha512-pujnclbeHWxxPRqXWmdkKV5OX4Wk4YeK7wusHqRwU0Q7EFusHoqNA/aPhB6KCh9hEqJkLAJo7bb0Lh9b+OIVzw==}
+    dependencies:
+      '@types/web-bluetooth': 0.0.16
+      '@vueuse/metadata': 9.13.0
+      '@vueuse/shared': 9.13.0_vue@3.2.47
+      vue-demi: 0.13.11_vue@3.2.47
+    transitivePeerDependencies:
+      - '@vue/composition-api'
+      - vue
+
+  /@vueuse/metadata/9.13.0:
+    resolution: {integrity: sha512-gdU7TKNAUVlXXLbaF+ZCfte8BjRJQWPCa2J55+7/h+yDtzw3vOoGQDRXzI6pyKyo6bXFT5/QoPE4hAknExjRLQ==}
+
+  /@vueuse/shared/9.13.0_vue@3.2.47:
+    resolution: {integrity: sha512-UrnhU+Cnufu4S6JLCPZnkWh0WwZGUp72ktOF2DFptMlOs3TOdVv8xJN53zhHGARmVOsz5KqOls09+J1NR6sBKw==}
+    dependencies:
+      vue-demi: 0.13.11_vue@3.2.47
+    transitivePeerDependencies:
+      - '@vue/composition-api'
+      - vue
+
   /@windicss/config/1.8.10:
     resolution: {integrity: sha512-O9SsC110b1Ik3YYa4Ck/0TWuCo7YFfA9KDrwD5sAeqscT5COIGK1HszdCT3oh0MJFej2wNrvpfyW9h6yQaW6PA==}
     dependencies:
@@ -2438,7 +2465,7 @@ packages:
       - rollup
     dev: true
 
-  /unplugin-auto-import/0.14.2:
+  /unplugin-auto-import/0.14.2_@vueuse+core@9.13.0:
     resolution: {integrity: sha512-6DptcCD+bKlxwK0yS4ehleZTvtG4Xl9k/XxhKWxc9ii2uE28HvcA3KbYpoHAzTlHDXRBrtcCAohR8vtIRB5bfg==}
     engines: {node: '>=14'}
     peerDependencies:
@@ -2450,6 +2477,7 @@ packages:
       '@antfu/utils': 0.7.2
       '@nuxt/kit': 3.2.0
       '@rollup/pluginutils': 5.0.2
+      '@vueuse/core': 9.13.0_vue@3.2.47
       local-pkg: 0.4.3
       magic-string: 0.27.0
       unimport: 2.2.4
@@ -2606,7 +2634,6 @@ packages:
         optional: true
     dependencies:
       vue: 3.2.47
-    dev: false
 
   /vue-eslint-parser/9.1.0_eslint@8.33.0:
     resolution: {integrity: sha512-NGn/iQy8/Wb7RrRa4aRkokyCZfOUWk19OP5HP6JEozQFX5AoS/t+Z0ZN7FY4LlmWc4FNI922V7cvX28zctN8dQ==}

src/api/index.js

@@ -1,26 +1,7 @@
-import service from "@/utils/axios";
+export * from "./modules/base";
 export * from "./modules/task";
 export * from "./modules/certificate";
 export * from "./modules/scheme";
 export * from "./modules/equipment";
 export * from "./modules/data";
 export * from "./modules/report";
-
-// 登录
-export const login = (data, role) => {
-  return service.request({
-    method: "POST",
-    url:
-      role === "管理员" ? "/Login_Admin_verification" : "/Login_verification",
-    data,
-  });
-};
-
-// 获取上传token
-export const getUpFileTokenData = (data) => {
-  return service.request({
-    method: "POST",
-    url: "/UpFileToken",
-    data,
-  });
-};

src/api/modules/base.js

@@ -0,0 +1,20 @@
+import service from "@/utils/axios";
+
+// 登录
+export const login = (data, role) => {
+  return service.request({
+    method: "POST",
+    url:
+      role === "管理员" ? "/Login_Admin_verification" : "/Login_verification",
+    data,
+  });
+};
+
+// 获取上传token
+export const getUpFileTokenData = (data) => {
+  return service.request({
+    method: "POST",
+    url: "/UpFileToken",
+    data,
+  });
+};

src/api/modules/certificate.js

@@ -1,14 +1,5 @@
 import service from "@/utils/axios";
 
-// 模板标签数据（列表）
-export const getVerifyTemplateMapData = (data) => {
-  return service.request({
-    method: "POST",
-    url: "/VerifyTemplateMapData/List",
-    data,
-  });
-};
-
 // 任务（编辑）
 export const editTaskData = (data) => {
   return service.request({

src/api/modules/data.js

@@ -0,0 +1,29 @@
+import service from "@/utils/axios";
+import { localBaseUrl } from "@/constant";
+
+// 设备分类-设备列表（列表）
+export const getTaskDataData = (data) => {
+  return service.request({
+    method: "POST",
+    url: `${localBaseUrl}/TaskData/List`,
+    data,
+  });
+};
+
+// 提取数据
+export const extractTaskDataData = (data) => {
+  return service.request({
+    method: "POST",
+    url: "/TaskData/Extract_TaskData",
+    data,
+  });
+};
+
+// 打包本地数据
+export const importTaskDataData = (data) => {
+  return service.request({
+    method: "POST",
+    url: `${localBaseUrl}/TaskData/Import_TaskData`,
+    data,
+  });
+};

src/api/modules/scheme.js

@@ -0,0 +1,20 @@
+import service from "@/utils/axios";
+import { localBaseUrl } from "@/constant";
+
+// 模板标签数据（列表）
+export const getVerifyTemplateMapData = (data) => {
+  return service.request({
+    method: "POST",
+    url: "/VerifyTemplateMapData/List",
+    data,
+  });
+};
+
+// 设备列表
+export const getTaskDataClassData = (data) => {
+  return service.request({
+    method: "POST",
+    url: `${localBaseUrl}/TaskData/TaskDataClass_List`,
+    data,
+  });
+};

src/constant/index.js

@@ -1 +1,11 @@
+import { computed } from "vue";
+
 export const TOKEN = "User_tokey";
+
+export const localBaseUrl = import.meta.env.VITE_API_LOCAL_BASE_URL;
+
+export const task = computed(() => {
+  return window.sessionStorage.getItem("task")
+    ? JSON.parse(window.sessionStorage.getItem("task"))
+    : {};
+});

src/login/index.vue

@@ -25,6 +25,7 @@
             <n-input
               v-model:value="formValue.password"
               type="password"
+              show-password-on="click"
               :maxlength="8"
             >
               <template #prefix>

src/router/index.js

@@ -27,8 +27,7 @@ const router = createRouter({
           component: () => import("@/views/project/scheme/index.vue"),
         },
         {
-          path: "/equipment/:taskId",
-          props: true,
+          path: "/equipment",
           component: () => import("@/views/project/equipment/index.vue"),
         },
         {

src/views/project/data/source/index.vue

@@ -5,100 +5,179 @@
       <n-breadcrumb-item>数据来源</n-breadcrumb-item>
     </n-breadcrumb>
     <n-space>
-      <n-space align="center">
-        <span>SN</span>
-        <n-input v-model:value="queryData.inputValue" />
-      </n-space>
+      <n-form-item label="SN" label-placement="left">
+        <n-input v-model:value="queryData.T_sn" />
+      </n-form-item>
+      <n-form-item label="ID" label-placement="left">
+        <n-input v-model:value="queryData.T_id" />
+      </n-form-item>
+      <n-form-item label="开始时间" label-placement="left">
+        <n-date-picker
+          v-model:formatted-value="queryData.Time_start"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          type="datetime"
+          clearable
+        />
+      </n-form-item>
+      <n-form-item label="结束时间" label-placement="left">
+        <n-date-picker
+          v-model:formatted-value="queryData.Time_end"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          type="datetime"
+          clearable
+        />
+      </n-form-item>
+      <n-button type="primary">搜索</n-button>
+      <n-popconfirm @positive-click="getTaskList">
+        <template #trigger>
+          <n-button type="primary">重置数据</n-button>
+        </template>
+        是否确定重置数据？
+      </n-popconfirm>
     </n-space>
     <n-data-table
       :columns="columns"
-      :data="data"
+      :data="taskList"
       :pagination="pagination"
       :bordered="false"
     />
   </n-space>
-  <n-modal
-    :show-icon="false"
-    v-model:show="modal.showModal"
-    preset="dialog"
-    :title="modal.title"
-    positive-text="提交"
-    negative-text="取消"
-    @positive-click="submitCallback"
-  >
-    <n-form
-      :model="form"
-      label-placement="left"
-      label-width="auto"
-      require-mark-placement="right-hanging"
+  <n-modal v-model:show="modal.showModal" :mask-closable="false">
+    <n-card
+      title="自定义时间"
+      style="width: 30%"
+      :bordered="false"
+      size="huge"
+      role="dialog"
+      aria-modal="true"
     >
-      <n-form-item label="项目名称" path="inputValue">
-        <n-input v-model:value="form.inputValue" />
-      </n-form-item>
-      <n-form-item label="描述" path="textareaValue">
-        <n-input
-          v-model:value="form.textareaValue"
-          type="textarea"
-          :autosize="{
-            minRows: 3,
-            maxRows: 5,
-          }"
-        />
-      </n-form-item>
-    </n-form>
+      <n-form label-width="auto" label-placement="top" :model="queryData">
+        <n-form-item label="开始时间" path="Time_start">
+          <n-date-picker
+            v-model:formatted-value="queryData.Time_start"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            type="datetime"
+            clearable
+            class="w-full"
+          />
+        </n-form-item>
+        <n-form-item label="结束时间" path="Time_end">
+          <n-date-picker
+            v-model:formatted-value="queryData.Time_end"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            type="datetime"
+            clearable
+            class="w-full"
+          />
+        </n-form-item>
+        <n-form-item>
+          <n-button
+            type="primary"
+            @click="handleSearch"
+            block
+            :disabled="!(queryData.Time_start && queryData.Time_end)"
+          >
+            搜索
+          </n-button>
+        </n-form-item>
+      </n-form>
+    </n-card>
   </n-modal>
 </template>
 
 <script setup>
 import { NSpace } from "naive-ui";
+import {
+  extractTaskDataData,
+  getTaskDataData,
+  importTaskDataData,
+} from "@/api";
 
-const data = [
-  { no: 3, title: "Wonderwall", length: "4:18" },
-  { no: 4, title: "Don't Look Back in Anger", length: "4:48" },
-  { no: 12, title: "Champagne Supernova", length: "7:27" },
-];
+const task = window.sessionStorage.getItem("task")
+  ? JSON.parse(window.sessionStorage.getItem("task"))
+  : {};
+
+// 查询数据
+const queryData = reactive({
+  T_task_id: task.T_task_id,
+  T_sn: "",
+  T_id: "",
+  Time_start: null,
+  Time_end: null,
+  page: 1,
+  page_z: 10,
+});
+
+// 列表
+const taskList = ref([]);
 
+// 需要展示的列
 const columns = [
   {
-    title: "传感器名称",
-    key: "no",
+    title: "SN",
+    key: "T_sn",
   },
   {
-    title: "温度",
-    key: "title",
+    title: "温度℃",
+    key: "T_t",
   },
   {
-    title: "湿度",
-    key: "length",
-  },
-  {
-    title: "温度范围",
-    key: "actions",
-  },
-  {
-    title: "湿度范围",
-    key: "actions",
+    title: "湿度%",
+    key: "T_rh",
   },
   {
     title: "记录时间",
-    key: "actions",
+    key: "T_time",
   },
 ];
-const pagination = ref(false);
+
+// 分页数据源
+const pagination = reactive({
+  page: queryData.page,
+  pageSize: queryData.page_z,
+  itemCount: 0,
+  onChange: (page) => {
+    pagination.page = page;
+    queryData.page = page;
+    getTaskList();
+  },
+});
 
 const modal = reactive({
-  title: "",
-  showModal: false,
+  showModal: true,
 });
 
-const submitCallback = () => {
-  console.log("确定");
+const handleSearch = () => {
+  modal.showModal = false;
+  extractTaskData();
+  importTaskData();
+  getTaskList();
 };
 
-const queryData = reactive({
-  inputValue: "",
-  textareaValue: "",
-});
+// 获取列表
+const importTaskData = async () => {
+  const { data: res } = await importTaskDataData({
+    T_task_id: queryData.T_task_id,
+  });
+  console.log(res);
+};
+
+// 获取列表
+const extractTaskData = async () => {
+  const { data: res } = await extractTaskDataData({
+    T_task_id: queryData.T_task_id,
+    Time_start: queryData.Time_start,
+    Time_end: queryData.Time_end,
+  });
+  console.log(res);
+};
+
+// 获取列表
+const getTaskList = async () => {
+  const { data: res } = await getTaskDataData(queryData);
+  pagination.itemCount = res.Data.Num;
+  taskList.value = res.Data.List ? res.Data.List : [];
+};
 </script>
 
 <style scoped></style>

src/views/project/equipment/index.vue

@@ -67,14 +67,13 @@ import {
   getDeviceData,
   editDeviceClassListData,
   deleteDeviceClassListData,
-  getDeviceClass,
 } from "@/api";
 
-const message = useMessage();
+const task = window.sessionStorage.getItem("task")
+  ? JSON.parse(window.sessionStorage.getItem("task"))
+  : {};
 
-const props = defineProps({
-  taskId: String,
-});
+const message = useMessage();
 
 const formRef = ref(null);
 
@@ -96,7 +95,7 @@ const rules = {
 // 查询参数
 const queryData = reactive({
   T_sn: "",
-  T_name: "",
+  T_class: task.T_class,
 });
 
 // 需要展示的列
@@ -259,7 +258,7 @@ const editDeviceClassList = () => {
 const addDeviceClassList = async (T_sn, T_id) => {
   try {
     const { data: res } = await addDeviceClassListData({
-      T_class: props.taskId,
+      T_class: queryData.T_class,
       T_sn,
       T_id,
     });
@@ -273,10 +272,7 @@ const addDeviceClassList = async (T_sn, T_id) => {
 
 // 设备分类-设备列表（列表）
 const getDeviceClassListDataList = async () => {
-  const { data: res } = await getDeviceClassListData({
-    T_class: props.taskId,
-    T_sn: queryData.T_sn,
-  });
+  const { data: res } = await getDeviceClassListData(queryData);
   pagination.itemCount = res.Data.Num;
   data.value = res.Data.List;
 };
@@ -296,15 +292,6 @@ const getDeviceList = async () => {
   deviceList.value = res.Data.List;
 };
 
-// 设备分类（获取）
-const getDeviceClassInfo = async () => {
-  const { data: res } = await getDeviceClass({
-    Id: props.taskId,
-  });
-  formValue.T_name = res.Data.T_name;
-};
-
-getDeviceClassInfo();
 getDeviceList();
 getDeviceClassListDataList();
 </script>

src/views/project/index.vue

@@ -209,16 +209,16 @@ const columns = [
                         type: "primary",
                         size: "small",
                         onClick: () => {
+                          window.sessionStorage.setItem(
+                            "task",
+                            JSON.stringify(row)
+                          );
                           if (item === "实施方案") {
                             router.push(`/scheme/${row.T_task_id}`);
                           } else if (item === "校准证书") {
-                            window.sessionStorage.setItem(
-                              "task",
-                              JSON.stringify(row)
-                            );
                             router.push(`/certificate/${row.T_task_id}`);
                           } else if (item === "设备管理") {
-                            router.push(`/equipment/${row.Id}`);
+                            router.push("/equipment");
                           } else if (item === "数据来源") {
                             router.push("/data_source");
                           } else if (item === "数据编辑") {

src/views/project/scheme/index.vue

@@ -7,31 +7,66 @@
       </n-breadcrumb>
       <n-button type="primary" @click="handleClick">生成报告</n-button>
     </n-space>
-    <n-scrollbar style="max-height: 650px">
-      <div class="w-1/3 mx-auto">
-        <n-form
-          ref="formRef"
-          :rules="rules"
-          label-placement="left"
-          label-width="auto"
+    <n-scrollbar style="max-height: 700px">
+      <n-form
+        ref="formRef"
+        :rules="rules"
+        label-placement="left"
+        label-width="auto"
+        style="width: 40%; margin: 0 auto"
+      >
+        <template
+          v-for="item of templateDataList"
+          :key="item.T_VerifyTemplateMap_id"
         >
-          <template
-            v-for="item of templateDataList"
-            :key="item.T_VerifyTemplateMap_id"
+          <n-form-item
+            :label="item.T_name"
+            :path="item.T_field"
+            v-if="item.T_label === 1"
           >
-            <n-form-item
-              required
-              :label="item.T_name"
-              :path="item.T_field"
-              v-if="item.T_label === 3"
-            >
+            <n-input v-model:value="item.T_value" />
+            <n-popover trigger="hover">
+              <template #trigger>
+                <n-icon size="20" class="ml-3">
+                  <QuestionCircleOutlined />
+                </n-icon>
+              </template>
+              <n-image width="200" :src="item.T_text" />
+            </n-popover>
+          </n-form-item>
+          <n-form-item
+            :label="item.T_name"
+            :path="item.T_field"
+            v-else-if="item.T_label === 2"
+          >
+            <n-input-number
+              class="w-full"
+              :min="1"
+              v-model:value="item.T_value"
+            />
+            <n-popover trigger="hover">
+              <template #trigger>
+                <n-icon size="20" class="ml-3">
+                  <QuestionCircleOutlined />
+                </n-icon>
+              </template>
+              <n-image width="200" :src="item.T_text" />
+            </n-popover>
+          </n-form-item>
+          <n-form-item
+            :label="item.T_name"
+            :path="item.T_field"
+            v-else-if="item.T_label === 3"
+          >
+            <div class="w-full">
               <n-popselect
                 multiple
                 :options="options"
                 :render-label="renderLabel"
                 v-model:value="item.T_value"
+                class="w-full"
               >
-                <n-button>
+                <n-button block>
                   {{
                     Array.isArray(item.T_value) && item.T_value.length
                       ? item.T_value.join(" | ")
@@ -39,122 +74,108 @@
                   }}
                 </n-button>
               </n-popselect>
-              <n-popover trigger="hover">
-                <template #trigger>
-                  <n-icon size="20" class="ml-3">
-                    <QuestionCircleOutlined />
-                  </n-icon>
-                </template>
-                <n-image width="200" :src="item.T_text" />
-              </n-popover>
-            </n-form-item>
-            <n-form-item
-              required
-              :label="item.T_name"
-              :path="item.T_field"
-              v-else-if="item.T_label === 4"
-            >
-              <n-select :options="options" />
-              <n-popover trigger="hover">
-                <template #trigger>
-                  <n-icon size="20" class="ml-3">
-                    <QuestionCircleOutlined />
-                  </n-icon>
-                </template>
-                <n-image width="200" :src="item.T_text" />
-              </n-popover>
-            </n-form-item>
-            <n-divider v-else-if="item.T_label === 5" />
-            <n-form-item
-              required
-              :label="item.T_name"
-              :path="item.T_field"
-              v-else-if="item.T_label === 7"
-            >
-              <n-date-picker
-                value-format="yyyy-MM-dd HH:mm:ss"
-                type="datetime"
-                clearable
-              />
-              <n-popover trigger="hover">
-                <template #trigger>
-                  <n-icon size="20" class="ml-3">
-                    <QuestionCircleOutlined />
-                  </n-icon>
-                </template>
-                <n-image width="200" :src="item.T_text" />
-              </n-popover>
-            </n-form-item>
-            <n-form-item
-              required
-              :label="item.T_name"
-              :path="item.T_field"
-              v-else-if="item.T_label === 9"
-            >
-              <n-date-picker
-                value-format="yyyy-MM-dd HH:mm:ss"
-                type="datetimerange"
-                clearable
-              />
-              <n-popover trigger="hover">
-                <template #trigger>
-                  <n-icon size="20" class="ml-3">
-                    <QuestionCircleOutlined />
-                  </n-icon>
-                </template>
-                <n-image width="200" :src="item.T_text" />
-              </n-popover>
-            </n-form-item>
-            <n-form-item
-              required
-              :label="item.T_name"
-              :path="item.T_field"
-              v-else-if="item.T_label === 10"
-            >
-              <n-upload :default-upload="false" list-type="image-card" :max="1">
-                点击上传
-              </n-upload>
-              <n-popover trigger="hover">
-                <template #trigger>
-                  <n-icon size="20" class="ml-3">
-                    <QuestionCircleOutlined />
-                  </n-icon>
-                </template>
-                <n-image width="200" :src="item.T_text" />
-              </n-popover>
-            </n-form-item>
-            <n-form-item
-              required
-              :label="item.T_name"
-              :path="item.T_field"
-              v-else-if="item.T_label === 11"
-            >
-              <n-upload :default-upload="false" list-type="image-card" :max="1">
-                点击上传
-              </n-upload>
-              <n-popover trigger="hover">
-                <template #trigger>
-                  <n-icon size="20" class="ml-3">
-                    <QuestionCircleOutlined />
-                  </n-icon>
-                </template>
-                <n-image width="200" :src="item.T_text" />
-              </n-popover>
-            </n-form-item>
-            <n-form-item :label="item.T_name" :path="item.T_field" v-else>
-              <n-input v-model:value="item.T_value" />
-              <n-popover trigger="hover">
-                <template #trigger>
-                  <n-icon size="20" class="ml-3">
-                    <QuestionCircleOutlined />
-                  </n-icon>
-                </template>
-                <n-image width="200" :src="item.T_text" />
-              </n-popover>
-            </n-form-item>
-          </template>
-        </n-form>
-      </div>
+            </div>
+            <n-popover trigger="hover">
+              <template #trigger>
+                <n-icon size="20" class="ml-3">
+                  <QuestionCircleOutlined />
+                </n-icon>
+              </template>
+              <n-image width="200" :src="item.T_text" />
+            </n-popover>
+          </n-form-item>
+          <n-form-item
+            :label="item.T_name"
+            :path="item.T_field"
+            v-else-if="item.T_label === 4"
+          >
+            <n-select :options="options" />
+            <n-popover trigger="hover">
+              <template #trigger>
+                <n-icon size="20" class="ml-3">
+                  <QuestionCircleOutlined />
+                </n-icon>
+              </template>
+              <n-image width="200" :src="item.T_text" />
+            </n-popover>
+          </n-form-item>
+          <n-divider v-else-if="item.T_label === 5" />
+          <n-form-item
+            :label="item.T_name"
+            :path="item.T_field"
+            v-else-if="item.T_label === 7"
+          >
+            <n-date-picker
+              value-format="yyyy-MM-dd HH:mm:ss"
+              type="datetime"
+              clearable
+              class="w-full"
+            />
+            <n-popover trigger="hover">
+              <template #trigger>
+                <n-icon size="20" class="ml-3">
+                  <QuestionCircleOutlined />
+                </n-icon>
+              </template>
+              <n-image width="200" :src="item.T_text" />
+            </n-popover>
+          </n-form-item>
+          <n-form-item
+            :label="item.T_name"
+            :path="item.T_field"
+            v-else-if="item.T_label === 9"
+          >
+            <n-date-picker
+              value-format="yyyy-MM-dd HH:mm:ss"
+              type="datetimerange"
+              clearable
+              class="w-full"
+            />
+            <n-popover trigger="hover">
+              <template #trigger>
+                <n-icon size="20" class="ml-3">
+                  <QuestionCircleOutlined />
+                </n-icon>
+              </template>
+              <n-image width="200" :src="item.T_text" />
+            </n-popover>
+          </n-form-item>
+          <n-form-item
+            :label="item.T_name"
+            :path="item.T_field"
+            v-else-if="item.T_label === 10"
+          >
+            <n-upload :default-upload="false" list-type="image-card" :max="1">
+              点击上传
+            </n-upload>
+            <n-popover trigger="hover">
+              <template #trigger>
+                <n-icon size="20" class="ml-3">
+                  <QuestionCircleOutlined />
+                </n-icon>
+              </template>
+              <n-image width="200" :src="item.T_text" />
+            </n-popover>
+          </n-form-item>
+          <n-form-item
+            :label="item.T_name"
+            :path="item.T_field"
+            v-else-if="item.T_label === 11"
+          >
+            <n-upload :default-upload="false" list-type="image-card" :max="1">
+              点击上传
+            </n-upload>
+            <n-popover trigger="hover">
+              <template #trigger>
+                <n-icon size="20" class="ml-3">
+                  <QuestionCircleOutlined />
+                </n-icon>
+              </template>
+              <n-image width="200" :src="item.T_text" />
+            </n-popover>
+          </n-form-item>
+        </template>
+      </n-form>
     </n-scrollbar>
   </n-space>
   <n-modal
@@ -172,7 +193,7 @@
 
 <script setup>
 import { h } from "vue";
-import { getVerifyTemplateMapData } from "@/api";
+import { getTaskDataClassData, getVerifyTemplateMapData } from "@/api";
 import { QuestionCircleOutlined } from "@vicons/antd";
 import { NThing } from "naive-ui";
 
@@ -195,6 +216,9 @@ const props = defineProps({
 // 模板标签数据列表
 const templateDataList = ref([]);
 
+// 设备列表
+const TaskDataClassList = ref([]);
+
 // 	配置选项内容
 const options = [
   {
@@ -247,6 +271,15 @@ const getVerifyTemplateMapDataList = async () => {
   templateDataList.value = res.Data;
 };
 
+// 获取设备列表
+const getTaskDataClassList = async () => {
+  const { data: res } = await getTaskDataClassData({
+    T_task_id: props.taskId,
+  });
+  TaskDataClassList.value = res.Data ? res.Data : [];
+};
+
+getTaskDataClassList();
 getVerifyTemplateMapDataList();
 </script>