fix: datetimerange over 7 days

src/components/device-page/device-card/history-diag-card/camera-history-diag-card.vue

@@ -17,6 +17,21 @@ const { stationCode, ndmCamera } = toRefs(props);
 const searchFields = reactive({
   dateTimeRange: undefined as DatePickerProps['value'],
 });
+const onDateChange = (value: [number, number] | null) => {
+  if (!value) {
+    return;
+  }
+  const [start, end] = value;
+  const diffDays = dayjs(end).diff(dayjs(start), 'day');
+  if (diffDays > 7) {
+    // 如果超过7天，自动调整结束时间
+    const adjustedEnd = dayjs(start).add(7, 'day').valueOf();
+    searchFields.dateTimeRange = [start, adjustedEnd];
+    window.$message.warning('时间范围不能超过7天，已自动调整');
+  } else {
+    searchFields.dateTimeRange = value;
+  }
+};
 
 type DeviceStatusHistoryDiagCardInst = InstanceType<typeof DeviceStatusHistoryDiagCard> | null;
 type DeviceAlarmHistoryDiagCardInst = InstanceType<typeof DeviceAlarmHistoryDiagCard> | null;
@@ -55,7 +70,7 @@ const selectedCards = ref<string[]>([...diagCards.value.map((option) => `${optio
         <NFlex justify="space-between" :wrap="false">
           <NGrid :x-gap="8" :y-gap="8">
             <NGi :span="20">
-              <NDatePicker v-model:value="searchFields.dateTimeRange" type="datetimerange" />
+              <NDatePicker v-model:value="searchFields.dateTimeRange" type="datetimerange" @update:value="onDateChange" />
             </NGi>
             <NGi :span="20">
               <NSelect v-model:value="selectedCards" multiple :options="diagCards" />

src/components/device-page/device-card/history-diag-card/decoder-history-diag-card.vue

@@ -18,6 +18,21 @@ const { stationCode, ndmDecoder } = toRefs(props);
 const searchFields = reactive({
   dateTimeRange: undefined as DatePickerProps['value'],
 });
+const onDateChange = (value: [number, number] | null) => {
+  if (!value) {
+    return;
+  }
+  const [start, end] = value;
+  const diffDays = dayjs(end).diff(dayjs(start), 'day');
+  if (diffDays > 7) {
+    // 如果超过7天，自动调整结束时间
+    const adjustedEnd = dayjs(start).add(7, 'day').valueOf();
+    searchFields.dateTimeRange = [start, adjustedEnd];
+    window.$message.warning('时间范围不能超过7天，已自动调整');
+  } else {
+    searchFields.dateTimeRange = value;
+  }
+};
 
 type DeviceStatusHistoryDiagCardInst = InstanceType<typeof DeviceStatusHistoryDiagCard> | null;
 type DeviceAlarmHistoryDiagCardInst = InstanceType<typeof DeviceAlarmHistoryDiagCard> | null;
@@ -60,7 +75,7 @@ const selectedCards = ref<string[]>([...diagCards.value.map((option) => `${optio
         <NFlex justify="space-between" :wrap="false">
           <NGrid :x-gap="8" :y-gap="8">
             <NGi :span="20">
-              <NDatePicker v-model:value="searchFields.dateTimeRange" type="datetimerange" />
+              <NDatePicker v-model:value="searchFields.dateTimeRange" type="datetimerange" @update:value="onDateChange" />
             </NGi>
             <NGi :span="20">
               <NSelect v-model:value="selectedCards" multiple :options="diagCards" />

src/components/device-page/device-card/history-diag-card/keyboard-history-diag-card.vue

@@ -16,6 +16,21 @@ const { stationCode, ndmKeyboard } = toRefs(props);
 const searchFields = reactive({
   dateTimeRange: undefined as DatePickerProps['value'],
 });
+const onDateChange = (value: [number, number] | null) => {
+  if (!value) {
+    return;
+  }
+  const [start, end] = value;
+  const diffDays = dayjs(end).diff(dayjs(start), 'day');
+  if (diffDays > 7) {
+    // 如果超过7天，自动调整结束时间
+    const adjustedEnd = dayjs(start).add(7, 'day').valueOf();
+    searchFields.dateTimeRange = [start, adjustedEnd];
+    window.$message.warning('时间范围不能超过7天，已自动调整');
+  } else {
+    searchFields.dateTimeRange = value;
+  }
+};
 
 type DeviceStatusHistoryDiagCardInst = InstanceType<typeof DeviceStatusHistoryDiagCard> | null;
 const deviceStatusHistoryDiagCardRef = useTemplateRef<DeviceStatusHistoryDiagCardInst>('deviceStatusHistoryDiagCardRef');
@@ -48,7 +63,7 @@ const selectedCards = ref<string[]>([...diagCards.value.map((option) => `${optio
         <NFlex justify="space-between" :wrap="false">
           <NGrid :x-gap="8" :y-gap="8">
             <NGi :span="20">
-              <NDatePicker v-model:value="searchFields.dateTimeRange" type="datetimerange" />
+              <NDatePicker v-model:value="searchFields.dateTimeRange" type="datetimerange" @update:value="onDateChange" />
             </NGi>
             <NGi :span="20">
               <NSelect v-model:value="selectedCards" multiple :options="diagCards" />

src/components/device-page/device-card/history-diag-card/nvr-history-diag-card.vue

@@ -19,6 +19,21 @@ const { stationCode, ndmNvr } = toRefs(props);
 const searchFields = reactive({
   dateTimeRange: undefined as DatePickerProps['value'],
 });
+const onDateChange = (value: [number, number] | null) => {
+  if (!value) {
+    return;
+  }
+  const [start, end] = value;
+  const diffDays = dayjs(end).diff(dayjs(start), 'day');
+  if (diffDays > 7) {
+    // 如果超过7天，自动调整结束时间
+    const adjustedEnd = dayjs(start).add(7, 'day').valueOf();
+    searchFields.dateTimeRange = [start, adjustedEnd];
+    window.$message.warning('时间范围不能超过7天，已自动调整');
+  } else {
+    searchFields.dateTimeRange = value;
+  }
+};
 
 type DeviceStatusHistoryDiagCardInst = InstanceType<typeof DeviceStatusHistoryDiagCard> | null;
 type DeviceAlarmHistoryDiagCardInst = InstanceType<typeof DeviceAlarmHistoryDiagCard> | null;
@@ -67,7 +82,7 @@ const selectedCards = ref<string[]>([...diagCards.value.map((option) => `${optio
         <NFlex justify="space-between" :wrap="false">
           <NGrid :x-gap="8" :y-gap="8">
             <NGi :span="20">
-              <NDatePicker v-model:value="searchFields.dateTimeRange" type="datetimerange" />
+              <NDatePicker v-model:value="searchFields.dateTimeRange" type="datetimerange" @update:value="onDateChange" />
             </NGi>
             <NGi :span="20">
               <NSelect v-model:value="selectedCards" multiple :options="diagCards" />

src/components/device-page/device-card/history-diag-card/security-box-history-diag-card.vue

@@ -19,6 +19,21 @@ const { stationCode, ndmSecurityBox } = toRefs(props);
 const searchFields = reactive({
   dateTimeRange: undefined as DatePickerProps['value'],
 });
+const onDateChange = (value: [number, number] | null) => {
+  if (!value) {
+    return;
+  }
+  const [start, end] = value;
+  const diffDays = dayjs(end).diff(dayjs(start), 'day');
+  if (diffDays > 7) {
+    // 如果超过7天，自动调整结束时间
+    const adjustedEnd = dayjs(start).add(7, 'day').valueOf();
+    searchFields.dateTimeRange = [start, adjustedEnd];
+    window.$message.warning('时间范围不能超过7天，已自动调整');
+  } else {
+    searchFields.dateTimeRange = value;
+  }
+};
 
 type DeviceStatusHistoryDiagCardInst = InstanceType<typeof DeviceStatusHistoryDiagCard> | null;
 type DeviceAlarmHistoryDiagCardInst = InstanceType<typeof DeviceAlarmHistoryDiagCard> | null;
@@ -70,7 +85,7 @@ const selectedCards = ref<string[]>([...diagCards.value.map((option) => `${optio
         <NFlex justify="space-between" :wrap="false">
           <NGrid :x-gap="8" :y-gap="8">
             <NGi :span="20">
-              <NDatePicker v-model:value="searchFields.dateTimeRange" type="datetimerange" />
+              <NDatePicker v-model:value="searchFields.dateTimeRange" type="datetimerange" @update:value="onDateChange" />
             </NGi>
             <NGi :span="20">
               <NSelect v-model:value="selectedCards" multiple :options="diagCards" />

src/components/device-page/device-card/history-diag-card/server-history-diag-card.vue

@@ -18,6 +18,21 @@ const { stationCode, ndmServer } = toRefs(props);
 const searchFields = reactive({
   dateTimeRange: undefined as DatePickerProps['value'],
 });
+const onDateChange = (value: [number, number] | null) => {
+  if (!value) {
+    return;
+  }
+  const [start, end] = value;
+  const diffDays = dayjs(end).diff(dayjs(start), 'day');
+  if (diffDays > 7) {
+    // 如果超过7天，自动调整结束时间
+    const adjustedEnd = dayjs(start).add(7, 'day').valueOf();
+    searchFields.dateTimeRange = [start, adjustedEnd];
+    window.$message.warning('时间范围不能超过7天，已自动调整');
+  } else {
+    searchFields.dateTimeRange = value;
+  }
+};
 
 type DeviceStatusHistoryDiagCardInst = InstanceType<typeof DeviceStatusHistoryDiagCard> | null;
 type DeviceAlarmHistoryDiagCardInst = InstanceType<typeof DeviceAlarmHistoryDiagCard> | null;
@@ -60,7 +75,7 @@ const selectedCards = ref<string[]>([...diagCards.value.map((option) => `${optio
         <NFlex justify="space-between" :wrap="false">
           <NGrid :x-gap="8" :y-gap="8">
             <NGi :span="20">
-              <NDatePicker v-model:value="searchFields.dateTimeRange" type="datetimerange" />
+              <NDatePicker v-model:value="searchFields.dateTimeRange" type="datetimerange" @update:value="onDateChange" />
             </NGi>
             <NGi :span="20">
               <NSelect v-model:value="selectedCards" multiple :options="diagCards" />

src/components/device-page/device-card/history-diag-card/switch-history-diag-card.vue

@@ -19,6 +19,21 @@ const { stationCode, ndmSwitch } = toRefs(props);
 const searchFields = reactive({
   dateTimeRange: undefined as DatePickerProps['value'],
 });
+const onDateChange = (value: [number, number] | null) => {
+  if (!value) {
+    return;
+  }
+  const [start, end] = value;
+  const diffDays = dayjs(end).diff(dayjs(start), 'day');
+  if (diffDays > 7) {
+    // 如果超过7天，自动调整结束时间
+    const adjustedEnd = dayjs(start).add(7, 'day').valueOf();
+    searchFields.dateTimeRange = [start, adjustedEnd];
+    window.$message.warning('时间范围不能超过7天，已自动调整');
+  } else {
+    searchFields.dateTimeRange = value;
+  }
+};
 
 type DeviceStatusHistoryDiagCardInst = InstanceType<typeof DeviceStatusHistoryDiagCard> | null;
 type DeviceAlarmHistoryDiagCardInst = InstanceType<typeof DeviceAlarmHistoryDiagCard> | null;
@@ -67,7 +82,7 @@ const selectedCards = ref<string[]>([...diagCards.value.map((option) => `${optio
         <NFlex justify="space-between" :wrap="false">
           <NGrid :x-gap="8" :y-gap="8">
             <NGi :span="20">
-              <NDatePicker v-model:value="searchFields.dateTimeRange" type="datetimerange" />
+              <NDatePicker v-model:value="searchFields.dateTimeRange" type="datetimerange" @update:value="onDateChange" />
             </NGi>
             <NGi :span="20">
               <NSelect v-model:value="selectedCards" multiple :options="diagCards" />

src/pages/alarm-page.vue

@@ -51,7 +51,7 @@ const resetSearchFields = () => {
   searchFields.alarmDate = [dayjs().startOf('date').subtract(1, 'week').valueOf(), dayjs().endOf('date').valueOf()];
 };
 const onDateChange = (value: [number, number] | null) => {
-  if (!value || value.length !== 2) {
+  if (!value) {
     return;
   }
   const [start, end] = value;

src/pages/vimp-log-page.vue

@@ -78,6 +78,21 @@ const resetSearchFields = () => {
   searchFields.stationCode = stationList.value.find((station) => station.online)?.code;
   searchFields.logType_in = [];
 };
+const onDateChange = (value: [number, number] | null) => {
+  if (!value) {
+    return;
+  }
+  const [start, end] = value;
+  const diffDays = dayjs(end).diff(dayjs(start), 'day');
+  if (diffDays > 7) {
+    // 如果超过7天，自动调整结束时间
+    const adjustedEnd = dayjs(start).add(7, 'day').valueOf();
+    searchFields.createdTime = [dayjs(start).format('YYYY-MM-DD HH:mm:ss'), dayjs(adjustedEnd).format('YYYY-MM-DD HH:mm:ss')];
+    window.$message.warning('时间范围不能超过7天，已自动调整');
+  } else {
+    searchFields.createdTime = [dayjs(start).format('YYYY-MM-DD HH:mm:ss'), dayjs(end).format('YYYY-MM-DD HH:mm:ss')];
+  }
+};
 
 const tableColumns: DataTableColumns<NdmVimpLogResultVO> = [
   { title: '时间', key: 'createdTime' },
@@ -258,7 +273,7 @@ watchEffect(() => {
             <NSelect v-model:value="searchFields.logType_in" :options="vimpOperationTypeOptions" multiple clearable />
           </NFormItemGi>
           <NFormItemGi :span="1" label="时间" label-placement="left">
-            <NDatePicker v-model:formatted-value="searchFields.createdTime" type="datetimerange" />
+            <NDatePicker v-model:formatted-value="searchFields.createdTime" type="datetimerange" @update:value="onDateChange" />
           </NFormItemGi>
         </NGrid>
         <!-- 按钮 -->