<script setup lang="ts">
import { ref, unref, onMounted } from "vue";
import TreeMenu from "./components/menu-tree.vue";
import { PageModal, usePageModal } from "/@/components/PageModal";
import { PageContent, PageContentInstance } from "/@/components/PageContent";
import contentConfig from "./config/content.config";
import modalConfig from "./config/modal.config";
import { IMenuTree, MENU_TYPE } from "./types";
import btnList from "/@/utils/btnList";
import { useUserStoreHook } from "/@/store/modules/user";

const menuid = ref("");
const pageContentRef = ref<PageContentInstance>(null);
const powers = ref([]);
const {
  pageModalRef,
  handleCreateData,
  handlePreviewData,
  handleUpdateData,
  handleConfrim,
  defaultInfo
} = usePageModal({
  pageContentRef,
  confirmCallback: ({ action_code }) => ({
    menuid: unref(menuid),
    action_name: btnList.find(b => b.code === action_code)?.name
  })
});

//节点选择
function handleTreeNodeSelect(node: IMenuTree) {
  const { menu_type, id } = node;
  const isPage = menu_type === MENU_TYPE.PAGE;
  if (!isPage) return;
  menuid.value = id;
  pageContentRef.value.getPageData({ id });
}

//初始化table
function initTableData(id: string) {
  menuid.value = id;
  pageContentRef.value.getPageData({ id });
}
onMounted(() => {
  powers.value = useUserStoreHook().getMenuActions("setBtn");
  contentConfig.powers = useUserStoreHook().getMenuActions("setBtn");
  console.log(contentConfig);
});
</script>

<template>
  <div class="main">
    <div class="flex" v-show="powers.some(i => i == '001')">
      <TreeMenu
        @tree-select-change="handleTreeNodeSelect"
        @init-table-data="initTableData"
      />
      <PageContent
        ref="pageContentRef"
        :content-config="contentConfig"
        @create-btn-click="handleCreateData"
        @preview-btn-click="handlePreviewData"
        @update-btn-click="handleUpdateData"
      />
      <PageModal
        ref="pageModalRef"
        :modal-config="modalConfig"
        :default-info="defaultInfo"
        @confirm-btn-click="handleConfrim"
      />
    </div>
    <NoAuth v-show="!powers.some(i => i == '001')" />
  </div>
</template>
