sadjv3_user/pages/cooperate/hehuo.vue

<template>
	<view class="hehuo_view">
		<view class="advantage-title">门店入驻</view>
		<view class="advantage-bor"></view>
		<view class="adv_text_view">
			<view class="adv_lines">
				<view >1，您的门店经营多久了?</view>
				<radio-group @change="radioChangeJ">
					<label class="uni-list-cell uni-list-cell-pd adv_lines-view" v-for="(item, index) in jingying" :key="item.value">
						<view>
							<radio :value="item.value" :checked="index === currentJ" />
						</view>
						<view class="radio-title">{{item.name}}</view>
					</label>
				</radio-group>
			</view>
			<view class="adv_lines">
				<view >2，您的门店面积</view>
				<radio-group @change="radioChangeM">
					<label class="uni-list-cell uni-list-cell-pd adv_lines-view" v-for="(item, index) in mianji" :key="item.value">
						<view>
							<radio :value="item.value" :checked="index === currentM" />
						</view>
						<view class="radio-title">{{item.name}}</view>
					</label>
				</radio-group>
			</view>
			<view class="adv_lines">
				<view >3，您的门店团队有队少人?</view>
				<radio-group @change="radioChangeT">
					<label class="uni-list-cell uni-list-cell-pd adv_lines-view" v-for="(item, index) in tuandui" :key="item.value">
						<view>
							<radio :value="item.value" :checked="index === currentT" />
						</view>
						<view class="radio-title">{{item.name}}</view>
					</label>
				</radio-group>
			</view>
			<view class="adv_lines">
				<view >4，门店提供的项目有哪些?</view>
				<radio-group @change="radioChangeX">
					<label class="uni-list-cell uni-list-cell-pd adv_lines-view" v-for="(item, index) in xiangmu" :key="item.value">
						<view>
							<radio :value="item.value" :checked="index === currentX" />
						</view>
						<view class="radio-title">{{item.name}}</view>
					</label>
				</radio-group>
			</view>
		</view>
		<view class="adv_text_view">
			<view class="adv_lines">
				<view >姓名</view>
				<input type="text" v-model="userName" maxlength="11" placeholder="请输入真实姓名" />
			</view>
			<view class="adv-xian"></view>
			<view class="adv_lines">
				<view >手机号</view>
				<input type="number" v-model="phone" maxlength="11" placeholder="请输入手机号" />
			</view>
			<view class="adv-xian"></view>
			<view class="adv_lines">
				<view>备注</view>
				<textarea style="height: 100px;" v-model="beizhu" name="" maxlength="100" id="" cols="30" rows="10" placeholder="请输入备注~~~~"></textarea>
			</view>
			<view class="adv-xian"></view>
		</view>
		<view class="push-button">
			<view class="que-btn" @tap="save">提交申请</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				beizhu:'',
				phone:'',
				userName:'',
				jingying: [{
						value: '一年',
						name: '一年',
						checked: 'true'
					},
					{
						value: '一到三年',
						name: '一到三年'
					},
					{
						value: '三年以上',
						name: '三年以上'
					},
				],
				currentJ: 0,
				mianji: [{
						value: '50平米一下',
						name: '50平米一下',
						checked: 'true'
					},
					{
						value: '50到200平米',
						name: '50到200平米'
					},
					{
						value: '200平米以上',
						name: '200平米以上'
					},
				],
				currentM: 0,
				tuandui: [{
						value: '5-10人',
						name: '5-10人',
						checked: 'true'
					},
					{
						value: '10-15人',
						name: '10-15人'
					},
					{
						value: '15-20人',
						name: '15-20人'
					},
					{
						value: '20人以上',
						name: '20人以上'
					},
				],
				currentT: 0,
				xiangmu: [{
						value: '推荐按摩',
						name: '推荐按摩',
						checked: 'true'
					},
					{
						value: 'SPA',
						name: 'SPA'
					},
					{
						value: '足浴',
						name: '足浴'
					},
				],
				currentX: 0,
				mendianData:'',
				mianjiData:'',
				tuanduiData:'',
				xiangmuData:'',
			}
		},
		mounted() {
		},
		methods: {
			save() {
				if(!this.mendianData){
					this.mendianData=this.jingying[0].value
				}
				if(!this.mianjiData){
					this.mianjiData=this.mianji[0].value
				}
				if(!this.tuanduiData){
					this.tuanduiData=this.tuandui[0].value
				}
				if(!this.xiangmuData){
					this.xiangmuData=this.xiangmu[0].value
				}
				if (this.userName === '') {
					this.$queue.showToast('请输入姓名')
					return;
				}
				if (this.phone === '' || this.phone.length != 11) {
					this.$queue.showToast('请输入正确的手机号！')
					return;
				}
				
				let userId = this.$queue.getData('userId');
				let data = {
					userId: userId,
					name: this.userName,
					phone: this.phone,
					remark:this.beizhu,
					queone:this.mendianData,
					quetwo:this.mianjiData,
					quethree:this.tuanduiData,
					queforu:this.xiangmuData,
				}
				this.$Request.postJson('/app/dlssqjl/insertDlssqjl', data).then(res => {
					if (res.code == 0) {
						uni.hideLoading();
						this.$queue.showToast('提交成功！');
						setTimeout(d => {
							uni.switchTab({
								url:'/pages/index/index'
							})
						}, 1000);
					} else {
						uni.hideLoading();
						this.$queue.showToast(res.msg);
					}
				});
			},
			radioChangeX: function(evt) {//门店提供的项目有哪些
				for (let i = 0; i < this.xiangmu.length; i++) {
					if (this.xiangmu[i].value === evt.detail.value) {
						this.currentX = i;
						break;
					}
				}
				this.xiangmuData=evt.detail.value
			},
			radioChangeT: function(evt) {//您的门店团队有多少人
				for (let i = 0; i < this.tuandui.length; i++) {
					if (this.tuandui[i].value === evt.detail.value) {
						this.currentT = i;
						break;
					}
				}
				this.tuanduiData=evt.detail.value
			},
			radioChangeM: function(evt) {//您的门店面积
				for (let i = 0; i < this.mianji.length; i++) {
					if (this.mianji[i].value === evt.detail.value) {
						this.currentM = i;
						break;
					}
				}
				this.mianjiData=evt.detail.value
			},
			 radioChangeJ: function(evt) {//您的门店经营多久了
				for (let i = 0; i < this.jingying.length; i++) {
					if (this.jingying[i].value === evt.detail.value) {
						this.currentJ = i;
						break;
					}
				}
				this.mendianData=evt.detail.value
			},
		}
	}
</script>

<style lang="less">
	@import '../../static/less/index.less';
	@import '../../static/css/index.css';
	/deep/.uni-radio-input{
		width: 20px;
		height: 20px;
	}
	
	/deep/uni-radio::before{
		margin-right: -1px;
	}
	.push-button{
		    width: 100%;
		    height: 48px;
		    position: fixed;
		    bottom: 0px;
		    display: flex;
		    flex-direction: column;
		    align-items: center;
			margin: 0 auto;
	}
	.que-btn{
		display: inline-block;
		width: 90%;
		text-align: center;
		background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
		height: 40px;
		border-radius: 28px;
		color: #ffffff;
		line-height: 40px;
		margin-top: 4px;
		font-size: 34rpx;
	}
	.uni-textarea-compute{
		
	}
	/deep/.uni-textarea-textarea{
		border-radius: 8rpx;
		margin-top: 20rpx;
	}
	.margin-top-view{
		width: 150upx;
		height: 150upx;
		background: #f7f7f7;
	}
	.advantage-title{
		font-size: 32rpx;
		font-weight: bold;
		margin-top: 60rpx;
		margin-left: 30rpx;
	}
	.advantage-bor{
		width: 64px;
		height: 6px;
		border-radius: 3px;
		bottom: 0;
		background: linear-gradient(90deg, rgba(234, 248, 245, 0.7), rgba(132, 211, 196, 0.7));
		margin-bottom: 80rpx;
		
	}
	.adv-xian{
		height: 2rpx;
		border-bottom: 1px solid #e5e5e5;
	}
	.radio-title{
		margin-left: 5px;
	}
	.adv_lines-view{
		display: flex;
		flex-direction: row;
		align-items: center;
		margin-top: 10px;
	}
	.adv_lines{
		display: flex;
		justify-content: space-between;
		margin: 20rpx 0;
		font-size: 28rpx;
		flex-direction: column;
	}
	.adv_lines
	.adv_line{
		display: flex;
		justify-content: space-between;
		height: 50rpx;
		line-height: 50rpx;
		margin-bottom: 40rpx;
		font-size: 28rpx;
		}	
	.adv_input_text{
		text-align: right;
		line-height: 50rpx;
		font-size: 28rpx;
		}
	.adv_item_view{
		display: flex;
		justify-content: space-between;
		
	}	
	.adv_text_view {
		width: 95%;
		margin-left: 2.5%;
		background-color: #fff;
		border-radius: 10px;
		padding: 20px;
		margin-top: 20rpx;
	}
	.send-msg{
		padding: 0 30rpx;
		color: #fff;
		height: 55rpx;
		line-height: 54rpx;
		background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
		border-radius: 30rpx;
		}
	.usermain-btn{
		background: linear-gradient(to right, #029d88, #1fb38f);
		    color: #FFFFFF;
		    margin: 8px 16px;
		    position: fixed;
		    bottom: 0px;
		    width: 90%;
		    border-radius: 27px;
		    height: 43px;
		    line-height: 43px;
		    font-size: 17px;
		    text-align: center;
	}
	.adv_beizhu{
		background-color: #f7f7f7;
		height: 80rpx;
		border-radius: 8rpx;
		color: #999;
	}
	
	.adv_item_title{
		width: 300rpx;
	}
	.adv_xian {
		width: 100%;
		border-bottom: 1rpx solid #f7f7f7;
		margin-top: 10rpx;
		}
	
	.hehuo_view {
		width: 100%;
		padding-top: 10px;
		background-image: url('../../static/cooperate/cooperate5.png');
		background-repeat: no-repeat;
		background-size: 100% 550rpx;
		//display: flex;
		//flex-direction: column;
		//align-items: center;}

	.text_view {
		width: 95%;
		margin-left: 2.5%;
		background-color: #fff;
		border-radius: 10px;
		padding: 20px;
	.audit_message {
		color: red;
		width: 650rpx;
		height: 50rpx;
		}

			

	.save_btn1 {
		margin: 10rpx;
		width: 650rpx;
		height: 88rpx;
		background: #FFFFFF;
		border-radius: 10rpx;
		margin-top: 100rpx;
		text-align: center;
		line-height: 88rpx;
		}

			.item_view {
				margin-top: 30rpx;
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: space-between;

				.item_title {
					font-size: 32rpx;
					font-family: PingFang SC Heavy, PingFang SC Heavy-Heavy;
					color: #333333;
				}

				input {
					margin-top: 20rpx;
					height: 40rpx;
					font-size: 24rpx;
					font-family: PingFang SC Regular, PingFang SC Regular-Regular;
					font-weight: 400;
					color: #333333;
				}

				.xian {
					width: 100%;
					border-bottom: 1rpx solid #f7f7f7;
					margin-top: 10rpx;
				}
			}
		}
	}
</style>