yuanlin/OnboardXFront
2
0
Fork 0
Code Pull Requests Actions Releases Activity

新增必填项验证

Browse Source
This commit is contained in:
fuenmao
2026-09-17 14:33:55 +08:00
parent 04c621961c
commit 7cffe57e4d
3 changed files with 270 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/biz/onboarding/task/index.vue
+196 -18
View File
@@ -541,38 +541,75 @@
</el-dialog>
<!-- 任务创建成功与分享弹窗 -->
<el-dialog v-model="shareVisible" title="入职任务已创建" width="560px" destroy-on-close>
<el-result icon="success" title="任务创建成功！" sub-title="请先确认签署材料人事参数，再将专属链接发送给候选人">
<el-dialog
v-model="shareVisible"
title="入职任务已创建"
width="600px"
destroy-on-close
class="task-share-dialog"
>
<el-result
icon="success"
title="任务创建成功！"
sub-title="请先确认签署材料人事参数，再将专属链接发送给候选人"
class="task-share-result"
>
<template #extra>
<div class="share-box">
<div class="share-item">
<span class="share-label">任务编号：</span>
<span class="share-value font-bold">{{ createdTaskInfo?.taskNo }}</span>
<div class="share-card">
<div class="share-info-header">
<div class="share-meta-item">
<span class="share-meta-label">任务编号</span>
<span class="share-meta-val font-mono">{{ createdTaskInfo?.taskNo }}</span>
</div>
<div v-if="createdTaskInfo?.positionName" class="share-meta-item text-right">
<span class="share-meta-label">入职岗位</span>
<span class="share-meta-val">{{ createdTaskInfo.positionName }}</span>
</div>
</div>
<div class="share-item">
<span class="share-label">专属链接：</span>
<el-input :model-value="createdTaskInfo?.linkUrl" readonly size="small">
<div class="share-link-section">
<div class="share-section-title">专属填报链接</div>
<el-input
:model-value="createdTaskInfo?.linkUrl"
readonly
class="share-link-input"
>
<template #append>
<el-button icon="CopyDocument" @click="copyText(createdTaskInfo?.linkUrl, '专属链接已复制')">
复制
<el-button
type="primary"
icon="CopyDocument"
@click="copyText(createdTaskInfo?.linkUrl, '专属链接已复制')"
>
复制链接
</el-button>
</template>
</el-input>
</div>
<div class="share-item">
<span class="share-label">有效期至：</span>
<span class="share-value text-secondary">{{ createdTaskInfo?.expiresAt }}</span>
<div class="share-expiry-row">
<el-icon class="expiry-icon"><Clock /></el-icon>
<span>链接有效期至：</span>
<span class="expiry-time">{{ createdTaskInfo?.expiresAt }}</span>
</div>
<div class="share-actions">
<el-button type="primary" plain icon="ChatDotRound" @click="copyInviteMessage">
复制短信/微信邀请文案
<div class="share-action-section">
<el-button
type="primary"
plain
icon="ChatDotRound"
class="invite-copy-btn"
@click="copyInviteMessage"
>
复制短信 / 微信邀请文案
</el-button>
</div>
</div>
</template>
</el-result>
<template #footer>
<el-button type="primary" @click="shareVisible = false">完成</el-button>
<div class="dialog-footer-center">
<el-button type="primary" @click="shareVisible = false">完成</el-button>
</div>
</template>
</el-dialog>
@@ -4159,4 +4196,145 @@ onMounted(loadCompanies);
justify-content: flex-start;
}
}
/* 任务创建分享弹窗样式优化 */
.task-share-result {
padding: 12px 0 4px 0;
}
.task-share-result :deep(.el-result__icon svg) {
width: 56px;
height: 56px;
}
.task-share-result :deep(.el-result__title) {
margin-top: 10px;
font-size: 18px;
font-weight: 600;
color: #1e293b;
}
.task-share-result :deep(.el-result__subtitle) {
margin-top: 6px;
font-size: 13px;
color: #64748b;
line-height: 1.5;
}
.task-share-result :deep(.el-result__extra) {
margin-top: 20px;
width: 100%;
}
.share-card {
width: 100%;
max-width: 500px;
margin: 0 auto;
background: #f8fafc;
border: 1px solid #e2e8f0;
border-radius: 12px;
padding: 18px 22px;
box-sizing: border-box;
text-align: left;
}
.share-info-header {
display: flex;
justify-content: space-between;
align-items: flex-start;
padding-bottom: 12px;
margin-bottom: 16px;
border-bottom: 1px dashed #cbd5e1;
}
.share-meta-item {
display: flex;
flex-direction: column;
gap: 4px;
}
.share-meta-label {
font-size: 12px;
color: #94a3b8;
font-weight: 500;
}
.share-meta-val {
font-size: 14px;
color: #1e293b;
font-weight: 600;
}
.share-link-section {
margin-bottom: 14px;
}
.share-section-title {
font-size: 12px;
font-weight: 500;
color: #64748b;
margin-bottom: 8px;
}
.share-link-input :deep(.el-input__inner) {
font-size: 13px;
color: #334155;
background-color: #ffffff;
}
.share-link-input :deep(.el-input-group__append) {
background-color: #eff6ff;
color: #2563eb;
font-weight: 500;
border-color: #dbeafe;
cursor: pointer;
transition: all 0.2s;
padding: 0 16px;
}
.share-link-input :deep(.el-input-group__append:hover) {
background-color: #dbeafe;
}
.share-expiry-row {
display: flex;
align-items: center;
font-size: 12px;
color: #64748b;
margin-bottom: 16px;
padding: 8px 12px;
background: #ffffff;
border: 1px solid #f1f5f9;
border-radius: 6px;
}
.expiry-icon {
margin-right: 6px;
color: #94a3b8;
font-size: 14px;
}
.expiry-time {
color: #e11d48;
font-weight: 600;
margin-left: 2px;
}
.share-action-section {
width: 100%;
}
.invite-copy-btn {
width: 100%;
height: 40px;
font-size: 13px;
font-weight: 500;
border-radius: 8px;
}
.dialog-footer-center {
display: flex;
justify-content: center;
width: 100%;
}
</style>