From 84092b55b37bfd50ac6e1194fbfd0ec1694a788c Mon Sep 17 00:00:00 2001
From: cwchen <1048842385@qq.com>
Date: Fri, 14 Nov 2025 14:51:39 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BA=BA=E5=91=98=E5=BA=93=E9=A1=B5=E9=9D=A2?=
 =?UTF-8?q?=E6=A0=B7=E5=BC=8F=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../personnel/components/PersonnelDetail.vue  |  28 ++-
 .../personnel/components/PersonnelForm.vue    |  29 ++-
 .../personnel/components/child/BasicInfo.vue  | 179 +++++++++++-------
 .../components/child/BasicInfoDetail.vue      |  76 ++++++--
 .../personnel/components/child/OtherInfo.vue  |  61 +++---
 .../components/child/OtherInfoDetail.vue      |  50 +++--
 .../components/child/QualificationInfo.vue    | 127 ++++++++-----
 7 files changed, 371 insertions(+), 179 deletions(-)

diff --git a/src/views/enterpriseLibrary/personnel/components/PersonnelDetail.vue b/src/views/enterpriseLibrary/personnel/components/PersonnelDetail.vue
index 3f5e697..e7fdeef 100644
--- a/src/views/enterpriseLibrary/personnel/components/PersonnelDetail.vue
+++ b/src/views/enterpriseLibrary/personnel/components/PersonnelDetail.vue
@@ -16,6 +16,11 @@
                         @handle-personnel-position="handlePersonnelPosition" 
                     />
                 </el-col>
+                
+            </el-row>
+
+            <el-row :gutter="24" class="content-row">
+                
                 <!-- 资质信息 -->
                 <el-col v-if="!isProjectChiefEngineer" :span="6" class="pane-center">
                     <QualificationInfoPersonnelDetail 
@@ -24,6 +29,9 @@
                         :detail-data="detailData" 
                     />
                 </el-col>
+            </el-row>
+
+            <el-row :gutter="24" class="content-row">
                 <!-- 其他信息 -->
                 <el-col :span="6" class="pane-right">
                     <OtherInfoPersonnelDetail 
@@ -158,14 +166,24 @@ export default {
 
 <style scoped lang="scss">
 .app-container {
+    height: calc(100vh - 84px);
+    width: 100%;
     padding: 24px;
+    box-sizing: border-box;
     background: linear-gradient(180deg, #F1F6FF 20%, #E5EFFF 100%);
-    min-height: 100vh;
-    overflow-y: auto;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    position: relative;
+    margin: 0;
 }
 
 .content-body {
+    flex: 1;
+    overflow-y: auto;
+    overflow-x: hidden;
     margin-top: 20px;
+    min-height: 0; // 确保 flex 子元素可以正确收缩
 }
 
 .content-row {
@@ -180,11 +198,11 @@ export default {
 .pane-right {
     background: #fff;
     border-radius: 16px 16px 16px 16px;
-    min-height: 600px;
+    min-height: 400px;
     box-shadow: 0px 4px 20px 0px rgba(31, 35, 55, 0.1);
     // border: 1px solid #e8f4ff;
     padding: 0;
-    margin-bottom: 20px;
+    margin-bottom: 10px;
     flex: 1;
     min-width: 0;
 }
@@ -193,8 +211,8 @@ export default {
     display: flex;
     justify-content: flex-end;
     align-items: center;
-    margin-bottom: 20px;
     gap: 12px;
+    flex-shrink: 0;
 }
 
 .edit-btn {
diff --git a/src/views/enterpriseLibrary/personnel/components/PersonnelForm.vue b/src/views/enterpriseLibrary/personnel/components/PersonnelForm.vue
index 41dc8e4..6ac1f66 100644
--- a/src/views/enterpriseLibrary/personnel/components/PersonnelForm.vue
+++ b/src/views/enterpriseLibrary/personnel/components/PersonnelForm.vue
@@ -21,13 +21,15 @@
                     <BasicInfoPersonnel ref="basicInfoPersonnel" @handlePersonnelPosition="handlePersonnelPosition"
                         :detailData="detailData" />
                 </el-col>
-
+            </el-row>
+            <el-row :gutter="24" class="content-row">
                 <!-- 资质信息 -->
                 <el-col :span="6" class="pane-center" v-show="!isProjectChiefEngineer">
                     <QualificationInfoPersonnel ref="qualificationInfoPersonnel" :personnelPosition="personnelPosition"
                         :detailData="detailData" />
                 </el-col>
-
+            </el-row>
+            <el-row :gutter="24" class="content-row">
                 <!-- 其他信息 -->
                 <el-col :span="6" class="pane-right">
                     <OtherInfoPersonnel ref="otherInfoPersonnel" :detailData="detailData"
@@ -297,7 +299,7 @@ export default {
         assembleFormData(basicInfoData, qualificationData = EMPTY_OBJECT, otherData = EMPTY_OBJECT) {
             console.log(qualificationData);
             console.log(otherData);
-            
+
             // 安全合并所有文件列表
             const allFiles = [
                 ...this.safeGetArray(basicInfoData.fileList),
@@ -355,7 +357,7 @@ export default {
                     this.handleClose()
                 }
             } catch (error) {
-                if(error instanceof Error && error.message.includes('未填写完整')){
+                if (error instanceof Error && error.message.includes('未填写完整')) {
                     this.$message.error(error.message)
                 }
             } finally {
@@ -398,11 +400,16 @@ export default {
 
 <style scoped lang="scss">
 .app-container {
+    height: calc(100vh - 84px);
+    width: 100%;
     padding: 24px;
+    box-sizing: border-box;
     background: linear-gradient(180deg, #F1F6FF 20%, #E5EFFF 100%);
-    min-height: 100vh;
-    overflow-y: auto;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
     position: relative;
+    margin: 0;
 
     &.no-pointer-events {
         pointer-events: none;
@@ -414,7 +421,11 @@ export default {
 }
 
 .content-body {
+    flex: 1;
+    overflow-y: auto;
+    overflow-x: hidden;
     margin-top: 20px;
+    min-height: 0; // 确保 flex 子元素可以正确收缩
 }
 
 .content-row {
@@ -429,10 +440,10 @@ export default {
 .pane-right {
     background: #fff;
     border-radius: 16px;
-    min-height: 600px;
+    min-height: 400px;
     box-shadow: 0px 4px 20px 0px rgba(31, 35, 55, 0.1);
     padding: 0;
-    margin-bottom: 20px;
+    margin-bottom: 10px;
     flex: 1;
     min-width: 0;
 }
@@ -441,8 +452,8 @@ export default {
     display: flex;
     justify-content: flex-end;
     align-items: center;
-    margin-bottom: 20px;
     gap: 12px;
+    flex-shrink: 0;
 }
 
 .search-btn {
diff --git a/src/views/enterpriseLibrary/personnel/components/child/BasicInfo.vue b/src/views/enterpriseLibrary/personnel/components/child/BasicInfo.vue
index 0bc245e..6ba33a6 100644
--- a/src/views/enterpriseLibrary/personnel/components/child/BasicInfo.vue
+++ b/src/views/enterpriseLibrary/personnel/components/child/BasicInfo.vue
@@ -5,76 +5,125 @@
             <span>基本信息</span>
         </div>
         <el-form :model="form" :rules="rules" ref="basicInfoForm" label-width="110px" label-position="top">
-            <el-form-item label="人员职位" prop="personnelPosition">
-                <el-select class="form-item" v-model="form.personnelPosition" placeholder="请选择人员职位"
-                    @change="handlePersonnelPositionChange">
-                    <el-option v-for="item in dict.type.personnel_position" :key="item.value" :label="item.label"
-                        :value="item.value"></el-option>
-                </el-select>
-            </el-form-item>
-            <!-- 身份证人面像 -->
-            <el-form-item label="身份证人面像" prop="fileList">
-                <UploadFile :fileList="form.fileList" :fileUploadRule="fileUploadRule" @del-file="handleDelFile"
-                    @file-change="handleFileChange" type="face_id_card_portrait" />
-            </el-form-item>
-            <!-- 身份证国徽面 -->
-            <el-form-item label="身份证国徽面" prop="fileList2">
-                <UploadFile :fileList="form.fileList2" :fileUploadRule="fileUploadRule2" @del-file="handleDelFile"
-                    @file-change="handleFileChange" type="national_emblem_id_card" />
-            </el-form-item>
-            <el-form-item label="人员姓名" prop="personnelName">
-                <el-input v-model.trim="form.personnelName" placeholder="自动提取" clearable show-word-limit
-                    maxlength="32"></el-input>
-            </el-form-item>
-            <el-form-item label="身份证号码" prop="personnelIdCard">
-                <el-input v-model.trim="form.personnelIdCard" placeholder="自动提取" clearable show-word-limit
-                    maxlength="18"></el-input>
-            </el-form-item>
-            <el-form-item label="入职时间" prop="employmentDate">
-                <el-date-picker class="form-item" v-model="form.employmentDate" placeholder="请选择入职时间"
-                    value-format="yyyy-MM-dd" type="date"></el-date-picker>
-            </el-form-item>
-            <el-form-item label="从业年限" prop="employmentYears">
-                <el-input min="0" max="60" type="number" v-model="form.employmentYears"
-                    placeholder="请输入从业年限"></el-input>
-            </el-form-item>
-            <!-- 学历证书 -->
-            <el-form-item label="学历证书" prop="fileList3">
-                <UploadFile :fileList="form.fileList3" uploadType="png、jpg、jpeg、pdf" :fileUploadRule="fileUploadRule3"
-                    @del-file="handleDelFile" @file-change="handleFileChange" type="academic_certificate" />
-            </el-form-item>
-            <el-form-item label="毕业院校" prop="graduateSchool">
-                <el-input v-model.trim="form.graduateSchool" placeholder="自动提取" clearable show-word-limit
-                    maxlength="64"></el-input>
-            </el-form-item>
-            <el-form-item label="毕业专业" prop="graduationMajor">
-                <el-input v-model.trim="form.graduationMajor" placeholder="自动提取" clearable show-word-limit
-                    maxlength="64"></el-input>
-            </el-form-item>
-            <el-form-item label="学历" prop="qualification">
-                <el-input v-model.trim="form.qualification" placeholder="自动提取" clearable show-word-limit
-                    maxlength="32"></el-input>
-            </el-form-item>
-            <el-form-item label="毕业时间" prop="graduationDate">
-                <el-date-picker class="form-item" v-model="form.graduationDate" placeholder="自动提取"
-                    value-format="yyyy-MM-dd" type="date"></el-date-picker>
-            </el-form-item>
-            <el-form-item label="联系方式" prop="personnelPhone">
-                <el-input v-model.trim="form.personnelPhone" placeholder="请输入联系方式" clearable show-word-limit
-                    maxlength="11"></el-input>
-            </el-form-item>
-            <el-form-item label="劳动合同" prop="fileList4">
-                <UploadFile :fileList="form.fileList4" uploadType="pdf、doc、docx" maxFileTips="100MB"
-                    :fileUploadRule="fileUploadRule4" @del-file="handleDelFile" @file-change="handleFileChange"
-                    type="labor_contract" />
-            </el-form-item>
+            <el-row :gutter="24">
+                <el-col :span="8">
+                    <!-- 身份证人面像 -->
+                    <el-form-item label="身份证人面像" prop="fileList">
+                        <UploadFile :fileList="form.fileList" :fileUploadRule="fileUploadRule" @del-file="handleDelFile"
+                            @file-change="handleFileChange" type="face_id_card_portrait" />
+                    </el-form-item>
+                </el-col>
+                <el-col :span="8">
+                    <!-- 身份证国徽面 -->
+                    <el-form-item label="身份证国徽面" prop="fileList2">
+                        <UploadFile :fileList="form.fileList2" :fileUploadRule="fileUploadRule2"
+                            @del-file="handleDelFile" @file-change="handleFileChange" type="national_emblem_id_card" />
+                    </el-form-item>
+                </el-col>
+            </el-row>
+
+            <el-row :gutter="24">
+                <el-col :span="8">
+                    <el-form-item label="人员职位" prop="personnelPosition">
+                        <el-select class="form-item" v-model="form.personnelPosition" placeholder="请选择人员职位"
+                            @change="handlePersonnelPositionChange">
+                            <el-option v-for="item in dict.type.personnel_position" :key="item.value"
+                                :label="item.label" :value="item.value"></el-option>
+                        </el-select>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="8">
+                    <el-form-item label="人员姓名" prop="personnelName">
+                        <el-input v-model.trim="form.personnelName" placeholder="自动提取" clearable show-word-limit
+                            maxlength="32"></el-input>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="8">
+                    <el-form-item label="身份证号码" prop="personnelIdCard">
+                        <el-input v-model.trim="form.personnelIdCard" placeholder="自动提取" clearable show-word-limit
+                            maxlength="18"></el-input>
+                    </el-form-item>
+                </el-col>
+            </el-row>
+
+            <el-row :gutter="24">
+                <el-col :span="8">
+                    <el-form-item label="入职时间" prop="employmentDate">
+                        <el-date-picker class="form-item" v-model="form.employmentDate" placeholder="请选择入职时间"
+                            value-format="yyyy-MM-dd" type="date"></el-date-picker>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="8">
+                    <el-form-item label="从业年限" prop="employmentYears">
+                        <el-input min="0" max="60" type="number" v-model="form.employmentYears"
+                            placeholder="请输入从业年限"></el-input>
+                    </el-form-item>
+                </el-col>
+            </el-row>
+
+            <el-row :gutter="24">
+                <el-col :span="8">
+                    <!-- 学历证书 -->
+                    <el-form-item label="学历证书" prop="fileList3">
+                        <UploadFile :fileList="form.fileList3" uploadType="png、jpg、jpeg、pdf"
+                            :fileUploadRule="fileUploadRule3" @del-file="handleDelFile" @file-change="handleFileChange"
+                            type="academic_certificate" />
+                    </el-form-item>
+                </el-col>
+            </el-row>
+            <el-row :gutter="24">
+                <el-col :span="8">
+                    <el-form-item label="毕业院校" prop="graduateSchool">
+                        <el-input v-model.trim="form.graduateSchool" placeholder="自动提取" clearable show-word-limit
+                            maxlength="64"></el-input>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="8">
+                    <el-form-item label="毕业专业" prop="graduationMajor">
+                        <el-input v-model.trim="form.graduationMajor" placeholder="自动提取" clearable show-word-limit
+                            maxlength="64"></el-input>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="8">
+                    <el-form-item label="学历" prop="qualification">
+                        <el-input v-model.trim="form.qualification" placeholder="自动提取" clearable show-word-limit
+                            maxlength="32"></el-input>
+                    </el-form-item>
+                </el-col>
+            </el-row>
+
+            <el-row :gutter="24">
+                <el-col :span="8">
+                    <el-form-item label="毕业时间" prop="graduationDate">
+                        <el-date-picker class="form-item" v-model="form.graduationDate" placeholder="自动提取"
+                            value-format="yyyy-MM-dd" type="date"></el-date-picker>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="8">
+                    <el-form-item label="联系方式" prop="personnelPhone">
+                        <el-input v-model.trim="form.personnelPhone" placeholder="请输入联系方式" clearable show-word-limit
+                            maxlength="11"></el-input>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="8"></el-col>
+            </el-row>
+
+            <el-row :gutter="24">
+                <el-col :span="8">
+                    <el-form-item label="劳动合同" prop="fileList4">
+                        <UploadFile :fileList="form.fileList4" uploadType="pdf、doc、docx" maxFileTips="100MB"
+                            :fileUploadRule="fileUploadRule4" @del-file="handleDelFile" @file-change="handleFileChange"
+                            type="labor_contract" />
+                    </el-form-item>
+                </el-col>
+            </el-row>
         </el-form>
     </div>
 </template>
 
 <script>
 import UploadFile from '@/views/common/UploadFile.vue'
-import { validMobile,validIdCard } from '@/utils/validate'
+import { validMobile, validIdCard } from '@/utils/validate'
 export default {
     name: 'BasicInfoPersonnel',
     dicts: ['personnel_position', 'identification_tag'],
@@ -262,7 +311,7 @@ export default {
         handleDelFile(file) {
             console.log(file);
             const delPath = file?.response?.fileRes?.filePath || file?.filePath || null;
-            if(delPath){
+            if (delPath) {
                 this.form.delFileList.push(delPath);
             }
         },
diff --git a/src/views/enterpriseLibrary/personnel/components/child/BasicInfoDetail.vue b/src/views/enterpriseLibrary/personnel/components/child/BasicInfoDetail.vue
index 1128b69..eba9fd7 100644
--- a/src/views/enterpriseLibrary/personnel/components/child/BasicInfoDetail.vue
+++ b/src/views/enterpriseLibrary/personnel/components/child/BasicInfoDetail.vue
@@ -6,20 +6,68 @@
         </div>
 
         <div class="detail-content">
-            <DetailItem label="人员职位" :value="personnelPosition.label" />
-            <FileOrImageDisplay label="身份证人面像" :file="form.fileList[0]" :image-url="form.url" />
-            <FileOrImageDisplay label="身份证国徽面" :file="form.fileList2[0]" :image-url="form.url2" />
-            <DetailItem label="人员姓名" :value="form.personnelName" />
-            <DetailItem label="身份证号码" :value="form.personnelIdCard" />
-            <DetailItem label="入职时间" :value="form.employmentDate" />
-            <DetailItem label="从业年限" :value="form.employmentYears" suffix="年" />
-            <FileOrImageDisplay label="学历证书" :file="form.fileList3[0]" :image-url="form.url3" />
-            <DetailItem label="毕业院校" :value="form.graduateSchool" />
-            <DetailItem label="毕业专业" :value="form.graduationMajor" />
-            <DetailItem label="学历" :value="form.qualification" />
-            <DetailItem label="毕业时间" :value="form.graduationDate" />
-            <DetailItem label="联系方式" :value="form.personnelPhone" />
-            <FileOrImageDisplay label="劳动合同" :file="form.fileList4[0]" :image-url="form.url4" />
+            <el-row :gutter="24">
+                <el-col :span="8">
+                    <FileOrImageDisplay label="身份证人面像" :file="form.fileList[0]" :image-url="form.url" />
+                </el-col>
+                <el-col :span="8">
+                    <FileOrImageDisplay label="身份证国徽面" :file="form.fileList2[0]" :image-url="form.url2" />
+                </el-col>
+            </el-row>
+
+            <el-row :gutter="24">
+                <el-col :span="8">
+                    <DetailItem label="人员职位" :value="personnelPosition.label" />
+                </el-col>
+                <el-col :span="8">
+                    <DetailItem label="人员姓名" :value="form.personnelName" />
+                </el-col>
+                <el-col :span="8">
+                    <DetailItem label="身份证号码" :value="form.personnelIdCard" />
+                </el-col>
+            </el-row>
+            
+            <el-row :gutter="24">
+                <el-col :span="8">
+                    <DetailItem label="入职时间" :value="form.employmentDate" />
+                </el-col>
+                <el-col :span="8">
+                    <DetailItem label="从业年限" :value="form.employmentYears" suffix="年" />
+                </el-col>
+            </el-row>
+
+            <el-row :gutter="24">
+                <el-col :span="8">
+                    <FileOrImageDisplay label="学历证书" :file="form.fileList3[0]" :image-url="form.url3" />
+                </el-col>
+            </el-row>
+            <el-row :gutter="24">
+                <el-col :span="8">
+                    <DetailItem label="毕业院校" :value="form.graduateSchool" />
+                </el-col>
+                <el-col :span="8">
+                    <DetailItem label="毕业专业" :value="form.graduationMajor" />
+                </el-col>
+                <el-col :span="8">
+                    <DetailItem label="学历" :value="form.qualification" />
+                </el-col>
+            </el-row>
+            
+            <el-row :gutter="24">
+                <el-col :span="8">
+                    <DetailItem label="毕业时间" :value="form.graduationDate" />
+                </el-col>
+                <el-col :span="8">
+                    <DetailItem label="联系方式" :value="form.personnelPhone" />
+                </el-col>
+            </el-row>
+            
+            <el-row :gutter="24">
+                <el-col :span="8">
+                    <FileOrImageDisplay label="劳动合同" :file="form.fileList4[0]" :image-url="form.url4" />
+                </el-col>
+            </el-row>
+            
         </div>
     </div>
 </template>
diff --git a/src/views/enterpriseLibrary/personnel/components/child/OtherInfo.vue b/src/views/enterpriseLibrary/personnel/components/child/OtherInfo.vue
index 9643ecc..320d6d2 100644
--- a/src/views/enterpriseLibrary/personnel/components/child/OtherInfo.vue
+++ b/src/views/enterpriseLibrary/personnel/components/child/OtherInfo.vue
@@ -6,27 +6,44 @@
         </div>
         <el-form :model="form" :rules="rules" ref="accountOpeningCertificateForm" label-width="110px"
             label-position="top">
-            <el-form-item label="职称证" prop="fileList">
-                <UploadFile :fileList="form.fileList" uploadType="png、jpg、jpeg、pdf" :fileUploadRule="fileUploadRule"
-                    @del-file="handleDelFile" @file-change="handleFileChange" type="professional_title_certificate" />
-            </el-form-item>
-            <el-form-item label="职称名称" prop="titleName">
-                <el-input v-model.trim="form.titleName" placeholder="自动提取" clearable show-word-limit
-                    maxlength="32"></el-input>
-            </el-form-item>
-            <el-form-item label="专业名称" prop="professionalName">
-                <el-input v-model.trim="form.professionalName" placeholder="自动提取" clearable show-word-limit
-                    maxlength="32"></el-input>
-            </el-form-item>
-            <el-form-item label="证书编号" prop="certificateCode">
-                <el-input v-model.trim="form.certificateCode" placeholder="自动提取" clearable show-word-limit
-                    maxlength="32"></el-input>
-            </el-form-item>
-            <el-form-item label="人员简介" prop="personnelIntroduction">
-                <el-input type="textarea" :autosize="{ minRows: 4, maxRows: 6 }" class="form-item"
-                    v-model.trim="form.personnelIntroduction" clearable show-word-limit placeholder="请输入人员简介"
-                    maxlength="300"></el-input>
-            </el-form-item>
+            <el-row :gutter="24">
+                <el-col :span="8">
+                    <el-form-item label="职称证" prop="fileList">
+                        <UploadFile :fileList="form.fileList" uploadType="png、jpg、jpeg、pdf"
+                            :fileUploadRule="fileUploadRule" @del-file="handleDelFile" @file-change="handleFileChange"
+                            type="professional_title_certificate" />
+                    </el-form-item>
+                </el-col>
+            </el-row>
+            <el-row :gutter="24">
+                <el-col :span="8">
+                    <el-form-item label="职称名称" prop="titleName">
+                        <el-input v-model.trim="form.titleName" placeholder="自动提取" clearable show-word-limit
+                            maxlength="32"></el-input>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="8">
+                    <el-form-item label="专业名称" prop="professionalName">
+                        <el-input v-model.trim="form.professionalName" placeholder="自动提取" clearable show-word-limit
+                            maxlength="32"></el-input>
+                    </el-form-item>
+                </el-col>
+                <el-col :span="8">
+                    <el-form-item label="证书编号" prop="certificateCode">
+                        <el-input v-model.trim="form.certificateCode" placeholder="自动提取" clearable show-word-limit
+                            maxlength="32"></el-input>
+                    </el-form-item>
+                </el-col>
+            </el-row>
+            <el-row :gutter="24">
+                <el-col :span="24">
+                    <el-form-item label="人员简介" prop="personnelIntroduction">
+                        <el-input type="textarea" :autosize="{ minRows: 4, maxRows: 6 }" class="form-item"
+                            v-model.trim="form.personnelIntroduction" clearable show-word-limit placeholder="请输入人员简介"
+                            maxlength="300"></el-input>
+                    </el-form-item>
+                </el-col>
+            </el-row>
         </el-form>
     </div>
 </template>
@@ -146,7 +163,7 @@ export default {
         handleDelFile(file) {
             console.log(file);
             const delPath = file?.response?.fileRes?.filePath || file?.filePath || null;
-            if(delPath){
+            if (delPath) {
                 this.form.delFileList.push(delPath);
             }
         },
diff --git a/src/views/enterpriseLibrary/personnel/components/child/OtherInfoDetail.vue b/src/views/enterpriseLibrary/personnel/components/child/OtherInfoDetail.vue
index 5f2706b..29dd413 100644
--- a/src/views/enterpriseLibrary/personnel/components/child/OtherInfoDetail.vue
+++ b/src/views/enterpriseLibrary/personnel/components/child/OtherInfoDetail.vue
@@ -6,16 +6,34 @@
         </div>
 
         <div class="detail-content">
-            <!-- 职称证 -->
-            <FileOrImageDisplay label="职称证" :file="form.fileList[0]" :image-url="form.url" />
-            <!-- 职称名称 -->
-            <DetailItem label="职称名称" :value="form.titleName" />
-            <!-- 专业名称 -->
-            <DetailItem label="专业名称" :value="form.professionalName" />
-            <!-- 证书编号 -->
-            <DetailItem label="证书编号" :value="form.certificateCode" />
-            <!-- 人员简介 -->
-            <DetailItem label="人员简介" :value="form.personnelIntroduction" />
+            <el-row :gutter="24">
+                <el-col :span="8">
+                    <!-- 职称证 -->
+                    <FileOrImageDisplay label="职称证" :file="form.fileList[0]" :image-url="form.url" />
+                </el-col>
+            </el-row>
+
+            <el-row :gutter="24">
+                <el-col :span="8">
+                    <!-- 职称名称 -->
+                    <DetailItem label="职称名称" :value="form.titleName" />
+                </el-col>
+                <el-col :span="8">
+                    <!-- 专业名称 -->
+                    <DetailItem label="专业名称" :value="form.professionalName" />
+                </el-col>
+                <el-col :span="8">
+                    <!-- 证书编号 -->
+                    <DetailItem label="证书编号" :value="form.certificateCode" />
+                </el-col>
+            </el-row>
+
+            <el-row :gutter="24">
+                <el-col :span="24">
+                    <!-- 人员简介 -->
+                    <DetailItem label="人员简介" :value="form.personnelIntroduction" />
+                </el-col>
+            </el-row>
         </div>
     </div>
 </template>
@@ -67,7 +85,7 @@ export default {
         setDetailData() {
             const fileList = this.getFileList(CERTIFICATE_TYPE);
             const certificateData = this.getCertificateData(CERTIFICATE_TYPE);
-            
+
             this.form = {
                 titleName: certificateData.titleName || '',
                 professionalName: certificateData.professionalName || '',
@@ -80,7 +98,7 @@ export default {
 
         getFileList(businessType) {
             const certificateDetail = this.findCertificateDetail(businessType);
-            
+
             if (certificateDetail?.fileVoList) {
                 return certificateDetail.fileVoList.map(item => ({
                     name: item.fileName,
@@ -89,22 +107,22 @@ export default {
                     fileType: item.fileType
                 }));
             }
-            
+
             return [];
         },
 
         getCertificateData(businessType) {
             const certificate = this.findCertificateDetail(businessType)?.certificate;
-            
+
             if (!certificate) {
                 return {};
             }
-            
+
             const result = {};
             CERTIFICATE_KEYS.forEach(key => {
                 result[key] = certificate[key] != null ? certificate[key] : '';
             });
-            
+
             return result;
         },
 
diff --git a/src/views/enterpriseLibrary/personnel/components/child/QualificationInfo.vue b/src/views/enterpriseLibrary/personnel/components/child/QualificationInfo.vue
index fb39aec..a1089a0 100644
--- a/src/views/enterpriseLibrary/personnel/components/child/QualificationInfo.vue
+++ b/src/views/enterpriseLibrary/personnel/components/child/QualificationInfo.vue
@@ -7,59 +7,90 @@
         <el-form :model="form" :rules="rules" ref="qualificationInfoForm" label-width="110px" label-position="top">
             <!-- 建造师证书 -->
             <template v-if="isProjectManager">
-                <el-form-item label="建造师证书" prop="fileList">
-                    <UploadFile :fileList="form.fileList" uploadType="png、jpg、jpeg、pdf" :fileUploadRule="fileUploadRule"
-                        @del-file="handleDelFile" @file-change="handleFileChange" type="constructor_certificate" />
-                </el-form-item>
 
-                <el-form-item label="专业类型" prop="professionalType">
-                    <el-input v-model.trim="form.professionalType" placeholder="自动提取" clearable show-word-limit
-                        maxlength="32"></el-input>
-                </el-form-item>
+                <el-row :gutter="24">
+                    <el-col :span="8">
+                        <el-form-item label="建造师证书" prop="fileList">
+                            <UploadFile :fileList="form.fileList" uploadType="png、jpg、jpeg、pdf"
+                                :fileUploadRule="fileUploadRule" @del-file="handleDelFile"
+                                @file-change="handleFileChange" type="constructor_certificate" />
+                        </el-form-item>
+                    </el-col>
+                </el-row>
 
-                <el-form-item label="证书编号" prop="certificateCode">
-                    <el-input v-model.trim="form.certificateCode" placeholder="自动提取" clearable show-word-limit
-                        maxlength="32"></el-input>
-                </el-form-item>
-                <el-form-item label="级别" prop="certificateLevel">
-                    <el-input v-model.trim="form.certificateLevel" placeholder="自动提取" clearable show-word-limit
-                        maxlength="32"></el-input>
-                </el-form-item>
-                <el-form-item label="证书有效期" prop="certificateValidityPeriod">
-                    <el-date-picker v-model="form.certificateValidityPeriod" type="daterange" range-separator="至"
-                        start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd" class="form-item">
-                    </el-date-picker>
-                </el-form-item>
-                <el-form-item label="使用有效期" prop="useValidityPeriod">
-                    <el-date-picker v-model="form.useValidityPeriod" type="daterange" range-separator="至"
-                        start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd" class="form-item">
-                    </el-date-picker>
-                </el-form-item>
+                <el-row :gutter="24">
+                    <el-col :span="8">
+                        <el-form-item label="专业类型" prop="professionalType">
+                            <el-input v-model.trim="form.professionalType" placeholder="自动提取" clearable show-word-limit
+                                maxlength="32"></el-input>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="8">
+                        <el-form-item label="证书编号" prop="certificateCode">
+                            <el-input v-model.trim="form.certificateCode" placeholder="自动提取" clearable show-word-limit
+                                maxlength="32"></el-input>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="8">
+                        <el-form-item label="级别" prop="certificateLevel">
+                            <el-input v-model.trim="form.certificateLevel" placeholder="自动提取" clearable show-word-limit
+                                maxlength="32"></el-input>
+                        </el-form-item>
+                    </el-col>
+                </el-row>
+                <el-row :gutter="24">
+                    <el-col :span="8">
+                        <el-form-item label="证书有效期" prop="certificateValidityPeriod">
+                            <el-date-picker v-model="form.certificateValidityPeriod" type="daterange"
+                                range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"
+                                value-format="yyyy-MM-dd" class="form-item">
+                            </el-date-picker>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="8">
+                        <el-form-item label="使用有效期" prop="useValidityPeriod">
+                            <el-date-picker v-model="form.useValidityPeriod" type="daterange" range-separator="至"
+                                start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd"
+                                class="form-item">
+                            </el-date-picker>
+                        </el-form-item>
+                    </el-col>
+                </el-row>
             </template>
 
 
             <!-- 安全考核B证、安全考核C证、其他人员证书 -->
             <template>
-                <el-form-item :label="certificateName" prop="fileList2">
-                    <UploadFile :fileList="form.fileList2" uploadType="png、jpg、jpeg、pdf"
-                        :fileUploadRule="fileUploadRule2" @del-file="handleDelFile" @file-change="handleFileChange"
-                        :type="otherType" />
-                </el-form-item>
-                <el-form-item label="证书编号" prop="certificateCode2">
-                    <el-input v-model.trim="form.certificateCode2" placeholder="自动提取"></el-input>
-                </el-form-item>
-                <el-form-item label="证书有效期" prop="certificateValidityPeriod2">
-                    <el-date-picker v-model="form.certificateValidityPeriod2" type="daterange" range-separator="至"
-                        start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd" class="form-item">
-                    </el-date-picker>
-                </el-form-item>
-                <el-form-item label="注册专业" prop="registerProfessional">
-                    <el-input v-model.trim="form.registerProfessional" placeholder="自动提取"></el-input>
-                </el-form-item>
+                <el-row :gutter="24">
+                    <el-col :span="8">
+                        <el-form-item :label="certificateName" prop="fileList2">
+                            <UploadFile :fileList="form.fileList2" uploadType="png、jpg、jpeg、pdf"
+                                :fileUploadRule="fileUploadRule2" @del-file="handleDelFile"
+                                @file-change="handleFileChange" :type="otherType" />
+                        </el-form-item>
+                    </el-col>
+                </el-row>
+                <el-row :gutter="24">
+                    <el-col :span="8">
+                        <el-form-item label="证书编号" prop="certificateCode2">
+                            <el-input v-model.trim="form.certificateCode2" placeholder="自动提取"></el-input>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="8">
+                        <el-form-item label="证书有效期" prop="certificateValidityPeriod2">
+                            <el-date-picker v-model="form.certificateValidityPeriod2" type="daterange"
+                                range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"
+                                value-format="yyyy-MM-dd" class="form-item">
+                            </el-date-picker>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="8">
+                        <el-form-item label="注册专业" prop="registerProfessional">
+                            <el-input v-model.trim="form.registerProfessional" placeholder="自动提取"></el-input>
+                        </el-form-item>
+                    </el-col>
+                </el-row>
             </template>
-
-
-
         </el-form>
     </div>
 </template>
@@ -303,7 +334,7 @@ export default {
         handleDelFile(file) {
             console.log(file);
             const delPath = file?.response?.fileRes?.filePath || file?.filePath || null;
-            if(delPath){
+            if (delPath) {
                 this.form.delFileList.push(delPath);
             }
         },
@@ -366,8 +397,8 @@ export default {
                     certificate.certificateType === businessType
                 );
 
-            console.log('certificates:',certificates);
-            
+            console.log('certificates:', certificates);
+
             if (certificates.length > 0) {
                 const value = certificates[0][key];
                 return value != null ? value : '';