import { Search } from "@element-plus/icons-vue"; import dayjs from "dayjs"; import { userListNoPageByTenantId } from "@/api/system/user.js"; import { computed, getCurrentInstance, nextTick, onMounted, reactive, ref, watch } from "vue"; import { EXPENSE_CATEGORY_OPTIONS, CATEGORY_TEMPLATES, EXPENSE_SUBJECT_OPTIONS, expenseCategoryLabel, expenseSubjectLabel, statusLabel, statusTagType, formatApprovalFlowSummary, buildAutoApprovalFlow, getApprovalRuleHint, createEmptyExpenseDetail, createEmptyForm, applyCategoryTemplate, initApprovalFlowNodes, advanceApprovalFlow, rejectApprovalFlow, normalizeImportedRow, } from "./costReimburseUtils.js"; function unwrapArray(payload) { if (Array.isArray(payload)) return payload; if (payload?.data && Array.isArray(payload.data)) return payload.data; if (payload?.rows && Array.isArray(payload.rows)) return payload.rows; return []; } function isActiveUser(u) { if (u.delFlag === "2" || u.delFlag === 2) return false; if (u.status == null) return true; return String(u.status) === "0"; } function demoFlowNodes(amount = 1200, category = "transport") { return buildAutoApprovalFlow(amount, category); } export function useCostReimburse() { const { proxy } = getCurrentInstance(); const allRows = ref([ { id: "1", reimburseNo: "CR202605100001", applicantId: "mock_1", employeeNo: "zhangsan", employeeName: "张三", applicantNo: "zhangsan", applicantName: "张三", expenseCategory: "office_procurement", reimburseReason: "采购打印机硒鼓、A4纸等办公耗材。", applyAmount: 680, payee: "张三", payeeAccount: "6222 **** **** 1234", bankBranch: "中国工商银行杭州西湖支行", expenseDetails: [ { id: "d1", invoiceDate: "2026-05-08", expenseSubject: "office_supply", amount: 380, description: "A4复印纸" }, { id: "d2", invoiceDate: "2026-05-08", expenseSubject: "office_supply", amount: 300, description: "硒鼓" }, ], attachmentList: [{ name: "采购发票.pdf", url: "/mock/invoice1.pdf" }], approvalFlowNodes: demoFlowNodes(680, "office_procurement"), currentNodeIndex: 0, approvalResult: "pending", rejectReason: "", approvalRecords: [], applyTime: "2026-05-10 09:15:00", createTime: "2026-05-10 09:15:00", deptId: "101", deptName: "行政部", }, { id: "2", reimburseNo: "CR202605080002", applicantId: "mock_2", employeeNo: "lisi", employeeName: "李四", applicantNo: "lisi", applicantName: "李四", expenseCategory: "business_entertainment", reimburseReason: "接待重点客户商务宴请。", applyAmount: 3200, payee: "李四", payeeAccount: "6217 **** **** 5678", bankBranch: "招商银行武汉光谷支行", expenseDetails: [ { id: "d3", invoiceDate: "2026-05-06", expenseSubject: "entertainment", amount: 3200, description: "客户宴请" }, ], attachmentList: [], approvalFlowNodes: demoFlowNodes(3200, "business_entertainment").map((n, i) => ({ ...n, nodeStatus: i === 0 ? "error" : "wait", approveOpinion: i === 0 ? "发票模糊需重传" : "", approveTime: i === 0 ? "2026-05-09 14:20:00" : "", })), currentNodeIndex: 0, approvalResult: "rejected", rejectReason: "发票模糊需重传", approvalRecords: [ { operatorName: "直属上级", result: "rejected", opinion: "发票模糊需重传", time: "2026-05-09 14:20:00" }, ], applyTime: "2026-05-07 16:30:00", createTime: "2026-05-07 16:30:00", deptId: "102", deptName: "销售部", }, { id: "3", reimburseNo: "CR202605050003", applicantId: "mock_3", employeeNo: "wangwu", employeeName: "王五", applicantNo: "wangwu", applicantName: "王五", expenseCategory: "communication", reimburseReason: "5月因公话费报销。", applyAmount: 198, payee: "王五", payeeAccount: "6228 **** **** 9012", bankBranch: "中国建设银行成都高新支行", expenseDetails: [ { id: "d4", invoiceDate: "2026-05-05", expenseSubject: "phone", amount: 198, description: "话费账单" }, ], attachmentList: [{ name: "话费账单.jpg", url: "/mock/phone.jpg" }], approvalFlowNodes: demoFlowNodes(198, "communication").map((n) => ({ ...n, nodeStatus: "finish", approveOpinion: "同意", approveTime: "2026-05-06 10:00:00", })), currentNodeIndex: 0, approvalResult: "approved", rejectReason: "", approvalRecords: [{ operatorName: "直属上级", result: "approved", opinion: "同意", time: "2026-05-06 10:00:00" }], applyTime: "2026-05-05 11:00:00", createTime: "2026-05-05 11:00:00", deptId: "103", deptName: "技术部", }, ]); const searchForm = reactive({ applicantKeyword: "", applyTimeFrom: "", applyTimeTo: "", }); const tableLoading = ref(false); const page = reactive({ current: 1, size: 10, total: 0 }); const importInputRef = ref(null); const allUsersCache = ref([]); const applicantFormSearchLoading = ref(false); const applicantFormOptions = ref([]); const formRef = ref(); const form = reactive(createEmptyForm()); const formDialog = reactive({ visible: false, title: "", mode: "add", readonly: false }); const detailDialog = reactive({ visible: false }); const detailRow = ref({}); const approveDialog = reactive({ visible: false, row: null }); const approveOpinion = ref(""); const filteredList = computed(() => { let list = [...allRows.value]; const kw = (searchForm.applicantKeyword || "").trim().toLowerCase(); if (kw) { list = list.filter((r) => { const name = (r.applicantName || r.employeeName || "").toLowerCase(); const no = (r.applicantNo || r.employeeNo || "").toLowerCase(); return name.includes(kw) || no.includes(kw); }); } if (searchForm.applyTimeFrom) { list = list.filter((r) => { const t = (r.applyTime || r.createTime || "").slice(0, 10); return !t || t >= searchForm.applyTimeFrom; }); } if (searchForm.applyTimeTo) { list = list.filter((r) => { const t = (r.applyTime || r.createTime || "").slice(0, 10); return !t || t <= searchForm.applyTimeTo; }); } return list.sort((a, b) => (String(a.createTime) < String(b.createTime) ? 1 : -1)); }); watch( filteredList, (list) => { page.total = list.length; const maxPage = Math.max(1, Math.ceil(list.length / page.size) || 1); if (page.current > maxPage) page.current = maxPage; }, { immediate: true } ); const tableData = computed(() => { const start = (page.current - 1) * page.size; return filteredList.value.slice(start, start + page.size).map((r) => ({ ...r, approvalFlowSummary: formatApprovalFlowSummary(r), })); }); const flowUserOptions = computed(() => allUsersCache.value.filter(isActiveUser)); const detailTotalAmount = computed(() => { const sum = (form.expenseDetails || []).reduce((s, d) => s + (Number(d.amount) || 0), 0); return Math.round(sum * 100) / 100; }); const approvalRuleHint = computed(() => getApprovalRuleHint(form.applyAmount ?? detailTotalAmount.value, form.expenseCategory) ); const tableColumn = ref([ { label: "报销单号", prop: "reimburseNo", width: 150 }, { label: "申请人编号", prop: "applicantNo", width: 110 }, { label: "申请人", prop: "applicantName", minWidth: 90 }, { label: "报销金额(元)", prop: "applyAmount", width: 110 }, { label: "报销原因", prop: "reimburseReason", minWidth: 160, showOverflowTooltip: true }, { label: "申请时间", prop: "applyTime", width: 165 }, { label: "创建时间", prop: "createTime", width: 165 }, { label: "报销状态", prop: "approvalResult", width: 100, dataType: "tag", formatData: (v) => statusLabel(v), formatType: (v) => statusTagType(v), }, { label: "审批流程", prop: "approvalFlowSummary", minWidth: 200, showOverflowTooltip: true, }, { dataType: "action", label: "操作", align: "center", fixed: "right", width: 220, operation: [ { name: "编辑", type: "text", disabled: (row) => row.approvalResult === "pending" || row.approvalResult === "approved", clickFun: (row) => openFormDialog("edit", row), }, { name: "详情", type: "text", clickFun: (row) => openDetail(row) }, { name: "审批", type: "text", disabled: (row) => row.approvalResult !== "pending", clickFun: (row) => openApprove(row), }, ], }, ]); const formRules = { applicantId: [{ required: true, message: "请选择员工", trigger: "change" }], expenseCategory: [{ required: true, message: "请选择费用类型", trigger: "change" }], reimburseReason: [{ required: true, message: "请填写报销原因", trigger: "blur" }], applyAmount: [{ required: true, message: "请填写报销金额", trigger: "blur" }], payee: [{ required: true, message: "请填写收款人", trigger: "blur" }], payeeAccount: [{ required: true, message: "请填写收款账号", trigger: "blur" }], bankBranch: [{ required: true, message: "请填写开户支行", trigger: "blur" }], approvalFlowNodes: [ { validator: (_r, _v, cb) => { const nodes = form.approvalFlowNodes || []; if (!nodes.length) { cb(new Error("请至少配置一个审批节点")); return; } if (nodes.some((n) => n.approverId == null || n.approverId === "")) { cb(new Error("每个节点须选择审批人")); return; } cb(); }, trigger: "change", }, ], }; async function loadUserPool() { try { allUsersCache.value = unwrapArray(await userListNoPageByTenantId()); } catch { allUsersCache.value = []; } } function userSelectLabel(u) { const nick = u.nickName || ""; const name = u.userName || ""; if (nick && name && nick !== name) return `${nick}(${name})`; return nick || name || `用户${u.userId ?? u.id ?? ""}`; } function userById(id) { return allUsersCache.value.find((u) => String(u.userId ?? u.id) === String(id)); } function employeeNoFromUser(u) { if (!u) return ""; return u.userName ?? u.userCode ?? u.jobNumber ?? u.workNo ?? (u.userId != null ? String(u.userId) : ""); } function filterUsersByQuery(query) { const list = allUsersCache.value.filter(isActiveUser); const q = (query || "").trim().toLowerCase(); if (!q) return [...list]; return list.filter((u) => { const nick = (u.nickName || "").toLowerCase(); const uname = (u.userName || "").toLowerCase(); return nick.includes(q) || uname.includes(q); }); } async function remoteSearchApplicantForm(query) { applicantFormSearchLoading.value = true; try { if (!allUsersCache.value.length) await loadUserPool(); applicantFormOptions.value = filterUsersByQuery(query); } finally { applicantFormSearchLoading.value = false; } } function onApplicantChange(uid) { const u = userById(uid); if (u) { form.employeeName = u.nickName || u.userName || ""; form.employeeNo = employeeNoFromUser(u); form.payee = form.payee || form.employeeName; form.deptId = String(u.deptId ?? u.sysDeptId ?? ""); form.deptName = u.dept?.deptName ?? u.deptName ?? ""; } else { form.employeeName = ""; form.employeeNo = ""; } } function autoAssignApprovalFlow() { const amount = Number(form.applyAmount) || detailTotalAmount.value || 0; form.approvalFlowNodes = buildAutoApprovalFlow(amount, form.expenseCategory || "other"); nextTick(() => formRef.value?.validateField?.("approvalFlowNodes")); } function onExpenseCategoryChange(val) { if (val && !(form.expenseDetails || []).length) { applyCategoryTemplate(form, val); syncApplyAmountFromDetails(); } autoAssignApprovalFlow(); } function applyTemplate(category) { applyCategoryTemplate(form, category); syncApplyAmountFromDetails(); autoAssignApprovalFlow(); proxy?.$modal?.msgSuccess?.(`已应用「${CATEGORY_TEMPLATES[category]?.label || category}」填报模板`); } function onDetailAmountChange() { syncApplyAmountFromDetails(); autoAssignApprovalFlow(); } function onApprovalFlowChange() { nextTick(() => formRef.value?.validateField?.("approvalFlowNodes")); } function addExpenseDetail() { form.expenseDetails.push(createEmptyExpenseDetail()); } function removeExpenseDetail(index) { form.expenseDetails.splice(index, 1); syncApplyAmountFromDetails(); autoAssignApprovalFlow(); } function syncApplyAmountFromDetails() { form.applyAmount = detailTotalAmount.value; } function handleQuery() { page.current = 1; tableLoading.value = true; setTimeout(() => { tableLoading.value = false; }, 150); } function resetSearch() { searchForm.applicantKeyword = ""; searchForm.applyTimeFrom = ""; searchForm.applyTimeTo = ""; handleQuery(); } function pagination(obj) { page.current = obj.page; page.size = obj.limit; } function openDetail(row) { detailRow.value = { ...row }; detailDialog.visible = true; } function openApprove(row) { approveDialog.row = { ...row }; approveDialog.visible = true; } function approvalActionLabel(v) { if (v === "approved") return "通过"; if (v === "rejected") return "驳回"; return "提交"; } async function openFormDialog(mode, row) { formDialog.mode = mode; formDialog.readonly = false; formDialog.title = mode === "add" ? "新增费用报销" : "编辑费用报销"; if (!allUsersCache.value.length) await loadUserPool(); Object.assign(form, createEmptyForm()); if (mode === "edit" && row) { Object.assign(form, { ...JSON.parse(JSON.stringify(row)), attachmentList: JSON.parse(JSON.stringify(row.attachmentList || row.invoiceAttachments || [])), approvalFlowNodes: JSON.parse(JSON.stringify(row.approvalFlowNodes || [])), expenseDetails: JSON.parse(JSON.stringify(row.expenseDetails || [])), }); const u = userById(row.applicantId); applicantFormOptions.value = u ? [u] : [{ userId: row.applicantId, nickName: row.employeeName, userName: row.employeeNo }]; } else { form.approvalFlowNodes = buildAutoApprovalFlow(0, "other"); remoteSearchApplicantForm(""); } formDialog.visible = true; nextTick(() => { formRef.value?.clearValidate?.(); }); } function onFormClosed() { formRef.value?.resetFields?.(); } async function submitForm() { try { await formRef.value?.validate?.(); } catch { return; } if (!(form.expenseDetails || []).length) { proxy?.$modal?.msgWarning?.("请至少添加一条报销明细"); return; } syncApplyAmountFromDetails(); autoAssignApprovalFlow(); const payload = { reimburseNo: form.reimburseNo || `CR${dayjs().format("YYYYMMDDHHmmss")}`, applicantId: form.applicantId, employeeNo: form.employeeNo, employeeName: form.employeeName, applicantNo: form.employeeNo, applicantName: form.employeeName, expenseCategory: form.expenseCategory, reimburseReason: form.reimburseReason, applyAmount: form.applyAmount, payee: form.payee, payeeAccount: form.payeeAccount, bankBranch: form.bankBranch, expenseDetails: JSON.parse(JSON.stringify(form.expenseDetails)), attachmentList: JSON.parse(JSON.stringify(form.attachmentList || [])), invoiceAttachments: (form.attachmentList || []).map((f, i) => ({ id: f.id ?? f.uid ?? `inv_${Date.now()}_${i}`, name: f.name || f.fileName || "未命名", url: f.url || f.downloadURL || "", })), approvalFlowNodes: initApprovalFlowNodes(form.approvalFlowNodes), currentNodeIndex: 0, deptId: form.deptId, deptName: form.deptName, }; if (formDialog.mode === "add") { const now = dayjs().format("YYYY-MM-DD HH:mm:ss"); allRows.value.unshift({ id: `local_${Date.now()}`, ...payload, approvalResult: "pending", rejectReason: "", approvalRecords: [], applyTime: now, createTime: now, }); proxy?.$modal?.msgSuccess?.("提交成功,已进入审批(本地模拟)"); } else { const idx = allRows.value.findIndex((r) => r.id === form.id); if (idx !== -1) { const prev = allRows.value[idx]; allRows.value[idx] = { ...prev, ...payload, id: form.id, approvalResult: prev.approvalResult === "rejected" ? "pending" : prev.approvalResult, approvalFlowNodes: initApprovalFlowNodes(form.approvalFlowNodes), currentNodeIndex: 0, rejectReason: prev.approvalResult === "rejected" ? "" : prev.rejectReason, applyTime: prev.applyTime, createTime: prev.createTime, }; } proxy?.$modal?.msgSuccess?.("保存成功(本地模拟)"); } formDialog.visible = false; handleQuery(); } async function submitApprove(result) { const row = approveDialog.row; if (!row) return; if (result === "rejected" && !(approveOpinion.value || "").trim()) { proxy?.$modal?.msgWarning?.("驳回须填写审批意见(如:发票模糊需重传)"); return; } const idx = allRows.value.findIndex((r) => r.id === row.id); if (idx === -1) return; const cur = allRows.value[idx]; const operatorName = "当前审批人"; const record = { operatorName, result, opinion: approveOpinion.value || (result === "approved" ? "同意" : "驳回"), time: dayjs().format("YYYY-MM-DD HH:mm:ss"), }; const records = [...(cur.approvalRecords || []), record]; let flowUpdate; if (result === "approved") { flowUpdate = advanceApprovalFlow(cur, approveOpinion.value); } else { flowUpdate = rejectApprovalFlow(cur, approveOpinion.value); } allRows.value[idx] = { ...cur, approvalFlowNodes: flowUpdate.nodes, currentNodeIndex: flowUpdate.currentNodeIndex, approvalResult: flowUpdate.approvalResult, rejectReason: flowUpdate.rejectReason ?? cur.rejectReason, approvalRecords: records, }; proxy?.$modal?.msgSuccess?.(result === "approved" ? "已通过" : "已驳回"); approveDialog.visible = false; handleQuery(); } function handleExport() { const data = filteredList.value; const blob = new Blob([JSON.stringify(data, null, 2)], { type: "application/json;charset=utf-8" }); const url = URL.createObjectURL(blob); const a = document.createElement("a"); a.href = url; a.download = `费用报销导出_${dayjs().format("YYYYMMDDHHmmss")}.json`; a.click(); URL.revokeObjectURL(url); proxy?.$modal?.msgSuccess?.(`已导出 ${data.length} 条`); } function handleImportClick() { importInputRef.value?.click?.(); } function onImportFile(e) { const file = e.target.files?.[0]; e.target.value = ""; if (!file) return; const reader = new FileReader(); reader.onload = () => { try { const parsed = JSON.parse(String(reader.result || "")); const arr = Array.isArray(parsed) ? parsed : parsed?.rows || parsed?.data; if (!Array.isArray(arr) || !arr.length) { proxy?.$modal?.msgWarning?.("导入格式须为费用报销 JSON 数组"); return; } arr.forEach((raw, i) => allRows.value.unshift(normalizeImportedRow(raw, i))); proxy?.$modal?.msgSuccess?.(`成功导入 ${arr.length} 条`); handleQuery(); } catch { proxy?.$modal?.msgError?.("解析失败"); } }; reader.readAsText(file, "utf-8"); } onMounted(() => loadUserPool()); return { Search, EXPENSE_CATEGORY_OPTIONS, CATEGORY_TEMPLATES, EXPENSE_SUBJECT_OPTIONS, expenseCategoryLabel, expenseSubjectLabel, searchForm, tableLoading, page, tableData, tableColumn, importInputRef, formRef, form, formDialog, formRules, detailDialog, detailRow, approveDialog, approveOpinion, applicantFormSearchLoading, applicantFormOptions, flowUserOptions, detailTotalAmount, approvalRuleHint, handleQuery, resetSearch, pagination, remoteSearchApplicantForm, userSelectLabel, onApplicantChange, onExpenseCategoryChange, applyTemplate, onDetailAmountChange, onApprovalFlowChange, addExpenseDetail, removeExpenseDetail, syncApplyAmountFromDetails, autoAssignApprovalFlow, openFormDialog, onFormClosed, submitForm, openDetail, approvalActionLabel, submitApprove, handleExport, handleImportClick, onImportFile, }; }