fix：cdr添加结束时间范围搜索

src/locales/langs/en-us.ts

@@ -787,6 +787,9 @@ const local: any = {
       pleclientname:'Please enter device name',
       search:'Search',
       reset:'Reset',
+      timerange:'End time range',
+      startTime:'StartTime',
+      endTime:'EndTime'
     },
     kyc:{
       title:'KYC Authentication Review',

src/locales/langs/zh-cn.ts

@@ -787,6 +787,9 @@ const local:any = {
       pleclientname:'请输入设备名',
       search:'搜索',
       reset:'重置',
+      timerange:'结束时间范围',
+      startTime:'开始时间',
+      endTime:'结束时间'
     },
     kyc:{
       title:'KYC实名认证审核',

src/views/user-center/cdr/index.vue

@@ -16,6 +16,8 @@ type SearchModel = {
   pageSize: number;
   userName?: string;
   clientName?: string;
+  endTimeS?:string;
+  endTimeE?:string;
 };
 
 // 格式化通话时长

src/views/user-center/cdr/modules/cdr-search.vue

@@ -1,8 +1,9 @@
 <script setup lang="ts">
 import { ref, computed } from 'vue';
-import { Form } from 'ant-design-vue';
+import { Form, DatePicker } from 'ant-design-vue';
 import type { FormInstance } from 'ant-design-vue';
 import { useI18n } from 'vue-i18n';
+import type { Dayjs } from 'dayjs';
 const { t } = useI18n();
 
 interface SearchModel {
@@ -10,6 +11,8 @@ interface SearchModel {
   pageSize: number;
   userName?: string;
   clientName?: string;
+  endTimeS?: number;
+  endTimeE?: number;
 }
 
 const props = withDefaults(defineProps<{
@@ -19,7 +22,9 @@ const props = withDefaults(defineProps<{
     pageNum: 1,
     pageSize: 10,
     userName: '',
-    clientName: ''
+    clientName: '',
+    endTimeS: undefined,
+    endTimeE: undefined
   })
 });
 
@@ -37,8 +42,21 @@ const formModel = computed({
   set: (val: SearchModel) => emit('update:model', val)
 });
 
+const dateRange = ref<[Dayjs, Dayjs] | null>(null);
+
+const handleDateRangeChange = (dates: [Dayjs, Dayjs] | null) => {
+  if (dates) {
+    formModel.value.endTimeS = dates[0].unix() * 1000;
+    formModel.value.endTimeE = dates[1].unix() * 1000 + 999;
+  } else {
+    formModel.value.endTimeS = undefined;
+    formModel.value.endTimeE = undefined;
+  }
+};
+
 function handleReset() {
   resetFields();
+  dateRange.value = null;
   emit('reset');
 }
 
@@ -69,16 +87,32 @@ function handleSearch() {
           allow-clear
         />
       </AFormItem>
+      <AFormItem :label="t('page.cdr.timerange')">
+        <ARangePicker
+          v-model:value="dateRange"
+          :show-time="{ format: 'HH:mm:ss' }"
+          format="YYYY-MM-DD HH:mm:ss"
+          :placeholder="[
+            t('page.cdr.startTime'),
+            t('page.cdr.endTime')
+          ]"
+          @change="handleDateRangeChange"
+        />
+      </AFormItem>
       <AFormItem class="flex-1 justify-end">
         <ASpace>
           <AButton type="primary" ghost @click="handleSearch">
             <template #icon>
-            <icon-mdi-search />
-          </template>{{ t('page.cdr.search') }}</AButton>
-          <AButton @click="handleReset"><template #icon>
-            <icon-mdi-refresh />
-          </template>
-            {{ t('page.cdr.reset') }}</AButton>
+              <icon-mdi-search />
+            </template>
+            {{ t('page.cdr.search') }}
+          </AButton>
+          <AButton @click="handleReset">
+            <template #icon>
+              <icon-mdi-refresh />
+            </template>
+            {{ t('page.cdr.reset') }}
+          </AButton>
         </ASpace>
       </AFormItem>
     </AForm>
@@ -91,4 +125,8 @@ function handleSearch() {
     padding: 16px;
   }
 }
+
+:deep(.ant-picker) {
+  width: 360px;
+}
 </style>