<template>
  <BasicModal
    :showCancelBtn="false"
    :showOkBtn="false"
    width="800px"
    v-bind="$attrs"
    @register="register"
    :title="title"
    helpMessage="点击最右侧选择按钮"
  >
    <Member v-if="title === '总负责人'" @select="select" />
    <Member v-if="title === '分管人'" @select="select" />
  </BasicModal>
</template>
<script lang="ts">
  import Member from './member/index.vue';
  import { BasicModal, useModalInner } from '/@/components/Modal';
  import { defineComponent, reactive, toRefs } from 'vue';

  export default defineComponent({
    components: { BasicModal, Member },
    emits: ['select'],
    setup(_, { emit }) {
      const state = reactive({
        title: '',
      });
      const [register, { closeModal }] = useModalInner((data) => {
        state.title = data;
      });

      function select(data) {
        emit('select', data);
        closeModal();
      }
      return {
        register,
        select,
        ...toRefs(state),
      };
    },
  });
</script>
