From 065c8ca488c0dff487fa924e0b9f67203e19341f Mon Sep 17 00:00:00 2001
From: JiangQiming <291854119@qq.com>
Date: Mon, 6 Mar 2023 20:01:03 +0800
Subject: [PATCH] =?UTF-8?q?update:=20moment=E6=9B=B4=E6=8D=A2=E4=B8=BAdayj?=
 =?UTF-8?q?s?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/media/Device/Playback/index.vue    | 75 +++++++-------------
 src/views/media/Device/Playback/timeLine.vue | 22 +++---
 2 files changed, 35 insertions(+), 62 deletions(-)

diff --git a/src/views/media/Device/Playback/index.vue b/src/views/media/Device/Playback/index.vue
index 0aa65dbc..89703bbb 100644
--- a/src/views/media/Device/Playback/index.vue
+++ b/src/views/media/Device/Playback/index.vue
@@ -52,8 +52,7 @@
                             v-model:value="time"
                             :fullscreen="false"
                             :disabledDate="
-                                (currentDate) =>
-                                    currentDate > moment(new Date())
+                                (currentDate) => currentDate > dayjs(new Date())
                             "
                             @change="handlePanelChange"
                         />
@@ -129,14 +128,14 @@
 
                                     <div>
                                         {{
-                                            moment(
+                                            dayjs(
                                                 item.startTime ||
                                                     item.mediaStartTime,
                                             ).format('HH:mm:ss')
                                         }}
                                         ~
                                         {{
-                                            moment(
+                                            dayjs(
                                                 item.endTime ||
                                                     item.mediaEndTime,
                                             ).format('HH:mm:ss')
@@ -155,21 +154,20 @@
 
 <script setup lang="ts">
 import playBackApi from '@/api/media/playback';
-import type { Moment } from 'moment';
-import moment from 'moment';
 import TimeLine from './timeLine.vue';
 import IconNode from './iconNode.vue';
 import type { recordsItemType } from './typings';
 import LivePlayer from '@/components/Player/index.vue';
 import { getImage } from '@/utils/comm';
 import dayjs from 'dayjs';
+import type { Dayjs } from 'dayjs';
 
 const route = useRoute();
 
 const url = ref('');
 const type = ref('local');
 const historyList = ref<recordsItemType[]>([]);
-const time = ref<Moment | undefined>(undefined);
+const time = ref<Dayjs | undefined>(undefined);
 const loading = ref(false);
 const cloudTime = ref<any>();
 // const location = ref();
@@ -185,7 +183,7 @@ const channelId = computed(() => route.query.channelId as string);
 
 const deviceType = ref('');
 
-const queryLocalRecords = async (date: Moment) => {
+const queryLocalRecords = async (date: Dayjs) => {
     console.log('date: ', date);
 
     playStatus.value = 0;
@@ -246,7 +244,7 @@ const queryLocalRecords = async (date: Moment) => {
  * 查询云端视频
  * @param date
  */
-const queryServiceRecords = async (date: Moment) => {
+const queryServiceRecords = async (date: Dayjs) => {
     playStatus.value = 0;
     url.value = '';
     if (deviceId.value && channelId.value && date) {
@@ -279,7 +277,7 @@ const downloadClick = async (item: recordsItemType) => {
     const downloadUrl = playBackApi.downLoadFile(item.id);
     const downNode = document.createElement('a');
     downNode.href = downloadUrl;
-    downNode.download = `${channelId}-${moment(item.startTime).format(
+    downNode.download = `${channelId}-${dayjs(item.startTime).format(
         'YYYY-MM-DD-HH-mm-ss',
     )}.mp4`;
     downNode.style.display = 'none';
@@ -288,46 +286,21 @@ const downloadClick = async (item: recordsItemType) => {
     document.body.removeChild(downNode);
 };
 
-watch(
-    () => route.query,
-    (val: any) => {
-        const _type = val.type;
-
-        if (_type) {
-            deviceType.value = _type;
-            const _timeStr = moment(new Date());
-            time.value = _timeStr;
-            if (_type === 'fixed-media') {
-                type.value = 'cloud';
-                queryServiceRecords(_timeStr);
-            } else {
-                queryLocalRecords(_timeStr);
-                type.value = 'local';
-            }
+onMounted(() => {
+    const _type = route.query.type as string;
+    if (_type) {
+        deviceType.value = _type;
+        const _timeStr = dayjs(new Date());
+        time.value = _timeStr;
+        if (_type === 'fixed-media') {
+            type.value = 'cloud';
+            queryServiceRecords(_timeStr);
+        } else {
+            queryLocalRecords(_timeStr);
+            type.value = 'local';
         }
-    },
-);
-// onMounted(() => {
-//     const _type = route.query.type as string;
-//     if (_type) {
-//         // 
-//         const _timeStr = moment(new Date());
-//         console.log('_timeStr: ', _timeStr);
-//         const _timeStr1 = dayjs(new Date());
-//         console.log('_timeStr1: ', _timeStr1);
-//         // 
-//         // deviceType.value = _type;
-//         // const _timeStr = moment(new Date());
-//         // time.value = _timeStr;
-//         // if (_type === 'fixed-media') {
-//         //     type.value = 'cloud';
-//         //     queryServiceRecords(_timeStr);
-//         // } else {
-//         //     queryLocalRecords(_timeStr);
-//         //     type.value = 'local';
-//         // }
-//     }
-// });
+    }
+});
 
 const handleTimeLineChange = (times: any) => {
     if (times) {
@@ -339,8 +312,8 @@ const handleTimeLineChange = (times: any) => {
                       times.deviceId,
                       times.channelId,
                       'mp4',
-                      moment(times.startTime).format('YYYY-MM-DD HH:mm:ss'),
-                      moment(times.endTime).format('YYYY-MM-DD HH:mm:ss'),
+                      dayjs(times.startTime).format('YYYY-MM-DD HH:mm:ss'),
+                      dayjs(times.endTime).format('YYYY-MM-DD HH:mm:ss'),
                   )
                 : playBackApi.playbackStart(times.deviceId);
     } else {
diff --git a/src/views/media/Device/Playback/timeLine.vue b/src/views/media/Device/Playback/timeLine.vue
index e57e3aa0..e743be81 100644
--- a/src/views/media/Device/Playback/timeLine.vue
+++ b/src/views/media/Device/Playback/timeLine.vue
@@ -26,7 +26,7 @@
             </div>
             <div id="btn" class="time-line-btn"></div>
             <div id="time" class="time-line">
-                {{ moment(playTime || 0).format('HH:mm:ss') }}
+                {{ dayjs(playTime || 0).format('HH:mm:ss') }}
             </div>
         </div>
     </div>
@@ -34,13 +34,13 @@
 
 <script setup lang="ts">
 import { message } from 'ant-design-vue';
-import type { Moment } from 'moment';
-import moment from 'moment';
 import type { recordsItemType } from './typings';
+import type { Dayjs } from 'dayjs';
+import dayjs from 'dayjs';
 
 export type TimeChangeType = {
-    endTime: Moment;
-    startTime: Moment;
+    endTime: Dayjs;
+    startTime: Dayjs;
     deviceId: string;
     channelId: string;
 };
@@ -48,7 +48,7 @@ export type TimeChangeType = {
 interface Props {
     onChange: (times: TimeChangeType | undefined) => void;
     data: recordsItemType[];
-    dateTime?: Moment;
+    dateTime?: Dayjs;
     type: string;
     playStatus: number;
     playTime: number;
@@ -65,13 +65,13 @@ const props = defineProps<Props>();
 // 获取选中当天开始时间戳
 const startT = ref<number>(
     new Date(
-        moment(props.dateTime).startOf('day').format('YYYY-MM-DD HH:mm:ss'),
+        dayjs(props.dateTime).startOf('day').format('YYYY-MM-DD HH:mm:ss'),
     ).getTime(),
 );
 // 获取选中当天结束时间戳
 const endT = ref<number>(
     new Date(
-        moment(props.dateTime).endOf('day').format('YYYY-MM-DD HH:mm:ss'),
+        dayjs(props.dateTime).endOf('day').format('YYYY-MM-DD HH:mm:ss'),
     ).getTime(),
 );
 const list = ref<any[]>([]);
@@ -96,7 +96,7 @@ watch(
     () => props.dateTime,
     (val: any) => {
         startT.value = new Date(
-            moment(val).startOf('day').format('YYYY-MM-DD HH:mm:ss'),
+            dayjs(val).startOf('day').format('YYYY-MM-DD HH:mm:ss'),
         ).getTime();
     },
 );
@@ -109,8 +109,8 @@ const onChange = (
 ) => {
     playTime.value = startTime;
     props.onChange({
-        startTime: moment(startTime),
-        endTime: moment(endTime),
+        startTime: dayjs(startTime),
+        endTime: dayjs(endTime),
         deviceId,
         channelId,
     });