存储卡

更新时间：2025-09-22 21:06:28

提供存储卡录制不同方式的播放能力

/**
 * SD卡服务相关
 *
 * @public
 */
declare class SDCardService {
    /**
     * 按时间段获取SD卡录制文件
     *
     * @param params - 请求参数
     * @public
     */
    recordTimeQuery(params: RTCXPlaybackTypes.SDCardRecordQueryReq): Promise<RTCXPlaybackTypes.RecordQueryRsp>;
    /**
     * 按文件获取SD卡录制文件
     *
     * @param params - 请求参数 [SDCardRecordQueryReq]
     */
    recordFileQuery(params: RTCXPlaybackTypes.SDCardRecordQueryReq): Promise<RTCXPlaybackTypes.SDCardRecordFileQueryRsp>;
    /**
     * 按时间段获取事件文件
     *
     * @param params - 请求参数 [SDCardEventQueryReq]
     */
    eventTimeQuery(params: RTCXPlaybackTypes.SDCardEventQueryReq): Promise<RTCXPlaybackTypes.EventQueryRsp>;
    /**
     * 按月查询录制统计
     *
     * @param monthQueryReq - [SDCardRecordMonthQueryReq]
     */
    monthRecordQuery(monthQueryReq: RTCXPlaybackTypes.SDCardRecordMonthQueryReq): Promise<RTCXPlaybackTypes.MonthQueryRsp>;
}

declare const RTCXSDCardPlayback: SDCardService;

按时间录制列表

返回列表倒序排列

import { RTCXSDCardPlayback, RTCXPlaybackTypes } from '@rtcx/websdk'
RTCXSDCardPlayback.recordTimeQuery(params: RTCXPlaybackTypes.SDCardRecordQueryReq): Promise<RTCXPlaybackTypes.RecordQueryRsp>;

示例

import { ref, defineProps } from 'vue'
import { ElMessageBox } from 'element-plus'
import { RTCXSDCardPlayback, RTCXPlaybackTypes, RTCXDeviceMgrTypes, RTCXWebPlayerTypes } from '@rtcx/websdk'
import { formatDatetime, startOfDate, endOfDate } from '@/utils/dateUtils'

const emit = defineEmits(['onSeekAction'])
const props = defineProps<{
  deviceInfo: RTCXDeviceMgrTypes.PlayDeviceInfo
}>()
//存储卡录制
let loadMore = false
let loadNextTime = 0
const queryDate = ref(new Date())
const dataList = ref<RTCXPlaybackTypes.TimelineRecordInfo[]>([])
function queryList(isLoadMore: boolean = false) {
  const { productKey, deviceName } = props.deviceInfo
  const date = queryDate.value
  if (!date) return ElMessageBox.alert('请选择日期')
  console.info(`sdcard record by time isLoadMore=${isLoadMore}`, date)
  const beginTime = startOfDate(date).getTime()
  const endTime = !isLoadMore ? endOfDate(beginTime).getTime() : loadNextTime
  const params = {
    productKey,
    deviceName,
    beginTime,
    endTime,
    pageSize: 30,
  } as RTCXPlaybackTypes.SDCardRecordQueryReq
  RTCXSDCardPlayback.recordTimeQuery(params)
    .then((rsp: RTCXPlaybackTypes.RecordQueryRsp) => {
      loadMore = rsp.nextValid
      loadNextTime = rsp.nextEndTime ?? 0
      if (isLoadMore) {
        dataList.value.push(...rsp.recordFileList)
      } else {
        dataList.value = rsp.recordFileList
      }
    })
    .catch(console.error)
}
//播放SD卡
function seekPlayback(item: RTCXPlaybackTypes.TimelineRecordInfo) {
  const { beginTime, endTime } = item
  const seekParams: RTCXWebPlayerTypes.ISeekParam = {
    beginTime,
    endTime,
    isSDCard: true,
  }
  emit('onSeekAction', seekParams)

  <div>
    <div>
      <el-date-picker v-model="queryDate" type="date" placeholder="查询日期" />
      <el-button type="primary" size="small" style="margin-left: 10px" @click="queryList()"
        >查询</el-button
      >
    </div>
    <div class="sdcard-data-list-wrapper">
      <div
        v-for="item in dataList"
        :key="item.beginTime"
        class="sdcard-time-item-wrapper"
        @click="seekPlayback(item)"
      >
        <div>开始时间：{{ formatDatetime(item.beginTime) }}</div>
        <div>结束时间：{{ formatDatetime(item.endTime) }}</div>
      </div>
    </div>
    <el-button size="small" type="primary" v-if="loadMore" @click="queryList(true)"
      >加载更多>></el-button
    >
  </div>

按文件录制列表

返回列表倒序排列

import { RTCXSDCardPlayback, RTCXPlaybackTypes } from '@rtcx/websdk'
RTCXSDCardPlayback.recordFileQuery(params: RTCXPlaybackTypes.SDCardRecordQueryReq): Promise<RTCXPlaybackTypes.SDCardRecordFileQueryRsp>;

示例

import { ref, defineProps } from 'vue'
import { ElMessageBox } from 'element-plus'
import {
  RTCXSDCardPlayback,
  RTCXPlaybackTypes,
  RTCXDeviceMgrTypes,
  RTCXWebPlayerTypes,
} from '@rtcx/websdk'
import { formatDatetime, startOfDate, endOfDate } from '@/utils/dateUtils'

const emit = defineEmits(['onSeekAction'])
const props = defineProps<{
  deviceInfo: RTCXDeviceMgrTypes.PlayDeviceInfo
}>()
//存储卡录制
let loadMore = false
let loadNextTime = 0
const queryDate = ref(new Date())
const dataList = ref<RTCXPlaybackTypes.SDCardRecordFileInfo[]>([])
function queryList(isLoadMore: boolean = false) {
  const { productKey, deviceName } = props.deviceInfo
  const date = queryDate.value
  if (!date) return ElMessageBox.alert('请选择日期')
  console.info(`sdcard record by time isLoadMore=${isLoadMore}`, date)
  const beginTime = startOfDate(date).getTime()
  const endTime = !isLoadMore ? endOfDate(beginTime).getTime() : loadNextTime
  const params = {
    productKey,
    deviceName,
    beginTime,
    endTime,
    pageSize: 30,
  } as RTCXPlaybackTypes.SDCardRecordQueryReq
  RTCXSDCardPlayback.recordFileQuery(params)
    .then((rsp: RTCXPlaybackTypes.SDCardRecordFileQueryRsp) => {
      loadMore = rsp.nextValid
      loadNextTime = rsp.nextEndTime ?? 0
      if (isLoadMore) {
        dataList.value.push(...rsp.recordFileList)
      } else {
        dataList.value = rsp.recordFileList
      }
    })
    .catch(console.error)
}
//按文件播放
function seekPlayback(item: RTCXPlaybackTypes.SDCardRecordFileInfo) {
  const { beginTime, endTime } = item
  const seekParams: RTCXWebPlayerTypes.ISeekParam = {
    beginTime,
    endTime,
    isSDCard: true,
    filename: item.filename,
    seekType: RTCXWebPlayerTypes.SeekTypeEnum.TYPE_SDCARD_FILE,
    seekPos: 0,
  }
  emit('onSeekAction', seekParams)
}

  <div>
    <div>
      <el-date-picker v-model="queryDate" type="date" placeholder="查询日期" />
      <el-button type="primary" size="small" style="margin-left: 10px" @click="queryList()"
        >查询</el-button
      >
    </div>
    <div class="sdcard-data-list-wrapper">
      <div
        v-for="item in dataList"
        :key="item.beginTime"
        class="sdcard-time-item-wrapper"
        @click="seekPlayback(item)"
      >
        <div>文件名称：{{ item.filename }}</div>
        <div>文件大小：{{ item.fileSize }}</div>
        <div>开始时间：{{ formatDatetime(item.beginTime) }}</div>
        <div>结束时间：{{ formatDatetime(item.endTime) }}</div>
      </div>
    </div>
    <el-button size="small" type="primary" v-if="loadMore" @click="queryList(true)"
      >加载更多>></el-button
    >
  </div>

录制事件列表

返回列表倒序排列

import { RTCXSDCardPlayback, RTCXPlaybackTypes } from '@rtcx/websdk'
RTCXSDCardPlayback.eventTimeQuery(params: RTCXPlaybackTypes.SDCardEventQueryReq): Promise<RTCXPlaybackTypes.EventQueryRsp>

示例

import { ref, defineProps, defineEmits } from 'vue'
import { ElMessageBox } from 'element-plus'
import {
  RTCXSDCardPlayback,
  RTCXPlaybackTypes,
  RTCXDeviceMgrTypes,
  RTCXWebPlayerTypes,
} from '@rtcx/websdk'
import { formatDatetime, startOfDate, endOfDate } from '@/utils/dateUtils'
const emit = defineEmits(['onSeekAction'])

const props = defineProps<{
  deviceInfo: RTCXDeviceMgrTypes.PlayDeviceInfo
}>()

//存储卡事件
let loadMore = false
let loadNextTime = 0
const queryDate = ref(new Date())
const dataList = ref<RTCXPlaybackTypes.TimelineEventInfo[]>([])
function queryList(isLoadMore: boolean = false) {
  const { productKey, deviceName } = props.deviceInfo
  const date = queryDate.value
  if (!date) return ElMessageBox.alert('请选择日期')
  console.info(`sdcard event queryDate isLoadMore=${isLoadMore}`, date)
  const beginTime = startOfDate(date).getTime()
  const endTime = !isLoadMore ? endOfDate(beginTime).getTime() : loadNextTime
  const params = {
    productKey,
    deviceName,
    beginTime,
    endTime,
    pageSize: 30,
  } as RTCXPlaybackTypes.SDCardRecordQueryReq
  RTCXSDCardPlayback.eventTimeQuery(params)
    .then((rsp: RTCXPlaybackTypes.EventQueryRsp) => {
      loadMore = rsp.nextValid
      loadNextTime = rsp.nextEndTime ?? 0
      if (isLoadMore) {
        dataList.value.push(...rsp.eventList)
      } else {
        dataList.value = rsp.eventList
      }
    })
    .catch(console.error)
}
//播放事件
function seekPlayback(item: RTCXPlaybackTypes.TimelineEventInfo) {
  const { beginTime, endTime } = item
  const seekParams: RTCXWebPlayerTypes.ISeekParam = {
    beginTime,
    endTime,
    isSDCard: true,
  }
  emit('onSeekAction', seekParams)
}

  <div>
    <div>
      <el-date-picker v-model="queryDate" type="date" placeholder="查询日期" />
      <el-button type="primary" size="small" style="margin-left: 10px" @click="queryList()"
        >查询</el-button
      >
    </div>
    <div class="sdcard-data-list-wrapper">
      <div
        v-for="item in dataList"
        :key="item.beginTime"
        class="sdcard-time-item-wrapper"
        @click="seekPlayback(item)"
      >
        <div>开始时间：{{ formatDatetime(item.beginTime) }}</div>
        <div>结束时间：{{ item.endTime ? formatDatetime(item.endTime) : '-' }}</div>
      </div>
    </div>
    <el-button size="small" type="primary" v-if="loadMore" @click="queryList(true)"
      >加载更多>></el-button
    >
  </div>

按月统计录制

按月查询每天是否有录制，使用场景：在日历上加小红点

import { RTCXSDCardPlayback, RTCXPlaybackTypes } from '@rtcx/websdk'
RTCXSDCardPlayback.monthRecordQuery(monthQueryReq: RTCXPlaybackTypes.SDCardRecordMonthQueryReq): Promise<RTCXPlaybackTypes.MonthQueryRsp>;

示例

import { ref, defineProps } from 'vue'
import { ElMessageBox } from 'element-plus'
import { RTCXSDCardPlayback, RTCXPlaybackTypes, RTCXDeviceMgrTypes } from '@rtcx/websdk'

const props = defineProps<{
  deviceInfo: RTCXDeviceMgrTypes.PlayDeviceInfo
}>()

const queryDate = ref(new Date())
const dataList = ref<RTCXPlaybackTypes.MonthQueryItem[]>([])
function queryList() {
  const { productKey, deviceName } = props.deviceInfo
  const date = queryDate.value
  if (!date) return ElMessageBox.alert('请选择月份')
  console.info(`sdcard record stat`, date)
  const params = {
    productKey,
    deviceName,
    year: date.getFullYear(),
    month: date.getMonth() + 1,
  } as RTCXPlaybackTypes.SDCardRecordMonthQueryReq
  RTCXSDCardPlayback.monthRecordQuery(params)
    .then((rsp: RTCXPlaybackTypes.MonthQueryRsp) => {
      dataList.value = rsp.dayCntList || []
    })
    .catch(console.error)
}

  <div>
    <div>
      <el-date-picker v-model="queryDate" type="month" placeholder="查询日期" />
      <el-button type="primary" size="small" style="margin-left: 10px" @click="queryList()">
        查询
      </el-button>
    </div>
    <div class="sdcard-data-list-wrapper">
      <div v-for="item in dataList" :key="item.dateStr" class="sdcard-time-item-wrapper">
        <div>日期：{{ item.dateStr }}</div>
        <div>数据：{{ item.count }}</div>
      </div>
    </div>
  </div>