From efe9156015873c6f7891e4579b728e9b38a320bf Mon Sep 17 00:00:00 2001
From: "1378012178@qq.com" <1378012178@qq.com>
Date: Wed, 22 Apr 2026 11:13:28 +0800
Subject: [PATCH] =?UTF-8?q?=E8=A7=A3=E5=86=B3tplink=E5=9B=9E=E6=94=BE?=
 =?UTF-8?q?=E9=BB=91=E5=B1=8F=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../camera/components/CameraPlaybackForm.vue  | 295 +++++++++---------
 .../camera/components/CameraRecordList.vue    |  12 +-
 2 files changed, 152 insertions(+), 155 deletions(-)

diff --git a/src/views/iot/tplink/camera/components/CameraPlaybackForm.vue b/src/views/iot/tplink/camera/components/CameraPlaybackForm.vue
index 6169a08..3ebf423 100644
--- a/src/views/iot/tplink/camera/components/CameraPlaybackForm.vue
+++ b/src/views/iot/tplink/camera/components/CameraPlaybackForm.vue
@@ -6,13 +6,8 @@
       </a-col>
       <a-col :span="24" style="padding: 5px;">
         <span style="margin-left: 15px;">回放倍速
-          <a-select
-            ref="select"
-            v-model:value="formData.scale"
-            style="width: 120px"
-            @focus="focus"
-            @change="changeScale"
-          >
+          <a-select ref="select" v-model:value="formData.scale" style="width: 120px" @focus="focus"
+            @change="changeScale">
             <a-select-option value="0.0625">0.0625</a-select-option>
             <a-select-option value="0.125">0.125</a-select-option>
             <a-select-option value="0.25">0.25</a-select-option>
@@ -30,159 +25,161 @@
 </template>
 
 <script lang="ts" setup>
-  import { ref, reactive, defineExpose, nextTick, defineProps, computed, onMounted  } from 'vue';
-  import { defHttp } from '/@/utils/http/axios';
-  import { useMessage } from '/@/hooks/web/useMessage';
-  import { getValueType } from '/@/utils';
-  import { Form } from 'ant-design-vue';
-  import {
-    getPlaybackUrlList,
-    deletePlaybackChn
-  } from "../camera.api";
+import { ref, reactive, defineExpose, nextTick, defineProps, computed, onMounted } from 'vue';
+import { defHttp } from '/@/utils/http/axios';
+import { useMessage } from '/@/hooks/web/useMessage';
+import { getValueType } from '/@/utils';
+import { Form } from 'ant-design-vue';
+import {
+  getPlaybackUrlList,
+  deletePlaybackChn
+} from "../camera.api";
 
-  const TumsPlayer = window['tums-player'].default;
-  const props = defineProps({
-    formDisabled: { type: Boolean, default: false },
-    formData: { type: Object, default: () => ({})},
-    formBpm: { type: Boolean, default: true }
-  });
+const TumsPlayer = window['tums-player'].default;
+const props = defineProps({
+  formDisabled: { type: Boolean, default: false },
+  formData: { type: Object, default: () => ({}) },
+  formBpm: { type: Boolean, default: true }
+});
 
-  const formRef = ref();
-  const player = ref();
-  const initContainerPlayback = ref(true);
-  const useForm = Form.useForm;
-  const emit = defineEmits(['register', 'ok']);
-  const formData = reactive<Record<string, any>>({
-    //预览通道参数
-    videoDevId: '',//设备索引
-    storageDevId: '',//存储设备ID
-    startTime: '',//回放开始时间
-    endTime: '',//回放结束时间
-    videoType: '',//回放录像类型
-    scale: 1,//回放速率
-    sessionId: ''//回放通道对应的sessionId
-  });
-  const { createMessage } = useMessage();
-  const labelCol = ref<any>({ xs: { span: 24 }, sm: { span: 5 } });
-  const wrapperCol = ref<any>({ xs: { span: 24 }, sm: { span: 16 } });
-  const confirmLoading = ref<boolean>(false);
+const formRef = ref();
+const player = ref();
+const initContainerPlayback = ref(true);
+const useForm = Form.useForm;
+const emit = defineEmits(['register', 'ok']);
+const formData = reactive<Record<string, any>>({
+  //预览通道参数
+  videoDevId: '',//设备索引
+  storageDevId: '',//存储设备ID
+  startTime: '',//回放开始时间
+  endTime: '',//回放结束时间
+  videoType: '',//回放录像类型
+  scale: 1,//回放速率
+  sessionId: ''//回放通道对应的sessionId
+});
+const { createMessage } = useMessage();
+const labelCol = ref<any>({ xs: { span: 24 }, sm: { span: 5 } });
+const wrapperCol = ref<any>({ xs: { span: 24 }, sm: { span: 16 } });
+const confirmLoading = ref<boolean>(false);
 
-  //表单验证
-  const validatorRules = reactive({
-  });
-  const { resetFields, validate, validateInfos } = useForm(formData, validatorRules, { immediate: false });
+//表单验证
+const validatorRules = reactive({
+});
+const { resetFields, validate, validateInfos } = useForm(formData, validatorRules, { immediate: false });
 
-  // 表单禁用
-  const disabled = computed(()=>{
-    if(props.formBpm === true){
-      if(props.formData.disabled === false){
-        return false;
-      }else{
-        return true;
-      }
+// 表单禁用
+const disabled = computed(() => {
+  if (props.formBpm === true) {
+    if (props.formData.disabled === false) {
+      return false;
+    } else {
+      return true;
     }
-    return props.formDisabled;
-  });
+  }
+  return props.formDisabled;
+});
 
-  /**
-   * 详情
-   */
-  async function edit(record) {
-    await nextTick(() => {
-      confirmLoading.value=true;
-      resetFields();
-      const tmpData = {};
-      Object.keys(formData).forEach((key) => {
-        if(record.hasOwnProperty(key)){
-          tmpData[key] = record[key]
-        }
-      })
-      //赋值
-      Object.assign(formData, tmpData);
-    });
-    //获取录像回放地址
-    await getPlaybackUrlList({
-      "videoDevId":formData.videoDevId,
-      "storageDevId":formData.storageDevId,
-      "videoType":formData.videoType,
-      "scale":formData.scale,
-      "startTime":formData.startTime,
-      "endTime":formData.endTime,
-    }).then(res=>{
-      confirmLoading.value=false;
-      const error = res.error;
-      if(error==null||error==''){
-        formData.sessionId = '';
-        const list = res.data;
-        list.forEach(item => {
-          formData.sessionId += item.sessionId+","
-          let startTime = item.startTime*1000;
-          let endTime = item.endTime*1000;
-          player.value = new TumsPlayer('video-container-playback', {
-            "autoplay": true,
-            "resolution": "HD",
-            "streamType": "sdvod", // 回放类型
-            "url": item.url, // 该url为一次性 需要通过接口实时获取
-            "socket": item.wssUrl,
-            "type": "rtsp",
-            "decoderType": "wasm", // 硬软解类型
-            "queryAddress": item.queryAddress,
-            "videoSessionId": item.sessionId,
-            "videoDevId": item.videoDevId, // 设备id
-            // "useMultitrans": true,
-            "storageDevId": item.storageDevId,
-            "startTime": startTime, // 回放开始时间 13位
-            "endTime": endTime, // 回放结束时间 13位
-            "eventType": [1, 2], // 事件类型
-            "scale": item.scale // 回放倍速
-          });
+/**
+ * 详情
+ */
+async function edit(record) {
+  await nextTick(() => {
+    confirmLoading.value = true;
+    resetFields();
+    const tmpData = {};
+    Object.keys(formData).forEach((key) => {
+      if (record.hasOwnProperty(key)) {
+        tmpData[key] = record[key]
+      }
+    })
+    //赋值
+    Object.assign(formData, tmpData);
+  });
+  //获取录像回放地址
+  await getPlaybackUrlList({
+    "videoDevId": formData.videoDevId,
+    "storageDevId": formData.storageDevId,
+    "videoType": formData.videoType,
+    "scale": formData.scale,
+    "startTime": formData.startTime,
+    "endTime": formData.endTime,
+  }).then(res => {
+    confirmLoading.value = false;
+    const error = res.error;
+    if (error == null || error == '') {
+      formData.sessionId = '';
+      const list = res.data;
+      console.log("🌊 ~ edit ~ list:", list)
+      list.forEach(item => {
+        formData.sessionId += item.sessionId + ","
+        let startTime = item.startTime * 1000;
+        let endTime = item.endTime * 1000;
+        player.value = new TumsPlayer('video-container-playback', {
+          "autoplay": true,
+          "resolution": "VB",
+          "streamType": "sdvod", // 回放类型
+          "url": item.url, // 该url为一次性 需要通过接口实时获取
+          "socket": item.wssUrl,
+          "type": "rtsp",
+          "decoderType": "wasm", // 硬软解类型
+          "queryAddress": item.queryAddress,
+          "videoSessionId": item.sessionId,
+          "videoDevId": item.videoDevId, // 设备id
+          // "useMultitrans": true,
+          "storageDevId": item.storageDevId,
+          "startTime": startTime, // 回放开始时间 13位
+          "endTime": endTime, // 回放结束时间 13位
+          "eventType": [1, 2], // 事件类
+          "scale": item.scale // 回放倍速
         });
-      }
-    });
-  }
-
-  /**
-   * 切换回放倍
-   */
-  function changeScale(){
-    //需要释放通道，重启创建通道
-    createMessage.info('切换回放倍速至'+formData.scale+'倍');
-    let scale = parseInt(formData.scale) ;
-    player.value.setPlaybackConfig({"scale":scale});
-  }
-
-  /**
-   * 销毁
-   */
-  async function destroy(){
-    if (player.value){
-      deletePlaybackChn({
-        "deviceIndex":formData.videoDevId,
-        "sessionId":formData.sessionId
-      }).then(res=>{
       });
-      // player.value.destroy().then(() => { }); // 回放销毁时自动调用接口，跨域导致失败
-      initContainerPlayback.value = false
-      setTimeout(()=>{
-        initContainerPlayback.value = true
-      },1000)
     }
-  }
-
-  defineExpose({
-    edit,
-    destroy
   });
+}
+
+/**
+ * 切换回放倍
+ */
+function changeScale() {
+  //需要释放通道，重启创建通道
+  createMessage.info('切换回放倍速至' + formData.scale + '倍');
+  let scale = parseInt(formData.scale);
+  player.value.setPlaybackConfig({ "scale": scale });
+}
+
+/**
+ * 销毁
+ */
+async function destroy() {
+  if (player.value) {
+    deletePlaybackChn({
+      "deviceIndex": formData.videoDevId,
+      "sessionId": formData.sessionId
+    }).then(res => {
+    });
+    // player.value.destroy().then(() => { }); // 回放销毁时自动调用接口，跨域导致失败
+    initContainerPlayback.value = false
+    setTimeout(() => {
+      initContainerPlayback.value = true
+    }, 1000)
+  }
+}
+
+defineExpose({
+  edit,
+  destroy
+});
 </script>
 
 <style lang="less" scoped>
-  .antd-modal-form {
-    padding: 14px;
-  }
-  #video-container-playback {
-    padding: 0px 25px;
-    width: 600px;
-    height: 550px;
-    background: #1a1a1a;
-  }
+.antd-modal-form {
+  padding: 14px;
+}
+
+#video-container-playback {
+  padding: 0px 25px;
+  width: 600px;
+  height: 550px;
+  background: #1a1a1a;
+}
 </style>
diff --git a/src/views/iot/tplink/camera/components/CameraRecordList.vue b/src/views/iot/tplink/camera/components/CameraRecordList.vue
index 9303fee..3f9355f 100644
--- a/src/views/iot/tplink/camera/components/CameraRecordList.vue
+++ b/src/views/iot/tplink/camera/components/CameraRecordList.vue
@@ -98,14 +98,14 @@ import {ref, reactive, createVNode, h, onMounted, watch, unref} from 'vue';
   function handlePlayback(record: Recordable) {
     record.scale = props.data.scale;
     record.multitrans = props.data.multitrans;
-    console.log(record.multitrans);
-    if(record.multitrans=="1"){
-      multitransModal.value.disableSubmit = true;
-      multitransModal.value.edit(record);
-    }else{
+    console.log(123,record.multitrans);
+    // if(record.multitrans=="1"){
+    //   multitransModal.value.disableSubmit = true;
+    //   multitransModal.value.edit(record);
+    // }else{
       playbackModal.value.disableSubmit = true;
       playbackModal.value.edit(record);
-    }
+    // }
   }
 
   /**