report-v3/src/views/time/receivableDetail/components/business.vue

<script setup lang="ts">
import { ref, watch ,shallowRef} from "vue";
import apis from "./config/apis";
import { ElMessage } from "element-plus";
import { usePermission } from "/@/hooks/core";
import { frontEndExport } from "/@/utils/export";
import { isBeyondTime } from "/@/views/time/_utils";
import sourceSearchConfig from "./config/search.config";
import sourceContentConfig from "./config/content.config";
import { usePageSearch, type PageHooks } from "/@/hooks/page";
import { useRenderIcon } from "/@/components/ReIcon/src/hooks";
import { PageContentInstance } from "/@/components/PageContent";
import { useBusinessSearch, useBusinessContent } from "./../../_hooks";
import { useUserStore } from "/@/store/modules/user";
import { httpRequsetExport } from "/@/utils/export";
import dayjs from "dayjs"

const pageContentRef = ref<PageContentInstance | null>(null);
const lockKey = "companyNo";

const pageName = "receivableDetail";
const { hasPermissionWithCode } = usePermission(pageName);
const loading = shallowRef(false);

const userStore = useUserStore();
const { searchConfig } = useBusinessSearch({
  sourceConfig: sourceSearchConfig,
  queryField: "companyNo"
});

const searchConfigRef = ref(searchConfig);

const { contentConfig } = useBusinessContent({
  sourceConfig: sourceContentConfig,
  apis: { httpList: apis.list }
});

const hooks: PageHooks = {
  pageSearchHook: () =>
    usePageSearch((params) => { 
    const { date, ...rest } = params;
    const start = dayjs(date).format('YYYY-MM-DD');
    const daysInMonth = dayjs(date).daysInMonth();
    const end = dayjs(start).subtract(-(daysInMonth - 1), 'days').format('YYYY-MM-DD');

    return {
      result: {
        start: start + " 00:00:00",
        end: end + " 23:59:59",
        plat_type:"1",
        ...rest
      },
      deleteProps:['date']
    }
  },
   (params) => { 
     const { date, companyNo ,depart_id} = params;
     const start = dayjs(date).format('YYYY-MM-DD');
    const daysInMonth = dayjs(date).daysInMonth();
    const end = dayjs(start).subtract(-(daysInMonth - 1), 'days').format('YYYY-MM-DD');

    return {
      result: {
        start: start + " 00:00:00",
        end: end + " 23:59:59",
        companyNo,
        plat_type: "1",
        depart_id
      },
      deleteProps:['date']
    }
  }, searchConfig, false, lockKey)
};

watch(
  () => userStore.level,
  level => {
    const { formItems } = searchConfigRef.value;
    const index = formItems.findIndex(({ field }) => field === "depart_id");
    const { itemid = "" } = userStore.info || {};

    if (Number(level) === 2) {
      searchConfigRef.value.formItems[index].disabled = Number(level) === 2;
      searchConfigRef.value.formItems[index].defaultValue = itemid;
    }
  },
  {
    immediate: true
  }
);

const callback = {
  onSuccess: () => (loading.value = false),
  onStart: () => (loading.value = true),
  onFail: () => (loading.value = false)
};

async function handleExportAllReport() {
  const params = pageContentRef.value.getBasicParams() || {};
  const { start, end } = params;

  if (!params[lockKey]) {
    ElMessage.warning("请选择业务公司");
    return;
  }

  const beyondTime = isBeyondTime({ start, end, len: 30 });
  if (beyondTime) return;

  await httpRequsetExport({
    fileType: "aplication/x-msexecl",
    name: "应收账款明细.xlsx",
    url: "/admin/report/dzListExport",
    ...callback,
    params
  });
}
</script>

<template>
  <PageContainer
    :hooks="hooks"
    :getContentRef="ref => (pageContentRef = ref)"
    :content-config="contentConfig"
    :search-config="searchConfig"
    lockKey="companyNo"
    v-loading="loading"
  >
    <template #content_header>
      <el-button
        v-if="hasPermissionWithCode('18')"
        :icon="useRenderIcon('arrow-up-line')"
        @click="handleExportAllReport"
        size="small"
        type="primary"
        >导出</el-button
      >
    </template>
  </PageContainer>
</template>