<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="params.linkName" placeholder="请输入运营人员姓名" maxlength="6"/>
				</view>
				<view class="from-row">
					<input class="input" type="text" v-model="params.mobile" placeholder="请输入运营人员手机号" maxlength="11"/>
				</view>
				<button class="add-btn" @click="AddConfirm">确定</button>
			</view>
			<view class="operator-text">
				<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'	
	export default {
		data() {
			return {
				params:{
					shopID:'',
					userID:'',
					mobile:'',
					linkName:'',
					configFlag:2
				}
			}
		},
		onLoad(option){
			
		},
		methods: {			
			//提交
			AddConfirm(){
				let data = this.addressData;
				if(this.params.linkName== ''){
					this.$util.msg('请输入运营人员姓名');
					return;
				}
				if(this.params.mobile == ''){
					this.$util.msg('请输入运营人员手机号');
					return;
				}
				if(!/(^1[0-9][0-9]{9}$)/.test(this.params.mobile)){
					this.$util.msg('请输入正确的手机号码');
					return;
				}
				this.UserService.PostAddOperator(this.params).then(response =>{
					this.$util.msg('添加成功',2000,true,'success')
					setTimeout(() =>{
						uni.navigateBack();
					},2000)
				}).catch(error =>{
					this.$util.msg(error.msg,2000);
				})
			}
		},
		onShow() {
			this.$api.getStorage().then((resolve) =>{
				this.params.userID = resolve.userID
				this.params.shopID = resolve.shopID
			})
		}
	}
</script>

<style lang="scss">
	page{
		height: auto;
		background: $bg-color;
		border-top: 1px solid #EBEBEB;
	}
	.operator{
		padding-top: 160rpx;
		.operator-content{
			width: 100%;
			padding: 0 75rpx;
			box-sizing: border-box;
			.operator-from{
				width: 100%;
				height: auto;
				.from-row{
					height: 40rpx;
					padding: 24rpx 40rpx;
					background: #F7F7F7;
					border-radius: 44rpx;
					margin-bottom: 40rpx;
					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: 600rpx;
			height: 88rpx;
			font-size: $font-size-28;
			line-height: 88rpx;
			color: #FFFFFF;
			margin: 0 auto;
			text-align: center;
			background: $btn-confirm;
			border-radius: 44rpx;
			margin-top: 80rpx;
		}
		.add-btn.disabled{
			background: #F8F8F8;
			border-radius: 44rpx;
		}
	}
</style>

