| | |
| | | <view class="box"> |
| | | <view class="box-head" :style="{ backgroundImage: 'url(' + bgImg + ')' }"> |
| | | <view class="box-head-info"> |
| | | <text>用工认证</text> |
| | | <text>{{title}}</text> |
| | | <text>请按要求填写认证信息</text> |
| | | </view> |
| | | <view class="box-head-content"> |
| | |
| | | <text>*</text> |
| | | </view> |
| | | <view class="item-cate"> |
| | | <view class="item-cate-row active">个人</view> |
| | | <view class="item-cate-row">企业</view> |
| | | <view :class="'item-cate-row '+ (!isCompany?'active':'')" @click="changeIsCompany">个人</view> |
| | | <view :class="'item-cate-row '+(isCompany?'active':'')" @click="changeIsCompany">企业</view> |
| | | </view> |
| | | </view> |
| | | <view class="item"> |
| | |
| | | <text>*</text> |
| | | </view> |
| | | <view class="item-val"> |
| | | <input type="text" placeholder="请输入真实姓名" /> |
| | | <input type="text" v-model="form.linkName" placeholder="请输入真实姓名" /> |
| | | </view> |
| | | </view> |
| | | <view class="item"> |
| | | <view class="item" v-if="isCompany"> |
| | | <view class="item-label"> |
| | | <text>单位名称</text> |
| | | <text>*</text> |
| | | </view> |
| | | <view class="item-val"> |
| | | <input type="text" placeholder="请输入单位名称" /> |
| | | <input type="text" v-model="form.companyName" placeholder="请输入单位名称" /> |
| | | </view> |
| | | </view> |
| | | <view class="item"> |
| | |
| | | <text>*</text> |
| | | </view> |
| | | <view class="item-val"> |
| | | <text>点击获取</text> |
| | | <button open-type="getPhoneNumber">获取手机号</button> |
| | | <input type="text" v-model="form.telephone" placeholder="请输入单位名称" /> |
| | | </view> |
| | | </view> |
| | | <view class="item"> |
| | | <view class="item-label"> |
| | | <view class="item" @click="chooseMPLoaction"> |
| | | <view class="item-label" > |
| | | <text>接单位置</text> |
| | | <text>*</text> |
| | | </view> |
| | | <view class="item-val"> |
| | | <text>请选择</text> |
| | | <view class="item-val" > |
| | | <text>{{form.location || '去选择'}}</text> |
| | | <u-icon name="arrow-right" color="#111111" size="18"></u-icon> |
| | | </view> |
| | | </view> |
| | | <view class="item"> |
| | | <view class="item" v-if="!isCompany"> |
| | | <view class="item-label"> |
| | | <text>身份证信息</text> |
| | | <text>*</text> |
| | | </view> |
| | | <view class="item-upload"> |
| | | <view class="item-upload-item"> |
| | | <image src="/static/image/btn_renxiang@2x.png" mode="widthFix"></image> |
| | | <view class="item-upload-item" @click="uploadImg(11)"> |
| | | <image v-if="form.img11Full && form.img11Full !=''" :src="form.img11Full" mode="widthFix"></image> |
| | | <image v-else src="/static/image/btn_renxiang@2x.png" mode="widthFix"></image> |
| | | </view> |
| | | <view class="item-upload-item"> |
| | | <image src="/static/image/btn_guohui@2x.png" mode="widthFix"></image> |
| | | <view class="item-upload-item" @click="uploadImg(21)"> |
| | | <image v-if="form.img21Full && form.img21Full !=''" :src="form.img21Full" mode="widthFix"></image> |
| | | <image v-else src="/static/image/btn_guohui@2x.png" mode="widthFix"></image> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <view class="item"> |
| | | <view class="item" v-if="isCompany"> |
| | | <view class="item-label"> |
| | | <text>认证资料</text> |
| | | <text>*</text> |
| | | </view> |
| | | <view class="item-upload"> |
| | | <view class="item-upload-item1"> |
| | | <view class="item-upload" v-if="flag==0"> |
| | | <view class="item-upload-item1" @click="uploadImg(1)"> |
| | | <view class="image"> |
| | | <image src="/static/icon/ic_camera@2x.png" mode="widthFix"></image> |
| | | <image v-if="form.img1Full && form.img1Full !=''" :src=" form.img1Full" mode="widthFix"></image> |
| | | <image v-else src="/static/icon/ic_camera@2x.png" mode="widthFix"></image> |
| | | <text>点击上传</text> |
| | | </view> |
| | | <view class="info"> |
| | | <text>营业执照</text> |
| | | <text>1.营业执照</text> |
| | | <text>*</text> |
| | | </view> |
| | | </view> |
| | | <view class="item-upload-item1"> |
| | | <view class="item-upload-item1" @click="uploadImg(2)"> |
| | | <view class="image"> |
| | | <image src="/static/icon/ic_camera@2x.png" mode="widthFix"></image> |
| | | <image v-if="form.img2Full && form.img2Full !=''" :src=" form.img2Full" mode="widthFix"></image> |
| | | <image v-else src="/static/icon/ic_camera@2x.png" mode="widthFix"></image> |
| | | <text>点击上传</text> |
| | | </view> |
| | | <view class="info"> |
| | | <text>其它认证资料</text> |
| | | <text>2.其它认证资料</text> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <view class="item-upload" v-if="flag==1"> |
| | | <view class="item-upload-item1" @click="uploadImg(1)"> |
| | | <view class="image"> |
| | | <image v-if="form.img1Full && form.img1Full !=''" :src=" form.img1Full" mode="widthFix"></image> |
| | | <image v-else src="/static/icon/ic_camera@2x.png" mode="widthFix"></image> |
| | | <text>点击上传</text> |
| | | </view> |
| | | <view class="info"> |
| | | <text>1.营业执照</text> |
| | | <text>*</text> |
| | | </view> |
| | | </view> |
| | | <view class="item-upload-item1" @click="uploadImg(2)"> |
| | | <view class="image"> |
| | | <image v-if="form.img2Full && form.img2Full !=''" :src=" form.img2Full" mode="widthFix"></image> |
| | | <image v-else src="/static/icon/ic_camera@2x.png" mode="widthFix"></image> |
| | | <text>点击上传</text> |
| | | </view> |
| | | <view class="info"> |
| | | <text>2.道路运输经营许可证</text> |
| | | <text>*</text> |
| | | </view> |
| | | </view> |
| | | <view class="item-upload-item1" @click="uploadImg(3)"> |
| | | <view class="image"> |
| | | <image v-if="form.img3Full && form.img3Full !=''" :src=" form.img3Full" mode="widthFix"></image> |
| | | <image v-else src="/static/icon/ic_camera@2x.png" mode="widthFix"></image> |
| | | <text>点击上传</text> |
| | | </view> |
| | | <view class="info"> |
| | | <text>3.其它认证资料</text> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <view class="item-upload" v-if="flag==2"> |
| | | <view class="item-upload-item1" @click="uploadImg(1)"> |
| | | <view class="image"> |
| | | <image v-if="form.img1Full && form.img1Full !=''" :src=" form.img1Full" mode="widthFix"></image> |
| | | <image v-else src="/static/icon/ic_camera@2x.png" mode="widthFix"></image> |
| | | <text>点击上传</text> |
| | | </view> |
| | | <view class="info"> |
| | | <text>1.营业执照</text> |
| | | <text>*</text> |
| | | </view> |
| | | </view> |
| | | <view class="item-upload-item1" @click="uploadImg(2)"> |
| | | <view class="image"> |
| | | <image v-if="form.img2Full && form.img2Full !=''" :src=" form.img2Full" mode="widthFix"></image> |
| | | <image v-else src="/static/icon/ic_camera@2x.png" mode="widthFix"></image> |
| | | <text>点击上传</text> |
| | | </view> |
| | | <view class="info"> |
| | | <text>2.食品经营许可证</text> |
| | | <text>*</text> |
| | | </view> |
| | | </view> |
| | | <view class="item-upload-item1" @click="uploadImg(3)"> |
| | | <view class="image"> |
| | | <image v-if="form.img3Full && form.img3Full !=''" :src=" form.img3Full" mode="widthFix"></image> |
| | | <image v-else src="/static/icon/ic_camera@2x.png" mode="widthFix"></image> |
| | | <text>点击上传</text> |
| | | </view> |
| | | <view class="info"> |
| | | <text>3.从业人员健康证</text> |
| | | <text>*</text> |
| | | </view> |
| | | </view> |
| | | <view class="item-upload-item1" @click="uploadImg(4)"> |
| | | <view class="image"> |
| | | <image v-if="form.img4Full && form.img4Full !=''" :src=" form.img4Full" mode="widthFix"></image> |
| | | <image v-else src="/static/icon/ic_camera@2x.png" mode="widthFix"></image> |
| | | <text>点击上传</text> |
| | | </view> |
| | | <view class="info"> |
| | | <text>4.其它认证资料</text> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <view class="box-head-botton">提交认证</view> |
| | | <view class="box-head-botton" @click="applySubmit">提交认证</view> |
| | | <view style="width: 100%; height: calc(30rpx + env(safe-area-inset-bottom));"></view> |
| | | </view> |
| | | </view> |
| | | </template> |
| | | |
| | | <script> |
| | | import { mapState } from 'vuex' |
| | | export default { |
| | | computed: { |
| | | ...mapState( ['userInfo']) |
| | | }, |
| | | data() { |
| | | return { |
| | | bgImg: require('@/static/image/bg_renzheng_yonggong@2x.png') |
| | | bgImg: require('@/static/image/bg_renzheng_yonggong@2x.png'), |
| | | title: '用户认证', |
| | | flag: null, |
| | | isCompany:false, |
| | | loading:false, |
| | | form: { |
| | | "companyName": "", |
| | | authType:0, |
| | | "img1": "", |
| | | "img2": "", |
| | | "img11": "", |
| | | "img21": "", |
| | | "img3": "", |
| | | "img4": "", |
| | | "img1Full": "", |
| | | "img2Full": "", |
| | | "img11Full": "", |
| | | "img21Full": "", |
| | | "img3Full": "", |
| | | "img4Full": "", |
| | | "location": "", |
| | | "lat": null, |
| | | "lgt": null, |
| | | "linkName": "", |
| | | "location": "", |
| | | "telephone": "", |
| | | "type": 1 |
| | | } |
| | | }; |
| | | }, |
| | | onLoad(options) { |
| | | console.log(options) |
| | | var flag = options.flag |
| | | this.flag = flag |
| | | this.initFormData() |
| | | switch(flag){ |
| | | case '1': |
| | | this.title = '货运认证' |
| | | this.bgImg = require('@/static/image/bg_renzheng_huoyun@2x.png') |
| | | break; |
| | | case '2': |
| | | this.title = '供餐认证' |
| | | this.bgImg = require('@/static/image/bg_renzheng_gongcan@2x.png') |
| | | break; |
| | | default: |
| | | this.bgImg = require('@/static/image/bg_renzheng_yonggong@2x.png'), |
| | | this.title = '用工认证' |
| | | break; |
| | | } |
| | | uni.setNavigationBarTitle({ |
| | | title:this.title |
| | | }) |
| | | }, |
| | | methods:{ |
| | | changeIsCompany(){ |
| | | this.isCompany =!this.isCompany |
| | | this.form.authType = this.isCompany?1:0 |
| | | }, |
| | | inNullParam(param){ |
| | | if(!param){ |
| | | return true |
| | | } |
| | | if(param == ''){ |
| | | return true |
| | | } |
| | | return false |
| | | }, |
| | | applySubmit() { |
| | | if(this.loading){ |
| | | return |
| | | } |
| | | console.log('表单参数:',this.form) |
| | | this.loading =true |
| | | if(this.inNullParam(this.form.linkName) |
| | | ||this.inNullParam(this.form.lat) |
| | | ||this.inNullParam(this.form.lgt) |
| | | ||this.inNullParam(this.form.location) |
| | | ||this.inNullParam(this.form.telephone)){ |
| | | uni.showToast({title: '对不起,请按要求填写申请信息1!',icon: "none",duration: 2000}); |
| | | this.loading =false |
| | | return |
| | | } |
| | | if( this.form.authType == 0){ |
| | | if(this.inNullParam(this.form.img11)||this.inNullParam(this.form.img21)){ |
| | | uni.showToast({title: '对不起,请按要求填写申请信息3!',icon: "none",duration: 2000}); |
| | | this.loading =false |
| | | return |
| | | } |
| | | }else{ |
| | | if(this.inNullParam(this.form.img1) || this.inNullParam(this.form.companyName)){ |
| | | uni.showToast({title: '对不起,请按要求填写申请信息4!',icon: "none",duration: 2000}); |
| | | this.loading =false |
| | | return |
| | | } |
| | | } |
| | | if(this.form.type != 0 && this.form.authType == 1 && this.inNullParam(this.form.img2)){ |
| | | uni.showToast({title: '对不起,请按要求填写申请信息!',icon: "none",duration: 2000}); |
| | | this.loading =false |
| | | return |
| | | } |
| | | if(this.form.type == 1 && this.form.authType == 1 && this.inNullParam(this.form.img2)){ |
| | | uni.showToast({title: '对不起,请按要求填写申请信息5!',icon: "none",duration: 2000}); |
| | | this.loading =false |
| | | return |
| | | } |
| | | |
| | | var that = this |
| | | var param =this.form; |
| | | if(this.form.authType == 0){ |
| | | param.img1 = this.form.img11, |
| | | param.img2 = this.form.img21 |
| | | } |
| | | console.log('提交参数:',param) |
| | | this.$u.api.applyForIdentity(param).then(res =>{ |
| | | if(res.code ===200){ |
| | | uni.showToast({ |
| | | title: res.message||'申请成功 ', |
| | | icon: "none", |
| | | duration: 2000 |
| | | }); |
| | | uni.navigateBack({ delta: 1 }); |
| | | } |
| | | }).finally(()=>{ |
| | | that.loading =false |
| | | }) |
| | | } , |
| | | chooseMPLoaction(){ |
| | | var that =this |
| | | uni.chooseLocation({ |
| | | success:(res)=> { |
| | | console.log(res); |
| | | this.form.location=res.address |
| | | this.form.lat=res.latitude |
| | | this.form.lgt=res.longitude |
| | | }, |
| | | fail:()=>{ |
| | | // 如果用uni.chooseLocation没有获取到地理位置,则需要获取当前的授权信息,判断是否有地理授权信息 |
| | | uni.getSetting({ |
| | | success: (res) => { |
| | | console.log(res); |
| | | var status = res.authSetting; |
| | | if(!status['scope.userLocation']){ |
| | | // 如果授权信息中没有地理位置的授权,则需要弹窗提示用户需要授权地理信息 |
| | | uni.showModal({ |
| | | title:"是否授权当前位置", |
| | | content:"需要获取您的地理位置,请确认授权,否则地图功能将无法使用", |
| | | success:(tip)=>{ |
| | | if(tip.confirm){ |
| | | // 如果用户同意授权地理信息,则打开授权设置页面,判断用户的操作 |
| | | uni.openSetting({ |
| | | success:(data)=>{ |
| | | // 如果用户授权了地理信息在,则提示授权成功 |
| | | if(data.authSetting['scope.userLocation']===true){ |
| | | uni.showToast({ |
| | | title:"授权成功", |
| | | icon:"success", |
| | | duration:1000 |
| | | }) |
| | | // 授权成功后,然后再次chooseLocation获取信息 |
| | | uni.chooseLocation({ |
| | | success: (res) => { |
| | | console.log("详细地址",res); |
| | | // this.getRegionFn(res); |
| | | } |
| | | }) |
| | | }else{ |
| | | uni.showToast({ |
| | | title:"授权失败", |
| | | icon:"none", |
| | | duration:1000 |
| | | }) |
| | | } |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | }) |
| | | } |
| | | }, |
| | | fail: (res) => { |
| | | uni.showToast({ |
| | | title:"调用授权窗口失败", |
| | | icon:"none", |
| | | duration:1000 |
| | | }) |
| | | } |
| | | }) |
| | | } |
| | | }) |
| | | }, |
| | | uploadImg(index){ |
| | | var that =this |
| | | uni.chooseImage({ |
| | | count: 1, // 默认9 |
| | | sizeType: ['original', 'compressed'], |
| | | sourceType: ['album','camera'],//['album','camera'], |
| | | mediaType: ['image'],//['image', 'video'], |
| | | success: function (res1) { |
| | | const tempFiles = res1.tempFiles //包含图片大小的数组 |
| | | if (tempFiles[0].size > 20*1024*1024) { |
| | | uni.showToast({ |
| | | title: '上传图片不能大于20M!', |
| | | duration: 2000, |
| | | icon: "none" |
| | | }); |
| | | return |
| | | } |
| | | |
| | | uni.uploadFile({ |
| | | url: that.$baseUrl + 'web/public/upload', |
| | | filePath: res1.tempFilePaths[0], |
| | | name: 'file', |
| | | formData: { |
| | | 'folder': 'identity', |
| | | 'flag':index |
| | | }, |
| | | success:(data)=>{ |
| | | uni.showToast({ |
| | | title: '上传成功', |
| | | duration: 2000, |
| | | icon: "none" |
| | | }); |
| | | const res = JSON.parse(data.data) |
| | | |
| | | console.log(res) |
| | | if(res.data.flag == '11'){ |
| | | that.form.img11=res.data.imgaddr |
| | | that.form.img11Full=res.data.url |
| | | }else if(res.data.flag == '21'){ |
| | | that.form.img21=res.data.imgaddr |
| | | that.form.img21Full=res.data.url |
| | | console.log(21,that.form.img21Full) |
| | | }else if(res.data.flag == '1'){ |
| | | that.form.img1=res.data.imgaddr |
| | | that.form.img1Full=res.data.url |
| | | }else if(res.data.flag == '2'){ |
| | | that.form.img2=res.data.imgaddr |
| | | that.form.img2Full=res.data.url |
| | | }else if(res.data.flag == '3'){ |
| | | that.form.img3=res.data.imgaddr |
| | | that.form.img3Full=res.data.url |
| | | }else if(res.data.flag == '4'){ |
| | | that.form.img4=res.data.imgaddr |
| | | that.form.img4Full=res.data.url |
| | | } |
| | | }, |
| | | fail:(e)=>{ |
| | | uni.showToast({ |
| | | title: '上传失败', |
| | | duration: 2000, |
| | | icon: "none" |
| | | }); |
| | | } |
| | | }) |
| | | }, |
| | | fail:function(err){ |
| | | hideLoading() |
| | | reject("选择文件失败",err) |
| | | } |
| | | }) |
| | | }, |
| | | initFormData(){ |
| | | this.form = { |
| | | "companyName": "", |
| | | authType:0, |
| | | "img1": "", |
| | | "img2": "", |
| | | "img11": "", |
| | | "img21": "", |
| | | "img3": "", |
| | | "img4": "", |
| | | "img1Full": "", |
| | | "img2Full": "", |
| | | "img11Full": "", |
| | | "img21Full": "", |
| | | "img3Full": "", |
| | | "img4Full": "", |
| | | "location": "", |
| | | "lat": null, |
| | | "lgt": null, |
| | | "linkName": this.userInfo.name, |
| | | "location": "", |
| | | "telephone": this.userInfo.telephone, |
| | | "type": this.flag |
| | | } |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | |
| | | flex-wrap: wrap; |
| | | .item-upload-item { |
| | | width: 300rpx; |
| | | border-radius: 10px; |
| | | height: 196rpx; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: content; |
| | | overflow: hidden; |
| | | border:1px solid #c2c2c2; |
| | | image { |
| | | width: 100%; |
| | | height: 100%; |
| | | } |
| | | } |
| | | .item-upload-item1 { |
| | | width: 300rpx; |
| | | width: 45%; |
| | | padding-bottom: 40px; |
| | | border-radius: 10px; |
| | | .image { |
| | | width: 100%; |
| | | height: 196rpx; |
| | | background: #F7F7F7; |
| | | border:1px solid #c2c2c2; |
| | | border-radius: 16rpx; |
| | | display: flex; |
| | | align-items: center; |