This commit is contained in:
fuenmao
2026-08-28 17:32:47 +08:00
parent 14515ccdd6
commit e2697b4bdb
9 changed files with 249 additions and 174 deletions
+26 -26
View File
@@ -8,7 +8,7 @@
<span>OnboardX 智能入职服务</span>
</div>
<h1 class="brand-title">欢迎加入新团队</h1>
<p class="brand-subtitle">请按照 4 步指引完成入职登记表、证件上传与合同查阅确认</p>
<p class="brand-subtitle">请按照 4 步指引完成入职登记表、证件上传与签署材料查阅确认</p>
</div>
</header>
@@ -60,16 +60,16 @@
<div class="steps-wrapper desktop-only">
<el-steps :active="currentStep" finish-status="success" align-center>
<el-step title="入职登记表" icon="User" />
<el-step title="合同补充项" icon="Document" />
<el-step title="材料补充项" icon="Document" />
<el-step title="证件材料" icon="FolderChecked" />
<el-step title="合同确认" icon="Tickets" />
<el-step title="材料确认" icon="Tickets" />
</el-steps>
</div>
<div class="mobile-steps-wrapper mobile-only">
<div class="mobile-steps-track">
<div
v-for="(stepName, index) in ['1. 登记表', '2. 补充项', '3. 证件材料', '4. 合同确认']"
v-for="(stepName, index) in ['1. 登记表', '2. 补充项', '3. 证件材料', '4. 材料确认']"
:key="index"
class="mobile-step-item"
:class="{
@@ -83,7 +83,7 @@
</div>
</div>
<div class="mobile-current-indicator">
当前进行:<span class="highlight-step">第 {{ currentStep + 1 }}/4 步 · {{ ['入职登记表填写', '合同专有补充项', '证件材料上传', '合同查阅与确认'][currentStep] }}</span>
当前进行:<span class="highlight-step">第 {{ currentStep + 1 }}/4 步 · {{ ['入职登记表填写', '签署材料补充项', '证件材料上传', '签署材料查阅与确认'][currentStep] }}</span>
</div>
</div>
@@ -419,21 +419,21 @@
<!-- 步骤 2: 合同专属增量补充项 (自适应差集) -->
<div v-show="currentStep === 1" class="step-content">
<div class="section-header">
<h3 class="section-title">合同专属补充信息</h3>
<p class="section-desc">以下是本次签署合同中特殊约定的增量字段,登记表未涵盖的项需在此补充确认</p>
<h3 class="section-title">签署材料专属补充信息</h3>
<p class="section-desc">以下是本次签署材料中特殊约定的增量字段,登记表未涵盖的项需在此补充确认</p>
</div>
<div v-if="!extraVariables.length" class="all-covered-card">
<el-result
icon="success"
title="个人信息已完整覆盖"
sub-title="您在《入职登记表》中填写的姓名、身份证、电话、银行卡等信息已完整满足本次合同签署所需,无需额外补充!"
sub-title="您在《入职登记表》中填写的姓名、身份证、电话、银行卡等信息已完整满足本次签署材料所需,无需额外补充!"
/>
</div>
<el-form v-else label-position="top" class="extra-form">
<el-alert
title="请补充填写以下合同专有信息:"
title="请补充填写以下签署材料专有信息:"
type="info"
show-icon
:closable="false"
@@ -568,21 +568,21 @@
<!-- 步骤 4: 合同查阅与签署 -->
<div v-show="currentStep === 3" class="step-content">
<div class="section-header">
<h3 class="section-title">入职合同查阅与确认</h3>
<p class="section-desc">系统已为您代入真实登记信息生成专属合同,请认真查阅条款并勾选确认</p>
<h3 class="section-title">入职签署材料查阅与确认</h3>
<p class="section-desc">系统已为您代入真实登记信息生成专属签署材料,请认真查阅条款并勾选确认</p>
</div>
<el-alert
v-if="preparingContract"
class="contract-preparing-alert"
title="正在生成您的专属合同"
title="正在生成您的专属签署材料"
:description="contractPreparingDescription"
type="info"
show-icon
:closable="false"
/>
<el-empty v-if="!contracts.length" description="暂无待签署入职合同" />
<el-empty v-if="!contracts.length" description="暂无待确认签署材料" />
<div v-else class="contracts-list">
<div
@@ -599,7 +599,7 @@
</el-tag>
</div>
<div class="contract-desc">
请点击下方按钮下载/查阅带您专属信息的合同全文,仔细核对您的基本信息与薪资条款。
请点击下方按钮下载/查阅带您专属信息的签署材料全文,仔细核对您的基本信息与条款内容。
</div>
</div>
@@ -638,7 +638,7 @@
v-if="canEdit && isContractPrepared(c.id) && !c.hasViewed"
class="contract-view-hint"
>
请先点击“下载并查看合同”,查看后才能勾选确认。
请先点击“下载并查看签署材料”,查看后才能勾选确认。
</div>
</div>
</div>
@@ -772,7 +772,7 @@ const contractPreparingDescription = computed(() => {
}
const index = contracts.value.findIndex(item => item.id === contract.id);
return `正在校验合同信息并生成第 ${index + 1}/${contracts.value.length} 份《${contract.contractName}》,请稍候,不要关闭页面。`;
return `正在校验材料信息并生成第 ${index + 1}/${contracts.value.length} 份《${contract.contractName}》,请稍候,不要关闭页面。`;
});
// 计算差集增量变量 (合同需要的 employee. 变量中,登记表没有的字段)
@@ -1091,15 +1091,15 @@ function isContractPrepareFailed(taskContractId: number) {
function getContractActionText(taskContractId: number) {
const status = getContractPrepareStatus(taskContractId);
if (status === "preparing") {
return "正在准备合同";
return "正在准备签署材料";
}
if (status === "error") {
return "重新准备合同";
return "重新准备签署材料";
}
if (status === "ready") {
return "下载并查看合同";
return "下载并查看签署材料";
}
return "等待准备合同";
return "等待准备签署材料";
}
/**
@@ -1126,7 +1126,7 @@ async function prepareContract(contract: any) {
contractPrepareStatus[key] = "ready";
return true;
} catch (err: any) {
const message = err?.msg || err?.message || "合同准备失败,请稍后重试";
const message = err?.msg || err?.message || "签署材料准备失败,请稍后重试";
contractPrepareStatus[key] = "error";
contractPrepareErrors[key] = message;
// 业务异常已由统一请求拦截器提示;仅为网络等非标准异常补充提示,避免重复弹窗。
@@ -1150,7 +1150,7 @@ async function handleContractAction(contract: any) {
if (isContractPrepareFailed(contract.id)) {
const prepared = await prepareContract(contract);
if (prepared) {
ElMessage.success("合同已重新准备完成,请再次点击下载查看");
ElMessage.success("签署材料已重新准备完成,请再次点击下载查看");
}
return;
}
@@ -1179,21 +1179,21 @@ function previewAndDownloadContract(c: any) {
async function submitAll() {
const unprepared = contracts.value.filter(c => !isContractPrepared(c.id));
if (unprepared.length) {
return ElMessage.warning(`请先等待合同准备完成:${unprepared.map(c => c.contractName).join("、")}`);
return ElMessage.warning(`请先等待签署材料准备完成:${unprepared.map(c => c.contractName).join("、")}`);
}
const unviewed = contracts.value.filter(c => !c.hasViewed);
if (unviewed.length) {
return ElMessage.warning(`请先下载并查看合同:${unviewed.map(c => c.contractName).join("、")}`);
return ElMessage.warning(`请先下载并查看签署材料:${unviewed.map(c => c.contractName).join("、")}`);
}
const unconfirmed = contracts.value.filter(c => !c.isAgreed);
if (unconfirmed.length) {
return ElMessage.warning(`请先勾选同意全部合同(未勾选:${unconfirmed.map(c => c.contractName).join("、")})`);
return ElMessage.warning(`请先勾选同意全部签署材料(未勾选:${unconfirmed.map(c => c.contractName).join("、")})`);
}
const confirmed = await isMessageBoxConfirmed(
ElMessageBox.confirm("确认提交全部入职资料与合同确认?提交后将进入人事复核建档流程。", "最终提交确认", {
ElMessageBox.confirm("确认提交全部入职资料与签署材料确认?提交后将进入人事复核建档流程。", "最终提交确认", {
type: "success",
confirmButtonText: "确认提交",
cancelButtonText: "再检查一下"