Commit 6a97b1d3630ce58dc18c03d1b0d82639e7c111e9
Committed by
xp.Huang
1 parent
0fc2341a
perf: 流媒体配置新增萤石平台
Showing
7 changed files
with
117 additions
and
16 deletions
src/assets/images/sn-step4.png
0 → 100644
197 KB
... | ... | @@ -12,7 +12,16 @@ |
12 | 12 | <a-select |
13 | 13 | placeholder="请选择流媒体配置" |
14 | 14 | v-model:value="model[field]" |
15 | - :options="streamConfigOptions.map((item) => ({ value: item.value, label: item.label }))" | |
15 | + :options=" | |
16 | + streamConfigOptions | |
17 | + .filter((item) => item.type === model.videoType) | |
18 | + .map((item) => ({ | |
19 | + value: item.value, | |
20 | + label: item.label, | |
21 | + type: item.type, | |
22 | + })) | |
23 | + " | |
24 | + @change="handleChange" | |
16 | 25 | > |
17 | 26 | <template #dropdownRender="{ menuNode: menu }"> |
18 | 27 | <v-nodes :vnodes="menu" /> |
... | ... | @@ -70,6 +79,7 @@ |
70 | 79 | return { |
71 | 80 | label: m.host, |
72 | 81 | value: m.id, |
82 | + type: m.type, | |
73 | 83 | }; |
74 | 84 | }); |
75 | 85 | }); |
... | ... | @@ -103,7 +113,7 @@ |
103 | 113 | }); |
104 | 114 | } |
105 | 115 | const { ...params } = data.record; |
106 | - await setFieldsValue({ ...params }); | |
116 | + await setFieldsValue({ ...params, videoType: params.videoPlatformDTO?.type }); | |
107 | 117 | } else { |
108 | 118 | editId.value = ''; |
109 | 119 | } |
... | ... | @@ -139,6 +149,11 @@ |
139 | 149 | } |
140 | 150 | } |
141 | 151 | |
152 | + const handleChange = (e, options) => { | |
153 | + //流媒体配置 | |
154 | + setFieldsValue({ videoType: e ? options.type : null }); | |
155 | + }; | |
156 | + | |
142 | 157 | return { |
143 | 158 | getTitle, |
144 | 159 | registerDrawer, |
... | ... | @@ -149,6 +164,7 @@ |
149 | 164 | registerSteramingDrawer, |
150 | 165 | handleOpenStreamConfig, |
151 | 166 | handleSuccess, |
167 | + handleChange, | |
152 | 168 | }; |
153 | 169 | }, |
154 | 170 | }); | ... | ... |
src/views/camera/manage/SnHelpMessage1.vue
0 → 100644
1 | +<script lang="ts" setup> | |
2 | + import { BasicHelp } from '/@/components/Basic'; | |
3 | + import { createImgPreview } from '/@/components/Preview/index'; | |
4 | + import snStep4 from '/@/assets/images/sn-step4.png'; | |
5 | + const imgList: string[] = [snStep4]; | |
6 | + function handlePreview() { | |
7 | + createImgPreview({ imageList: imgList, defaultWidth: 1000 }); | |
8 | + } | |
9 | +</script> | |
10 | + | |
11 | +<template> | |
12 | + <div>监控点编号</div> | |
13 | + <BasicHelp | |
14 | + placement="top" | |
15 | + @click="handlePreview" | |
16 | + class="mx-1" | |
17 | + text='点击查看如何获取"监控点编号"' | |
18 | + /> | |
19 | +</template> | ... | ... |
... | ... | @@ -4,10 +4,13 @@ import { FormSchema as QFormSchema, useComponentRegister } from '/@/components/F |
4 | 4 | import { CameraVideoUrl, CameraMaxLength } from '/@/utils/rules'; |
5 | 5 | import { h } from 'vue'; |
6 | 6 | import SnHelpMessage from './SnHelpMessage.vue'; |
7 | +import SnHelpMessage1 from './SnHelpMessage1.vue'; | |
7 | 8 | import { OrgTreeSelect } from '../../common/OrgTreeSelect'; |
8 | 9 | import { FileItem } from '/@/components/Form/src/components/ApiUpload.vue'; |
9 | 10 | import { createImgPreview } from '/@/components/Preview'; |
10 | 11 | import { uploadThumbnail } from '/@/api/configuration/center/configurationCenter'; |
12 | +import { findDictItemByCode } from '/@/api/system/dict'; | |
13 | +import { DictEnum } from '/@/enums/dictEnum'; | |
11 | 14 | |
12 | 15 | useComponentRegister('OrgTreeSelect', OrgTreeSelect); |
13 | 16 | |
... | ... | @@ -100,6 +103,11 @@ export const searchFormSchema: FormSchema[] = [ |
100 | 103 | }, |
101 | 104 | ]; |
102 | 105 | |
106 | +const videTypeNum = { | |
107 | + SCI: 0, | |
108 | + FLUORITE: 1, | |
109 | +}; | |
110 | + | |
103 | 111 | // 弹框配置项 |
104 | 112 | export const formSchema: QFormSchema[] = [ |
105 | 113 | { |
... | ... | @@ -215,7 +223,25 @@ export const formSchema: QFormSchema[] = [ |
215 | 223 | }, |
216 | 224 | rules: [{ required: true, message: '视频流是必填项' }, ...CameraVideoUrl], |
217 | 225 | }, |
218 | - | |
226 | + { | |
227 | + field: 'videoType', | |
228 | + label: '流媒体平台', | |
229 | + component: 'ApiRadioGroup', | |
230 | + required: true, | |
231 | + defaultValue: videTypeNum.SCI, | |
232 | + ifShow: ({ values }) => values.accessMode === AccessMode.Streaming, | |
233 | + componentProps: { | |
234 | + api: async (params) => { | |
235 | + const values = await findDictItemByCode(params); | |
236 | + return values.map((item) => ({ label: item.itemText, value: Number(item.itemValue) })); | |
237 | + }, | |
238 | + params: { | |
239 | + dictCode: DictEnum.STREAMING_MEDIA_TYPE, | |
240 | + }, | |
241 | + getPopupContainer: () => document.body, | |
242 | + placeholder: `请选择平台类型`, | |
243 | + }, | |
244 | + }, | |
219 | 245 | { |
220 | 246 | field: 'videoPlatformId', |
221 | 247 | label: '流媒体配置', |
... | ... | @@ -234,7 +260,9 @@ export const formSchema: QFormSchema[] = [ |
234 | 260 | component: 'RadioGroup', |
235 | 261 | defaultValue: StreamType.MASTER, |
236 | 262 | ifShow({ values }) { |
237 | - return values.accessMode === AccessMode.Streaming; | |
263 | + return ( | |
264 | + values.accessMode === AccessMode.Streaming && values.videoType !== videTypeNum.FLUORITE | |
265 | + ); | |
238 | 266 | }, |
239 | 267 | componentProps: { |
240 | 268 | placeholder: '请选择码流', |
... | ... | @@ -252,7 +280,9 @@ export const formSchema: QFormSchema[] = [ |
252 | 280 | component: 'RadioGroup', |
253 | 281 | defaultValue: PlayProtocol.HTTP, |
254 | 282 | ifShow({ values }) { |
255 | - return values.accessMode === AccessMode.Streaming; | |
283 | + return ( | |
284 | + values.accessMode === AccessMode.Streaming && values.videoType !== videTypeNum.FLUORITE | |
285 | + ); | |
256 | 286 | }, |
257 | 287 | helpMessage: ['平台使用https的hls协议,需联系海康开放平台专家支持。'], |
258 | 288 | componentProps: { |
... | ... | @@ -270,7 +300,23 @@ export const formSchema: QFormSchema[] = [ |
270 | 300 | component: 'Input', |
271 | 301 | rules: [...CameraVideoUrl, { required: true, message: '摄像头编号是必填项' }], |
272 | 302 | ifShow({ values }) { |
273 | - return values.accessMode === AccessMode.Streaming; | |
303 | + return ( | |
304 | + values.accessMode === AccessMode.Streaming && values.videoType !== videTypeNum.FLUORITE | |
305 | + ); | |
306 | + }, | |
307 | + componentProps: { | |
308 | + placeholder: '请输入监控点编号', | |
309 | + }, | |
310 | + }, | |
311 | + { | |
312 | + field: 'sn', | |
313 | + label: h(SnHelpMessage1) as any, | |
314 | + component: 'Input', | |
315 | + rules: [...CameraVideoUrl, { required: true, message: '摄像头编号是必填项' }], | |
316 | + ifShow({ values }) { | |
317 | + return ( | |
318 | + values.accessMode === AccessMode.Streaming && values.videoType === videTypeNum.FLUORITE | |
319 | + ); | |
274 | 320 | }, |
275 | 321 | componentProps: { |
276 | 322 | placeholder: '请输入监控点编号', | ... | ... |
1 | 1 | import { PlayProtocol } from '../manage/config.data'; |
2 | 2 | import type { StreamingMediaModel } from '/@/api/camera/model/cameraModel'; |
3 | +import { findDictItemByCode } from '/@/api/system/dict'; | |
4 | +import { DictEnum } from '/@/enums/dictEnum'; | |
3 | 5 | import { BasicColumn, FormSchema } from '/@/components/Table'; |
4 | 6 | |
5 | 7 | export interface DrawerParams { |
... | ... | @@ -9,6 +11,7 @@ export interface DrawerParams { |
9 | 11 | |
10 | 12 | export const streamingMediaTypeMapping = { |
11 | 13 | 0: '海康ISC平台', |
14 | + 1: '萤石平台', | |
12 | 15 | }; |
13 | 16 | |
14 | 17 | export const streamingMediaSSLMapping = { |
... | ... | @@ -37,6 +40,9 @@ export const columnSchema: BasicColumn[] = [ |
37 | 40 | title: '用户Key', |
38 | 41 | dataIndex: 'appKey', |
39 | 42 | width: 80, |
43 | + format(text) { | |
44 | + return formatSecret(text); | |
45 | + }, | |
40 | 46 | }, |
41 | 47 | { |
42 | 48 | title: '用户密钥', |
... | ... | @@ -69,21 +75,34 @@ export const formSchema: FormSchema[] = [ |
69 | 75 | }, |
70 | 76 | ]; |
71 | 77 | |
78 | +const videTypeNum = { | |
79 | + ISC: 0, | |
80 | + Fluorite: 1, | |
81 | +}; | |
82 | + | |
72 | 83 | export const formDetailSchema: FormSchema[] = [ |
73 | 84 | { |
74 | 85 | label: '平台类型', |
75 | 86 | field: 'type', |
76 | - component: 'Select', | |
77 | - rules: [{ required: true, message: '平台类型为必填项', type: 'number' }], | |
87 | + component: 'ApiSelect', | |
88 | + required: true, | |
78 | 89 | componentProps: { |
79 | - options: [{ label: '海康ISC平台', value: 0 }], | |
80 | - placeholder: '请输入选择平台类型', | |
90 | + api: async (params) => { | |
91 | + const values = await findDictItemByCode(params); | |
92 | + return values.map((item) => ({ label: item.itemText, value: Number(item.itemValue) })); | |
93 | + }, | |
94 | + params: { | |
95 | + dictCode: DictEnum.STREAMING_MEDIA_TYPE, | |
96 | + }, | |
97 | + getPopupContainer: () => document.body, | |
98 | + placeholder: `请选择平台类型`, | |
81 | 99 | }, |
82 | 100 | }, |
83 | 101 | { |
84 | 102 | label: '部署环境', |
85 | 103 | field: 'ssl', |
86 | 104 | component: 'RadioGroup', |
105 | + ifShow: ({ model }) => model.type !== videTypeNum.Fluorite, | |
87 | 106 | rules: [{ required: true, message: '流媒体部署环境为必填项', type: 'number' }], |
88 | 107 | defaultValue: PlayProtocol.HTTP, |
89 | 108 | componentProps: { |
... | ... | @@ -108,7 +127,7 @@ export const formDetailSchema: FormSchema[] = [ |
108 | 127 | { |
109 | 128 | label: '用户Key', |
110 | 129 | field: 'appKey', |
111 | - component: 'Input', | |
130 | + component: 'InputPassword', | |
112 | 131 | rules: [{ required: true, message: '用户Key为必填项' }], |
113 | 132 | componentProps: { |
114 | 133 | maxLength: 36, |
... | ... | @@ -118,7 +137,7 @@ export const formDetailSchema: FormSchema[] = [ |
118 | 137 | { |
119 | 138 | label: '用户密钥', |
120 | 139 | field: 'appSecret', |
121 | - component: 'Input', | |
140 | + component: 'InputPassword', | |
122 | 141 | rules: [ |
123 | 142 | { required: true, message: '用户密钥为必填项' }, |
124 | 143 | { required: true, min: 20, message: '用户密钥不能少于20位字符' }, | ... | ... |
1 | 1 | <script lang="ts" setup> |
2 | 2 | import { BasicModal, useModalInner } from '/@/components/Modal'; |
3 | 3 | import { BasicForm, useForm } from '/@/components/Form'; |
4 | - import { formSchema, PlatformType } from '../config/panelDetail'; | |
4 | + import { formSchema } from '../config/panelDetail'; | |
5 | 5 | import { addDataBoard, updateDataBoard } from '/@/api/dataBoard'; |
6 | 6 | import { AddDataBoardParams } from '/@/api/dataBoard/model'; |
7 | 7 | import { useMessage } from '/@/hooks/web/useMessage'; |
... | ... | @@ -34,9 +34,7 @@ |
34 | 34 | if (!Reflect.get(value, 'accessCredentials')) { |
35 | 35 | Reflect.deleteProperty(value, 'accessCredentials'); |
36 | 36 | } |
37 | - if (value.platform === PlatformType.PC) { | |
38 | - Reflect.deleteProperty(value, 'phoneModel'); | |
39 | - } | |
37 | + | |
40 | 38 | return value as any; |
41 | 39 | }; |
42 | 40 | ... | ... |