<template>
  <BasicDrawer
    v-bind="$attrs"
    @register="registerDrawer"
    :isDetail="true"
    :showDetailBack="false"
    :showFooter="false"
    @ok="handleSubmit"
  >
    <list v-if="typeIf == 'rights'" :companyInfo="modelRef" />
    <camera v-else :companyInfo="modelRef" />
  </BasicDrawer>
</template>
<script lang="ts">
  import { defineComponent, ref, toRefs, reactive } from 'vue';
  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
  import camera from './camera.vue';
  import list from './list.vue';
  import { useI18n } from '/@/hooks/web/useI18n';
  // import { useUserStore } from '/@/store/modules/user';

  export default defineComponent({
    name: 'ProductDrawer',
    components: { BasicDrawer, camera, list },
    props: {
      type: {
        type: String,
        default: 'rights',
      },
    },
    emits: ['reload', 'register'],
    setup(props) {
      const isUpdate = ref(true);
      const modelRef = reactive({
        companyId: 0,
        companyName: '0',
        companyPhone: '0',
        userPermNum: 0,
      });
      // const userStore = useUserStore();
      // const userinfo = computed(() => userStore.getUserInfo); computed
      const { t } = useI18n();
      // const {type} = toRefs(props)
      const [registerDrawer, { setDrawerProps }] = useDrawerInner(async (data) => {
        setDrawerProps({ confirmLoading: false });
        isUpdate.value = !!data?.isUpdate;
        modelRef.companyId = data?.record?.companyId;
        modelRef.companyName = data?.record?.companyName;
        modelRef.companyPhone = data?.record?.companyPhone;
        modelRef.userPermNum = data?.record?.userPermNum;
        console.log('handleSubmit', t, modelRef, data);
      });
      function handleSubmit() {
        // console.log('handleSubmit')
      }
      return {
        modelRef,
        typeIf: toRefs(props).type,
        registerDrawer,
        handleSubmit,
      };
    },
  });
</script>

<style scoped lang="less">
  :deep(.detailed) {
    .title {
      display: flex;
      span,
      input,
      div {
        flex-grow: 1;
      }
      input {
        display: inline-block;
      }
      .name {
        flex-grow: 2;
      }
    }
    tr {
      th {
        font-weight: 500;
      }
    }
  }
</style>
