20230426

src/components/FormList.vue

@@ -61,9 +61,9 @@
           v-else-if="item.T_label === 9"
         />
         <!-- 图片 -->
-        <template v-else-if="item.T_label === 10">
+        <template v-else-if="item.T_label === 10" >
           <n-image class="mr-5" width="100" :src="item.T_value" />
-          <n-upload
+            <n-upload
             list-type="image-card"
             @change="(options) => handleChangeByIndex(options, index)"
             :default-upload="false"
@@ -74,11 +74,14 @@
         </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>
+          <div style="display: flex;flex: 1;align-items: center;" >
+            <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>
+          </div>
+          
         </template>
         <!-- 时间 注释 -->
         <template v-else-if="item.T_label === 12">
@@ -115,6 +118,7 @@
           width="100"
           :src="item.T_text"
           v-if="item.T_label === 10 || item.T_label === 11"
+          style="margin-right: 36px;"
         />
         <n-popover trigger="hover" v-else>
           <template #trigger>

src/views/data/edit/FormList.vue

@@ -1,71 +1,32 @@
 <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"
-      >
+      <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"
-        >
+        <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-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-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="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"
-        />
+        <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 list-type="image-card" @change="(options) => handleChangeByIndex(options, index)"
+            :default-upload="false" :max="1">
             点击上传
           </n-upload>
         </template>
@@ -88,11 +49,7 @@
               <InformationCircleOutline />
             </n-icon>
           </template>
-          <n-image
-            width="200"
-            :src="item.T_text"
-            v-if="item.T_label === 10 || item.T_label === 11"
-          />
+          <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>

src/views/data/edit/ImportPlatform.vue

@@ -137,15 +137,13 @@ const showImportModal = () => {
 
 // 批量导入
 const handleImport = async () => {
-  // if (dataList.value.length === 0) {
-  //   return message.info('无数据');
-  // }
+  if (dataList.value.length === 0) {
+    return message.info('无数据');
+  }
   
   let arr = dataList.value
-  console.log('点击导入',arr)
   for (let i = 0 ;i< arr.length;i++) {
       const {data:res} = await addTask(arr[i]);
-      console.log('返回了',res)
       if (res.Code == 200) {
         percentage.value += 1;
         if (percentage.value === total.value) {
@@ -155,6 +153,8 @@ const handleImport = async () => {
             keepAliveOnHover: true,
           });
         }
+      }else{
+        break
       }
     }
 

src/views/data/edit/formData.vue

@@ -0,0 +1,101 @@
+<template>
+    <div class="foromData">
+        <n-form ref="formRef" :model="model" :rules="rules" label-placement="top" label-width="auto">
+            <!-- 1 -->
+            <n-form-item label="Input" path="inputValue" width="100">
+                <n-input v-model:value="model.inputValue" placeholder="Input" />
+            </n-form-item>
+
+            <!-- 2 -->
+            <n-form-item label="Input Number" path="inputNumberValue">
+                <n-input-number v-model:value="model.inputNumberValue" />
+            </n-form-item>
+
+            <!-- 3 -->
+            <n-form-item label="Select" path="selectValue">
+                <n-select v-model:value="model.selectValue" placeholder="Select" :options="generalOptions" />
+            </n-form-item>
+
+            <!-- 4 -->
+            <n-form-item label="Multiple Select" path="multipleSelectValue">
+                <n-select v-model:value="model.multipleSelectValue" placeholder="Select" :options="generalOptions"
+                    multiple />
+            </n-form-item>
+
+            <!-- 5 -->
+            <n-form-item label="Multiple Select" path="multipleSelectValue">
+                <n-divider />
+            </n-form-item>
+
+            <!-- 7 -->
+            <n-form-item label="Datetime" path="datetimeValue">
+                <n-date-picker v-model:value="model.datetimeValue" type="datetime" />
+            </n-form-item>
+
+            <!-- 9 -->
+            <n-form-item label="Datetime" path="datetimeValue">
+                <n-date-picker v-model:value="range" type="datetimerange" clearable />
+            </n-form-item>
+
+            <!-- 10 -->
+            <n-form-item label="Datetime" path="datetimeValue">
+                <n-upload action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f" :default-file-list="fileList"
+                    list-type="image-card">
+                    点击上传
+                </n-upload>
+                <n-divider />
+            </n-form-item>
+
+            <!-- 11 -->
+            <n-form-item label="Datetime" path="datetimeValue">
+                <n-upload action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f" :default-file-list="fileList"
+                    list-type="image-card">
+                    点击上传
+                </n-upload>
+                <n-divider />
+            </n-form-item>
+
+            <!-- 12 -->
+            <n-form-item label="Datetime" path="datetimeValue">
+                <n-date-picker v-model:value="model.datetimeValue" type="datetime" />
+            </n-form-item>
+
+            <!-- 13 -->
+            <n-form-item label="Datetime" path="datetimeValue">
+                <n-date-picker v-model:value="range" type="datetimerange" clearable />
+            </n-form-item>
+        </n-form>
+    </div>
+</template>
+
+<script setup>
+import { reactive } from "vue"
+const props = defineProps({
+    task: {
+        type: Object,
+        default: () => ({}),
+    },
+    classList: {
+        type: Array,
+        default: () => [],
+    },
+    time: {
+        type: String,
+        default: null,
+    },
+    temporalInterval: {
+        type: Array,
+        default: () => [],
+    },
+})
+const model = reactive({
+    inputValue: ''
+})
+
+</script>
+
+<style lang="scss">
+.foromData {
+    overflow-y: auto;
+    height: 70vh;
+}</style>

src/views/data/edit/index.vue

@@ -9,21 +9,12 @@
           <n-tab-pane name="1" tab="设备">
             <n-list>
               <template #header>
-                <n-checkbox
-                  v-model:checked="checked"
-                  @update:checked="handleSelectAll"
-                >
+                <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"
-                >
+              <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>
@@ -31,16 +22,8 @@
                       </template>
                       <template #suffix>
                         <n-space :wrap="false">
-                          <EditClass
-                            :task="task"
-                            :taskClass="item"
-                            :getClassList="getClassList"
-                          />
-                          <DeleteClass
-                            :task="task"
-                            :taskClass="item"
-                            :getClassList="getClassList"
-                          />
+                          <EditClass :task="task" :taskClass="item" :getClassList="getClassList" />
+                          <DeleteClass :task="task" :taskClass="item" :getClassList="getClassList" />
                         </n-space>
                       </template>
                       <n-thing>
@@ -59,12 +42,7 @@
             </n-list>
           </n-tab-pane>
           <n-tab-pane name="2" tab="表单">
-            <FormList
-              :task="task"
-              :class-list="classList"
-              :time="time"
-              :temporal-interval="temporalInterval"
-            />
+            <FormList :task="task" :class-list="classList" :time="time" :temporal-interval="temporalInterval" />
           </n-tab-pane>
         </n-tabs>
       </n-card>
@@ -72,18 +50,11 @@
         <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-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>
@@ -94,39 +65,21 @@
               <SetVue @submit="handleSet" />
             </n-space>
           </n-space>
-          <n-tabs
-            type="segment"
-            animated
-            v-model:value="tabChart"
-            @update:value="handleTabChange"
-          >
+          <n-tabs type="segment" animated v-model:value="tabChart" @update:value="handleTabChange">
             <n-tab-pane name="温度" tab="温度">
-              <Chart
-                :style="{ minHeight: `${height - 300}px` }"
-                ref="chart1"
-                constructor-type="stockChart"
-                :options="chartOptions1"
-              ></Chart>
+              <Chart :style="{ minHeight: `${height - 300}px` }" ref="chart1" constructor-type="stockChart"
+                :options="chartOptions1"></Chart>
             </n-tab-pane>
             <n-tab-pane name="湿度" tab="湿度">
-              <Chart
-                :style="{ minHeight: `${height - 300}px` }"
-                ref="chart2"
-                constructor-type="stockChart"
-                :options="chartOptions2"
-              ></Chart>
+              <Chart :style="{ minHeight: `${height - 300}px` }" ref="chart2" constructor-type="stockChart"
+                :options="chartOptions2"></Chart>
             </n-tab-pane>
           </n-tabs>
         </div>
       </n-card>
     </div>
   </div>
-  <n-modal
-    v-model:show="modal.showModal"
-    :title="modal.title"
-    :show-icon="false"
-    preset="dialog"
-  >
+  <n-modal v-model:show="modal.showModal" :title="modal.title" :show-icon="false" preset="dialog">
     <template v-if="modal.title === '温度'">
       <n-form-item show-require-mark>
         <n-input v-model:value="formValue.T_t" />
@@ -163,6 +116,8 @@ import ImportPlatform from './ImportPlatform.vue';
 import SetVue from './SetVue.vue';
 import ExportVue from './ExportVue.vue';
 import FormList from './FormList.vue';
+// import ForData from './formData.vue';
+
 import { useWindowSize } from '@vueuse/core';
 import { useNow, useDateFormat } from '@vueuse/core';
 import EditClass from './EditTaskClass.vue';
@@ -457,6 +412,7 @@ const chartOptions1 = {
         //   dateFormat('%Y-%m-%d %H:%M', event.xAxis[0].max)
         // );
         if (event.xAxis) {
+          console.log('时间区间选择', 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/report/create/index.vue

@@ -239,6 +239,7 @@ const handleDownload = () => {
 
 // 生成报告
 const putTemplateData = async () => {
+  
   try {
     const arr = toRaw(formValue.formList);
     const VerifyTemplateMapData = arr.map((item) => {
@@ -352,7 +353,7 @@ onBeforeUnmount(() => {
   clearTimeout(timer);
 });
 
-getClassList();
+// getClassList();
 getTemplateList();
 </script>