officialAuthentication.vue 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. <template>
  2. <uni-section title="自定义校验规则" type="line">
  3. <view class="example">
  4. <!-- 自定义表单校验 -->
  5. <uni-forms ref="customForm" :rules="customRules" :modelValue="form">
  6. <uni-forms-item label="企业名称" required name="enterpriseName">
  7. <uni-easyinput v-model="form.enterpriseName" placeholder="请输入企业名称" />
  8. </uni-forms-item>
  9. <uni-forms-item label="法人姓名" required name="legalName">
  10. <uni-easyinput v-model="form.legalName" placeholder="请输入法人姓名" />
  11. </uni-forms-item>
  12. <uni-forms-item label="联系电话" required name="phone">
  13. <uni-easyinput v-model="form.phone" placeholder="请输入联系电话" />
  14. </uni-forms-item>
  15. <uni-forms-item label="证照信息" required name="path">
  16. <upload :imgArr="imageList" name="path" v-model="form.path" :fileSize="1" :limit="3" @updateImg="updateImg"></upload>
  17. </uni-forms-item>
  18. </uni-forms>
  19. <button type="primary" @click="submitForm('customForm')">提交</button>
  20. </view>
  21. </uni-section>
  22. </template>
  23. <script>
  24. import upload from '../../components/upload/index.vue'
  25. import {appletAdd} from '@/api/me/officialAuthentication.js'
  26. export default {
  27. components: {
  28. upload
  29. },
  30. onReady() {
  31. // 设置自定义表单校验规则,必须在节点渲染完毕后执行
  32. this.$refs.customForm.setRules(this.customRules)
  33. },
  34. data() {
  35. return{
  36. form:{
  37. },
  38. // 表单校验
  39. customRules: {
  40. name: {
  41. rules: [{
  42. required: true,
  43. errorMessage: '姓名不能为空'
  44. }]
  45. },
  46. },
  47. imageList:[]
  48. }
  49. },
  50. methods: {
  51. // 取消按钮
  52. cancel() {
  53. this.open = false;
  54. this.reset();
  55. },
  56. /** 提交按钮 */
  57. submitForm(e) {
  58. console.log("11111")
  59. this.$refs[e].validate().then(res => {
  60. console.log('success', res);
  61. uni.showToast({
  62. title: `校验通过`
  63. })
  64. }).catch(err => {
  65. console.log('err', err);
  66. })
  67. let path = this.imageList.join(',');
  68. this.form.path = path
  69. appletAdd(this.form).then(res =>{})
  70. },
  71. updateImg(imgList){
  72. this.imageList = imgList;
  73. }
  74. }
  75. };
  76. </script>
  77. <style>
  78. </style>