demo22.js 7.3 KB

1
  1. import{c as k,T as h}from"./mobile.js";import{a as C,m as U,r as s,e as M,j as e,k as o,g as n,o as $,f as p,v as f,l as m}from"./vendor.js";import{_ as q}from"./index.js";const{createDemo:j}=k("form"),T=j({props:{},setup(){const u=C({name:"",age:"",tel:"",address:""}),t=d=>{console.log(d)},D=C({switch:!1,checkbox:!1,radio:0,number:0,rate:3,range:30,address:"",defaultFileList:[{name:"\u6587\u4EF61.png",url:"https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif",status:"success",message:"\u4E0A\u4F20\u6210\u529F",type:"image"},{name:"\u6587\u4EF62.png",url:"https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif",status:"uploading",message:"\u4E0A\u4F20\u4E2D...",type:"image"}]}),r=C({state:{show:!1,province:[{id:1,name:"\u5317\u4EAC"},{id:2,name:"\u5E7F\u897F"},{id:3,name:"\u6C5F\u897F"},{id:4,name:"\u56DB\u5DDD"}],city:[{id:7,name:"\u671D\u9633\u533A"},{id:8,name:"\u5D07\u6587\u533A"},{id:9,name:"\u660C\u5E73\u533A"},{id:6,name:"\u77F3\u666F\u5C71\u533A"}],country:[{id:3,name:"\u516B\u91CC\u5E84\u8857\u9053"},{id:9,name:"\u5317\u82D1"},{id:4,name:"\u5E38\u8425\u4E61"}],town:[]},methods:{show(){r.state.show=!r.state.show,r.state.show&&(D.address="")},onChange({custom:d,next:i,value:g}){D.address+=g.name,r.state[i].length<1&&(r.state.show=!1)}}}),F=U(null);return{ruleForm:F,formData:u,validate:t,customValidator:d=>/^\d+$/.test(d),asyncValidator:d=>new Promise(i=>{h.loading("\u6A21\u62DF\u5F02\u6B65\u9A8C\u8BC1\u4E2D..."),setTimeout(()=>{h.hide(),i(/^400(-?)[0-9]{7}$|^1\d{10}$|^0[0-9]{2,3}-[0-9]{7,8}$/.test(d))},1e3)}),submit:()=>{F.value.validate().then(({valid:d,errors:i})=>{d?console.log("success",u):console.log("error submit!!",i)})},reset:()=>{F.value.reset()},formData2:D,addressModule:r}}}),z={class:"demo full"},L=n("h2",null,"\u57FA\u672C\u7528\u6CD5",-1),N=n("input",{class:"nut-input-text",placeholder:"\u8BF7\u8F93\u5165\u59D3\u540D",type:"text"},null,-1),P=n("input",{class:"nut-input-text",placeholder:"\u8BF7\u8F93\u5165\u5E74\u9F84",type:"text"},null,-1),G=n("input",{class:"nut-input-text",placeholder:"\u8BF7\u8F93\u5165\u8054\u7CFB\u7535\u8BDD",type:"text"},null,-1),H=n("input",{class:"nut-input-text",placeholder:"\u8BF7\u8F93\u5165\u5730\u5740",type:"text"},null,-1),I=n("h2",null,"\u8868\u5355\u6821\u9A8C",-1),J=m("\u63D0\u4EA4"),K=m("\u91CD\u7F6E\u63D0\u793A\u72B6\u6001"),O=n("h2",null,"\u8868\u5355\u7C7B\u578B",-1),Q=m("\u590D\u9009\u6846"),R=m("\u9009\u98791"),S=m("\u9009\u98792"),W=m("\u9009\u98793");function X(u,t,D,r,F,_){const l=s("nut-form-item"),c=s("nut-form"),B=s("nut-button"),d=s("nut-cell"),i=s("nut-switch"),g=s("nut-checkbox"),b=s("nut-radio"),V=s("nut-radiogroup"),E=s("nut-rate"),y=s("nut-inputnumber"),v=s("nut-range"),w=s("nut-uploader"),A=s("nut-address");return $(),M("div",z,[L,e(c,null,{default:o(()=>[e(l,{label:"\u59D3\u540D"},{default:o(()=>[N]),_:1}),e(l,{label:"\u5E74\u9F84"},{default:o(()=>[P]),_:1}),e(l,{label:"\u8054\u7CFB\u7535\u8BDD"},{default:o(()=>[G]),_:1}),e(l,{label:"\u5730\u5740"},{default:o(()=>[H]),_:1})]),_:1}),I,e(c,{"model-value":u.formData,ref:"ruleForm"},{default:o(()=>[e(l,{label:"\u59D3\u540D",prop:"name",required:"",rules:[{required:!0,message:"\u8BF7\u586B\u5199\u59D3\u540D"}]},{default:o(()=>[p(n("input",{class:"nut-input-text","onUpdate:modelValue":t[0]||(t[0]=a=>u.formData.name=a),placeholder:"\u8BF7\u8F93\u5165\u59D3\u540D",type:"text"},null,512),[[f,u.formData.name]])]),_:1}),e(l,{label:"\u5E74\u9F84",prop:"age",required:"",rules:[{required:!0,message:"\u8BF7\u586B\u5199\u5E74\u9F84"},{validator:u.customValidator,message:"\u5FC5\u987B\u8F93\u5165\u6570\u5B57"},{regex:/^(\d{1,2}|1\d{2}|200)$/,message:"\u5FC5\u987B\u8F93\u51650-200\u533A\u95F4"}]},{default:o(()=>[p(n("input",{class:"nut-input-text","onUpdate:modelValue":t[1]||(t[1]=a=>u.formData.age=a),placeholder:"\u8BF7\u8F93\u5165\u5E74\u9F84\uFF0C\u5FC5\u987B\u6570\u5B57\u4E140-200\u533A\u95F4",type:"text"},null,512),[[f,u.formData.age]])]),_:1},8,["rules"]),e(l,{label:"\u8054\u7CFB\u7535\u8BDD",prop:"tel",required:"",rules:[{required:!0,message:"\u8BF7\u586B\u5199\u8054\u7CFB\u7535\u8BDD"},{validator:u.asyncValidator,message:"\u7535\u8BDD\u683C\u5F0F\u4E0D\u6B63\u786E"}]},{default:o(()=>[p(n("input",{class:"nut-input-text","onUpdate:modelValue":t[2]||(t[2]=a=>u.formData.tel=a),placeholder:"\u8BF7\u8F93\u5165\u8054\u7CFB\u7535\u8BDD\uFF0C\u5F02\u6B65\u6821\u9A8C\u7535\u8BDD\u683C\u5F0F",type:"text"},null,512),[[f,u.formData.tel]])]),_:1},8,["rules"]),e(l,{label:"\u5730\u5740",prop:"address",required:"",rules:[{required:!0,message:"\u8BF7\u586B\u5199\u5730\u5740"}]},{default:o(()=>[p(n("input",{class:"nut-input-text","onUpdate:modelValue":t[3]||(t[3]=a=>u.formData.address=a),placeholder:"\u8BF7\u8F93\u5165\u5730\u5740",type:"text"},null,512),[[f,u.formData.address]])]),_:1}),e(d,null,{default:o(()=>[e(B,{type:"primary",size:"small",style:{"margin-right":"10px"},onClick:u.submit},{default:o(()=>[J]),_:1},8,["onClick"]),e(B,{size:"small",onClick:u.reset},{default:o(()=>[K]),_:1},8,["onClick"])]),_:1})]),_:1},8,["model-value"]),O,e(c,null,{default:o(()=>[e(l,{label:"\u5F00\u5173"},{default:o(()=>[e(i,{modelValue:u.formData2.switch,"onUpdate:modelValue":t[4]||(t[4]=a=>u.formData2.switch=a)},null,8,["modelValue"])]),_:1}),e(l,{label:"\u590D\u9009\u6846"},{default:o(()=>[e(g,{modelValue:u.formData2.checkbox,"onUpdate:modelValue":t[5]||(t[5]=a=>u.formData2.checkbox=a)},{default:o(()=>[Q]),_:1},8,["modelValue"])]),_:1}),e(l,{label:"\u5355\u9009\u6309\u94AE"},{default:o(()=>[e(V,{direction:"horizontal",modelValue:u.formData2.radio,"onUpdate:modelValue":t[6]||(t[6]=a=>u.formData2.radio=a)},{default:o(()=>[e(b,{label:"1"},{default:o(()=>[R]),_:1}),e(b,{disabled:"",label:"2"},{default:o(()=>[S]),_:1}),e(b,{label:"3"},{default:o(()=>[W]),_:1})]),_:1},8,["modelValue"])]),_:1}),e(l,{label:"\u8BC4\u5206"},{default:o(()=>[e(E,{modelValue:u.formData2.rate,"onUpdate:modelValue":t[7]||(t[7]=a=>u.formData2.rate=a)},null,8,["modelValue"])]),_:1}),e(l,{label:"\u6B65\u8FDB\u5668"},{default:o(()=>[e(y,{modelValue:u.formData2.number,"onUpdate:modelValue":t[8]||(t[8]=a=>u.formData2.number=a)},null,8,["modelValue"])]),_:1}),e(l,{label:"\u6ED1\u5757"},{default:o(()=>[e(v,{"hidden-tag":"",modelValue:u.formData2.range,"onUpdate:modelValue":t[9]||(t[9]=a=>u.formData2.range=a)},null,8,["modelValue"])]),_:1}),e(l,{label:"\u6587\u4EF6\u4E0A\u4F20"},{default:o(()=>[e(w,{url:"http://\u670D\u52A1\u5730\u5740","file-list":u.formData2.defaultFileList,"onUpdate:file-list":t[10]||(t[10]=a=>u.formData2.defaultFileList=a),maximum:"3",multiple:""},null,8,["file-list"])]),_:1}),e(l,{label:"\u5730\u5740"},{default:o(()=>[p(n("input",{class:"nut-input-text","onUpdate:modelValue":t[11]||(t[11]=a=>u.formData2.address=a),onClick:t[12]||(t[12]=(...a)=>u.addressModule.methods.show&&u.addressModule.methods.show(...a)),readonly:"",placeholder:"\u8BF7\u9009\u62E9\u5730\u5740",type:"text"},null,512),[[f,u.formData2.address]]),e(A,{visible:u.addressModule.state.show,"onUpdate:visible":t[13]||(t[13]=a=>u.addressModule.state.show=a),province:u.addressModule.state.province,city:u.addressModule.state.city,country:u.addressModule.state.country,town:u.addressModule.state.town,onChange:u.addressModule.methods.onChange,"custom-address-title":"\u8BF7\u9009\u62E9\u6240\u5728\u5730\u533A"},null,8,["visible","province","city","country","town","onChange"])]),_:1})]),_:1})])}var uu=q(T,[["render",X]]);export{uu as default};