From 0ffbd2d80429e2a63ac5fbe42f8e22e3b7632efe Mon Sep 17 00:00:00 2001
From: 18154758993 <605281283@qq.com>
Date: Tue, 16 Dec 2025 00:45:23 +0800
Subject: [PATCH] =?UTF-8?q?=E6=8A=8A=E4=B8=8A=E4=BC=A0=E4=BD=9C=E8=AF=81?=
 =?UTF-8?q?=E6=A0=A1=E9=AA=8C=E5=8E=BB=E6=8E=89=E4=BA=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../applicationForm.vue                       | 171 +++++++++---------
 1 file changed, 83 insertions(+), 88 deletions(-)

diff --git a/src/views/dormitory/outsideAccommodation/outsideAccommodationApply/applicationForm.vue b/src/views/dormitory/outsideAccommodation/outsideAccommodationApply/applicationForm.vue
index 83d3d07..713933e 100644
--- a/src/views/dormitory/outsideAccommodation/outsideAccommodationApply/applicationForm.vue
+++ b/src/views/dormitory/outsideAccommodation/outsideAccommodationApply/applicationForm.vue
@@ -11,7 +11,7 @@
     </el-alert>
 
     <!-- 核心表单 -->
-    <el-form :model="form" :rules="formRules" ref="formRef" class="form-wrapper" v-loading="loading">
+    <el-form ref="formRef" v-loading="loading" :model="form" :rules="formRules" class="form-wrapper">
       <!-- 基本信息卡片 -->
       <el-card shadow="hover" style="margin-bottom: 20px">
         <el-descriptions title="基本信息" :column="3" border label-width="120px">
@@ -33,8 +33,8 @@
           <el-descriptions-item label="性别" required>
             <el-form-item prop="gender" class="no-label-form-item">
               <el-select v-model="form.gender" placeholder="请选择性别" clearable style="width: 100%">
-                <el-option label="男" value="1"></el-option>
-                <el-option label="女" value="0"></el-option>
+                <el-option label="男" value="1" />
+                <el-option label="女" value="0" />
               </el-select>
             </el-form-item>
           </el-descriptions-item>
@@ -131,8 +131,7 @@
                   <!-- <img :src="baseUrl + form.studentSignature" alt="电子签名"
                     style="width: 100px; height: 50px; margin-left: 10px; border: 1px solid #eee" /> -->
                   <el-image style="width: 100px; height: 50px; margin-left: 10px; border: 1px solid #eee"
-                    :src="baseUrl + form.studentSignature" :preview-src-list="[baseUrl + form.studentSignature]">
-                  </el-image>
+                    :src="baseUrl + form.studentSignature" :preview-src-list="[baseUrl + form.studentSignature]" />
                 </div>
               </div>
             </el-form-item>
@@ -196,7 +195,7 @@
               <!-- <file-upload v-model="form.parentSignAttachment" :text="`上传文件`" /> -->
               <el-upload class="upload-demo" :action="uploadImgUrl" :on-success="handleAvatarSuccess"
                 :before-upload="beforeAvatarUpload" :file-list="fileList" list-type="picture">
-                <el-button size="small" type="primary"><i class='el-icon-upload2'></i>点击上传</el-button>
+                <el-button size="small" type="primary"><i class="el-icon-upload2" />点击上传</el-button>
                 <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过2M</div>
               </el-upload>
             </el-form-item>
@@ -232,7 +231,7 @@
       <el-card shadow="hover" style="margin-bottom: 20px">
         <el-descriptions title="本人承诺" :column="1" border label-width="120px">
           <el-descriptions-item label="承诺内容">
-            <el-card shadow="none" class="promise-card" v-if="form.promiseContent == ''">
+            <el-card v-if="form.promiseContent == ''" shadow="none" class="promise-card">
               <p>1. 自觉遵守国家法律、法规；</p>
               <p>2. 自觉遵守学生行为规范和学校的规章制度，遵守社会公德；</p>
               <p>3. 自觉遵守外宿住址所在社区的有关管理规定；</p>
@@ -240,8 +239,7 @@
                 4. 本人申请外宿，属个人自愿行为，外宿期间发生的一切事故，造成本人、他人或集体的人身、财产损害的，学校不负责任。
               </p>
             </el-card>
-            <el-card shadow="none" class="promise-card" v-else v-html="form.promiseContent">
-            </el-card>
+            <el-card v-else shadow="none" class="promise-card" v-html="form.promiseContent" />
           </el-descriptions-item>
 
           <!-- 承诺签名 -->
@@ -255,8 +253,7 @@
                   <!-- <img :src="baseUrl + form.studentPromiseSign" alt="承诺签名"
                     style="width: 100px; height: 50px; margin-left: 10px; border: 1px solid #eee" /> -->
                   <el-image style="width: 100px; height: 50px; margin-left: 10px; border: 1px solid #eee"
-                    :src="baseUrl + form.studentPromiseSign" :preview-src-list="[baseUrl + form.studentPromiseSign]">
-                  </el-image>
+                    :src="baseUrl + form.studentPromiseSign" :preview-src-list="[baseUrl + form.studentPromiseSign]" />
                 </div>
                 <el-form-item prop="promiseDate" class="no-label-form-item date-item">
                   <el-date-picker v-model="form.promiseDate" type="date" value-format="yyyy-MM-dd" placeholder="签署日期"
@@ -274,11 +271,11 @@
           <i class="el-icon-folder" />
           保存
         </el-button>
-        <el-button type="primary" size="medium" @click="submitForm(1)" v-if="form.status == 0">
+        <el-button v-if="form.status == 0" type="primary" size="medium" @click="submitForm(1)">
           <i class="el-icon-check" />
           提交申请
         </el-button>
-        <el-button type="default" size="medium" @click="resetForm" style="margin-left: 10px" v-if="!currentId">
+        <el-button v-if="!currentId" type="default" size="medium" style="margin-left: 10px" @click="resetForm">
           <i class="el-icon-refresh" />
           重置表单
         </el-button>
@@ -294,7 +291,7 @@
         </div>
         <div class="sign-modal-body">
           <!-- 纯原生Canvas，无任何框架包裹 -->
-          <canvas id="studentCanvas" width="400" height="200" style="border: 1px solid #ccc; background: #fff"></canvas>
+          <canvas id="studentCanvas" width="400" height="200" style="border: 1px solid #ccc; background: #fff" />
         </div>
         <div class="sign-modal-footer">
           <button class="btn-clear" @click="clearStudentCanvas">清除</button>
@@ -311,7 +308,7 @@
           <span class="close-btn" @click="closePromiseSignModal">×</span>
         </div>
         <div class="sign-modal-body">
-          <canvas id="promiseCanvas" width="400" height="200" style="border: 1px solid #ccc; background: #fff"></canvas>
+          <canvas id="promiseCanvas" width="400" height="200" style="border: 1px solid #ccc; background: #fff" />
         </div>
         <div class="sign-modal-footer">
           <button class="btn-clear" @click="clearPromiseCanvas">清除</button>
@@ -323,20 +320,20 @@
 </template>
 
 <script>
+import { getOwnLog } from '@/api/dormitory/new/stuDom'
 import {
+  addOutsideAccommodationApply,
+  getOutsideAccommodationApply,
   getOwnInfo,
   listStudent,
-  getOutsideAccommodationApply,
-  updateOutsideAccommodationApply,
-  addOutsideAccommodationApply
+  updateOutsideAccommodationApply
 } from '@/api/dormitory/outsideAccommodation/outsideAccommodationApply'
-import { batchAddOutsideAccommodationAttachment, deleteOutsideAccommodationAttachmentNameAndStuName } from "@/api/dormitory/outsideAccommodation/outsideAccommodationAttachment";
-import { getUserProfile } from '@/api/system/user' // 获取当前登录用户
-import { getOwnLog } from '@/api/dormitory/new/stuDom'
+import { batchAddOutsideAccommodationAttachment, deleteOutsideAccommodationAttachmentNameAndStuName } from '@/api/dormitory/outsideAccommodation/outsideAccommodationAttachment'
+import { getUserProfile } from '@/api/system/user'; // 获取当前登录用户
+import AffixIndex from '@/views/dormitory/outsideAccommodation/outsideAccommodationApply/components/affix/index'
 import {
   pcaTextArr // 省市区联动数据,纯汉字
 } from 'element-china-area-data'
-import AffixIndex from "@/views/dormitory/outsideAccommodation/outsideAccommodationApply/components/affix/index"
 
 export default {
   name: 'OutsideAccommodationApply',
@@ -411,7 +408,7 @@ export default {
         promiseDate: [{ required: true, message: '请选择签署日期', trigger: 'change' }],
         studentSignature: [{ required: true, message: '请完成电子签名', trigger: 'change' }],
         studentPromiseSign: [{ required: true, message: '请完成承诺签名', trigger: 'change' }],
-        affixId: [{ required: true, message: '请上传佐证材料', trigger: 'blur' }],
+        // affixId: [{ required: true, message: '请上传佐证材料', trigger: 'change' }],
         parentSignAttachment: [
           {
             required: true,
@@ -442,12 +439,12 @@ export default {
   },
   watch: {
     // 监听路由参数变化，只要有新的 id 就更新
-    "$route.query.id": {
+    '$route.query.id': {
       immediate: true, // 初始化时立即执行一次
       handler(newId, oldId) {
         if (newId) {
-          this.loading = true;
-          this.currentId = newId;
+          this.loading = true
+          this.currentId = newId
           // 调用接口加载数据
           getOutsideAccommodationApply(this.currentId).then(res => {
             this.form = {
@@ -455,7 +452,7 @@ export default {
               // 字符串转回数组（按后端存储的分隔符拆分），地址
               address: res.data.address ? res.data.address.split('/') : [],
               parentAddress: res.data.parentAddress ? res.data.parentAddress.split('/') : []
-            };
+            }
             const fileName = this.form.parentSignAttachment.split('/').pop()
             // 回显家长签字附件
             this.fileList = [{ name: fileName, url: this.baseUrl + this.form.parentSignAttachment }]
@@ -464,7 +461,7 @@ export default {
           })
         } else {
           // 若 id 为空，可做清空处理
-          this.currentId = null;
+          this.currentId = null
           // 延迟执行重置，确保 formRef 已挂载
           this.$nextTick(() => {
             this.resetForm()
@@ -528,7 +525,7 @@ export default {
                     }
                   } else {
                     // 匹配记录无学年名称
-                    this.form.accommodationFee = `已交未知年度住宿费 暂无有效学年信息`
+                    this.form.accommodationFee = '已交未知年度住宿费 暂无有效学年信息'
                   }
                 } else {
                   // 无匹配roomId的记录，兜底处理
@@ -709,9 +706,9 @@ export default {
         if (valid) {
           // 生成申请编号等逻辑不变
           if (!this.form.applyNo) {
-            const year = new Date().getFullYear();
-            const randomNo = Math.floor(Math.random() * 1000000).toString().padStart(6, '0');
-            this.form.applyNo = `WS${year}${randomNo}`;
+            const year = new Date().getFullYear()
+            const randomNo = Math.floor(Math.random() * 1000000).toString().padStart(6, '0')
+            this.form.applyNo = `WS${year}${randomNo}`
           }
           this.form.endDate = this.getOutsideDefaultEndTime()
           this.form.promiseContent = `
@@ -725,36 +722,36 @@ export default {
             address: this.form.address ? this.form.address.join('/') : '',
             parentAddress: this.form.parentAddress ? this.form.parentAddress.join('/') : '',
             status: this.form.status != 0 ? this.form.status : status
-          };
+          }
 
-          this.loading = true;
+          this.loading = true
           // 封装请求逻辑为Promise，确保完成后再操作
           const requestPromise = this.form.id != null
             ? updateOutsideAccommodationApply(submitForm)
-            : addOutsideAccommodationApply(submitForm);
+            : addOutsideAccommodationApply(submitForm)
 
           requestPromise.then((response) => {
             // 附件处理逻辑不变
             if (this.reasonFileList && this.reasonFileList.length > 0) {
               this.reasonFileList.forEach(element => {
-                element.applyId = this.form.id || response.data.id;
-              });
-              batchAddOutsideAccommodationAttachment(this.reasonFileList);
+                element.applyId = this.form.id || response.data.id
+              })
+              batchAddOutsideAccommodationAttachment(this.reasonFileList)
             }
-            this.loading = false;
-            this.$modal.msgSuccess(this.form.id ? '修改成功' : '新增成功');
+            this.loading = false
+            this.$modal.msgSuccess(this.form.id ? '修改成功' : '新增成功')
             // 延迟跳转：给后端数据落地留时间（关键！）
             setTimeout(() => {
-              this.goBack();
-            }, 800); // 800ms延迟，确保后端写入完成
+              this.goBack()
+            }, 800) // 800ms延迟，确保后端写入完成
           }).catch(error => {
-            this.loading = false;
-            this.$message.error('提交失败：' + (error.msg || '服务器处理异常'));
+            this.loading = false
+            this.$message.error('提交失败：' + (error.msg || '服务器处理异常'))
             // 失败时不跳转，避免用户重复操作
             // this.goBack();
           })
         } else {
-          this.loading = false;
+          this.loading = false
           this.$message.error('表单填写有误，请检查！')
         }
       })
@@ -768,49 +765,47 @@ export default {
       }
       this.reasonFileList = []
       this.fileList = []
-      this.form.affixId = ""
+      this.form.affixId = ''
       this.form.studentSignature = ''
       this.form.studentPromiseSign = ''
       this.clearStudentCanvas()
       this.clearPromiseCanvas()
     },
-    handleAffix(affixId) {
-      this.form.affixId = affixId
-    },
-    // 处理组件传递的文件信息
-    handleAffix(fileInfo) {
+    // 处理 AffixIndex 组件回传：既支持 v-model 返回的 affixId，也支持文件信息对象
+    handleAffix(payload) {
+      if (typeof payload === 'string' || typeof payload === 'number') {
+        this.form.affixId = payload
+        return
+      }
+      const fileInfo = payload
       if (!fileInfo || !fileInfo.fileName || !fileInfo.filePath) {
-        console.warn('无效的文件信息，跳过添加')
-        return // 不添加空数据
+        this.$message.warning('附件标识异常或文件信息缺失，请重新上传')
+        return
       }
-      // 构建与后端实体匹配的data对象
-      let data = {
-        // id: null, // 主键（后端自增）
-        applyId: this.form.id || null, // 关联申请表ID（从主表单获取）
-        attachmentName: fileInfo.fileName, // 文件名（从组件传递的信息中获取）
-        attachmentUrl: fileInfo.filePath, // 文件路径（相对路径，关联sys_file表）
-        fileSize: fileInfo.originalFile?.size || 0, // 若需要，可从fileInfo.originalFile.size获取（单位：字节）
-        fileSuffix: fileInfo.fileType, // 文件类型（如docx、pdf）
-        processInstanceId: this.form.processInstanceId || '', // 申请编号（从主表单获取）
-        studentName: this.form.studentName || '', // 学生姓名（从主表单获取）
-        studentNo: this.form.studentNo || '' // 学号（从主表单获取）
+      const data = {
+        applyId: this.form.id || null,
+        attachmentName: fileInfo.fileName,
+        attachmentUrl: fileInfo.filePath,
+        filePath: fileInfo.filePath,
+        fileSize: fileInfo.originalFile?.size || 0,
+        fileSuffix: fileInfo.fileType,
+        processInstanceId: this.form.processInstanceId || '',
+        studentName: this.form.studentName || '',
+        studentNo: this.form.studentNo || ''
       }
-
-      // 避免重复添加（根据filePath去重）
       const isDuplicate = this.reasonFileList.some((item) => item.filePath === data.filePath)
-      if (!isDuplicate) {
-        this.reasonFileList.push(data)
-        console.log('附件添加成功：', this.reasonFileList)
-      } else {
+      if (isDuplicate) {
         this.$message.warning('该文件已添加，请勿重复上传')
+        return
       }
+      this.reasonFileList.push(data)
     },
     // 处理子组件传递的删除文件事件
     handleDeleteFile(fileName) {
       // 接收文件名后，可执行后续逻辑，删除在数据库的数据
       if (fileName) {
         deleteOutsideAccommodationAttachmentNameAndStuName({ attachmentName: fileName, studentName: this.form.studentName }).then(res => {
-          this.$message.success(`成功删除文件：${fileName}`);
+          this.$message.success(`成功删除文件：${fileName}`)
         })
       }
     },
@@ -819,15 +814,15 @@ export default {
       this.$nextTick(() => {
         // 如果Affix组件有ref（比如ref="affixComponent"），主动调用clearData
         if (this.$refs.affixComponent) {
-          this.$refs.affixComponent.clearData();
+          this.$refs.affixComponent.clearData()
         }
 
         // 2. 优化退出逻辑：先关闭tab，再返回（避免重复操作）
         this.$tab.closePage().then(() => {
           // 仅当需要返回上一页时执行（根据业务场景选择）
           // this.$router.back();
-        });
-      });
+        })
+      })
     },
     // 保存学生签名
     saveStudentSignature() {
@@ -957,30 +952,30 @@ export default {
       }
     },
     beforeAvatarUpload(file) {
-      const isJPG = file.type === 'image/jpeg' || 'image/png';
-      const isLt2M = file.size / 1024 / 1024 < 2;
+      const isJPG = file.type === 'image/jpeg' || 'image/png'
+      const isLt2M = file.size / 1024 / 1024 < 2
 
       if (!isJPG) {
-        this.$message.error('上传头像图片只能是 JPG、PNG 格式!');
+        this.$message.error('上传头像图片只能是 JPG、PNG 格式!')
       }
       if (!isLt2M) {
-        this.$message.error('上传头像图片大小不能超过 2MB!');
+        this.$message.error('上传头像图片大小不能超过 2MB!')
       }
-      return isJPG && isLt2M;
+      return isJPG && isLt2M
     },
     /**
      * 生成外宿默认结束时间（次年8月31日）
      * @returns {String} 格式化日期（yyyy-MM-dd）
      */
     getOutsideDefaultEndTime() {
-      const now = new Date();
-      const currentYear = now.getFullYear();
+      const now = new Date()
+      const currentYear = now.getFullYear()
       // 计算次年（当前年+1）
-      const nextYear = currentYear + 1;
+      const nextYear = currentYear + 1
       // 8月对应的索引是7（0=1月，1=2月...7=8月）
-      const endDate = new Date(nextYear, 7, 31); // 次年8月31日
+      const endDate = new Date(nextYear, 7, 31) // 次年8月31日
       // 格式化为 yyyy-MM-dd（适配 el-date-picker 的 value-format）
-      return this.formatDate(endDate);
+      return this.formatDate(endDate)
     },
 
     /**
@@ -989,10 +984,10 @@ export default {
      * @returns {String} yyyy-MM-dd
      */
     formatDate(date) {
-      const year = date.getFullYear();
-      const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份补零
-      const day = String(date.getDate()).padStart(2, '0'); // 日期补零
-      return `${year}-${month}-${day}`;
+      const year = date.getFullYear()
+      const month = String(date.getMonth() + 1).padStart(2, '0') // 月份补零
+      const day = String(date.getDate()).padStart(2, '0') // 日期补零
+      return `${year}-${month}-${day}`
     }
   }
 }