<script setup lang="ts">
import { ref } from "vue"
import { useVModel } from "@vueuse/core"
import contentConfig from "./config/content.config";
import searchConfig from "./config/search.config";
import { usePageSearch, type PageHooks, type PageEvents } from "/@/hooks/page";

import { ElMessage } from "element-plus"

const emit = defineEmits(['submit'])
const props = defineProps<{ visible: boolean }>()

const selection = ref([])
const visible = useVModel(props, 'visible')


const hooks: PageHooks = {
  pageSearchHook: () => usePageSearch(undefined, undefined, searchConfig)
};

async function onSubmit(){
  if(selection.value.length === 0){
    ElMessage.warning('请选择一条数据')
    return
  }

  if(selection.value.length > 1){
    ElMessage.warning('只能选择一条数据')
    return
  }

  visible.value = false
  emit('submit', selection.value[0])
}
</script>

<template>
  <ElDialog
    :close-on-click-modal="false"
    :close-on-press-escape="false"
    title="选择进项发票"
    v-model="visible"
    top="10px"
    center

    class="relative"
  >
    <PageContainer
      v-if="visible"
      :hooks="hooks"
      :notice="false"
      :search-config="searchConfig"
      :content-config="contentConfig"
      @content-select-change="values => selection = values"
      :isPageStart="true"
    />


    <div class="absolute bottom-[48px] right-[32px]">
      <ElButton type="primary" @click="onSubmit">
        保存
      </ElButton>
    </div>
  </ElDialog>
</template>
