..

src/main/resources/views/platform/theRapyRecuperation/signUp/index.html

@@ -443,10 +443,10 @@ layout("/layouts/platform.html"){
                         takePartInUnionId: row.takePartInUnionId,
                     }),
                 })
-                if (code !== 0) {
+                // if (code !== 0) {
-                    this.$message.error(msg);
+                //     this.$message.error(msg);
-                    return;
+                //     return;
-                }
+                // }
 
                 if (["0", "1"].includes(this.pageForm.theRapyRecuperationType)) {
                     // 线路

src/main/resources/views/platform/theRapyRecuperation/signUp/lineSignUp.js

@@ -6,7 +6,8 @@ const LineSignUp = {
             <div class="play-times-container">
                 <div v-if="playTimes.length > 0">
                     <div class="section-title">请选择出行时间</div>
-                    <el-table :data="playTimes" highlight-current-row @current-change="handleCurrentChange"
+                    <el-table :data="playTimes" highlight-current-row
+                              border
                               class="time-table" :row-class-name="tableRowClassName">
                         <el-table-column
                                 label="序号"
@@ -79,6 +80,18 @@ const LineSignUp = {
                                 </el-tag>
                             </template>
                         </el-table-column>
+                        <el-table-column label="操作" width="300px">
+                            <template slot-scope="scope">
+                                <el-button size="mini" 
+                                           :type="selectedTime && selectedTime.usId === scope.row.usId ? 'success' : 'primary'" 
+                                           @click="handleCurrentChange(scope.row)">
+                                    {{ selectedTime && selectedTime.usId === scope.row.usId ? '已选择' : '选择' }}
+                                </el-button>
+                                <el-button size="mini" type="primary" @click="viewSignUpUser(scope.row)">
+                                    查看报名人员
+                                </el-button>
+                            </template>
+                        </el-table-column>
                     </el-table>
                 </div>
                 <div v-else class="no-times">
@@ -90,7 +103,7 @@ const LineSignUp = {
             <!-- 报名表单 -->
             <div v-if="selectedTime" class="signup-form">
                 <div class="section-title">填写报名信息</div>
-                <el-form ref="signupFormRef" :model="signupForm" label-width="100px" :rules="rules">
+                <el-form ref="signupFormRef" :model="signupForm" label-width="120px" :rules="rules">
                     <!-- 人员基础信息 -->
                     <div class="form-section">
                         <div class="sub-section-title">人员基础信息</div>
@@ -100,10 +113,12 @@ const LineSignUp = {
                         <el-form-item label="工号" prop="loginName">
                             <el-input v-model="signupForm.loginName" placeholder="请输入工号" readonly></el-input>
                         </el-form-item>
-                        <el-form-item label="身份证号" prop="idCard">
+                        <el-form-item label="身份证号" prop="idCard"
+                                      :rules="[{required: true, message: '请输入身份证号', trigger: 'blur'},{pattern: /^[1-9]\\d{5}(18|19|20)\\d{2}(0[1-9]|1[0-2])(0[1-9]|[12]\\d|3[01])\\d{3}[\\dXx]$/,message: '请输入正确的身份证号码',trigger: ['change','blur']}]">
                             <el-input v-model="signupForm.idCard" placeholder="请输入身份证号"></el-input>
                         </el-form-item>
-                        <el-form-item label="手机号" prop="mobile">
+                        <el-form-item label="手机号" prop="mobile"
+                                      :rules="[{required: true, message: '请输入手机号', trigger: 'blur'},{pattern: /^1[3-9]\d{8}$/, message: '请输入正确的手机号', trigger: ['change','blur']}]">
                             <el-input v-model="signupForm.mobile" placeholder="请输入手机号"></el-input>
                         </el-form-item>
                         <el-form-item label="所属工会" prop="unionName">
@@ -132,11 +147,12 @@ const LineSignUp = {
 
                                 <el-form-item :label="'姓名'" :prop="'companionList.' + index + '.userName'"
                                               :rules="[{required: true, message: '请输入姓名', trigger: 'blur'}]">
-                                    <el-input v-model="person.userName" placeholder="请输入姓名"></el-input>
+                                    <el-input v-model="person.userName" placeholder="请输入姓名"
+                                              maxlength="32"></el-input>
                                 </el-form-item>
 
                                 <el-form-item :label="'身份证号'" :prop="'companionList.' + index + '.idCard'"
-                                              :rules="[{required: true, message: '请输入身份证号', trigger: 'blur'}]">
+                                              :rules="[{required: true, message: '请输入身份证号', trigger: 'blur'},{pattern: /^[1-9]\\d{5}(18|19|20)\\d{2}(0[1-9]|1[0-2])(0[1-9]|[12]\\d|3[01])\\d{3}[\\dXx]$/,message: '请输入正确的身份证号码',trigger: ['change','blur']}]">
                                     <el-input v-model="person.idCard" placeholder="请输入身份证号"
                                               @blur="parseIdCard(index)"></el-input>
                                 </el-form-item>
@@ -159,7 +175,7 @@ const LineSignUp = {
                                 </el-row>
 
                                 <el-form-item label="身高" :prop="'companionList.' + index + '.height'"
-                                              :rules="[{required: true, message: '请输入身高', trigger: 'blur'}]"
+                                              :rules="[{required: true, message: '请输入身高', trigger: 'blur'},{pattern: /^(?:[1-9]\\d|[1-2]\\d{2}|50)$/,message: '请输入50-250cm之间的合理身高',trigger: 'blur'}]"
                                               v-if="person.age && person.age <= 12">
                                     <el-input v-model.number="person.height" placeholder="请输入身高">
                                         <template slot="append">cm</template>
@@ -167,7 +183,7 @@ const LineSignUp = {
                                 </el-form-item>
 
                                 <el-form-item :label="'手机号'" :prop="'companionList.' + index + '.mobile'"
-                                              :rules="[{required: true, message: '请输入手机号', trigger: 'blur'}]">
+                                              :rules="[{required: true, message: '请输入手机号', trigger: 'blur'},{pattern: /^1[3-9]\d{8}$/, message: '请输入正确的手机号', trigger: ['change','blur']}]">
                                     <el-input v-model="person.mobile" placeholder="请输入手机号"></el-input>
                                 </el-form-item>
 
@@ -209,11 +225,13 @@ const LineSignUp = {
                         </el-form-item>
 
                         <el-form-item label="拼房人" prop="roommate" v-if="signupForm.roomRemark === 2">
-                            <el-input v-model="signupForm.roommate" placeholder="请输入拼房人"></el-input>
+                            <el-input v-model="signupForm.roommate" placeholder="请输入拼房人"
+                                      maxlength="50"></el-input>
                         </el-form-item>
 
                         <el-form-item label="其它备注" prop="otherRemark">
                             <el-input type="textarea" v-model="signupForm.otherRemark"
+                                      maxlength="255"
                                       placeholder="如有需要请填写其它备注信息"></el-input>
                         </el-form-item>
                     </div>
@@ -276,6 +294,14 @@ const LineSignUp = {
                 </el-row>
             </el-dialog>
 
+            <el-dialog title="报名人员" :visible.sync="signUpUserVisible" :close-on-click-modal="false"
+                       :close-on-press-escape="false" append-to-body>
+                <el-table :data="signUpUserTableData">
+
+                </el-table>
+            </el-dialog>
+
+
         </el-dialog>
     `,
     data() {
@@ -330,7 +356,12 @@ const LineSignUp = {
             readSafeUrl: '',
 
             // 报名id
-            enrollId: null
+            enrollId: null,
+
+            // 报名人员
+            signUpUserVisible: false,
+            signUpUserTableData: [],
+            signUpUserSearchKeyWord: null
 
         }
     },
@@ -356,8 +387,16 @@ const LineSignUp = {
         'signupForm.roomCount'(oldVal, newVal) {
             if (newVal && oldVal !== newVal) {
                 this.$set(this.signupForm, 'roomRemark', '')
+                this.$set(this.signupForm, 'roomRemarkName', '')
             }
             this.updateRoomRemarkColumns()
+        },
+        'signupForm.roomRemark'(val) {
+            if (val) {
+                this.$set(this.signupForm, 'roomRemarkName', this.roomRemarkColumns.find(o => o.value === val)?.label)
+            } else {
+                this.$set(this.signupForm, 'roomRemarkName', '')
+            }
         }
     },
 
@@ -403,6 +442,21 @@ const LineSignUp = {
             }
         },
 
+        // 查看报名人员
+        viewSignUpUser(row) {
+            $.post('/platform/theRapyRecuperation/line/enroll/openSignUser', {
+                usId: row.usId,
+                searchKeyWord: this.signUpUserSearchKeyWord
+            }).then(res => {
+                if (res.code === 0) {
+                    this.signUpUserTableData = res.data
+                    this.signUpUserVisible = true
+                } else {
+                    this.$message.error(res.msg)
+                }
+            })
+        },
+
         // 选择出行时间
         handleCurrentChange(row) {
             if (!row) return;
@@ -447,19 +501,22 @@ const LineSignUp = {
             }
             this.signupForm.companionList.push({});
             this.$set(this.signupForm, 'roomCount', '')
+            this.$set(this.signupForm, 'roomCountName', '')
             this.$set(this.signupForm, 'roomRemark', '')
+            this.$set(this.signupForm, 'roomRemarkName', '')
         },
 
         // 移除随行人
         removeAccompanyingPerson(index) {
             this.signupForm.companionList.splice(index, 1);
             this.$set(this.signupForm, 'roomCount', '')
+            this.$set(this.signupForm, 'roomCountName', '')
             this.$set(this.signupForm, 'roomRemark', '')
+            this.$set(this.signupForm, 'roomRemarkName', '')
         },
 
         // 根据身份证解析年龄和性别
         parseIdCard(index) {
-            debugger
             let idCard = this.signupForm.companionList[index].idCard;
             if (!idCard || idCard.length < 15) return;
 
@@ -512,6 +569,7 @@ const LineSignUp = {
             // 如果最后的roomRemarkColumns的length只有1，直接默认第一个元素显示
             if (this.roomRemarkColumns.length === 1) {
                 this.$set(this.signupForm, 'roomRemark', this.roomRemarkColumns[0].value)
+                this.$set(this.signupForm, 'roomRemarkName', this.roomRemarkColumns[0].label)
             }
         },
 
@@ -572,6 +630,8 @@ const LineSignUp = {
     style: /*language=CSS*/ `
         .line-sign-up-dialog .el-dialog__body {
             padding: 0 20px 20px 20px;
+            max-height: 70vh;
+            overflow-y: auto;
         }
 
         .play-times-container {
@@ -602,15 +662,37 @@ const LineSignUp = {
             padding: 20px;
             background-color: #f9f9f9;
             border-radius: 5px;
+            box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
         }
 
         .time-table {
             width: 100%;
             margin-bottom: 20px;
+            border-radius: 4px;
+            overflow: hidden;
+        }
+        
+        .time-table .el-table__header th {
+            background-color: #f2f6fc;
+            color: #606266;
+            font-weight: 600;
         }
 
         .time-table .selected-row {
-            background-color: #ecf5ff;
+            background-color: #c1dbf7!important;
+            font-weight: 500;
+            position: relative;
+            transition: all 0.3s ease;
+            box-shadow: 0 0 10px rgba(64, 158, 255, 0.3);
+        }
+        
+        .time-table .selected-row td {
+            background-color: #e6f1ff;
+            color: #409EFF;
+        }
+        
+        .time-table .selected-row td:first-child {
+            border-left: none;
         }
 
         .time-table .full-row td {
@@ -624,9 +706,9 @@ const LineSignUp = {
         }
 
         .sequence-number {
-            width: 24px;
+            width: 28px;
-            height: 24px;
+            height: 28px;
-            line-height: 24px;
+            line-height: 28px;
             border-radius: 50%;
             background-color: #409EFF;
             color: white;
@@ -658,6 +740,10 @@ const LineSignUp = {
             padding-top: 20px;
             border-top: 1px solid #EBEEF5;
         }
+        
+        .el-form-item__label {
+            font-weight: 500;
+        }
 
         .selected-time {
             font-weight: 500;
@@ -672,6 +758,10 @@ const LineSignUp = {
         .accompanying-person {
             position: relative;
             margin-bottom: 15px;
+            padding: 15px;
+            border: 1px solid #EBEEF5;
+            border-radius: 4px;
+            background-color: #fff;
         }
 
         .person-header {
@@ -693,5 +783,17 @@ const LineSignUp = {
             background-color: #f4f4f5;
             border-radius: 4px;
         }
+        
+        /* 响应式调整 */
+        @media (max-width: 768px) {
+            .line-sign-up-dialog .el-dialog {
+                width: 95% !important;
+                margin-top: 10px !important;
+            }
+            
+            .time-table {
+                font-size: 12px;
+            }
+        }
     `
 };