bjhedasx/webcode/uni-app/pages/member/supplierSettle.vue

<template>
	<view class="page" v-if="showPage">
		<view class="pageMain">
			<view class="flex align-center border-bottom-ed">
				<view class="text-30 text-bold">公司名称</view>
				<view class="flex-one margin-left-30">
					<input class="line-height-100 width-100p text-right text-30 text-33" placeholder="请输入"
						placeholder-class="text-aa" v-model="companyName" maxlength="30" :disabled="status == 1 || status == 2" />
				</view>
			</view>
			<view class="flex align-center border-bottom-ed margin-top-10">
				<view class="text-30 text-bold">联系人姓名</view>
				<view class="flex-one margin-left-30">
					<input class="line-height-100 width-100p text-right text-30 text-33" placeholder="请输入"
						placeholder-class="text-aa" v-model="userName" maxlength="8" :disabled="status == 1|| status == 2" />
				</view>
			</view>
			<view class="flex align-center border-bottom-ed margin-top-10">
				<view class="text-30 text-bold">联系电话</view>
				<view class="flex-one margin-left-30">
					<input class="line-height-100 width-100p text-right text-30 text-33" placeholder="请输入"
						placeholder-class="text-aa" type="number" v-model="userPhone" maxlength="11"
						:disabled="status == 1|| status == 2" />
				</view>
			</view>
			<view class="margin-top-40">
				<view class="text-30 text-33 text-bold margin-bottom-15">
					公司营业执照
				</view>
				<ty-image-images-upload :count="1" :video-count="0" @imageChange="licenseChange" :image_list="license"
					:disabled="status == 1|| status == 2"></ty-image-images-upload>
			</view>
			<view class="margin-top-25" v-if="status == 3">
				<view class="text-28 text-bold text-ff85 margin-bottom-15">
					审核意见
				</view>
				<view class="padding-20 bg-f5 text-28 text-33 line-40">
					{{refuseReason}}
				</view>
			</view>
		</view>
		<view class="bottomBox">
			<view class="flex align-center justify-center margin-bottom-30" @click="isAgree = !isAgree">
				<view class="tyIcon-xuanzhong1 text-2f9 text-30 margin-right-10" v-if="isAgree"></view>
				<view class="tyIcon-quan text-cc text-30 margin-right-10" v-else></view>
				<view class="text-24 text-98">我已阅读、理解并同意遵守</view>
				<view class="text-24 text-4b8" @click.stop="go('/pages/member/settleAgreement?type=2')">《入驻协议》</view>
			</view>
			<view class="text-32 text-fe text-bold text-center line-height-100 radius-50 bg-2f9 width-100p"
				v-if="status == 0" @click="tapSub">
				提交审核
			</view>
			<view class="text-32 text-33 text-bold text-center line-height-100 radius-50 width-100p"
				style="background: #e5e5e5;" v-if="status == 1">
				审核中
			</view>
			<view class="text-32 text-fe text-bold text-center line-height-100 radius-50 bg-2f9 width-100p"
				v-if="status == 3"  @click="tapSub">
				重新提交
			</view>
			<view class="text-32 text-fe text-bold text-center line-height-100 radius-50 width-100p" style="background: #0BC160;"
				v-if="status == 2">
				审核通过
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				companyName: '',
				userName: '',
				userPhone: '',
				license: [], //营业执照
				isAgree: false,
				status: 0, //0-未提交 1-审核中 2-已通过 3-已拒绝
				refuseReason:'',
				showPage:false,
			}
		},
		onLoad(options) {
			this.getPageData()
		},
		methods: {
			getPageData(){
				this.rq.getData('fire/api/Fire/getSupplyJoinData').then(res=>{
					if(res.code == 0){
						if(res.data.supply_data){
							this.companyName = res.data.supply_data.company_name;
							this.userName = res.data.supply_data.linkman;
							this.userPhone = res.data.supply_data.mobile_phone;
							this.license = [res.data.supply_data.business_license];
							this.status = res.data.supply_data.status;
							this.refuseReason = res.data.supply_data.examine_idea;
						}
						this.showPage = true;
					}
				})
			},
			licenseChange(e) {
				this.license = e.image_list;
			},
			tapSub(){
				if(this.companyName == ''){
					this.cn.alert('请填写公司名称');
					return;
				}
				if(this.userName == ''){
					this.cn.alert('请填写联系人姓名');
					return;
				}
				if(this.userPhone == ''){
					this.cn.alert('请填写联系电话');
					return;
				}
				if(this.userPhone.length != 11){
					this.cn.alert('联系电话格式不正确');
					return;
				}
				if(this.license.length == 0){
					this.cn.alert('请上传公司营业执照 ');
					return;
				}
				if(!this.isAgree){
					this.cn.alert('请阅读、理解并同意遵守《入驻协议》');
					return;
				}
				this.rq.getData('fire/api/Fire/submitSupplyJoin',{
					company_name : this.companyName,
					linkman : this.userName,
					mobile_phone : this.userPhone,
					business_license : this.license.join(',')
				}).then(res=>{
					if(res.code == 0){
						this.cn.alert('提交成功，请等待平台审核').then(()=>{
							uni.navigateBack({
								delta:1
							})
						})
					}
				})
			}
		}
	}
</script>

<style scoped>
	.pageMain {
		width: 100vw;
		min-height: 100vh;
		background: #fff;
		padding: 10rpx 30rpx calc(200rpx + env(safe-area-inset-bottom));
		box-sizing: border-box;
	}

	.bottomBox {
		width: 100vw;
		background: #fff;
		position: fixed;
		left: 0;
		bottom: 0;
		padding: 20rpx 30rpx calc(10rpx + env(safe-area-inset-bottom));
		box-sizing: border-box;
	}
</style>