bug修复

src/api/login.js

@@ -8,6 +8,10 @@ let api = {}
 api.userLogin = function (data) {
   return req.post('/common/login', data)
 }
+// 获取登录配置
+api.getLoginConfig = function (data) {
+  return req.post('/common/getLoginConfig', data)
+}
 //查询当前语言
 api.getLanguageL = function (data) {
   return req.post(`/web/getLanguage`, data)

src/views/index/components/form.vue

@@ -28,51 +28,35 @@
             :value="item.value"
             v-for="(item, index) in this.options.idType"
             :key="index"
-          >
-            {{ item.name }}
-          </a-select-option>
+          >{{ item.name }}</a-select-option>
         </a-select>
       </a-form-model-item>
       <a-form-model-item ref="idNo" label="证件号" prop="idNo">
-        <a-input
-          v-model="form.idNo"
-          @blur="
-            () => {
-              $refs.idNo.onFieldBlur()
-            }
-          "
-        />
+        <a-input v-model="form.idNo" @blur="handleIdCardBlur" />
       </a-form-model-item>
       <a-form-model-item label="性别" prop="sex">
         <a-radio-group v-model="form.sex">
-          <a-radio value="M"> 男 </a-radio>
-          <a-radio value="F"> 女</a-radio>
+          <a-radio value="M">男</a-radio>
+          <a-radio value="F">女</a-radio>
         </a-radio-group>
       </a-form-model-item>
-      <a-form-model-item label="生日日期" prop="birthDate">
+      <a-form-model-item label="出生日期" prop="birthDate">
         <a-date-picker
           v-model="form.birthDate"
           @change="onChange"
           type="date"
-          placeholder="选择生日"
+          placeholder="选择出生日期"
           style="width: 100%"
         />
       </a-form-model-item>
       <a-form-model-item label="婚姻状况" prop="maritalStatus">
         <a-radio-group v-model="form.maritalStatus">
-          <a-radio value="1">未婚 </a-radio>
+          <a-radio value="1">未婚</a-radio>
           <a-radio value="2">已婚</a-radio>
         </a-radio-group>
       </a-form-model-item>
       <a-form-model-item ref="name" label="联系电话" prop="phone">
-        <a-input
-          v-model="form.phone"
-          @blur="
-            () => {
-              $refs.name.onFieldBlur()
-            }
-          "
-        />
+        <a-input v-model="form.phone" @blur="checkPhone" />
       </a-form-model-item>
       <a-form-model-item :wrapper-col="{ span: 14, offset: 4 }">
         <a-button type="primary" @click="onSubmit">立即预约</a-button>
@@ -82,114 +66,160 @@
 </template>
 
 <script>
-import api from '@/api/customer'
-import options from '@/utils/options'
+const regIdCard = /^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$)$/;
+const phoneReg = /^((0\d{2,3}-?\d{7,8})|(1[3465789]\d{9}))$/;
+import api from "@/api/customer";
+import options from "@/utils/options";
 export default {
-  name: 'self-form',
+  name: "self-form",
   components: {},
   data() {
     return {
       options: {},
       labelCol: { span: 4 },
       wrapperCol: { span: 14 },
-      other: '',
+      other: "",
       form: {
-        id: '',
-        name: '', //名字
-        idType: '1', //证件类型,默认身份证件
-        idNo: '', //证件号
-        sex: 'M', //性别 M男 F女
-        phone: '', //电话
-        birthDate: '', //生日
-        maritalStatus: '1', //婚姻 01:未婚，02:已婚, 03:未知
+        id: "",
+        name: "", //名字
+        idType: "1", //证件类型,默认身份证件
+        idNo: "", //证件号
+        sex: "M", //性别 M男 F女
+        phone: "", //电话
+        birthDate: "", //生日
+        maritalStatus: "1" //婚姻 01:未婚，02:已婚, 03:未知
       },
       rules: {
         name: [
           {
             required: true,
-            message: '请输入姓名',
-            trigger: 'blur',
+            message: "请输入姓名",
+            trigger: "blur"
           },
           {
             max: 5,
-            message: '姓名长度不低于3',
-            trigger: 'blur',
-          },
+            message: "姓名长度不低于3",
+            trigger: "blur"
+          }
         ],
         idType: [
           {
             required: true,
-            message: '请选择证件类型',
-            trigger: 'change',
-          },
+            message: "请选择证件类型",
+            trigger: "change"
+          }
         ],
         idNo: [
           {
             required: true,
-            message: '请输入证件号',
-            trigger: 'blur',
-          },
+            message: "请输入证件号",
+            trigger: "blur"
+          }
         ],
         phone: [
           {
             required: true,
-            message: '请输入手机号吗',
-            trigger: 'blur',
-          },
-        ],
-      },
+            message: "请输入手机号码",
+            trigger: "blur"
+          }
+        ]
       }
+    };
   },
   created() {
-    const { id } = this.$route.query
-    this.form.id = id ? id : ''
-    this.options = options //下拉选项数据集合:包括证件类型/婚姻状况/性别等
+    const { id } = this.$route.query;
+    this.form.id = id ? id : "";
+    this.options = options; //下拉选项数据集合:包括证件类型/婚姻状况/性别等
   },
   computed: {},
   methods: {
     // 立即预约
     onSubmit() {
-      this.$refs.ruleForm.validate((valid) => {
+      this.$refs.ruleForm.validate(valid => {
         if (valid) {
           const query = {
-            ...this.form,
-          }
-          api.improveInformation(query).then((res) => {
-            if (res.returnCode == '0000') {
+            ...this.form
+          };
+          api.improveInformation(query).then(res => {
+            if (res.returnCode == "0000") {
               // 提交成功之后,提示成功信息,关闭"个人信息填写弹窗",并刷新当前页面
-              this.$message.success('提交信息成功')
+              this.$message.success("提交信息成功");
               setTimeout(() => {
-                this.$emit('hideModal')
+                this.$emit("hideModal");
                 // 刷新列表
-              }, 1500)
+              }, 1500);
             } else {
-              this.$message.error(res.returnMsg)
+              this.$message.error(res.returnMsg);
             }
-          })
+          });
         } else {
-          console.log('error submit!!')
-          return false
+          console.log("error submit!!");
+          return false;
         }
-      })
+      });
     },
     // 下拉选项
     handleChange(value) {
-      console.log(`selected ${value}`)
+      console.log(`selected ${value}`);
     },
-    // 选择生日
-    onChange(date, dateString) {
-      this.form.birthDate = dateString
+    checkIdNumber(val) {
+      return regIdCard.test(val);
     },
+    checkPhone() {
+      let val = this.form.phone
+      if (!phoneReg.test(val)) {
+        this.$message.error("请输入手机号码不正确");
+        this.form.phone = "";
+      }
     },
-}
+    handleIdCardBlur() {
+      // 填完身份证根据身份证自动带出生日跟性别
+      const type = this.form.idType;
+      const value = this.form.idNo;
+      if (type != "1") {
+        return;
+      }
+      if (this.checkIdNumber(value)) {
+        const { birth, sex } = this.calcBGByIdCardNumber(value);
+        this.form.sex = sex;
+        this.form.birthDate = birth;
+      } else {
+        this.$message.error("身份证号不正确");
+        this.form.idNo = "";
+      }
+    },
+    calcBGByIdCardNumber(idNumber) {
+      // 根据身份证自动带出生日跟性别
+      const year = idNumber.slice(6, 10);
+      const mon = idNumber.slice(10, 12);
+      const day = idNumber.slice(12, 14);
+      const birth = year + "-" + mon + "-" + day;
+      const sex = idNumber.slice(16, 17) % 2 == 1 ? "M" : "F";
+      return {
+        birth,
+        sex,
+        gender: sex
+      };
+    },
+    // 选择生日
+    onChange(date, dateString) {
+      this.form.birthDate = dateString;
+    }
+  }
+};
 </script>
-
+<style lang="less">
+.ant-form-item-label {
+  text-align: left;
+}
+</style>
 <style lang="less" scoped>
 ::v-deep .ant-btn {
   position: relative;
   left: 100px;
   width: 120px;
 }
+
 ::v-deep .ant-form-item-control {
   width: 360px;
 }

src/views/index/components/item.vue

@@ -4,33 +4,29 @@
       <div class="title">
         <span class="point"></span> {{ item.servicepackageName }}
       </div>
-      <div class="detail" @click="$router.push(item.detailUrl)">
-        <img :src="eyes" alt="" />点击查看体检套餐详情
+      <!-- $router.push(item.fileList[0]&&item.fileList[0].url) -->
+      <div class="detail" @click="openModel">
+        <img :src="eyes" alt="" />点击查看服务套餐详情
         <!-- {{item.fileList[0].url}} -->
       </div>
     </div>
     <div class="right">
-      <a-button
-        v-if="listType == 2"
-        style="background: #ffcc00; color: white; border: none; width: 86px"
-        @click="handleReadDetail"
-        >查看</a-button
-      >
-      <a-button
-        v-else
-        style="background: #3f7ffb; color: white; border: none; width: 86px"
-        @click="handleSubmit"
-        >立即预约</a-button
-      >
+      <a-button v-if="listType == 2" style="background: #ffcc00; color: white; border: none; width: 86px"
+        @click="handleReadDetail">查看</a-button>
+      <a-button v-else style="background: #3f7ffb; color: white; border: none; width: 86px" @click="handleSubmit">立即预约
+      </a-button>
       <div class="date">
         {{ listType == 1 ? (' 有效期至：'+item.validityEnd ): ('预约体检日期：'+item.customerAppDate) }}
       </div>
     </div>
+    <a-modal v-model="visible" width="1000px" :footer='null'>
+      <img style="width: 100%;padding: 20px 20px;" :src="item.fileList[0]&&item.fileList[0].url" alt="">
+    </a-modal>
   </div>
 </template>
 
 <script>
-export default {
+  export default {
     name: 'item',
     components: {},
     props: {
@@ -44,11 +40,12 @@ export default {
       },
       item: {
         type: Object,
-      default: () => {},
+        default: () => { },
       },
     },
     data() {
       return {
+        visible: false,
         eyes: require('@/assets/imgs/index/eyes.png'),
       }
     },
@@ -76,38 +73,46 @@ export default {
           },
         })
       },
+      openModel() {
+        this.visible = true
+      }
     },
-}
+  }
 </script>
 
 <style lang="less" scoped>
-.item {
+  .item {
     display: flex;
     justify-content: space-between;
     background: #fafafa;
     padding: 14.5px 12px;
     border-radius: 8px;
     margin-top: 12px;
+
     .right {
       text-align: right;
+
       .date {
         color: #999999;
         font-size: 14px;
         margin-top: 12px;
       }
     }
+
     .left {
       .title {
         color: #333333;
         font-size: 14px;
         font-weight: bold;
       }
+
       .detail {
         font-size: 14px;
         color: #999999;
         line-height: 30px;
         margin-top: 12px;
         cursor: pointer;
+
         img {
           position: relative;
           top: -2px;
@@ -115,5 +120,5 @@ export default {
         }
       }
     }
-}
+  }
 </style>
\ No newline at end of file

src/views/login/index.vue

 <template>
   <div class="login">
     <div class="header">
-      <img :src="logo" alt="" />
+      <img :src="logo" alt />
     </div>
     <div class="center">
       <div class="left">
-        <img :src="left" alt="" />
+        <img :src="left" alt />
       </div>
       <div class="right">
         <div class="logo">
-          <img :src="logo" alt="" />
+          <img :src="logo" alt />
         </div>
-        <div class="tips">账号密码登陆</div>
+        <div class="tips">健康服务预约</div>
         <div class="form">
           <a-form
             id="components-form-demo-normal-login"
@@ -27,18 +27,14 @@
                     rules: [
                       {
                         required: true,
-                        message: '请输入体检卡号码！',
+                        message: userNameHolder,
                       },
                     ],
                   },
                 ]"
-                placeholder="请输入体检卡号码"
+                :placeholder= 'userNameHolder'
               >
-                <a-icon
-                  slot="prefix"
-                  type="user"
-                  style="color: rgba(0, 0, 0, 0.25)"
-                />
+                <a-icon slot="prefix" type="user" style="color: rgba(0, 0, 0, 0.25)" />
               </a-input>
             </a-form-item>
             <a-form-item>
@@ -49,35 +45,26 @@
                     rules: [
                       {
                         required: true,
-                        message: '请输入卡号密码！',
+                        message: passwordHolder,
                       },
                     ],
                   },
                 ]"
                 type="password"
-                placeholder="请输入密码（默认身份证后6位）"
+                :placeholder="passwordHolder"
               >
-                <a-icon
-                  slot="prefix"
-                  type="lock"
-                  style="color: rgba(0, 0, 0, 0.25)"
-                />
+                <a-icon slot="prefix" type="lock" style="color: rgba(0, 0, 0, 0.25)" />
               </a-input>
             </a-form-item>
             <a-form-item>
               <!-- :disabled="isSub" -->
-              <a-button
-                type="primary"
-                html-type="submit"
-                class="login-form-button"
-              >
-                登陆
-              </a-button>
+              <a-button type="primary" html-type="submit" class="login-form-button">登陆</a-button>
             </a-form-item>
           </a-form>
           <div class="concat">
-            如果遇到操作问题，请拨打椋鸟健康热线
-            <span class="code">400-820-6523</span>
+            <!-- 如果遇到操作问题，请拨打椋鸟健康热线
+            <span class="code">400-820-6523</span> -->
+            <img :src="downImg" alt="">
           </div>
         </div>
       </div>
@@ -86,63 +73,113 @@
 </template>
 
 <script>
-import api from '@/api/login';
+import api from "@/api/login";
 export default {
   name: "login",
   components: {},
   data() {
     return {
-      logo: require("../../assets/imgs/login/logo.png"),
+      logo:"",
       left: require("../../assets/imgs/login/left-bg.png"),
+      downImg:'',
       isSub: true,
-      loading: false,//是否显示loading
+      passwordHolder:"",
+      userNameHolder:"",
+      fields:[],
+      loading: false //是否显示loading
     };
   },
   beforeCreate() {
     this.form = this.$form.createForm(this, { name: "normal_login" });
   },
+  created() {
+    // let url = location.href;
+    // let splitParmsArr = url.split("/");
+    // let idParms = splitParmsArr.slice(-1)[0];
 
+    this.getLoginConfigFn();
+  },
   methods: {
+    isNumber(val) {
+      //判断是否是数字
+      var regPos = /^\d+(\.\d+)?$/; //非负浮点数
+      var regNeg = /^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/; //负浮点数
+      if (regPos.test(val) && regNeg.test(val)) {
+        return true;
+      } else {
+        return false;
+      }
+    },
     // 控制提交是否可用
     subState() {
       this.isSub = false;
     },
+    getLoginConfigFn() {
+      const query = {
+        id: "1002" //暂时写死的
+      };
+      api.getLoginConfig(query).then(res => {
+        if(res.returnCode == '0000'){ //logo 配置
+          if(res.content.loginUp&&res.content.loginUp[0]){
+            this.logo = res.content.loginUp[0].url
+            this.logo = res.content.loginUp[0].url
+          }
+          if(res.content.loginDown&&res.content.loginDown[0]){ //电话说明配置
+            this.downImg = res.content.loginDown[0].url
+          }
+          if(res.content.lnhConfigs){
+            let lnhConfigs = res.content.lnhConfigs
+            this.fields = lnhConfigs
+            this.userNameHolder = `请输入`+lnhConfigs[0].remark
+            this.passwordHolder = `请输入`+lnhConfigs[1].remark
+          }
+        }
+      });
+    },
     handleSubmit(e) {
       e.preventDefault();
       this.form.validateFields((err, values) => {
         if (!err) {
-          console.log('登陆values=',values);
+          console.log("登陆values=", values);
           const query = {
-            id: "1002",//使用"体检卡口令"登陆,id必须是'1002',目前只有一种登陆方式,是写死的,后边会使用配置
-            fields:[
-              {fieldName: "体检卡口令", value: values.userName, field: "medical_test_word"},
-              {fieldName: "体检卡密码", value: values.password, field: "job_num"}
-            ]
+            id: "1002", //使用"体检卡口令"登陆,id必须是'1002',目前只有一种登陆方式,是写死的,后边会使用配置
+            fields: [
+              {
+                fieldName: this.fields[0].remark,
+                value: values.userName,
+                field: this.fields[0].field
+              },
+              {
+                fieldName:  this.fields[1].remark,
+                value: values.password,
+                field:  this.fields[1].field
               }
-          api.userLogin(query).then((res)=>{
+            ]
+          };
+          api.userLogin(query).then(res => {
             console.log(res);
-            if(res.returnCode == '0000'){
+            if (res.returnCode == "0000") {
               console.log("登陆成功");
               // 显示登陆成功-并跳转到index页面
-              this.$message.success('登陆成功');
+              this.$message.success("登陆成功");
               setTimeout(() => {
                 // 需要获取用户id
                 this.$router.push({
-                name:'Index',
-                query:{
-                  id:res.content.id
+                  name: "Index",
+                  query: {
+                    id: res.content.id
                   }
-              })
+                });
               }, 1000);
-            }else{
+            } else {
               this.$message.error(res.returnMsg);
             }
-          })
+          });
           console.log("Received values of form: ", values);
         }
       });
-    },
-  },
+    }
+  }
 };
 </script>
 
@@ -150,31 +187,44 @@ export default {
 .login {
   min-height: 100vh;
   background: url(../../assets/imgs/login/bg.png) 100%;
+
   .header {
     padding: 2.5px 21.5px;
     background: rgba(225, 225, 225, 0.32);
+    img{
+      width: 70px;
+      height: 50px;
     }
+  }
+
   .center {
     display: flex;
     justify-content: center;
     margin: 69.5px auto;
+
     .left {
       img {
         width: 320.5px;
       }
+
       position: relative;
       left: 27.5px;
       top: 58px;
     }
+
     .right {
       padding-bottom: 38px;
       position: relative;
       right: 27.5px;
+
       .tips {
         text-align: center;
         margin-bottom: 23.5px;
         margin-top: 5px;
+        font-family: Microsoft YaHei;
+        font-weight: 600;
       }
+
       .logo {
         width: 115.5px;
         height: 44.5px;
@@ -184,33 +234,43 @@ export default {
         margin: 0 auto;
 
         img {
-          width: 29.7px;
+          width: 40px;
           height: 29.7px;
           position: relative;
           top: 7px;
         }
+
         position: relative;
         top: -21px;
       }
+
       width: 340px;
       background: #ffffff;
       box-shadow: 0px 7px 14px 1px rgba(214, 207, 194, 0.14);
       border-radius: 12px;
+
       .concat {
         font-size: 12px;
         text-align: center;
         transform: scale(0.8);
+
         .code {
           color: #3f7ffb;
         }
+        img{
+          width: 100%;
+        }
       }
+
       .form {
         ::v-deep .ant-form {
           .ant-input {
             font-size: 12px;
           }
+
           width: 260.8px;
           margin: 0 auto;
+
           .login-form-button {
             width: 96%;
             position: relative;