useCameraDetailStore.ts 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. /** 相机详情的store */
  2. import { CameraDetailServer } from '@/types/camera/type';
  3. import { FenceDisplayStatus } from '@/types/camera/constant';
  4. import { useRouteQuery } from '@vueuse/router';
  5. import dayjs from 'dayjs';
  6. import { defineStore } from 'pinia';
  7. import { ref } from 'vue';
  8. import { VideoResolution } from '../components/CameraParams/types';
  9. interface CameraParams {
  10. startAt: string;
  11. endAt: string;
  12. resolution: number;
  13. period: number;
  14. }
  15. /** 宽/长的比例 */
  16. export const WIDTH_HEIGHT_RATIO = 0.5625;
  17. /** 分辨率以1920为基础 */
  18. export const BASE_RESOLUTION = 1920;
  19. const defaultParams: CameraParams = {
  20. startAt: '',
  21. endAt: '',
  22. resolution: VideoResolution.HIGH_RESOLUTION,
  23. period: 30,
  24. };
  25. const formatDateTime = (time: string) => {
  26. const dayStr = dayjs().format('YYYY-MM-DD');
  27. return dayStr + ' ' + time;
  28. };
  29. const useCameraDetailStore = defineStore('cameraDetail', () => {
  30. const cameraId = useRouteQuery('cameraId', '', { transform: (str) => Number(str) });
  31. const detail = ref<CameraDetailServer | null>(null);
  32. /** 参数设置 */
  33. const params = ref<CameraParams>({ ...defaultParams });
  34. const setDetail = (newDetail: CameraDetailServer) => {
  35. detail.value = newDetail;
  36. params.value = {
  37. startAt: formatDateTime(newDetail.nvrStartAt || '00:00:00'),
  38. endAt: formatDateTime(newDetail.nvrEndAt || '23:59:59'),
  39. resolution: newDetail.resolution || VideoResolution.HIGH_RESOLUTION,
  40. period: newDetail.nvrPeriod || 30,
  41. };
  42. };
  43. const clear = () => {
  44. detail.value = null;
  45. params.value = { ...defaultParams };
  46. };
  47. return { detail, setDetail, cameraId, params, clear };
  48. });
  49. export default useCameraDetailStore;