dccloud/uni-app-front/pages/LoginSupplier/LoginSupplier.vue

<template>
	<view class="login-container">
		<view class="uni-padding-wrap uni-common-mt">
			<form @submit="formSubmit" >
				<view class="uni-form-item uni-column" style="background-color: #fff;">
					<image style="width:61px;height: 61px;margin: 5px auto;" :src="src" ></image>
				</view>
				 
				<org-input-text left-text="账号"  placeholder="请输入账号"  :check-info="{msg:'账号至少2位',reg:'^.{1,}$',required:true}" v-model="username"  >
					<!-- 使用插槽，自定义左侧文本 -->
					<view slot="left" >
						<uni-icons type="person" size="30" color="#6666" style="padding-left: 10rpx;"></uni-icons>
					</view>
				</org-input-text>
				<org-input-text left-text="密码" :is-password="true" placeholder="请输入密码"   :check-info="{msg:'账号至少4位',reg:'^.{1,}$',required:true}"  v-model="password"  >
					<!-- 使用插槽，自定义左侧文本 -->
					<view slot="left" style="padding-left: 10rpx;">
						<uni-icons type="eye" size="30" color="#6666"></uni-icons>
					</view>
				</org-input-text>					
				<view class="uni-btn-v uni-column">
					<button type="primary" form-type="submit" style="border-radius: 15px;" >登录</button>
				</view>
			</form>
		</view>
	</view>
</template>

<script>
	import {
		loginsupplier,
		getInfo,
		logout
	} from "@/common/api/loginApi.js";
	var graceChecker = require("../../common/graceChecker.js");
	import {
		setToken,getToken
	} from "@/common/auth.js"
    //import store from '@/store/index.js'
	var duration = 2000;
	export default {
		data() {
			return {
				username:'',
				password:'',
				//isSupplier:'',
				src: '/static/haode.png'
			}
		},
		created: function() {
			
			var abc=1;
			if(typeof abc=='string'){
				console.info(typeof abc);
				console.info(abc);
			}
			else{
				console.info(typeof abc,abc);
			}
		},
		methods: {		
			onInput1:function(){
				console.info("oninput1");
				console.info(this.username);
				
				
				//console.log(this.username);
			},
			onInput2:function(){
				console.info("oninput2");
				console.info(this.password);				
				//console.log(this.password);
			},
			formSubmit: function(e) {
				//console.log('form发生了submit事件，携带数据为：' + JSON.stringify(e.detail.value))
				//定义表单规则
				var rule = [{
						name: "username",
						checkType: "string",
						checkRule: "2,22",
						errorMsg: "账号应为2-22个字符"
					},
					{
						name: "password",
						checkType: "string",
						checkRule: "4,",
						errorMsg: "密码必须大于4位"
					}
				];
				//console.info(this.username);
				//console.info(this.password);
				//console.info("isSupplier",this.isSupplier);
				//return;
				let formData={username:this.username,password:this.password};
				//进行表单检查
				//var formData = e.detail.value;
				var checkRes = graceChecker.check(formData, rule);
				//console.info(formData);
                //return;
				if (checkRes) {
					//uni.showToast({title:"验证通过!", icon:"none"});
					this.loading = true;

					//this.$store.dispatch('user/login', this.formData)
					loginsupplier(formData)
						.then((res) => {
							console.info(res);
							if (!res.isSuccess) //失败，显示错误
							{
								uni.showToast({
									title: res.errMsg,
									icon: 'none'
								});
								return;
							}
							//return;
							//设置状态中的各种值
							this.$store.commit('setIsLogin',true);
							this.$store.commit('setToken',res.tnToken);
							this.$store.commit('setAvatar','');
							this.$store.commit('setName',res.data.supplier.supplierName);
							this.$store.commit('setIntroduction','');
							this.$store.commit('setRoles','');
							this.$store.commit('setUser',res.data.supplier);
							this.$store.commit('setStationName','');
							this.$store.commit('setStationCode','');
							this.$store.commit('setDepartmentName','');
							this.$store.commit('setDepartmentCode','');
														
                            console.info("登录页面state:",this.$store.state);
						
							uni.setStorage({
								key:'storage_state',
								data:this.$store.state,
								success:function(){
									console.info("setStorage状态缓存成功");
									console.info('storage_state',uni.getStorageSync('storage_state'));
								},
								fail: () => {
									console.error("setStorage状态缓存失败");
								}
							});
							this.loading = false;
							
							//导向到首页
							uni.navigateTo({
								url: "/pages/template/SupplierList/SupplierList"
							});
						})
						.catch((error) => {
							console.log(error);
							this.loading = false;
						})


				} else {
					uni.showToast({
						title: graceChecker.error,
						icon: "none"
					});
				}
			}
		}
	}
</script>

<style scoped>
	.login-container {		
		display: flex;
		width: 400px;
		margin: 50px auto;
	}


	

	
</style>