blog-web/js/other-verificate.52379d92.js

"use strict";(self["webpackChunkscui"]=self["webpackChunkscui"]||[]).push([[7218],{1411:function(e,l,r){r.r(l),r.d(l,{default:function(){return n}});var a=r(641);function u(e,l,r,u,o,t){const d=(0,a.g2)("el-input"),m=(0,a.g2)("el-form-item"),s=(0,a.g2)("el-button"),n=(0,a.g2)("el-form"),i=(0,a.g2)("el-card"),f=(0,a.g2)("el-alert"),p=(0,a.g2)("el-main");return(0,a.uX)(),(0,a.Wv)(p,null,{default:(0,a.k6)((()=>[(0,a.bF)(i,{shadow:"never",header:"async-validator内置"},{default:(0,a.k6)((()=>[(0,a.bF)(n,{ref:"form",model:o.form,rules:o.rules,"label-width":"100px","status-icon":""},{default:(0,a.k6)((()=>[(0,a.bF)(m,{label:"必填",prop:"required"},{default:(0,a.k6)((()=>[(0,a.bF)(d,{modelValue:o.form.required,"onUpdate:modelValue":l[0]||(l[0]=e=>o.form.required=e)},null,8,["modelValue"])])),_:1}),(0,a.bF)(m,{label:"长度",prop:"length"},{default:(0,a.k6)((()=>[(0,a.bF)(d,{modelValue:o.form.length,"onUpdate:modelValue":l[1]||(l[1]=e=>o.form.length=e),placeholder:"长度需为3位"},null,8,["modelValue"])])),_:1}),(0,a.bF)(m,{label:"类型",prop:"type"},{default:(0,a.k6)((()=>[(0,a.bF)(d,{modelValue:o.form.type,"onUpdate:modelValue":l[2]||(l[2]=e=>o.form.type=e),placeholder:"类型可为string number boolean array date url email等"},null,8,["modelValue"])])),_:1}),(0,a.bF)(m,{label:"范围",prop:"range"},{default:(0,a.k6)((()=>[(0,a.bF)(d,{modelValue:o.form.range,"onUpdate:modelValue":l[3]||(l[3]=e=>o.form.range=e),placeholder:"请填写范围在3至5位"},null,8,["modelValue"])])),_:1}),(0,a.bF)(m,{label:"枚举",prop:"enum"},{default:(0,a.k6)((()=>[(0,a.bF)(d,{modelValue:o.form.enum,"onUpdate:modelValue":l[4]||(l[4]=e=>o.form.enum=e),placeholder:"请填写admin，user，guest其一"},null,8,["modelValue"])])),_:1}),(0,a.bF)(m,{label:"自定义",prop:"custom"},{default:(0,a.k6)((()=>[(0,a.bF)(d,{modelValue:o.form.custom,"onUpdate:modelValue":l[5]||(l[5]=e=>o.form.custom=e),placeholder:"请填写数字1"},null,8,["modelValue"])])),_:1}),(0,a.bF)(m,{label:"异步验证",prop:"async"},{default:(0,a.k6)((()=>[(0,a.bF)(d,{modelValue:o.form.async,"onUpdate:modelValue":l[6]||(l[6]=e=>o.form.async=e),placeholder:"请输入SCUI最新版本号,form开启status-icon后 可以查看右侧状态"},null,8,["modelValue"])])),_:1}),(0,a.bF)(m,null,{default:(0,a.k6)((()=>[(0,a.bF)(s,{type:"primary",onClick:t.submit},{default:(0,a.k6)((()=>[(0,a.eW)("验证所有字段")])),_:1},8,["onClick"]),(0,a.bF)(s,{onClick:l[7]||(l[7]=e=>t.resetForm("form"))},{default:(0,a.k6)((()=>[(0,a.eW)("Reset")])),_:1})])),_:1})])),_:1},8,["model","rules"])])),_:1}),(0,a.bF)(i,{shadow:"never",header:"自定义",style:{"margin-top":"15px"}},{default:(0,a.k6)((()=>[(0,a.bF)(n,{ref:"form2",model:o.form2,rules:o.rules2,"label-width":"100px","status-icon":""},{default:(0,a.k6)((()=>[(0,a.bF)(m,{label:"手机号码",prop:"phone"},{default:(0,a.k6)((()=>[(0,a.bF)(d,{modelValue:o.form2.phone,"onUpdate:modelValue":l[8]||(l[8]=e=>o.form2.phone=e)},null,8,["modelValue"])])),_:1}),(0,a.bF)(m,{label:"车牌号码",prop:"cars"},{default:(0,a.k6)((()=>[(0,a.bF)(d,{modelValue:o.form2.cars,"onUpdate:modelValue":l[9]||(l[9]=e=>o.form2.cars=e)},null,8,["modelValue"])])),_:1}),(0,a.bF)(m,null,{default:(0,a.k6)((()=>[(0,a.bF)(s,{type:"primary",onClick:t.submit2},{default:(0,a.k6)((()=>[(0,a.eW)("验证所有字段")])),_:1},8,["onClick"]),(0,a.bF)(s,{onClick:l[10]||(l[10]=e=>t.resetForm("form2"))},{default:(0,a.k6)((()=>[(0,a.eW)("Reset")])),_:1})])),_:1})])),_:1},8,["model","rules"]),(0,a.bF)(f,{title:"自定义验证可在 @/utils/verificate.js 中不断扩展业务需要的验证. 记得要 import 进来",type:"success"})])),_:1})])),_:1})}function o(e,l,r){let a=/^[1][3, 4, 5, 6, 7, 8, 9][0-9]{9}$/;if(!a.test(l))return r(new Error("请输入正确的手机号码"));r()}function t(e,l,r){let a=/^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领][A-HJ-NP-Z][A-HJ-NP-Z0-9]{4,5}[A-HJ-NP-Z0-9挂学警港澳]$/;if(!a.test(l))return r(new Error("请输入正确的车牌号码"));r()}var d={name:"verificate",data(){return{form:{},rules:{required:[{required:!0,message:"请填写"}],length:[{required:!0,len:3,message:"长度需为3位"}],type:[{required:!0,type:"email",message:"类型需为email"}],range:[{required:!0,min:3,max:5,message:"范围在3至5位"}],enum:[{required:!0,type:"enum",enum:["admin","user","guest"],message:"请填写admin，user，guest其一"}],custom:[{required:!0,validator:(e,l)=>"1"===l,message:"请填写数字1",trigger:"blur"}],async:[{required:!0,validator:(e,l,r)=>{this.$API.demo.ver.get({value:l}).then((e=>{if(e.data!=l)return r(new Error("请输入SCUI最新版本号："+e.data));r()}))},trigger:"blur"}]},form2:{},rules2:{phone:[{required:!0,message:"请输入姓名"},{validator:o,trigger:"blur"}],cars:[{required:!0,validator:t,trigger:"blur"}]}}},mounted(){},methods:{submit(){this.$refs.form.validate((async e=>{if(!e)return!1;this.$message.success("全部验证通过")}))},submit2(){this.$refs.form2.validate((async e=>{if(!e)return!1;this.$message.success("全部验证通过")}))},resetForm(e){this.$refs[e].resetFields()}}},m=r(6262);const s=(0,m.A)(d,[["render",u]]);var n=s}}]);