Commit 3bc28b5e7125776abb1de96c09a6dfeedfee53be

Authored by ww
1 parent 73d472e2

fix: DEFECT-534 edit record page seize

... ... @@ -31,7 +31,7 @@
31 31 <script lang="ts">
32 32 import { defineComponent, ref, computed, unref, nextTick } from 'vue';
33 33 import { BasicForm, useForm } from '/@/components/Form';
34   - import { formSchema, manuallyEnter, streamingMediaAcquire } from './config.data';
  34 + import { formSchema } from './config.data';
35 35 import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
36 36 import { createOrEditCameraManage } from '/@/api/camera/cameraManager';
37 37 import { message, Upload } from 'ant-design-vue';
... ... @@ -49,10 +49,7 @@
49 49
50 50 const isUpdate = ref(true);
51 51 const editId = ref('');
52   - const [
53   - registerForm,
54   - { validate, setFieldsValue, resetFields, removeSchemaByFiled, appendSchemaByField },
55   - ] = useForm({
  52 + const [registerForm, { validate, setFieldsValue, resetFields }] = useForm({
56 53 labelWidth: 120,
57 54 schemas: formSchema,
58 55 showActionButtonGroup: false,
... ... @@ -64,19 +61,6 @@
64 61 isUpdate.value = !!data?.isUpdate;
65 62 if (unref(isUpdate)) {
66 63 await nextTick();
67   - removeSchemaByFiled([
68   - 'videoPlatformId',
69   - 'streamType',
70   - 'playProtocol',
71   - 'sn',
72   - 'brand',
73   - 'videoUrl',
74   - ]);
75   - if (data.record.accessMode === 0) {
76   - manuallyEnter.forEach((schema) => appendSchemaByField(schema, undefined));
77   - } else {
78   - streamingMediaAcquire.forEach((schema) => appendSchemaByField(schema, undefined));
79   - }
80 64 editId.value = data.record.id;
81 65 tenantLogo.value = data.record?.avatar;
82 66 await setFieldsValue(data.record);
... ...
... ... @@ -83,14 +83,70 @@ export const searchFormSchema: FormSchema[] = [
83 83 },
84 84 ];
85 85
86   -/**
87   - * @description 手动输入
88   - */
89   -export const manuallyEnter: FormSchema[] = [
  86 +// 弹框配置项
  87 +export const formSchema: QFormSchema[] = [
  88 + {
  89 + field: 'avatar',
  90 + label: '视频封面',
  91 + slot: 'iconSelect',
  92 + component: 'Input',
  93 + },
  94 + {
  95 + field: 'name',
  96 + label: '视频名字',
  97 + required: true,
  98 + component: 'Input',
  99 + componentProps: {
  100 + placeholder: '请输入视频名字',
  101 + maxLength: 30,
  102 + },
  103 + rules: [...CameraMaxLength, { required: true, message: '视频名是必填项' }],
  104 + },
  105 + {
  106 + field: 'organizationId',
  107 + label: '所属组织',
  108 + required: true,
  109 + component: 'ApiTreeSelect',
  110 + componentProps: {
  111 + api: async () => {
  112 + const data = await getOrganizationList();
  113 + copyTransFun(data as any as any[]);
  114 + return data;
  115 + },
  116 + },
  117 + },
  118 + {
  119 + label: '视频流获取方式',
  120 + field: 'accessMode',
  121 + component: 'RadioGroup',
  122 + rules: [{ required: true, message: '视频流获取方式为必选项', type: 'number' }],
  123 + defaultValue: AccessMode.ManuallyEnter,
  124 + componentProps({ formActionType }) {
  125 + return {
  126 + defaultValue: AccessMode.ManuallyEnter,
  127 + placeholder: '请选择视频流获取方式',
  128 + options: [
  129 + { label: '手动输入', value: AccessMode.ManuallyEnter },
  130 + { label: '流媒体获取', value: AccessMode.Streaming },
  131 + ],
  132 + onChange() {
  133 + formActionType.setFieldsValue({
  134 + brand: null,
  135 + sn: null,
  136 + videoUrl: null,
  137 + videoPlatformId: null,
  138 + });
  139 + },
  140 + };
  141 + },
  142 + },
90 143 {
91 144 field: 'brand',
92 145 label: '视频厂家',
93 146 component: 'Input',
  147 + ifShow({ values }) {
  148 + return values.accessMode === AccessMode.ManuallyEnter;
  149 + },
94 150 componentProps: {
95 151 placeholder: '请输入视频厂家',
96 152 },
... ... @@ -101,6 +157,9 @@ export const manuallyEnter: FormSchema[] = [
101 157 required: true,
102 158 component: 'Input',
103 159 rules: [...CameraVideoUrl, { required: true, message: '摄像头编号是必填项' }],
  160 + ifShow({ values }) {
  161 + return values.accessMode === AccessMode.ManuallyEnter;
  162 + },
104 163 componentProps: {
105 164 placeholder: '请输入摄像头编号',
106 165 },
... ... @@ -110,22 +169,23 @@ export const manuallyEnter: FormSchema[] = [
110 169 label: '视频流',
111 170 required: true,
112 171 component: 'Input',
  172 + ifShow({ values }) {
  173 + return values.accessMode === AccessMode.ManuallyEnter;
  174 + },
113 175 componentProps: {
114 176 placeholder: '请输入视频流',
115 177 maxLength: 255,
116 178 },
117 179 rules: [...CameraVideoUrl, { required: true, message: '视频流是必填项' }],
118 180 },
119   -];
120 181
121   -/**
122   - * @description 流媒体获取
123   - */
124   -export const streamingMediaAcquire: FormSchema[] = [
125 182 {
126 183 field: 'videoPlatformId',
127 184 label: '流媒体配置',
128 185 component: 'ApiSelect',
  186 + ifShow({ values }) {
  187 + return values.accessMode === AccessMode.Streaming;
  188 + },
129 189 componentProps: {
130 190 placeholder: '请选择流媒体配置',
131 191 api: getStreamingMediaList,
... ... @@ -138,6 +198,9 @@ export const streamingMediaAcquire: FormSchema[] = [
138 198 label: '码流',
139 199 component: 'RadioGroup',
140 200 defaultValue: StreamType.MASTER,
  201 + ifShow({ values }) {
  202 + return values.accessMode === AccessMode.Streaming;
  203 + },
141 204 componentProps: {
142 205 placeholder: '请选择码流',
143 206 defaultValue: StreamType.MASTER,
... ... @@ -153,6 +216,10 @@ export const streamingMediaAcquire: FormSchema[] = [
153 216 label: '播放协议',
154 217 component: 'RadioGroup',
155 218 defaultValue: PlayProtocol.HTTP,
  219 + ifShow({ values }) {
  220 + return values.accessMode === AccessMode.Streaming;
  221 + },
  222 + helpMessage: ['平台使用https的hls协议,需联系海康开放平台专家支持。'],
156 223 componentProps: {
157 224 placeholder: '请选择播放协议',
158 225 defaultValue: PlayProtocol.HTTP,
... ... @@ -167,87 +234,11 @@ export const streamingMediaAcquire: FormSchema[] = [
167 234 label: h(SnHelpMessage) as any,
168 235 component: 'Input',
169 236 rules: [...CameraVideoUrl, { required: true, message: '摄像头编号是必填项' }],
170   - componentProps: {
171   - placeholder: '请输入监控点编号',
  237 + ifShow({ values }) {
  238 + return values.accessMode === AccessMode.Streaming;
172 239 },
173   - },
174   -];
175   -
176   -// 弹框配置项
177   -export const formSchema: QFormSchema[] = [
178   - {
179   - field: 'avatar',
180   - label: '视频封面',
181   - slot: 'iconSelect',
182   - component: 'Input',
183   - },
184   - {
185   - field: 'name',
186   - label: '视频名字',
187   - required: true,
188   - component: 'Input',
189 240 componentProps: {
190   - placeholder: '请输入视频名字',
191   - maxLength: 30,
192   - },
193   - rules: [...CameraMaxLength, { required: true, message: '视频名是必填项' }],
194   - },
195   - {
196   - field: 'organizationId',
197   - label: '所属组织',
198   - required: true,
199   - component: 'ApiTreeSelect',
200   - componentProps: {
201   - api: async () => {
202   - const data = await getOrganizationList();
203   - copyTransFun(data as any as any[]);
204   - return data;
205   - },
206   - },
207   - },
208   - {
209   - label: '视频流获取方式',
210   - field: 'accessMode',
211   - component: 'RadioGroup',
212   - rules: [{ required: true, message: '视频流获取方式为必选项', type: 'number' }],
213   - defaultValue: AccessMode.ManuallyEnter,
214   - componentProps({ formActionType }) {
215   - return {
216   - defaultValue: AccessMode.ManuallyEnter,
217   - placeholder: '请选择视频流获取方式',
218   - options: [
219   - { label: '手动输入', value: AccessMode.ManuallyEnter },
220   - { label: '流媒体获取', value: AccessMode.Streaming },
221   - ],
222   - onChange(event: { target: { value: number } }) {
223   - formActionType.removeSchemaByFiled([
224   - 'videoPlatformId',
225   - 'streamType',
226   - 'playProtocol',
227   - 'sn',
228   - 'brand',
229   - 'videoUrl',
230   - ]);
231   - const {
232   - target: { value },
233   - } = event;
234   - if (value === AccessMode.ManuallyEnter) {
235   - manuallyEnter.forEach((schema) =>
236   - formActionType.appendSchemaByField(schema, undefined)
237   - );
238   - } else {
239   - streamingMediaAcquire.forEach((schema) =>
240   - formActionType.appendSchemaByField(schema, undefined)
241   - );
242   -
243   - formActionType.setFieldsValue({
244   - streamType: StreamType.MASTER,
245   - playProtocol: PlayProtocol.HTTP,
246   - });
247   - }
248   - },
249   - };
  241 + placeholder: '请输入监控点编号',
250 242 },
251 243 },
252   - ...manuallyEnter,
253 244 ];
... ...