lifizer
+215
-130
@@ -1,82 +1,122 @@
|
||||
<template>
|
||||
<u--form :model="form" errorType="toast" labelWidth="216rpx" ref="wholesalerForm">
|
||||
<view class="box-state" v-if="stateTitle && isDraft!==1 && applyType === 4">
|
||||
<u-alert :center="stateType==='primary'" :title="stateTitle" :type="stateType"/>
|
||||
<u--form
|
||||
ref="wholesalerForm"
|
||||
:model="form"
|
||||
errorType="toast"
|
||||
labelWidth="216rpx"
|
||||
>
|
||||
<view
|
||||
v-if="stateTitle && isDraft!==1 && applyType === 4"
|
||||
class="box-state"
|
||||
>
|
||||
<u-alert
|
||||
:center="stateType === 'primary'"
|
||||
:title="stateTitle"
|
||||
:type="stateType"
|
||||
/>
|
||||
</view>
|
||||
|
||||
<u-cell-group title="采购批发商基本信息" :border="false" :customStyle="{'fontSize':'40rpx'}">
|
||||
|
||||
<u-cell-group
|
||||
:border="false"
|
||||
:customStyle="{'fontSize':'40rpx'}"
|
||||
title="采购批发商基本信息"
|
||||
>
|
||||
<u-form-item prop="name">
|
||||
<u-cell title="批发商名称" :border="false">
|
||||
<template #icon>
|
||||
<text class="required">*</text>
|
||||
</template>
|
||||
<template #value>
|
||||
<u-input v-model="form.name" border="none" placeholder="请填写批发商名称"/>
|
||||
<u-input
|
||||
v-model="form.name"
|
||||
:disabled="reviewing"
|
||||
border="none"
|
||||
placeholder="请填写批发商名称"
|
||||
/>
|
||||
</template>
|
||||
</u-cell>
|
||||
</u-form-item>
|
||||
|
||||
<u-form-item prop="avatar">
|
||||
<u-cell title="头像" :border="false"/>
|
||||
<u-cell :border="false">
|
||||
<template #title>
|
||||
<view class="box-upload" @click="chooseLogoImg('avatar')">
|
||||
<view class="btn-upload" v-if="form.avatar.length===0">上传图片</view>
|
||||
<image class="img-preview" :src="form.avatar" v-else/>
|
||||
<view
|
||||
v-if="!form.avatar"
|
||||
class="btn-upload"
|
||||
>上传图片</view>
|
||||
<image
|
||||
v-else
|
||||
:src="form.avatar"
|
||||
class="img-preview"
|
||||
/>
|
||||
</view>
|
||||
</template>
|
||||
</u-cell>
|
||||
</u-form-item>
|
||||
|
||||
<u-form-item prop="contact">
|
||||
<u-cell title="联系人姓名" :border="false">
|
||||
<template #icon>
|
||||
<text class="required">*</text>
|
||||
</template>
|
||||
<template #value>
|
||||
<u-input v-model="form.contact" border="none" placeholder="请填写联系人姓名"/>
|
||||
<u-input
|
||||
v-model="form.contact"
|
||||
:disabled="reviewing"
|
||||
border="none"
|
||||
placeholder="请填写姓名"
|
||||
/>
|
||||
</template>
|
||||
</u-cell>
|
||||
</u-form-item>
|
||||
|
||||
<u-form-item prop="phone">
|
||||
<u-cell title="联系方式" :border="false">
|
||||
<template #icon>
|
||||
<text class="required">*</text>
|
||||
</template>
|
||||
<template #value>
|
||||
<u-input v-model="form.phone" border="none" placeholder="请填写联系方式"/>
|
||||
<u-input
|
||||
v-model="form.phone"
|
||||
:disabled="reviewing"
|
||||
type="number"
|
||||
border="none"
|
||||
placeholder="请填写联系方式"
|
||||
/>
|
||||
</template>
|
||||
</u-cell>
|
||||
</u-form-item>
|
||||
|
||||
<u-form-item prop="captcha">
|
||||
<u-cell title="验证码" :border="false">
|
||||
<template #icon>
|
||||
<text class="required">*</text>
|
||||
</template>
|
||||
<template #value>
|
||||
<u-input v-model="form.captcha" border="none" placeholder="请填写验证码">
|
||||
<template slot="suffix">
|
||||
<view class="captcha-wrap">
|
||||
<view class="captcha-wrap-input">
|
||||
<u-input
|
||||
v-model="form.captcha"
|
||||
:disabled="reviewing"
|
||||
border="none"
|
||||
placeholder="请填写验证码"
|
||||
/>
|
||||
</view>
|
||||
<view class="captcha-wrap-ft">
|
||||
<u-code
|
||||
ref="uCode"
|
||||
@change="codeChange"
|
||||
seconds="30"
|
||||
changeText="X秒重新获取"
|
||||
></u-code>
|
||||
ref="uCode"
|
||||
seconds="30"
|
||||
changeText="X秒重新获取"
|
||||
@change="codeChange"
|
||||
/>
|
||||
<u-button
|
||||
@tap="getCode"
|
||||
:text="tips"
|
||||
type="success"
|
||||
size="normal"
|
||||
></u-button>
|
||||
</template>
|
||||
</u-input>
|
||||
:text="tips"
|
||||
type="success"
|
||||
size="normal"
|
||||
@tap="getCode"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</u-cell>
|
||||
</u-form-item>
|
||||
|
||||
<u-form-item prop="qualification">
|
||||
<view class="licence-section">
|
||||
<u-cell :border="false">
|
||||
@@ -92,14 +132,20 @@
|
||||
<u-cell :border="false">
|
||||
<template #title>
|
||||
<view class="box-upload" @click="chooseLogoImg('licence')">
|
||||
<view class="btn-upload" v-if="form.qualification.length===0">上传图片</view>
|
||||
<image class="img-preview" :src="form.qualification" v-else/>
|
||||
<view
|
||||
v-if="!form.qualification"
|
||||
class="btn-upload"
|
||||
>上传图片</view>
|
||||
<image
|
||||
v-else
|
||||
:src="form.qualification"
|
||||
class="img-preview"
|
||||
/>
|
||||
</view>
|
||||
</template>
|
||||
</u-cell>
|
||||
</view>
|
||||
</u-form-item>
|
||||
|
||||
<u-form-item prop="area">
|
||||
<u-cell title="省市区" :border="false" isLink>
|
||||
<template #icon>
|
||||
@@ -107,30 +153,54 @@
|
||||
</template>
|
||||
<template #value>
|
||||
<view class="u-text__value" :class="{'area-item':form.area.length===0}">
|
||||
<CitySelect ref="cityselect" :defaultValue="form.area" @callback="result" :items="district"/>
|
||||
<CitySelect
|
||||
ref="cityselect"
|
||||
:defaultValue="form.area"
|
||||
:disabled="reviewing"
|
||||
:items="district"
|
||||
@callback="result"
|
||||
/>
|
||||
</view>
|
||||
</template>
|
||||
</u-cell>
|
||||
</u-form-item>
|
||||
|
||||
<u-form-item prop="address">
|
||||
<u-cell title="详细地址" :border="false">
|
||||
<template #icon>
|
||||
<text class="required">*</text>
|
||||
</template>
|
||||
<template #value>
|
||||
<u-input v-model="form.address" border="none" placeholder="请填写详细地址"/>
|
||||
<u-input
|
||||
v-model="form.address"
|
||||
:disabled="reviewing"
|
||||
border="none"
|
||||
placeholder="请填写详细地址"
|
||||
/>
|
||||
</template>
|
||||
</u-cell>
|
||||
</u-form-item>
|
||||
|
||||
</u-cell-group>
|
||||
<view class="btn-submit btn-remove" v-if="reviewStatus===0 && isDraft!==1" @click="changeRemove(true)">撤销申请</view>
|
||||
<view class="btn-submit" @click="onSubmit" v-else>提交申请</view>
|
||||
|
||||
<u-modal :show="showRemove" content="您确定撤销申请吗?" showCancelButton @cancel="changeRemove(false)"
|
||||
@confirm="onRemove"></u-modal>
|
||||
|
||||
<view
|
||||
v-if="reviewStatus === 0 && isDraft !== 1"
|
||||
class="btn-submit btn-remove"
|
||||
@click="changeRemove(true)"
|
||||
>
|
||||
撤销申请
|
||||
</view>
|
||||
<view
|
||||
v-else
|
||||
class="btn-submit"
|
||||
@click="onSubmit"
|
||||
>
|
||||
提交申请
|
||||
</view>
|
||||
<u-modal
|
||||
:show="showRemove"
|
||||
content="您确定撤销申请吗?"
|
||||
showCancelButton
|
||||
@cancel="changeRemove(false)"
|
||||
@confirm="onRemove"
|
||||
/>
|
||||
<u-popup :show="show" mode="center" round="10" closeable @close="show=false">
|
||||
<view class="popup-body">
|
||||
<view class="tc bold">入驻申请须知</view>
|
||||
@@ -145,37 +215,42 @@
|
||||
<text>我已仔细阅读并同意</text>
|
||||
</checkbox-group>
|
||||
</view>
|
||||
<u-button type="error" text="确定" :disabled="!isAgree" @click="save"></u-button>
|
||||
<u-button
|
||||
type="error"
|
||||
text="确定"
|
||||
:disabled="!isAgree"
|
||||
@click="save"
|
||||
/>
|
||||
</view>
|
||||
</u-popup>
|
||||
</u--form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import CitySelect from "@/components/CitySelect";
|
||||
import {getShopData, getWholesaler, removeApply, saveWholesaler} from "@/api/join";
|
||||
import {getCity, registerVerify} from "@/api/user";
|
||||
import {chooseImage} from "@/utils";
|
||||
import CitySelect from '@/components/CitySelect'
|
||||
import {getShopData, getWholesaler, removeApply, saveWholesaler} from '@/api/join'
|
||||
import {getCity, registerVerify} from '@/api/user'
|
||||
import {chooseImage} from '@/utils'
|
||||
import { pageListenMixins } from '@/mixins/pageListenMixins'
|
||||
|
||||
export default {
|
||||
name: "pkgJoinWholesaler",
|
||||
name: 'pkgJoinWholesaler',
|
||||
components: {
|
||||
CitySelect
|
||||
},
|
||||
mixins: [pageListenMixins],
|
||||
data() {
|
||||
return {
|
||||
tips: "",
|
||||
tips: '获取验证码',
|
||||
form: {
|
||||
name: "",
|
||||
avatar: "",
|
||||
contact: "",
|
||||
phone: "",
|
||||
captcha: "",
|
||||
qualification: "",
|
||||
area: "",
|
||||
address: ""
|
||||
name: '',
|
||||
avatar: '',
|
||||
contact: '',
|
||||
phone: '',
|
||||
captcha: '',
|
||||
qualification: '',
|
||||
area: '',
|
||||
address: ''
|
||||
},
|
||||
rules: {
|
||||
'name': {
|
||||
@@ -221,175 +296,178 @@ export default {
|
||||
trigger: ['blur', 'change']
|
||||
}
|
||||
},
|
||||
|
||||
district: [],
|
||||
address: {},
|
||||
|
||||
isAgree: false,
|
||||
show: false,
|
||||
notice: "",
|
||||
notice: '',
|
||||
showRemove: false,
|
||||
|
||||
applyType: null,
|
||||
isDraft: null,
|
||||
reviewStatus: null,
|
||||
stateTitle: "",
|
||||
stateType: "primary",
|
||||
isPass: false,
|
||||
stateTitle: '',
|
||||
stateType: 'primary',
|
||||
// 是否为审核中
|
||||
reviewing: false,
|
||||
pageKeyId: Object.freeze('merchantApplyWholesaler')
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
this.init();
|
||||
this.init()
|
||||
},
|
||||
onReady() {
|
||||
this.$refs.wholesalerForm.setRules(this.rules);
|
||||
this.$refs.wholesalerForm.setRules(this.rules)
|
||||
},
|
||||
methods: {
|
||||
changeRemove(state){
|
||||
this.showRemove=state
|
||||
this.showRemove = state
|
||||
},
|
||||
codeChange(text) {
|
||||
this.tips = text;
|
||||
this.tips = text
|
||||
},
|
||||
getCode() {
|
||||
if (this.form.phone.length === 0) return;
|
||||
if (this.reviewing) return
|
||||
if (this.form.phone.length === 0) {
|
||||
uni.$u.toast('请输入位手机号')
|
||||
return
|
||||
}
|
||||
if (this.form.phone.length !== 11) {
|
||||
uni.$u.toast('请输入11位手机号')
|
||||
return
|
||||
}
|
||||
if (this.$refs.uCode.canGetCode) {
|
||||
uni.showLoading({
|
||||
title: '正在获取验证码'
|
||||
})
|
||||
registerVerify({phone: this.form.phone, type: "merchantApply"}).then(() => {
|
||||
uni.hideLoading();
|
||||
registerVerify({
|
||||
phone: this.form.phone,
|
||||
type: 'merchantApply'
|
||||
}).then(() => {
|
||||
uni.hideLoading()
|
||||
// 这里此提示会被this.start()方法中的提示覆盖
|
||||
uni.$u.toast('验证码已发送');
|
||||
uni.$u.toast('验证码已发送')
|
||||
// 通知验证码组件内部开始倒计时
|
||||
this.$refs.uCode.start();
|
||||
this.$refs.uCode.start()
|
||||
}).catch(err => {
|
||||
uni.hideLoading();
|
||||
uni.$u.toast(err.msg);
|
||||
uni.hideLoading()
|
||||
uni.$u.toast(err.msg)
|
||||
})
|
||||
} else {
|
||||
uni.$u.toast('倒计时结束后再发送');
|
||||
uni.$u.toast('倒计时结束后再发送')
|
||||
}
|
||||
},
|
||||
|
||||
init() {
|
||||
getCity().then(({data}) => {
|
||||
this.district = data;
|
||||
});
|
||||
|
||||
this.district = data
|
||||
})
|
||||
getShopData().then(({data}) => {
|
||||
this.notice = data.merchantApplyNotice;
|
||||
this.initInfo();
|
||||
});
|
||||
this.notice = data.merchantApplyNotice
|
||||
this.initInfo()
|
||||
})
|
||||
},
|
||||
|
||||
initInfo() {
|
||||
getWholesaler().then(({data}) => {
|
||||
this.applyType = data.applyType;
|
||||
this.applyType = data.applyType
|
||||
if (data.applyType === 4) {
|
||||
this.isDraft = data.isDraft;
|
||||
this.reviewStatus = data.reviewStatus;
|
||||
this.isDraft = data.isDraft
|
||||
this.reviewStatus = data.reviewStatus
|
||||
}
|
||||
|
||||
switch (data.reviewStatus) {
|
||||
case 0:
|
||||
this.stateTitle = "审核中";
|
||||
this.stateType = "primary";
|
||||
this.stateTitle = '审核中'
|
||||
this.stateType = 'primary'
|
||||
this.reviewing = true
|
||||
break;
|
||||
case 1:
|
||||
this.isPass = true;
|
||||
this.reviewing = false
|
||||
break;
|
||||
case 2:
|
||||
this.stateTitle = "审核驳回：" + data.reviewMsg;
|
||||
this.stateType = "error";
|
||||
this.stateTitle = '审核驳回：' + data.reviewMsg
|
||||
this.stateType = 'error'
|
||||
this.reviewing = false
|
||||
break;
|
||||
}
|
||||
|
||||
if (data.wholesalerInfo) {
|
||||
this.form = data.wholesalerInfo;
|
||||
this.form.position = this.$forceToDecimal(this.form.longitude, 6) + ',' + this.$forceToDecimal(this.form.latitude, 6);
|
||||
this.form.area = `${this.form.provinceName} ${this.form.cityName} ${this.form.areaName}`;
|
||||
this.form = data.wholesalerInfo
|
||||
this.form.position = this.$forceToDecimal(this.form.longitude, 6) + ',' + this.$forceToDecimal(this.form.latitude, 6)
|
||||
this.form.area = `${this.form.provinceName} ${this.form.cityName} ${this.form.areaName}`
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
|
||||
chooseLogoImg(target) {
|
||||
if (this.reviewing) return
|
||||
chooseImage(img => {
|
||||
switch (target) {
|
||||
case "avatar":
|
||||
this.form.avatar = img;
|
||||
break;
|
||||
case "licence":
|
||||
this.form.qualification = img;
|
||||
break;
|
||||
case 'avatar':
|
||||
this.form.avatar = img
|
||||
break
|
||||
case 'licence':
|
||||
this.form.qualification = img
|
||||
break
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
|
||||
// 省市区
|
||||
result(values) {
|
||||
this.address = {
|
||||
province: values.province.name || "",
|
||||
city: values.city.name || "",
|
||||
district: values.district.name || "",
|
||||
province: values.province.name || '',
|
||||
city: values.city.name || '',
|
||||
district: values.district.name || '',
|
||||
provinceId: values.province.id,
|
||||
cityId: values.city.id,
|
||||
areaId: values.district.id
|
||||
};
|
||||
this.form.area = `${this.address.province} ${this.address.city} ${this.address.district}`;
|
||||
this.form.provinceId = values.province.id;
|
||||
this.form.cityId = values.city.id;
|
||||
this.form.areaId = values.district.id;
|
||||
}
|
||||
this.form.area = `${this.address.province} ${this.address.city} ${this.address.district}`
|
||||
this.form.provinceId = values.province.id
|
||||
this.form.cityId = values.city.id
|
||||
this.form.areaId = values.district.id
|
||||
},
|
||||
|
||||
onSubmit() {
|
||||
this.$refs.wholesalerForm.validate().then(res => {
|
||||
// 校验通过
|
||||
this.show = true;
|
||||
this.show = true
|
||||
}).catch(errors => {
|
||||
// 校验失败
|
||||
console.log(errors)
|
||||
})
|
||||
},
|
||||
|
||||
onRemove() {
|
||||
removeApply().then(res => {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: "none",
|
||||
icon: 'none',
|
||||
duration: 3000,
|
||||
success: () => {
|
||||
this.showRemove = false;
|
||||
this.showRemove = false
|
||||
setTimeout(() => {
|
||||
uni.navigateBack();
|
||||
uni.navigateBack()
|
||||
}, 3000)
|
||||
}
|
||||
})
|
||||
});
|
||||
})
|
||||
},
|
||||
|
||||
changeAgree(event) {
|
||||
this.isAgree = event.detail.value.length > 0
|
||||
},
|
||||
|
||||
save() {
|
||||
saveWholesaler(this.form).then(res => {
|
||||
if (res.status === 200) {
|
||||
uni.showToast({
|
||||
title: "您的入驻申请已提交成功，请耐心等待审核",
|
||||
icon: "none",
|
||||
title: '您的入驻申请已提交成功，请耐心等待审核',
|
||||
icon: 'none',
|
||||
success: () => {
|
||||
this.initInfo();
|
||||
this.show = false;
|
||||
this.initInfo()
|
||||
this.show = false
|
||||
}
|
||||
})
|
||||
}
|
||||
}).catch(err => {
|
||||
uni.showToast({
|
||||
title: err.msg,
|
||||
icon: "none",
|
||||
icon: 'none',
|
||||
success: () => {
|
||||
this.show = false;
|
||||
this.show = false
|
||||
}
|
||||
})
|
||||
})
|
||||
@@ -421,4 +499,11 @@ export default {
|
||||
.font-color-red{
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.captcha-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.captcha-wrap-input {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user