123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906 |
- <template>
- <view class="my-container">
- <view class="user-info" v-if="isLogin">
- <image class="avatar" :src="userInfo.avatar || '/static/avatar.png'"></image>
- <view class="user-details">
- <text class="username">{{ userInfo.username }}</text>
- <!-- <text class="user-id">ID: {{ userInfo.userId }}</text> -->
- <text class="user-phone" v-if="userInfo.phone">手机: {{ formatPhone(userInfo.phone) }}</text>
- </view>
- </view>
-
- <view class="user-info" v-else @click="goLogin">
- <image class="avatar" src="/static/avatar.png"></image>
- <view class="user-details">
- <text class="username">点击登录</text>
- <text class="user-id">登录后查看更多信息</text>
- </view>
- </view>
-
- <view class="menu-list">
- <view class="menu-item" v-for="(item, index) in menuItems" :key="index" @click="handleMenuClick(item)">
- <view class="menu-item-left">
- <text class="iconfont" :class="item.icon"></text>
- <text class="menu-text">{{ item.title }}</text>
- </view>
- <text class="iconfont icon-right"></text>
- </view>
- </view>
-
- <view class="logout-btn" @click="handleLogout" v-if="isLogin">
- <text>退出登录</text>
- </view>
-
- <!-- 添加一个隐藏的授权按钮,在需要时显示 -->
- <view class="auth-modal" v-if="showAuthModal">
- <view class="auth-content">
- <text class="auth-title">微信授权登录</text>
- <text class="auth-desc">请授权获取您的微信头像和昵称</text>
- <button class="auth-btn" @tap="getUserProfile">确认授权</button>
- <button class="auth-cancel" @tap="cancelAuth">取消</button>
- </view>
- </view>
-
- <!-- 添加获取手机号按钮 -->
- <!-- <button
- v-if="isLogin && !userInfo.phone"
- open-type="getPhoneNumber"
- @getphonenumber="getPhoneNumber"
- class="get-phone-btn">
- 绑定手机号
- </button> -->
- <!-- <button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">获取手机号</button> -->
- </view>
- </template>
- <script>
- // 直接导入所有需要的 API 函数
- import { log } from 'util';
- import { wxLogin, getUserInfo, getUserPhoneNumber, logout } from '../../api/user.js';
- export default {
- data() {
- return {
- isLogin: false,
- userInfo: {
- username: '',
- userId: '',
- avatar: ''
- },
- menuItems: [
- { title: '个人资料', icon: 'icon-user', action: 'profile' },
- // { title: '我的订单', icon: 'icon-order', action: 'orders' },
- // { title: '我的收藏', icon: 'icon-star', action: 'favorites' },
- { title: '设置', icon: 'icon-settings', action: 'settings' },
- { title: '帮助中心', icon: 'icon-help', action: 'help' }
- ],
- showAuthModal: false,
- wxLoginCode: '' // 存储微信登录code
- }
- },
- onLoad() {
- // 每次显示页面时检查登录状态
- //this.checkLogin();
- },
- onShow() {
- // 每次显示页面时检查登录状态
- this.checkLoginStatus();
- },
- methods: {
- checkLogin() {
- const userInfo = uni.getStorageSync('userInfo');
- if (!userInfo) {
- // 未登录时跳转到身份验证登录页面
- uni.reLaunch({
- url: '/pages/login/login',
- success: () => {
- console.log('跳转到身份验证登录页面成功');
- },
- fail: (err) => {
- console.error('跳转到身份验证登录页面失败:', err);
- uni.showToast({
- title: '跳转失败,请重试',
- icon: 'none'
- });
- }
- });
- return false;
- }
-
- try {
- const parsedUserInfo = JSON.parse(userInfo);
- if (!parsedUserInfo.openid) {
- // 没有openid时跳转到身份验证登录页面
- uni.navigateTo({
- url: '/pages/login/login'
- });
- return false;
- }
- return true;
- } catch (e) {
- console.error('解析用户信息失败:', e);
- uni.removeStorageSync('userInfo');
- uni.navigateTo({
- url: '/pages/login/login'
- });
- return false;
- }
- },
- // 检查登录状态
- checkLoginStatus() {
- try {
- const token = uni.getStorageSync('token');
- const userInfoStr = uni.getStorageSync('userInfo');
-
- if (token && userInfoStr) {
- const userInfo = JSON.parse(userInfoStr);
-
- // 检查登录是否过期(可选:如果需要登录有效期)
- const loginTime = userInfo.loginTime || 0;
- const currentTime = new Date().getTime();
- const loginExpireTime = 7 * 24 * 60 * 60 * 1000; // 例如7天过期
-
- if (currentTime - loginTime > loginExpireTime) {
- console.log('登录已过期,需要重新登录');
- this.handleLogout(false); // 静默登出,不显示提示
- return;
- }
-
- // 设置登录状态
- this.isLogin = true;
- this.userInfo = userInfo;
-
- // 可选:每次打开页面时刷新用户信息
- this.fetchUserDetail();
- } else {
- // 未登录状态
- this.isLogin = false;
- this.userInfo = {
- username: '',
- userId: '',
- avatar: '',
- phone: ''
- };
- }
- } catch (e) {
- console.error('获取登录状态失败', e);
- this.isLogin = false;
- }
- },
-
- // 前往登录页
- goLogin() {
- // 直接跳转到登录页面,不显示选择对话框
- uni.navigateTo({
- url: '/pages/login/login'
- });
-
- // 如果您想保留选择功能,可以取消注释下面的代码
- /*
- // 显示登录方式选择
- uni.showActionSheet({
- itemList: ['账号密码登录', '微信登录'],
- success: (res) => {
- if (res.tapIndex === 0) {
- // 账号密码登录
- uni.navigateTo({
- url: '/pages/login/login'
- });
- } else if (res.tapIndex === 1) {
- // 微信登录
- this.wxLogin();
- }
- }
- });
- */
- },
-
- // 微信登录
- wxLogin() {
- // #ifdef MP-WEIXIN
- this.getWxLoginCode();
- // #endif
-
- // #ifndef MP-WEIXIN
- uni.showToast({
- title: '请在微信环境中使用微信登录',
- icon: 'none'
- });
- // #endif
- },
-
- // 获取微信登录 code
- getWxLoginCode() {
- uni.showLoading({ title: '登录中...' });
-
- // 调用uni.login获取临时code
- uni.login({
- provider: 'weixin',
- success: (loginRes) => {
- console.log('获取微信登录code成功:', loginRes.code);
- // 保存code,并显示授权弹窗
- this.wxLoginCode = loginRes.code;
- uni.hideLoading();
- this.showAuthModal = true;
- },
- fail: (err) => {
- uni.hideLoading();
- console.error('获取微信登录code失败:', err);
- uni.showToast({
- title: '微信登录失败',
- icon: 'none'
- });
- }
- });
- },
-
- // 用户点击授权按钮时调用
- getUserProfile() {
- // 这个方法直接绑定到按钮的点击事件
- wx.getUserProfile({
- desc: '用于完善用户资料',
- success: (profileRes) => {
- console.log('获取用户信息成功:', profileRes);
-
- // 准备完整的登录参数
- const loginParams = {
- code: this.wxLoginCode,
- userInfo: profileRes.userInfo,
- signature: profileRes.signature,
- rawData: profileRes.rawData,
- encryptedData: profileRes.encryptedData,
- iv: profileRes.iv
- };
-
- // 隐藏授权弹窗
- this.showAuthModal = false;
-
- // 发送登录请求
- this.wxLoginRequest(loginParams);
- },
- fail: (err) => {
- console.error('获取用户信息失败:', err);
- this.showAuthModal = false;
-
- // 如果用户拒绝授权,仍然可以使用code登录,但没有用户信息
- this.wxLoginRequest({
- code: this.wxLoginCode,
- userInfo: {
- nickName: '微信用户',
- avatarUrl: '',
- gender: 0,
- province: '',
- city: '',
- country: ''
- }
- });
- }
- });
- },
-
- // 取消授权
- cancelAuth() {
- this.showAuthModal = false;
- // 使用code进行静默登录
- this.wxLoginRequest({
- code: this.wxLoginCode,
- userInfo: {
- nickName: '微信用户',
- avatarUrl: '',
- gender: 0,
- province: '',
- city: '',
- country: ''
- }
- });
- },
-
- // 头像选择回调
- onChooseAvatar(e) {
- const { avatarUrl } = e.detail;
- // 这里可以将头像上传到服务器或进行其他处理
- console.log('用户选择的头像:', avatarUrl);
- },
-
- // 发送微信登录请求并处理结果
- async wxLoginRequest(loginParams) {
- try {
- uni.showLoading({ title: '登录中...' });
-
- console.log('发送登录请求,参数:', loginParams);
-
- // 发送登录请求
- const data = await wxLogin(loginParams);
- console.log('登录成功,返回数据:', data);
-
- // 构建用户信息对象
- const userData = this.buildUserData(data, loginParams);
-
- // 保存登录状态
- this.saveLoginState(data, userData);
-
- // 步骤6: 获取用户详细信息 - 如果需要的话
- if (userData.userId) {
- this.fetchUserDetail();
- } else {
- console.log('无法获取用户ID,跳过获取详细信息');
- }
-
- // 检查是否需要获取手机号
- if (!userData.phone) {
- console.log('用户未绑定手机号,可以提示用户绑定');
- // 这里可以显示提示或自动弹出获取手机号的按钮
- }
- } catch (error) {
- this.handleLoginError(error, loginParams);
- }
- },
-
- /**
- * 构建用户数据对象
- * @param {Object} data - 后端返回的数据
- * @param {Object} loginParams - 登录参数
- * @returns {Object} - 构建的用户数据
- */
- buildUserData(data, loginParams) {
- console.log('构建用户数据,服务器返回:', data);
-
- // 处理不同的返回格式
- let userData = {
- // 用户基本信息 - 优先使用服务器返回的数据
- username: data.username || data.nickName ||
- (loginParams.userInfo ? loginParams.userInfo.nickName : '微信用户'),
-
- // 用户ID可能在不同字段
- userId: data.userId || data.user_id || data.id || data.openid || '',
-
- // 头像可能在不同字段
- avatar: data.avatar || data.avatarUrl ||
- (loginParams.userInfo ? loginParams.userInfo.avatarUrl : '/static/avatar.png'),
-
- // 用户详细信息
- phone: data.phone || data.mobile || '',
- gender: data.gender || (loginParams.userInfo ? loginParams.userInfo.gender : 0),
-
- // 微信相关信息
- openid: data.openid || '',
- unionid: data.unionid || '',
- session_key: data.session_key || '',
-
- // 是否新用户
- is_new_user: data.is_new_user || false,
-
- // 登录时间
- loginTime: new Date().getTime()
- };
-
- console.log('构建的用户数据:', userData);
- return userData;
- },
-
- /**
- * 保存登录状态和用户信息
- * @param {Object} data - 后端返回的数据
- * @param {Object} userData - 构建的用户数据
- */
- saveLoginState(data, userData) {
- // 保存token - 可能在不同字段
- const token = data.token || data.session_key || '';
- if (token) {
- uni.setStorageSync('token', token);
- console.log('Token已保存:', token);
- }
-
- // 保存用户信息
- uni.setStorageSync('userInfo', JSON.stringify(userData));
- console.log('用户信息已保存');
-
- // 更新页面状态
- this.isLogin = true;
- this.userInfo = userData;
-
- // 显示成功提示
- uni.hideLoading();
- uni.showToast({
- title: '登录成功',
- icon: 'success'
- });
- },
-
- /**
- * 处理登录错误
- * @param {Error} error - 错误对象
- * @param {Object} loginParams - 登录参数
- */
- handleLoginError(error, loginParams) {
- uni.hideLoading();
-
- // 检查是否是 code 无效错误
- if (error.message && (
- error.message.includes('code无效') ||
- error.message.includes('已过期') ||
- error.message.includes('已被使用') ||
- error.status === 999)) {
- console.error('微信登录code无效,重新获取:', error);
- uni.showToast({
- title: 'code已过期,请重试',
- icon: 'none',
- duration: 2000
- });
-
- // 延迟一下再重新获取code,避免频繁调用
- setTimeout(() => {
- this.getWxLoginCode();
- }, 1000);
- return;
- }
-
- // 其他错误处理保持不变
- if (error.code === 10001) {
- // 微信未绑定账号,跳转到绑定页面
- uni.navigateTo({
- url: '/pages/bind/bind?code=' + (loginParams.code || '')
- });
- } else if (error.message && error.message.includes('CSRF')) {
- // CSRF 错误处理
- console.error('CSRF验证失败:', error);
- uni.showToast({
- title: 'CSRF验证失败,请刷新页面重试',
- icon: 'none',
- duration: 2000
- });
- setTimeout(() => this.refreshCSRFToken(), 2000);
- } else {
- // 其他错误
- console.error('微信登录失败:', error);
- uni.showToast({
- title: error.message || '登录失败',
- icon: 'none'
- });
- }
- },
-
- /**
- * 获取用户详细信息
- * 步骤6: 获取并更新用户详细信息
- */
- async fetchUserDetail() {
- try {
- if (!this.isLogin) return;
-
- // 获取用户ID
- const userId = this.userInfo.userId;
-
- // 调用获取用户详情API
- const userDetail = await getUserInfo(userId);
- console.log('获取用户详细信息成功:', userDetail);
-
- if (userDetail) {
- // 更新用户信息
- this.updateUserInfo(userDetail);
- }
- } catch (error) {
- console.error('获取用户详细信息失败:', error);
- }
- },
-
- /**
- * 更新用户信息
- * @param {Object} userDetail - 用户详细信息
- */
- updateUserInfo(userDetail) {
- // 合并现有信息和新获取的详细信息
- const updatedUserInfo = {
- ...this.userInfo,
- // 更新基本信息
- username: userDetail.username || userDetail.nickName || this.userInfo.username,
- avatar: userDetail.avatar || userDetail.avatarUrl || this.userInfo.avatar,
- phone: userDetail.phone || userDetail.mobile || this.userInfo.phone,
-
- // 更新详细信息
- email: userDetail.email || '',
- address: userDetail.address || '',
- birthday: userDetail.birthday || '',
-
- // 其他字段
- ...userDetail
- };
-
- // 更新状态和存储
- this.userInfo = updatedUserInfo;
- uni.setStorageSync('userInfo', JSON.stringify(updatedUserInfo));
- console.log('用户详细信息已更新');
- },
-
- /**
- * 获取用户手机号
- * @param {Object} e - 事件对象
- */
- getPhoneNumber(e) {
- if (e.detail.code) {
- // 立即发送到后端,不缓存,不复用
- wx.request({
- url: 'http:192.168.66.187:8083/wechat/getUserPhoneNumber',
- method: 'POST',
- data: {
- code: e.detail.code, // 刚获取的新code
- openid: this.data.openid
- }
- })
- }
- },
- /* async getPhoneNumber(e) {
- console.log('获取手机号事件:', e);
-
- // 检查是否成功获取
- if (e.detail.errMsg !== 'getPhoneNumber:ok') {
- console.error('用户拒绝授权手机号');
- uni.showToast({
- title: '获取手机号失败',
- icon: 'none'
- });
- return;
- }
-
- try {
- uni.showLoading({ title: '获取手机号中...' });
-
- // 每次都重新获取最新的登录code
- const loginResult = await new Promise((resolve, reject) => {
- uni.login({
- provider: 'weixin',
- success: (res) => resolve(res),
- fail: (err) => reject(err)
- });
- });
-
- if (!loginResult || !loginResult.code) {
- throw new Error('获取微信登录凭证失败');
- }
-
- console.log('成功获取新的登录code:', loginResult.code);
-
- // 获取存储的用户信息
- const userInfoStr = uni.getStorageSync('userInfo');
- if (!userInfoStr) {
- throw new Error('用户信息不存在,请重新登录');
- }
-
- const userInfo = JSON.parse(userInfoStr);
-
- // 准备请求参数
- const params = {
- code: loginResult.code,
- encryptedData: e.detail.encryptedData,
- iv: e.detail.iv,
- openid: userInfo.openid
- };
-
- console.log('获取手机号请求参数:', params);
-
- // 调用获取手机号API
- const phoneData = await getUserPhoneNumber(params);
- console.log('获取手机号成功:', phoneData);
-
- // 更新用户信息
- if (phoneData && phoneData.phoneNumber) {
- const updatedUserInfo = {
- ...this.userInfo,
- phone: phoneData.phoneNumber
- };
-
- // 更新状态和存储
- this.userInfo = updatedUserInfo;
- uni.setStorageSync('userInfo', JSON.stringify(updatedUserInfo));
-
- uni.showToast({
- title: '手机号绑定成功',
- icon: 'success'
- });
- } else {
- throw new Error('未能获取到手机号');
- }
- } catch (error) {
- console.error('获取手机号失败:', error);
- uni.showToast({
- title: error.message || '获取手机号失败',
- icon: 'none'
- });
- } finally {
- uni.hideLoading();
- }
- }, */
-
- // 添加刷新 CSRF token 的方法
- refreshCSRFToken() {
- // 这里实现获取新的 CSRF token 的逻辑
- // 可能需要调用特定的 API 或刷新页面
- uni.request({
- url: 'your-api-endpoint/csrf-token', // 替换为获取 CSRF token 的 API
- method: 'GET',
- success: (res) => {
- if (res.data && res.data.csrfToken) {
- uni.setStorageSync('csrfToken', res.data.csrfToken);
- console.log('CSRF token 已刷新');
- }
- },
- fail: (err) => {
- console.error('获取 CSRF token 失败', err);
- }
- });
- },
-
- handleMenuClick(item) {
- // 检查是否需要登录
- const needLogin = ['profile', 'orders', 'favorites'];
-
- if (needLogin.includes(item.action) && !this.isLogin) {
- uni.showToast({
- title: '请先登录',
- icon: 'none'
- });
- setTimeout(() => {
- this.goLogin();
- }, 1500);
- return;
- }
-
- // 根据action跳转到对应页面
- switch(item.action) {
- case 'profile':
- uni.navigateTo({ url: '/pages/profile/profile' });
- break;
- case 'orders':
- uni.navigateTo({ url: '/pages/orders/orders' });
- break;
- case 'favorites':
- uni.navigateTo({ url: '/pages/favorites/favorites' });
- break;
- case 'settings':
- uni.navigateTo({ url: '/pages/settings/settings' });
- break;
- case 'help':
- uni.navigateTo({ url: '/pages/help/help' });
- break;
- default:
- uni.showToast({
- title: `点击了${item.title}`,
- icon: 'none'
- });
- }
- },
-
- // 处理退出登录 - 增强版
- handleLogout(showConfirm = true) {
- const doLogout = () => {
- // 调用登出 API
- logout().then(() => {
- // 清除登录信息
- try {
- uni.removeStorageSync('token');
- uni.removeStorageSync('userInfo');
-
- // 更新状态
- this.isLogin = false;
- this.userInfo = {
- username: '',
- userId: '',
- avatar: '',
- phone: ''
- };
-
- // 显示提示(如果需要)
- if (showConfirm) {
- uni.showToast({
- title: '已退出登录',
- icon: 'success'
- });
- }
- } catch (e) {
- console.error('退出登录失败', e);
- if (showConfirm) {
- uni.showToast({
- title: '退出登录失败',
- icon: 'none'
- });
- }
- }
- }).catch(err => {
- console.error('退出登录请求失败', err);
- // 即使 API 请求失败,也清除本地登录状态
- uni.removeStorageSync('token');
- uni.removeStorageSync('userInfo');
- this.isLogin = false;
-
- if (showConfirm) {
- uni.showToast({
- title: err.message || '退出登录失败',
- icon: 'none'
- });
- }
- });
- };
-
- // 是否需要显示确认对话框
- if (showConfirm) {
- uni.showModal({
- title: '提示',
- content: '确定要退出登录吗?',
- success: (res) => {
- if (res.confirm) {
- doLogout();
- }
- }
- });
- } else {
- // 直接登出,不显示确认
- doLogout();
- }
- },
- // 格式化手机号,例如:188****8888
- formatPhone(phone) {
- if (!phone || phone.length < 11) return phone;
- return phone.substring(0, 3) + '****' + phone.substring(7);
- }
- }
- }
- </script>
- <style>
- .my-container {
- padding: 20rpx;
- background-color: #f5f5f5;
- min-height: 100vh;
- }
-
- .user-info {
- display: flex;
- align-items: center;
- background-color: #ffffff;
- padding: 30rpx;
- border-radius: 12rpx;
- margin-bottom: 20rpx;
- }
-
- .avatar {
- width: 120rpx;
- height: 120rpx;
- border-radius: 60rpx;
- margin-right: 20rpx;
- }
-
- .user-details {
- display: flex;
- flex-direction: column;
- }
-
- .username {
- font-size: 36rpx;
- font-weight: bold;
- margin-bottom: 10rpx;
- }
-
- .user-id {
- font-size: 24rpx;
- color: #999;
- }
-
- .user-phone {
- font-size: 24rpx;
- color: #666;
- margin-top: 6rpx;
- }
-
- .menu-list {
- background-color: #ffffff;
- border-radius: 12rpx;
- margin-bottom: 20rpx;
- }
-
- .menu-item {
- display: flex;
- justify-content: space-between;
- align-items: center;
- padding: 30rpx;
- border-bottom: 1rpx solid #f5f5f5;
- }
-
- .menu-item:last-child {
- border-bottom: none;
- }
-
- .menu-item-left {
- display: flex;
- align-items: center;
- }
-
- .menu-text {
- margin-left: 20rpx;
- font-size: 28rpx;
- }
-
- .logout-btn {
- background-color: #ffffff;
- border-radius: 12rpx;
- padding: 30rpx;
- text-align: center;
- color: #ff0000;
- font-size: 32rpx;
- }
-
- /* 这里应该引入iconfont,但为了简化,我们先不添加 */
- .iconfont {
- font-size: 36rpx;
- color: #007AFF;
- }
-
- .icon-right {
- color: #cccccc;
- }
-
- /* 授权弹窗样式 */
- .auth-modal {
- position: fixed;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- background-color: rgba(0, 0, 0, 0.5);
- display: flex;
- justify-content: center;
- align-items: center;
- z-index: 999;
- }
-
- .auth-content {
- width: 80%;
- background-color: #fff;
- border-radius: 12rpx;
- padding: 40rpx;
- display: flex;
- flex-direction: column;
- align-items: center;
- }
-
- .auth-title {
- font-size: 36rpx;
- font-weight: bold;
- margin-bottom: 20rpx;
- }
-
- .auth-desc {
- font-size: 28rpx;
- color: #666;
- margin-bottom: 40rpx;
- text-align: center;
- }
-
- .auth-btn {
- width: 100%;
- height: 80rpx;
- line-height: 80rpx;
- background-color: #07c160;
- color: #fff;
- border-radius: 8rpx;
- margin-bottom: 20rpx;
- }
-
- .auth-cancel {
- width: 100%;
- height: 80rpx;
- line-height: 80rpx;
- background-color: #f5f5f5;
- color: #333;
- border-radius: 8rpx;
- }
-
- /* 添加获取手机号按钮样式 */
- .get-phone-btn {
- margin-top: 20rpx;
- background-color: #07c160;
- color: #fff;
- border-radius: 8rpx;
- font-size: 28rpx;
- padding: 16rpx 0;
- }
- </style>
|