feat(all): update

src/components/FormList.vue

@@ -0,0 +1,246 @@
+<template>
+  <n-form label-width="auto">
+    <n-grid :cols="12" :x-gap="12">
+      <n-form-item-gi
+        v-for="(item, index) of formList"
+        :key="item.T_VerifyTemplateMap_id"
+        :span="4"
+        :label="item.T_name"
+      >
+        <!-- 多选id -->
+        <n-select
+          v-model:value="item.T_value"
+          multiple
+          label-field="T_id"
+          value-field="T_sn"
+          max-tag-count="responsive"
+          :options="classList"
+          v-if="item.T_label === 3"
+        >
+          <template #action>
+            <n-space>
+              <n-button class="underline" text @click="handleSelectAll(index)"
+                >全选</n-button
+              >
+              <n-button
+                class="underline"
+                text
+                @click="handleSelectReverse(index)"
+                >反选</n-button
+              >
+            </n-space>
+          </template>
+        </n-select>
+        <!-- 单选id -->
+        <n-select
+          v-model:value="item.T_value"
+          label-field="T_id"
+          value-field="T_sn"
+          :options="classList"
+          v-else-if="item.T_label === 4"
+        />
+        <!-- 时间 -->
+        <n-date-picker
+          v-model:formatted-value="item.T_value"
+          format="yyyy-MM-dd HH:mm"
+          :time-picker-props="{ format: 'HH:mm' }"
+          type="datetime"
+          clearable
+          @update:formatted-value="(value) => (item.T_value = value)"
+          class="w-full"
+          v-else-if="item.T_label === 7"
+        />
+        <!-- 时间区间 -->
+        <n-date-picker
+          v-model:formatted-value="item.T_value"
+          format="yyyy-MM-dd HH:mm"
+          :time-picker-props="{ format: 'HH:mm' }"
+          type="datetimerange"
+          clearable
+          class="w-full"
+          v-else-if="item.T_label === 9"
+        />
+        <!-- 图片 -->
+        <template v-else-if="item.T_label === 10">
+          <n-image class="mr-5" width="100" :src="item.T_value" />
+          <n-upload
+            list-type="image-card"
+            @change="(options) => handleChangeByIndex(options, index)"
+            :default-upload="false"
+            :max="1"
+          >
+            点击上传
+          </n-upload>
+        </template>
+        <!-- CAD -->
+        <template v-else-if="item.T_label === 11">
+          <n-image class="mr-5" width="100" :src="item.T_value" />
+          <n-space class="mr-5">
+            <n-button @click="() => handleEdit(item)">编辑</n-button>
+            <n-button @click="() => handleRefresh(index)">刷新</n-button>
+          </n-space>
+        </template>
+        <!-- 时间 注释 -->
+        <template v-else-if="item.T_label === 12">
+          <n-space vertical class="w-full">
+            <n-date-picker
+              v-model:formatted-value="item.T_value[0]"
+              format="yyyy-MM-dd HH:mm"
+              :time-picker-props="{ format: 'HH:mm' }"
+              type="datetime"
+              clearable
+            />
+            <n-input v-model:value="item.T_value[1]" type="text" />
+          </n-space>
+        </template>
+        <!-- 时间区间 注释 -->
+        <template v-else-if="item.T_label === 13">
+          <n-space vertical class="w-full">
+            <n-date-picker
+              v-model:formatted-value="item.T_value[0]"
+              format="yyyy-MM-dd HH:mm"
+              :time-picker-props="{ format: 'HH:mm' }"
+              type="datetimerange"
+              clearable
+            />
+            <n-input v-model:value="item.T_value[1]" type="text" />
+          </n-space>
+        </template>
+        <!-- 可输入的表单项 -->
+        <template v-else>
+          <n-input v-model:value="item.T_value" type="text" />
+        </template>
+        <!-- 描述 -->
+        <n-image
+          width="100"
+          :src="item.T_text"
+          v-if="item.T_label === 10 || item.T_label === 11"
+        />
+        <n-popover trigger="hover" v-else>
+          <template #trigger>
+            <n-icon size="24" class="ml-3">
+              <InformationCircleOutline />
+            </n-icon>
+          </template>
+          {{ item.T_text }}
+        </n-popover>
+      </n-form-item-gi>
+    </n-grid>
+  </n-form>
+</template>
+
+<script setup>
+import { getTaskDataClassList } from '@/api';
+import * as qiniu from 'qiniu-js';
+import { getFileToken } from '@/common';
+import { InformationCircleOutline } from '@vicons/ionicons5';
+import { NButton } from 'naive-ui';
+
+const message = useMessage();
+
+const task = window.sessionStorage.getItem('task')
+  ? JSON.parse(window.sessionStorage.getItem('task'))
+  : {};
+
+const props = defineProps({
+  formList: {
+    type: Array,
+    default: () => [],
+  },
+});
+
+const formList = computed(() => {
+  return props.formList;
+});
+
+// 表单对象
+const formValue = reactive({
+  pdf: '',
+});
+
+// 查询数据
+const queryData = reactive({
+  T_source: 2,
+  T_task_id: task.T_task_id,
+  T_VerifyTemplate_id: task.T_VerifyTemplate_id,
+});
+
+//
+const classList = ref([]);
+
+// CAD刷新
+const handleRefresh = (index) => {
+  formValue.formList[
+    index
+  ].T_value = `http://coldverifylocal.coldbaozhida.com/CAD/download?type=upload&filename=${queryData.T_task_id}_${queryData.T_VerifyTemplate_id}_${formValue.formList[index].T_id}.png`;
+};
+
+// CAD编辑
+const handleEdit = (row) => {
+  window.open(
+    `http://coldverifylocal.coldbaozhida.com/CAD/?task_id=${queryData.T_task_id}&vt_id=${queryData.T_VerifyTemplate_id}&key_id=${row.T_id}`
+  );
+};
+
+const handleChangeByIndex = async ({ file }, i) => {
+  const token = await getFileToken(file.name.split('.')[1]);
+  const observable = qiniu.upload(
+    file.file,
+    file.name,
+    token,
+    {},
+    {
+      useCdnDomain: true,
+    }
+  );
+  observable.subscribe({
+    next: (result) => {
+      // 主要用来展示进度
+      console.warn(result);
+    },
+    error: () => {
+      message.error('上传失败');
+    },
+    complete: (res) => {
+      formValue.formList[i].T_value = res.key;
+    },
+  });
+};
+
+// 全选
+const handleSelectAll = (i) => {
+  if (formList.value[i].T_value.length === 0) {
+    formList.value[i].T_value = [];
+    console.log(formList.value[i].T_value);
+  } else {
+    const arr = classList.value
+      .filter((item) => !formList.value[i].T_value.includes(item.T_sn))
+      .map((item) => item.T_sn);
+    formList.value[i].T_value.push(...arr);
+  }
+};
+
+// 反选
+const handleSelectReverse = (i) => {
+  const arr = classList.value.map((item) => item.T_sn);
+  formList.value[i].T_value = arr.filter(
+    (item) => !formList.value[i].T_value.includes(item)
+  );
+};
+
+// 获取设备列表
+const getClassList = async () => {
+  try {
+    const { data: res } = await getTaskDataClassList({
+      T_task_id: queryData.T_task_id,
+    });
+    classList.value = res.Data || [];
+  } catch (e) {
+    console.log(e);
+  }
+};
+
+getClassList();
+</script>
+
+<style scoped></style>

src/constant/index.js

@@ -1,5 +1,3 @@
-import { computed } from 'vue';
-
 export const TOKEN = 'User_tokey';
 
 export const baseURL1 = import.meta.env.VITE_API_BASE_URL1;
@@ -9,9 +7,3 @@ export const baseURL2 = import.meta.env.VITE_API_BASE_URL2;
 export const baseURL3 = import.meta.env.VITE_API_BASE_URL3;
 
 export const baseURL4 = import.meta.env.VITE_API_BASE_URL4;
-
-export const task = computed(() => {
-  return window.sessionStorage.getItem('task')
-    ? JSON.parse(window.sessionStorage.getItem('task'))
-    : {};
-});

src/views/data/edit/FormList.vue

@@ -0,0 +1,191 @@
+<template>
+  <n-form label-width="auto">
+    <n-grid :cols="12" :x-gap="12">
+      <n-form-item-gi
+        v-for="(item, index) of formValue.formList"
+        :key="item.T_VerifyTemplateMap_id"
+        :span="12"
+        :label="item.T_name"
+      >
+        <!-- 多选id -->
+        <n-select
+          v-model:value="item.T_value"
+          multiple
+          label-field="T_id"
+          value-field="T_sn"
+          max-tag-count="responsive"
+          :options="classList"
+          v-if="item.T_label === 3"
+        >
+          <template #action>
+            <n-space>
+              <n-button class="underline" text @click="handleSelectAll(index)"
+                >全选</n-button
+              >
+              <n-button
+                class="underline"
+                text
+                @click="handleSelectReverse(index)"
+                >反选</n-button
+              >
+            </n-space>
+          </template>
+        </n-select>
+        <!-- 单选id -->
+        <n-select
+          v-model:value="item.T_value"
+          label-field="T_id"
+          value-field="T_sn"
+          :options="classList"
+          v-else-if="item.T_label === 4"
+        />
+        <!-- 时间 -->
+        <n-date-picker
+          v-model:formatted-value="item.T_value"
+          value-format="yyyy-MM-dd HH:mm"
+          type="datetime"
+          clearable
+          class="w-full"
+          v-else-if="item.T_label === 7"
+        />
+        <!-- 时间区间 -->
+        <n-date-picker
+          v-model:formatted-value="item.T_value"
+          value-format="yyyy-MM-dd HH:mm"
+          type="datetimerange"
+          clearable
+          class="w-full"
+          v-else-if="item.T_label === 9"
+        />
+        <!-- 图片 -->
+        <template v-else-if="item.T_label === 10">
+          <n-image class="mr-5" width="100" :src="item.T_value" />
+          <n-upload
+            list-type="image-card"
+            @change="(options) => handleChangeByIndex(options, index)"
+            :default-upload="false"
+            :max="1"
+          >
+            点击上传
+          </n-upload>
+        </template>
+        <!-- CAD -->
+        <template v-else-if="item.T_label === 11">
+          <n-image class="mr-5" width="100" :src="item.T_value" />
+          <n-space>
+            <n-button @click="() => handleEdit(item)">编辑</n-button>
+            <n-button @click="() => handleRefresh(index)">刷新</n-button>
+          </n-space>
+        </template>
+        <!-- 可输入的表单项 -->
+        <template v-else>
+          <n-input v-model:value="item.T_value" />
+        </template>
+        <!-- 描述 -->
+        <n-popover trigger="hover">
+          <template #trigger>
+            <n-icon size="24" class="ml-3">
+              <InformationCircleOutline />
+            </n-icon>
+          </template>
+          <n-image
+            width="200"
+            :src="item.T_text"
+            v-if="item.T_label === 10 || item.T_label === 11"
+          />
+          <span v-else>{{ item.T_text }}</span>
+        </n-popover>
+      </n-form-item-gi>
+    </n-grid>
+  </n-form>
+</template>
+
+<script setup>
+import { getVerifyTemplateMapDataList } from '@/api';
+import { watch } from 'vue';
+import { InformationCircleOutline } from '@vicons/ionicons5';
+
+const props = defineProps({
+  task: {
+    type: Object,
+    default: () => ({}),
+  },
+  classList: {
+    type: Array,
+    default: () => [],
+  },
+  time: {
+    type: String,
+    default: null,
+  },
+  temporalInterval: {
+    type: Array,
+    default: () => [],
+  },
+});
+
+// 表单对象
+const formValue = reactive({
+  formList: [],
+});
+
+watch(
+  () => props.time,
+  (newValue) => {
+    const index = formValue.formList.findIndex((item) => item.T_label === 7);
+    formValue.formList[index].T_value = newValue;
+  }
+);
+
+watch(
+  () => props.temporalInterval,
+  (newValue) => {
+    const index = formValue.formList.findIndex((item) => item.T_label === 9);
+    formValue.formList[index].T_value = newValue;
+  }
+);
+
+//
+const queryData = reactive({
+  T_source: 3,
+  T_task_id: props.task.T_task_id,
+  T_VerifyTemplate_id: props.task.T_VerifyTemplate_id,
+});
+
+// 全选
+const handleSelectAll = (i) => {
+  if (formValue.formList[i].T_value.length !== 0) {
+    return (formValue.formList[i].T_value = []);
+  }
+  formValue.formList[i].T_value = props.classList.map((item) => item.T_sn);
+};
+
+// 反选
+const handleSelectReverse = (i) => {
+  const arr = props.classList.map((item) => item.T_sn);
+  formValue.formList[i].T_value = arr.filter(
+    (item) => !formValue.formList[i].T_value.includes(item)
+  );
+};
+
+// 模板标签数据（列表）
+const getTemplateList = async () => {
+  try {
+    const { data: res } = await getVerifyTemplateMapDataList(queryData);
+    formValue.formList = res.Data || [];
+    formValue.formList.forEach((item) => {
+      if (item.T_label === 4 || item.T_label === 9) {
+        item.T_value = item.T_value ? item.T_value.split('|') : null;
+      } else {
+        item.T_value = item.T_value ? item.T_value : null;
+      }
+    });
+  } catch (e) {
+    console.log(e);
+  }
+};
+
+getTemplateList();
+</script>
+
+<style lang="scss" scoped></style>

src/views/data/edit/TemplateForm.vue

@@ -1,215 +0,0 @@
-<template>
-  <n-scrollbar x-scrollable class="pb-3">
-    <div class="flex items-center gap-x-3 w-[2000px]">
-      <template
-        v-for="(item, i) of formValue.formList"
-        :key="item.T_VerifyTemplateMap_id"
-      >
-        <n-form-item
-          label-width="auto"
-          label-placement="left"
-          :show-feedback="false"
-          :label="item.T_name"
-          v-if="item.T_label === 3"
-        >
-          <n-select
-            label-field="T_sn"
-            value-field="T_sn"
-            v-model:value="item.T_value"
-            :options="classList"
-            style="width: 300px"
-          />
-        </n-form-item>
-        <n-form-item
-          label-width="auto"
-          label-placement="left"
-          :show-feedback="false"
-          :label="item.T_name"
-          v-else-if="item.T_label === 4"
-        >
-          <n-select
-            v-model:value="item.T_value"
-            multiple
-            label-field="T_sn"
-            value-field="T_sn"
-            max-tag-count="responsive"
-            :options="classList"
-            style="width: 300px"
-          >
-            <template #action>
-              <n-space>
-                <n-button class="underline" text @click="handleSelectAll(i)"
-                  >全选</n-button
-                >
-                <n-button class="underline" text @click="handleSelectReverse(i)"
-                  >反选</n-button
-                >
-              </n-space>
-            </template>
-          </n-select>
-        </n-form-item>
-        <n-form-item
-          label-width="auto"
-          label-placement="left"
-          :show-feedback="false"
-          :label="item.T_name"
-          v-else-if="item.T_label === 7"
-        >
-          <n-date-picker
-            v-model:formatted-value="item.T_value"
-            value-format="yyyy-MM-dd HH:mm"
-            type="datetime"
-            clearable
-          />
-        </n-form-item>
-        <n-form-item
-          label-width="auto"
-          label-placement="left"
-          :show-feedback="false"
-          :label="item.T_name"
-          v-else-if="item.T_label === 9"
-        >
-          <n-date-picker
-            v-model:formatted-value="item.T_value"
-            value-format="yyyy-MM-dd HH:mm"
-            type="datetimerange"
-            clearable
-          />
-        </n-form-item>
-      </template>
-      <n-popconfirm @positive-click="putTemplateData">
-        <template #trigger>
-          <n-button type="primary">生成报告</n-button>
-        </template>
-        确认生成报告？
-      </n-popconfirm>
-    </div>
-  </n-scrollbar>
-</template>
-
-<script setup>
-import { getVerifyTemplateMapDataList, putVerifyTemplateMapData } from '@/api';
-import { getToken } from '@/utils/storage/sessionToken';
-import { watch } from 'vue';
-
-const message = useMessage();
-
-const props = defineProps({
-  task: {
-    default: {},
-  },
-  classList: {
-    default: [],
-  },
-  time: {
-    default: null,
-  },
-  temporalInterval: {
-    default: [],
-  },
-});
-
-// 表单对象
-const formValue = reactive({
-  formList: [],
-});
-
-watch(
-  () => props.time,
-  (newValue) => {
-    const index = formValue.formList.findIndex((item) => item.T_label === 7);
-    formValue.formList[index].T_value = newValue;
-  }
-);
-
-watch(
-  () => props.temporalInterval,
-  (newValue) => {
-    const index = formValue.formList.findIndex((item) => item.T_label === 9);
-    formValue.formList[index].T_value = newValue;
-  }
-);
-
-//
-const queryData = reactive({
-  T_source: 3,
-  T_task_id: props.task.T_task_id,
-  T_VerifyTemplate_id: props.task.T_VerifyTemplate_id,
-});
-
-// 全选
-const handleSelectAll = (i) => {
-  if (formValue.formList[i].T_value.length !== 0) {
-    return (formValue.formList[i].T_value = []);
-  }
-  formValue.formList[i].T_value = props.classList.map((item) => item.T_sn);
-};
-
-// 反选
-const handleSelectReverse = (i) => {
-  const arr = props.classList.map((item) => item.T_sn);
-  formValue.formList[i].T_value = arr.filter(
-    (item) => !formValue.formList[i].T_value.includes(item)
-  );
-};
-
-// 模板标签数据添加或更新
-const putTemplateData = async () => {
-  try {
-    const arr = toRaw(formValue.formList);
-    const VerifyTemplateMapData = arr.map((item) => {
-      if (item.T_label === 102 || item.T_label === 104) {
-        return {
-          T_VerifyTemplateMap_id: item.T_VerifyTemplateMap_id,
-          T_value: item.T_value.join('|'),
-          T_source: item.T_source,
-          T_flow_sort: item.T_flow_sort,
-          T_max_time: item.T_max_time,
-          T_min_time: item.T_min_time,
-        };
-      } else {
-        return {
-          T_VerifyTemplateMap_id: item.T_VerifyTemplateMap_id,
-          T_value: item.T_value + '',
-          T_source: item.T_source,
-          T_flow_sort: item.T_flow_sort,
-          T_max_time: item.T_max_time,
-          T_min_time: item.T_min_time,
-        };
-      }
-    });
-    const token = getToken();
-    const { data: res } = await putVerifyTemplateMapData({
-      User_tokey: token,
-      T_source: queryData.T_source,
-      T_task_id: queryData.T_task_id,
-      T_VerifyTemplate_id: queryData.T_VerifyTemplate_id,
-      VerifyTemplateMapData,
-    });
-    message.success(res.Msg);
-  } catch (e) {
-    console.log(e);
-  }
-};
-
-// 模板标签数据（列表）
-const getTemplateList = async () => {
-  try {
-    const { data: res } = await getVerifyTemplateMapDataList(queryData);
-    formValue.formList = res.Data || [];
-    formValue.formList.forEach((item) => {
-      if (item.T_label === 4 || item.T_label === 9) {
-        item.T_value = item.T_value ? item.T_value.split('|') : null;
-      } else {
-        item.T_value = item.T_value ? item.T_value : null;
-      }
-    });
-  } catch (e) {
-    console.log(e);
-  }
-};
-
-getTemplateList();
-</script>
-
-<style lang="scss" scoped></style>

src/views/data/edit/index.vue

@@ -5,86 +5,95 @@
     </n-page-header>
     <div class="flex-1 grid grid-cols-4 gap-x-3">
       <n-card>
-        <n-list>
-          <template #header>
-            <n-checkbox
-              v-model:checked="checked"
-              @update:checked="handleSelectAll"
-            >
-              全选
-            </n-checkbox>
-          </template>
-          <n-scrollbar
-            :style="{ maxHeight: `${height - 260}px` }"
-            trigger="none"
-          >
-            <n-checkbox-group
-              v-model:value="checkValues"
-              @update:value="handleCheckValues"
-            >
-              <template v-for="item of classList" :key="item.T_id">
-                <n-list-item class="mr-5">
-                  <template #prefix>
-                    <n-checkbox :value="item.T_id" />
-                  </template>
-                  <template #suffix>
-                    <n-space :wrap="false">
-                      <EditClass
-                        :task="task"
-                        :taskClass="item"
-                        :getClassList="getClassList"
-                      />
-                      <DeleteClass
-                        :task="task"
-                        :taskClass="item"
-                        :getClassList="getClassList"
-                      />
-                    </n-space>
+        <n-tabs>
+          <n-tab-pane name="1" tab="设备">
+            <n-list>
+              <template #header>
+                <n-checkbox
+                  v-model:checked="checked"
+                  @update:checked="handleSelectAll"
+                >
+                  全选
+                </n-checkbox>
+              </template>
+              <n-scrollbar
+                :style="{ maxHeight: `${height - 310}px` }"
+                trigger="none"
+              >
+                <n-checkbox-group
+                  v-model:value="checkValues"
+                  @update:value="handleCheckValues"
+                >
+                  <template v-for="item of classList" :key="item.T_id">
+                    <n-list-item class="mr-5">
+                      <template #prefix>
+                        <n-checkbox :value="item.T_id" />
+                      </template>
+                      <template #suffix>
+                        <n-space :wrap="false">
+                          <EditClass
+                            :task="task"
+                            :taskClass="item"
+                            :getClassList="getClassList"
+                          />
+                          <DeleteClass
+                            :task="task"
+                            :taskClass="item"
+                            :getClassList="getClassList"
+                          />
+                        </n-space>
+                      </template>
+                      <n-thing>
+                        <template #header> {{ item.T_id }} </template>
+                        <template #description> {{ item.T_sn }} </template>
+                      </n-thing>
+                    </n-list-item>
                   </template>
-                  <n-thing>
-                    <template #header> {{ item.T_id }} </template>
-                    <template #description> {{ item.T_sn }} </template>
-                  </n-thing>
-                </n-list-item>
+                </n-checkbox-group>
+              </n-scrollbar>
+              <template #footer>
+                <n-gradient-text type="info">
+                  传感器总数：{{ classList.length }}
+                </n-gradient-text>
               </template>
-            </n-checkbox-group>
-          </n-scrollbar>
-          <template #footer>
-            <n-gradient-text type="info">
-              传感器总数：{{ classList.length }}
-            </n-gradient-text>
-          </template>
-        </n-list>
-      </n-card>
-      <n-card class="h-full col-span-3">
-        <div class="h-full flex flex-col gap-y-3">
-          <n-space align="center">
-            <n-date-picker
-              value-format="yyyy-MM-dd HH:mm"
-              @update:formatted-value="
-                (value) => {
-                  queryData.Time_start = value[0];
-                  queryData.Time_end = value[1];
-                }
-              "
-              type="datetimerange"
-              clearable
-            />
-            <n-button type="primary" @click="getDataList">搜索</n-button>
-            <ExportVue :task="task" :class-list="classList" />
-            <ImportVue :task="task" />
-            <ImportPlatform :task="task" />
-            <AddVue :class-list="classList" :task="task" />
-            <SetVue @submit="handleSet" />
-          </n-space>
-          <div>
-            <TemplateForm
+            </n-list>
+          </n-tab-pane>
+          <n-tab-pane name="2" tab="表单">
+            <FormList
               :task="task"
               :class-list="classList"
               :time="time"
               :temporal-interval="temporalInterval"
             />
-          </div>
+          </n-tab-pane>
+        </n-tabs>
+      </n-card>
+      <n-card class="h-full col-span-3">
+        <div class="h-full flex flex-col gap-y-3">
+          <n-space justify="space-between">
+            <n-input-group>
+              <n-date-picker
+                format="yyyy-MM-dd HH:mm"
+                :time-picker-props="{ format: 'HH:mm' }"
+                @update:formatted-value="
+                  (value) => {
+                    queryData.Time_start = value[0];
+                    queryData.Time_end = value[1];
+                  }
+                "
+                type="datetimerange"
+                clearable
+              />
+              <n-button type="primary" @click="getDataList">搜索</n-button>
+            </n-input-group>
+            <n-space>
+              <ExportVue :task="task" :class-list="classList" />
+              <ImportVue :task="task" />
+              <ImportPlatform :task="task" />
+              <AddVue :class-list="classList" :task="task" />
+              <SetVue @submit="handleSet" />
+            </n-space>
+          </n-space>
           <n-tabs
             type="segment"
             animated
@@ -93,7 +102,7 @@
           >
             <n-tab-pane name="温度" tab="温度">
               <Chart
-                :style="{ minHeight: `${height - 320}px` }"
+                :style="{ minHeight: `${height - 300}px` }"
                 ref="chart1"
                 constructor-type="stockChart"
                 :options="chartOptions1"
@@ -101,7 +110,7 @@
             </n-tab-pane>
             <n-tab-pane name="湿度" tab="湿度">
               <Chart
-                :style="{ minHeight: `${height - 320}px` }"
+                :style="{ minHeight: `${height - 300}px` }"
                 ref="chart2"
                 constructor-type="stockChart"
                 :options="chartOptions2"
@@ -153,7 +162,7 @@ import ImportVue from './ImportVue.vue';
 import ImportPlatform from './ImportPlatform.vue';
 import SetVue from './SetVue.vue';
 import ExportVue from './ExportVue.vue';
-import TemplateForm from './TemplateForm.vue';
+import FormList from './FormList.vue';
 import { useWindowSize } from '@vueuse/core';
 import { useNow, useDateFormat } from '@vueuse/core';
 import EditClass from './EditTaskClass.vue';
@@ -436,17 +445,23 @@ const chartOptions1 = {
   // },
 
   chart: {
-    zoomType: 'xy',
+    zooming: {
+      singleTouch: true,
+      resetButton: {},
+      type: 'xy',
+    },
     events: {
       selection(event) {
         // console.log(
-        //   dateFormat('%Y-%m-%d %H:%M:%S', event.xAxis[0].min),
-        //   dateFormat('%Y-%m-%d %H:%M:%S', event.xAxis[0].max)
+        //   dateFormat('%Y-%m-%d %H:%M', event.xAxis[0].min),
+        //   dateFormat('%Y-%m-%d %H:%M', event.xAxis[0].max)
         // );
-        temporalInterval.value = [
-          dateFormat('%Y-%m-%d %H:%M:%S', event.xAxis[0].min),
-          dateFormat('%Y-%m-%d %H:%M:%S', event.xAxis[0].max),
-        ];
+        if (event.xAxis) {
+          temporalInterval.value = [
+            dateFormat('%Y-%m-%d %H:%M', event.xAxis[0].min),
+            dateFormat('%Y-%m-%d %H:%M', event.xAxis[0].max),
+          ];
+        }
       },
     },
   },

src/views/data/source/index.vue

@@ -7,7 +7,8 @@
       <n-input v-model:value="queryData.T_sn" placeholder="请输入SN" />
       <n-input v-model:value="queryData.T_id" placeholder="请输入ID" />
       <n-date-picker
-        value-format="yyyy-MM-dd HH:mm"
+        format="yyyy-MM-dd HH:mm"
+        :time-picker-props="{ format: 'HH:mm' }"
         @update:formatted-value="
           (value) => {
             queryData.Time_start = value[0];
@@ -45,7 +46,8 @@
     >
       <n-form-item label="自定义时间">
         <n-date-picker
-          value-format="yyyy-MM-dd HH:mm"
+          format="yyyy-MM-dd HH:mm"
+          :time-picker-props="{ format: 'HH:mm' }"
           @update:formatted-value="
             (value) => {
               queryData.Time_start = value[0];
@@ -64,14 +66,11 @@
 <script setup>
 import { NSpace, NButton } from 'naive-ui';
 import { extractTaskData, getTaskDataList } from '@/api';
-import { useNow, useDateFormat } from '@vueuse/core';
 
-const formatted = useDateFormat(useNow(), 'YYYY-MM-DD HH:mm:ss');
+const router = useRouter();
 
 const dialog = useDialog();
 
-const notification = useNotification();
-
 const task = window.sessionStorage.getItem('task')
   ? JSON.parse(window.sessionStorage.getItem('task'))
   : {};
@@ -155,14 +154,7 @@ const extractTask = async () => {
       Time_end: queryData.Time_end,
     });
     if (res.Code === 200) {
-      notification.info({
-        title: '数据采集完成',
-        description: `${queryData.Time_start} 至 ${queryData.Time_end}`,
-        meta: `当前时间：${formatted.value}`,
-        duration: 2500,
-        keepAliveOnHover: true,
-      });
-      getDataList();
+      router.back();
     }
   } catch (e) {
     console.log(e);

src/views/equipment/index.vue

@@ -85,6 +85,7 @@ const columns = [
   {
     title: '编号',
     key: 'T_id',
+    // defaultSortOrder: 'descend',
   },
   {
     title: '设备编号',
@@ -148,18 +149,6 @@ const columns = [
 // 设备分类-设备列表
 const data = ref([]);
 
-// 分页数据源
-// const pagination = reactive({
-//   page: queryData.page,
-//   pageSize: queryData.page_z,
-//   itemCount: 0,
-//   onChange: (page) => {
-//     pagination.page = page;
-//     queryData.page = page;
-//     getDataList();
-//   },
-// });
-
 // 模态框数据源
 const modal = reactive({
   title: '',
@@ -190,7 +179,6 @@ const submitCallback = () => {
         return false;
       }
     });
-    getDataList();
   } else {
     editDeviceClass();
   }
@@ -257,6 +245,8 @@ const addDeviceClass = async (T_sn, T_id) => {
     return res.Code;
   } catch (e) {
     console.log(e);
+  } finally {
+    getDataList();
   }
 };
 

src/views/report/audit/TabFour.vue

@@ -12,7 +12,8 @@
     />
     <n-date-picker
       type="datetimerange"
-      value-format="yyyy-MM-dd HH:mm"
+      format="yyyy-MM-dd HH:mm"
+      :time-picker-props="{ format: 'HH:mm' }"
       @update:formatted-value="
         (value) => {
           queryData.Time_start = value[0];

src/views/report/create/index.vue

@@ -17,85 +17,8 @@
       </template>
     </n-page-header>
     <n-scrollbar :style="{ maxHeight: `${height - 150}px` }" trigger="none">
-      <n-form label-width="auto" size="large">
-        <n-grid :cols="12" :x-gap="12">
-          <n-form-item-gi
-            v-for="(item, index) of formValue.formList"
-            :key="item.T_VerifyTemplateMap_id"
-            :span="4"
-            :label="item.T_name"
-          >
-            <template v-if="item.T_label === 3 || item.T_label === 4">
-              <n-select
-                v-model:value="item.T_value"
-                :multiple="item.T_label === 3 ? true : false"
-                label-field="T_id"
-                value-field="T_sn"
-                :max-tag-count="item.T_label === 3 ? 'responsive' : undefined"
-                :options="classList"
-              >
-                <template #action v-if="item.T_label === 3">
-                  <n-space>
-                    <n-button
-                      class="underline"
-                      text
-                      @click="handleSelectAll(index)"
-                      >全选</n-button
-                    >
-                    <n-button
-                      class="underline"
-                      text
-                      @click="handleSelectReverse(index)"
-                      >反选</n-button
-                    >
-                  </n-space>
-                </template>
-              </n-select>
-            </template>
-            <template v-else-if="item.T_label === 7 || item.T_label === 9">
-              <n-date-picker
-                v-model:formatted-value="item.T_value"
-                value-format="yyyy-MM-dd HH:mm"
-                :type="item.T_label === 7 ? 'datetime' : 'datetimerange'"
-                clearable
-                class="w-full"
-              />
-            </template>
-            <template v-else-if="item.T_label === 10 || item.T_label === 11">
-              <n-image class="mr-5" width="100" :src="item.T_value" />
-              <n-upload
-                list-type="image-card"
-                @change="(options) => handleChangeByIndex(options, index)"
-                :default-upload="false"
-                :max="1"
-                v-if="item.T_label === 10"
-              >
-                点击上传
-              </n-upload>
-              <n-space v-else>
-                <n-button @click="() => handleEdit(item)">编辑</n-button>
-                <n-button @click="() => handleRefresh(index)">刷新</n-button>
-              </n-space>
-            </template>
-            <template v-else>
-              <n-input v-model:value="item.T_value" />
-            </template>
-            <n-popover trigger="hover">
-              <template #trigger>
-                <n-icon size="24" class="ml-3">
-                  <InformationCircleOutline />
-                </n-icon>
-              </template>
-              <n-image
-                width="200"
-                :src="item.T_text"
-                v-if="item.T_label === 10 || item.T_label === 11"
-              />
-              <span v-else>{{ item.T_text }}</span>
-            </n-popover>
-          </n-form-item-gi>
-        </n-grid>
-      </n-form>
+      <FormList :form-list="formValue.formList" />
+      <!-- <n-button @click="handleClick">button</n-button> -->
     </n-scrollbar>
   </div>
   <n-modal
@@ -140,11 +63,7 @@
           trigger="none"
           ref="scrollbarRef"
         >
-          <div
-            class="flex items-center"
-            v-for="(item, index) of items"
-            :key="index"
-          >
+          <div class="flex" v-for="(item, index) of items" :key="index">
             <n-badge class="mr-5" type="info" :value="index + 1" />
             <span>{{ item }}</span>
           </div>
@@ -179,10 +98,10 @@ import {
 import * as qiniu from 'qiniu-js';
 import { getToken } from '@/utils/storage/sessionToken';
 import { getFileToken } from '@/common';
-import { InformationCircleOutline } from '@vicons/ionicons5';
 import { useWindowSize } from '@vueuse/core';
 import { NButton } from 'naive-ui';
 import { onBeforeUnmount } from 'vue';
+import FormList from '@/components/FormList.vue';
 
 const { height } = useWindowSize();
 
@@ -200,6 +119,10 @@ const formValue = reactive({
   formList: [],
 });
 
+const handleClick = () => {
+  console.log(formValue.formList);
+};
+
 // 查询数据
 const queryData = reactive({
   T_source: 2,
@@ -216,45 +139,6 @@ const modal = reactive({
   title: '',
 });
 
-// CAD刷新
-const handleRefresh = (index) => {
-  formValue.formList[
-    index
-  ].T_value = `http://coldverifylocal.coldbaozhida.com/CAD/download?type=upload&filename=${queryData.T_task_id}_${queryData.T_VerifyTemplate_id}_${formValue.formList[index].T_id}.png`;
-};
-
-// CAD编辑
-const handleEdit = (row) => {
-  window.open(
-    `http://coldverifylocal.coldbaozhida.com/CAD/?task_id=${queryData.T_task_id}&vt_id=${queryData.T_VerifyTemplate_id}&key_id=${row.T_id}`
-  );
-};
-
-const handleChangeByIndex = async ({ file }, i) => {
-  const token = await getFileToken(file.name.split('.')[1]);
-  const observable = qiniu.upload(
-    file.file,
-    file.name,
-    token,
-    {},
-    {
-      useCdnDomain: true,
-    }
-  );
-  observable.subscribe({
-    next: (result) => {
-      // 主要用来展示进度
-      console.warn(result);
-    },
-    error: () => {
-      message.error('上传失败');
-    },
-    complete: (res) => {
-      formValue.formList[i].T_value = res.key;
-    },
-  });
-};
-
 //
 const handleChange = async ({ file }) => {
   const token = await getFileToken(file.name.split('.')[1]);
@@ -281,22 +165,6 @@ const handleChange = async ({ file }) => {
   });
 };
 
-// 全选
-const handleSelectAll = (i) => {
-  if (formValue.formList[i].T_value.length !== 0) {
-    return (formValue.formList[i].T_value = []);
-  }
-  formValue.formList[i].T_value = classList.value.map((item) => item.T_sn);
-};
-
-// 反选
-const handleSelectReverse = (i) => {
-  const arr = classList.value.map((item) => item.T_sn);
-  formValue.formList[i].T_value = arr.filter(
-    (item) => !formValue.formList[i].T_value.includes(item)
-  );
-};
-
 // 显示上传验证对话框
 const showUploadModal = () => {
   modal.title = '上传验证';
@@ -383,6 +251,24 @@ const putTemplateData = async () => {
           T_max_time: item.T_max_time,
           T_min_time: item.T_min_time,
         };
+      } else if (item.T_label === 12) {
+        return {
+          T_VerifyTemplateMap_id: item.T_VerifyTemplateMap_id,
+          T_value: item.T_value.join('/'),
+          T_source: item.T_source,
+          T_flow_sort: item.T_flow_sort,
+          T_max_time: item.T_max_time,
+          T_min_time: item.T_min_time,
+        };
+      } else if (item.T_label === 13) {
+        return {
+          T_VerifyTemplateMap_id: item.T_VerifyTemplateMap_id,
+          T_value: `${item.T_value[0].join('|')}/${item.T_value[1]}`,
+          T_source: item.T_source,
+          T_flow_sort: item.T_flow_sort,
+          T_max_time: item.T_max_time,
+          T_min_time: item.T_min_time,
+        };
       } else {
         return {
           T_VerifyTemplateMap_id: item.T_VerifyTemplateMap_id,
@@ -407,6 +293,10 @@ const putTemplateData = async () => {
       for (let i of arr) {
         if (i.T_label === 3 || i.T_label === 9) {
           obj[i.T_name] = i.T_value.join('|');
+        } else if (i.T_label === 12) {
+          obj[i.T_name] = i.T_value.join('/');
+        } else if (i.T_label === 13) {
+          obj[i.T_name] = `${i.T_value[0].join('|')}/${i.T_value[1]}`;
         } else {
           obj[i.T_name] = i.T_value;
         }
@@ -440,6 +330,14 @@ const getTemplateList = async () => {
     formValue.formList.forEach((item) => {
       if (item.T_label === 3 || item.T_label === 9) {
         item.T_value = item.T_value ? item.T_value.split('|') : null;
+      } else if (item.T_label === 12) {
+        item.T_value = item.T_value
+          ? [item.T_value.split('/')[0], item.T_value.split('/')[1]]
+          : null;
+      } else if (item.T_label === 13) {
+        item.T_value = item.T_value
+          ? [item.T_value.split('/')[0].split('|'), item.T_value.split('/')[1]]
+          : null;
       } else {
         item.T_value = item.T_value ? item.T_value : null;
       }

src/views/scheme/index.vue

@@ -17,85 +17,7 @@
       </template>
     </n-page-header>
     <n-scrollbar :style="{ maxHeight: `${height - 150}px` }" trigger="none">
-      <n-form label-width="auto" size="large">
-        <n-grid :cols="12" :x-gap="12">
-          <n-form-item-gi
-            v-for="(item, index) of formValue.formList"
-            :key="item.T_VerifyTemplateMap_id"
-            :span="4"
-            :label="item.T_name"
-          >
-            <template v-if="item.T_label === 3 || item.T_label === 4">
-              <n-select
-                v-model:value="item.T_value"
-                :multiple="item.T_label === 3 ? true : false"
-                label-field="T_id"
-                value-field="T_sn"
-                :max-tag-count="item.T_label === 3 ? 'responsive' : undefined"
-                :options="classList"
-              >
-                <template #action v-if="item.T_label === 3">
-                  <n-space>
-                    <n-button
-                      class="underline"
-                      text
-                      @click="handleSelectAll(index)"
-                      >全选</n-button
-                    >
-                    <n-button
-                      class="underline"
-                      text
-                      @click="handleSelectReverse(index)"
-                      >反选</n-button
-                    >
-                  </n-space>
-                </template>
-              </n-select>
-            </template>
-            <template v-else-if="item.T_label === 7 || item.T_label === 9">
-              <n-date-picker
-                v-model:formatted-value="item.T_value"
-                value-format="yyyy-MM-dd HH:mm"
-                :type="item.T_label === 7 ? 'datetime' : 'datetimerange'"
-                clearable
-                class="w-full"
-              />
-            </template>
-            <template v-else-if="item.T_label === 10 || item.T_label === 11">
-              <n-image class="mr-5" width="100" :src="item.T_value" />
-              <n-upload
-                list-type="image-card"
-                @change="(options) => handleChangeByIndex(options, index)"
-                :default-upload="false"
-                :max="1"
-                v-if="item.T_label === 10"
-              >
-                点击上传
-              </n-upload>
-              <n-space v-else>
-                <n-button @click="() => handleEdit(item)">编辑</n-button>
-                <n-button @click="() => handleRefresh(index)">刷新</n-button>
-              </n-space>
-            </template>
-            <template v-else>
-              <n-input v-model:value="item.T_value" />
-            </template>
-            <n-popover trigger="hover">
-              <template #trigger>
-                <n-icon size="24" class="ml-3">
-                  <InformationCircleOutline />
-                </n-icon>
-              </template>
-              <n-image
-                width="200"
-                :src="item.T_text"
-                v-if="item.T_label === 10 || item.T_label === 11"
-              />
-              <span v-else>{{ item.T_text }}</span>
-            </n-popover>
-          </n-form-item-gi>
-        </n-grid>
-      </n-form>
+      <FormList :form-list="formValue.formList" />
     </n-scrollbar>
   </div>
   <n-modal
@@ -137,11 +59,7 @@
           trigger="none"
           ref="scrollbarRef"
         >
-          <div
-            class="flex items-center"
-            v-for="(item, index) of items"
-            :key="index"
-          >
+          <div class="flex" v-for="(item, index) of items" :key="index">
             <n-badge class="mr-5" type="info" :value="index + 1" />
             <span>{{ item }}</span>
           </div>
@@ -176,10 +94,10 @@ import {
 import * as qiniu from 'qiniu-js';
 import { getToken } from '@/utils/storage/sessionToken';
 import { getFileToken } from '@/common';
-import { InformationCircleOutline } from '@vicons/ionicons5';
 import { NButton } from 'naive-ui';
 import { useWindowSize } from '@vueuse/core';
 import { onBeforeUnmount } from 'vue';
+import FormList from '@/components/FormList.vue';
 
 const { height } = useWindowSize();
 
@@ -213,45 +131,6 @@ const modal = reactive({
   title: '',
 });
 
-// 刷新CAD
-const handleRefresh = (index) => {
-  formValue.formList[
-    index
-  ].T_value = `http://coldverifylocal.coldbaozhida.com/CAD/download?type=upload&filename=${queryData.T_task_id}_${queryData.T_VerifyTemplate_id}_${formValue.formList[index].T_id}.png`;
-};
-
-// CAD编辑
-const handleEdit = (row) => {
-  window.open(
-    `http://coldverifylocal.coldbaozhida.com/CAD/?task_id=${queryData.T_task_id}&vt_id=${queryData.T_VerifyTemplate_id}&key_id=${row.T_id}`
-  );
-};
-
-const handleChangeByIndex = async ({ file }, i) => {
-  const token = await getFileToken(file.name.split('.')[1]);
-  const observable = qiniu.upload(
-    file.file,
-    file.name,
-    token,
-    {},
-    {
-      useCdnDomain: true,
-    }
-  );
-  observable.subscribe({
-    next: (result) => {
-      // 主要用来展示进度
-      console.warn(result);
-    },
-    error: () => {
-      message.error('上传失败');
-    },
-    complete: (res) => {
-      formValue.formList[i].T_value = res.key;
-    },
-  });
-};
-
 /**
  * 上传文件
  * @param file
@@ -283,28 +162,6 @@ const handleChange = async ({ file }) => {
 };
 
 /**
- * 全选
- * @param i
- */
-const handleSelectAll = (i) => {
-  if (formValue.formList[i].T_value.length !== 0) {
-    return (formValue.formList[i].T_value = []);
-  }
-  formValue.formList[i].T_value = classList.value.map((item) => item.T_sn);
-};
-
-/**
- * 反选
- * @param i
- */
-const handleSelectReverse = (i) => {
-  const arr = classList.value.map((item) => item.T_sn);
-  formValue.formList[i].T_value = arr.filter(
-    (item) => !formValue.formList[i].T_value.includes(item)
-  );
-};
-
-/**
  * 显示上传验证
  */
 const showUploadModal = () => {