Commit c976095b5c639ac2d71b62064a5c1a5f4ffacfd2

Authored by fengwotao
1 parent 3b7ed4ae

pref:视频管理移除视频流验证

1   -import { BasicColumn, FormSchema } from '/@/components/Table';
2   -import { getOrganizationList } from '/@/api/system/system';
3   -import { copyTransFun } from '/@/utils/fnUtils';
4   -import type { FormSchema as QFormSchema } from '/@/components/Form/index';
5   -
6   -import { CameraVideoUrl, CameraMaxLength, MediaTypeValidate } from '/@/utils/rules';
7   -import { h } from 'vue';
8   -import SnHelpMessage from './SnHelpMessage.vue';
9   -
10   -export enum CameraPermission {
11   - PREVIEW = 'api:yt:video:get',
12   - CREATE = 'api:yt:video:post',
13   - UPDATE = 'api:yt:video:update',
14   - DELETE = 'api:yt:video:delete',
15   -}
16   -
17   -export enum AccessMode {
18   - ManuallyEnter = 0,
19   - Streaming = 1,
20   -}
21   -
22   -export enum PlayProtocol {
23   - HTTP = 0,
24   - HTTPS = 1,
25   -}
26   -
27   -export enum StreamType {
28   - MASTER = 0,
29   - CHILD = 1,
30   - THIRD = 2,
31   -}
32   -
33   -export enum PageMode {
34   - SPLIT_SCREEN_MODE = 'splitScreen',
35   - LIST_MODE = 'listMode',
36   - FULL_SCREEN_MODE = 'fullScreenMode',
37   -}
38   -
39   -export enum MediaType {
40   - MP4 = 'mp4',
41   - M3U8 = 'm3u8',
42   -}
43   -
44   -// 表格列数据
45   -export const columns: BasicColumn[] = [
46   - {
47   - title: '封面',
48   - dataIndex: 'avatar',
49   - width: 80,
50   - slots: { customRender: 'img' },
51   - },
52   - {
53   - title: '名字',
54   - dataIndex: 'name',
55   - width: 120,
56   - },
57   - {
58   - title: '摄像头编号/监控点编号',
59   - dataIndex: 'sn',
60   - width: 220,
61   - },
62   - {
63   - title: '视频流',
64   - dataIndex: 'videoUrl',
65   - width: 120,
66   - },
67   - {
68   - title: '所属组织',
69   - dataIndex: 'organizationName',
70   - width: 160,
71   - },
72   - {
73   - title: '获取方式',
74   - dataIndex: 'accessMode',
75   - width: 100,
76   - slots: { customRender: 'accessMode' },
77   - },
78   - {
79   - title: '创建时间',
80   - dataIndex: 'createTime',
81   - width: 140,
82   - },
83   -];
84   -
85   -// 查询字段
86   -export const searchFormSchema: FormSchema[] = [
87   - {
88   - field: 'name',
89   - label: '摄像头名字',
90   - component: 'Input',
91   - colProps: { span: 8 },
92   - componentProps: {
93   - maxLength: 36,
94   - placeholder: '请输入摄像头名字',
95   - },
96   - },
97   -];
98   -
99   -// 弹框配置项
100   -export const formSchema: QFormSchema[] = [
101   - {
102   - field: 'avatar',
103   - label: '视频封面',
104   - slot: 'iconSelect',
105   - component: 'Input',
106   - },
107   - {
108   - field: 'name',
109   - label: '视频名字',
110   - required: true,
111   - component: 'Input',
112   - componentProps: {
113   - placeholder: '请输入视频名字',
114   - maxLength: 30,
115   - },
116   - rules: [...CameraMaxLength, { required: true, message: '视频名是必填项' }],
117   - },
118   - {
119   - field: 'organizationId',
120   - label: '所属组织',
121   - required: true,
122   - component: 'ApiTreeSelect',
123   - componentProps: {
124   - api: async () => {
125   - const data = await getOrganizationList();
126   - copyTransFun(data as any as any[]);
127   - return data;
128   - },
129   - },
130   - },
131   - {
132   - label: '视频流获取方式',
133   - field: 'accessMode',
134   - component: 'RadioGroup',
135   - rules: [{ required: true, message: '视频流获取方式为必选项', type: 'number' }],
136   - defaultValue: AccessMode.ManuallyEnter,
137   - componentProps({ formActionType }) {
138   - return {
139   - defaultValue: AccessMode.ManuallyEnter,
140   - placeholder: '请选择视频流获取方式',
141   - options: [
142   - { label: '手动输入', value: AccessMode.ManuallyEnter },
143   - { label: '流媒体获取', value: AccessMode.Streaming },
144   - ],
145   - onChange() {
146   - formActionType.setFieldsValue({
147   - brand: null,
148   - sn: null,
149   - videoUrl: null,
150   - videoPlatformId: null,
151   - });
152   - },
153   - };
154   - },
155   - },
156   - {
157   - field: 'brand',
158   - label: '视频厂家',
159   - component: 'Input',
160   - ifShow({ values }) {
161   - return values.accessMode === AccessMode.ManuallyEnter;
162   - },
163   - componentProps: {
164   - maxLength: 36,
165   - placeholder: '请输入视频厂家',
166   - },
167   - },
168   - {
169   - field: 'sn',
170   - label: '摄像头编号',
171   - required: true,
172   - component: 'Input',
173   - rules: [...CameraVideoUrl, { required: true, message: '摄像头编号是必填项' }],
174   - ifShow({ values }) {
175   - return values.accessMode === AccessMode.ManuallyEnter;
176   - },
177   - componentProps: {
178   - maxLength: 36,
179   - placeholder: '请输入摄像头编号',
180   - },
181   - },
182   - {
183   - field: 'videoUrl',
184   - label: '视频流',
185   - component: 'Input',
186   - required: true,
187   - ifShow({ values }) {
188   - return values.accessMode === AccessMode.ManuallyEnter;
189   - },
190   - componentProps: {
191   - placeholder: '请输入视频流',
192   - maxLength: 255,
193   - },
194   - rules: [{ required: true, message: '视频流是必填项' }, ...CameraVideoUrl, ...MediaTypeValidate],
195   - },
196   -
197   - {
198   - field: 'videoPlatformId',
199   - label: '流媒体配置',
200   - component: 'Select',
201   - ifShow({ values }) {
202   - return values.accessMode === AccessMode.Streaming;
203   - },
204   - slot: 'videoPlatformIdSlot',
205   - componentProps: {
206   - placeholder: '请选择流媒体配置',
207   - },
208   - },
209   - {
210   - field: 'streamType',
211   - label: '码流',
212   - component: 'RadioGroup',
213   - defaultValue: StreamType.MASTER,
214   - ifShow({ values }) {
215   - return values.accessMode === AccessMode.Streaming;
216   - },
217   - componentProps: {
218   - placeholder: '请选择码流',
219   - defaultValue: StreamType.MASTER,
220   - options: [
221   - { label: '主码流', value: StreamType.MASTER },
222   - { label: '子码流', value: StreamType.CHILD },
223   - { label: '第三码流', value: StreamType.THIRD },
224   - ],
225   - },
226   - },
227   - {
228   - field: 'playProtocol',
229   - label: '播放协议',
230   - component: 'RadioGroup',
231   - defaultValue: PlayProtocol.HTTP,
232   - ifShow({ values }) {
233   - return values.accessMode === AccessMode.Streaming;
234   - },
235   - helpMessage: ['平台使用https的hls协议,需联系海康开放平台专家支持。'],
236   - componentProps: {
237   - placeholder: '请选择播放协议',
238   - defaultValue: PlayProtocol.HTTP,
239   - options: [
240   - { label: 'http', value: PlayProtocol.HTTP },
241   - { label: 'https', value: PlayProtocol.HTTPS },
242   - ],
243   - },
244   - },
245   - {
246   - field: 'sn',
247   - label: h(SnHelpMessage) as any,
248   - component: 'Input',
249   - rules: [...CameraVideoUrl, { required: true, message: '摄像头编号是必填项' }],
250   - ifShow({ values }) {
251   - return values.accessMode === AccessMode.Streaming;
252   - },
253   - componentProps: {
254   - placeholder: '请输入监控点编号',
255   - },
256   - },
257   -];
  1 +import { BasicColumn, FormSchema } from '/@/components/Table';
  2 +import { getOrganizationList } from '/@/api/system/system';
  3 +import { copyTransFun } from '/@/utils/fnUtils';
  4 +import type { FormSchema as QFormSchema } from '/@/components/Form/index';
  5 +
  6 +import { CameraVideoUrl, CameraMaxLength } from '/@/utils/rules';
  7 +import { h } from 'vue';
  8 +import SnHelpMessage from './SnHelpMessage.vue';
  9 +
  10 +export enum CameraPermission {
  11 + PREVIEW = 'api:yt:video:get',
  12 + CREATE = 'api:yt:video:post',
  13 + UPDATE = 'api:yt:video:update',
  14 + DELETE = 'api:yt:video:delete',
  15 +}
  16 +
  17 +export enum AccessMode {
  18 + ManuallyEnter = 0,
  19 + Streaming = 1,
  20 +}
  21 +
  22 +export enum PlayProtocol {
  23 + HTTP = 0,
  24 + HTTPS = 1,
  25 +}
  26 +
  27 +export enum StreamType {
  28 + MASTER = 0,
  29 + CHILD = 1,
  30 + THIRD = 2,
  31 +}
  32 +
  33 +export enum PageMode {
  34 + SPLIT_SCREEN_MODE = 'splitScreen',
  35 + LIST_MODE = 'listMode',
  36 + FULL_SCREEN_MODE = 'fullScreenMode',
  37 +}
  38 +
  39 +export enum MediaType {
  40 + MP4 = 'mp4',
  41 + M3U8 = 'm3u8',
  42 +}
  43 +
  44 +// 表格列数据
  45 +export const columns: BasicColumn[] = [
  46 + {
  47 + title: '封面',
  48 + dataIndex: 'avatar',
  49 + width: 80,
  50 + slots: { customRender: 'img' },
  51 + },
  52 + {
  53 + title: '名字',
  54 + dataIndex: 'name',
  55 + width: 120,
  56 + },
  57 + {
  58 + title: '摄像头编号/监控点编号',
  59 + dataIndex: 'sn',
  60 + width: 220,
  61 + },
  62 + {
  63 + title: '视频流',
  64 + dataIndex: 'videoUrl',
  65 + width: 120,
  66 + },
  67 + {
  68 + title: '所属组织',
  69 + dataIndex: 'organizationName',
  70 + width: 160,
  71 + },
  72 + {
  73 + title: '获取方式',
  74 + dataIndex: 'accessMode',
  75 + width: 100,
  76 + slots: { customRender: 'accessMode' },
  77 + },
  78 + {
  79 + title: '创建时间',
  80 + dataIndex: 'createTime',
  81 + width: 140,
  82 + },
  83 +];
  84 +
  85 +// 查询字段
  86 +export const searchFormSchema: FormSchema[] = [
  87 + {
  88 + field: 'name',
  89 + label: '摄像头名字',
  90 + component: 'Input',
  91 + colProps: { span: 8 },
  92 + componentProps: {
  93 + maxLength: 36,
  94 + placeholder: '请输入摄像头名字',
  95 + },
  96 + },
  97 +];
  98 +
  99 +// 弹框配置项
  100 +export const formSchema: QFormSchema[] = [
  101 + {
  102 + field: 'avatar',
  103 + label: '视频封面',
  104 + slot: 'iconSelect',
  105 + component: 'Input',
  106 + },
  107 + {
  108 + field: 'name',
  109 + label: '视频名字',
  110 + required: true,
  111 + component: 'Input',
  112 + componentProps: {
  113 + placeholder: '请输入视频名字',
  114 + maxLength: 30,
  115 + },
  116 + rules: [...CameraMaxLength, { required: true, message: '视频名是必填项' }],
  117 + },
  118 + {
  119 + field: 'organizationId',
  120 + label: '所属组织',
  121 + required: true,
  122 + component: 'ApiTreeSelect',
  123 + componentProps: {
  124 + api: async () => {
  125 + const data = await getOrganizationList();
  126 + copyTransFun(data as any as any[]);
  127 + return data;
  128 + },
  129 + },
  130 + },
  131 + {
  132 + label: '视频流获取方式',
  133 + field: 'accessMode',
  134 + component: 'RadioGroup',
  135 + rules: [{ required: true, message: '视频流获取方式为必选项', type: 'number' }],
  136 + defaultValue: AccessMode.ManuallyEnter,
  137 + componentProps({ formActionType }) {
  138 + return {
  139 + defaultValue: AccessMode.ManuallyEnter,
  140 + placeholder: '请选择视频流获取方式',
  141 + options: [
  142 + { label: '手动输入', value: AccessMode.ManuallyEnter },
  143 + { label: '流媒体获取', value: AccessMode.Streaming },
  144 + ],
  145 + onChange() {
  146 + formActionType.setFieldsValue({
  147 + brand: null,
  148 + sn: null,
  149 + videoUrl: null,
  150 + videoPlatformId: null,
  151 + });
  152 + },
  153 + };
  154 + },
  155 + },
  156 + {
  157 + field: 'brand',
  158 + label: '视频厂家',
  159 + component: 'Input',
  160 + ifShow({ values }) {
  161 + return values.accessMode === AccessMode.ManuallyEnter;
  162 + },
  163 + componentProps: {
  164 + maxLength: 36,
  165 + placeholder: '请输入视频厂家',
  166 + },
  167 + },
  168 + {
  169 + field: 'sn',
  170 + label: '摄像头编号',
  171 + required: true,
  172 + component: 'Input',
  173 + rules: [...CameraVideoUrl, { required: true, message: '摄像头编号是必填项' }],
  174 + ifShow({ values }) {
  175 + return values.accessMode === AccessMode.ManuallyEnter;
  176 + },
  177 + componentProps: {
  178 + maxLength: 36,
  179 + placeholder: '请输入摄像头编号',
  180 + },
  181 + },
  182 + {
  183 + field: 'videoUrl',
  184 + label: '视频流',
  185 + component: 'Input',
  186 + required: true,
  187 + ifShow({ values }) {
  188 + return values.accessMode === AccessMode.ManuallyEnter;
  189 + },
  190 + componentProps: {
  191 + placeholder: '请输入视频流',
  192 + maxLength: 255,
  193 + },
  194 + rules: [{ required: true, message: '视频流是必填项' }, ...CameraVideoUrl],
  195 + },
  196 +
  197 + {
  198 + field: 'videoPlatformId',
  199 + label: '流媒体配置',
  200 + component: 'Select',
  201 + ifShow({ values }) {
  202 + return values.accessMode === AccessMode.Streaming;
  203 + },
  204 + slot: 'videoPlatformIdSlot',
  205 + componentProps: {
  206 + placeholder: '请选择流媒体配置',
  207 + },
  208 + },
  209 + {
  210 + field: 'streamType',
  211 + label: '码流',
  212 + component: 'RadioGroup',
  213 + defaultValue: StreamType.MASTER,
  214 + ifShow({ values }) {
  215 + return values.accessMode === AccessMode.Streaming;
  216 + },
  217 + componentProps: {
  218 + placeholder: '请选择码流',
  219 + defaultValue: StreamType.MASTER,
  220 + options: [
  221 + { label: '主码流', value: StreamType.MASTER },
  222 + { label: '子码流', value: StreamType.CHILD },
  223 + { label: '第三码流', value: StreamType.THIRD },
  224 + ],
  225 + },
  226 + },
  227 + {
  228 + field: 'playProtocol',
  229 + label: '播放协议',
  230 + component: 'RadioGroup',
  231 + defaultValue: PlayProtocol.HTTP,
  232 + ifShow({ values }) {
  233 + return values.accessMode === AccessMode.Streaming;
  234 + },
  235 + helpMessage: ['平台使用https的hls协议,需联系海康开放平台专家支持。'],
  236 + componentProps: {
  237 + placeholder: '请选择播放协议',
  238 + defaultValue: PlayProtocol.HTTP,
  239 + options: [
  240 + { label: 'http', value: PlayProtocol.HTTP },
  241 + { label: 'https', value: PlayProtocol.HTTPS },
  242 + ],
  243 + },
  244 + },
  245 + {
  246 + field: 'sn',
  247 + label: h(SnHelpMessage) as any,
  248 + component: 'Input',
  249 + rules: [...CameraVideoUrl, { required: true, message: '摄像头编号是必填项' }],
  250 + ifShow({ values }) {
  251 + return values.accessMode === AccessMode.Streaming;
  252 + },
  253 + componentProps: {
  254 + placeholder: '请输入监控点编号',
  255 + },
  256 + },
  257 +];
... ...