feat(login): 优化登录逻辑及环境配置展示

- 修改环境变量配置，新增 VUE_APP_ENV_NAME 用于区分环境名称显示
- 调整登录接口请求，pdaLogin与pdaLogout改为相对路径调用
- 登录页面新增环境名称显示，区分不同环境使用状态
- 登录流程支持开发环境动态选择服务器地址，支持自定义地址输入及存储
- 增加请求和响应拦截器日志输出，方便调试接口请求问题
- 优化登录表单输入清除按钮显示与密码显示切换交互体验
- 修复和改善登录相关本地存储，自动保存账号密码和服务器地址
- 调整manifest包配置，禁用app-plus子包
- 格式化和规范登录页面样式调整，提升页面结构与样式一致性

.env

@@ -1,4 +1,5 @@
 NODE_ENV = development
+VUE_APP_ENV_NAME = 默认环境
 VUE_APP_UPGRADE_NAME = erp_pda
 VUE_APP_PRODUCTION_API_URL = https://www.haotopai.com/hcscm/mes/server/pda/v1
 VUE_APP_DEV_API_URL = https://www.haotopai.com/hcscm/mes/server/pda/v1

.env.mes

@@ -1,4 +1,5 @@
 NODE_ENV = development
+VUE_APP_ENV_NAME = mes环境
 VUE_APP_UPGRADE_NAME = erp_pda
 VUE_APP_PRODUCTION_API_URL = https://www.haotopai.com/hcscm/mes/server/pda/v1
 VUE_APP_DEV_API_URL = https://www.haotopai.com/hcscm/mes/server/pda/v1

.env.zhisheng

@@ -1,4 +1,5 @@
 NODE_ENV = development
+VUE_APP_ENV_NAME = zhisheng环境
 VUE_APP_UPGRADE_NAME = erp_pda_pre
 VUE_APP_PRODUCTION_API_URL = https://hcscmpre.zzfzyc.com/hcscm/pda/v1
 VUE_APP_DEV_API_URL = https://hcscmpre.zzfzyc.com/hcscm/pda/v1

README.md

@@ -1,3 +1,5 @@
+# 不使用 pda项目，以后的新需求或者修改 使用 本项目
+
 # pda-cli
 
 ## Project setup

src/common/http.api.js

@@ -16,8 +16,8 @@ const install = (Vue, vm) => {
 		getUserInfo: (params = {}) => vm.$u.get(config.productionApiUrl+'/mobile/user/getUserInfo', params),
 		login: (params = {}) => vm.$u.post(config.productionApiUrl+'/mobile/login/loginByPassword', params),
 		// PDA登录接口
-		pdaLogin: (params = {}) => vm.$u.postJson(config.productionApiUrl+'/login', params),
-		pdaLogout: (params = {}) => vm.$u.postJson(config.productionApiUrl+'/logout', params),
+		pdaLogin: (params = {}) => vm.$u.postJson('/login', params),
+		pdaLogout: (params = {}) => vm.$u.postJson('/logout', params),
 		// 获取配布单列表
 		getFpmArrangeOrderList: (params = {}) => vm.$u.get('/product/fpmArrangeOrder/getFpmArrangeOrderList', params),
 		// 获取成品配布单详情

src/common/http.interceptor.js

@@ -22,6 +22,9 @@ const install = (Vue, vm) => {
 	
 	// 请求拦截，配置Token等参数
 	Vue.prototype.$u.http.interceptor.request = (req) => {
+		console.log('request', req);
+		console.log('baseUrl', vm.$store.state.apiurl);
+		console.log('完整URL', vm.$store.state.apiurl + req.url);
 		if (!req.header){
 			req.header = [];
 		}
@@ -42,13 +45,15 @@ const install = (Vue, vm) => {
 			req.header[rememberMeHeader] = vm.vuex_remember;
 			req.remember = false;
 		}
-		console.log('request', req);	
 		return req;
 	}
 	
 	// 响应拦截，判断状态码是否通过
 	Vue.prototype.$u.http.interceptor.response = async (res, req) => {
 	    console.log('response', res);
+	    console.log('response statusCode', res?.statusCode);
+	    console.log('response data', res?.data);
+	    console.log('response errMsg', res?.errMsg);
 		
 		// 处理401未授权状态码
 		if (res.statusCode === 401) {
@@ -63,6 +68,7 @@ const install = (Vue, vm) => {
 			});
 			return false;
 		}
+		console.log('res',res)
 		if (!(res.data)){
 			vm.$u.toast('未连接到服务器')
 			return Promise.reject(new Error('未连接到服务器'));
@@ -125,7 +131,7 @@ const install = (Vue, vm) => {
 	
 	// 封装 post json 请求
 	vm.$u.postJson = (url, data = {}, header = {}) => {
-		console.log('header', header, url, vm.$u)
+		console.log('header', header, url, vm.$store.state.apiurl)
 		header['content-type'] = 'application/json';
 		return vm.$u.http.request({
 			url,

src/manifest.json

@@ -7,7 +7,7 @@
     "transformPx" : false,
     "app-plus" : {
         "optimization" : {
-            "subPackages" : true
+            "subPackages" : false
         },
         "safearea" : {
             "bottom" : {

src/pages/sys/login/index.vue

@@ -4,7 +4,7 @@
 		<view class="haotoplogo">
 			<image src="/static/haotop/image/logo/Start.jpg" mode="aspectFit" class="logoimg"></image>
 		</view>
-<!--		<div v-if="loginType === 'currentPhone'">-->
+		<!--		<div v-if="loginType === 'currentPhone'">-->
 		<!-- <u-tabs :list="list" :is-scroll="false" :current="current" @change="onClickItem"></u-tabs> -->
 		<!-- <view v-if="current === 0"> -->
 		<view class="list">
@@ -20,28 +20,22 @@
 				</view>
 				<view class="list-call" v-if="selectedApiUrl === 'custom'">
 					<!-- 当选择自定义时显示输入框 -->
-							<input
-								class="u-input"
-								type="text"
-								v-model="customApiUrl"
-								maxlength="100"
-								placeholder="请输入服务器地址"
-								@blur="handleBlurInputUrl"
-							/>
+					<input class="u-input" type="text" v-model="customApiUrl" maxlength="100" placeholder="请输入服务器地址"
+						@blur="handleBlurInputUrl" />
 				</view>
 			</template>
 			<view class="list-call">
 				<view class="iconfont icon-avatar" style="font-size: 22px;color:#5473e8;"></view>
 				<input class="u-input" type="text" v-model="login.username" maxlength="32"
-							:placeholder="$t('login.placeholderAccount')" value="admin" @input="clearInput"/>
-						<u-icon :size="50" v-if="showClearIcon" name="close-circle-fill" color="#c0c4cc" class="u-clear-icon" @click="clearIcon"/>
+					:placeholder="$t('login.placeholderAccount')" value="admin" @input="clearInput" />
+				<u-icon :size="50" v-if="showClearIcon" name="close-circle-fill" color="#c0c4cc" class="u-clear-icon"
+					@click="clearIcon" />
 			</view>
 			<view class="list-call">
 				<view class="iconfont icon-key" style="font-size: 22px;color:#5473e8;"></view>
 				<input class="u-input" type="text" v-model="login.password" maxlength="32"
 					:placeholder="$t('login.placeholderPassword')" :password="!showPassword" value="admin123" />
-						<image class="u-icon-right"
-							:src="'/static/aidex/login/eye_' + (showPassword ? 'open' : 'close') + '.png'"
+				<image class="u-icon-right" :src="'/static/aidex/login/eye_' + (showPassword ? 'open' : 'close') + '.png'"
 					@click="showPass()"></image>
 			</view>
 			<div style="padding:15rpx 0 0;">
@@ -50,10 +44,11 @@
 							</navigator>
 							<navigator class="register-link" url="reg" open-type="navigate">{{$t('login.reg')}}</navigator>
 						</view> -->
-						<u-checkbox v-model="remember" active-color="#5473e8">{{$t('login.autoLogin')}}</u-checkbox>
+				<u-checkbox v-model="remember" active-color="#5473e8">{{ $t('login.autoLogin') }}</u-checkbox>
 			</div>
 		</view>
-				<button class="button" :disabled="login.loading" @click="submit('1')" :loading="login.loading"><text>登录</text></button>
+		<button class="button" :disabled="login.loading" @click="submit('1')"
+			:loading="login.loading"><text>登录</text></button>
 		<!-- <view class="login-bottom-box">
 					<u-divider> 更多登录方式 </u-divider>
 					<view class="oauth2">
@@ -95,46 +90,41 @@
 				</view>
 
 			</view> -->
-<!--		</div>-->
+		<!--		</div>-->
 
-<!--		<div v-if="loginType !== 'currentPhone'">-->
-<!--			<view class="currentPhone-box">-->
-<!--				<view class="number-text">183****1005</view>-->
-<!--				<view class="other-text">认证服务由中国移动提供。</view>-->
-<!--				<u-button type="primary" @click="submit('3')">本机号码一键登录</u-button>-->
-<!--				<u-button @click="qiehuanLogin()">其他登录方式</u-button>-->
-<!--			</view>-->
-<!--			<view class="login-bottom-box">-->
-<!--				<view class="copyright">-->
-<!--					登录即代表您已阅读并同意<u-link href="#">用户协议</u-link> 与 <u-link href="#">隐私政策</u-link>-->
-<!--				</view>-->
-<!--			</view>-->
-<!--		</div>-->
-		<u-picker
-			v-model="showApiUrlPicker"
-			mode="selector"
-			:range="apiUrlList"
-			range-key="label"
-			@confirm="onApiUrlConfirm"
-			@cancel="showApiUrlPicker = false"
-		></u-picker>
+		<!--		<div v-if="loginType !== 'currentPhone'">-->
+		<!--			<view class="currentPhone-box">-->
+		<!--				<view class="number-text">183****1005</view>-->
+		<!--				<view class="other-text">认证服务由中国移动提供。</view>-->
+		<!--				<u-button type="primary" @click="submit('3')">本机号码一键登录</u-button>-->
+		<!--				<u-button @click="qiehuanLogin()">其他登录方式</u-button>-->
+		<!--			</view>-->
+		<!--			<view class="login-bottom-box">-->
+		<!--				<view class="copyright">-->
+		<!--					登录即代表您已阅读并同意<u-link href="#">用户协议</u-link> 与 <u-link href="#">隐私政策</u-link>-->
+		<!--				</view>-->
+		<!--			</view>-->
+		<!--		</div>-->
+		<u-picker v-model="showApiUrlPicker" mode="selector" :range="apiUrlList" range-key="label"
+			@confirm="onApiUrlConfirm" @cancel="showApiUrlPicker = false"></u-picker>
 		<!-- 版本信息显示 -->
 		<view class="version-info">
 			<text class="version-text">版本: {{ appVersion }}</text>
+			<text class="env-text" v-if="envName">（{{ envName }}）</text>
 		</view>
 	</view>
 </template>
 <script>
-	/**
+/**
  * Copyright (c) 2013-Now http://aidex.vip All rights reserved.
  */
-	import config from '@/common/config.js';
-	import base64 from '@/common/base64.js';
-	import util from '@/common/util.js';
-	import md5 from '@/common/md5.js';
-	import manifest from '@/manifest.json';
-	import { mapState } from 'vuex'
-	export default {
+import config from '@/common/config.js';
+import base64 from '@/common/base64.js';
+import util from '@/common/util.js';
+import md5 from '@/common/md5.js';
+import manifest from '@/manifest.json';
+import { mapState } from 'vuex'
+export default {
 	data() {
 		return {
 			isDevelopment: config.isDevelopment,
@@ -170,6 +160,9 @@
 	computed: {
 		appVersion() {
 			return manifest.versionName;
+		},
+		envName() {
+			return process.env.VUE_APP_ENV_NAME || '';
 		}
 	},
 
@@ -205,14 +198,14 @@
 		*/
 	},
 	methods: {
-			clearInput: function(event) {
+		clearInput: function (event) {
 			if (event.detail.value.length > 0) {
 				this.showClearIcon = true;
 			} else {
 				this.showClearIcon = false;
 			}
 		},
-			clearIcon: function() {
+		clearIcon: function () {
 			this.login.username = ''
 			this.showClearIcon = false;
 		},
@@ -228,9 +221,9 @@
 		},
 
 		onApiUrlConfirm(e) {
-				console.log('e',JSON.stringify(e));
+			console.log('e', JSON.stringify(e));
 			const selectedValue = this.apiUrlList[e[0]].value;
-        console.log('selectedValue',selectedValue)
+			console.log('selectedValue', selectedValue)
 			this.selectedApiUrl = selectedValue;
 			this.showApiUrlPicker = false;
 
@@ -345,7 +338,7 @@
 				'phone': this.login.username,
 				'password': this.login.password,
 			}).then((res) => {
-					console.log('login res',res)
+				console.log('login res', res)
 				var aLoginUserData = res;
 
 				//console.log('--aLoginUserData->>' + JSON.stringify(aLoginUserData));
@@ -361,7 +354,7 @@
 				uni.setStorageSync('RemoteTokenData', aLoginUserData);
 
 				uni.setStorage({
-						key:'userToken',
+					key: 'userToken',
 					data: {
 						Token: aLoginUserData.token,
 					}
@@ -400,7 +393,7 @@
 					title: '登录成功!'
 				});
 				this.$store.dispatch('initNotification');
-					setTimeout(function() {
+				setTimeout(function () {
 					uni.hideLoading();
 				}, 1000);
 			}).catch((error) => {
@@ -409,7 +402,7 @@
 					icon: 'none',
 					title: '' + (error.msg || error.message || '')
 				});
-					setTimeout(function() {
+				setTimeout(function () {
 					uni.hideLoading();
 				}, 5000);
 				// 恢复原始baseUrl
@@ -440,49 +433,54 @@
 			}
 		},
 	}
-	};
+};
 </script>
 <style lang="scss">
-	@import 'index.scss';
-	.server-selector {
+@import 'index.scss';
+
+.server-selector {
 	display: flex;
 	justify-content: space-between;
 	align-items: center;
 	padding: 10rpx 0;
 	border-bottom: 1px solid #eee;
-    }
+}
+
 .list-call {
 	.u-select {
 		margin-bottom: 10rpx;
 	}
+
 	.u-input {
 		margin-top: 10rpx;
 	}
 }
-	.haotoplogo {
+
+.haotoplogo {
 	width: 300rpx;
 	height: 150rpx;
 	// max-width: 5%;
 	// max-height: 5%;
 	margin: 10rpx auto 10rpx auto;
-	}
-	.logoimg{
+}
+
+.logoimg {
 	width: 100%;
 	height: 100%;
-	}
+}
 
-	.logo {
+.logo {
 	width: 80%;
 	font-size: 64rpx;
 	color: #5473e8;
 	margin: 80rpx auto 80rpx auto;
-	}
+}
 
-	.list-call-icon {
+.list-call-icon {
 	color: #ff0000;
-	}
+}
 
-	.currentPhone-box {
+.currentPhone-box {
 	text-align: center;
 	padding: 40rpx 80rpx;
 
@@ -504,9 +502,9 @@
 	.u-hairline-border {
 		border: 1px solid #fff;
 	}
-	}
+}
 
-	.register {
+.register {
 	display: inline-block;
 	color: #5473e8;
 	height: 40rpx;
@@ -514,19 +512,19 @@
 	font-size: 28rpx;
 	float: right;
 	margin-top: 6rpx;
-	}
+}
 
-	.register-link {
+.register-link {
 	float: right;
 	padding: 0 16rpx;
-	}
+}
 
-	.reg-link {
+.reg-link {
 	display: inline-block;
 	color: #5473e8;
-	}
+}
 
-	.oauth2 {
+.oauth2 {
 	display: flex;
 	flex-direction: row;
 	justify-content: space-around;
@@ -536,7 +534,8 @@
 		height: 80rpx;
 		width: 80rpx;
 	}
-	}
+}
+
 .u-tabs {
 	padding: 0 70rpx;
 }
@@ -544,11 +543,20 @@
 .version-info {
 	text-align: center;
 	margin-top: 30rpx;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	flex-wrap: wrap;
 }
 
 .version-text {
 	font-size: 24rpx;
 	color: #999999;
 }
-</style>
 
+.env-text {
+	font-size: 24rpx;
+	color: #5473e8;
+	margin-left: 10rpx;
+}
+</style>

vue.config.js

@@ -9,12 +9,14 @@ module.exports = {
       console.log('VUE_APP_UPGRADE_NAME',JSON.stringify(process.env.VUE_APP_UPGRADE_NAME))
       console.log('VUE_APP_PRODUCTION_API_URL',JSON.stringify(process.env.VUE_APP_PRODUCTION_API_URL))
       console.log('VUE_APP_DEV_API_URL',JSON.stringify(process.env.VUE_APP_DEV_API_URL))
+      console.log('VUE_APP_ENV_NAME',JSON.stringify(process.env.VUE_APP_ENV_NAME))
       Object.assign(definitions[0], {
         'process.env': {
           ...definitions[0]['process.env'],
           VUE_APP_UPGRADE_NAME: JSON.stringify(process.env.VUE_APP_UPGRADE_NAME),
           VUE_APP_PRODUCTION_API_URL: JSON.stringify(process.env.VUE_APP_PRODUCTION_API_URL),
           VUE_APP_DEV_API_URL: JSON.stringify(process.env.VUE_APP_DEV_API_URL),
+          VUE_APP_ENV_NAME: JSON.stringify(process.env.VUE_APP_ENV_NAME),
         }
       })
       return definitions