<script setup lang="ts">
import { reactive, ref } from "vue";
import { useRouter } from "vue-router";
import { usePageSearch, type PageHooks, type PageEvents } from "/@/hooks/page";
import NotOrderImportModal from "./components/NotOrderImportModal/index.vue"
import OrderImportModal from "./components/OrderImportModal/index.vue"
import contentConfig from "./config/content.config";
import searchConfig from "./config/search.config";

const PageName = "inOutManager";
const router = useRouter();

const state = reactive({ orderImportVisible: false, notOrderImportVisible: false })
const hooks: PageHooks = { pageSearchHook: () => usePageSearch(undefined, undefined, searchConfig) };

const pageContentRef = ref(null)

const events: PageEvents = {
  content: {
    create: () => router.push('/invoiceInOut/provisionOutDetail'),
    preview: ({ id }) => router.push("/invoiceInOut/provisionOutDetail?id=" + id)
  }
};
</script>

<template>
  <PageAuth :pageName="PageName">
    <PageContainer 
      :hooks="hooks" 
      :events="events" 
      :searchConfig="searchConfig" 
      :contentConfig="contentConfig"
      :get-content-ref="ref => pageContentRef = ref"
    />

    <OrderImportModal v-model:visible="state.orderImportVisible" @refresh="pageContentRef?.onSearch()" />

    <NotOrderImportModal v-model:visible="state.notOrderImportVisible" @refresh="pageContentRef?.onSearch()" />
  </PageAuth>
</template>
