inti

pages/my/login.vue

@@ -0,0 +1,124 @@
+<template>
+	<view class="container">
+		<view style="width: 100%;">
+			<image style="width: 100%; height: 200px; background-color: #eeeeee;"
+				src="@/static/2021111015193250849.jpg"></image>
+		</view>
+		<view class="title">
+			<h1>危化品车辆运单平台</h1>
+		</view>
+		<view class="login">
+			<u--form class="form" labelPosition="left" :model="userInfo" ref="uForm">
+				<u-form-item label="账号:" prop="userInfo.account" borderBottom ref="item1">
+					<u--input v-model="userInfo.account" border="none" maxlength="20"
+						placeholder="请输入账号"></u--input>
+				</u-form-item>
+				<u-form-item label="密码:" prop="userInfo.password" borderBottom>
+					<u--input v-model="userInfo.password" border="none" type="password" maxlength="20"
+						placeholder="请输入密码"></u--input>
+				</u-form-item>
+			</u--form>
+		</view>
+		<view class="register">
+			<u--text type="primary" text="没有账号，前往注册？" @click="register"></u--text>
+		</view>
+		<u-button type="primary" class="btn" text="登录" shape="circle" @click="login"></u-button>
+	</view>
+
+</template>
+<script>
+	import {
+		get,
+		post
+	} from '@/common/request.js'
+	export default {
+		data() {
+			return {
+				userInfo: {
+					account: '',
+					password: '',
+				},
+			};
+		},
+		onLoad() {
+			if (uni.getStorageSync('token')) {
+				this.login()
+			}
+		},
+		methods: {
+			register() {
+				uni.navigateTo({
+					url: '/pages/my/register'
+				})
+			},
+			login() {
+				uni.showLoading({
+					title: '登录中'
+				})
+
+				post('/myapi/api/yq_driver/login', {
+					...this.userInfo
+				}).then(res => {
+
+					setTimeout(() => {
+						uni.setStorageSync('token', res.data.token)
+						uni.hideLoading()
+						uni.showToast({
+							title: '登录成功！',
+							icon: "none"
+						})
+						setTimeout(() => {
+							uni.switchTab({
+								url: '/pages/my/index'
+							})
+						}, 500)
+
+					}, 500)
+
+				})
+			}
+		},
+
+	};
+</script>
+
+<style scoped lang="less">
+	.container {
+
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		height: calc(100vh - 50px);
+
+		.title {
+			position: fixed;
+			top: 110px;
+			color: #fff;
+		}
+
+
+		.login {
+			// border: 1px solid #f4f4f4;
+			// border-radius: 15px;
+			padding: 20px 0;
+			width: 80%;
+
+
+			.form {
+				height: 100px;
+			}
+		}
+
+		.register {
+			width: 80%;
+			padding-bottom: 10px;
+		}
+
+		.btn {
+			width: 80%;
+			font-size: 24px;
+		}
+
+
+	}
+</style>