时间排序

gerson

2024-12-15 fa6de28a6fe7e79891f3b0f74f2501e010e460b1

 src/components/chat/chatComponents/summaryCom/components/recordSet/RecordSetDialog.vue

@@ -1,29 +1,48 @@
<template>
   <el-dialog :destroy-on-close="true" v-model="isShow" draggable :close-on-click-modal="false" :title="chartValues?.title">
      <RecordSet chartHeight="30rem" ref="recordSetRef" :data="chartValues">
         <TimeRange class="flex-0 m-1" @change="timeRangeChange" />
         <List class="flex-0 m-1" v-model="stepTime" :data="listData" @change="selectStepChange" />
   <el-dialog
      :destroy-on-close="true"
      v-model="isShow"
      draggable
      :close-on-click-modal="false"
      :title="chartValues?.title"
      v-if="computedIsDialog"
   >
      <RecordSet :chartHeight="computedHeight" ref="recordSetRef" :data="chartValues">
         <TimeRange ref="timeRangeRef" v-model="queryRange" class="flex-0 m-1" @change="timeRangeChange" />
         <List  class="flex-0 m-1" v-model="stepTime" :data="listData" @change="selectStepChange" />
      </RecordSet>
   </el-dialog>
   <div v-else v-show="isShow">
      <RecordSet :chartHeight="computedHeight" ref="recordSetRef" :data="chartValues">
         <TimeRange ref="timeRangeRef" v-model="queryRange" class="flex-0 m-1" @change="timeRangeChange" />
		
      </RecordSet>
   </div>
</template>

<script setup lang="ts">
import { nextTick, ref, watch } from 'vue';
import { computed, nextTick, ref, watch } from 'vue';
import RecordSet from './RecordSet.vue';
import List from './components/List.vue';
import TimeRange from './components/TimeRange.vue';
import { queryScadaTimeValues } from '/@/api/ai/chat';
import { formatDate } from '/@/utils/formatTime';
import { useCompRef } from '/@/utils/types';
import { getRecentDateRange } from '/@/utils/util';
import { formatDate } from '/@/utils/formatTime';
import TimeRange from './components/TimeRange.vue';
import List from './components/List.vue';
import service from '/@/utils/request';

const props = defineProps(['otype', 'oname', 'indexName']);
const props = defineProps(['otype', 'oname', 'indexName', 'isDialog', 'height','metrics']);
// SDVAL_FULL_FLOW true 25 DEV_FLOW_W

const computedIsDialog = computed(() => props.isDialog ?? true);
const computedHeight = computed(() => props.height ?? '30rem');

const isShow = defineModel({
   type: Boolean,
});

const recordSetRef = useCompRef(RecordSet);
const timeRangeRef = useCompRef(TimeRange);

const listData = {
   list: [
@@ -40,31 +59,63 @@

const queryRange = ref<string[]>(null);
const timeRangeChange = (val) => {
   queryRange.value = val;
   setChartData(queryRange.value);
   setChartData();
};

const selectStepChange = (val) => {
   setChartData(queryRange.value);
   setChartData();
};
const stepTime = ref('5 minutes');
const chartValues = ref(null);
const setChartData = async (timeRange: string[]) => {
   const res = await queryScadaTimeValues({
      // 设备类型
      ptype: props.otype,
      // 设备名称
      pname: props.oname,
      otype: props.indexName,
      start_time: timeRange[0],
      end_time: timeRange[1],
      step_time: stepTime.value,
   });
const setChartData = async () => {
   let res = computedIsDialog.value
      ? await queryScadaTimeValues({
            // 设备类型
            ptype: props.otype,
            // 设备名称
            pname: props.oname,
            otype: props.indexName,
            start_time: timeRangeRef.value.formatDateValue[0],
            end_time: timeRangeRef.value.formatDateValue[1],
            step_time: stepTime.value,
        })
      : await service({
            url: props.metrics.url,
            method: 'post',
            data: {
               start_time: timeRangeRef.value.formatDateValue[0],
               end_time: timeRangeRef.value.formatDateValue[1],
            },
        });
   if (!computedIsDialog.value) {
      res = {
         json_ok: res.json_ok,
         values: {
            title: props.metrics.title,
            values: res.values,
            cols: [
               {
                  title: '时间',
                  type: 'time',
               },
               {
                  title: '值',
                  type: 'value',
               },
            ],
         },
      };
   }
   chartValues.value = res.values;
   chartValues.value.chart = 'single_line';
   nextTick(() => {
      setTimeout(() => {
         recordSetRef.value.drawChart();
         if (recordSetRef.value.isMultiCompare) {
            recordSetRef.value.handleData();
            recordSetRef.value.handleMultiCompare();
         } else {
            recordSetRef.value.drawChart();
         }
      }, 0);
   });
};
@@ -76,7 +127,12 @@
         return;
      }
      queryRange.value = getRecentDateRange(1).map((item) => formatDate(item));
      setChartData(queryRange.value);
      nextTick(() => {
         setChartData();
      });
   },
   {
      immediate:true
   }
);
</script>