1. 制卡字段限制

src/views/tourism/membershipManagement/electronicMembership/formBox/makeCradForm.vue

@@ -23,17 +23,21 @@
             <span>{{ form.name }}</span>
           </el-form-item>
           <el-form-item label="卡类型：" prop="cardType">
-            <el-select style="width: 100%;" v-model="form.cardType" @change="selectUser" clearable placeholder="请选择卡类型">
+            <span>{{ form.cardType == 1 ? '主卡':'副卡' }}</span>
+            <!-- <el-select style="width: 100%;" v-model="form.cardType" @change="selectUser" clearable placeholder="请选择卡类型">
               <el-option
-                v-for="dict in [{name: '副卡',id: 0},{name: '主卡',id: 1}]"
+                v-for="dict in optionList"
                 :key="dict.id"
                 :label="dict.name"
                 :value="dict.id">
               </el-option>
-            </el-select>
+            </el-select> -->
           </el-form-item>
-          <el-form-item label="卡号：" prop="cardNo">
-            <el-input v-model="form.cardNo" maxlength="20" show-word-limit autocomplete="off" placeholder="请输入卡号"></el-input>
+          <el-form-item :label="form.cardType == 1 ? '主卡号：':'副卡号：'" prop="cardNo">
+            <div style="display: flex;">
+              <span style="white-space: nowrap;padding: 0 5px 0 0;" v-if="form.cardNoCopy">{{ form.cardNoCopy }}</span>
+              <el-input v-model="form.cardNo" :placeholder="form.cardType == 1 ? '请输入卡号8位数主卡号':'请输入卡号3位数副卡号'"></el-input>
+            </div>
           </el-form-item>
           <el-form-item label="模板：" prop="templateId">
             <el-select style="width: 100%;" v-model="form.templateId" clearable placeholder="请选择模板">
@@ -100,7 +104,7 @@ export default {
         cardType: [{ required: true, message: "请选择卡类型", trigger: ["change","blur"] }],
         cardNo: [
           { required: true, message: "请输入卡号", trigger: ["change","blur"] },
-          { pattern: /^[0-9]*$/, message: '卡号必须全为数字', trigger: ["change","blur"]}
+          { pattern: /^\d{8}$/, message: '卡号必须全为8位数字', trigger: ["change","blur"]}
         ],
         memberId: [{ required: true, message: "请输入持卡人", trigger: ["change","blur"] }],
         templateId: [{ required: true, message: "请选择模板", trigger: ["change","blur"] }],
@@ -111,7 +115,7 @@ export default {
       tableUseList: [], // 用户
       mobanList: [], // 模板list
       phoneCodeLoading: 0,
-      
+      optionList: [{name: '副卡',id: 0},{name: '主卡',id: 1}]
     };
   },
   created() {
@@ -173,8 +177,18 @@ export default {
         }
           this.$set(this,'form',{
             memberId: res.data.id,
-            name: res.data.name
+            name: res.data.name,
+            cardNoCopy: res.data.cardNo
           })
+          if(res.data.cardNo) {
+            this.form.cardType = 0
+            this.optionList = [{name: '副卡',id: 0}]
+            this.$set(this.rules.cardNo,1,{ pattern: /^\d{3}$/, message: '副卡号必须全为3位数字', trigger: ["change","blur"]})
+          }else {
+            this.form.cardType = 1
+            this.optionList = [{name: '主卡',id: 1}]
+            this.$set(this.rules.cardNo,1,{ pattern: /^\d{8}$/, message: '主卡号必须全为8位数字', trigger: ["change","blur"]})
+          }
           this.formStatus = 1
         }else {
           this.$message.error('获取详情失败!!!');