bugfix:

1、无法通过时间筛选

smsb-plus-ui/src/views/smsb/dashboard/play.vue

@@ -10,10 +10,11 @@
                   <el-radio-group v-model="timeRadio" size="small" @change="handleDateRangeChange">
                     <el-radio-button label="近7天" value="week" />
                     <el-radio-button label="近30天" value="month" />
+                    <el-radio-button label="自定义" value="diy" />
                   </el-radio-group>
                 </el-col>
                 <el-col :span="5" class="text-right">
-                  <el-date-picker v-model="dateRange" type="daterange" range-separator="-" start-placeholder="开始日期"
+                  <el-date-picker v-model="dateRange" :disabled="diyFlag" :clearable="false" @change="handleDateRangeChange" type="daterange" range-separator="-" start-placeholder="开始日期"
                     end-placeholder="结束日期" class="date-picker" />
                 </el-col>
               </el-row>
@@ -359,7 +360,7 @@ import { playTopStatistics, sumOnlineTimeLine } from '@/api/smsb/source/play_rec
 import { ref, onMounted } from 'vue'; // Import ref and onMounted
 
 const timeRadio = ref('week');
-const dateRange = ref<[string, string]>(['', '']); // Explicitly type dateRange
+const dateRange = ref<[Date, Date]>([null, null]); // Explicitly type dateRange
 const totalNum = ref(0);
 const imageNum = ref(0);
 const videoNum = ref(0);
@@ -377,6 +378,7 @@ const diskUsed = ref();
 const diskTotal = ref();
 const diskImage = ref();
 const diskVideo = ref();
+const diyFlag = ref(true);
 
 // Helper function to format date
 const formatDate = (date: Date): string => {
@@ -391,7 +393,7 @@ const setInitialDateRange = () => {
   const today = new Date();
   const startDate = new Date();
   startDate.setDate(today.getDate() - 7);
-  dateRange.value = [formatDate(startDate), formatDate(today)];
+  dateRange.value = [startDate, today];
 };
 
 const getDiskUse = async () => {
@@ -409,8 +411,8 @@ const getDiskUse = async () => {
 const getOnlineTimeLine = async () => {
   try {
     const params = {
-      startTime: dateRange.value[0],
-      endTime: dateRange.value[1]
+      startTime: formatDate(dateRange.value[0]),
+      endTime: formatDate(dateRange.value[1])
     };
     const res = await sumOnlineTimeLine(params);
 
@@ -426,7 +428,7 @@ const getOnlineTimeLine = async () => {
     onlineTimeLineInstance = echarts.init(onlineTimeLine.value, 'macaroons');
     // console.log('[onlineTimeLine] echarts instance created:', onlineTimeLineInstance);
     // console.log('[onlineTimeLine] echarts instance created:', alarmLevelInstance);
-    alarmLevelInstance.setOption({
+    onlineTimeLineInstance.setOption({
       title: { text: '' },
       tooltip: { trigger: 'axis' },
       legend: { data: ['图片', '视频'] },
@@ -466,8 +468,8 @@ const getOnlineTimeLine = async () => {
 const getPlayTop = async () => {
   try {
     const params = {
-      startTime: dateRange.value[0],
-      endTime: dateRange.value[1],
+      startTime: formatDate(dateRange.value[0]),
+      endTime: formatDate(dateRange.value[1]),
       type: topType.value
     };
     const res = await playTopStatistics(params);
@@ -617,14 +619,14 @@ const getNumByTag = async () => {
 const getNumAndLine = async () => {
   try {
     const params = {
-      startTime: dateRange.value[0],
-      endTime: dateRange.value[1]
+      startTime: formatDate(dateRange.value[0]),
+      endTime: formatDate(dateRange.value[1])
     };
     const res = await fileStatistics();
     totalNum.value = res.data.totalNum;
     imageNum.value = res.data.imageNum;
     videoNum.value = res.data.videoNum;
-
+    console.log("getNumAndLine : " + params)
     const lineRes = await numLine(params);
     if (!createLine.value) {
       // console.log('[createLine] ref is null when initializing echarts');
@@ -713,40 +715,42 @@ const handleDateRangeChange = () => {
   switch (rangeType) {
     case 'week':
       startDate.setDate(today.getDate() - 7);
+      dateRange.value = [startDate, endDate];
+      diyFlag.value = true;
       break;
     case 'month':
       startDate.setMonth(today.getMonth() - 1);
+      dateRange.value = [startDate, endDate];
+      diyFlag.value = true;
       break;
+    case "diy" :
+      diyFlag.value = false;
     default:
-      // Handle custom date range from date picker
-      if (dateRange.value && dateRange.value[0] && dateRange.value[1]) {
-        // Date picker value is already set, no need to calculate
-        getNumAndLine();
-        getPlayTop();
-        getOnlineTimeLine();
-        return;
-      }
-      throw new Error('Invalid range type');
+      break
   }
-  dateRange.value = [formatDate(startDate), formatDate(endDate)];
+  console.log("dataRange value : " + dateRange.value)
+
   getNumAndLine();
   getPlayTop();
   getOnlineTimeLine();
 };
 
 // Watch for changes in dateRange and trigger data fetching
-watch(dateRange, (newDateRange, oldDateRange) => {
+/*watch(dateRange, (newDateRange, oldDateRange) => {
   if (newDateRange && newDateRange[0] && newDateRange[1] && (newDateRange[0] !== oldDateRange?.[0] || newDateRange[1] !== oldDateRange?.[1])) {
     getNumAndLine();
     getPlayTop();
     getOnlineTimeLine();
   }
-});
+});*/
 
 onMounted(() => {
   setInitialDateRange(); // Set initial date range on mount
   getNumByTag();
   getNumByTypeAndTag();
   getDiskUse();
+  getNumAndLine();
+  getPlayTop();
+  getOnlineTimeLine();
 });
 </script>

smsb-plus-ui/src/views/smsb/dashboard/play_info.vue

@@ -49,17 +49,18 @@
                 :value="dict.value" />
             </el-select>
           </el-form-item>
-          <el-form-item label="" prop="dataRage" style="width: 250px">
+          <el-form-item label="" prop="dataRage" style="width: 500px">
             <el-col :span="12" style="text-align: right">
               <el-radio-group v-model="timeRadio" size="small" @change="handleDateRangeChange">
                 <!--              <el-radio-button label="今日" value="today" />-->
                 <el-radio-button label="近7天" value="week" />
                 <el-radio-button label="近30天" value="month" />
+                <el-radio-button label="自定义" value="diy" />
               </el-radio-group>
             </el-col>
             <el-col :span="12" style="text-align: right">
-              <el-date-picker :disabled="true" v-model="dateRange" type="daterange" range-separator="-"
-                start-placeholder="开始日期" end-placeholder="结束日期" style="margin-left: 10px; margin-right: 30px" />
+              <el-date-picker v-model="dateRange" type="daterange" range-separator="-"
+                start-placeholder="开始日期" :disabled="diyFlag" :clearable="false" @change="handleDateRangeChange" end-placeholder="结束日期" style="margin-left: 10px; margin-right: 30px" />
             </el-col>
           </el-form-item>
         </el-form>
@@ -162,6 +163,7 @@ const pushLine = ref();
 const total = ref(0);
 const tadLine = ref();
 const dialogSourceId = ref();
+const diyFlag = ref(true);
 
 const dialog = reactive<DialogOption>({
   visible: false,
@@ -359,18 +361,24 @@ const handleDateRangeChange = () => {
   const startDate = new Date();
   const endDate = new Date();
   switch (rangeType) {
-    case 'today':
-      break;
     case 'week':
       startDate.setDate(today.getDate() - 7);
+      dateRange.value = [formatDate(startDate), formatDate(endDate)];
+      diyFlag.value = true;
       break;
     case 'month':
       startDate.setMonth(today.getMonth() - 1);
+      dateRange.value = [formatDate(startDate), formatDate(endDate)];
+      diyFlag.value = true;
+      break;
+    case "diy" :
+      diyFlag.value = false;
+      dateRange.value = [formatDate(dateRange.value[0]), formatDate(dateRange.value[1])];
       break;
     default:
-      throw new Error('Invalid range type');
+      break
+      // throw new Error('Invalid range type');
   }
-  dateRange.value = [formatDate(startDate), formatDate(endDate)];
   getRecordList();
   getPushNumber();
 };