createLifeService.vue 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128
  1. <template>
  2. <view class='content'>
  3. <u--form ref="uForm">
  4. <u-form-item label="主体">
  5. <u-radio-group v-model="form.radio">
  6. <u-radio name="商铺" >商铺</u-radio>
  7. <u-radio name="个人" >个人</u-radio>
  8. </u-radio-group>
  9. </u-form-item>
  10. <u-form-item label="店铺名称"><u-input placeholder='输入店铺名称' v-model="form.name" /></u-form-item>
  11. <u-form-item label="封面图片">
  12. <u-upload :fileList="fileList1" @afterRead="afterRead($event,0)" @delete="deletePic" name="1" multiple
  13. :maxCount="1"></u-upload>
  14. </u-form-item>
  15. <u-form-item @click='placeSelect(),hideKeyboard()' label="店铺位置"></u-form-item>
  16. <u-form-item label="详细地址">
  17. <u-input placeholder='输入详细地址,不超过15个字' v-model="form.intro" />
  18. </u-form-item>
  19. <u-form-item label="业务描述">
  20. <u--textarea v-model="value1" autoHeight placeholder="输入业务描述,0-200个字" ></u--textarea>
  21. </u-form-item>
  22. <view>以下信息为选填信息</view>
  23. <u-form-item label="联系人(仅平台可见)"><u-input v-model="form.sex" type="select" /></u-form-item>
  24. <u-form-item label="昵称(所有人可见)"><u-input v-model="form.sex" type="select" /></u-form-item>
  25. <u-form-item label="联系人(所有人可见)"><u-input v-model="form.sex" type="select" /></u-form-item>
  26. <u-form-item label="营业执照">
  27. <u-upload :fileList="fileList3" @afterRead="afterRead($event,1)" @delete="deletePic" name="2" multiple
  28. :maxCount="1"></u-upload>
  29. </u-form-item>
  30. <view>注:如提供风险类服务,请上传身份证信息</view>
  31. <u-form-item label="身份证头像面">
  32. <u-upload :fileList="fileList5" @afterRead="afterRead($event,1)" @delete="deletePic" name="4" multiple
  33. :maxCount="1"></u-upload>
  34. </u-form-item>
  35. <u-form-item label="身份证国徽面">
  36. <u-upload :fileList="fileList7" @afterRead="afterRead($event,1)" @delete="deletePic" name="5" multiple
  37. :maxCount="1"></u-upload>
  38. </u-form-item>
  39. <u-form-item label="身份证号码">
  40. <u-input placeholder='请输入身份证号码' v-model="form.intro" />
  41. </u-form-item>
  42. <view></view>
  43. </u--form>
  44. </view>
  45. </template>
  46. <script>
  47. export default {
  48. data() {
  49. return {
  50. form:{},
  51. // 封面
  52. fileList:[],
  53. fileList1:[],
  54. // 营业执照
  55. fileList2:[],
  56. fileList3:[],
  57. // 头像面
  58. fileList4:[],
  59. fileList5:[],
  60. // 国徽面
  61. fileList6:[],
  62. fileList7:[],
  63. }
  64. },
  65. methods: {
  66. placeSelect() {
  67. uni.chooseLocation({
  68. success: function(res) {
  69. console.log(res);
  70. that.cardInfo.location = res.latitude + ',' + res.longitude
  71. let _address = that.$helper.formatLocation(res.address)
  72. that.cardInfo.province = _address.Province
  73. that.cardInfo.city = _address.City
  74. that.cardInfo.area = _address.Country
  75. that.cardInfo.detailedAddress = _address.Village
  76. }
  77. });
  78. },
  79. hideKeyboard() {
  80. uni.hideKeyboard()
  81. },
  82. // 删除图片
  83. deletePic(event,status) {
  84. this[`fileList${event.name}`].splice(event.index, 1)
  85. },
  86. // 新增图片
  87. async afterRead(event,status) {
  88. // 当设置 multiple 为 true 时, file 为数组格式,否则为对象格式
  89. let lists = [].concat(event.file)
  90. let fileListLen = this[`fileList${event.name}`].length
  91. lists.map((item) => {
  92. this[`fileList${event.name}`].push({
  93. ...item,
  94. status: 'uploading',
  95. message: '上传中'
  96. })
  97. })
  98. for (let i = 0; i < lists.length; i++) {
  99. const result = await this.uploadFilePromise(lists[i].url,status)
  100. let item = this[`fileList${event.name}`][fileListLen]
  101. this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
  102. status: 'success',
  103. message: '',
  104. url: result
  105. }))
  106. fileListLen++
  107. }
  108. },
  109. uploadFilePromise(res,status) {
  110. return new Promise((resolve, reject) => {
  111. uploadImage(res, 'cardImages/',
  112. result => {
  113. that.cardInfo.headSculpture = result
  114. resolve(res)
  115. }
  116. )
  117. })
  118. },
  119. }
  120. }
  121. </script>
  122. <style>
  123. </style>