<script setup lang="ts">
import { usePageSearch, type PageHooks, type PageEvents } from "/@/hooks/page";
import { ElButton, ElMessageBox, ElTooltip } from "element-plus";
import { useRenderIcon } from "/@/components/ReIcon/src/hooks";
import contentConfig from "./config/content.config";
import searchConfig from "./config/search.config";
import { useRouter } from "vue-router";

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

// 使用页面搜索钩子
const hooks: PageHooks = {
  pageSearchHook: () => usePageSearch(
    undefined, 
    undefined, 
    searchConfig
  )
};

// 页面事件处理
const events: PageEvents = {
  content: {
    preview: data => router.push(`/invoiceInOut/summaryDetail?data=${JSON.stringify(data)}`)
  }
};

// 状态变更处理
async function handleStatusChange() {
  try {
    await ElMessageBox.alert("是否确认审核", "提示", {
      type: "warning",
      confirmButtonText: "确认",
      cancelButtonText: "取消",
      showCancelButton: true
    });
  } catch (err) {
    console.error("状态变更失败:", err);
  }
}
</script>

<template>
  <PageAuth :pageName="PageName">
    <PageContainer
      :hooks="hooks"
      :events="events"
      :searchConfig="searchConfig"
      :contentConfig="contentConfig"
    >
      <template #content_action>
        <ElTooltip content="审批通过" placement="top">
          <ElButton
            link
            size="small"
            type="primary"
            @click="handleStatusChange"
            :icon="useRenderIcon('checkbox-circle-line')"
          />
        </ElTooltip>
        <ElTooltip content="改为未封账" placement="top">
          <ElButton
            link
            size="small"
            type="primary"
            @click="handleStatusChange"
            :icon="useRenderIcon('close-circle-line')"
          />
        </ElTooltip>
        <ElTooltip content="解除封账" placement="top">
          <ElButton
            link
            size="small"
            type="primary"
            @click="handleStatusChange"
            :icon="useRenderIcon('link')"
          />
        </ElTooltip>
        <ElTooltip content="改为待审批" placement="top">
          <ElButton
            link
            size="small"
            type="primary"
            @click="handleStatusChange"
            :icon="useRenderIcon('compass')"
          />
        </ElTooltip>
      </template>
    </PageContainer>
  </PageAuth>
</template>
