接口调试、全局请求参数、数据状态缓存 处理

App.vue

@@ -6,12 +6,18 @@
 		version
 	} from './package.json'
 	import checkUpdate from '@/uni_modules/uni-upgrade-center-app/utils/check-update';
+	import { getSessionXToken } from "@/session"
+	import { USERKEY } from "@/store/actionKey"
 	
 	export default {
 		globalData: {
 			
 		},
 		onLaunch: function() {
+			const xToken = getSessionXToken()
+			// 登录认证
+			this.$store.dispatch(USERKEY.GETUSERINFO)
+			
 			// #ifdef H5
 			console.log(
 				`%c hello uniapp %c v${version} `,

common/api/index.js

@@ -0,0 +1,7 @@
+import apiUrls, { host } from "./url"
+export * from "./user"
+
+export {
+	apiUrls,
+	host
+}

common/api/url.js

@@ -5,3 +5,4 @@ export default {
   loginByApp: `/loginByApp`,
   getInfoByApp: `/getInfoByApp`
 }
+

common/api/user.js

@@ -0,0 +1,10 @@
+import { corePost } from '@/common/request'
+import url from "./url"
+
+export const loginByApp = (data = {})=> {
+	return corePost(url.loginByApp, data)
+}
+
+export const getInfoByApp = (data = {})=> {
+	return corePost(url.getInfoByApp, data, {}, 'GET')
+}

common/request.js

@@ -7,9 +7,10 @@ import {
 import {
 	host
 } from "./api"
-const corePostBase = (url, reqParams, options = {}) => {
+import { getSessionXToken } from "@/session"
+const corePostBase = (url, reqParams, options = {}, methodType = "POST") => {
+	const xToken = getSessionXToken()
 	
-	const xToken = ""
 	return new Promise((resolve, reject) => {
 		uni.request({
 			url: `${host}${url}`,
@@ -18,7 +19,7 @@ const corePostBase = (url, reqParams, options = {}) => {
 				"X-Token": xToken,
 				...options
 			},
-			method: 'POST',
+			method: methodType,
 			success: (res) => {
 				resolve(res)
 			},
@@ -31,14 +32,14 @@ const corePostBase = (url, reqParams, options = {}) => {
 
 const BaseParam = {}
 // 请求处理
-let corePost = function(url, params = {}, options = {}) {
+let corePost = function(url, params = {}, options = {}, methodType) {
 	// 统一把emo转unicode 
 	// emoUnicode(params)
 	const reqParams = {
 		...BaseParam,
 		...params,
 	}
-	return dealRequest(corePostBase(url, reqParams, options)).then(res => {
+	return dealRequest(corePostBase(url, reqParams, options, methodType)).then(res => {
 		// 解析unicode
 		// emoUnicode(res, 2)
 		return res

common/untool.js

@@ -62,6 +62,10 @@ const showLoading = ()=> {
 	});
 }
 
+const hideLoading = ()=> {
+	uni.hideLoading();
+}
+
 const scanCode = ()=> {
 	return new Promise((resolve, reject)=> {
 		uni.scanCode({
@@ -106,6 +110,7 @@ export {
 	setClipboardData,
 	confirmModal,
 	showLoading,
+	hideLoading,
 	showToast,
 	scanCode,
 	makePhoneCall,

common/upload.js

@@ -1,5 +1,5 @@
 import { handleResponse } from './manageServer.js'
-import apiConfig from './api.js'  //接口配置
+import { apiUrls } from './api'  //接口配置
 import { showToast } from "./untool"
 
 
@@ -33,7 +33,7 @@ const chooseFile = function (action = 'chooseImage', opt = {}) {
 const doRequest =  function (file) {
   return new Promise((resolve, reject) => {
     uni.uploadFile({
-      url: `${apiConfig.uploadFile}`,
+      url: `${apiUrls.uploadFile}`,
 	  fileType: 'image', // TODO
       filePath: file,
       name: 'file',

pages/login/login.vue

@@ -42,7 +42,9 @@
 <script>
 	import getCdnUrl from "@/common/getCdnUrl"
 	import { corePost } from "@/common/request"
-	import apiUrl from "@/common/api"
+	import { USERKEY } from "@/store/actionKey"
+	import { goto, showLoading, hideLoading } from "@/common/untool"
+	
 	export default {
 		props: {
 		},
@@ -66,10 +68,14 @@
 				const { remberPassport, submitParams } = this
 				if(remberPassport[0]) {
 				}
-				const res1 = await corePost(apiUrl.loginByApp, submitParams)
+				showLoading()
-				if(res1.token) {
+				try{
-					const res2 = await corePost(apiUrl.getInfoByApp, {})
+					await this.$store.dispatch(USERKEY.LOGIN, submitParams)
+					await this.$store.dispatch(USERKEY.GETUSERINFO)
+					goto("tabBar/home/home")
+				}catch(e){
 				}
+				hideLoading()
 			}
 		}
 	}

pages/tabBar/home/home.vue

@@ -9,14 +9,14 @@
 			
 			<view class="com-jianju" style="margin-top: 10rpx;">
 				<u-row align="center" >
-					<u-col @click="goto(`login/login`)" span="11">
+					<u-col @click="goto(`tabBar/mine/mine`)" span="11">
 						<u-row>
 							<u-avatar size="66"></u-avatar>
-							<u-text margin="0 0 0 16rpx" text="快递专员01" color="#fff" size="24"></u-text>
+							<u-text margin="0 0 0 16rpx" :text="userInfo.nickName" color="#fff" size="24"></u-text>
 						</u-row>
 					</u-col>
 					<u-col span="1" align="end">
-						<image style="height: 36rpx;width: 44rpx;" :src="getCdnUrl(`home/saoma.png`)"/>
+						<image style="height: 36rpx;width: 44rpx;" :src="userInfo.avatar"/>
 					</u-col>
 				</u-row>
 			</view>
@@ -94,6 +94,11 @@
 	import getCdnUrl from "@/common/getCdnUrl"
 	import { goto } from "@/common/untool"
 	export default {
+		computed: {
+		    userInfo() {
+		      return this.$store.getters.userInfo
+		    }
+		},
 		props: {
 			// hasLeftWin: {
 			// 	type: Boolean
@@ -132,6 +137,9 @@
 				// title: '',
 				// path: 'TODO'
 			}
+		},
+		onLoad() {
+			
 		},
 		methods: {
 			getCdnUrl,

pages/tabBar/mine/mine.vue

@@ -12,15 +12,15 @@
 				<u-row align="center" justify="between">
 					<view>
 						<u-row>
-							<u-avatar size="120"></u-avatar>
+							<u-avatar size="120" :src="userInfo.avatar"></u-avatar>
 							<view class="pl-30">
 								<u-row>
-									<u-text text="张三" color="#fff" size="32" bold="true"></u-text>
+									<u-text :text="userInfo.nickName" color="#fff" size="32" bold="true"></u-text>
 									<view class="ml-20 clr-wht font-24 pos-rlt" style="padding: 8rpx 12rpx;">南京网点
 										<view class="pos-abt-all" style="z-index: 0;background: #FFFFFF;opacity: 0.2;border-radius: 20rpx;"></view>
 									</view>
 								</u-row>
-								<view class="mt-20 clr-wht font-24">13712345678</view>
+								<view class="mt-20 clr-wht font-24">{{userInfo.phonenumber}}</view>
 							</view>
 						</u-row>
 					</view>
@@ -107,7 +107,7 @@
 				</view>
 				
 				<view class="pt-40 pb-40">
-					<u-button @click="goto(`login/login`)" type="primary" size="large" shape="circle"
+					<u-button @click="handleUnlogin" type="primary" size="large" shape="circle"
 						custom-style="height:86rpx;font-size: 32rpx;border-radius: 20rpx;"
 					>退出登录</u-button>
 				</view>
@@ -119,7 +119,13 @@
 <script>
 	import getCdnUrl from "@/common/getCdnUrl"
 	import { goto } from "@/common/untool"
+	import { USERKEY } from "@/store/actionKey"
 	export default {
+		computed: {
+		    userInfo() {
+		      return this.$store.getters.userInfo
+		    }
+		},
 		props: {
 			// hasLeftWin: {
 			// 	type: Boolean
@@ -146,6 +152,10 @@
 		methods: {
 			getCdnUrl,
 			goto,
+			async handleUnlogin() {
+				await this.$store.dispatch(USERKEY.LOGOUT)
+				goto(`login/login`)
+			}
 		}
 	}
 </script>

session/index.js

@@ -5,13 +5,13 @@ export const setSessionXToken = (val = '')=> {
 }
 
 export const getSessionXToken = ()=> {
-	uni.getStorageSync(XTOKEN_KEY)
+	return uni.getStorageSync(XTOKEN_KEY) || ''
 }
 
 export const setSessionUserInfo = (val = {})=> {
 	uni.setStorageSync(USERINFO_KEY, val)
 }
 
-export const getSessionXToken = ()=> {
+export const getSessionUserInfo = ()=> {
-	uni.getStorageSync(USERINFO_KEY,)
+	return uni.getStorageSync(USERINFO_KEY) || {}
 }

store/actionKey.js

@@ -0,0 +1,5 @@
+export const USERKEY = {
+	LOGIN: "LOGIN",
+	GETUSERINFO: "GETUSERINFO",
+	LOGOUT: "LOGOUT",
+}

store/index.js

@@ -74,8 +74,8 @@ const store = createStore({
 		}
 	},
 	getters: {
-		currentColor(state) {
+		userInfo: (state)=> {
-			return state.colorList[state.colorIndex]
+			return state.user?.info || {}
 		}
 	},
 	actions: {

store/modules/user.js

@@ -0,0 +1,83 @@
+import { USERKEY } from "../actionKey"
+import {
+	setSessionXToken,
+	getSessionXToken,
+	setSessionUserInfo,
+	getSessionUserInfo
+} from "@/session"
+import { loginByApp, getInfoByApp } from "@/common/api"
+import { goto } from "@/common/untool"
+
+export default {
+	state: {
+		info: getSessionUserInfo(),
+		token: getSessionXToken(),
+	},
+	mutations: {
+		[USERKEY.LOGIN](state, provider) {
+			const {
+				token,
+				info
+			} = provider
+			state.token = provider
+		},
+		[USERKEY.GETUSERINFO](state, provider) {
+			state.info = provider
+		},
+		[USERKEY.LOGOUT](state) {
+			state.token = '';
+			state.info = {}
+		},
+	},
+	getters: {
+		// packInfo(state) {
+		// 	return state.user
+		// }
+	},
+	actions: {
+		async [USERKEY.LOGIN]({
+			dispatch,
+			commit,
+			state,
+			rootState
+		}, options) {
+			let token = state.token
+			const resLgn = await loginByApp(options)
+			token = resLgn.token
+			setSessionXToken(token)
+			
+			commit(USERKEY.LOGIN, token)
+		},
+		async [USERKEY.LOGOUT]({
+			dispatch,
+			commit,
+			state,
+			rootState
+		}, options) {
+			setSessionUserInfo({})
+			setSessionXToken('')
+			
+			commit(USERKEY.LOGOUT)
+		},
+		async [USERKEY.GETUSERINFO]({
+			dispatch,
+			commit,
+			state,
+			rootState
+		}, options) {
+			if(!state.token) {
+				goto("login/login", 1)
+				throw new Error('缺少token')
+			}
+			
+			const resInfo = await getInfoByApp()
+			const info = {
+				...resInfo.user,
+				roles: resInfo.user,
+				permissions: resInfo.permissions
+			}
+			commit(USERKEY.GETUSERINFO, info)
+		},
+		
+	}
+}