简柏林 / thingskit-front · Commits

Commit 7bb7920a45b47cdc4e84a97939df2446721994ae

Authored by ww
1 parent c1f1307c

feat: 视频组件支持gbt

Inline Side-by-side
Showing 4 changed files with 47 additions and 20 deletions
@@ -13,7 +13,6 @@ export interface CameraModel { @@ -13,7 +13,6 @@ export interface CameraModel {
13 accessMode: number; 13 accessMode: number;
14 avatar?: string; 14 avatar?: string;
15 brand: string; 15 brand: string;
16 - createTime?: '2022-04-19T11:33:13.113Z';  
17 creator?: string; 16 creator?: string;
18 defaultConfig?: string; 17 defaultConfig?: string;
19 description?: string; 18 description?: string;
@@ -25,16 +24,17 @@ export interface CameraModel { @@ -25,16 +24,17 @@ export interface CameraModel {
25 name: string; 24 name: string;
26 organizationId: string; 25 organizationId: string;
27 organizationName?: string; 26 organizationName?: string;
28 - roleIds?: ['string'];  
29 sn: string; 27 sn: string;
30 status?: false; 28 status?: false;
31 - tenantExpireTime?: '2022-04-19T11:33:13.113Z';  
32 tenantId?: string; 29 tenantId?: string;
33 tenantProfileId?: string; 30 tenantProfileId?: string;
34 - tenantStatus?: 'DISABLED';  
35 - updateTime?: '2022-04-19T11:33:13.113Z';  
36 updater?: string; 31 updater?: string;
37 videoUrl: string; 32 videoUrl: string;
  33 + params?: {
  34 + channelNo: string;
  35 + deviceId: string;
  36 + deviceName: string;
  37 + };
38 } 38 }
39 39
40 export interface StreamingManageRecord { 40 export interface StreamingManageRecord {
1 import { getCameraList } from '/@/api/camera/cameraManager'; 1 import { getCameraList } from '/@/api/camera/cameraManager';
2 import { CameraModel } from '/@/api/camera/model/cameraModel'; 2 import { CameraModel } from '/@/api/camera/model/cameraModel';
3 import { FormSchema } from '/@/components/Form'; 3 import { FormSchema } from '/@/components/Form';
  4 +import { AccessMode } from '/@/views/camera/manage/config.data';
4 5
5 export enum FormFieldEnum { 6 export enum FormFieldEnum {
6 VIDEO_TYPE = 'type', 7 VIDEO_TYPE = 'type',
@@ -9,6 +10,9 @@ export enum FormFieldEnum { @@ -9,6 +10,9 @@ export enum FormFieldEnum {
9 ACCESS_MODE = 'accessMode', 10 ACCESS_MODE = 'accessMode',
10 VIDEO_ID = 'id', 11 VIDEO_ID = 'id',
11 ORGANIZATION_ID = 'organizationId', 12 ORGANIZATION_ID = 'organizationId',
  13 +
  14 + DEVICE_ID = 'deviceId',
  15 + CHANNEL_ID = 'channelId',
12 } 16 }
13 17
14 export interface DataSourceValueType { 18 export interface DataSourceValueType {
@@ -40,16 +44,10 @@ export const formSchemas: FormSchema[] = [ @@ -40,16 +44,10 @@ export const formSchemas: FormSchema[] = [
40 const { setFieldsValue } = formActionType; 44 const { setFieldsValue } = formActionType;
41 return { 45 return {
42 placeholder: '请选择视频来源', 46 placeholder: '请选择视频来源',
43 - options: [  
44 - {  
45 - label: VideoOriginalNameEnum[VideoOriginalEnum.CUSTOM],  
46 - value: VideoOriginalEnum.CUSTOM,  
47 - },  
48 - {  
49 - label: VideoOriginalNameEnum[VideoOriginalEnum.VIDEO_MANAGE],  
50 - value: VideoOriginalEnum.VIDEO_MANAGE,  
51 - },  
52 - ], 47 + options: Object.keys(VideoOriginalEnum).map((value) => ({
  48 + label: VideoOriginalNameEnum[value],
  49 + value,
  50 + })),
53 onChange() { 51 onChange() {
54 setFieldsValue({ 52 setFieldsValue({
55 [FormFieldEnum.ACCESS_MODE]: null, 53 [FormFieldEnum.ACCESS_MODE]: null,
@@ -96,6 +94,8 @@ export const formSchemas: FormSchema[] = [ @@ -96,6 +94,8 @@ export const formSchemas: FormSchema[] = [
96 [FormFieldEnum.ACCESS_MODE]: null, 94 [FormFieldEnum.ACCESS_MODE]: null,
97 [FormFieldEnum.VIDEO_PLAY_URL]: null, 95 [FormFieldEnum.VIDEO_PLAY_URL]: null,
98 [FormFieldEnum.VIDEO_ID]: null, 96 [FormFieldEnum.VIDEO_ID]: null,
  97 + [FormFieldEnum.DEVICE_ID]: null,
  98 + [FormFieldEnum.CHANNEL_ID]: null,
99 }); 99 });
100 }, 100 },
101 }; 101 };
@@ -117,13 +117,30 @@ export const formSchemas: FormSchema[] = [ @@ -117,13 +117,30 @@ export const formSchemas: FormSchema[] = [
117 labelField: 'name', 117 labelField: 'name',
118 valueField: 'id', 118 valueField: 'id',
119 resultField: 'data', 119 resultField: 'data',
120 - onChange(value: string, options: CameraModel) { 120 + onChange(_: string, options: CameraModel) {
  121 + const accessMode = options?.accessMode;
121 setFieldsValue({ 122 setFieldsValue({
122 - [FormFieldEnum.ACCESS_MODE]: value ? (options || {}).accessMode : null,  
123 - [FormFieldEnum.VIDEO_PLAY_URL]: value ? (options || {}).videoUrl : null, 123 + [FormFieldEnum.ACCESS_MODE]: accessMode,
  124 + [FormFieldEnum.VIDEO_PLAY_URL]: options?.videoUrl,
  125 + [FormFieldEnum.CHANNEL_ID]:
  126 + accessMode === AccessMode.GBT28181 ? options.params?.channelNo : null,
  127 + [FormFieldEnum.DEVICE_ID]:
  128 + accessMode === AccessMode.GBT28181 ? options.params?.deviceId : null,
124 }); 129 });
125 }, 130 },
126 }; 131 };
127 }, 132 },
128 }, 133 },
  134 + {
  135 + field: FormFieldEnum.DEVICE_ID,
  136 + label: '设备Id',
  137 + component: 'Input',
  138 + ifShow: false,
  139 + },
  140 + {
  141 + field: FormFieldEnum.CHANNEL_ID,
  142 + label: '通道号',
  143 + component: 'Input',
  144 + ifShow: false,
  145 + },
129 ]; 146 ];
@@ -10,9 +10,10 @@ @@ -10,9 +10,10 @@
10 import { ref } from 'vue'; 10 import { ref } from 'vue';
11 import { Spin } from 'ant-design-vue'; 11 import { Spin } from 'ant-design-vue';
12 import { useFingerprint } from '/@/utils/useFingerprint'; 12 import { useFingerprint } from '/@/utils/useFingerprint';
13 - import { isRtspProtocol } from '/@/components/Video/src/utils'; 13 + import { isRtspProtocol, VideoPlayerType } from '/@/components/Video/src/utils';
14 import { isShareMode } from '/@/views/sys/share/hook'; 14 import { isShareMode } from '/@/views/sys/share/hook';
15 import { getJwtToken, getShareJwtToken } from '/@/utils/auth'; 15 import { getJwtToken, getShareJwtToken } from '/@/utils/auth';
  16 + import { getVideoControlStart } from '/@/api/device/videoChannel';
16 17
17 const props = defineProps<{ 18 const props = defineProps<{
18 config: ComponentPropsConfigType<typeof option>; 19 config: ComponentPropsConfigType<typeof option>;
@@ -46,13 +47,20 @@ @@ -46,13 +47,20 @@
46 const { option } = config; 47 const { option } = config;
47 const { videoConfig, uuid } = option || {}; 48 const { videoConfig, uuid } = option || {};
48 if (!uuid) return; 49 if (!uuid) return;
49 - const { url, id, accessMode } = videoConfig || {}; 50 + const { url, id, accessMode, deviceId, channelId } = videoConfig || {};
50 let type = getVideoTypeByUrl(url!); 51 let type = getVideoTypeByUrl(url!);
51 let playUrl = url; 52 let playUrl = url;
52 if (accessMode === AccessMode.Streaming && id) { 53 if (accessMode === AccessMode.Streaming && id) {
53 const { data: { url } = { url: '' } } = await getStreamingPlayUrl(id!); 54 const { data: { url } = { url: '' } } = await getStreamingPlayUrl(id!);
54 playUrl = url; 55 playUrl = url;
55 playUrl && (type = getVideoTypeByUrl(playUrl!)); 56 playUrl && (type = getVideoTypeByUrl(playUrl!));
  57 + } else if (accessMode === AccessMode.GBT28181 && deviceId && channelId) {
  58 + const {
  59 + data: { flv },
  60 + } = await getVideoControlStart({ channelId, deviceId });
  61 +
  62 + playUrl = flv;
  63 + type = VideoPlayerType.flv;
56 } 64 }
57 65
58 if (isRtspProtocol(url!)) { 66 if (isRtspProtocol(url!)) {
@@ -112,4 +112,6 @@ export interface VideoConfigType { @@ -112,4 +112,6 @@ export interface VideoConfigType {
112 accessMode?: number; 112 accessMode?: number;
113 type?: string; 113 type?: string;
114 url?: string; 114 url?: string;
  115 + deviceId?: string;
  116 + channelId?: string;
115 } 117 }