<template>
	<app-layout>
		<view class="main-center autoCenter">
			<image style="width: 229rpx; height: 58rpx;" src="https://t17.9026.com/web/statics/image/sale/xcrj_login.png" mode="">
			</image>
			<view class="title">销售端</view>
		</view>
		<view class="login_form">
			<view class="item">
				<view class="title">手机号</view>
				<input class="input" v-model="account" maxlength="11" type="number" placeholder-class="plh_class" placeholder="请输入您的手机号" />
				<view class="b_line"></view>
			</view>
			<view class="item">
				<view class="title">密码</view>
				<input class="input" v-model="password" type="password" placeholder-class="plh_class" placeholder="请输入请输入密码" />
				<view class="b_line"></view>
			</view>
			<view class="forget" @click="forgetPwd">忘记密码</view>
			<button class="submit" :style="{background:getTheme.background_gradient_btn,}" type="default" @click="login">登录</button>
		</view>
	</app-layout>
</template>

<script>
	import {mapGetters,mapActions} from 'vuex'
	export default {
		data() {
			return {
				account:'',
				password:'',
			};
		},
		computed:{
			...mapGetters('mallConfig', {
				getTheme: 'getTheme'
			}),
		},
		methods:{
			...mapActions('user',['refresh']),
		 async login(){
			 if(!this.$validation.mobile(this.account)){
				 uni.showToast({
				 	title:'手机号不合法',
				 	icon:'none'
				 })
				 return
			 }
			 if(!this.password){
				 uni.showToast({
				 	title:'密码不能为空',
				 	icon:'none'
				 })
				 return
			 }
				let loginRes=await this.$request({
				    url: this.$api.sale.sale_login,
				    data: {
				        account:this.account,
						password:this.password
				    },
				    method:'post'
				})
				console.log(loginRes)
				if(loginRes.code===0){
					console.log('111')
					await this.refresh()
					console.log('userRes')
					console.log('222')
					uni.reLaunch({
						url:'/pages/sale/sale-user-center'
					})
				}else{
					uni.showToast({
						title:loginRes.msg,
						icon:'none'
					})
				}
				
			},
			forgetPwd(){
				uni.showModal({
				    title: '提示',
				    content: '请联系客服人员',
					confirmText:'去联系',
				    success: function (res) {
				        if (res.confirm) {
				            uni.makePhoneCall({
				                phoneNumber: '114' 
				            });
				        } 
				    }
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.autoCenter {
		padding: 160rpx 0 87rpx;
		.title {
			font-size: 40rpx;
			font-family: PingFang SC;
			font-weight: bold;
			color: #434343;
			line-height: 40rpx;
			margin-left: 57rpx;
		}
	}
	.login_form{
		padding: 0 58rpx;
		.item{
			margin-top: 71rpx;
			/deep/.plh_class{
				font-size: 32rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #999999;
			}
			.title{
				font-size: 32rpx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #262626;
				line-height: 40rpx;
				margin-bottom: 40rpx;
			}
			.b_line{
				width: 630rpx;
				height: 1rpx;
				background: #EAEAEA;
				margin-top: 34rpx;
			}
		}
		.forget{
			font-size: 24rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #999999;
			line-height: 40rpx;
			text-align: right;
			margin-top: 33rpx;
		}
		.submit{
			// width: 624px;
			height: 100rpx;
			background: #A18353;
			border-radius: 50rpx;
			font-size: 36rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
			line-height: 100rpx;
			margin-top: 83rpx;
		}
	}
	
</style>
