Commit 30126b273fdb5c3ab504c2e2e5bbb312dd501e8b

Authored by fengtao
1 parent 6fed128d

pref:select新增流媒体配置

... ... @@ -25,11 +25,28 @@
25 25 </div>
26 26 </Upload>
27 27 </template>
  28 + <template #videoPlatformIdSlot="{ model, field }">
  29 + <a-select
  30 + placeholder="请选择流媒体配置"
  31 + v-model:value="model[field]"
  32 + :options="streamConfigOptions.map((item) => ({ value: item.value, label: item.label }))"
  33 + >
  34 + <template #dropdownRender="{ menuNode: menu }">
  35 + <v-nodes :vnodes="menu" />
  36 + <a-divider style="margin: 4px 0" />
  37 + <div @click="handleOpenStreamConfig" style="padding: 4px 8px; cursor: pointer">
  38 + <plus-outlined />
  39 + 新增流媒体配置
  40 + </div>
  41 + </template>
  42 + </a-select>
  43 + </template>
28 44 </BasicForm>
29 45 </BasicDrawer>
  46 + <SteramingDrawer @register="registerSteramingDrawer" @success="handleSuccess" />
30 47 </template>
31 48 <script lang="ts">
32   - import { defineComponent, ref, computed, unref, nextTick } from 'vue';
  49 + import { defineComponent, ref, computed, unref, nextTick, onMounted } from 'vue';
33 50 import { BasicForm, useForm } from '/@/components/Form';
34 51 import { formSchema } from './config.data';
35 52 import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
... ... @@ -39,14 +56,27 @@
39 56 import { PlusOutlined, LoadingOutlined } from '@ant-design/icons-vue';
40 57 import { upload } from '/@/api/oss/ossFileUploader';
41 58 import { FileItem } from '/@/components/Upload/src/typing';
  59 + import { getStreamingMediaList } from '/@/api/camera/cameraManager';
  60 + import SteramingDrawer from '../streaming/SteramingDrawer.vue';
  61 + import { useDrawer } from '/@/components/Drawer';
42 62
43 63 export default defineComponent({
44 64 name: 'ContactDrawer',
45   - components: { BasicDrawer, BasicForm, Upload, PlusOutlined, LoadingOutlined },
  65 + components: {
  66 + BasicDrawer,
  67 + BasicForm,
  68 + Upload,
  69 + PlusOutlined,
  70 + LoadingOutlined,
  71 + SteramingDrawer,
  72 + VNodes: (_, { attrs }) => {
  73 + return attrs.vnodes;
  74 + },
  75 + },
46 76 emits: ['success', 'register'],
47 77 setup(_, { emit }) {
48 78 const loading = ref(false);
49   -
  79 + const streamConfigOptions: any = ref([]);
50 80 const isUpdate = ref(true);
51 81 const editId = ref('');
52 82 const [registerForm, { validate, setFieldsValue, resetFields }] = useForm({
... ... @@ -54,7 +84,32 @@
54 84 schemas: formSchema,
55 85 showActionButtonGroup: false,
56 86 });
  87 + onMounted(async () => {
  88 + const res = await getStreamingMediaList({});
  89 + streamConfigOptions.value = res.map((m) => {
  90 + return {
  91 + label: m.host,
  92 + value: m.id,
  93 + };
  94 + });
  95 + });
  96 + const [registerSteramingDrawer, { openDrawer }] = useDrawer();
57 97
  98 + const handleOpenStreamConfig = () => {
  99 + openDrawer(true, {
  100 + createFlag: true,
  101 + });
  102 + };
  103 + async function handleSuccess() {
  104 + const res = await getStreamingMediaList({});
  105 + if (res) {
  106 + streamConfigOptions.value = res.map((m) => {
  107 + return { label: m.host, value: m.id };
  108 + });
  109 + } else {
  110 + streamConfigOptions.value = [];
  111 + }
  112 + }
58 113 const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
59 114 await resetFields();
60 115 setDrawerProps({ confirmLoading: false });
... ... @@ -136,6 +191,10 @@
136 191 beforeUpload,
137 192 tenantLogo,
138 193 loading,
  194 + streamConfigOptions,
  195 + registerSteramingDrawer,
  196 + handleOpenStreamConfig,
  197 + handleSuccess,
139 198 };
140 199 },
141 200 });
... ...
... ... @@ -4,7 +4,6 @@ import { copyTransFun } from '/@/utils/fnUtils';
4 4 import type { FormSchema as QFormSchema } from '/@/components/Form/index';
5 5
6 6 import { CameraVideoUrl, CameraMaxLength, MediaTypeValidate } from '/@/utils/rules';
7   -import { getStreamingMediaList } from '/@/api/camera/cameraManager';
8 7 import { h } from 'vue';
9 8 import SnHelpMessage from './SnHelpMessage.vue';
10 9 export enum AccessMode {
... ... @@ -190,15 +189,13 @@ export const formSchema: QFormSchema[] = [
190 189 {
191 190 field: 'videoPlatformId',
192 191 label: '流媒体配置',
193   - component: 'ApiSelect',
  192 + component: 'Select',
194 193 ifShow({ values }) {
195 194 return values.accessMode === AccessMode.Streaming;
196 195 },
  196 + slot: 'videoPlatformIdSlot',
197 197 componentProps: {
198 198 placeholder: '请选择流媒体配置',
199   - api: getStreamingMediaList,
200   - labelField: 'host',
201   - valueField: 'id',
202 199 },
203 200 },
204 201 {
... ...
... ... @@ -9,7 +9,7 @@
9 9 import { useMessage } from '/@/hooks/web/useMessage';
10 10 import { PlayProtocol } from '../manage/config.data';
11 11
12   - const emit = defineEmits(['success','register']);
  12 + const emit = defineEmits(['success', 'register']);
13 13
14 14 const createFlag = ref(false);
15 15
... ... @@ -23,7 +23,7 @@
23 23 showActionButtonGroup: false,
24 24 });
25 25
26   - const [registerDrawer, { setDrawerProps }] = useDrawerInner((data: DrawerParams) => {
  26 + const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner((data: DrawerParams) => {
27 27 createFlag.value = data.createFlag;
28 28 if (!unref(createFlag)) {
29 29 id = data.record!.id;
... ... @@ -48,6 +48,7 @@
48 48 const { createMessage } = useMessage();
49 49 createMessage.success(message);
50 50 emit('success');
  51 + closeDrawer();
51 52 } catch (e) {
52 53 } finally {
53 54 setDrawerProps({
... ...
... ... @@ -185,6 +185,7 @@ export const formSchema: QFormSchema[] = [
185 185 {
186 186 field: 'executeWay',
187 187 component: 'RadioGroup',
  188 + helpMessage: [''],
188 189 label: '执行方式',
189 190 colProps: {
190 191 span: 24,
... ... @@ -225,6 +226,8 @@ export const formSchema: QFormSchema[] = [
225 226 });
226 227 } else {
227 228 setFieldsValue({ queryMode: QueryWay.LATEST });
  229 + setFieldsValue({ startTs: 5000 });
  230 + setFieldsValue({ interval: 1000 });
228 231 dataCompareOpions = [{ label: '固定周期', value: QueryWay.LATEST }];
229 232 updateSchema({
230 233 defaultValue: QueryWay.LATEST,
... ... @@ -437,7 +440,7 @@ export const formSchema: QFormSchema[] = [
437 440 },
438 441 {
439 442 field: SchemaFiled.START_TS,
440   - label: '时间周期',
  443 + label: '最近时间',
441 444 component: 'Select',
442 445 required: true,
443 446 ifShow({ values }) {
... ... @@ -447,7 +450,7 @@ export const formSchema: QFormSchema[] = [
447 450 const { setFieldsValue } = formActionType;
448 451 return {
449 452 defaultValue: 1000,
450   - placeholder: '请选择时间周期',
  453 + placeholder: '请选择近期时间',
451 454 options: intervalOption,
452 455 onChange() {
453 456 setFieldsValue({ [SchemaFiled.INTERVAL]: null });
... ...