优化小程序登录工作空间与法律协议
This commit is contained in:
hero920103 committed
1 parent
2e2b837a20
commit
1eace4c082
6 files changed
+1084
-673
No files matched your search
+5
-1
@@ -35,10 +35,14 @@ export function loginUAC(data) {
|
||||
|
||||
/** 统一认证：选择/切换企业（一人多企业） */
|
||||
export function switchTenant(data) {
|
||||
let clientId = 'yz-uniapp'
|
||||
// #ifdef MP-WEIXIN
|
||||
clientId = 'yz-miniapp'
|
||||
// #endif
|
||||
return request({
|
||||
url: '/auth/switch-tenant',
|
||||
method: 'POST',
|
||||
data: Object.assign({ client_id: 'yz-uniapp' }, data)
|
||||
data: Object.assign({ client_id: clientId }, data)
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,10 @@
|
||||
import { request } from '@/api/request.js'
|
||||
|
||||
/** 读取平台端维护的法律单页内容。路径不包含前导斜杠。 */
|
||||
export function fetchLegalDocument(path) {
|
||||
return request({
|
||||
url: `/platform/website/page/path/${encodeURIComponent(path)}`,
|
||||
method: 'GET',
|
||||
silent: true
|
||||
})
|
||||
}
|
||||
+611
-566
File diff suppressed because it is too large.
Load diff
@@ -0,0 +1,102 @@
|
||||
<template>
|
||||
<view class="page">
|
||||
<view v-if="loading" class="state"><text>正在加载内容…</text></view>
|
||||
<view v-else-if="error" class="state error" @tap="load"><text>{{ error }}，点此重试</text></view>
|
||||
<view v-else-if="!document" class="state"><text>暂未发布此内容，请联系管理员</text></view>
|
||||
<scroll-view v-else class="content-scroll" scroll-y>
|
||||
<view class="article">
|
||||
<text class="title">{{ document.title || pageTitle }}</text>
|
||||
<rich-text class="rich-content" :nodes="document.content || ''" />
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import { fetchLegalDocument } from '@/api/legal.js'
|
||||
|
||||
const pageTitle = ref('法律条款')
|
||||
const path = ref('')
|
||||
const loading = ref(true)
|
||||
const error = ref('')
|
||||
const document = ref(null)
|
||||
|
||||
onLoad((options = {}) => {
|
||||
path.value = String(options.path || '')
|
||||
pageTitle.value = String(options.title || '法律条款')
|
||||
uni.setNavigationBarTitle({ title: pageTitle.value })
|
||||
load()
|
||||
})
|
||||
|
||||
async function load() {
|
||||
if (!path.value) {
|
||||
loading.value = false
|
||||
error.value = '内容地址无效'
|
||||
return
|
||||
}
|
||||
loading.value = true
|
||||
error.value = ''
|
||||
try {
|
||||
const result = await fetchLegalDocument(path.value)
|
||||
const data = result && (result.data || result)
|
||||
document.value = data && data.id ? data : null
|
||||
} catch (err) {
|
||||
error.value = (err && err.message) || '内容加载失败'
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import '@/src/styles/page-common.scss';
|
||||
|
||||
.page {
|
||||
min-height: 100vh;
|
||||
background: #f4f8fc;
|
||||
}
|
||||
|
||||
.content-scroll {
|
||||
height: 100vh;
|
||||
box-sizing: border-box;
|
||||
padding: 24rpx;
|
||||
}
|
||||
|
||||
.article {
|
||||
padding: 36rpx 30rpx 52rpx;
|
||||
border-radius: 24rpx;
|
||||
background: #fff;
|
||||
box-shadow: 0 8rpx 32rpx rgba(47, 91, 130, 0.06);
|
||||
}
|
||||
|
||||
.title {
|
||||
display: block;
|
||||
margin-bottom: 28rpx;
|
||||
font-size: 36rpx;
|
||||
font-weight: 700;
|
||||
line-height: 1.5;
|
||||
color: #203c57;
|
||||
}
|
||||
|
||||
.rich-content {
|
||||
font-size: 28rpx;
|
||||
line-height: 1.9;
|
||||
color: #43586c;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.state {
|
||||
min-height: 70vh;
|
||||
padding: 48rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
font-size: 26rpx;
|
||||
color: #8094a8;
|
||||
}
|
||||
|
||||
.error { color: #d94841; }
|
||||
</style>
|
||||
+133
-93
@@ -6,7 +6,7 @@
|
||||
<FaIcon name="shield-halved" color="#ffffff" :size="20" />
|
||||
</view>
|
||||
<text class="brand-name">云泽统一认证</text>
|
||||
<text class="brand-desc">一次登录，全平台通行</text>
|
||||
<text class="brand-desc">欢迎回来，开启云泽服务</text>
|
||||
</view>
|
||||
|
||||
<view class="card">
|
||||
@@ -48,8 +48,8 @@
|
||||
<!-- ============ 登录（小程序端微信/账号密码 Tab 切换；H5/APK 仅账号密码） ============ -->
|
||||
<block v-else>
|
||||
<view class="panel-head">
|
||||
<text class="panel-title">欢迎登录</text>
|
||||
<text class="panel-sub">{{ panelSub }}</text>
|
||||
<text class="panel-title">{{ showMiniLogin && activeTab === 'account' ? '账号登录' : '欢迎登录' }}</text>
|
||||
<text v-if="!(showMiniLogin && activeTab === 'account')" class="panel-sub">{{ panelSub }}</text>
|
||||
</view>
|
||||
|
||||
<view v-if="errorMsg" class="error-box">
|
||||
@@ -57,25 +57,7 @@
|
||||
</view>
|
||||
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<!-- 微信端且服务端已开通：微信登录 / 账号密码登录 Tab 切换 -->
|
||||
<view v-if="showMiniLogin" class="login-tabs">
|
||||
<view
|
||||
class="login-tab"
|
||||
:class="{ on: activeTab === 'wechat' }"
|
||||
@tap="switchTab('wechat')"
|
||||
>
|
||||
<text class="login-tab-text">微信登录</text>
|
||||
<view class="login-tab-bar" />
|
||||
</view>
|
||||
<view
|
||||
class="login-tab"
|
||||
:class="{ on: activeTab === 'account' }"
|
||||
@tap="switchTab('account')"
|
||||
>
|
||||
<text class="login-tab-text">账号密码登录</text>
|
||||
<view class="login-tab-bar" />
|
||||
</view>
|
||||
</view>
|
||||
<!-- 微信端默认突出一键登录，账号密码作为次要备用入口 -->
|
||||
|
||||
<!-- 微信登录面板 -->
|
||||
<block v-if="showMiniLogin && activeTab === 'wechat'">
|
||||
@@ -86,19 +68,22 @@
|
||||
@getphonenumber="onGetPhoneNumber"
|
||||
>
|
||||
<FaIcon name="weixin" type="brands" color="#ffffff" :size="18" />
|
||||
<text>微信手机号一键登录</text>
|
||||
<text>{{ submitting ? '登录中...' : '微信一键登录' }}</text>
|
||||
</button>
|
||||
<view class="tip-row">
|
||||
<text class="tip-text">首次使用请先用账号密码登录一次，自动完成微信绑定后即可一键登录</text>
|
||||
<text class="tip-text">微信安全授权，快捷登录云泽统一认证</text>
|
||||
</view>
|
||||
<view class="back-row" @tap="switchTab('account')">
|
||||
<text class="link">使用账号密码登录</text>
|
||||
<view class="account-entry" @tap="switchTab('account')">
|
||||
<text class="account-entry-text">账号登录</text>
|
||||
</view>
|
||||
</block>
|
||||
<!-- #endif -->
|
||||
|
||||
<!-- 账号密码面板（未开通微信登录的端始终展示） -->
|
||||
<block v-if="!(showMiniLogin && activeTab === 'wechat')">
|
||||
<view v-if="showMiniLogin" class="account-mode-label" @tap="switchTab('wechat')">
|
||||
<text class="account-mode-back">‹ 微信一键登录</text>
|
||||
</view>
|
||||
<view class="field">
|
||||
<text class="field-label">账号</text>
|
||||
<view class="input-wrap">
|
||||
@@ -167,16 +152,12 @@
|
||||
<view class="agree-dot" :class="{ on: agreed }" />
|
||||
<text class="agree-text">
|
||||
登录即表示同意
|
||||
<text class="agree-link" @tap.stop="showAgreement">《用户协议》</text>
|
||||
<text class="agree-link" @tap.stop="openLegal('user-agreement', '用户协议')">《用户协议》</text>
|
||||
和
|
||||
<text class="agree-link" @tap.stop="showAgreement">《隐私政策》</text>
|
||||
<text class="agree-link" @tap.stop="openLegal('privacy-policy', '隐私政策')">《隐私政策》</text>
|
||||
</text>
|
||||
</view>
|
||||
|
||||
<view class="foot-tip">
|
||||
<FaIcon name="lock" color="#a3acbf" :size="11" />
|
||||
<text class="foot-tip-text">统一身份认证 · 一次登录，全平台通行</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@@ -229,7 +210,10 @@ const showMiniLogin = ref(false)
|
||||
/** 面板副标题：随 Tab 切换提示文案 */
|
||||
const panelSub = computed(() => {
|
||||
if (platform.value === 'mp-weixin' && showMiniLogin.value && activeTab.value === 'wechat') {
|
||||
return '使用微信一键登录，或切换到账号密码登录'
|
||||
return '微信授权，安全快捷地登录'
|
||||
}
|
||||
if (platform.value === 'mp-weixin' && showMiniLogin.value && activeTab.value === 'account') {
|
||||
return '使用已注册的账号继续'
|
||||
}
|
||||
return '请输入您的账号与密码以继续'
|
||||
})
|
||||
@@ -490,11 +474,8 @@ async function onGetPhoneNumber(e) {
|
||||
uni.showToast({ title: '你已取消手机号授权', icon: 'none' })
|
||||
return
|
||||
}
|
||||
// 认证中 / 未开通手机号能力：拿不到动态 code 时降级为「按已绑定 openid 登录」
|
||||
// 手机号授权码可能不可用；仍继续尝试按已绑定的 openid 登录
|
||||
const phoneCode = detail.code && errMsg.indexOf('fail') === -1 ? detail.code : ''
|
||||
if (!phoneCode) {
|
||||
uni.showToast({ title: '手机号能力暂不可用，按已绑定账号登录', icon: 'none' })
|
||||
}
|
||||
if (!agreed.value) {
|
||||
const ok = await confirmAgreement()
|
||||
if (!ok) {
|
||||
@@ -521,12 +502,11 @@ function handleMiniError(err) {
|
||||
const reason = err && err.response && err.response.reason
|
||||
if (reason === 'identity_not_found') {
|
||||
uni.showModal({
|
||||
title: '尚未绑定云泽账号',
|
||||
content: '当前微信未绑定云泽账号，且手机号能力暂不可用。请先用账号密码登录一次（会自动完成微信绑定），之后即可一键登录。',
|
||||
title: '暂无使用权限',
|
||||
content: '您没有该程序使用权，请联系企业管理员。也可以使用已有账号登录。',
|
||||
showCancel: true,
|
||||
cancelText: '知道了',
|
||||
// 微信小程序 showModal 的 confirmText 上限为 4 个汉字，超限会导致 API 失败、弹窗不显示
|
||||
confirmText: '去登录',
|
||||
confirmText: '账号登录',
|
||||
confirmColor: '#2563eb',
|
||||
success: (res) => {
|
||||
if (res.confirm) switchTab('account')
|
||||
@@ -571,9 +551,8 @@ function toggleAgree() {
|
||||
if (agreed.value) showAgreementTip.value = false
|
||||
}
|
||||
|
||||
/** 协议占位：正式接入条款页后改为跳转条款页 */
|
||||
function showAgreement() {
|
||||
uni.showToast({ title: '条款内容待接入', icon: 'none' })
|
||||
function openLegal(path, title) {
|
||||
uni.navigateTo({ url: `/pages/legal/document?path=${encodeURIComponent(path)}&title=${encodeURIComponent(title)}` })
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -627,52 +606,88 @@ function goForget() {
|
||||
@import '@/src/styles/page-common.scss';
|
||||
|
||||
.login-page {
|
||||
position: relative;
|
||||
min-height: 100vh;
|
||||
background: linear-gradient(160deg, #1e3a8a 0%, #2563eb 100%);
|
||||
padding: 0 32rpx calc(env(safe-area-inset-bottom, 0px) + 40rpx);
|
||||
background: linear-gradient(145deg, #eaf6ff 0%, #f7fbff 48%, #dceeff 100%);
|
||||
padding: calc(env(safe-area-inset-top, 0px) + 24rpx) 32rpx calc(env(safe-area-inset-bottom, 0px) + 40rpx);
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.login-page::before,
|
||||
.login-page::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
border-radius: 50%;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.login-page::before {
|
||||
width: 460rpx;
|
||||
height: 460rpx;
|
||||
top: -150rpx;
|
||||
right: -130rpx;
|
||||
background: rgba(111, 192, 255, 0.28);
|
||||
}
|
||||
|
||||
.login-page::after {
|
||||
width: 360rpx;
|
||||
height: 360rpx;
|
||||
bottom: 100rpx;
|
||||
left: -180rpx;
|
||||
background: rgba(151, 218, 255, 0.2);
|
||||
}
|
||||
|
||||
/* ---------- 品牌区 ---------- */
|
||||
.brand {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding-top: calc(env(safe-area-inset-top, 0px) + 96rpx);
|
||||
padding-bottom: 56rpx;
|
||||
padding-top: calc(env(safe-area-inset-top, 0px) + 56rpx);
|
||||
padding-bottom: 48rpx;
|
||||
}
|
||||
|
||||
.brand-logo {
|
||||
width: 88rpx;
|
||||
height: 88rpx;
|
||||
border-radius: 24rpx;
|
||||
background: rgba(255, 255, 255, 0.18);
|
||||
border: 1rpx solid rgba(255, 255, 255, 0.3);
|
||||
width: 92rpx;
|
||||
height: 92rpx;
|
||||
border-radius: 30rpx;
|
||||
background: linear-gradient(145deg, #79c8ff, #398fe7);
|
||||
border: 1rpx solid rgba(255, 255, 255, 0.88);
|
||||
box-shadow: 0 16rpx 36rpx rgba(57, 143, 231, 0.28), inset 0 1rpx 0 rgba(255, 255, 255, 0.48);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.brand-name {
|
||||
margin-top: 20rpx;
|
||||
font-size: 34rpx;
|
||||
font-weight: 600;
|
||||
letter-spacing: 1rpx;
|
||||
color: #ffffff;
|
||||
margin-top: 22rpx;
|
||||
font-size: 36rpx;
|
||||
font-weight: 700;
|
||||
letter-spacing: 2rpx;
|
||||
color: #173b67;
|
||||
}
|
||||
|
||||
.brand-desc {
|
||||
margin-top: 8rpx;
|
||||
margin-top: 10rpx;
|
||||
font-size: 24rpx;
|
||||
color: rgba(255, 255, 255, 0.76);
|
||||
letter-spacing: 1rpx;
|
||||
color: #7190af;
|
||||
}
|
||||
|
||||
/* ---------- 表单卡片 ---------- */
|
||||
.card {
|
||||
background: $color-card;
|
||||
border-radius: 24rpx;
|
||||
padding: 44rpx 36rpx 36rpx;
|
||||
box-shadow: 0 18rpx 50rpx rgba(37, 96, 169, 0.14);
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
background: rgba(255, 255, 255, 0.72);
|
||||
border: 1rpx solid rgba(255, 255, 255, 0.92);
|
||||
border-radius: 34rpx;
|
||||
padding: 48rpx 36rpx 40rpx;
|
||||
box-shadow: 0 24rpx 70rpx rgba(74, 132, 184, 0.16), inset 0 1rpx 0 rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
|
||||
.panel-head {
|
||||
@@ -681,9 +696,10 @@ function goForget() {
|
||||
|
||||
.panel-title {
|
||||
display: block;
|
||||
font-size: 40rpx;
|
||||
font-weight: 600;
|
||||
color: $color-text;
|
||||
font-size: 42rpx;
|
||||
font-weight: 700;
|
||||
letter-spacing: 1rpx;
|
||||
color: #183b63;
|
||||
}
|
||||
|
||||
.panel-sub {
|
||||
@@ -723,10 +739,11 @@ function goForget() {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: #fbfcff;
|
||||
border: 1rpx solid $color-border;
|
||||
border-radius: $radius-md;
|
||||
background: rgba(248, 252, 255, 0.82);
|
||||
border: 1rpx solid #d8e9f7;
|
||||
border-radius: 18rpx;
|
||||
padding: 0 20rpx;
|
||||
box-shadow: inset 0 2rpx 8rpx rgba(104, 158, 202, 0.05);
|
||||
}
|
||||
|
||||
.field-input {
|
||||
@@ -817,11 +834,12 @@ function goForget() {
|
||||
}
|
||||
|
||||
.btn-wechat {
|
||||
margin-top: 0;
|
||||
height: 88rpx;
|
||||
border-radius: $radius-md;
|
||||
background: #07c160;
|
||||
margin-top: 8rpx;
|
||||
height: 96rpx;
|
||||
border-radius: 20rpx;
|
||||
background: linear-gradient(110deg, #18b96b 0%, #09a95e 100%);
|
||||
color: #ffffff;
|
||||
box-shadow: 0 14rpx 28rpx rgba(7, 193, 96, 0.2);
|
||||
font-size: 28rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -839,6 +857,37 @@ function goForget() {
|
||||
}
|
||||
}
|
||||
|
||||
/* 小程序备用登录入口，弱化账号密码路径 */
|
||||
.account-entry {
|
||||
margin: 36rpx auto 0;
|
||||
padding: 8rpx 20rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.account-entry-text {
|
||||
font-size: 24rpx;
|
||||
color: #7995ad;
|
||||
}
|
||||
|
||||
.account-entry-text {
|
||||
padding-bottom: 4rpx;
|
||||
border-bottom: 1rpx solid #c9dceb;
|
||||
}
|
||||
|
||||
.account-mode-label {
|
||||
margin: -14rpx 0 22rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.account-mode-back {
|
||||
font-size: 24rpx;
|
||||
color: #5688b7;
|
||||
padding: 8rpx 0;
|
||||
}
|
||||
|
||||
/* 登录方式 Tab：微信登录 / 账号密码登录 */
|
||||
.login-tabs {
|
||||
display: flex;
|
||||
@@ -967,12 +1016,14 @@ function goForget() {
|
||||
color: $color-text-muted;
|
||||
}
|
||||
|
||||
/* ---------- 协议与页脚 ---------- */
|
||||
/* ---------- 协议 ---------- */
|
||||
.agreement {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 12rpx;
|
||||
margin-top: 32rpx;
|
||||
margin-top: 30rpx;
|
||||
padding: 0 8rpx;
|
||||
}
|
||||
|
||||
@@ -982,8 +1033,8 @@ function goForget() {
|
||||
width: 34rpx;
|
||||
height: 34rpx;
|
||||
border-radius: 8rpx;
|
||||
border: 2rpx solid rgba(255, 255, 255, 0.75);
|
||||
background: rgba(255, 255, 255, 0.14);
|
||||
border: 2rpx solid #bad3e8;
|
||||
background: rgba(255, 255, 255, 0.76);
|
||||
flex-shrink: 0;
|
||||
margin-top: 2rpx;
|
||||
|
||||
@@ -1010,12 +1061,13 @@ function goForget() {
|
||||
.agree-text {
|
||||
flex: 1;
|
||||
font-size: 22rpx;
|
||||
color: rgba(255, 255, 255, 0.78);
|
||||
color: #6e8da8;
|
||||
line-height: 1.7;
|
||||
}
|
||||
|
||||
.agree-link {
|
||||
color: #ffffff;
|
||||
color: #347fbd;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* 未勾选协议时的行内提示 */
|
||||
@@ -1031,20 +1083,8 @@ function goForget() {
|
||||
|
||||
.agree-tip-text {
|
||||
font-size: 22rpx;
|
||||
color: #ffd591;
|
||||
color: #ad6400;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.foot-tip {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 8rpx;
|
||||
margin-top: 40rpx;
|
||||
}
|
||||
|
||||
.foot-tip-text {
|
||||
font-size: 22rpx;
|
||||
color: rgba(255, 255, 255, 0.62);
|
||||
}
|
||||
</style>
|
||||
+223
-13
@@ -3,10 +3,35 @@
|
||||
<!-- 顶部信息：融入页面背景，不再单独做彩色抬头 -->
|
||||
<view class="head" :style="headPad">
|
||||
<view class="head-row">
|
||||
<text class="head-title">选择子系统</text>
|
||||
<text class="head-count">{{ enabledCount }}/{{ cards.length }} 已开通</text>
|
||||
<view>
|
||||
<text class="head-title">工作空间</text>
|
||||
<text class="head-caption">选择一个应用，开始今天的工作</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="tenant-switcher" :class="{ selectable: tenants.length > 1 }" @tap="openTenantPicker">
|
||||
<view class="tenant-mark"><FaIcon name="building" color="#3689d6" :size="17" /></view>
|
||||
<view class="tenant-current">
|
||||
<text class="tenant-label">当前公司</text>
|
||||
<text class="head-sub">{{ user.tenant || '云泽平台' }}</text>
|
||||
</view>
|
||||
<text v-if="user.account" class="tenant-account">{{ user.account }}</text>
|
||||
<FaIcon v-if="tenants.length > 1" name="chevron-right" color="#83a2be" :size="13" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="tenantPickerVisible" class="tenant-mask" @tap="closeTenantPicker">
|
||||
<view class="tenant-sheet" @tap.stop>
|
||||
<view class="sheet-head">
|
||||
<text class="sheet-title">切换公司</text>
|
||||
<text class="sheet-close" @tap="closeTenantPicker">完成</text>
|
||||
</view>
|
||||
<text class="sheet-sub">选择后将切换当前工作空间</text>
|
||||
<view v-for="item in tenants" :key="item.tid" class="tenant-option" :class="{ current: Number(item.tid) === currentTid, disabled: switchingTenant }" @tap="changeTenant(item)">
|
||||
<view class="tenant-option-icon"><FaIcon name="building" color="#398fe7" :size="16" /></view>
|
||||
<view class="tenant-option-info"><text class="tenant-option-name">{{ item.tenant_name || `企业${item.tid}` }}</text><text class="tenant-option-meta">{{ Number(item.tid) === currentTid ? '当前工作空间' : '切换到此公司' }}</text></view>
|
||||
<FaIcon v-if="Number(item.tid) === currentTid" name="circle-check" color="#398fe7" :size="18" />
|
||||
</view>
|
||||
</view>
|
||||
<text class="head-sub">{{ user.tenant || '云泽平台' }}<text v-if="user.account"> · {{ user.account }}</text></text>
|
||||
</view>
|
||||
|
||||
<view class="body">
|
||||
@@ -53,7 +78,8 @@ import { mpHeadPad } from '@/utils/mpHead.js'
|
||||
|
||||
const headPad = mpHeadPad()
|
||||
import { onShow } from '@dcloudio/uni-app'
|
||||
import { isLoggedIn } from '@/utils/auth.js'
|
||||
import { isLoggedIn, getTenants, getTid, setAuthTokens, setTid, setTenantName } from '@/utils/auth.js'
|
||||
import { switchTenant } from '@/api/auth.js'
|
||||
import { fetchHome } from '@/api/workspace.js'
|
||||
import { openMenu } from '@/utils/nav.js'
|
||||
import { getSubsystemByModule, goSubsystem } from '@/config/subsystems.js'
|
||||
@@ -80,6 +106,10 @@ const loadError = ref('')
|
||||
const user = ref({})
|
||||
const modules = ref([])
|
||||
const menus = ref([])
|
||||
const tenants = ref([])
|
||||
const currentTid = ref(0)
|
||||
const tenantPickerVisible = ref(false)
|
||||
const switchingTenant = ref(false)
|
||||
|
||||
/** 叶子菜单（可直接跳转的功能页），已锁定的过滤掉 */
|
||||
const leafMenus = computed(() => menus.value.filter((m) => m.leaf !== false && !m.locked))
|
||||
@@ -125,6 +155,8 @@ async function load(force = false) {
|
||||
try {
|
||||
const data = await fetchHome(force)
|
||||
user.value = data.user || {}
|
||||
tenants.value = getTenants()
|
||||
currentTid.value = getTid()
|
||||
modules.value = Array.isArray(data.modules) ? data.modules : []
|
||||
menus.value = Array.isArray(data.menus) ? data.menus : []
|
||||
loadError.value = ''
|
||||
@@ -159,6 +191,43 @@ function enter(card) {
|
||||
uni.showToast({ title: card.name + '暂未开放', icon: 'none' })
|
||||
}
|
||||
|
||||
function openTenantPicker() {
|
||||
if (tenants.value.length < 2) return
|
||||
tenantPickerVisible.value = true
|
||||
}
|
||||
|
||||
function closeTenantPicker() {
|
||||
if (!switchingTenant.value) tenantPickerVisible.value = false
|
||||
}
|
||||
|
||||
async function changeTenant(item) {
|
||||
const tid = Number(item && item.tid)
|
||||
if (!tid || tid === currentTid.value || switchingTenant.value) {
|
||||
tenantPickerVisible.value = false
|
||||
return
|
||||
}
|
||||
switchingTenant.value = true
|
||||
uni.showLoading({ title: '正在切换...', mask: true })
|
||||
try {
|
||||
const result = await switchTenant({ tid })
|
||||
if (!result || !result.tokens) throw new Error((result && result.msg) || '切换公司失败')
|
||||
setAuthTokens(result.tokens)
|
||||
setTid(tid)
|
||||
const tenantName = item.tenant_name || `企业${tid}`
|
||||
setTenantName(tenantName)
|
||||
user.value = Object.assign({}, user.value, { tenant: tenantName, tid })
|
||||
currentTid.value = tid
|
||||
tenantPickerVisible.value = false
|
||||
await load(true)
|
||||
uni.showToast({ title: '已切换公司', icon: 'success' })
|
||||
} catch (err) {
|
||||
uni.showToast({ title: (err && err.message) || '切换公司失败', icon: 'none' })
|
||||
} finally {
|
||||
uni.hideLoading()
|
||||
switchingTenant.value = false
|
||||
}
|
||||
}
|
||||
|
||||
/* ==================== 生命周期 ==================== */
|
||||
|
||||
onMounted(() => {
|
||||
@@ -200,23 +269,70 @@ onShow(() => {
|
||||
}
|
||||
|
||||
.head-title {
|
||||
font-size: 42rpx;
|
||||
font-weight: 600;
|
||||
color: $color-text;
|
||||
font-size: 46rpx;
|
||||
font-weight: 700;
|
||||
color: #193d61;
|
||||
letter-spacing: 1rpx;
|
||||
}
|
||||
|
||||
.head-count {
|
||||
font-size: 23rpx;
|
||||
color: $color-text-muted;
|
||||
.head-caption {
|
||||
display: block;
|
||||
margin-top: 10rpx;
|
||||
font-size: 24rpx;
|
||||
color: #8aa2b8;
|
||||
}
|
||||
|
||||
.tenant-switcher {
|
||||
margin-top: 28rpx;
|
||||
padding: 20rpx 22rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16rpx;
|
||||
border: 1rpx solid rgba(255, 255, 255, 0.92);
|
||||
border-radius: 24rpx;
|
||||
background: rgba(255, 255, 255, 0.78);
|
||||
box-shadow: 0 12rpx 32rpx rgba(81, 133, 176, 0.08);
|
||||
|
||||
&.selectable:active { background: #f4faff; }
|
||||
}
|
||||
|
||||
.tenant-mark {
|
||||
width: 68rpx;
|
||||
height: 68rpx;
|
||||
flex-shrink: 0;
|
||||
border-radius: 20rpx;
|
||||
background: #eaf5ff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.tenant-current {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.tenant-label {
|
||||
display: block;
|
||||
margin-bottom: 5rpx;
|
||||
font-size: 20rpx;
|
||||
color: #94aabe;
|
||||
}
|
||||
|
||||
.head-sub {
|
||||
display: block;
|
||||
margin-top: 8rpx;
|
||||
font-size: 23rpx;
|
||||
color: $color-text-muted;
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
color: #294a68;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.tenant-account {
|
||||
max-width: 180rpx;
|
||||
font-size: 21rpx;
|
||||
color: #8da3b7;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
@@ -231,6 +347,100 @@ onShow(() => {
|
||||
padding: 8rpx $page-padding-x 0;
|
||||
}
|
||||
|
||||
.tenant-mask {
|
||||
position: fixed;
|
||||
z-index: 99;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba(18, 42, 68, 0.32);
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.tenant-sheet {
|
||||
width: 100%;
|
||||
max-height: 72vh;
|
||||
overflow-y: auto;
|
||||
padding: 38rpx 32rpx calc(env(safe-area-inset-bottom, 0px) + 40rpx);
|
||||
box-sizing: border-box;
|
||||
border-radius: 36rpx 36rpx 0 0;
|
||||
background: linear-gradient(180deg, #f5faff 0%, #ffffff 24%);
|
||||
}
|
||||
|
||||
.sheet-head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.sheet-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
color: #203b56;
|
||||
}
|
||||
|
||||
.sheet-close {
|
||||
font-size: 25rpx;
|
||||
color: #398fe7;
|
||||
padding: 10rpx;
|
||||
}
|
||||
|
||||
.sheet-sub {
|
||||
display: block;
|
||||
margin: 8rpx 0 20rpx;
|
||||
font-size: 23rpx;
|
||||
color: #8aa0b4;
|
||||
}
|
||||
|
||||
.tenant-option {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 18rpx;
|
||||
padding: 20rpx 16rpx;
|
||||
border-radius: 18rpx;
|
||||
border: 1rpx solid #edf3f8;
|
||||
margin-top: 12rpx;
|
||||
|
||||
&.current {
|
||||
background: #f2f8ff;
|
||||
border-color: #cfe5fa;
|
||||
}
|
||||
|
||||
&.disabled { opacity: 0.6; }
|
||||
}
|
||||
|
||||
.tenant-option-icon {
|
||||
width: 64rpx;
|
||||
height: 64rpx;
|
||||
border-radius: 18rpx;
|
||||
background: #eaf5ff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.tenant-option-info {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.tenant-option-name,
|
||||
.tenant-option-meta { display: block; }
|
||||
|
||||
.tenant-option-name {
|
||||
font-size: 27rpx;
|
||||
font-weight: 500;
|
||||
color: #294763;
|
||||
}
|
||||
|
||||
.tenant-option-meta {
|
||||
margin-top: 5rpx;
|
||||
font-size: 22rpx;
|
||||
color: #91a5b8;
|
||||
}
|
||||
|
||||
/* ============ 失败提示 ============ */
|
||||
.err-box {
|
||||
display: flex;
|
||||
|
||||
Reference in new issue
Block a user