<template>
  <BasicModal
    v-bind="$attrs"
    @register="register"
    :title="t('routes.scenes.addLive')"
    @ok="handleSubmit"
  >
    <div class="pt-20px">
      <BasicForm @register="registerForm">
        <!-- <template #label="{ model, field }">
          {{ model[field] }}
        </template>
        <template #process> {{ downloadInfo.process }} % </template>
        <template #status> {{ downloadInfo.status }} </template> -->
      </BasicForm>
    </div>
    <template #centerFooter> </template>
  </BasicModal>
</template>
<script lang="ts">
  import { defineComponent, ref } from 'vue';
  import { BasicModal, useModalInner } from '/@/components/Modal';
  import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
  // import { BasicTable, useTable, BasicColumn, FormSchema } from '/@/components/Table';
  // import { useMessage } from '/@/hooks/web/useMessage';
  // import { checkUserAddAble } from '/@/api/corporation/modal';
  import { useI18n } from '/@/hooks/web/useI18n';
  import { brandTypeListApi } from '/@/api/scene/live';
  // import { bindAnchorListParam } from '/@/api/scene/model';
  // import { Time } from '/@/components/Time';
  // import { useUserStore } from '/@/store/modules/user';
  const { t } = useI18n();
  const schemas: FormSchema[] = [
    {
      field: 'type',
      label: t('common.type'),
      component: 'ApiSelect',
      colProps: {
        xl: 5,
        xxl: 5,
      },
      componentProps: {
        api: brandTypeListApi,
        resultField: 'list',
        labelField: 'name',
        valueField: 'id',
        params: {
          page: 1,
          limit: 1000,
        },
      },
    },
  ];

  export default defineComponent({
    components: { BasicModal, BasicForm },
    props: {
      userData: { type: Object },
    },
    emits: ['register', 'success'],
    setup() {
      // const { createMessage } = useMessage();
      const sceneNum = ref('');

      const [registerForm, { setFieldsValue }] = useForm({
        schemas: schemas,
        labelWidth: 100,
        showActionButtonGroup: false,

        actionColOptions: {
          span: 24,
        },
        // submitFunc: handleSubmit,
      });
      const [register, { closeModal }] = useModalInner((data) => {
        data && onDataReceive(data);
      });

      function onDataReceive(data) {
        console.log('Data Received', data, data.num);

        setFieldsValue({
          ...data,
        });

        sceneNum.value = data.num;
      }
      const handleSubmit = async () => {};

      return {
        t,
        register,
        schemas,
        handleSubmit,
        closeModal,
        registerForm,
      };
    },
  });
</script>
