<template>
	<view class="hehuo_view">
		<view class="advantage-title">
			<image style="width: 35rpx; height: 35rpx; margin-right:10rpx; margin-top: 5rpx;" src="../../../static/technician.png"></image>申请渠道商</view>
		<view class="advantage-bor" style="margin-right: 10rpx;"></view>
		<view class="text_view">
			<view class="item_view">
				<view class="item_title">姓名</view>
				<u-input type="text" v-model="name" placeholder="请输入姓名" />
				<view class="xian"></view>
			</view>
			<view class="item_view">
				<view class="item_title">联系电话</view>
				<u-input type="number" v-model="phone" maxlength="11" placeholder="请输入联系电话" />
				<view class="xian"></view>
			</view>
			<view class="item_view">
				<view class="item_title" @click.stop="pickerShow">申请渠道</view>
				<ch-picker ref="ChPicker" position="bottom" :columns="columns" :defaultIndex="curIndexs" @confirm="pickerChange">
				        </ch-picker>
				<u-input type="text" :disabled="true" v-model="qudao" maxlength="11" placeholder="请选择渠道" />
				<view class="xian"></view>
			</view>
		</view>
		<view class="header-view header-padd header-margin">
			<view class="d-title title-font">
				备注
			</view>
			<view class="list-pay">
				<view class="textarea-pay-list">
					<textarea @input="remarks" class="textarea-pay" v-model="remarks" placeholder="请输入备注" name="" maxlength="100"></textarea>
				</view>
			</view>
		</view>
		<view  class="push-button">
			<view class="que-btn" @tap="save">提交申请</view>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				name: '',
				phone: '',
				remarks:'',
				qudao:'',
				curIndexs: [0],
				columns: [
					[
						{label: '暂无接入渠道商',value: '暂无接入渠道商'},
						{label: '足球联赛',value: '足球联赛'},
						{label: '地推',value: '地推',},
						{label: '酒店',value: '酒店'}
					],
				],
			}
		},
		methods: {
			 pickerShow() {
				this.$refs.ChPicker.show()
			},
			pickerChange(e) {
				console.log(e.columns[0].value);
				this.qudao=e.columns[0].value
				this.curIndexs = e.indexs
			},
			getChannel() {
				let userId = this.$queue.getData('userId');
				this.$Request.getT('/app/artificer/selectAgencyById?userId=' + userId).then(res => {
					if (res.code == 0) {
						if (res.data == null) {
							this.bb = 1;
						} else {
							this.bb = res.data.status;
							this.city = res.data.city;
							this.age = res.data.age;
							this.headImg = res.data.img;
							this.userName = res.data.name;
							this.phone = res.data.phone;
						}
						console.log(this.bb)
						// this.auditContent = res.data.auditContent;
					}
				});
			},
			save() {
				if (this.name === '') {
					this.$queue.showToast('请输入姓名')
					return;
				}
				if (this.phone === '' || this.phone.length != 11) {
					this.$queue.showToast('请输入正确的手机号！')
					return;
				}
				
				let userId = this.$queue.getData('userId');
				let data = {
					remarks: this.remarks,
					name: this.name,
					phone: this.phone,
				}
				this.$Request.get('/app/commission/jjr/apply', data).then(res => {
					if (res.code == 0) {
						uni.hideLoading();
						this.$queue.showToast(res.msg);
						// setTimeout(d => {
						// 	uni.navigateBack();
						// }, 1000);
					} else {
						uni.hideLoading();
						this.$queue.showToast(res.msg);
					}
				});
			},
		}
	}
</script>

<style lang="less">
	@import '../../../static/less/index.less';
	@import '../../../static/css/index.css';
	/deep/.uni-textarea-textarea{
		font-weight: 400;
		font-size: 26rpx;
	}
	/deep/.uni-textarea-placeholder{
		font-weight: 400;
		font-size: 28rpx;
		color: rgb(192, 196, 204);
	}
	.textarea-pay-list{
		width: 100%;
		height: 120px;
		margin-top: 10px;
	}
	.textarea-pay{
		background-color: #f3f3f3;
		width: 100%;
		height: 100%;
		background: #F3F3F3;
		border-radius: 14rpx;
		padding: 7px;
	}
	.list-pay{
		width: 100%;
	}
	.title-font{
		font-size:30rpx;
		color: #333333;
	}
	.d-title{
		font-size: 15px;
		font-family: PingFang SC Heavy, PingFang SC Heavy-Heavy;
		color: #333333;
	}
	.header-view{
		background-color: #fff;
		border-radius: 11px;
	}
	.header-padd{
		padding:30rpx;
	}
	.header-margin{
		margin:20rpx;
	}
	.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;
	}
	
	.margin-top-view{
		width: 150upx;
		height: 150upx;
		background: #f7f7f7;
	}
	.advantage-title{
		font-size: 32rpx;
		font-weight: bold;
		margin-top: 60rpx;
		margin-left: 35rpx;
	}
	.advantage-bor{
		width: 96px;
		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;
		margin-left: 35rpx;
		
	}
	.hehuo_view {
		width: 100%;
		padding-top: 10px;
		height: 100vh;
		background:#f7f7f7 url(../../../static/cooperate/cooperate6.png)no-repeat ;
		background-size: 100%;
		position: relative;
		display: flex;
		flex-direction: column;
		//align-items: center;
		
		.text_view {
			width: 95%;
			margin: 0 auto;
			background-color: #fff;
			border-radius: 10px;
			padding: 20px;
			.audit_message {
				color: red;
				width: 650rpx;
				height: 50rpx;
				margin-top: 50rpx;
			}

			

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

			.item_view {
				margin-top: 30rpx;

				.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>
