| | |
| | | <view class="container"> |
| | | <view class="visitor-form"> |
| | | <view class="cell"> |
| | | <view class="title">姓名<b>*</b></view> |
| | | <view class="title"><b>*</b>姓名</view> |
| | | <view class="content"> |
| | | <input class="input" placeholder-style="color: #999999;" maxlength="30" v-model="visitorData.name" placeholder="请输入您的真实姓名" /> |
| | | </view> |
| | | </view> |
| | | <view class="cell"> |
| | | <view class="title">手机号<b>*</b></view> |
| | | <view class="title"><b>*</b>手机号</view> |
| | | <view class="content"> |
| | | <input class="input" maxlength="11" placeholder-style="color: #999999;" v-model="visitorData.phone" placeholder="请输入您的手机号" /> |
| | | <input type="number" class="input" maxlength="11" placeholder-style="color: #999999;" v-model="visitorData.phone" placeholder="请输入您的手机号" /> |
| | | </view> |
| | | </view> |
| | | <view class="cell"> |
| | | <view class="title">证件类型<b>*</b></view> |
| | | <view class="title"><b>*</b>证件类型</view> |
| | | <view class="content" @click="show = true"> |
| | | <text :style="{color: visitorData.idcardTypeName ? '#000000' : ''}">{{visitorData.idcardTypeName ? visitorData.idcardTypeName : '请选择'}}</text> |
| | | <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon> |
| | | <u-icon name="arrow-right" color="#CCCCCC" size="16" class="ml6"></u-icon> |
| | | </view> |
| | | </view> |
| | | <view class="cell"> |
| | | <view class="title">证件号码<b>*</b></view> |
| | | <view class="title"><b>*</b>证件号码</view> |
| | | <view class="content"> |
| | | <input class="input" maxlength="18" placeholder-style="color: #999999;" v-model="visitorData.idcardNo" placeholder="请输入您的证件号码" /> |
| | | </view> |
| | | </view> |
| | | <view class="empty"></view> |
| | | <view class="cell"> |
| | | <view class="title">公司<b>*</b></view> |
| | | <view class="title"><b>*</b>公司名称</view> |
| | | <view class="content"> |
| | | <input class="input" maxlength="50" placeholder-style="color: #999999;" v-model="visitorData.companyName" placeholder="请输入您的公司名称" /> |
| | | </view> |
| | | </view> |
| | | <view class="cell"> |
| | | <view class="title1"> |
| | | <text class="title1_a">人脸照片<b style="color: red;">*</b></text> |
| | | <text class="title1_a"><b>*</b>人脸照片</text> |
| | | <text class="title1_b">1、请提供五官清晰,人脸居中的正面人脸免冠照片;</text> |
| | | <text class="title1_b">2、照片无逆光、无PS、无过度美颜处理</text> |
| | | </view> |
| | | <view class="content"> |
| | | <view class="content_uplaod" @click="upload('faceImg')" v-if="!visitorData.faceImgUrl"> |
| | | <u-icon name="plus" color="rgb(153, 153, 153)" size="28"></u-icon> |
| | | <u-icon name="plus" color="rgb(153, 153, 153)" size="20"></u-icon> |
| | | </view> |
| | | <view class="content_uplaod" @click="upload('faceImg')" v-else> |
| | | <image :src="visitorData.faceImgUrl" mode="widthFix"></image> |
| | |
| | | </view> |
| | | </view> |
| | | <view style="height: 20rpx; background-color: #F7F7F7;"></view> |
| | | <view class="cell"> |
| | | <!-- <view class="cell"> |
| | | <view class="title">健康证<b v-if="visit === '1'">*</b></view> |
| | | <view class="content"> |
| | | <view class="content_uplaod" @click="upload('imgurl')" v-if="!visitorData.imgurlUrl"> |
| | |
| | | <image :src="visitorData.imgurlUrl" mode="widthFix"></image> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </view> --> |
| | | </view> |
| | | <view class="footer-box"> |
| | | <view class="submit-button" @click="submit">下一步</view> |
| | |
| | | import tlyPictureCut from "@/components/tly-picture-cut/tlyPictureCut.vue"; |
| | | import QfImageCropper from '@/uni_modules/qf-image-cropper/components/qf-image-cropper/qf-image-cropper.vue'; |
| | | import { mapState } from 'vuex' |
| | | import { uploadAvatar } from "@/utils/config" |
| | | import { getSystemDictData, visitorSub } from '@/api' |
| | | export default { |
| | | data() { |
| | | return { |
| | |
| | | userAnswerId: '', |
| | | name: '', |
| | | phone: '', |
| | | idcardType: '0', |
| | | idcardType: 0, |
| | | idcardTypeName: '身份证', |
| | | idcardNo: '', |
| | | faceImg: '', |
| | |
| | | } |
| | | } |
| | | }, |
| | | |
| | | computed: { |
| | | ...mapState(['member']) |
| | | }, |
| | | |
| | | components: { tlyPictureCut, QfImageCropper }, |
| | | |
| | | onLoad(option) { |
| | | if (this.member) { |
| | | this.visitorData.name = this.member.name |
| | | this.visitorData.phone = this.member.phone |
| | | this.visitorData.idcardNo = this.member.idcardDecode |
| | | this.visitorData.companyName = this.member.visitCompanyName |
| | | this.visitorData.faceImg = this.member.faceImg |
| | | if (this.member.faceImg) { |
| | | this.visitorData.faceImgUrl = this.member.prefixUrl + this.member.faceImg |
| | | } |
| | | this.visitorData.imgurl = this.member.imgurl |
| | | if (this.member.imgurl) { |
| | | this.visitorData.imgurlUrl = this.member.prefixUrl + this.member.imgurl |
| | | } |
| | | this.visitorData.idcardType = this.member.idcardType |
| | | if (this.member.idcardType === 0) { |
| | | this.visitorData.idcardTypeName = '身份证' |
| | | } else if (this.member.idcardType === 1) { |
| | | this.visitorData.idcardTypeName = '港澳证件' |
| | | } else if (this.member.idcardType === 2) { |
| | | this.visitorData.idcardTypeName = '护照' |
| | | } |
| | | const visitorData = uni.getStorageSync('visitorData') |
| | | if(visitorData && visitorData.name){ |
| | | this.visitorData = visitorData |
| | | } |
| | | this.visitorData.userAnswerId = option.userAnswerId |
| | | this.getVisit() |
| | | // if (this.member ) { |
| | | // this.visitorData.name = this.member.name |
| | | // this.visitorData.phone = this.member.phone |
| | | // this.visitorData.idcardNo = this.member.idcardDecode |
| | | // this.visitorData.companyName = this.member.visitCompanyName |
| | | // this.visitorData.faceImg = this.member.faceImg |
| | | // if (this.member.faceImg) { |
| | | // this.visitorData.faceImgUrl = this.member.prefixUrl + this.member.faceImg |
| | | // } |
| | | // this.visitorData.imgurl = this.member.imgurl |
| | | // if (this.member.imgurl) { |
| | | // this.visitorData.imgurlUrl = this.member.prefixUrl + this.member.imgurl |
| | | // } |
| | | // this.visitorData.idcardType = this.member.idcardType |
| | | // if (this.member.idcardType === 0) { |
| | | // this.visitorData.idcardTypeName = '身份证' |
| | | // } else if (this.member.idcardType === 1) { |
| | | // this.visitorData.idcardTypeName = '港澳证件' |
| | | // } else if (this.member.idcardType === 2) { |
| | | // this.visitorData.idcardTypeName = '护照' |
| | | // } |
| | | // } |
| | | this.visitorData.userAnswerId = option.answerId || '' |
| | | // this.getVisit() |
| | | // uni.$on('update', (data) => { |
| | | // this.uploadImg(data.tempFilePath) |
| | | // }) |
| | |
| | | |
| | | methods: { |
| | | submit() { |
| | | const { visitorData } = this |
| | | if (!this.visitorData.name) return uni.showToast({ |
| | | title: '姓名不能为空', |
| | | icon: 'none' |
| | |
| | | title: '人脸照片不能为空', |
| | | icon: 'none' |
| | | }) |
| | | if (this.visit === '1') { |
| | | if (!this.visitorData.imgurl) return uni.showToast({ |
| | | title: '健康证不能为空', |
| | | icon: 'none' |
| | | }) |
| | | } |
| | | // if (this.visit === '1') { |
| | | // if (!this.visitorData.imgurl) return uni.showToast({ |
| | | // title: '健康证不能为空', |
| | | // icon: 'none' |
| | | // }) |
| | | // } |
| | | uni.setStorageSync('visitorData', this.visitorData) |
| | | uni.navigateTo({ |
| | | url: `/pages/visitorApplication/visitorApplication?data=${JSON.stringify(this.visitorData)}` |
| | | }); |
| | | }, |
| | | getVisit() { |
| | | // 是否需要答题 |
| | | this.$u.api.getSystemDictData({ |
| | | // 是否需要 健康证 |
| | | getSystemDictData({ |
| | | dictCode: 'SYSTEM', |
| | | label: 'HEALTH_CARD' |
| | | }).then(res => { |
| | |
| | | that.$refs.cropper.close() |
| | | uni.showLoading({ title: '上传中', mask: true }); |
| | | uni.uploadFile({ |
| | | url: `${this.$baseUrl}visitsAdmin/cloudService/web/visit/public/uploadFtp.do`, |
| | | url: uploadAvatar, |
| | | filePath: file.tempFilePath, |
| | | name: 'file', |
| | | formData: { |
| | |
| | | if (type === 'imgurl') { |
| | | uni.showLoading({ title: '上传中', mask: true }); |
| | | uni.uploadFile({ |
| | | url: `${that.$baseUrl}visitsAdmin/cloudService/web/visit/public/uploadFtp.do`, |
| | | url: uploadAvatar, |
| | | filePath: chooseImageRes.tempFilePaths[0], |
| | | name: 'file', |
| | | formData: { |
| | |
| | | .content_uplaod { |
| | | width: 120rpx; |
| | | height: 120rpx; |
| | | background-color: #ececec; |
| | | background: #F7F7F7; |
| | | border-radius: 8rpx; |
| | | border: 2rpx solid #E5E5E5; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | |
| | | .content_uplaod image { |
| | | width: 100%; |
| | | height: 100%; |
| | | } |
| | | .empty{ |
| | | width: 750rpx; |
| | | height: 20rpx; |
| | | margin: 0 -30rpx; |
| | | background-color: #f7f7f7;; |
| | | } |
| | | .title { |
| | | font-size: 30rpx; |
| | |
| | | } |
| | | |
| | | .title b { |
| | | color: red; |
| | | font-weight: bold; |
| | | color: #E42D2D; |
| | | margin-right: 4rpx; |
| | | } |
| | | |
| | | .title1 { |
| | |
| | | align-items: center; |
| | | margin-bottom: 20rpx; |
| | | b { |
| | | color: red; |
| | | font-weight: bold; |
| | | color: #E42D2D; |
| | | margin-right: 4rpx; |
| | | |
| | | } |
| | | } |
| | | .title1_b { |
| | |
| | | } |
| | | |
| | | .add-other { |
| | | border: 1rpx solid #025eef; |
| | | color: #025eef; |
| | | border: 1rpx solid #4d99a8; |
| | | color: #4d99a8; |
| | | font-size: 11rpx; |
| | | padding: 0 12rpx; |
| | | height: 32rpx; |
| | |
| | | width: calc(100% - 60rpx); |
| | | height: 88rpx; |
| | | line-height: 88rpx; |
| | | background: #025eef; |
| | | background: #4d99a8; |
| | | border-radius: 4rpx; |
| | | color: #fff; |
| | | border-radius: 44rpx; |