完善第三方签署

2026-09-08 17:48:42 +08:00
parent 802d9cde89
commit 709e02a04f
5 changed files with 489 additions and 83 deletions
@@ -119,6 +119,13 @@ export interface OnboardingElectronicSignDocument {
  documentSort: number;
  originalDocxFileId?: number;
  signedPdfFileId?: number;
+  employeeSignedPreviewed: boolean;
+}
+
+/** 员工已签、企业未盖章文件的契约锁只读预览。 */
+export interface OnboardingElectronicSignPreview {
+  signDocumentId: number;
+  previewUrl: string;
 }

 /** 管理端查看的入职电子签流程详情。 */
@@ -188,6 +195,8 @@ export interface OnboardingCompany extends OnboardingCompanyOption {
  legalRepresentative?: string;
  registeredAddress?: string;
  contactPhone?: string;
+  qiyuesuoCategoryId?: string;
+  qiyuesuoSealId?: string;
  remark?: string;
  status: string;
 }
@@ -476,6 +485,21 @@ export const onboardingTaskApi = {
    });
  },

+  /** 获取一份员工已签合同的契约锁只读浏览页面。 */
+  previewEmployeeSignedDocument(taskId: number, signDocumentId: number) {
+    return electronicSignHttp.post<OnboardingElectronicSignPreview>(
+      "preview-employee-signed",
+      { taskId, signDocumentId }
+    );
+  },
+
+  /** 全部合同核对完成后，由后台管理员确认企业盖章。 */
+  companySealElectronicSign(taskId: number) {
+    return electronicSignHttp.post<OnboardingElectronicSignDetail>("company-seal", {
+      taskId
+    });
+  },
+
  /** 催办当前待签员工。 */
  noticeElectronicSign(taskId: number) {
    return electronicSignHttp.post("notice", { taskId });
@@ -75,20 +75,22 @@
          </template>
        </el-table-column>

-        <el-table-column prop="remark" label="说明备注" min-width="200" show-overflow-tooltip />
+        <el-table-column prop="remark" label="说明备注" min-width="140" show-overflow-tooltip />

-        <el-table-column label="操作" width="140" align="center" fixed="right">
+        <el-table-column label="操作" width="160" align="center" fixed="right">
          <template #default="{ row }">
-            <el-button link type="primary" icon="Edit" @click="openEdit(row)">编辑</el-button>
-            <el-button
-              v-if="!row.isBuiltIn"
-              link
-              type="danger"
-              icon="Delete"
-              @click="remove(row)"
-            >
-              删除
-            </el-button>
+            <div style="display: flex; align-items: center; justify-content: center; gap: 8px; white-space: nowrap;">
+              <el-button link type="primary" icon="Edit" @click="openEdit(row)">编辑</el-button>
+              <el-button
+                v-if="!row.isBuiltIn"
+                link
+                type="danger"
+                icon="Delete"
+                @click="remove(row)"
+              >
+                删除
+              </el-button>
+            </div>
          </template>
        </el-table-column>
      </el-table>
@@ -1,4 +1,4 @@
-<template>
+<template>
  <div class="main-box setup-container">
    <el-tabs v-model="activeTab" class="setup-tabs">
      <!-- 1. 入职公司管理 -->
@@ -23,6 +23,15 @@
              </el-tag>
            </template>

+            <template #qiyuesuoConfig="scope">
+              <el-tag
+                size="small"
+                :type="scope.row.qiyuesuoCategoryId && scope.row.qiyuesuoSealId ? 'success' : 'warning'"
+              >
+                {{ scope.row.qiyuesuoCategoryId && scope.row.qiyuesuoSealId ? "已配置" : "未配置" }}
+              </el-tag>
+            </template>
+
            <template #operation="scope">
              <el-button link type="primary" icon="Edit" @click="openCompanyEdit(scope.row)">
                编辑
@@ -130,50 +139,62 @@
    <el-dialog
      v-model="dialogVisible"
      :title="dialogTitle"
-      width="680px"
+      width="820px"
+      top="6vh"
      destroy-on-close
      append-to-body
    >
      <!-- 1. 公司表单 -->
-      <el-form v-if="dialogKind === 'company'" :model="companyForm" label-width="140px">
+      <el-form
+        v-if="dialogKind === 'company'"
+        ref="companyFormRef"
+        :model="companyForm"
+        :rules="companyRules"
+        label-width="140px"
+      >
        <el-row :gutter="20">
          <el-col :span="12">
-            <el-form-item label="公司编码" required>
-              <el-input v-model="companyForm.companyCode" placeholder="如：TECH_CORP" />
+            <el-form-item label="公司编码" prop="companyCode">
+              <el-input v-model.trim="companyForm.companyCode" placeholder="如：TECH_CORP" clearable />
            </el-form-item>
          </el-col>
          <el-col :span="12">
-            <el-form-item label="公司简称/名称" required>
-              <el-input v-model="companyForm.companyName" placeholder="如：总公司 / 科技分部" />
+            <el-form-item label="公司简称/名称" prop="companyName">
+              <el-input v-model.trim="companyForm.companyName" placeholder="如：总公司 / 科技分部" clearable />
            </el-form-item>
          </el-col>
        </el-row>

-        <el-form-item label="签署材料甲方全称" required>
-          <el-input v-model="companyForm.legalName" placeholder="用于签署材料填写的法定主体全称" />
+        <el-form-item label="签署材料甲方全称" prop="legalName">
+          <el-input v-model.trim="companyForm.legalName" placeholder="必须与契约锁中的企业名称完全一致" clearable />
        </el-form-item>

        <el-row :gutter="20">
          <el-col :span="12">
-            <el-form-item label="统一社会信用代码">
-              <el-input v-model="companyForm.unifiedSocialCreditCode" placeholder="18位统一信用代码" />
+            <el-form-item label="统一社会信用代码" prop="unifiedSocialCreditCode">
+              <el-input
+                v-model.trim="companyForm.unifiedSocialCreditCode"
+                placeholder="18位统一社会信用代码"
+                maxlength="18"
+                clearable
+              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
-            <el-form-item label="法定代表人">
-              <el-input v-model="companyForm.legalRepresentative" placeholder="法定代表人姓名" />
+            <el-form-item label="法定代表人" prop="legalRepresentative">
+              <el-input v-model.trim="companyForm.legalRepresentative" placeholder="法定代表人姓名" clearable />
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="12">
-            <el-form-item label="联系电话">
-              <el-input v-model="companyForm.contactPhone" placeholder="企业联系电话" />
+            <el-form-item label="联系电话" prop="contactPhone">
+              <el-input v-model.trim="companyForm.contactPhone" placeholder="企业联系电话（手机或固话）" clearable />
            </el-form-item>
          </el-col>
          <el-col :span="12">
-            <el-form-item label="状态" required>
+            <el-form-item label="状态" prop="status">
              <el-select v-model="companyForm.status" class="w-full">
                <el-option label="启用" value="enable" />
                <el-option label="停用" value="disable" />
@@ -182,13 +203,34 @@
          </el-col>
        </el-row>

-        <el-form-item label="注册地址">
-          <el-input v-model="companyForm.registeredAddress" placeholder="企业法定注册地址" />
+        <el-form-item label="注册地址" prop="registeredAddress">
+          <el-input v-model.trim="companyForm.registeredAddress" placeholder="企业法定注册地址" clearable />
        </el-form-item>

-        <el-form-item label="备注">
-          <el-input v-model="companyForm.remark" type="textarea" :rows="2" placeholder="备注信息" />
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="companyForm.remark" type="textarea" :rows="2" placeholder="备注信息（选填）" />
        </el-form-item>
+
+        <el-divider content-position="left">契约锁电子签配置（由技术人员添加）</el-divider>
+        <el-alert
+          title="说明：默认业务分类 Id 与企业印章 Id 由技术人员添加配置，非技术人员请勿随意修改。"
+          type="info"
+          :closable="false"
+          show-icon
+          style="margin-bottom: 18px"
+        />
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="默认业务分类 Id" prop="qiyuesuoCategoryId">
+              <el-input v-model.trim="companyForm.qiyuesuoCategoryId" placeholder="契约锁当前公司的分类 Id" clearable />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="企业印章 Id" prop="qiyuesuoSealId">
+              <el-input v-model.trim="companyForm.qiyuesuoSealId" placeholder="契约锁当前公司的印章 Id" clearable />
+            </el-form-item>
+          </el-col>
+        </el-row>
      </el-form>

      <!-- 2. 部门表单 -->
@@ -322,8 +364,8 @@
 </template>

 <script setup lang="ts" name="onboardingSetup">
-import { ref, reactive, computed, onMounted } from "vue";
-import { ElMessage, ElMessageBox } from "element-plus";
+import { ref, reactive, computed, onMounted, nextTick } from "vue";
+import { ElMessage, ElMessageBox, type FormInstance, type FormRules } from "element-plus";
 import { Plus, Edit, Delete } from "@element-plus/icons-vue";
 import {
  onboardingTaskApi,
@@ -370,6 +412,8 @@ const emptyCompany = (): Partial<OnboardingCompany> => ({
  legalRepresentative: "",
  registeredAddress: "",
  contactPhone: "",
+  qiyuesuoCategoryId: "",
+  qiyuesuoSealId: "",
  status: "enable",
  remark: ""
 });
@@ -394,7 +438,72 @@ const emptyPosition = (): Partial<OnboardingPosition> => ({
  remark: ""
 });

+const companyFormRef = ref<FormInstance>();
 const companyForm = reactive<Partial<OnboardingCompany>>(emptyCompany());
+
+const companyRules = reactive<FormRules>({
+  companyCode: [
+    { required: true, message: "请输入公司编码", trigger: "blur" },
+    {
+      pattern: /^[a-zA-Z0-9_-]{2,50}$/,
+      message: "公司编码格式不正确，支持2-50位字母、数字、下划线或短横线",
+      trigger: "blur"
+    }
+  ],
+  companyName: [
+    { required: true, message: "请输入公司简称/名称", trigger: "blur" },
+    { min: 2, max: 100, message: "公司名称长度需在 2 到 100 个字符之间", trigger: "blur" }
+  ],
+  legalName: [
+    { required: true, message: "请输入签署材料甲方全称", trigger: "blur" },
+    { min: 2, max: 100, message: "甲方全称长度需在 2 到 100 个字符之间", trigger: "blur" }
+  ],
+  unifiedSocialCreditCode: [
+    { required: true, message: "请输入统一社会信用代码", trigger: "blur" },
+    {
+      pattern: /^[0-9A-HJ-NPQRTUWXY]{2}\d{6}[0-9A-HJ-NPQRTUWXY]{10}$/i,
+      message: "统一社会信用代码格式不正确，请输入18位标准社会信用代码",
+      trigger: "blur"
+    }
+  ],
+  legalRepresentative: [
+    { required: true, message: "请输入法定代表人姓名", trigger: "blur" },
+    {
+      pattern: /^[\u4e00-\u9fa5a-zA-Z·.\s]{2,20}$/,
+      message: "法定代表人姓名格式不正确，请输入2-20位中英文姓名",
+      trigger: "blur"
+    }
+  ],
+  contactPhone: [
+    { required: true, message: "请输入企业联系电话", trigger: "blur" },
+    {
+      pattern: /^(1[3-9]\d{9}|(0\d{2,3}-?)?\d{7,8}|400(-?\d{3,4}){2})$/,
+      message: "联系电话格式不正确，请输入有效的手机号或固话号码",
+      trigger: "blur"
+    }
+  ],
+  status: [
+    { required: true, message: "请选择公司启用状态", trigger: "change" }
+  ],
+  registeredAddress: [
+    { required: true, message: "请输入企业法定注册地址", trigger: "blur" },
+    { min: 4, max: 200, message: "注册地址请至少输入4个字符", trigger: "blur" }
+  ],
+  qiyuesuoCategoryId: [
+    {
+      pattern: /^\d*$/,
+      message: "契约锁业务分类 Id 必须为纯数字",
+      trigger: "blur"
+    }
+  ],
+  qiyuesuoSealId: [
+    {
+      pattern: /^\d*$/,
+      message: "契约锁企业印章 Id 必须为纯数字",
+      trigger: "blur"
+    }
+  ]
+});
 const departmentForm = reactive<Partial<OnboardingDepartment>>(emptyDepartment());
 const positionForm = reactive<Partial<OnboardingPosition>>(emptyPosition());

@@ -438,6 +547,12 @@ const companyColumns: ColumnProps<OnboardingCompany>[] = [
    label: "联系电话",
    width: 140
  },
+  {
+    prop: "qiyuesuoConfig",
+    label: "契约锁配置",
+    width: 120,
+    align: "center"
+  },
  {
    prop: "status",
    label: "状态",
@@ -602,6 +717,9 @@ function openCompanyCreate() {
  editing.value = false;
  resetCompany();
  dialogVisible.value = true;
+  nextTick(() => {
+    companyFormRef.value?.clearValidate();
+  });
 }

 function openDepartmentCreate() {
@@ -625,6 +743,9 @@ async function openCompanyEdit(row: OnboardingCompany) {
  editing.value = true;
  Object.assign(companyForm, data);
  dialogVisible.value = true;
+  nextTick(() => {
+    companyFormRef.value?.clearValidate();
+  });
 }

 async function openDepartmentEdit(row: OnboardingDepartment) {
@@ -648,8 +769,21 @@ async function openPositionEdit(row: OnboardingPosition) {

 async function save() {
  if (dialogKind.value === "company") {
-    if (!companyForm.companyCode || !companyForm.companyName || !companyForm.legalName) {
-      return ElMessage.warning("请填写公司编码、公司名称和签署材料甲方全称");
+    const valid = await companyFormRef.value?.validate().catch(() => false);
+    if (!valid) return;
+
+    const categoryId = companyForm.qiyuesuoCategoryId?.trim() || "";
+    const sealId = companyForm.qiyuesuoSealId?.trim() || "";
+    if (Boolean(categoryId) !== Boolean(sealId)) {
+      return ElMessage.warning("契约锁默认业务分类 Id 和企业印章 Id 必须同时填写（或均不填）");
+    }
+    if (categoryId && (!/^\d+$/.test(categoryId) || !/^\d+$/.test(sealId))) {
+      return ElMessage.warning("契约锁默认业务分类 Id 和企业印章 Id 只能填写数字");
+    }
+    companyForm.qiyuesuoCategoryId = categoryId;
+    companyForm.qiyuesuoSealId = sealId;
+    if (companyForm.unifiedSocialCreditCode) {
+      companyForm.unifiedSocialCreditCode = companyForm.unifiedSocialCreditCode.trim().toUpperCase();
    }
    await onboardingTaskApi.saveCompany(companyForm, editing.value);
    companyTable.value?.refresh();
@@ -250,49 +250,67 @@
              style="margin-bottom: 16px;"
            />

-            <el-row :gutter="20">
-              <el-col
-                v-for="item in form.contractVariables"
-                :key="`${item.contractTemplateVersionId}-${item.variableCode}`"
-                :xs="24"
-                :sm="12"
+            <!-- 按材料分组展示人事参数 -->
+            <div class="contract-vars-group-list">
+              <div
+                v-for="group in groupedContractVariables"
+                :key="group.contractTemplateVersionId"
+                class="contract-var-group-card"
              >
-                <el-form-item>
-                  <template #label>
-                    <div class="var-label-row">
-                      <span v-if="item.required" class="required-star">*</span>
-                      <span class="var-name">{{ item.variableName }}</span>
-                      <el-tag size="small" type="info" effect="plain" class="contract-source-tag">
-                        {{ item.contractName }}
-                      </el-tag>
-                    </div>
-                  </template>
+                <div class="var-group-header">
+                  <div class="var-group-title">
+                    <el-icon class="var-group-icon"><Document /></el-icon>
+                    <span class="var-group-name">{{ group.contractName }}</span>
+                  </div>
+                  <el-tag size="small" type="primary" effect="plain" class="var-group-count">
+                    {{ group.items.length }} 项人事参数
+                  </el-tag>
+                </div>

-                  <el-date-picker
-                    v-if="item.dataType === 'date'"
-                    v-model="item.variableValue"
-                    type="date"
-                    value-format="YYYY-MM-DD"
-                    placeholder="选择日期"
-                    class="var-input-field"
-                  />
-                  <el-input-number
-                    v-else-if="item.dataType === 'number' || item.dataType === 'decimal'"
-                    v-model="item.variableValue"
-                    controls-position="right"
-                    class="var-input-field"
-                    placeholder="输入金额或数值"
-                  />
-                  <el-input
-                    v-else
-                    v-model="item.variableValue"
-                    :placeholder="`请输入${item.variableName}`"
-                    class="var-input-field"
-                    clearable
-                  />
-                </el-form-item>
-              </el-col>
-            </el-row>
+                <div class="var-group-content">
+                  <el-row :gutter="20">
+                    <el-col
+                      v-for="item in group.items"
+                      :key="`${item.contractTemplateVersionId}-${item.variableCode}`"
+                      :xs="24"
+                      :sm="12"
+                    >
+                      <el-form-item>
+                        <template #label>
+                          <div class="var-label-row">
+                            <span v-if="item.required" class="required-star">*</span>
+                            <span class="var-name">{{ item.variableName }}</span>
+                          </div>
+                        </template>
+
+                        <el-date-picker
+                          v-if="item.dataType === 'date'"
+                          v-model="item.variableValue"
+                          type="date"
+                          value-format="YYYY-MM-DD"
+                          placeholder="选择日期"
+                          class="var-input-field"
+                        />
+                        <el-input-number
+                          v-else-if="item.dataType === 'number' || item.dataType === 'decimal'"
+                          v-model="item.variableValue"
+                          controls-position="right"
+                          class="var-input-field"
+                          placeholder="输入金额或数值"
+                        />
+                        <el-input
+                          v-else
+                          v-model="item.variableValue"
+                          :placeholder="`请输入${item.variableName}`"
+                          class="var-input-field"
+                          clearable
+                        />
+                      </el-form-item>
+                    </el-col>
+                  </el-row>
+                </div>
+              </div>
+            </div>
          </div>

          <!-- 3. 合同逐份预览与确认 -->
@@ -1093,7 +1111,7 @@

          <el-alert
            v-if="!electronicSignDetail.hasProcess"
-            title="审核已通过，可将下列全部合同作为同一个签约流程发起。员工先签，完成后企业自动盖章。"
+            title="审核已通过，可将下列全部合同作为同一个签约流程发起。员工签完后，人事逐份核对，再由后台确认企业盖章。"
            type="info"
            show-icon
            :closable="false"
@@ -1159,6 +1177,15 @@
            </el-descriptions-item>
          </el-descriptions>

+          <el-alert
+            v-if="electronicSignDetail.signStatus === 'pending_company_seal'"
+            title="员工已完成签署，请逐份查看下方员工已签文件。全部核对后，才能确认企业盖章。"
+            type="warning"
+            show-icon
+            :closable="false"
+            class="electronic-sign-seal-alert"
+          />
+
          <div class="electronic-sign-section-title">
            本次签约文件（{{ electronicSignDetail.documents.length }} 份）
          </div>
@@ -1180,6 +1207,29 @@
                </div>
              </div>
              <div class="electronic-sign-document-actions">
+                <el-tag
+                  v-if="
+                    electronicSignDetail.signStatus === 'pending_company_seal'
+                    && documentItem.employeeSignedPreviewed
+                  "
+                  type="success"
+                  size="small"
+                  effect="plain"
+                >
+                  已查看
+                </el-tag>
+                <el-button
+                  v-if="
+                    electronicSignDetail.signStatus === 'pending_company_seal'
+                    && documentItem.providerDocumentId
+                  "
+                  link
+                  type="warning"
+                  :loading="electronicSignPreviewingDocumentId === documentItem.id"
+                  @click="previewEmployeeSignedDocument(documentItem)"
+                >
+                  {{ documentItem.employeeSignedPreviewed ? '再次查看员工已签文件' : '查看员工已签文件' }}
+                </el-button>
                <el-button
                  v-if="documentItem.originalDocxFileId"
                  link
@@ -1291,6 +1341,18 @@
            >
              同步状态
            </el-button>
+            <el-button
+              v-if="
+                electronicSignDetail?.hasProcess
+                && electronicSignDetail.signStatus === 'pending_company_seal'
+              "
+              type="primary"
+              :loading="electronicSignLoading"
+              :disabled="!allEmployeeSignedDocumentsPreviewed"
+              @click="confirmCompanySeal"
+            >
+              确认企业盖章
+            </el-button>
            <el-button
              v-if="electronicSignDetail?.archiveFileId"
              type="success"
@@ -1354,7 +1416,8 @@ import {
  type OnboardingContractTemplate,
  type OnboardingTask,
  type OnboardingTaskContractVariableGroup,
-  type OnboardingElectronicSignDetail
+  type OnboardingElectronicSignDetail,
+  type OnboardingElectronicSignDocument
 } from "@/api/modules/biz/onboarding";
 import type { ColumnProps, ProTableInstance } from "@/components/ProTable/interface";
 import { getMessageBoxPromptResult, isMessageBoxConfirmed } from "@/utils/messageBox";
@@ -1549,6 +1612,7 @@ const savingAllVars = ref(false);

 const electronicSignVisible = ref(false);
 const electronicSignLoading = ref(false);
+const electronicSignPreviewingDocumentId = ref<number>();
 const electronicSignTask = ref<OnboardingTask>();
 const electronicSignDetail = ref<OnboardingElectronicSignDetail>();
 const electronicSignStep = computed(() => {
@@ -1565,6 +1629,13 @@ const canInvalidElectronicSign = computed(() => {
    current.signStatus || ""
  );
 });
+const allEmployeeSignedDocumentsPreviewed = computed(() => {
+  const current = electronicSignDetail.value;
+  return Boolean(
+    current?.documents.length
+    && current.documents.every(item => item.employeeSignedPreviewed)
+  );
+});

 function countVarType(variables: any[], type: string) {
  if (!variables) return 0;
@@ -1644,6 +1715,29 @@ const form = reactive({
  remark: ""
 });

+const groupedContractVariables = computed(() => {
+  const groups: Array<{
+    contractTemplateVersionId: number;
+    contractName: string;
+    items: typeof form.contractVariables;
+  }> = [];
+
+  form.contractVariables.forEach(item => {
+    let group = groups.find(g => g.contractTemplateVersionId === item.contractTemplateVersionId);
+    if (!group) {
+      group = {
+        contractTemplateVersionId: item.contractTemplateVersionId,
+        contractName: item.contractName || "签署材料",
+        items: []
+      };
+      groups.push(group);
+    }
+    group.items.push(item);
+  });
+
+  return groups;
+});
+
 watch(
  () => [
    form.companyId,
@@ -2559,7 +2653,7 @@ async function initiateElectronicSign() {
  const documentCount = current.documents.length;
  const confirmed = await isMessageBoxConfirmed(
    ElMessageBox.confirm(
-      `将把 ${documentCount} 份合同放入同一个契约锁签约流程，员工先签、企业随后自动盖章。确认现在发起吗？`,
+      `将把 ${documentCount} 份合同放入同一个契约锁签约流程。员工签完后，需要人事逐份核对并在后台确认企业盖章。确认现在发起吗？`,
      current.hasProcess ? "继续电子签流程" : "发起电子签确认",
      {
        type: "warning",
@@ -2600,6 +2694,82 @@ async function syncElectronicSign() {
  }
 }

+async function previewEmployeeSignedDocument(
+  documentItem: OnboardingElectronicSignDocument
+) {
+  const task = electronicSignTask.value;
+  if (!task || !documentItem.id) return;
+
+  // 必须在用户点击时先打开空白页，否则等待接口返回后再打开可能被浏览器拦截。
+  const previewWindow = window.open("", "_blank");
+  if (!previewWindow) {
+    ElMessage.warning("浏览器拦截了预览窗口，请允许本站打开新窗口后重试");
+    return;
+  }
+  previewWindow.opener = null;
+  try {
+    previewWindow.document.title = "员工已签合同加载中";
+    previewWindow.document.body.innerText = "正在打开契约锁员工已签文件，请稍候……";
+  } catch {
+    // 空白页提示失败不影响后续跳转。
+  }
+
+  electronicSignPreviewingDocumentId.value = documentItem.id;
+  try {
+    const { data } = await onboardingTaskApi.previewEmployeeSignedDocument(
+      task.id,
+      documentItem.id
+    );
+    if (!data.previewUrl) throw new Error("契约锁没有返回合同浏览地址");
+    documentItem.employeeSignedPreviewed = true;
+    previewWindow.location.replace(data.previewUrl);
+  } catch (error) {
+    previewWindow.close();
+    throw error;
+  } finally {
+    electronicSignPreviewingDocumentId.value = undefined;
+  }
+}
+
+async function confirmCompanySeal() {
+  const task = electronicSignTask.value;
+  const current = electronicSignDetail.value;
+  if (!task || current?.signStatus !== "pending_company_seal") return;
+  if (!allEmployeeSignedDocumentsPreviewed.value) {
+    ElMessage.warning("请先逐份查看所有员工已签文件");
+    return;
+  }
+
+  const confirmed = await isMessageBoxConfirmed(
+    ElMessageBox.confirm(
+      `已逐份核对 ${current.documents.length} 份员工已签文件。确认使用当前公司的印章执行企业盖章吗？盖章后合同内容不能修改。`,
+      "确认企业盖章",
+      {
+        type: "warning",
+        confirmButtonText: "确认盖章",
+        cancelButtonText: "取消"
+      }
+    )
+  );
+  if (!confirmed) return;
+
+  electronicSignLoading.value = true;
+  try {
+    const { data } = await onboardingTaskApi.companySealElectronicSign(task.id);
+    electronicSignDetail.value = data;
+    if (["completed", "archived"].includes(data.signStatus || "")) {
+      ElMessage.success("企业盖章已完成");
+    } else {
+      ElMessage.success("企业盖章请求已提交，系统正在同步签署结果");
+    }
+  } catch (error) {
+    await loadElectronicSignDetail().catch(() => undefined);
+    throw error;
+  } finally {
+    electronicSignLoading.value = false;
+  }
+}
+

 async function reinitiateElectronicSign() {
  const task = electronicSignTask.value;
@@ -3210,6 +3380,65 @@ onMounted(loadCompanies);
  margin-top: 5px;
 }

+.contract-vars-group-list {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+.contract-var-group-card {
+  border: 1px solid #e2e8f0;
+  border-radius: 8px;
+  background-color: #f8fafc;
+  overflow: hidden;
+  transition: border-color 0.2s, box-shadow 0.2s;
+}
+
+.contract-var-group-card:hover {
+  border-color: #cbd5e1;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
+}
+
+.var-group-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 10px 16px;
+  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
+  border-bottom: 1px solid #e2e8f0;
+}
+
+.var-group-title {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.var-group-icon {
+  font-size: 16px;
+  color: #3b82f6;
+}
+
+.var-group-name {
+  font-size: 14px;
+  font-weight: 600;
+  color: #1e293b;
+}
+
+.var-group-count {
+  font-weight: 500;
+  border-radius: 4px;
+}
+
+.var-group-content {
+  padding: 16px 16px 0 16px;
+  background-color: #ffffff;
+}
+
+.var-group-content :deep(.el-form-item) {
+  margin-bottom: 16px;
+}
+
 .var-label-row {
  display: flex;
  align-items: center;
@@ -3582,6 +3811,10 @@ onMounted(loadCompanies);
  margin-bottom: 20px;
 }

+.electronic-sign-seal-alert {
+  margin-bottom: 20px;
+}
+
 .electronic-sign-section-title {
  margin-bottom: 10px;
  color: var(--el-text-color-primary);
@@ -3620,6 +3853,13 @@ onMounted(loadCompanies);

 .electronic-sign-document-actions {
  flex-shrink: 0;
+  justify-content: flex-end;
+  flex-wrap: wrap;
+  gap: 8px;
+}
+
+.electronic-sign-document-actions :deep(.el-button) {
+  margin-left: 0;
 }

 .document-state-text {
@@ -3656,5 +3896,9 @@ onMounted(loadCompanies);
    align-items: stretch;
    flex-direction: column;
  }
+
+  .electronic-sign-document-actions {
+    justify-content: flex-start;
+  }
 }
 </style>
@@ -7,8 +7,8 @@
          <el-icon><Promotion /></el-icon>
          <span>OnboardX 智能入职服务</span>
        </div>
-        <h1 class="brand-title">欢迎加入新团队</h1>
-        <p class="brand-subtitle">请按照 4 步指引完成入职登记表、证件上传与签署材料查阅确认</p>
+        <h1 class="brand-title">很高兴与你相遇，欢迎加入！</h1>
+        <p class="brand-subtitle">请完成以下入职流程：填写登记信息、上传证件、阅读并签署相关入职材料，开启你的职场新旅程。</p>
      </div>
    </header>

@@ -102,7 +102,7 @@
          <div v-show="currentStep === 0" class="step-content">
            <div class="registration-header">
              <h2 class="reg-title">入 职 登 记 表</h2>
-              <p class="reg-subtitle">请准确填写您的真实个人档案、学习经历与家庭信息（带 * 为必填项）</p>
+              <p class="reg-subtitle">请如实填写个人基础档案、教育经历及家庭相关信息，标注 * 为必填项，信息将用于建立人事档案，请务必保证资料真实准确。</p>
            </div>

            <el-form ref="regFormRef" :model="form" :rules="regRules" label-position="top" class="reg-form">
@@ -1696,6 +1696,7 @@ onBeforeUnmount(() => {
 .brand-subtitle {
  margin: 0;
  font-size: 14px;
+  line-height: 1.6;
  opacity: 0.92;
 }

@@ -1767,6 +1768,7 @@ onBeforeUnmount(() => {

 .reg-subtitle {
  font-size: 13px;
+  line-height: 1.6;
  color: #64748b;
  margin: 0;
 }