<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="126px" class="demo-ruleForm">
<el-form-item label="登录密码" prop="password">
<el-input v-model="ruleForm.password"></el-input>
</el-form-item>
<el-form-item label="确认密码" prop="confirmPassword">
<el-input v-model="ruleForm.confirmPassword"></el-input>
</el-form-item>
<el-form-item label="姓名" prop="name">
<el-input v-model="ruleForm.name"></el-input>
</el-form-item>
<el-form-item label="身份证号" prop="IDcard">
<el-input v-model="ruleForm.IDcard"></el-input>
</el-form-item>
<el-form-item label="性别" prop="sex">
<el-radio-group v-model="ruleForm.sex">
<el-radio label="男"></el-radio>
<el-radio label="女"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="是否地方专家库专家" prop="isexpert">
<el-select v-model="ruleForm.isexpert" placeholder="请选择">
<el-option label="是" value="1"></el-option>
<el-option label="否" value="0"></el-option>
</el-select>
</el-form-item>
<el-form-item label="选择省份" v-show="ruleForm.isexpert == 1">
<dsf-view-part path="/pc/nc/userinfo/sublist" style="height: 300px"></dsf-view-part>
</el-form-item>
<el-form-item label="工作单位" prop="unit">
<el-input v-model="ruleForm.unit"></el-input>
</el-form-item>
<el-form-item label="工作单位统一社会信用代码" prop="code">
<el-input v-model="ruleForm.code"></el-input>
</el-form-item>
<el-form-item label="单位所在地" prop="address">
<el-input v-model="ruleForm.address"></el-input>
</el-form-item>
<el-form-item label="手机号" prop="phone">
<el-input v-model="ruleForm.phone"></el-input>
</el-form-item>
<el-form-item label="验证码" prop="phoneCode" class="codeInput-item">
<el-input v-model="ruleForm.phoneCode" class="codeInput"></el-input>
<img v-if="imgCode" :src="imgCode" alt="" class="img-code" @click="getImgCode()" />
</el-form-item>
<el-form-item label="电子邮箱" prop="email">
<el-input v-model="ruleForm.email"></el-input>
</el-form-item>
<el-form-item>
<el-button class="subBtn" type="primary" @click="onSubmit('ruleForm')">注册</el-button>
</el-form-item>
</el-form>
// 中名验证
var chnName = (rule, value, callback) => {
if (!value) {
callback(new Error("请输入中文名"));
} else {
const reg = /^[\u4e00-\u9fa5]+$/;
if (value.length < 100 && reg.test(value)) {
callback();
} else {
return callback(new Error("请输入正确的中文名"));
}
}
};
// 身份证
var checkIdNum = function (rule, value, callback) {
const reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
if (!value) {
return callback(new Error("证件号码不能为空"));
} else if (!reg.test(value)) {
return callback(new Error("证件号码不正确"));
} else {
callback();
}
};
// 手机号
var validatorPhone = function (rule, value, callback) {
if (value === "") {
callback(new Error("手机号不能为空"));
} else if (!/^1\d{10}$/.test(value)) {
callback(new Error("手机号格式错误"));
} else {
callback();
}
};
data() {
// 密码
const ToPassword = (rule, value, callback) => {
if (value === "") {
callback(new Error("密码不能为空"));
} else if (!/^(?=.*[0-9])(?=.*[A-Z])(?=.*[a-z])(.{8,20})$/.test(value)) {
callback(new Error("密码设置8到20位,必须包含大写字母、小写字母、数字"));
} else {
callback();
}
};
// 确认密码
const equalToPassword = (rule, value, callback) => {
console.log(666);
if (this.ruleForm.password !== value) {
callback(new Error("两次输入的密码不一致"));
} else {
callback();
}
};
}
rules: {
password: [
{ required: true, message: "请输入密码", trigger: "blur" },
{ required: true, validator: ToPassword, trigger: "blur" },
// { min: 3, max: 5, message: "长度在 3 到 5 个字符", trigger: "blur" },
],
confirmPassword: [
{ required: true, message: "确认密码不能为空", trigger: "blur" },
{ required: true, validator: equalToPassword, trigger: "blur" },
],
name: [
{ required: true, validator: chnName, message: "请输入姓名", trigger: "blur" },
// { min: 3, max: 5, message: "长度在 3 到 5 个字符", trigger: "blur" },
],
IDcard: [{ required: true, validator: checkIdNum, message: "请输入身份证号", trigger: "blur" }],
sex: [{ required: true, message: "请选择性别", trigger: "change" }],
isexpert: [{ required: true, message: "请选择", trigger: "change" }],
unit: [{ required: true, message: "请输入工作单位", trigger: "blur" }],
code: [{ required: true, message: "请输入工作单位统一社会信用代码", trigger: "blur" }],
address: [
{ required: true, message: "请输入单位所在地", trigger: "blur" },
{ min: 2, max: 20, message: "长度在 2 到 20 个字符", trigger: "blur" },
],
phone: [{ required: true, validator: validatorPhone, message: "请输入手机号", trigger: "blur" }],
phoneCode: [
{ required: true, message: "请输入验证码", trigger: "blur" },
{ min: 4, max: 4, message: "请输入4位数字的验证码", trigger: "blur" },
],
email: [{ type: "email", required: true, message: "请输入邮箱", trigger: "blur" }],
},
?
|