<template>
	<view class="container operator clearfix">
		<view class="operator-content">
			<view class="operator-from">
				<view class="from-row">
					<input class="input" type="text" v-model="linkman" placeholder="请输入运营人员姓名" maxlength="6"/>
				</view>
				<view class="from-row">
					<input class="input" type="text" v-model="clubMobile" placeholder="请输入运营人员手机号" maxlength="11"/>
				</view>
				<button class="add-btn" @click="confirm">确定</button>
			</view>
			<view class="operator-text">
				<view class="title" @click="this.$api.navigateTo('/pages/user/operator/bindstep')">
					<text class="iconfont icon-gantanhao-yuankuang"></text>
					<text class="text-m">运营人员绑定步骤</text>
					<text class="text-s">（点击查看图片引导）</text>
				</view>
				<view class="text-main">
					<view>1. 添加运营人员后，运营人员会收到一条邀请码短信</view>
					<view>2. 运营人员在微信搜索【采美采购商城】小程序，或者搜索关注【采美365网】，从底部菜单进入【采美采购商城】小程序</view>
					<view>3. 使用邀请码进行登录并绑定微信</view>
					<view>4. 绑定后，运营人员可通过微信直接登录采美365网</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>	
	import authorize from '@/common/config/authorize.js'	
	import { addOperator } from "@/api/operator.js"
	
	export default {
		data() {
			return {
				clubID:'',
				userID:'',
				linkman:'',
				clubMobile:'',
			}
		},
		onLoad(option){
			
		},
		methods: {			
			//提交
			confirm(){
				let data = this.addressData;
				if(this.linkman== ''){
					this.$util.msg('请输入运营人员姓名');
					return;
				}
				if(this.clubMobile == ''){
					this.$util.msg('请输入运营人员手机号');
					return;
				}
				if(!/(^1[0-9][0-9]{9}$)/.test(this.clubMobile)){
					this.$util.msg('请输入正确的手机号码');
					return;
				}
				let params = {
						mobile:this.clubMobile,
						linkName:this.linkman,
						userID:this.userID,
						clubID:this.clubID,
						configFlag:2
					}
				addOperator(params).then(response =>{
					this.$util.msg('添加成功',2000);
					setTimeout(() =>{
						uni.navigateBack();
					},2000)
				}).catch(response =>{
					this.$util.msg(response.msg,2000);
				})
			}
		},
		onShow() {
			this.$api.getStorage().then((resolve) =>{
				console.log(resolve)
				this.userID = resolve.userID
				this.clubID = resolve.clubID
			})
		}
	}
</script>

<style lang="scss">
	page{
		height: auto;
		background: $bg-color;
		border-top: 1px solid #EBEBEB;
	}
	.operator{
		padding-top: 160rpx;
		.operator-content{
			width: 702rpx;
			padding:0 24rpx;
			.operator-from{
				width: 100%;
				height: auto;
				.from-row{
					width: 100%;
					height: 40rpx;
					padding: 24rpx;
					background: #F7F7F7;
					border-radius: 14rpx;
					margin-bottom: 20rpx;
					font-size: $font-size-28;
					color: $text-color;
					.input{
						width: 100%;
						height: 100%;
						text-align: left;
					}
				}
			}
			.operator-text{
				width: 100%;
				height: auto;
				margin-top: 50rpx;
				line-height: 40rpx;
				.title{
					margin-bottom: 50rpx;
					.icon-gantanhao-yuankuang{
						font-size: $font-size-32;
						color: #166CE1;
						margin-right: 10rpx;
					}
					.text-m{
						font-size: $font-size-30;
						color: #166CE1;
					}
					.text-s{
						font-size: $font-size-24;
						color: #999999;
					}
				}
				.text-main{
					width: 100%;
					height: auto;
					view{
						line-height: 40rpx;
						font-size: $font-size-28;
						color: $text-color;
						text-align: justify;
						margin-bottom: 10rpx;
					}
				}
			}
			
		}
		.add-btn{
			width: 702rpx;
			height: 88rpx;
			font-size: $font-size-28;
			line-height: 88rpx;
			color: #FFFFFF;
			margin: 0 auto;
			text-align: center;
			background: $btn-confirm;
			border-radius: 14rpx;
			margin-top: 80rpx;
		}
		.add-btn.disabled{
			background: #F8F8F8;
			border-radius: 14rpx;
		}
	}
</style>

