xk-client-wx/subPackages/setup/developer.vue

<template>
	<view class="container">
		<MessageNotification />
		<view class="header">
			<text class="title">开发者选项</text>
			<text class="subtitle">仅供开发测试使用</text>
		</view>
		
		<view class="card">
			<view class="item">
				<view class="item-left">
					<text class="item-title">测试环境</text>
					<text class="item-desc">{{ devMode ? '已开启' : '已关闭' }}</text>
				</view>
				<switch :checked="devMode" @change="onDevModeChange" color="#1777FF" />
			</view>
		</view>
		
		<view class="card info-card">
			<view class="info-title">当前环境配置</view>
			<view class="info-item" v-if="!devMode">
				<text class="info-label">主API:</text>
				<text class="info-value">app.xiaokang88.com</text>
			</view>
			<view class="info-item" v-if="!devMode">
				<text class="info-label">新API:</text>
				<text class="info-value">api.xiaokang88.com</text>
			</view>
			<view class="info-item" v-if="!devMode">
				<text class="info-label">商城API:</text>
				<text class="info-value">shop.xiaokang88.com</text>
			</view>
			<view class="info-item" v-if="!devMode">
				<text class="info-label">WebSocket:</text>
				<text class="info-value">api.ws.g.xiaokang88.com</text>
			</view>
			
			<view class="info-item" v-if="devMode">
				<text class="info-label">主API:</text>
				<text class="info-value test">test.xk.app.nailaoyun.cn</text>
			</view>
			<view class="info-item" v-if="devMode">
				<text class="info-label">新API:</text>
				<text class="info-value test">test.xk.api.nailaoyun.cn</text>
			</view>
			<view class="info-item" v-if="devMode">
				<text class="info-label">商城API:</text>
				<text class="info-value test">test.xk.shop.nailaoyun.cn</text>
			</view>
			<view class="info-item" v-if="devMode">
				<text class="info-label">WebSocket:</text>
				<text class="info-value test">api.ws.g.nailaoyun.cn</text>
			</view>
		</view>
		
		<view class="tips">
			<text class="tips-text">提示：切换环境后需要重新启动小程序才能生效</text>
		</view>
		
		<view class="btn-restart" @click="restartApp">
			重启小程序
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			devMode: false
		}
	},
	onLoad() {
		// 读取缓存中的开发模式状态
		this.devMode = uni.getStorageSync('dev_mode') || false;
	},
	methods: {
		onDevModeChange(e) {
			this.devMode = e.detail.value;
			// 保存到缓存
			uni.setStorageSync('dev_mode', this.devMode);
			
			uni.showToast({
				title: this.devMode ? '已切换到测试环境' : '已切换到生产环境',
				icon: 'none',
				duration: 2000
			});
		},
		restartApp() {
			uni.showModal({
				title: '提示',
				content: '确定要重启小程序吗？',
				success: (res) => {
					if (res.confirm) {
						// 重启小程序
						uni.reLaunch({
							url: '/pages/home/index'
						});
					}
				}
			});
		}
	}
}
</script>

<style lang="scss" scoped>
.container {
	min-height: 100vh;
	background-color: #F5F6FA;
	padding: 32rpx;
}

.header {
	text-align: center;
	padding: 40rpx 0;
	
	.title {
		display: block;
		font-size: 40rpx;
		font-weight: bold;
		color: #333;
		margin-bottom: 16rpx;
	}
	
	.subtitle {
		display: block;
		font-size: 26rpx;
		color: #999;
	}
}

.card {
	background: #FFFFFF;
	border-radius: 16rpx;
	padding: 32rpx;
	margin-bottom: 24rpx;
	
	.item {
		display: flex;
		justify-content: space-between;
		align-items: center;
		
		.item-left {
			.item-title {
				display: block;
				font-size: 32rpx;
				font-weight: 500;
				color: #333;
				margin-bottom: 8rpx;
			}
			
			.item-desc {
				display: block;
				font-size: 24rpx;
				color: #999;
			}
		}
	}
}

.info-card {
	.info-title {
		font-size: 28rpx;
		font-weight: 500;
		color: #666;
		margin-bottom: 24rpx;
		padding-bottom: 16rpx;
		border-bottom: 1rpx solid #EFEFEF;
	}
	
	.info-item {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 16rpx 0;
		
		.info-label {
			font-size: 26rpx;
			color: #666;
		}
		
		.info-value {
			font-size: 24rpx;
			color: #333;
			
			&.test {
				color: #FF6B00;
			}
		}
	}
}

.tips {
	padding: 24rpx;
	text-align: center;
	
	.tips-text {
		font-size: 24rpx;
		color: #FF6B00;
	}
}

.btn-restart {
	width: 100%;
	height: 88rpx;
	background: #1777FF;
	border-radius: 44rpx;
	font-size: 32rpx;
	color: #FFFFFF;
	text-align: center;
	line-height: 88rpx;
	margin-top: 48rpx;
}
</style>