|
|
@@ -16,57 +16,100 @@
|
|
|
</view>
|
|
|
<view class="item-box">
|
|
|
<view class="title" style="width: 147rpx;">手机号</view>
|
|
|
- <input type='number' class="uni-input" v-model="phone" focus placeholder="请输入你的手机号" />
|
|
|
+ <input class="uni-input" type='number' v-model="phone" focus placeholder="请输入你的手机号" />
|
|
|
</view>
|
|
|
<view class="item-box">
|
|
|
<view class="title" style="width: 147rpx;">短信验证</view>
|
|
|
- <input type='number' class="uni-input" maxlength="6" v-model="bindingCaptcha" focus placeholder="请输入验证码" />
|
|
|
+ <input class="uni-input" type='number' maxlength="6" v-model="bindingCaptcha" focus placeholder="请输入验证码" />
|
|
|
<button class="code" :class="disabled === true ? 'on' : ''" :disabled='disabled' @click="code">
|
|
|
{{ text }}
|
|
|
</button>
|
|
|
</view>
|
|
|
<view class="item-box" style="justify-content: space-between;">
|
|
|
<view class="title">是否有过配送经验</view>
|
|
|
- <switch :value="isSwitch" :checked="isSwitch" color="#12CA00" style="transform:scale(0.7)" />
|
|
|
+ <switch :value="isSwitch" :checked="isSwitch" @change="isSwitch = !isSwitch" color="#12CA00" style="transform:scale(0.9)">
|
|
|
+ <text style="margin-top: 3rpx;">{{isSwitch ? '是' : '否'}}</text>
|
|
|
+ </switch>
|
|
|
</view>
|
|
|
<view class="item-box" style="border: none;padding: 0;">
|
|
|
<view class="title">配送职责（可多选）</view>
|
|
|
</view>
|
|
|
- <view class="item-box" style="border-bottom: none;">
|
|
|
- <checkbox-group name="checkbox" style="margin-top: 38rpx;">
|
|
|
+ <view class="item-box">
|
|
|
+ <checkbox-group name="checkbox" style="margin-top: 38rpx;" @change="checkboxChange">
|
|
|
<label style="margin-left: 96rpx">
|
|
|
- <checkbox class="mycheck" :value="1" :checked="checkbox1" /> <text style="margin-left: 10rpx"> 骑手</text>
|
|
|
+ <checkbox class="mycheck" value="1" :checked="checkbox1" /> <text style="margin-left: 10rpx"> 骑手</text>
|
|
|
</label>
|
|
|
<label style="margin-left: 96rpx">
|
|
|
- <checkbox class="mycheck" :value="2" :checked="checkbox2" /> <text style="margin-left: 10rpx"> 快递员</text>
|
|
|
+ <checkbox class="mycheck" value="2" :checked="checkbox2" /> <text style="margin-left: 10rpx"> 快递员</text>
|
|
|
</label>
|
|
|
</checkbox-group>
|
|
|
</view>
|
|
|
+ <view class="item no-border">
|
|
|
+ <text class="acea-row row-middle required item-title">请上传身份证证件照正反照</text>
|
|
|
+ <text v-if="merchantTypeInfo" class="item-title">( {{merchantTypeInfo}} )</text>
|
|
|
+ <text class="item-desc">(图片最多可上传5张，格式支持JPG、PNG、JPEG)</text>
|
|
|
+ <view class="upload">
|
|
|
+ <view class='pictrue' v-for="(item,index) in pics" :key="index" :data-index="index" @click="getPhotoClickIdx">
|
|
|
+ <image :src='item'></image>
|
|
|
+ <text v-if="(isKey&&parseFloat(merchantData.auditStatus)>2) || (!isKey&&!merchantData.auditStatus)" class='iconfont icon-guanbi1'
|
|
|
+ @click.stop='DelPic(index)'></text>
|
|
|
+ </view>
|
|
|
+ <view class='pictrue acea-row row-center-wrapper row-column' @click='uploadpic' v-if="pics.length < 5 && ((isKey&&parseFloat(merchantData.auditStatus)>2) || (!isKey&&!merchantData.auditStatus))">
|
|
|
+ <text class='iconfont icon-icon25201'></text>
|
|
|
+ <view>上传凭证</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
<view style="padding: 0 96rpx;margin: 96rpx 0 20rpx 0;">
|
|
|
<label class="radio">
|
|
|
- <radio value="isAgree" @tap="isAgree = !isAgree" :checked="isAgree" />我已阅读相关条款
|
|
|
+ <radio activeBackgroundColor="$bg-color-primary" value="isAgree" @tap="isAgree = !isAgree" :checked="isAgree" />我已阅读相关条款
|
|
|
</label>
|
|
|
+ <button class="settleAgree" @click="showProtocol = true">《入驻协议》</button>
|
|
|
</view>
|
|
|
<view style="padding: 0 96rpx;">
|
|
|
<button class="sub" @tap="formSubmit">提交</button>
|
|
|
</view>
|
|
|
<!-- </form> -->
|
|
|
+
|
|
|
+ <view class="settlementAgreement" v-if="showProtocol">
|
|
|
+ <view class="setAgCount">
|
|
|
+ <i class="icon iconfont icon-guanbi" @click="showProtocol = false"></i>
|
|
|
+ <div class="title">骑手入驻协议</div>
|
|
|
+ <view class="content">
|
|
|
+ <jyf-parser :html="protocol" ref="article" :tag-style="tagStyle"></jyf-parser>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <Verify @success="handlerOnVerSuccess" :captchaType="'clickWord'" :imgSize="{ width: '330px', height: '155px' }"
|
|
|
+ ref="verify"></Verify>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import {
|
|
|
- registerVerify,
|
|
|
- } from '@/api/api.js';
|
|
|
+ riderSettledCode,
|
|
|
+ riderSettledApply
|
|
|
+ } from '@/api/user.js'
|
|
|
import {
|
|
|
Debounce
|
|
|
} from '@/utils/validate.js'
|
|
|
+ import Verify from '../components/verifition/verify.vue';
|
|
|
var statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 'px';
|
|
|
let app = getApp();
|
|
|
export default {
|
|
|
+ components: {
|
|
|
+ Verify
|
|
|
+ },
|
|
|
data() {
|
|
|
return {
|
|
|
+ showProtocol: false,
|
|
|
+ protocol: '',
|
|
|
+ tagStyle: {
|
|
|
+ img: 'width:100%;display:block;'
|
|
|
+ },
|
|
|
+ pics: [],
|
|
|
checkbox1: true,
|
|
|
checkbox2: false,
|
|
|
statusBarHeight: app.globalData.statusBarHeight,
|
|
|
@@ -80,6 +123,9 @@
|
|
|
text: '发送验证码',
|
|
|
nums: 60,
|
|
|
timer: '',
|
|
|
+ merchantTypeInfo: '',
|
|
|
+ isKey: '',
|
|
|
+ picsStr: ''
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
@@ -104,6 +150,12 @@
|
|
|
if (!that.isAgree) return that.$util.Tips({
|
|
|
title: '请勾选相关条款！'
|
|
|
});
|
|
|
+ if (that.pics.length == 0) return that.$util.Tips({
|
|
|
+ title: "请上传资质图片"
|
|
|
+ });
|
|
|
+ if (that.pics) {
|
|
|
+ that.picsStr = JSON.stringify(that.pics)
|
|
|
+ }
|
|
|
return true;
|
|
|
},
|
|
|
handBack() {
|
|
|
@@ -111,16 +163,35 @@
|
|
|
delta: 1
|
|
|
})
|
|
|
},
|
|
|
+ //滑块验证成功后
|
|
|
+ handlerOnVerSuccess(data) {
|
|
|
+ this.$refs.verify.hide();
|
|
|
+ uni.showLoading({
|
|
|
+ title: '加载中',
|
|
|
+ mask: true
|
|
|
+ });
|
|
|
+ riderSettledCode({
|
|
|
+ phone: +that.phone
|
|
|
+ }).then(res => {
|
|
|
+ that.$util.Tips({
|
|
|
+ title: res.message
|
|
|
+ });
|
|
|
+ that.timer = setInterval(that.getTimes, 1000);
|
|
|
+ that.disabled = true;
|
|
|
+ uni.hideLoading();
|
|
|
+ }).catch(err => {
|
|
|
+ return that.$util.Tips({
|
|
|
+ title: err
|
|
|
+ });
|
|
|
+ uni.hideLoading();
|
|
|
+ });
|
|
|
+ },
|
|
|
/**
|
|
|
* 发送验证码
|
|
|
*
|
|
|
*/
|
|
|
code: Debounce(function() {
|
|
|
this.nums = 60;
|
|
|
- uni.showLoading({
|
|
|
- title: '加载中',
|
|
|
- mask: true
|
|
|
- });
|
|
|
let that = this;
|
|
|
if (!that.phone) return that.$util.Tips({
|
|
|
title: '请填写手机号码！'
|
|
|
@@ -128,14 +199,8 @@
|
|
|
if (!(/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.phone))) return that.$util.Tips({
|
|
|
title: '请输入正确的手机号码！'
|
|
|
});
|
|
|
- // registerVerify().then(res => {
|
|
|
- // that.$util.Tips({
|
|
|
- // title: res.message
|
|
|
- // });
|
|
|
- // that.timer = setInterval(that.getTimes, 1000);
|
|
|
- // that.disabled = true;
|
|
|
- uni.hideLoading();
|
|
|
- // })
|
|
|
+
|
|
|
+ this.$refs.verify.show();
|
|
|
}),
|
|
|
getTimes() {
|
|
|
this.nums = this.nums - 1;
|
|
|
@@ -150,21 +215,77 @@
|
|
|
}
|
|
|
},
|
|
|
checkboxChange(e) {
|
|
|
- console.log(e)
|
|
|
+ const arr = e.detail.value
|
|
|
+ this.checkbox1 = arr.includes('1')
|
|
|
+ this.checkbox2 = arr.includes('2')
|
|
|
},
|
|
|
formSubmit: function() {
|
|
|
if (this.onVerify()) {
|
|
|
const params = {
|
|
|
- checkbox1: this.checkbox1, // 骑手
|
|
|
- checkbox2: this.checkbox2, // 快递员
|
|
|
- isSwitch: this.isSwitch, // 是否有配送经验
|
|
|
+ jobScope: `${this.checkbox1 ? 1 : 0},${this.checkbox2 ? 1 : 0}`, // 骑手 // 快递员
|
|
|
+ isExped: this.isSwitch, // 是否有配送经验
|
|
|
name: this.name, // 姓名
|
|
|
phone: this.phone, // 电话
|
|
|
- bindingCaptcha: this.bindingCaptcha // 验证码
|
|
|
+ captcha: +this.bindingCaptcha, // 验证码
|
|
|
+ qualificationPicture: this.picsStr
|
|
|
}
|
|
|
console.log(params)
|
|
|
+ riderSettledApply(params).then(res => {
|
|
|
+ this.$util.Tips({
|
|
|
+ title: '提交成功，等待审核'
|
|
|
+ });
|
|
|
+ this.handBack()
|
|
|
+ }).catch(err => {
|
|
|
+ return this.$util.Tips({
|
|
|
+ title: err
|
|
|
+ });
|
|
|
+ });
|
|
|
}
|
|
|
- }
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 上传文件
|
|
|
+ *
|
|
|
+ */
|
|
|
+ uploadpic: function() {
|
|
|
+ let that = this;
|
|
|
+ that.$util.uploadImageOne({
|
|
|
+ url: 'upload/image',
|
|
|
+ name: 'multipart',
|
|
|
+ model: "user",
|
|
|
+ pid: 0
|
|
|
+ }, function(res) {
|
|
|
+ console.log(res)
|
|
|
+ that.pics.push(res);
|
|
|
+ that.$set(that, 'pics', that.pics);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 删除图片
|
|
|
+ *
|
|
|
+ */
|
|
|
+ DelPic: function(index) {
|
|
|
+ let that = this,
|
|
|
+ pic = this.pics[index];
|
|
|
+ that.pics.splice(index, 1);
|
|
|
+ that.$set(that, 'pics', that.pics);
|
|
|
+ },
|
|
|
+ // 图片预览
|
|
|
+ // 获得相册 idx
|
|
|
+ getPhotoClickIdx(e) {
|
|
|
+ let _this = this;
|
|
|
+ let idx = e.currentTarget.dataset.index;
|
|
|
+ _this.imgPreview(_this.pics, idx);
|
|
|
+ },
|
|
|
+ // 图片预览
|
|
|
+ imgPreview: function(list, idx) {
|
|
|
+ // list：图片 url 数组
|
|
|
+ if (list && list.length > 0) {
|
|
|
+ uni.previewImage({
|
|
|
+ current: list[idx], // 传 Number H5端出现不兼容
|
|
|
+ urls: list
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
},
|
|
|
onLoad(options) {},
|
|
|
mounted() {
|
|
|
@@ -212,7 +333,7 @@
|
|
|
|
|
|
.sub {
|
|
|
width: 100%;
|
|
|
- background-color: #FF6702;
|
|
|
+ background-color: $bg-color-primary;
|
|
|
font-weight: 600;
|
|
|
font-size: 35rpx;
|
|
|
color: #FFFFFF;
|
|
|
@@ -252,4 +373,146 @@
|
|
|
|
|
|
position: relative;
|
|
|
}
|
|
|
+
|
|
|
+
|
|
|
+ .settlementAgreement {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ background: rgba(0, 0, 0, .5);
|
|
|
+ z-index: 10;
|
|
|
+ }
|
|
|
+
|
|
|
+ .settlementAgreement .setAgCount {
|
|
|
+ background: #fff;
|
|
|
+ width: 656rpx;
|
|
|
+ height: 458px;
|
|
|
+ position: absolute;
|
|
|
+ top: 50%;
|
|
|
+ left: 50%;
|
|
|
+ border-radius: 12rpx;
|
|
|
+ -webkit-border-radius: 12rpx;
|
|
|
+ padding: 20rpx 52rpx !important;
|
|
|
+ -webkit-transform: translate(-50%, -50%);
|
|
|
+ -moz-transform: translate(-50%, -50%);
|
|
|
+ transform: translate(-50%, -50%);
|
|
|
+ overflow-y: scroll;
|
|
|
+
|
|
|
+ .content {
|
|
|
+ height: 740rpx !important;
|
|
|
+ overflow-y: scroll;
|
|
|
+
|
|
|
+ /deep/ p {
|
|
|
+ font-size: 13px;
|
|
|
+ line-height: 22px;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ img {
|
|
|
+ max-width: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .settlementAgreement .setAgCount .icon {
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #b4b1b4;
|
|
|
+ position: absolute;
|
|
|
+ top: 40rpx;
|
|
|
+ right: 15rpx;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .settlementAgreement .setAgCount .title {
|
|
|
+ color: #333;
|
|
|
+ font-size: 32rpx;
|
|
|
+ text-align: center;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+
|
|
|
+ .settlementAgreement .setAgCount .content {
|
|
|
+ margin-top: 32rpx;
|
|
|
+ color: #333;
|
|
|
+ font-size: 26rpx;
|
|
|
+ line-height: 22px;
|
|
|
+ text-align: justify;
|
|
|
+ text-justify: distribute-all-lines;
|
|
|
+ height: 756rpx;
|
|
|
+ overflow-y: scroll;
|
|
|
+ }
|
|
|
+
|
|
|
+ uni-checkbox-group,
|
|
|
+ .settleAgree {
|
|
|
+ display: inline-block;
|
|
|
+ font-size: 24rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .settleAgree {
|
|
|
+ @include main_color(theme);
|
|
|
+ }
|
|
|
+
|
|
|
+ .acea-row,
|
|
|
+ .upload {
|
|
|
+ display: -webkit-box;
|
|
|
+ display: -moz-box;
|
|
|
+ display: -webkit-flex;
|
|
|
+ display: -ms-flexbox;
|
|
|
+ display: flex;
|
|
|
+ -webkit-box-lines: multiple;
|
|
|
+ -moz-box-lines: multiple;
|
|
|
+ -o-box-lines: multiple;
|
|
|
+ -webkit-flex-wrap: wrap;
|
|
|
+ -ms-flex-wrap: wrap;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ }
|
|
|
+
|
|
|
+ .upload {
|
|
|
+ margin-top: 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .pictrue {
|
|
|
+ width: 130rpx;
|
|
|
+ height: 130rpx;
|
|
|
+ margin: 24rpx 22rpx 0 0;
|
|
|
+ position: relative;
|
|
|
+ font-size: 11px;
|
|
|
+ color: #bbb;
|
|
|
+
|
|
|
+ &:nth-child(4n) {
|
|
|
+ margin-right: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:nth-last-child(1) {
|
|
|
+ border: 0.5px solid #ddd;
|
|
|
+ box-sizing: border-box;
|
|
|
+ }
|
|
|
+
|
|
|
+ uni-image,
|
|
|
+ image {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ border-radius: 1px;
|
|
|
+
|
|
|
+ img {
|
|
|
+ -webkit-touch-callout: none;
|
|
|
+ -webkit-user-select: none;
|
|
|
+ -moz-user-select: none;
|
|
|
+ display: block;
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ opacity: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .icon-guanbi1 {
|
|
|
+ font-size: 33rpx;
|
|
|
+ position: absolute;
|
|
|
+ top: -10px;
|
|
|
+ right: -10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
</style>
|
ZZ