登录接口联调

main.js

@@ -1,5 +1,6 @@
 import App from './App'
 import store from './store'
+import { request, request1 } from "./util/request.js";
 
 // #ifndef VUE3
 import Vue from 'vue'
@@ -19,6 +20,10 @@ const app = new Vue({
 app.$mount()
 // #endif
 
+//挂在request
+Vue.prototype.$request = request;
+Vue.prototype.$request1 = request1;
+
 // #ifdef VUE3
 import {
 	createSSRApp

pages.json

@@ -12,6 +12,23 @@
 		}
 	},
 	"pages": [
+		{
+			"path": "pages/login/login",
+			"style": {
+				"navigationBarTitleText": "登录",
+				"app-plus": {
+					"bounce": "vertical",
+					"titleNView": {
+						"buttons": [{
+							"text": "\ue534",
+							"fontSrc": "/static/uni.ttf",
+							"fontSize": "22px",
+							"color": "#FFFFFF"
+						}]
+					}
+				}
+			}
+		},
 		// pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
 		{
 			"path": "pages/tabBar/component/component",

pages/login/login.vue

@@ -0,0 +1,89 @@
+<template>
+	<view class="login_form_warp">
+		<view class="login_form_item">
+			<input class="login_form_input" v-model="form.username" placeholder="请输入账号" maxlength="20" />
+		</view>
+		<view class="login_form_item">
+			<input class="login_form_input" v-model="form.password" type="password" placeholder="请输入密码" maxlength="20" />
+		</view>
+		<view class="login_form_item">
+			<input class="login_form_input" v-model="form.verCode" placeholder="请输入图形验证码" maxlength="20" />
+			<image :src="codeImg" @click="getVerCode" style="width: 100upx; height: 40upx;"></image>
+		</view>
+		<button type="primary" class="page-body-button" @click="doLogin">登录</button>
+	</view>
+</template>
+<script>
+	export default {
+		data() {
+			return {
+				form: {
+					username: '',
+					password: '',
+					verCode: '',
+					vercodeType: 5
+				}, //登录form
+				codeImg: '', //图形验证码
+			}
+		},
+		onLoad() {
+			this.getVerCode();
+		},
+		methods: {
+			//获取图形验证码
+			getVerCode() {
+				this.$request1(getApp().globalData.baseUrl + '/api/common/captchaBase64?type=5&_t=' + new Date(), {}, 'GET').then(res => {
+					if(res.code == 200) {
+						this.codeImg = res.data.img;
+					}
+				}).catch(() => {
+					console.log('vercode err')
+				})
+			},
+			//登录
+			doLogin() {
+				if(this.form.username == '' || this.form.password == '') {
+					uni.showToast({
+						title: '用户名密码不能为空',
+						icon: 'none'
+					})
+					return;
+				} else if(this.form.verCode == '') {
+					uni.showToast({
+						title: '验证码不能为空',
+						icon: 'none'
+					})
+					return;
+				}
+				uni.showLoading({
+					title: '登录中...',
+					mask: true
+				})
+				this.$request1(getApp().globalData.baseUrl + '/api/login/auth', this.form, 'POST').then(res => {
+					uni.hideLoading();
+					if(res.code == 200) {
+						uni.setStorageSync('satoken', res.data.satoken);
+					}
+				}).catch(() => {
+					uni.hideLoading();
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.login_form_warp{
+		.login_form_item {
+			display: flex;
+			align-items: center;
+			.login_form_input {
+				padding: 8upx 10upx;
+			}
+		}
+	}
+	button {
+		background-color: #007aff;
+		color: #ffffff;
+	}
+</style>

util/request.js

@@ -18,10 +18,10 @@ const request = (url, data, method = 'GET') => {
 				if (res.statusCode == 200) {
 					if (res.data.code === "200" || res.data.code === "" || res.data.status == "200") {
 						resolve(res.data)
-					} else if (res.data.code === "20004" || res.data.code === "20005") {
-						uni.removeStorageSync("storage_key")
+					} else if (res.data.code === "401") {
+						uni.removeStorageSync("satoken")
 						uni.navigateTo({
-							url: '/pages_category_page2/userModule/login'
+							url: '/pages/login/login'
 						})
 					} else {
 						resolve(res.data)