表单校验方式（手机号，固定电话，邮箱，营业执照，银行卡号）

最近在做后台的用户信息整理，要用到一些表单校验，在之前没有处理过营业执照这种的表单校验，正好借此机会整理一下，欢迎大佬们提出宝贵意见。

表单引入：

<FormItem label="联系人手机" prop="liaisonPhoneNumber">
    <Input v-model.trim="newForm.liaisonPhoneNumber" clearable placeholder="请输入联系人手机"></Input>
</FormItem>
<FormItem label="固定电话" prop="fixedPhone">
    <Input v-model.trim="newForm.fixedPhone" clearable placeholder="请输入固定电话"></Input>
</FormItem>
<FormItem label="电子邮箱" prop="email">
    <Input v-model.trim="newForm.email" clearable placeholder="请输入电子邮箱"></Input>
</FormItem>
<FormItem label="营业执照" prop="businessLicenseNum">
<Input v-model.trim="newForm.businessLicenseNum" clearable placeholder="请输入营业执照"  @keyup.native="valueRegexOfN($event, 'businessLicenseNum')"></Input>
</FormItem>
<FormItem label="银行账号" prop="accCard">
<Input v-model.trim="newForm.accCard" clearable placeholder="请输入银行账号" @on-keyup="(event) => formatBankNo('accCard', event)"></Input>
</FormItem>

js表单验证：

const validatePhone = (rule, value, callback) => {
    let regTest = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
    if (!value) {
        callback(new Error("手机号码不能为空"));
    } else {
        if (!regTest.test(value)) {
            callback(new Error("手机号码格式不正确"));
            return;
        }
        callback();
    }
};
const validatefixedPhone = (rule, value, callback) => {
    let regTest = /((\d{11})|^((\d{7,8})|(\d{4}|\d{3})-(\d{7,8})|(\d{4}|\d{3})-(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1})|(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1}))$)/;
    if (!value) {
        callback(new Error("固定电话不能为空"));
    } else {
        if (!regTest.test(value)) {
            callback(new Error("固定电话格式不正确"));
            return;
        }
        callback();
    }
};
const validateEmail = (rule, value, callback) => {
    let regTest = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
    if (!value) {
        callback(new Error("邮箱不能为空"));
    } else {
        if (!regTest.test(value)) {
            callback(new Error("电子邮箱格式不正确"));
            return;
        }
        callback();
    }
};
const validateBusiness = (rule, value, callback) => {
    var patrn = /^[0-9A-Z]+$/;
    //18位校验及大写校验
    if ((value.length != 18) || (patrn.test(value) == false)) {
        callback(new Error("营业执照格式不正确"));
    } else {
        var Ancode;//统一社会信用代码的每一个值
        var Ancodevalue;//统一社会信用代码每一个值的权重
        var total = 0;
        var weightedfactors = [1, 3, 9, 27, 19, 26, 16, 17, 20, 29, 25, 13, 8, 24, 10, 30, 28];//加权因子
        var str = '0123456789ABCDEFGHJKLMNPQRTUWXY';
        //不用I、O、S、V、Z
        for (var i = 0; i < value.length - 1; i++) {
            Ancode = value.substring(i, i + 1);
            Ancodevalue = str.indexOf(Ancode);
            total = total + Ancodevalue * weightedfactors[i];
            //权重与加权因子相乘之和
        }
        var logiccheckcode = 31 - total % 31;
        if (logiccheckcode == 31) {
            logiccheckcode = 0;
        }
        var Str = "0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F,G,H,J,K,L,M,N,P,Q,R,T,U,W,X,Y";
        var Array_Str = Str.split(',');
        logiccheckcode = Array_Str[logiccheckcode];
        var checkcode = value.substring(17, 18);
        if (logiccheckcode != checkcode) {
            callback(new Error("营业执照格式不正确"));
        } else {
            callback();
        }
    }
};
const validateAccCard = (rule, value, callback) => {
    let regTest16 = /^.{19}$/;
    let regTest19 = /^.{23}$/;
    if (!value) {
        callback(new Error("请输入银行卡号"));
    } else {
        if (regTest16.test(value) || regTest19.test(value)) {
            callback();
        } else {
            callback("银行卡号格式不正确");
        }
        callback();
    }
};

data中定义规则：

formRules: {
    liaisonPhoneNumber: [{ required: true, validator: validatePhone, trigger: "blur" }],
    fixedPhone: [{ required: true, validator: validatefixedPhone, trigger: "blur", }],
    email: [{ required: true, validator: validateEmail, trigger: "blur", }],
    businessLicenseNum: [{ required: true, validator: validateBusiness, trigger: "blur" }],
    accCard: [{ required: true, validator: validateAccCard, trigger: "blur" }],
},

另外营业执照和银行卡号用到的输入框的方法：

//中英文、数字
valueRegexOfN(e, key) {
    const o = e.target;
    o.value = o.value
        .replace(/[^0-9]+$/g, "")
        .replace(/\s+/g, "");
    if (this.newForm) {
        this.newForm[key] = o.value;
    }
},

// 银行卡号
formatBankNo (key, e){
    const o = e.target;
    if (o.value == "") return;
    var account = new String (o.value);
    account = account.substring(0,23); /*帐号的总数, 包括空格在内 */
    if (account.match (".[0-9]{4}-[0-9]{4}-[0-9]{4}-[0-9]{7}") == null){
        /* 对照格式 */
        if (account.match (".[0-9]{4}-[0-9]{4}-[0-9]{4}-[0-9]{7}|" + ".[0-9]{4}-[0-9]{4}-[0-9]{4}-[0-9]{7}|" +
        ".[0-9]{4}-[0-9]{4}-[0-9]{4}-[0-9]{7}|" + ".[0-9]{4}-[0-9]{4}-[0-9]{4}-[0-9]{7}") == null){
            var accountNumeric = "";
            var accountChar = "";
            for (var i=0;i<account.length;i++){
                accountChar = account.substr (i,1);
                if (!isNaN (accountChar) && (accountChar != " ")) accountNumeric = accountNumeric + accountChar;
            }
            account = "";
            for (i=0;i<accountNumeric.length;i++){    /* 可将以下空格改为-,效果也不错 */
                if (i == 4) account = account + " "; /* 帐号第四位数后加空格 */
                if (i == 8) account = account + " "; /* 帐号第八位数后加空格 */
                if (i == 12) account = account + " ";/* 帐号第十二位后数后加空格 */
                if (i == 16) account = account + " ";/* 帐号第十六位后数后加空格 */
                account = account + accountNumeric.substr (i,1)
            }
        }
    } else {
        account = " " + account.substring (1,5) + " " + account.substring (6,10) + " " + account.substring (14,18) + "-" + account.substring(18,25);
    }
    if (account != o.value) {
        o.value = account;
        this.newForm[key] = o.value;
    }
},