230731

src/api/modules/TaskData.js

@@ -121,3 +121,21 @@ export const deleteTaskDataClass = (data) => {
     baseURL: baseURL4,
   });
 };
+
+
+export const TaskDatajpg = (data) => {
+  return service.request({
+    method: 'POST',
+    url: '/TaskData/jpg',
+    data,
+    baseURL: baseURL4,
+  });
+};
+export const TaskDatajpgSta = (data) => {
+  return service.request({
+    method: 'POST',
+    url: '/TaskData/JPG/State',
+    data,
+    baseURL: baseURL4,
+  });
+};

src/views/data/edit/index.vue

@@ -12,20 +12,22 @@
                 <div style="">
                   <div style="display: flex;justify-content: space-between;align-items: center;margin-bottom: 10px;">
                     <n-date-picker format="yyyy-MM-dd HH:mm" v-model:value="pickTimes.picktmSta"
-                      :time-picker-props="{ format: 'HH:mm' }" @update:formatted-value="setTimeFuns" @focus="focusFun(1)" @blur="blurFun" type="datetimerange" clearable />
+                      :time-picker-props="{ format: 'HH:mm' }" @update:formatted-value="setTimeFuns" @focus="focusFun(1)"
+                      @blur="blurFun" type="datetimerange" clearable />
                     <n-button type="primary" @click="renderFun(1)" style="margin-left: 10px;">渲染</n-button>
                   </div>
                   <div style="display: flex;align-items: center;justify-content: space-between;">
                     <n-checkbox v-model:checked="checked" @update:checked="handleSelectAll" style="flex-shrink: 0;">
                       全选
                     </n-checkbox>
-                    <div @click="alldeleteFun" style="text-decoration: underline;color: #2d8cf0;cursor: pointer;">批量删除</div>
+                    <div @click="alldeleteFun" style="text-decoration: underline;color: #2d8cf0;cursor: pointer;">批量删除
+                    </div>
                   </div>
 
                 </div>
               </template>
               <!-- <n-scrollbar :style="{ maxHeight: `${height - 310}px` }" trigger="none"> -->
-              <div  :style="{ height: (height - 400)+'px'}" style="overflow-y: auto">
+              <div :style="{ height: (height - 400) + 'px' }" style="overflow-y: auto">
                 <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">
@@ -34,7 +36,7 @@
                       </template>
                       <template #suffix>
                         <n-space :wrap="false">
-                          
+
                           <DeleteClass :task="task" :taskClass="item" :getClassList="delFun" />
                         </n-space>
                       </template>
@@ -61,7 +63,7 @@
               :temporal-interval="temporalInterval" />
           </n-tab-pane>
           <n-tab-pane name="3" tab="存档">
-            <div  :style="{ height: (height - 300)+'px'}" >
+            <div :style="{ height: (height - 300) + 'px' }">
               <OnFile :task="task"></OnFile>
             </div>
           </n-tab-pane>
@@ -71,82 +73,113 @@
         <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" v-model:value="pickTimes.pickleveTime" :time-picker-props="{ format: 'HH:mm' }" @focus="focusFun(2)" @blur="blurFun"
-              @update:formatted-value="setTimeFuns"  type="datetimerange" clearable/>
-
-              
-              <n-button type="primary" @click=" renderFun(2) ">渲染</n-button>
+              <n-date-picker format="yyyy-MM-dd HH:mm" v-model:value="pickTimes.pickleveTime"
+                :time-picker-props="{ format: 'HH:mm' }" @focus="focusFun(2)" @blur="blurFun"
+                @update:formatted-value="setTimeFuns" type="datetimerange" clearable />
+              <n-button type="primary" @click=" renderFun(2)" style="margin-right: 20px;">渲染</n-button>
+              <n-popconfirm @positive-click="handlePositiveClick" :show-icon="false">
+                <template #trigger>
+                  <n-button type="primary">概况图</n-button>
+                </template>
+                <div style="padding-top:20px">
+                  <n-form :model="stateJpg" label-width="auto" label-placement="left">
+                    <n-form-item label="下限" path="value">
+                      <n-input v-model:value="stateJpg.TemperatureMin" />
+                    </n-form-item>
+                    <n-form-item label="上限" path="value">
+                      <n-input v-model:value="stateJpg.TemperatureMax" />
+                    </n-form-item>
+                  </n-form>
+                </div>
+              </n-popconfirm>
             </n-input-group>
             <n-space>
-              <ExportVue :queryObj=" queryData " :pickleveTime=" pickTimes.pickleveTime " :checkData=" checkValues " />
-              <ImportVue @importFiles="importFile" :task="task"/>
-              <ImportPlatform :task=" task " />
-              <AddVue :class-list=" classList" @addFuns="addFuns" :task=" task " />
+              <ExportVue :queryObj="queryData" :pickleveTime="pickTimes.pickleveTime" :checkData="checkValues" />
+              <ImportVue @importFiles="importFile" :task="task" />
+              <ImportPlatform :task="task" />
+              <AddVue :class-list="classList" @addFuns="addFuns" :task="task" />
               <SetVue />
 
-              <ratioZoom @ratioZoomFun="renderFun(1)" :queryObj=" queryData " :pickleveTime=" pickTimes.pickleveTime " :checkData=" checkValues "></ratioZoom>
+              <ratioZoom @ratioZoomFun="renderFun(1)" :queryObj="queryData" :pickleveTime="pickTimes.pickleveTime"
+                :checkData="checkValues"></ratioZoom>
 
-              <editCopy :queryObj=" queryData " :pickleveTime=" pickTimes.pickleveTime " :checkData=" checkValues " :classList=" classList " />
-              <AverageCopy :queryObj=" queryData " :pickleveTime=" pickTimes.pickleveTime " :checkData=" checkValues " :classList=" classList "></AverageCopy>
-              <editLeak :queryObj=" queryData " :pickleveTime=" pickTimes.pickleveTime " :checkData=" checkValues " />
-              <editTendency :queryObj=" queryData " :pickleveTime=" pickTimes.pickleveTime " :checkData=" checkValues " />
+              <editCopy :queryObj="queryData" :pickleveTime="pickTimes.pickleveTime" :checkData="checkValues"
+                :classList="classList" />
+              <AverageCopy :queryObj="queryData" :pickleveTime="pickTimes.pickleveTime" :checkData="checkValues"
+                :classList="classList"></AverageCopy>
+              <editLeak :queryObj="queryData" :pickleveTime="pickTimes.pickleveTime" :checkData="checkValues" />
+              <editTendency :queryObj="queryData" :pickleveTime="pickTimes.pickleveTime" :checkData="checkValues" />
 
-              <editMath :queryObj=" queryData " :pickleveTime=" pickTimes.pickleveTime " :checkData=" checkValues " />
-              <editFixation :queryObj=" queryData " :pickleveTime=" pickTimes.pickleveTime " :checkData=" checkValues " />
-              <skewSection :queryObj=" queryData " :pickleveTime=" pickTimes.pickleveTime " :checkData=" checkValues " />
+              <editMath :queryObj="queryData" :pickleveTime="pickTimes.pickleveTime" :checkData="checkValues" />
+              <editFixation :queryObj="queryData" :pickleveTime="pickTimes.pickleveTime" :checkData="checkValues" />
+              <skewSection :queryObj="queryData" :pickleveTime="pickTimes.pickleveTime" :checkData="checkValues" />
 
-              
-              <editSmooth :queryObj=" queryData " :pickleveTime=" pickTimes.pickleveTime " :checkData=" checkValues " />
-              <BesselCurve :queryObj=" queryData " :pickleveTime=" pickTimes.pickleveTime " :checkData=" checkValues " ></BesselCurve>
+
+              <editSmooth :queryObj="queryData" :pickleveTime="pickTimes.pickleveTime" :checkData="checkValues" />
+              <BesselCurve :queryObj="queryData" :pickleveTime="pickTimes.pickleveTime" :checkData="checkValues">
+              </BesselCurve>
             </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="温度">
-              <highchartsT :dataList=" dataList " @setTimeFun=" setTimeFun "></highchartsT>
+              <highchartsT :dataList="dataList" @setTimeFun="setTimeFun"></highchartsT>
 
             </n-tab-pane>
             <n-tab-pane name="湿度" tab="湿度">
-              <highchartsH :dataList=" dataList " @setTimeFun=" setTimeFun "></highchartsH>
+              <highchartsH :dataList="dataList" @setTimeFun="setTimeFun"></highchartsH>
             </n-tab-pane>
           </n-tabs>
         </div>
-      </n-card> 
+      </n-card>
     </div>
   </div>
-  <n-modal v-model:show=" modal.showModal " :title=" modal.title " :show-icon=" false " preset="dialog">
-    <template v-if=" modal.title === '温度' ">
+  <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 " />
+        <n-input v-model:value="formValue.T_t" />
       </n-form-item>
     </template>
     <template v-else>
       <n-form-item show-require-mark>
-        <n-input v-model:value=" formValue.T_rh " />
+        <n-input v-model:value="formValue.T_rh" />
       </n-form-item>
     </template>
     <n-space justify="end">
-      <n-popconfirm @positive-click=" deleteTask ">
+      <n-popconfirm @positive-click="deleteTask">
         <template #trigger>
           <n-button type="error">删除该点</n-button>
         </template>
         是否确认删除？
       </n-popconfirm>
-      <n-button type="primary" @click=" editTask ">确定</n-button>
+      <n-button type="primary" @click="editTask">确定</n-button>
 
     </n-space>
   </n-modal>
   <!-- 编辑 -->
-  <n-modal v-model:show=" showModal " preset="dialog" positive-text="确认" negative-text="取消" :show-icon=" false "
-    @positive-click=" handleEdit ">
-    <n-form :model=" formDatas " label-width="auto" show-require-mark>
+  <n-modal v-model:show="showModal" preset="dialog" positive-text="确认" negative-text="取消" :show-icon="false"
+    @positive-click="handleEdit">
+    <n-form :model="formDatas" label-width="auto" show-require-mark>
       <n-form-item label="编号" path="T_id">
-        <n-input v-model:value=" formDatas.T_id " />
+        <n-input v-model:value="formDatas.T_id" />
       </n-form-item>
       <n-form-item label="SN" path="T_sn">
-        <n-input v-model:value=" formDatas.T_sn " disabled="false" />
+        <n-input v-model:value="formDatas.T_sn" disabled="false" />
       </n-form-item>
     </n-form>
   </n-modal>
+
+  <n-modal v-model:show="showModalChaer" title="概况图" preset="card" style="min-width: 500px;max-width: 500px;min-height: 300px;">
+    <n-spin :show="showLoad">
+        <template #description>
+          加载中，请稍后...
+        </template>
+        <n-image
+          width="500"
+          :src="srcUrl"
+          style="border: 1px solid #ccc;min-height: 200px;"
+        />
+      </n-spin>
+  </n-modal>
 </template>
 
 <script setup>
@@ -162,6 +195,8 @@ import {
   getTaskDataList,
   editTaskDataClass,
   deleteTaskDataClass,
+  TaskDatajpg,
+  TaskDatajpgSta
 } from '@/api';
 import AddVue from './AddVue.vue';
 import ImportVue from './ImportVue.vue';
@@ -194,8 +229,8 @@ import { useWindowSize } from '@vueuse/core';
 import { useNow, useDateFormat } from '@vueuse/core';
 import DeleteClass from './DeleteTaskClass.vue';
 import { dateFormat } from 'highcharts';
-import { TimeDate } from '@/plugin/timeFun';
-import { useMessage,useDialog} from "naive-ui";
+import { TimeDate, TimeData } from '@/plugin/timeFun';
+import { useMessage, useDialog } from "naive-ui";
 import { reactive, ref, watch } from 'vue';
 import { useStore } from "vuex"
 const store = useStore()
@@ -207,12 +242,72 @@ const notification = useNotification();
 const { height } = useWindowSize();
 const formRef = ref(null)
 const message = useMessage();
+const stateJpg = ref({
+  T_task_id: null,
+  SN_List: null,
+  StartTime: null,
+  EndTime: null,
+  TemperatureMin: '2',
+  TemperatureMax: '8',
+})
+const showModalChaer = ref(false)
+const showLoad = ref(true)
+const srcUrl = ref('')
+
+
 
-const importFile = ()=>{
+const handlePositiveClick = () => {
+  srcUrl.value = ''
+  stateJpg.value.T_task_id = queryData.T_task_id
+  if (checkValues.value == null) {
+    message.error('请选择设备');
+    return
+  } else if (checkValues.value.length == 0) {
+    message.error('请选择设备');
+    return
+  } else {
+    const arr = []
+    checkValues.value.forEach(item => {
+      arr.push(item.T_sn + ',' + item.T_id)
+    })
+    stateJpg.value.SN_List = arr.join('|') + '|'
+  }
+  if (pickTimes.pickleveTime == null) {
+    message.error('请选择查询时间');
+    return
+  } else {
+    stateJpg.value.StartTime = TimeData(pickTimes.pickleveTime[0])
+    stateJpg.value.EndTime = TimeData(pickTimes.pickleveTime[1])
+  }
+  TaskDatajpgApi()
+}
+
+const TaskDatajpgApi = async () => {
+  showModalChaer.value = true
+  showLoad.value = true
+  const resIt = await TaskDatajpg(stateJpg.value)
+  if (resIt.data.Code == 200) TaskDatajpgStaApi()
+}
+const TaskDatajpgStaApi = async () => {
+  const resIt = await TaskDatajpgSta({ T_task_id: stateJpg.value.T_task_id })
+  if (resIt.data.Data.state == 1) {
+    setTimeout(() => {
+      TaskDatajpgStaApi()
+    }, 500);
+  } else if(resIt.data.Data.state == 2) {
+    showLoad.value = false
+    srcUrl.value = resIt.data.Data.url
+  }else{
+    message.error(resIt.data.Data.msg)
+    return
+  }
+}
+
+const importFile = () => {
   checkValues.value = []
-    dataList.value = []
-    
-      getClassList()
+  dataList.value = []
+
+  getClassList()
 }
 const task = window.sessionStorage.getItem('task')
   ? JSON.parse(window.sessionStorage.getItem('task'))
@@ -230,23 +325,23 @@ const setTimeFuns = (e) => {
   }
 }
 
-const delFun = ()=>{
+const delFun = () => {
   checkValues.value = []
   dataList.value = []
   getClassList()
 }
 
-const addFuns = (e)=>{
-  console.log('父亲',e)
+const addFuns = (e) => {
+  console.log('父亲', e)
   getClassList();
 }
 
-const blurFun = () =>{
+const blurFun = () => {
   console.log('失去焦点')
   blueData.value = null
 }
-const focusFun = (e)=>{
-  console.log('获取焦点',e)
+const focusFun = (e) => {
+  console.log('获取焦点', e)
   blueData.value = e
 }
 // Modal 数据源
@@ -262,16 +357,16 @@ const modal = reactive({
 
 
 const dialogs = useDialog();
-const alldeleteFun = ()=>{
-  console.log('checkValues.value',checkValues.value)
+const alldeleteFun = () => {
+  console.log('checkValues.value', checkValues.value)
 
   // return
-  if(!checkValues.value){
+  if (!checkValues.value) {
     message.error('请选择至少一项在进行批量操作')
     return
-  }else{
+  } else {
     if (checkValues.value.length) {
-       dialogs.warning({
+      dialogs.warning({
         title: '提示',
         content: `批量删除操作，是否继续？`,
         positiveText: '确认',
@@ -287,24 +382,24 @@ const alldeleteFun = ()=>{
       message.error('请选择至少一项在进行批量操作')
       return
     }
-   
+
   }
-  
+
 }
-const alldeleteApi = async()=>{
+const alldeleteApi = async () => {
   var num = 0
   for (const key of checkValues.value) {
     const { data: res } = await deleteTaskDataClass({
       T_task_id: queryData.T_task_id,
-      T_sn:key.T_sn,
+      T_sn: key.T_sn,
     });
-    num +=1
-    if(num==checkValues.value.length){
-      getClassList();  
+    num += 1
+    if (num == checkValues.value.length) {
+      getClassList();
       message.success('批量删除完成')
-    } 
+    }
   }
-  
+
 }
 
 const dataList = ref([]);
@@ -368,16 +463,16 @@ getClassList();
 //两个pick的value
 
 const pickTimes = reactive({
-  picktmSta:null,
-  pickleveTime:null,
+  picktmSta: null,
+  pickleveTime: null,
 })
 //图表框选时间修改
 const setTimeFun = (e) => {
-  if(blueData.value==1){//等于1左边使用时间
+  if (blueData.value == 1) {//等于1左边使用时间
     pickTimes.picktmSta = [parseInt(e[0].min), parseInt(e[0].max)]
-  }else if(blueData.value==2){
+  } else if (blueData.value == 2) {
     pickTimes.pickleveTime = [parseInt(e[0].min), parseInt(e[0].max)]
-  }else{
+  } else {
     queryData.Time_start = ''
     queryData.Time_end = ''
   }
@@ -391,14 +486,14 @@ const renderFun = async (j) => {
     message.error("哎呀，请选择设备在查询哟");
     return
   }
-  console.log('ee',pickTimes.picktmSta,pickTimes.pickleveTime)
-  if(j==1 && pickTimes.picktmSta!=null){
+  console.log('ee', pickTimes.picktmSta, pickTimes.pickleveTime)
+  if (j == 1 && pickTimes.picktmSta != null) {
     queryData.Time_start = TimeDate(parseInt(pickTimes.picktmSta[0]))
     queryData.Time_end = TimeDate(parseInt(pickTimes.picktmSta[1]))
-  }else if(j==2 && pickTimes.pickleveTime!=null){
+  } else if (j == 2 && pickTimes.pickleveTime != null) {
     queryData.Time_start = TimeDate(parseInt(pickTimes.pickleveTime[0]))
     queryData.Time_end = TimeDate(parseInt(pickTimes.pickleveTime[1]))
-  }else{
+  } else {
     queryData.Time_start = ''
     queryData.Time_end = ''
   }
@@ -454,7 +549,7 @@ const convertDataFun = (array) => {
 
     events: {
       click(e) {
-        
+
         time.value = e.point.x
         if (tabChart.value == '温度') {
           formValue.T_t = e.point.y
@@ -470,9 +565,9 @@ const convertDataFun = (array) => {
         modal.title = tabChart.value == '温度' ? '温度' : '湿度';
         let serName = e.point.series.name
         const b = dataList.value.find(item => item.name == serName)
-        console.log('点击',b,b.data[e.point.index])
+        console.log('点击', b, b.data[e.point.index])
         dataInfo.value = b.data[e.point.index];
-        console.log('点击',e)
+        console.log('点击', e)
       }
     }
   }