Merge branch 'main' into f-dev

@@ -31,7 +31,7 @@
 <script lang="ts">
   import { defineComponent, ref, computed, unref, nextTick } from 'vue';
   import { BasicForm, useForm } from '/@/components/Form';
-  import { formSchema, manuallyEnter, streamingMediaAcquire } from './config.data';
+  import { formSchema } from './config.data';
   import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
   import { createOrEditCameraManage } from '/@/api/camera/cameraManager';
   import { message, Upload } from 'ant-design-vue';
@@ -49,10 +49,7 @@
 
       const isUpdate = ref(true);
       const editId = ref('');
-      const [
-        registerForm,
-        { validate, setFieldsValue, resetFields, removeSchemaByFiled, appendSchemaByField },
-      ] = useForm({
+      const [registerForm, { validate, setFieldsValue, resetFields }] = useForm({
         labelWidth: 120,
         schemas: formSchema,
         showActionButtonGroup: false,
@@ -64,19 +61,6 @@
         isUpdate.value = !!data?.isUpdate;
         if (unref(isUpdate)) {
           await nextTick();
-          removeSchemaByFiled([
-            'videoPlatformId',
-            'streamType',
-            'playProtocol',
-            'sn',
-            'brand',
-            'videoUrl',
-          ]);
-          if (data.record.accessMode === 0) {
-            manuallyEnter.forEach((schema) => appendSchemaByField(schema, undefined));
-          } else {
-            streamingMediaAcquire.forEach((schema) => appendSchemaByField(schema, undefined));
-          }
           editId.value = data.record.id;
           tenantLogo.value = data.record?.avatar;
           await setFieldsValue(data.record);
@@ -97,7 +81,7 @@
           const response = await upload(formData);
           if (response.fileStaticUri) {
             tenantLogo.value = response.fileStaticUri;
-            loading.value = true;
+            loading.value = false;
           }
         }
       }

@@ -6,7 +6,7 @@
   import snStep3 from '/@/assets/images/sn-step3.png';
   const imgList: string[] = [snStep1, snStep2, snStep3];
   function handlePreview() {
-    createImgPreview({ imageList: imgList });
+    createImgPreview({ imageList: imgList, defaultWidth: 1000 });
   }
 </script>
 

@@ -52,6 +52,12 @@ export const columns: BasicColumn[] = [
     width: 160,
   },
   {
+    title: '接受方式',
+    dataIndex: 'accessMode',
+    width: 160,
+    slots: { customRender: 'accessMode' },
+  },
+  {
     title: '创建时间',
     dataIndex: 'createTime',
     width: 180,
@@ -77,14 +83,70 @@ export const searchFormSchema: FormSchema[] = [
   },
 ];
 
-/**
- * @description 手动输入
- */
-export const manuallyEnter: FormSchema[] = [
+// 弹框配置项
+export const formSchema: QFormSchema[] = [
+  {
+    field: 'avatar',
+    label: '视频封面',
+    slot: 'iconSelect',
+    component: 'Input',
+  },
+  {
+    field: 'name',
+    label: '视频名字',
+    required: true,
+    component: 'Input',
+    componentProps: {
+      placeholder: '请输入视频名字',
+      maxLength: 30,
+    },
+    rules: [...CameraMaxLength, { required: true, message: '视频名是必填项' }],
+  },
+  {
+    field: 'organizationId',
+    label: '所属组织',
+    required: true,
+    component: 'ApiTreeSelect',
+    componentProps: {
+      api: async () => {
+        const data = await getOrganizationList();
+        copyTransFun(data as any as any[]);
+        return data;
+      },
+    },
+  },
+  {
+    label: '视频流获取方式',
+    field: 'accessMode',
+    component: 'RadioGroup',
+    rules: [{ required: true, message: '视频流获取方式为必选项', type: 'number' }],
+    defaultValue: AccessMode.ManuallyEnter,
+    componentProps({ formActionType }) {
+      return {
+        defaultValue: AccessMode.ManuallyEnter,
+        placeholder: '请选择视频流获取方式',
+        options: [
+          { label: '手动输入', value: AccessMode.ManuallyEnter },
+          { label: '流媒体获取', value: AccessMode.Streaming },
+        ],
+        onChange() {
+          formActionType.setFieldsValue({
+            brand: null,
+            sn: null,
+            videoUrl: null,
+            videoPlatformId: null,
+          });
+        },
+      };
+    },
+  },
   {
     field: 'brand',
     label: '视频厂家',
     component: 'Input',
+    ifShow({ values }) {
+      return values.accessMode === AccessMode.ManuallyEnter;
+    },
     componentProps: {
       placeholder: '请输入视频厂家',
     },
@@ -95,6 +157,9 @@ export const manuallyEnter: FormSchema[] = [
     required: true,
     component: 'Input',
     rules: [...CameraVideoUrl, { required: true, message: '摄像头编号是必填项' }],
+    ifShow({ values }) {
+      return values.accessMode === AccessMode.ManuallyEnter;
+    },
     componentProps: {
       placeholder: '请输入摄像头编号',
     },
@@ -104,22 +169,23 @@ export const manuallyEnter: FormSchema[] = [
     label: '视频流',
     required: true,
     component: 'Input',
+    ifShow({ values }) {
+      return values.accessMode === AccessMode.ManuallyEnter;
+    },
     componentProps: {
       placeholder: '请输入视频流',
       maxLength: 255,
     },
     rules: [...CameraVideoUrl, { required: true, message: '视频流是必填项' }],
   },
-];
 
-/**
- * @description 流媒体获取
- */
-export const streamingMediaAcquire: FormSchema[] = [
   {
     field: 'videoPlatformId',
     label: '流媒体配置',
     component: 'ApiSelect',
+    ifShow({ values }) {
+      return values.accessMode === AccessMode.Streaming;
+    },
     componentProps: {
       placeholder: '请选择流媒体配置',
       api: getStreamingMediaList,
@@ -132,6 +198,9 @@ export const streamingMediaAcquire: FormSchema[] = [
     label: '码流',
     component: 'RadioGroup',
     defaultValue: StreamType.MASTER,
+    ifShow({ values }) {
+      return values.accessMode === AccessMode.Streaming;
+    },
     componentProps: {
       placeholder: '请选择码流',
       defaultValue: StreamType.MASTER,
@@ -147,6 +216,10 @@ export const streamingMediaAcquire: FormSchema[] = [
     label: '播放协议',
     component: 'RadioGroup',
     defaultValue: PlayProtocol.HTTP,
+    ifShow({ values }) {
+      return values.accessMode === AccessMode.Streaming;
+    },
+    helpMessage: ['平台使用https的hls协议,需联系海康开放平台专家支持。'],
     componentProps: {
       placeholder: '请选择播放协议',
       defaultValue: PlayProtocol.HTTP,
@@ -161,87 +234,11 @@ export const streamingMediaAcquire: FormSchema[] = [
     label: h(SnHelpMessage) as any,
     component: 'Input',
     rules: [...CameraVideoUrl, { required: true, message: '摄像头编号是必填项' }],
-    componentProps: {
-      placeholder: '请输入监控点编号',
+    ifShow({ values }) {
+      return values.accessMode === AccessMode.Streaming;
     },
-  },
-];
-
-// 弹框配置项
-export const formSchema: QFormSchema[] = [
-  {
-    field: 'avatar',
-    label: '视频封面',
-    slot: 'iconSelect',
-    component: 'Input',
-  },
-  {
-    field: 'name',
-    label: '视频名字',
-    required: true,
-    component: 'Input',
     componentProps: {
-      placeholder: '请输入视频名字',
-      maxLength: 30,
-    },
-    rules: [...CameraMaxLength, { required: true, message: '视频名是必填项' }],
-  },
-  {
-    field: 'organizationId',
-    label: '所属组织',
-    required: true,
-    component: 'ApiTreeSelect',
-    componentProps: {
-      api: async () => {
-        const data = await getOrganizationList();
-        copyTransFun(data as any as any[]);
-        return data;
-      },
-    },
-  },
-  {
-    label: '视频流获取方式',
-    field: 'accessMode',
-    component: 'RadioGroup',
-    rules: [{ required: true, message: '视频流获取方式为必选项', type: 'number' }],
-    defaultValue: AccessMode.ManuallyEnter,
-    componentProps({ formActionType }) {
-      return {
-        defaultValue: AccessMode.ManuallyEnter,
-        placeholder: '请选择视频流获取方式',
-        options: [
-          { label: '手动输入', value: AccessMode.ManuallyEnter },
-          { label: '流媒体获取', value: AccessMode.Streaming },
-        ],
-        onChange(event: { target: { value: number } }) {
-          formActionType.removeSchemaByFiled([
-            'videoPlatformId',
-            'streamType',
-            'playProtocol',
-            'sn',
-            'brand',
-            'videoUrl',
-          ]);
-          const {
-            target: { value },
-          } = event;
-          if (value === AccessMode.ManuallyEnter) {
-            manuallyEnter.forEach((schema) =>
-              formActionType.appendSchemaByField(schema, undefined)
-            );
-          } else {
-            streamingMediaAcquire.forEach((schema) =>
-              formActionType.appendSchemaByField(schema, undefined)
-            );
-
-            formActionType.setFieldsValue({
-              streamType: StreamType.MASTER,
-              playProtocol: PlayProtocol.HTTP,
-            });
-          }
-        },
-      };
+      placeholder: '请输入监控点编号',
     },
   },
-  ...manuallyEnter,
 ];

@@ -38,6 +38,15 @@
             "
           />
         </template>
+        <template #accessMode="{ record }">
+          <span>{{
+            record.accessMode === AccessMode.ManuallyEnter
+              ? '手动输入'
+              : record.accessMode === AccessMode.Streaming
+              ? '流媒体获取'
+              : ''
+          }}</span>
+        </template>
         <template #action="{ record }">
           <TableAction
             :actions="[
@@ -81,7 +90,7 @@
   import CameraDrawer from './CameraDrawer.vue';
   import { useResetOrganizationTree, OrganizationIdTree } from '/@/views/common/organizationIdTree';
   import { cameraPage, deleteCameraManage } from '/@/api/camera/cameraManager';
-  import { searchFormSchema, columns } from './config.data';
+  import { searchFormSchema, columns, AccessMode } from './config.data';
   import VideoPreviewModal from './DialogPreviewVideo.vue';
   import { useModal } from '/@/components/Modal';
   import { Authority } from '/@/components/Authority';
@@ -181,6 +190,7 @@
         organizationIdTreeRef,
         handleViewVideo,
         registerModal,
+        AccessMode,
       };
     },
   });

@@ -7,6 +7,7 @@
   import { createOrUpdateStreamingMediaRecord } from '/@/api/camera/cameraManager';
   import { StreamingMediaModel } from '/@/api/camera/model/cameraModel';
   import { useMessage } from '/@/hooks/web/useMessage';
+  import { PlayProtocol } from '../manage/config.data';
 
   const emit = defineEmits({
     success: null,
@@ -30,6 +31,7 @@
       id = data.record!.id;
       setFieldsValue(data.record);
     } else {
+      setFieldsValue({ ssl: PlayProtocol.HTTP });
       resetFields();
     }
   });

@@ -18,18 +18,6 @@ export const streamingMediaSSLMapping = {
 
 export const columnSchema: BasicColumn[] = [
   {
-    title: '平台类型',
-    dataIndex: 'type',
-    width: 80,
-    slots: { customRender: 'type' },
-  },
-  {
-    title: '部署环境',
-    dataIndex: 'ssl',
-    width: 80,
-    slots: { customRender: 'ssl' },
-  },
-  {
     title: '平台地址',
     dataIndex: 'host',
     width: 80,
@@ -44,6 +32,18 @@ export const columnSchema: BasicColumn[] = [
     dataIndex: 'appSecret',
     width: 80,
   },
+  {
+    title: '平台类型',
+    dataIndex: 'type',
+    width: 80,
+    slots: { customRender: 'type' },
+  },
+  {
+    title: '部署环境',
+    dataIndex: 'ssl',
+    width: 80,
+    slots: { customRender: 'ssl' },
+  },
 ];
 
 export const formSchema: FormSchema[] = [
@@ -71,7 +71,9 @@ export const formDetailSchema: FormSchema[] = [
     field: 'ssl',
     component: 'RadioGroup',
     rules: [{ required: true, message: '流媒体部署环境为必填项', type: 'number' }],
+    defaultValue: PlayProtocol.HTTP,
     componentProps: {
+      defaultValue: PlayProtocol.HTTP,
       options: [
         { label: 'http', value: PlayProtocol.HTTP },
         { label: 'https', value: PlayProtocol.HTTPS },