微信小程序页面迁移校验之前 P5任务处理之前
This commit is contained in:
@@ -0,0 +1,7 @@
|
||||
{
|
||||
"navigationBarTitleText": "无权限",
|
||||
"navigationStyle": "custom",
|
||||
"usingComponents": {
|
||||
"t-icon": "tdesign-miniprogram/icon/icon"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,74 @@
|
||||
// pages/no-permission/no-permission.ts
|
||||
// 无权限页面 — 账号已禁用或无访问权限时展示
|
||||
// onShow 时查询最新状态,状态变化时自动跳转
|
||||
|
||||
import { request } from "../../utils/request"
|
||||
|
||||
Page({
|
||||
data: {
|
||||
statusBarHeight: 0,
|
||||
},
|
||||
|
||||
onLoad() {
|
||||
const { statusBarHeight = 0 } = wx.getSystemInfoSync()
|
||||
this.setData({ statusBarHeight })
|
||||
},
|
||||
|
||||
onShow() {
|
||||
this._checkStatus()
|
||||
},
|
||||
|
||||
/** 查询最新用户状态,非 disabled 时自动跳转 */
|
||||
async _checkStatus() {
|
||||
const token = wx.getStorageSync("token")
|
||||
if (!token) {
|
||||
wx.reLaunch({ url: "/pages/login/login" })
|
||||
return
|
||||
}
|
||||
try {
|
||||
const data = await request({
|
||||
url: "/api/xcx/me",
|
||||
method: "GET",
|
||||
needAuth: true,
|
||||
})
|
||||
const app = getApp<IAppOption>()
|
||||
app.globalData.authUser = {
|
||||
userId: data.user_id,
|
||||
status: data.status,
|
||||
nickname: data.nickname,
|
||||
}
|
||||
wx.setStorageSync("userId", data.user_id)
|
||||
wx.setStorageSync("userStatus", data.status)
|
||||
|
||||
switch (data.status) {
|
||||
case "disabled":
|
||||
case "rejected":
|
||||
break // 留在当前页
|
||||
case "approved":
|
||||
wx.reLaunch({ url: "/pages/mvp/mvp" })
|
||||
break
|
||||
case "pending":
|
||||
wx.reLaunch({ url: "/pages/reviewing/reviewing" })
|
||||
break
|
||||
case "new":
|
||||
wx.reLaunch({ url: "/pages/apply/apply" })
|
||||
break
|
||||
}
|
||||
} catch {
|
||||
// 网络错误不阻塞
|
||||
}
|
||||
},
|
||||
|
||||
/** 更换登录账号:清除凭证后跳转登录页 */
|
||||
onSwitchAccount() {
|
||||
const app = getApp<IAppOption>()
|
||||
app.globalData.token = undefined
|
||||
app.globalData.refreshToken = undefined
|
||||
app.globalData.authUser = undefined
|
||||
wx.removeStorageSync("token")
|
||||
wx.removeStorageSync("refreshToken")
|
||||
wx.removeStorageSync("userId")
|
||||
wx.removeStorageSync("userStatus")
|
||||
wx.reLaunch({ url: "/pages/login/login" })
|
||||
},
|
||||
})
|
||||
@@ -0,0 +1,67 @@
|
||||
<!-- pages/no-permission/no-permission.wxml — 按 H5 原型结构迁移 -->
|
||||
<view class="page" style="padding-top: {{statusBarHeight}}px;">
|
||||
<!-- 十字纹背景图案(H5 bg-pattern,error 色) -->
|
||||
<view class="bg-pattern"></view>
|
||||
<!-- 顶部渐变装饰(红色主题) -->
|
||||
<view class="top-gradient"></view>
|
||||
|
||||
<!-- 主体内容 -->
|
||||
<view class="content">
|
||||
<!-- 图标区域 -->
|
||||
<view class="icon-area">
|
||||
<!-- 背景光晕 -->
|
||||
<view class="icon-glow"></view>
|
||||
<!-- 主图标 -->
|
||||
<view class="icon-box">
|
||||
<image class="icon-main-img" src="/assets/icons/icon-forbidden.svg" mode="aspectFit" />
|
||||
</view>
|
||||
<!-- 装饰点 -->
|
||||
<view class="icon-dot dot-1"></view>
|
||||
<view class="icon-dot dot-2"></view>
|
||||
</view>
|
||||
|
||||
<!-- 标题区域 -->
|
||||
<view class="title-area">
|
||||
<text class="main-title">无访问权限</text>
|
||||
<text class="sub-title">很抱歉,您的访问申请未通过审核,或当前账号无访问权限</text>
|
||||
</view>
|
||||
|
||||
<!-- 原因说明卡片 -->
|
||||
<view class="reason-card">
|
||||
<view class="reason-header">
|
||||
<view class="reason-icon-box">
|
||||
<t-icon name="error-circle-filled" size="35rpx" color="#e34d59" />
|
||||
</view>
|
||||
<view class="reason-header-text">
|
||||
<text class="reason-title">可能的原因</text>
|
||||
<view class="reason-list">
|
||||
<text class="reason-item">• 申请信息不完整或不符合要求</text>
|
||||
<text class="reason-item">• 非本店授权员工账号</text>
|
||||
<text class="reason-item">• 账号权限已被管理员收回</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 联系管理员 -->
|
||||
<view class="reason-footer">
|
||||
<text class="reason-footer-label">请联系管理员</text>
|
||||
<text class="reason-footer-value">厉超</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 帮助提示 -->
|
||||
<view class="contact-hint">
|
||||
<t-icon name="help-circle-filled" size="28rpx" color="#a6a6a6" />
|
||||
<text class="contact-text">如有疑问,请联系管理员重新申请</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 底部按钮 -->
|
||||
<view class="bottom-area">
|
||||
<view class="switch-btn" bindtap="onSwitchAccount">
|
||||
<t-icon name="logout" size="28rpx" color="#5e5e5e" />
|
||||
<text class="switch-btn-text">更换登录账号</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<dev-fab />
|
||||
@@ -0,0 +1,241 @@
|
||||
/* pages/no-permission/no-permission.wxss — 原 H5 值 × 0.875 统一缩放 */
|
||||
|
||||
.page {
|
||||
height: 100vh;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: #f8fafc;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.bg-pattern {
|
||||
position: absolute;
|
||||
top: 0; left: 0; right: 0; bottom: 0;
|
||||
background-image:
|
||||
repeating-linear-gradient(0deg, transparent, transparent 58rpx, rgba(227,77,89,0.03) 58rpx, rgba(227,77,89,0.03) 62rpx, transparent 62rpx, transparent 120rpx),
|
||||
repeating-linear-gradient(90deg, transparent, transparent 58rpx, rgba(227,77,89,0.03) 58rpx, rgba(227,77,89,0.03) 62rpx, transparent 62rpx, transparent 120rpx);
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
/* 512 × 0.875 = 448 */
|
||||
.top-gradient {
|
||||
position: absolute;
|
||||
top: 0; left: 0; right: 0;
|
||||
height: 448rpx;
|
||||
background: linear-gradient(to bottom, rgba(227,77,89,0.10), transparent);
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
/* padding 64 × 0.875 = 56 */
|
||||
.content {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0 56rpx;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* mb 64 × 0.875 = 56 */
|
||||
.icon-area {
|
||||
position: relative;
|
||||
margin-bottom: 56rpx;
|
||||
}
|
||||
|
||||
/* 320 × 0.875 = 280, offset -48 × 0.875 = -42 */
|
||||
.icon-glow {
|
||||
position: absolute;
|
||||
width: 280rpx;
|
||||
height: 280rpx;
|
||||
border-radius: 50%;
|
||||
top: -42rpx;
|
||||
left: -42rpx;
|
||||
background: radial-gradient(circle, rgba(227,77,89,0.18) 0%, rgba(227,77,89,0.06) 50%, transparent 75%);
|
||||
}
|
||||
|
||||
/* 224 × 0.875 = 196, radius 48 × 0.875 = 42 */
|
||||
.icon-box {
|
||||
position: relative;
|
||||
width: 196rpx;
|
||||
height: 196rpx;
|
||||
border-radius: 42rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: linear-gradient(135deg, #fb7185, #ef4444);
|
||||
box-shadow: 0 14rpx 42rpx rgba(227,77,89,0.3);
|
||||
}
|
||||
|
||||
/* 112 × 0.875 = 98 */
|
||||
.icon-main-img {
|
||||
width: 98rpx;
|
||||
height: 98rpx;
|
||||
}
|
||||
|
||||
.icon-dot { position: absolute; border-radius: 50%; }
|
||||
|
||||
/* 32 × 0.875 = 28, offset -16 × 0.875 = -14 */
|
||||
.dot-1 {
|
||||
width: 28rpx; height: 28rpx;
|
||||
top: -14rpx; right: -14rpx;
|
||||
background: #e34d59; opacity: 0.6;
|
||||
}
|
||||
|
||||
/* 24 × 0.875 = 21 → 22, offset -8 × 0.875 = -7 → -8, -24 × 0.875 = -21 → -22 */
|
||||
.dot-2 {
|
||||
width: 22rpx; height: 22rpx;
|
||||
bottom: -8rpx; left: -22rpx;
|
||||
background: #fda4af; opacity: 0.6;
|
||||
}
|
||||
|
||||
/* mb 64 × 0.875 = 56 */
|
||||
.title-area {
|
||||
text-align: center;
|
||||
margin-bottom: 56rpx;
|
||||
}
|
||||
|
||||
/* 48 × 0.875 = 42, mb 24 × 0.875 = 21 → 22 */
|
||||
.main-title {
|
||||
display: block;
|
||||
font-size: 42rpx;
|
||||
font-weight: 700;
|
||||
color: #4b4b4b;
|
||||
margin-bottom: 22rpx;
|
||||
}
|
||||
|
||||
/* 28 × 0.875 = 24.5 → 24, max-w 640 × 0.875 = 560 */
|
||||
.sub-title {
|
||||
display: block;
|
||||
font-size: 24rpx;
|
||||
color: #8b8b8b;
|
||||
line-height: 1.625;
|
||||
max-width: 490rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
/* max-w 550 × 0.875 ≈ 482, radius 32 × 0.875 = 28, padding 40 × 0.875 = 35 → 36, mb 48 × 0.875 = 42 */
|
||||
.reason-card {
|
||||
width: 100%;
|
||||
max-width: 482rpx;
|
||||
background: #ffffff;
|
||||
border-radius: 28rpx;
|
||||
padding: 36rpx;
|
||||
margin-bottom: 42rpx;
|
||||
box-shadow: 0 8rpx 32rpx rgba(0,0,0,0.06);
|
||||
}
|
||||
|
||||
/* gap/mb 32 × 0.875 = 28 */
|
||||
.reason-header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: flex-start;
|
||||
gap: 28rpx;
|
||||
margin-bottom: 28rpx;
|
||||
}
|
||||
|
||||
/* 80 × 0.875 = 70, radius 24 × 0.875 = 21 → 22 */
|
||||
.reason-icon-box {
|
||||
width: 70rpx;
|
||||
height: 70rpx;
|
||||
min-width: 70rpx;
|
||||
background: rgba(227,77,89,0.1);
|
||||
border-radius: 22rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.reason-header-text {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
/* 28 × 0.875 = 24, mb 8 × 0.875 = 7 → 8 */
|
||||
.reason-title {
|
||||
font-size: 24rpx;
|
||||
font-weight: 500;
|
||||
color: #242424;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
/* gap 8 × 0.875 = 7 → 8 */
|
||||
.reason-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8rpx;
|
||||
}
|
||||
|
||||
/* 24 × 0.875 = 21 → 22 */
|
||||
.reason-item {
|
||||
font-size: 22rpx;
|
||||
color: #a6a6a6;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
/* mt/pt 32 × 0.875 = 28 */
|
||||
.reason-footer {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-top: 28rpx;
|
||||
padding-top: 28rpx;
|
||||
border-top: 2rpx solid #f3f3f3;
|
||||
}
|
||||
|
||||
.reason-footer-label {
|
||||
font-size: 22rpx;
|
||||
color: #a6a6a6;
|
||||
}
|
||||
|
||||
.reason-footer-value {
|
||||
font-size: 24rpx;
|
||||
color: #242424;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* gap 16 × 0.875 = 14, mb 64 × 0.875 = 56 */
|
||||
.contact-hint {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 14rpx;
|
||||
margin-bottom: 56rpx;
|
||||
}
|
||||
|
||||
.contact-text {
|
||||
font-size: 22rpx;
|
||||
color: #a6a6a6;
|
||||
}
|
||||
|
||||
/* px 64 × 0.875 = 56, pb 96 × 0.875 = 84 */
|
||||
.bottom-area {
|
||||
padding: 0 56rpx 84rpx;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
/* padding 28 × 0.875 = 24.5 → 24, gap 16 × 0.875 = 14, radius 24 × 0.875 = 21 → 22 */
|
||||
.switch-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 14rpx;
|
||||
width: 100%;
|
||||
padding: 24rpx 0;
|
||||
background: #ffffff;
|
||||
border: 2rpx solid #eeeeee;
|
||||
border-radius: 22rpx;
|
||||
box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.03);
|
||||
}
|
||||
|
||||
.switch-btn-text {
|
||||
font-size: 24rpx;
|
||||
font-weight: 500;
|
||||
color: #5e5e5e;
|
||||
}
|
||||
Reference in New Issue
Block a user