<!--
|
OA / 审批管理 / 审批详情
|
路由：/pages/oa/ApproveManage/approve-list/detail
|
-->
|
<template>
|
<view class="oa-detail-page">
|
<PageHeader :title="pageTitle"
|
@back="goBack" />
|
|
<scroll-view v-if="displayReady"
|
class="oa-detail-scroll"
|
scroll-y
|
:show-scrollbar="false">
|
<ReimburseInstanceDetailBody v-if="isReimburse"
|
:reimburse-row="reimburseRow"
|
:module-key="detailModuleKey" />
|
<ApproveInstanceDetailBody v-else
|
:row="row"
|
:module-key="detailModuleKey" />
|
</scroll-view>
|
|
<view v-else
|
class="oa-empty">
|
<up-empty mode="data"
|
:text="loading ? '加载中' : '未获取到审批数据'" />
|
</view>
|
|
<view v-if="displayReady"
|
class="oa-page-footer">
|
<text class="oa-footer-btn btn-default"
|
@click="goBack">返回</text>
|
<text v-if="showEdit"
|
class="oa-footer-btn btn-warn"
|
@click="goEdit">修改</text>
|
<text v-if="showApprove && !fromBusiness"
|
class="oa-footer-btn btn-primary"
|
@click="goApprove">去审批</text>
|
</view>
|
</view>
|
</template>
|
|
<script setup>
|
import { computed, ref } from "vue";
|
import { onLoad } from "@dcloudio/uni-app";
|
import PageHeader from "@/components/PageHeader.vue";
|
import ApproveInstanceDetailBody from "./_components/ApproveInstanceDetailBody.vue";
|
import ReimburseInstanceDetailBody from "../../ReimburseManage/_components/ReimburseInstanceDetailBody.vue";
|
import { OA_NAV } from "@/config/oaPaths.js";
|
import useUserStore from "@/store/modules/user";
|
import {
|
canApproveInstance,
|
canEditBusinessInstanceRow,
|
canModifyInstance,
|
loadInstanceRow,
|
stashInstanceRow,
|
} from "../../_utils/approveListUtils.js";
|
import { inferModuleKeyFromRow } from "../../_utils/approvalModuleApplyExtras.js";
|
import {
|
inferReimburseModuleKeyFromInstance,
|
isReimburseApprovalInstance,
|
loadReimburseDetailForInstance,
|
resolveFinReimbursementIdFromInstance,
|
stashReimburseEditFromApprove,
|
} from "../../_utils/reimburseApproveBridge.js";
|
import { getApprovalModuleConfig } from "../../_utils/approvalModuleRegistry.js";
|
import { canEditReimbursementRow } from "../../_utils/finReimbursementMappers.js";
|
|
const userStore = useUserStore();
|
const fromBusiness = ref(false);
|
const row = ref(null);
|
const reimburseRow = ref(null);
|
const loading = ref(false);
|
|
const detailModuleKey = computed(() => {
|
if (isReimburse.value) {
|
return (
|
reimburseRow.value?.moduleKey ||
|
inferReimburseModuleKeyFromInstance(row.value)
|
);
|
}
|
return inferModuleKeyFromRow(row.value);
|
});
|
|
const isReimburse = computed(() => isReimburseApprovalInstance(row.value));
|
|
const pageTitle = computed(() => {
|
if (isReimburse.value) {
|
return getApprovalModuleConfig(detailModuleKey.value)?.label
|
? `${getApprovalModuleConfig(detailModuleKey.value).label}详情`
|
: "报销详情";
|
}
|
return "审批详情";
|
});
|
|
const displayReady = computed(() =>
|
isReimburse.value ? Boolean(reimburseRow.value) : Boolean(row.value)
|
);
|
|
const showEdit = computed(() => {
|
if (isReimburse.value) {
|
return canEditReimbursementRow(reimburseRow.value);
|
}
|
if (fromBusiness.value) {
|
return canEditBusinessInstanceRow(row.value);
|
}
|
return canModifyInstance(row.value, userStore);
|
});
|
|
const showApprove = computed(() => canApproveInstance(row.value));
|
|
const goBack = () => uni.navigateBack();
|
|
const goEdit = () => {
|
if (!showEdit.value) return;
|
if (isReimburse.value) {
|
const mk = detailModuleKey.value;
|
const rid = resolveFinReimbursementIdFromInstance(row.value);
|
if (rid == null) {
|
uni.showToast({ title: "无法修改：缺少报销单 ID", icon: "none" });
|
return;
|
}
|
stashReimburseEditFromApprove(mk, rid);
|
uni.navigateTo({
|
url: `${OA_NAV.reimburseForm}?moduleKey=${mk}&mode=edit&reimbursementId=${rid}`,
|
});
|
return;
|
}
|
if (!row.value?.id) return;
|
const mk = detailModuleKey.value;
|
const q = mk ? `&moduleKey=${mk}` : "";
|
uni.navigateTo({
|
url: `${OA_NAV.approveListApply}?id=${row.value.id}${q}`,
|
});
|
};
|
|
const goApprove = () => {
|
if (!row.value?.id) return;
|
stashInstanceRow(row.value);
|
uni.navigateTo({
|
url: `${OA_NAV.approveListApprove}?id=${row.value.id}`,
|
});
|
};
|
|
onLoad(async options => {
|
fromBusiness.value = options?.from === "business";
|
if (!options?.id) {
|
uni.showToast({ title: "缺少审批 ID", icon: "none" });
|
setTimeout(goBack, 500);
|
return;
|
}
|
const cached = loadInstanceRow(options.id);
|
if (!cached) {
|
uni.showToast({ title: "请从列表进入详情", icon: "none" });
|
setTimeout(goBack, 500);
|
return;
|
}
|
row.value = cached;
|
if (isReimburseApprovalInstance(cached)) {
|
loading.value = true;
|
try {
|
const { reimburseRow: mapped } = await loadReimburseDetailForInstance(cached);
|
reimburseRow.value = mapped;
|
} catch {
|
uni.showToast({ title: "加载报销详情失败", icon: "none" });
|
} finally {
|
loading.value = false;
|
}
|
}
|
});
|
</script>
|
|
<style scoped lang="scss">
|
@import "../../_styles/oa-approval-list.scss";
|
</style>
|
