accout-vue3-ui/src/views/parameter/finance/index.vue

<script setup lang="ts">
import { ref } from "vue";
import searchConfig from "./config/search.config";
import contentConfig from "./config/content.config";
import FinanceModal from "./components/finance-modal.vue";
import { usePageSearch, type PageHooks, type PageEvents } from "/@/hooks/page";
import { ModalTypes } from "./types";

const pageName = "finance";
const pageContentRef = ref<any>(null);

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

const reload = () => pageContentRef.value.onSearch();
const financeModalRef = ref<InstanceType<typeof FinanceModal>>(null);

const events: PageEvents = {
  content: {
    update: data => financeModalRef.value.onDisplay(data, ModalTypes.update),
    preview: data => financeModalRef.value.onDisplay(data, ModalTypes.preview),
    create: () => financeModalRef.value.onDisplay(undefined, ModalTypes.create)
  }
};
</script>

<template>
  <PageAuth :pageName="pageName">
    <PageContainer
      :hooks="hooks"
      :events="events"
      :search-config="searchConfig"
      :content-config="contentConfig"
      :get-content-ref="ref => (pageContentRef = ref)"
    />
    <FinanceModal ref="financeModalRef" @finance-save="() => reload()" />
  </PageAuth>
</template>

<style scoped lang="scss">
:deep(.el-dropdown-menu__item i) {
  margin: 0;
}
</style>