弄一个最初进入的页面，实现微信登录，首页轮播图

api/login.js

@@ -70,6 +70,21 @@ export function loginPhone(data){
 		'data': data
 	})
 }
+
+
+// 重置密码
+export function resetPwd(data){
+	return request({
+		url: '/user/resetPassword',
+		headers: {
+			isToken: false
+		},
+		'method': 'post',
+		'data': data
+	})
+}
+
+
 /**
  * 微信登录-获取openId
 */
@@ -84,10 +99,9 @@ export function wxLoginOpenid(data){
 	})
 }
 
-// 重置密码
-export function resetPwd(data){
+export function wxloginPhone(data){
 	return request({
-		url: '/user/resetPassword',
+		url: '/user/wxlogin/getPhone',
 		headers: {
 			isToken: false
 		},

components/lgSwiper.vue

@@ -5,7 +5,7 @@
 			:easing-function="easeInOutCubic"
 			@change="changeCurrent">
 			<swiper-item v-for="(slide, index) in processedSildeItems" :key="index" style="overflow: initial;"
-				:class="index==currentIndex? 'swiper-item-active':'swiper-item-normal'" @click="swiperClick(slide)">
+				:class="index==currentIndex? 'swiper-item-active':'swiper-item-normal'" @click="swiperClick">
 				<!-- <view :class="index==currentIndex? 'swiper-item active':'swiper-item'">
 					<view style="width: 100%;height: 90%;">
 						<image style="width: 100%;height: 100%;" mode="aspectFit" :src="slide[image]"></image>
@@ -14,8 +14,8 @@
 						<text class="swiper-text">{{ slide[title] }}</text>
 					</view>
 				</view> -->
-				<view :class="index==currentIndex? 'swiper-item active':'swiper-item'">
-					<image style="width: 100%;height: 90%;" mode="aspectFill" :src="slide[image]"></image>
+				<view :class="index==currentIndex? 'swiper-item active':'swiper-item'" >
+					<image style="width: 100%;height: 90%;" mode="aspectFill" :src="slide[image]" ></image>
 					<text class="swiper-text">{{ slide[title] }}</text>
 				</view>
 			</swiper-item>
@@ -35,6 +35,7 @@
 				this.currentIndex = e.detail.current
 			},
 			swiperClick(data){
+				console.log(111)
 				this.$emit('swiperClick', data);
 			}
 		},

pages.json

@@ -398,6 +398,17 @@
 					"titleNView": true
 				}
 			}
+		},
+		{
+			"path" : "pages/initial/initial",
+			"style": {
+				"navigationStyle": "custom",
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false,
+				"app-plus": {
+					"titleNView": false
+				}
+			}
 		}
 	],
 	"globalStyle": {

pages/forget/forget.vue

@@ -111,7 +111,7 @@
 								msgSuccess("重置成功!");
 								setTimeout(()=>{
 									uni.reLaunch({
-										url: "/pages/login/login",
+										url: "/pages/initial/initial",
 									})
 								}, 1000)
 							}

pages/index/index.vue

@@ -2,13 +2,14 @@
 	<view class="container">
 		<u-navbar :is-back="false" title="" :background="{ background: '#f7f7f7' }" :border-bottom="false">
 			<view class="slot-wrap">
-				<image src="https://sylwt.top/api/visitor/resources/image?name=/ydl/menber-center/login-icon.png" mode="aspectFit" style="width: 300rpx;"></image>
+				<image src="https://sylwt.top/api/visitor/resources/image?name=/ydl/menber-center/login-icon.png"
+					mode="aspectFit" style="width: 300rpx;"></image>
 			</view>
 		</u-navbar>
 		<view class="page-content">
 			<swiper class="swiper" circular indicator-dots style="border-radius: 20rpx;overflow: hidden;height: 200px">
 				<swiper-item v-for="(data, index) in swiperList" style="width: 100%;height: 100%;" :key="index">
-					<view class="swiper-item" style="width: 100%;height: 100%;">
+					<view class="swiper-item" style="width: 100%;height: 100%;" @click="itemClick(data)">
 						<image :src="data.imgUrl" mode="aspectFill" style="width: 100%;height: 100%;"></image>
 					</view>
 				</swiper-item>
@@ -16,7 +17,9 @@
 			<u-grid :col="4" :border="false" style="margin: 10rpx 0 ;">
 				<template v-for="(item,index) in navList" :key="index">
 					<u-grid-item bg-color="none" @click="jumpToPage(item)">
-						<image :src="`https://sylwt.top/api/visitor/resources/image?name=/ydl/menber-center/index-icon/${item.image}.png`" style="height: 70rpx;width: 70rpx;">
+						<image
+							:src="`https://sylwt.top/api/visitor/resources/image?name=/ydl/menber-center/index-icon/${item.image}.png`"
+							style="height: 70rpx;width: 70rpx;">
 						</image>
 						<view class="grid-text">{{item.title}}</view>
 					</u-grid-item>
@@ -28,7 +31,10 @@
 					<u-section title="课程预告" sub-title="查看更多" sub-color="#000000"></u-section>
 				</template>
 				<template v-slot:body>
-					<lg-swiper v-if="courseList.length!=0" :sildeItems="courseList" @swiperClick="swiperClick" image="courseImg"  title="courseName"></lg-swiper>
+					<lg-swiper v-if="courseList.length!=0" 
+					:sildeItems="courseList" 
+					@swiperClick="swiperClick"
+					image="courseImg" title="courseName"></lg-swiper>
 					<u-empty text="暂无内容" mode="data" v-else></u-empty>
 				</template>
 			</u-card>
@@ -46,14 +52,15 @@
 								<view class="item-content">
 									<text class="item-content-title text-ellipsis">{{data.title}}</text>
 									<text class="item-content-type">{{data.type}}</text>
-									<text class="item-content-price" v-if="!data.memberFree">￥{{data.price}}元</text>
+									<text class="item-content-price"
+										v-if="data.viewMode==='3'">￥{{isMember?data.priceMember:data.price}}元</text>
 								</view>
 								<view class="item-button">
-									<view v-if="!data.memberFree && data.hasBuy" class="item-button-yiGouMai">已购买
+									<view v-if="data.viewMode==='3' && data.hasBuy" class="item-button-yiGouMai">已购买
 									</view>
-									<view v-else-if="!data.memberFree && !data.hasBuy" class="item-button-goumai">
+									<view v-else-if="data.viewMode==='3' && !data.hasBuy" class="item-button-goumai">
 										点击购买</view>
-									<view v-else-if="data.memberFree" class="item-button-huiyuan">
+									<view v-else-if="data.viewMode==='2'" class="item-button-huiyuan">
 										会员免费
 									</view>
 								</view>
@@ -87,25 +94,33 @@
 	import {
 		useAuthStore
 	} from '@/store/authStore'
-	import { count } from '@/api/chat.js'
-	import { 
+	import {
+		count
+	} from '@/api/chat.js'
+	import {
 		homeCourseList,
 		homeReportList,
 		homeSetting,
 		homeSwiperList
 	} from '@/api/home.js'
-	import { me } from '@/api/user.js'
+	import {
+		me
+	} from '@/api/user.js'
 	const authStore = useAuthStore()
 	// 屏幕状态栏高度
 	const statusBarHeight = ref(0)
 	// 顶部导航栏高度
 	const navBarHeight = ref(0)
 	// 是否登录
-	
+
 	const loginModal = ref(false)
 	// 是否为会员，从缓存里拿取用户信息
 	// const userInfo = uni.getStorageSync("userinfo") || {}
-	// const isMember = userInfo?.isMember || false
+	const isMemberMap = {
+		0: true,
+		1: false
+	}
+	const isMember = ref(false)
 
 	// 首页-轮播图
 	const swiperList = ref([{
@@ -253,42 +268,48 @@
 	// 确认跳转至登录
 	const confirmModal = () => {
 		uni.navigateTo({
-			url: "/pages/login/login"
+			url: "/pages/initial/initial"
 		})
 	}
 	const toPage = () => {
 		if (!authStore.isAuthenticated) {
 			uni.navigateTo({
-				url: "/pages/login/login"
+				url: "/pages/initial/initial"
 			})
 			return
 		}
 	}
+	const itemClick = (data) =>{
+		console.log("swiper", data)
+	}
 	const swiperClick = (data) => {
 		console.log(data, "课程预告数据")
 	}
-	
-	function initUser(){
-		me().then(res=>{
-			if(res?.data){
+
+	function initUser() {
+		me().then(res => {
+			if (res?.data) {
 				authStore.setUserInfo(res.data);
+				isMember.value = res.data.isMember;
 			}
 		})
 	}
-	
+
 	function init() {
-		homeSwiperList().then(res=>{
-			console.log("轮播图", res)
+		homeSwiperList().then(res => {
+			if (res?.data) {
+				swiperList.value = res.data
+			}
 		})
-		homeCourseList().then(res=>{
+		homeCourseList().then(res => {
 			// console.log(1000, res.data)
-			if(res?.data){
+			if (res?.data) {
 				courseList.value = res.data
 				console.log(courseList.value)
 			}
 		})
-		homeReportList().then(res=>{
-			if(res?.data){
+		homeReportList().then(res => {
+			if (res?.data) {
 				reportList.value = res.data
 			}
 		})
@@ -296,7 +317,8 @@
 		// 	console.log(res)
 		// })
 	}
-	function getCharCount(){
+
+	function getCharCount() {
 		count().then(res => {
 			if (res && res.message === 'success') {
 				uni.setTabBarBadge({ //显示数字
@@ -319,15 +341,17 @@
 		init()
 		// initUser()
 	})
-	onShow(()=>{
+	onShow(() => {
 		const isLogin = authStore.isAuthenticated;
 		const isUserInfo = authStore.isUserInfo;
-		if(isLogin){
+		if (isLogin) {
 			// 登录后才请求消息数量
 			getCharCount()
 			// 没有用户信息就加载一边
-			if(!isUserInfo){
+			if (!isUserInfo) {
 				initUser();
+			} else {
+				isMember.value = authStore.userInfo.isMember;
 			}
 		}
 	})
@@ -360,11 +384,11 @@
 		color: #333;
 		margin-bottom: 30rpx;
 		height: 140rpx;
-		
+
 		&:last-of-type {
 			margin-bottom: 0;
 		}
-		
+
 		.u-body-item-content {
 			position: relative;
 			flex: 1;
@@ -380,9 +404,11 @@
 				margin: 10rpx;
 				color: $uni-text-color;
 			}
-			.item-content .item-content-title{
+
+			.item-content .item-content-title {
 				font-size: $uni-title-font-size-2;
 			}
+
 			.item-content .item-content-price {
 				color: $uni-color-error;
 				// font-weight: bold;
@@ -507,4 +533,4 @@
 			}
 		}
 	}
-</style>
+</style>

pages/initial/initial.vue

@@ -0,0 +1,211 @@
+<template>
+	<view class="app-login-page">
+		<view class="app-login">
+			<view class="app-icon u-m-b-30 ">
+				<image src="https://sylwt.top/api/visitor/resources/image?name=/ydl/menber-center/login-icon.png"
+					mode="aspectFit" style="height: 40px;"></image>
+			</view>
+			<view class="app-title u-m-b-60">
+				欢迎使用会员中心系统小程序
+			</view>
+			<view style="height: 25vh;">
+				<u-button v-if="userBook" open-type="getPhoneNumber" @getphonenumber="decryptPhoneNumber" class="custom-button" style="width: 40px;" plain :hair-line="false">
+					<view class="login-button">
+						本机号码一键登录
+					</view>
+				</u-button>
+				<u-button v-else class="custom-button" style="width: 40px;" plain :hair-line="false" @click="check">
+					<view class="login-button">
+						本机号码一键登录
+					</view>
+				</u-button>
+				<view class="login-button other-button u-m-b-50 u-m-t-50" @click="toLogin">
+					其他手机号/账号登录
+				</view>
+			</view>
+			<view class="app-user-book  mb-30">
+				<u-checkbox-group style="display: flex;justify-content: center;">
+					<u-checkbox v-model="userBook" name="yes" shape="circle">我已阅读&#x300A;运营商一键登录服务协议&#x300B;</u-checkbox>
+				</u-checkbox-group>
+			</view>
+		</view>
+		<u-modal v-model="userBookModal" mask-close-able class="modal" show-cancel-button
+			:title-style="{fontWeight: 'bold'}" @confirm="confirmModal">
+			<view class="modal-content">
+				为了更好地保障你的合法权益，进行下一步前，请阅读并同意
+				<text class="content-a">&#x300A;运营商一键登录服务协议&#x300B;</text>
+			</view>
+		</u-modal>
+	</view>
+</template>
+
+<script setup>
+	import { wxLoginOpenid, wxloginPhone } from '@/api/login.js'
+	import {
+		msg,
+		msgSuccess
+	} from "@/utils/common.js"
+	import { ref } from 'vue'
+	import {
+		useAuthStore
+	} from '@/store/authStore'
+	const authStore = useAuthStore()
+	const userBook = ref(false)
+	const userBookModal = ref(false)
+	function toLogin() {
+		uni.navigateTo({
+			url: "/pages/login/login"
+		})
+	}
+	async function wxlogin(){
+		
+		
+		const loginRes = await wx.login();
+		const code = loginRes.code;
+		wxLoginOpenid({code}).then(res=>{
+			if(res?.data){
+				const { openid, sessionKey } = res.data
+				
+			}
+		})
+	}
+	
+	function confirmModal() {
+		userBook.value = true
+		// this.wxlogin()
+	}
+	
+	function checkUserBook() {
+		if (!userBook.value) {
+			userBookModal.value = true
+			return false;
+		}
+		return true
+	}
+	
+	function check(){
+		if (!checkUserBook()) return;
+	}
+	
+	async function decryptPhoneNumber(e){
+		if (e.detail.encryptedData) {
+			const {
+				encryptedData,
+				iv,
+				code
+			} = e.detail;
+			const loginRes = await wx.login();
+			const wxcode = loginRes.code;
+			try{
+				const openidRes = await wxLoginOpenid({code : wxcode})
+				if(openidRes?.data){
+					const { openid, sessionKey } = openidRes.data
+					const phoneRes = await wxloginPhone({ openid, phoneCode: code})
+					const { phone, token, isNewUser } = phoneRes.data;
+					authStore.setPhone(phone);
+					authStore.setAuthToken(token);
+					uni.reLaunch({
+						url: "/pages/register/register?mode=refine"
+					})
+					// if(isNewUser){
+					// 	//新用户，跳转：完善用户信息
+					// 	// console.log("完善用户信息")
+					// 	uni.reLaunch({
+					// 		url: "/pages/register/register?mode=refine"
+					// 	})
+					// }else{
+					// 	// 老用户，跳转至：首页
+					// 	msgSuccess("授权成功！")
+					// 	setTimeout(()=>{
+					// 		uni.switchTab({
+					// 			url: "/pages/index/index"
+					// 		})
+					// 	}, 1000)
+					// }
+				}
+			}catch(err){
+				console.log("ee", err)
+			}
+			
+			// 将 encryptedData 和 iv 发送到后端进行解密
+		} else {
+			msg('取消授权手机号');
+		}
+	}
+</script>
+<style lang="scss">
+	.form-item .u-input--border {
+		border-radius: 16rpx !important;
+	}
+
+	.custom-button {
+		.u-btn {
+			display: block !important;
+			width: fit-content;
+			padding: 0 !important;
+			border-radius: 50rpx;
+		}
+
+		.u-btn--default {
+			border: none !important;
+			background-color: transparent !important;
+		}
+	}
+</style>
+<style lang="scss" scoped>
+	.app-login-page {
+		background-color: #ffffff;
+		width: 100vw;
+		height: 100vh;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+	}
+
+	.app-login {
+		width: 90%;
+	}
+
+	.app-icon {
+		text-align: center;
+	}
+
+	.app-title {
+		text-align: center;
+		font-size: 44rpx;
+		letter-spacing: 2px;
+		font-weight: 700;
+	}
+
+	.mb-30 {
+		margin-bottom: 30rpx;
+	}
+	
+	.login-button {
+		background: linear-gradient(90deg, #006af5, #21b0fc);
+		border-radius: 20rpx;
+		line-height: 80rpx;
+		text-align: center;
+		color: #fff;
+		margin-bottom: 50rpx;
+		width: 550rpx;
+		margin: 0 auto;
+		font-size: 32rpx;
+		letter-spacing: 4rpx;
+	}
+	.other-button{
+		color: #006af5;
+		background: #e5e5e5;
+	}
+	
+	// 用户手册模拟态
+	.modal {
+		.modal-content {
+			padding: 50rpx;
+	
+			.content-a {
+				color: #2979ff;
+			}
+		}
+	}
+</style>

pages/login/login.vue

@@ -57,27 +57,14 @@
 					<u-checkbox v-model="userBook" name="yes" shape="circle">我已阅读&#x300A;用户手册&#x300B;及隐私政策</u-checkbox>
 				</u-checkbox-group>
 			</view>
-			<u-divider bg-color="transparent" margin-bottom="30" color="#010101" border-color="#010101"
-				half-width="200">使用第三方账号登录</u-divider>
-			<view class="app-icon mb-30">
-				<!-- v-if="canIUseGetUserProfile" -->
-				<!-- <u-button @click="getUserProfile" class="custom-button" style="width: 40px;" plain :hair-line="false">
-					<image src="https://sylwt.top/api/visitor/resources/image?name=/ydl/menber-center/weixin.png"
-						mode="aspectFit" style="width: 40px;height: 40px;" />
-				</u-button> -->
-				<!-- v-else -->
-				<!-- <u-button open-type="getPhoneNumber" @getphonenumber="decryptPhoneNumber" class="custom-button"
-					style="width: 40px;" plain :hair-line="false">
-					<image src="https://sylwt.top/api/visitor/resources/image?name=/ydl/menber-center/weixin.png"
-						mode="aspectFit" style="width: 40px;height: 40px;" />
-				</u-button> -->
+			<!-- <u-divider bg-color="transparent" margin-bottom="30" color="#010101" border-color="#010101"
+				half-width="200">使用第三方账号登录</u-divider> -->
+			<!-- <view class="app-icon mb-30">
 				<u-button @click="handleWxLogin()" class="custom-button" style="width: 40px;" plain :hair-line="false">
 					<image src="https://sylwt.top/api/visitor/resources/image?name=/ydl/menber-center/weixin.png"
 						mode="aspectFit" style="width: 40px;height: 40px;" />
 				</u-button>
-				<!-- <button type="default" open-type="getPhoneNumber" @getphonenumber="decryptPhoneNumber">获取手机号</button> -->
-				<!-- <image src="https://sylwt.top/api/visitor/resources/image?name=/ydl/menber-center/weixin.png" mode="aspectFit" style="height: 40px;"></image> -->
-			</view>
+			</view> -->
 		</view>
 		<u-verification-code :seconds="seconds" ref="uCode1" @change="codeChange"></u-verification-code>
 		<u-popup v-model="show" mode="center" border-radius="10">

pages/register/register.vue

@@ -14,10 +14,15 @@
 				<u-input height="80" placeholder="请确认密码" border-color="#d0d0d0" v-model="registerForm.checkPwd"
 					:border="true" class="form-item-input" type="password" />
 			</u-form-item>
-			<u-form-item label="手机号码" prop="phone" required :border-bottom="false">
+			<u-form-item label="手机号码" prop="phone" required :border-bottom="false" v-if="mode === 'register'">
 				<u-input height="80" placeholder="请输入手机号" border-color="#d0d0d0" v-model="registerForm.phone"
 					:border="true" class="form-item-input" type="number" />
 			</u-form-item>
+			<u-form-item label="手机号码" prop="phone" required :border-bottom="false" v-else>
+				<u-input height="80" placeholder="请输入手机号" border-color="#d0d0d0" v-model="registerForm.phone"
+					:border="true" class="form-item-input" type="number" />
+					11111
+			</u-form-item>
 			<u-form-item label="身份证" prop="userCode" :border-bottom="false">
 				<u-input height="80" placeholder="请输入身份证" border-color="#d0d0d0" v-model="registerForm.userCode"
 					:border="true" class="form-item-input" />
@@ -40,14 +45,22 @@
 
 <script>
 	import {
-		msg, msgSuccess
+		msg,
+		msgSuccess
 	} from "@/utils/common.js"
-	import { encryptAESCBC } from "@/utils/crypto.js"
-	import { register } from "@/api/login.js"
-	import { useAuthStore } from '@/store/authStore.js'
+	import {
+		encryptAESCBC
+	} from "@/utils/crypto.js"
+	import {
+		register
+	} from "@/api/login.js"
+	import {
+		useAuthStore
+	} from '@/store/authStore.js'
 	export default {
 		data() {
 			return {
+				mode: "",
 				registerForm: {
 					username: '', //账号
 					password: "", //密码
@@ -124,22 +137,24 @@
 			submit() {
 				const that = this;
 				that.$refs.registerForm.validate((valid) => {
-					const form = {...this.registerForm};
+					const form = {
+						...this.registerForm
+					};
 					form.password = encryptAESCBC(form.password);
 					form.checkPwd = encryptAESCBC(form.checkPwd);
-					register(form).then(res=>{
-						if(res?.token){
+					register(form).then(res => {
+						if (res?.token) {
 							this.useAuthStore.setAuthToken(res.token);
 							this.useAuthStore.setUserInfo({
 								userId,
 								zhangHao
 							})
 							msgSuccess("注册成功");
-							setTimeout(()=>{
+							setTimeout(() => {
 								uni.switchTab({
-									url:"/pages/index/index"
+									url: "/pages/index/index"
 								})
-							},1000)
+							}, 1000)
 						}
 					})
 				})
@@ -159,7 +174,17 @@
 				})
 			}
 		},
-		onLoad() {},
+		onLoad(option) {
+			const {
+				mode
+			} = option;
+			if (mode === "refine") {
+				this.mode = mode;
+				this.registerForm.phone = this.useAuthStore.phone;
+			}else{
+				this.mode = 'register'
+			}
+		},
 		onReady() {
 			this.$refs.registerForm.setRules(this.rules);
 		},
@@ -215,4 +240,4 @@
 		text-align: center;
 		color: #000000;
 	}
-</style>
+</style>

store/authStore.js

@@ -4,7 +4,8 @@ import { getToken,setToken,removeToken } from '@/utils/auth.js'
 export const useAuthStore = defineStore('auth', {
 	state: () => ({
 		token: null,
-		userInfo: null
+		userInfo: null,
+		phone: null
 	}),
 	actions: {
 		setAuthToken(newToken) {
@@ -29,7 +30,23 @@ export const useAuthStore = defineStore('auth', {
 		// 初始化时从Storage加载
 		loadUserInfo() {
 		  this.userInfo = uni.getStorageSync('USER_INFO') || null
-		}
+		},
+		cleanUserInfo() {
+			this.userInfo = null
+			uni.removeStorageSync("USER_INFO")
+		},
+		setPhone(data) {
+		  this.phone = data
+		  uni.setStorageSync('phone', data)
+		},
+		// 初始化时从Storage加载
+		loadPhone() {
+		  this.phone = uni.getStorageSync('phone') || null
+		},
+		cleanPhone() {
+			this.phone = null
+			uni.removeStorageSync("phone")
+		},
 	},
 	getters: {
 		isAuthenticated(state) {

utils/request.js

@@ -39,7 +39,7 @@ const request = config => {
 					showConfirm('登录状态已过期，您可以继续留在该页面，或者重新登录?').then(res => {
 						if (res.confirm) {
 							uni.reLaunch({
-								url: '/pages/login/login'
+								url: '/pages/initial/initial'
 							});
 						}
 					});
@@ -59,9 +59,9 @@ const request = config => {
 				} = error;
 				if (message === 'Network Error') {
 					message = '后端接口连接异常';
-				} else if (message.includes('timeout')) {
+				} else if (message.indexOf('timeout')!==-1) {
 					message = '系统接口请求超时';
-				} else if (message.includes('Request failed with status code')) {
+				} else if (message.indexOf('Request failed with status code')!==-1) {
 					message = '系统接口' + message.substr(message.length - 3) + '异常';
 				}
 				toast(message);