From 97081b89ee45da49b8dbb4173ab45df031fe3c0d Mon Sep 17 00:00:00 2001
From: yyb <995253665@qq.com>
Date: 星期三, 20 五月 2026 16:58:40 +0800
Subject: [PATCH] 删除冗余和无效代码
---
src/views/officeProcessAutomation/AttendManage/leave-apply/index.vue | 951 ++++++++++------------------------------------------------
1 files changed, 168 insertions(+), 783 deletions(-)
diff --git a/src/views/officeProcessAutomation/AttendManage/leave-apply/index.vue b/src/views/officeProcessAutomation/AttendManage/leave-apply/index.vue
index 7c3849b..546ca87 100644
--- a/src/views/officeProcessAutomation/AttendManage/leave-apply/index.vue
+++ b/src/views/officeProcessAutomation/AttendManage/leave-apply/index.vue
@@ -10,17 +10,17 @@
placeholder="濮撳悕鎴栫紪鍙�"
clearable
:prefix-icon="Search"
- @keyup.enter="handleQuery"
+ @keyup.enter="onSearch"
/>
<span class="search_title" style="margin-left: 12px">璇峰亣绫诲瀷锛�</span>
<el-select v-model="searchForm.leaveType" placeholder="鍏ㄩ儴" clearable style="width: 180px">
<el-option v-for="opt in LEAVE_TYPE_OPTIONS" :key="opt.value" :label="opt.label" :value="opt.value" />
</el-select>
- <el-button type="primary" style="margin-left: 10px" @click="handleQuery">鎼滅储</el-button>
+ <el-button type="primary" style="margin-left: 10px" @click="onSearch">鎼滅储</el-button>
<el-button @click="resetSearch">閲嶇疆</el-button>
</div>
<div>
- <el-button type="primary" @click="openFormDialog('add')">鏂板璇峰亣鐢宠</el-button>
+ <el-button type="primary" @click="openAddWithTemplate">鏂板璇峰亣鐢宠</el-button>
</div>
</div>
<div class="table_list">
@@ -31,55 +31,28 @@
:page="page"
:isSelection="false"
:tableLoading="tableLoading"
- @pagination="pagination"
+ @pagination="onPagination"
:total="page.total"
/>
</div>
- <!-- 鏂板 / 缂栬緫 -->
- <el-dialog
- v-model="formDialog.visible"
- :title="formDialog.title"
- width="960px"
- append-to-body
- destroy-on-close
- class="leave-apply-form-dialog"
- @closed="onFormClosed"
+ <ApprovalInstanceSubmitDialog
+ v-model="submitDialog.visible"
+ :title="submitDialogTitle"
+ :form="submitForm"
+ :rules="submitFormRules"
+ :fields="submitFormFields"
+ :active-template="activeTemplate"
+ :user-options="flowUserOptions"
+ :is-edit="isSubmitEdit"
+ :saving="submitSaving"
+ :form-ref="submitFormRef"
+ flow-attachments-only
+ @submit="onSubmit"
>
- <el-form ref="formRef" :model="form" :rules="formRules" label-width="140px" class="leave-apply-form">
+ <template #before="{ form, fields }">
+ <FormPayloadFields :fields="displayTemplateFields(fields)" :form-payload="form.formPayload" />
<el-row :gutter="24">
- <el-col :span="24">
- <el-form-item label="鐢宠浜�" prop="applicantId">
- <el-select
- v-model="form.applicantId"
- filterable
- remote
- clearable
- reserve-keyword
- placeholder="璇烽�夋嫨鎴栨悳绱㈢敵璇蜂汉"
- style="width: 100%"
- :remote-method="remoteSearchApplicantForm"
- :loading="applicantFormSearchLoading"
- @change="onApplicantChange"
- >
- <el-option
- v-for="u in applicantFormOptions"
- :key="u.userId"
- :label="userSelectLabel(u)"
- :value="u.userId"
- />
- </el-select>
- </el-form-item>
- </el-col>
- </el-row>
- <el-row :gutter="24">
- <el-col :span="12">
- <el-form-item label="璇峰亣绫诲瀷" prop="leaveType">
- <el-select v-model="form.leaveType" placeholder="璇烽�夋嫨璇峰亣绫诲瀷" clearable filterable style="width: 100%">
- <el-option v-for="opt in LEAVE_TYPE_OPTIONS" :key="opt.value" :label="opt.label" :value="opt.value" />
- </el-select>
- </el-form-item>
- </el-col>
<el-col :span="12">
<el-form-item label="鍋囨湡浣欓" prop="leaveBalanceDays">
<el-input-number
@@ -94,163 +67,50 @@
/>
</el-form-item>
</el-col>
- </el-row>
- <el-row :gutter="24">
- <el-col :span="12">
- <el-form-item label="璇峰亣寮�濮嬫椂闂�" prop="leaveStartTime">
- <el-date-picker
- v-model="form.leaveStartTime"
- type="datetime"
- placeholder="璇烽�夋嫨寮�濮嬫椂闂�"
- format="YYYY-MM-DD HH:mm:ss"
- value-format="YYYY-MM-DD HH:mm:ss"
- style="width: 100%"
- @change="onLeaveRangeChange"
- />
- </el-form-item>
- </el-col>
- <el-col :span="12">
- <el-form-item label="璇峰亣缁撴潫鏃堕棿" prop="leaveEndTime">
- <el-date-picker
- v-model="form.leaveEndTime"
- type="datetime"
- placeholder="璇烽�夋嫨缁撴潫鏃堕棿"
- format="YYYY-MM-DD HH:mm:ss"
- value-format="YYYY-MM-DD HH:mm:ss"
- style="width: 100%"
- @change="onLeaveRangeChange"
- />
- </el-form-item>
- </el-col>
- </el-row>
- <el-row :gutter="24">
<el-col :span="12">
<el-form-item label="璇峰亣鏃堕暱">
- <el-input :model-value="leaveDurationDisplay" readonly placeholder="鏍规嵁璧锋鏃堕棿鑷姩璁＄畻">
+ <el-input :model-value="leaveDurationDisplay(form)" readonly placeholder="鏍规嵁妯℃澘涓鍋囨椂闂磋嚜鍔ㄨ绠�">
<template #append>澶�</template>
</el-input>
</el-form-item>
</el-col>
- <el-col :span="12">
- <el-form-item label="瀹℃壒鏂瑰紡" prop="approvalMode">
- <el-radio-group v-model="form.approvalMode">
- <el-radio value="parallel">涓庣</el-radio>
- <el-radio value="or_sign">鎴栫</el-radio>
- </el-radio-group>
- </el-form-item>
- </el-col>
</el-row>
- <el-row :gutter="24">
- <el-col :span="24">
- <el-form-item label="瀹℃壒浜�" prop="approverIds">
- <el-tree-select
- v-model="form.approverIds"
- :data="approverTreeData"
- multiple
- collapse-tags
- collapse-tags-tooltip
- :max-collapse-tags="2"
- :render-after-expand="false"
- placeholder="璇烽�夋嫨瀹℃壒浜猴紙鍙閫夛級"
- style="width: 100%"
- :props="{ value: 'id', label: 'label', children: 'children', disabled: 'disabled' }"
- check-strictly
- />
- </el-form-item>
- </el-col>
- </el-row>
- <el-row :gutter="24">
- <el-col :span="24">
- <el-form-item label="璇峰亣浜嬬敱" prop="leaveReason">
- <el-input
- v-model="form.leaveReason"
- type="textarea"
- :rows="4"
- placeholder="璇峰～鍐欒鍋囦簨鐢�"
- maxlength="2000"
- show-word-limit
- />
- </el-form-item>
- </el-col>
- </el-row>
- <el-row :gutter="24">
- <el-col :span="24">
- <el-form-item label="闄勪欢">
- <div class="upload-block">
- <FileUpload v-model:file-list="form.attachmentList" :limit="10" button-text="鐐瑰嚮閫夋嫨鏂囦欢" />
- </div>
- </el-form-item>
- </el-col>
- </el-row>
- </el-form>
- <template #footer>
- <div class="dialog-footer">
- <el-button type="primary" @click="submitForm">纭� 瀹�</el-button>
- <el-button @click="formDialog.visible = false">鍙� 娑�</el-button>
- </div>
</template>
- </el-dialog>
+ </ApprovalInstanceSubmitDialog>
- <!-- 璇︽儏 -->
- <el-dialog v-model="detailDialog.visible" title="璇峰亣鐢宠璇︽儏" width="720px" append-to-body>
- <el-descriptions :column="1" border>
- <el-descriptions-item label="鐢宠浜虹紪鍙�">{{ detailRow.applicantNo || "鈥�" }}</el-descriptions-item>
- <el-descriptions-item label="鐢宠浜�">{{ detailRow.applicantName }}</el-descriptions-item>
- <el-descriptions-item label="璇峰亣绫诲瀷">{{ leaveTypeLabel(detailRow.leaveType) }}</el-descriptions-item>
- <el-descriptions-item label="鍋囨湡浣欓">{{ formatBalance(detailRow.leaveBalanceDays) }}</el-descriptions-item>
- <el-descriptions-item label="璇峰亣寮�濮嬫椂闂�">{{ detailRow.leaveStartTime || "鈥�" }}</el-descriptions-item>
- <el-descriptions-item label="璇峰亣缁撴潫鏃堕棿">{{ detailRow.leaveEndTime || "鈥�" }}</el-descriptions-item>
- <el-descriptions-item label="璇峰亣鏃堕暱">{{ formatDuration(detailRow.leaveDurationDays) }}</el-descriptions-item>
- <el-descriptions-item label="璇峰亣浜嬬敱">{{ detailRow.leaveReason }}</el-descriptions-item>
- <el-descriptions-item label="瀹℃壒缁撴灉">{{ approvalResultLabel(detailRow.approvalResult) }}</el-descriptions-item>
- <el-descriptions-item label="瀹℃壒鏂瑰紡">{{ approvalModeLabel(detailRow.approvalMode) }}</el-descriptions-item>
- <el-descriptions-item label="瀹℃壒浜�">{{ detailRow.approverNames || "鈥�" }}</el-descriptions-item>
- <el-descriptions-item label="鍒涘缓鏃堕棿">{{ detailRow.createTime || "鈥�" }}</el-descriptions-item>
- <el-descriptions-item label="闄勪欢">
- <template v-if="detailRow.attachmentList?.length">
- <el-tag v-for="(f, i) in detailRow.attachmentList" :key="i" class="mr6 mb6" type="info">
- {{ f.name }}
- </el-tag>
- </template>
- <span v-else>鏃�</span>
- </el-descriptions-item>
- </el-descriptions>
- <template #footer>
- <div class="dialog-footer">
- <el-button type="primary" @click="detailDialog.visible = false">鍏� 闂�</el-button>
- </div>
- </template>
- </el-dialog>
+ <ApprovalTemplateBindDialog
+ v-model:visible="templateBindVisible"
+ :module-key="APPROVAL_MODULE_KEYS.LEAVE"
+ skip-form-confirm
+ @confirm="onTemplateBound"
+ @closed="onTemplateBindClosed"
+ />
- <!-- 闄勪欢鍒楄〃 -->
- <el-dialog v-model="filesDialog.visible" title="闄勪欢" width="520px" append-to-body>
- <el-table v-if="filesDialog.row?.attachmentList?.length" :data="filesDialog.row.attachmentList" border>
- <el-table-column type="index" label="搴忓彿" width="60" align="center" />
- <el-table-column prop="name" label="鏂囦欢鍚�" min-width="200" show-overflow-tooltip />
- <el-table-column label="鎿嶄綔" width="100" align="center">
- <template #default="{ row }">
- <el-button link type="primary" @click="mockDownload(row)">涓嬭浇</el-button>
- </template>
- </el-table-column>
- </el-table>
- <el-empty v-else description="鏆傛棤闄勪欢" />
- <template #footer>
- <div class="dialog-footer">
- <el-button type="primary" @click="filesDialog.visible = false">鍏� 闂�</el-button>
- </div>
- </template>
- </el-dialog>
+ <ApprovalInstanceDetailDialog
+ v-model="detailDialog.visible"
+ title="璇峰亣鐢宠璇︽儏"
+ :row="detailRow"
+ @edit="openEditFromDetail"
+ />
</div>
</template>
<script setup>
import { Search } from "@element-plus/icons-vue";
import dayjs from "dayjs";
-import FileUpload from "@/components/AttachmentUpload/file/index.vue";
-import { deptTreeSelect, userListNoPageByTenantId } from "@/api/system/user.js";
-import { computed, getCurrentInstance, nextTick, onMounted, reactive, ref, watch } from "vue";
+import { userListNoPageByTenantId } from "@/api/system/user.js";
+import { ElMessage } from "element-plus";
+import { computed, onMounted, reactive, ref, watch } from "vue";
+import FormPayloadFields from "../../ApproveManage/approve-list/components/FormPayloadFields.vue";
+import ApprovalInstanceDetailDialog from "../../ApproveManage/approve-shared/components/ApprovalInstanceDetailDialog.vue";
+import ApprovalInstanceSubmitDialog from "../../ApproveManage/approve-shared/components/ApprovalInstanceSubmitDialog.vue";
+import ApprovalTemplateBindDialog from "../../ApproveManage/approve-shared/components/ApprovalTemplateBindDialog.vue";
+import { buildInstanceTableColumns } from "../../ApproveManage/approve-shared/approvalInstanceFormConfigTable.js";
+import { APPROVAL_MODULE_KEYS } from "../../ApproveManage/approve-shared/approvalModuleRegistry.js";
+import { useApprovalInstanceModule } from "../../ApproveManage/approve-shared/useApprovalInstanceModule.js";
+import { useFlowUserOptions } from "../../ApproveManage/approve-shared/useFlowUserOptions.js";
+import { SELECT_OPTION_SOURCE } from "../../ApproveManage/approve-template/selectOptionSource.js";
-/** 璇峰亣绫诲瀷锛坴alue 涓庡悗绔榻愬崰浣嶏級 */
const LEAVE_TYPE_OPTIONS = [
{ label: "骞村亣", value: "annual" },
{ label: "鐥呭亣", value: "sick" },
@@ -262,188 +122,44 @@
{ label: "璋冧紤", value: "compensatory" },
];
-function leaveTypeLabel(v) {
- const hit = LEAVE_TYPE_OPTIONS.find((x) => x.value === v);
- return hit?.label || "鈥�";
+function isLeaveBalanceField(field) {
+ const label = String(field?.label || "");
+ return label.includes("鍋囨湡浣欓") || field?.key === "leaveBalanceDays";
}
-/** 涓庡悗绔害瀹氬瓧娈碉紙鍗犱綅锛� */
-const createEmptyForm = () => ({
- id: undefined,
- applicantId: "",
- applicantNo: "",
- applicantName: "",
- leaveType: "",
- leaveBalanceDays: undefined,
- leaveStartTime: "",
- leaveEndTime: "",
- leaveReason: "",
- approvalMode: "parallel",
- approverIds: [],
- approverNames: "",
- attachmentList: [],
-});
-
-const { proxy } = getCurrentInstance();
-
-function unwrapArray(payload) {
- if (Array.isArray(payload)) return payload;
- if (payload && Array.isArray(payload.data)) return payload.data;
- if (payload && Array.isArray(payload.rows)) return payload.rows;
- return [];
+function isLeaveDurationField(field) {
+ const label = String(field?.label || "");
+ return label.includes("璇峰亣鏃堕暱") || field?.key === "leaveDurationDays";
}
-function filterDisabledDept(deptList) {
- if (!Array.isArray(deptList)) return [];
- return deptList.filter((dept) => {
- if (dept.disabled) return false;
- if (dept.children?.length) {
- dept.children = filterDisabledDept(dept.children);
- }
- return true;
- });
+function displayTemplateFields(fields = []) {
+ return (fields || []).filter((f) => !isLeaveBalanceField(f) && !isLeaveDurationField(f));
}
-function getUserDeptId(u) {
- return u.deptId ?? u.sysDeptId ?? u.dept?.deptId ?? u.dept?.id ?? u.dept_id;
+function findLeaveTimeTemplateField(fields = []) {
+ return (
+ fields.find((f) => f?.type === "datetimerange" && String(f?.label || "").includes("璇峰亣鏃堕棿")) ||
+ fields.find((f) => f?.type === "datetimerange" && f?.key === "dateRange") ||
+ fields.find((f) => f?.type === "datetimerange") ||
+ null
+ );
}
-function getDeptNodeKey(node) {
- const k = node?.id ?? node?.value ?? node?.deptId;
- if (k == null || k === "") return null;
- return k;
+function findApplicantTemplateField(fields = []) {
+ return (
+ fields.find((f) => String(f?.label || "").includes("鐢宠浜�")) ||
+ fields.find((f) => f?.type === "select" && f?.optionSource === SELECT_OPTION_SOURCE.USER) ||
+ null
+ );
}
-function isActiveUser(u) {
- if (u.delFlag === "2" || u.delFlag === 2) return false;
- if (u.status == null) return true;
- return String(u.status) === "0";
+function resolveLeaveTimeRange(payload, leaveTimeField) {
+ if (!leaveTimeField?.key) return { start: "", end: "" };
+ const val = payload?.[leaveTimeField.key];
+ if (!Array.isArray(val) || val.length < 2) return { start: "", end: "" };
+ return { start: val[0] || "", end: val[1] || "" };
}
-function userToTreeLeaf(u) {
- return {
- id: String(u.userId ?? u.id),
- label: u.nickName || u.userName || `鐢ㄦ埛${u.userId ?? u.id}`,
- };
-}
-
-function buildUsersByDeptId(users) {
- const map = new Map();
- const unassigned = [];
- for (const u of users) {
- if (!isActiveUser(u)) continue;
- const did = getUserDeptId(u);
- if (did == null || did === "" || did === 0 || did === "0") {
- unassigned.push(u);
- continue;
- }
- const k = String(did);
- if (!map.has(k)) map.set(k, []);
- map.get(k).push(u);
- }
- return { map, unassigned };
-}
-
-function collectUserLabels(nodes, map) {
- (nodes || []).forEach((n) => {
- if (n.children?.length) {
- collectUserLabels(n.children, map);
- } else if (n.id != null && !String(n.id).startsWith("dept_")) {
- map[String(n.id)] = n.label;
- }
- });
-}
-
-function mergeDeptTreeWithUsers(nodes, usersByDept) {
- if (!Array.isArray(nodes)) return [];
- const out = [];
- for (const node of nodes) {
- const deptIdRaw = getDeptNodeKey(node);
- if (deptIdRaw == null) continue;
- const sub = mergeDeptTreeWithUsers(node.children || [], usersByDept);
- const usersHere = usersByDept.get(String(deptIdRaw)) || [];
- const userChildren = usersHere.map(userToTreeLeaf);
- const children = [...sub, ...userChildren];
- if (!children.length) continue;
- out.push({
- id: `dept_${deptIdRaw}`,
- label: node.label ?? node.deptName ?? "閮ㄩ棬",
- disabled: true,
- children,
- });
- }
- return out;
-}
-
-function buildFlatApproverTree(users) {
- const list = users.filter(isActiveUser).map(userToTreeLeaf);
- if (!list.length) return [];
- return [
- {
- id: "dept_all_users",
- label: "绯荤粺鐢ㄦ埛",
- disabled: true,
- children: list,
- },
- ];
-}
-
-const approverTreeData = ref([]);
-const approverLabelMap = ref({});
-
-async function loadApproverTree() {
- try {
- const [deptRes, userRes] = await Promise.all([deptTreeSelect(), userListNoPageByTenantId()]);
- let rawTree = unwrapArray(deptRes);
- rawTree = rawTree.length ? JSON.parse(JSON.stringify(rawTree)) : [];
- let deptTree = filterDisabledDept(JSON.parse(JSON.stringify(rawTree)));
- if (!deptTree.length && rawTree.length) {
- deptTree = JSON.parse(JSON.stringify(rawTree));
- }
- const users = unwrapArray(userRes);
- const { map: usersByDept, unassigned } = buildUsersByDeptId(users);
- let merged = mergeDeptTreeWithUsers(deptTree, usersByDept);
- if (unassigned.length) {
- merged.push({
- id: "dept_unassigned",
- label: "鏈垎閰嶉儴闂�",
- disabled: true,
- children: unassigned.map(userToTreeLeaf),
- });
- }
- if (!merged.length && users.length) {
- merged = buildFlatApproverTree(users);
- }
- approverTreeData.value = merged;
- const map = {};
- collectUserLabels(merged, map);
- approverLabelMap.value = map;
- } catch {
- approverTreeData.value = [];
- approverLabelMap.value = {};
- proxy?.$modal?.msgWarning?.("瀹℃壒浜烘暟鎹姞杞藉け璐ワ紝璇锋鏌ョ綉缁滄垨绋嶅悗閲嶈瘯");
- }
-}
-
-function resolveApproverNames(ids) {
- if (!ids?.length) return "";
- const map = approverLabelMap.value;
- return ids.map((id) => map[String(id)] || id).join("銆�");
-}
-
-function approvalModeLabel(mode) {
- if (mode === "or_sign") return "鎴栫";
- return "涓庣";
-}
-
-function approvalResultLabel(v) {
- if (v === "approved") return "宸查�氳繃";
- if (v === "rejected") return "宸查┏鍥�";
- if (v === "cancelled") return "宸叉挙閿�";
- return "寰呭鎵�";
-}
-
-/** 鎸夎捣姝㈡椂闂磋绠楄鍋囧ぉ鏁帮紙鍚椂鍒嗙锛岀粨鏋滀繚鐣欎袱浣嶅皬鏁帮級 */
function computeLeaveDays(startStr, endStr) {
if (!startStr || !endStr) return null;
const t0 = dayjs(startStr);
@@ -453,18 +169,75 @@
return Math.round(days * 100) / 100;
}
-function formatDuration(v) {
- if (v == null || v === "") return "鈥�";
- return `${v} 澶ー;
+function leaveDurationDisplay(form) {
+ const leaveTimeField = findLeaveTimeTemplateField(form.formFieldDefs);
+ const { start, end } = resolveLeaveTimeRange(form.formPayload, leaveTimeField);
+ const d = computeLeaveDays(start, end);
+ return d == null ? "" : String(d);
}
-function formatBalance(v) {
- if (v == null || v === "") return "鈥�";
- return `${v} 澶ー;
+const searchForm = reactive({
+ applicantKeyword: "",
+ leaveType: "",
+});
+
+function validateLeaveBeforeSave() {
+ const leaveTimeField = findLeaveTimeTemplateField(submitForm.formFieldDefs);
+ const { start, end } = resolveLeaveTimeRange(submitForm.formPayload, leaveTimeField);
+ if (computeLeaveDays(start, end) == null) {
+ ElMessage.warning("璇锋鏌ユā鏉夸腑鐨勮鍋囨椂闂达紝缁撴潫鏃堕棿椤绘櫄浜庡紑濮嬫椂闂�");
+ throw new Error("invalid leave time");
+ }
}
-/** 绯荤粺鐢ㄦ埛缂撳瓨 */
+const mod = useApprovalInstanceModule({
+ moduleKey: APPROVAL_MODULE_KEYS.LEAVE,
+ beforeSave: validateLeaveBeforeSave,
+ extraFormRules: {
+ leaveBalanceDays: [{ required: true, message: "璇峰～鍐欏亣鏈熶綑棰�", trigger: "blur" }],
+ },
+});
+
+const {
+ tableData,
+ tableLoading,
+ page,
+ detailDialog,
+ detailRow,
+ submitDialog,
+ submitEditRow,
+ submitForm,
+ submitFormRef,
+ submitSaving,
+ isSubmitEdit,
+ activeTemplate,
+ submitFormFields,
+ submitFormRules,
+ submitDialogTitle,
+ templateBindVisible,
+ handleQuery,
+ initModuleList,
+ pagination,
+ openAddWithTemplate,
+ onTemplateBound,
+ onTemplateBindClosed,
+ openEditFromDetail,
+ submitInstanceForm,
+ buildTableActions,
+} = mod;
+
+const { flowUserOptions, loadFlowUsers } = useFlowUserOptions();
const allUsersCache = ref([]);
+
+const applicantTemplateField = computed(() =>
+ findApplicantTemplateField(submitForm.formFieldDefs)
+);
+
+function unwrapArray(payload) {
+ if (Array.isArray(payload)) return payload;
+ if (payload && Array.isArray(payload.data)) return payload.data;
+ return [];
+}
async function loadUserPool() {
try {
@@ -475,426 +248,56 @@
}
}
-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) {
- if (id == null || id === "") return undefined;
- return allUsersCache.value.find((u) => String(u.userId ?? u.id) === String(id));
-}
-
-function applicantNoFromUser(u) {
- if (!u) return "";
- return (
- u.userName ??
- u.userCode ??
- u.jobNumber ??
- u.workNo ??
- (u.userId != null ? String(u.userId) : "")
- );
-}
-
-/** 鏈湴妯℃嫙锛氭牴鎹敤鎴风敓鎴愮ǔ瀹氥�屽亣鏈熶綑棰濄�嶅崰浣� */
-function mockLeaveBalance(u) {
- if (!u) return undefined;
- const idStr = String(u.userId ?? u.id ?? "0");
- let s = 0;
- for (let i = 0; i < idStr.length; i++) s += idStr.charCodeAt(i);
- return Math.round(((s % 130) / 10 + 5) * 100) / 100;
-}
-
-function filterUsersByQuery(query) {
- const list = allUsersCache.value.filter((u) => isActiveUser(u));
- const q = (query || "").trim().toLowerCase();
- if (!q) return [...list];
- return list.filter((u) => {
- const nick = (u.nickName || "").toLowerCase();
- const uname = (u.userName || "").toLowerCase();
- const phone = (u.phonenumber || u.phone || "").toString();
- return nick.includes(q) || uname.includes(q) || phone.includes(q);
- });
-}
-
-const applicantFormSearchLoading = ref(false);
-const applicantFormOptions = ref([]);
-
-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.applicantName = u.nickName || u.userName || "";
- form.applicantNo = applicantNoFromUser(u);
- form.leaveBalanceDays = mockLeaveBalance(u);
- } else {
- form.applicantName = "";
- form.applicantNo = "";
- form.leaveBalanceDays = undefined;
- }
-}
-
-/** 鏈湴妯℃嫙鍒楄〃鏁版嵁 */
-const allRows = ref([
- {
- id: "1",
- applicantId: "mock_1",
- applicantNo: "zhangsan",
- applicantName: "寮犱笁",
- leaveType: "annual",
- leaveBalanceDays: 12,
- leaveStartTime: "2026-05-10 09:00:00",
- leaveEndTime: "2026-05-12 18:00:00",
- leaveDurationDays: 2.38,
- leaveReason: "骞翠紤鍋囪繑涔℃帰浜层��",
- approvalMode: "parallel",
- approverIds: [],
- approverNames: "",
- approvalResult: "pending",
- attachmentList: [{ name: "杞︾エ璁㈠崟.pdf" }],
- createTime: "2026-05-09 10:20:00",
- },
- {
- id: "2",
- applicantId: "mock_2",
- applicantNo: "lisi",
- applicantName: "鏉庡洓",
- leaveType: "sick",
- leaveBalanceDays: 0,
- leaveStartTime: "2026-05-14 08:30:00",
- leaveEndTime: "2026-05-14 12:00:00",
- leaveDurationDays: 0.15,
- leaveReason: "涓婂崍闂ㄨ瘖澶嶆煡銆�",
- approvalMode: "or_sign",
- approverIds: [],
- approverNames: "",
- approvalResult: "approved",
- attachmentList: [],
- createTime: "2026-05-13 16:00:00",
- },
-]);
-
-const searchForm = reactive({
- applicantKeyword: "",
- leaveType: "",
-});
-
-const tableLoading = ref(false);
-const page = reactive({
- current: 1,
- size: 10,
- total: 0,
-});
-
-const filteredList = computed(() => {
- let list = [...allRows.value];
- const kw = (searchForm.applicantKeyword || "").trim().toLowerCase();
- if (kw) {
- list = list.filter((r) => {
- const name = (r.applicantName || "").toLowerCase();
- const no = (r.applicantNo || "").toLowerCase();
- return name.includes(kw) || no.includes(kw);
- });
- }
- if (searchForm.leaveType) {
- list = list.filter((r) => r.leaveType === searchForm.leaveType);
- }
- 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;
+ () => submitDialog.visible,
+ (v) => {
+ if (!v) return;
+ if (submitForm.leaveBalanceDays == null && isSubmitEdit.value) {
+ submitForm.leaveBalanceDays =
+ submitEditRow.value?.formPayload?.leaveBalanceDays ??
+ submitEditRow.value?.leaveBalanceDays;
}
- },
- { immediate: true }
+ if (submitForm.leaveBalanceDays == null && !isSubmitEdit.value) {
+ submitForm.leaveBalanceDays = undefined;
+ }
+ }
);
-const tableData = computed(() => {
- const list = filteredList.value;
- const start = (page.current - 1) * page.size;
- return list.slice(start, start + page.size);
-});
-
-const tableColumn = ref([
- { label: "鐢宠浜虹紪鍙�", prop: "applicantNo", width: 120 },
- { label: "鐢宠浜�", prop: "applicantName", minWidth: 100 },
- {
- label: "璇峰亣绫诲瀷",
- prop: "leaveType",
- width: 100,
- formatData: (v) => leaveTypeLabel(v),
+watch(
+ () => {
+ const key = applicantTemplateField.value?.key;
+ return key ? submitForm.formPayload[key] : undefined;
},
- {
- label: "璇峰亣鏃堕暱",
- prop: "leaveDurationDays",
- width: 120,
- formatData: (v) => (v == null || v === "" ? "鈥�" : `${v} 澶ー),
- },
- { label: "璇峰亣浜嬬敱", prop: "leaveReason", minWidth: 180 },
- { label: "鍒涘缓鏃堕棿", prop: "createTime", width: 170 },
- {
- label: "瀹℃壒缁撴灉",
- prop: "approvalResult",
- width: 110,
- dataType: "tag",
- formatData: (v) => approvalResultLabel(v),
- formatType: (v) => {
- if (v === "approved") return "success";
- if (v === "rejected") return "danger";
- if (v === "cancelled") return "info";
- return "warning";
- },
- },
- {
- dataType: "action",
- label: "鎿嶄綔",
- align: "center",
- fixed: "right",
- width: 220,
- operation: [
- {
- name: "缂栬緫",
- type: "text",
- clickFun: (row) => openFormDialog("edit", row),
- },
- {
- name: "鏌ョ湅璇︽儏",
- type: "text",
- clickFun: (row) => openDetail(row),
- },
- {
- name: "闄勪欢",
- type: "text",
- clickFun: (row) => openFiles(row),
- },
- ],
- },
-]);
+ async (uid) => {
+ if (!applicantTemplateField.value || !uid) return;
+ if (!allUsersCache.value.length) await loadUserPool();
+ }
+);
-const formDialog = reactive({
- visible: false,
- title: "",
- mode: "add",
-});
-const formRef = ref();
-const form = reactive(createEmptyForm());
+const tableColumn = buildInstanceTableColumns(tableData, buildTableActions);
-const leaveDurationDisplay = computed(() => {
- const d = computeLeaveDays(form.leaveStartTime, form.leaveEndTime);
- return d == null ? "" : String(d);
-});
-
-function onLeaveRangeChange() {
- nextTick(() => {
- formRef.value?.validateField?.("leaveEndTime");
- });
-}
-
-const formRules = {
- applicantId: [{ required: true, message: "璇烽�夋嫨鐢宠浜�", trigger: "change" }],
- leaveType: [{ required: true, message: "璇烽�夋嫨璇峰亣绫诲瀷", trigger: "change" }],
- leaveBalanceDays: [
- {
- required: true,
- message: "璇峰～鍐欏亣鏈熶綑棰�",
- trigger: "blur",
- },
- ],
- leaveStartTime: [{ required: true, message: "璇烽�夋嫨璇峰亣寮�濮嬫椂闂�", trigger: "change" }],
- leaveEndTime: [
- { required: true, message: "璇烽�夋嫨璇峰亣缁撴潫鏃堕棿", trigger: "change" },
- {
- validator: (_rule, val, callback) => {
- if (!form.leaveStartTime || !val) {
- callback();
- return;
- }
- const d = computeLeaveDays(form.leaveStartTime, val);
- if (d == null) {
- callback(new Error("缁撴潫鏃堕棿椤绘櫄浜庡紑濮嬫椂闂�"));
- } else {
- callback();
- }
- },
- trigger: "change",
- },
- ],
- leaveReason: [{ required: true, message: "璇峰～鍐欒鍋囦簨鐢�", trigger: "blur" }],
- approvalMode: [{ required: true, message: "璇烽�夋嫨瀹℃壒鏂瑰紡", trigger: "change" }],
- approverIds: [
- {
- type: "array",
- required: true,
- message: "璇烽�夋嫨瀹℃壒浜�",
- trigger: "change",
- },
- ],
-};
-
-const detailDialog = reactive({ visible: false });
-const detailRow = ref({});
-
-const filesDialog = reactive({ visible: false, row: null });
-
-function handleQuery() {
- page.current = 1;
- tableLoading.value = true;
- setTimeout(() => {
- tableLoading.value = false;
- }, 150);
+function onSearch() {
+ handleQuery(searchForm);
}
function resetSearch() {
searchForm.applicantKeyword = "";
searchForm.leaveType = "";
- handleQuery();
+ onSearch();
}
-function pagination(obj) {
- page.current = obj.page;
- page.size = obj.limit;
+function onPagination(obj) {
+ pagination(obj, searchForm);
}
-function openDetail(row) {
- detailRow.value = { ...row };
- detailDialog.visible = true;
+async function onSubmit() {
+ const ok = await submitInstanceForm({ skipValidate: true });
+ if (ok) ElMessage.success(isSubmitEdit.value ? "淇敼鎴愬姛" : "鎻愪氦鎴愬姛");
}
-function openFiles(row) {
- filesDialog.row = row;
- filesDialog.visible = true;
-}
-
-function mockDownload(row) {
- const url = row.url || row.downloadURL || row.previewURL || row.previewUrl;
- if (url) {
- window.open(url, "_blank");
- return;
- }
- proxy?.$modal?.msgSuccess?.(`宸叉ā鎷熶笅杞斤細${row.name}`);
-}
-
-async function openFormDialog(mode, row) {
- formDialog.mode = mode;
- formDialog.title = mode === "add" ? "鏂板璇峰亣鐢宠" : "缂栬緫璇峰亣鐢宠";
- await loadApproverTree();
- if (!allUsersCache.value.length) {
- await loadUserPool();
- }
- Object.assign(form, createEmptyForm());
- if (mode === "edit" && row) {
- Object.assign(form, {
- id: row.id,
- applicantId: row.applicantId,
- applicantNo: row.applicantNo,
- applicantName: row.applicantName,
- leaveType: row.leaveType,
- leaveBalanceDays: row.leaveBalanceDays,
- leaveStartTime: row.leaveStartTime,
- leaveEndTime: row.leaveEndTime,
- leaveReason: row.leaveReason,
- approvalMode: row.approvalMode === "countersign" ? "or_sign" : row.approvalMode || "parallel",
- approverIds: (row.approverIds || []).map((id) => String(id)),
- approverNames: row.approverNames,
- attachmentList: JSON.parse(JSON.stringify(row.attachmentList || [])),
- });
- const u = userById(row.applicantId);
- if (u) {
- applicantFormOptions.value = [u];
- } else if (row.applicantId) {
- applicantFormOptions.value = [
- {
- userId: row.applicantId,
- nickName: row.applicantName,
- userName: row.applicantNo,
- },
- ];
- }
- } else {
- remoteSearchApplicantForm("");
- }
- formDialog.visible = true;
- nextTick(() => formRef.value?.clearValidate?.());
-}
-
-function onFormClosed() {
- formRef.value?.resetFields?.();
-}
-
-async function submitForm() {
- try {
- await formRef.value?.validate?.();
- } catch {
- return;
- }
- const days = computeLeaveDays(form.leaveStartTime, form.leaveEndTime);
- if (days == null) {
- proxy?.$modal?.msgWarning?.("璇锋鏌ヨ鍋囪捣姝㈡椂闂达紝缁撴潫鏃堕棿椤绘櫄浜庡紑濮嬫椂闂�");
- return;
- }
- form.approverNames = resolveApproverNames(form.approverIds);
- const payload = {
- applicantId: form.applicantId,
- applicantNo: form.applicantNo,
- applicantName: form.applicantName,
- leaveType: form.leaveType,
- leaveBalanceDays: form.leaveBalanceDays,
- leaveStartTime: form.leaveStartTime,
- leaveEndTime: form.leaveEndTime,
- leaveDurationDays: days,
- leaveReason: form.leaveReason,
- approvalMode: form.approvalMode,
- approverIds: [...form.approverIds],
- approverNames: form.approverNames,
- attachmentList: JSON.parse(JSON.stringify(form.attachmentList || [])),
- };
- if (formDialog.mode === "add") {
- const id = `local_${Date.now()}`;
- allRows.value.unshift({
- id,
- ...payload,
- approvalResult: "pending",
- createTime: dayjs().format("YYYY-MM-DD HH:mm:ss"),
- });
- 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,
- id: form.id,
- ...payload,
- approvalResult: prev.approvalResult ?? "pending",
- createTime: prev.createTime ?? dayjs().format("YYYY-MM-DD HH:mm:ss"),
- };
- }
- proxy?.$modal?.msgSuccess?.("淇濆瓨鎴愬姛锛堟湰鍦版ā鎷燂級");
- }
- formDialog.visible = false;
- handleQuery();
-}
-
-onMounted(() => {
- loadApproverTree();
+onMounted(async () => {
+ loadFlowUsers();
+ await initModuleList(searchForm);
});
</script>
@@ -912,23 +315,5 @@
.search_title {
font-size: 14px;
color: var(--el-text-color-regular);
-}
-.upload-block {
- width: 100%;
-}
-.mr6 {
- margin-right: 6px;
-}
-.mb6 {
- margin-bottom: 6px;
-}
-.leave-apply-form :deep(.el-row) {
- margin-bottom: 0;
-}
-.leave-apply-form :deep(.el-form-item) {
- margin-bottom: 18px;
-}
-.leave-apply-form-dialog :deep(.el-dialog__body) {
- padding-top: 12px;
}
</style>
--
Gitblit v1.9.3