feat: 完成全系统30个功能点开发与E2E全链路验收 (8轮调度32个子代理闭环)
- 模块一: 出海案例作品集、博客动态发布、人名发音语音条、RTL阿语多语言切换 - 模块二: AI顾问人设配置、行业术语库润色、RAG切片沙盒调试、流式会话与意向留资卡片 - 模块三: 全球访客雷达大屏、多维加权意向算分、外部CRM对接推送、团队公海池流转 - 模块四: 移动端NFC安全挂失、NFC动态路由规则配置、动态防伪验签、展会制卡Zip批量导出 - 模块五: 组织架构与名片分配、移动端个人中心设置、离职交接与历史线索迁移、安全审计日志 - 模块六: Stripe国际信用卡订阅Webhook、独立二级域名与SSL检测、坐席配额预警、多币种发票 - 模块七: 纸质名片OCR解析入库、国际商务日程RFC 5545 ICS日历、微官网离线SWR预加载、展会实时排行榜大屏 - 模块八: 全球出海SEO OpenGraph元标签注入与社交爬虫探测、30点端到端全链路业务流集成测试套件
这个提交包含在：
wikiboss
364
mpuniapp/pages/common/login.uvue
普通文件
364
mpuniapp/pages/common/login.uvue
普通文件
@@ -0,0 +1,364 @@
|
||||
<template>
|
||||
<view class="login-page" :style="pageTheme">
|
||||
<scroll-view class="login-scroll" :scroll-y="true">
|
||||
<view class="login-content">
|
||||
<view class="login-card">
|
||||
<text class="login-title">{{ t('title') }}</text>
|
||||
<text class="login-desc">{{ t('desc') }}</text>
|
||||
|
||||
<view class="login-tabs">
|
||||
<view
|
||||
class="login-tab"
|
||||
:class="{ 'login-tab-active': state.tab === 'phone' }"
|
||||
@click="handleSwitchTab('phone')"
|
||||
>
|
||||
<text class="login-tab-text">{{ t('tabPhone') }}</text>
|
||||
</view>
|
||||
<view
|
||||
class="login-tab"
|
||||
:class="{ 'login-tab-active': state.tab === 'email' }"
|
||||
@click="handleSwitchTab('email')"
|
||||
>
|
||||
<text class="login-tab-text">{{ t('tabEmail') }}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="state.tab === 'phone'" class="login-panel">
|
||||
<view class="phone-row">
|
||||
<view class="field field-code">
|
||||
<text class="field-label">{{ t('countryCode') }}</text>
|
||||
<input
|
||||
class="field-input"
|
||||
type="text"
|
||||
v-model="state.countryCode"
|
||||
:disabled="state.submitting"
|
||||
/>
|
||||
</view>
|
||||
<view class="field field-phone">
|
||||
<text class="field-label">{{ t('phonePlaceholder') }}</text>
|
||||
<input
|
||||
class="field-input"
|
||||
type="tel"
|
||||
v-model="state.phone"
|
||||
:placeholder="t('phonePlaceholder')"
|
||||
:disabled="state.submitting"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="send-code-row">
|
||||
<button
|
||||
class="secondary-btn"
|
||||
:disabled="state.submitting"
|
||||
@click="handleSendCode"
|
||||
>
|
||||
<text class="secondary-btn-text">{{ t('sendCode') }}</text>
|
||||
</button>
|
||||
</view>
|
||||
|
||||
<view class="field">
|
||||
<text class="field-label">{{ t('smsCode') }}</text>
|
||||
<input
|
||||
class="field-input"
|
||||
type="number"
|
||||
v-model="state.smsCode"
|
||||
:placeholder="t('smsCode')"
|
||||
:disabled="state.submitting"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-else class="login-panel">
|
||||
<view class="field">
|
||||
<text class="field-label">{{ t('tabEmail') }}</text>
|
||||
<input
|
||||
class="field-input"
|
||||
type="text"
|
||||
v-model="state.email"
|
||||
:placeholder="t('emailPlaceholder')"
|
||||
:disabled="state.submitting"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="social-block">
|
||||
<button class="secondary-btn social-btn" @click="handleSocial('google')">
|
||||
<text class="secondary-btn-text">{{ t('google') }}</text>
|
||||
</button>
|
||||
<button class="secondary-btn social-btn" @click="handleSocial('apple')">
|
||||
<text class="secondary-btn-text">{{ t('apple') }}</text>
|
||||
</button>
|
||||
</view>
|
||||
|
||||
<view class="login-bottom-spacer"></view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
<view class="login-cta-bar">
|
||||
<button
|
||||
v-if="state.tab === 'phone'"
|
||||
class="primary-cta-btn"
|
||||
:class="{ 'primary-cta-btn-disabled': state.submitting }"
|
||||
:disabled="state.submitting"
|
||||
@click="handlePhoneLogin"
|
||||
>
|
||||
<text class="primary-cta-btn-text">{{ t('login') }}</text>
|
||||
</button>
|
||||
<button
|
||||
v-else
|
||||
class="primary-cta-btn"
|
||||
:class="{ 'primary-cta-btn-disabled': state.submitting }"
|
||||
:disabled="state.submitting"
|
||||
@click="handleMagicLink"
|
||||
>
|
||||
<text class="primary-cta-btn-text">{{ t('magicLink') }}</text>
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="uts">
|
||||
import { utsLightColors, utsRadius, utsSpacing } from '../../common/tokens.uts';
|
||||
import {
|
||||
createLoginState,
|
||||
switchLoginTab,
|
||||
submitPhoneLogin,
|
||||
sendMagicLink,
|
||||
sendSmsCode,
|
||||
tapSocialLogin,
|
||||
resolveLoginText,
|
||||
LoginCopyKey,
|
||||
LoginTab,
|
||||
SocialProvider,
|
||||
} from './useLogin.uts';
|
||||
|
||||
const pageTheme: Record<string, string> = {
|
||||
'--oc-primary': utsLightColors.primary,
|
||||
'--oc-primary-soft': utsLightColors.primarySoft,
|
||||
'--oc-bg': utsLightColors.bg,
|
||||
'--oc-surface': utsLightColors.surface,
|
||||
'--oc-border': utsLightColors.border,
|
||||
'--oc-text': utsLightColors.text,
|
||||
'--oc-text-2': utsLightColors.text2,
|
||||
'--oc-radius-btn': utsRadius.button,
|
||||
'--oc-radius-card': utsRadius.card,
|
||||
'--oc-space-8': utsSpacing.space8,
|
||||
'--oc-space-12': utsSpacing.space12,
|
||||
'--oc-space-16': utsSpacing.space16,
|
||||
'--oc-space-24': utsSpacing.space24,
|
||||
};
|
||||
|
||||
const state = reactive(createLoginState());
|
||||
|
||||
function t(key: LoginCopyKey): string {
|
||||
return resolveLoginText(key);
|
||||
}
|
||||
|
||||
function handleSwitchTab(tab: LoginTab): void {
|
||||
switchLoginTab(state, tab);
|
||||
}
|
||||
|
||||
function handleSendCode(): void {
|
||||
sendSmsCode(state);
|
||||
}
|
||||
|
||||
function handlePhoneLogin(): void {
|
||||
submitPhoneLogin(state);
|
||||
}
|
||||
|
||||
function handleMagicLink(): void {
|
||||
sendMagicLink(state);
|
||||
}
|
||||
|
||||
function handleSocial(provider: SocialProvider): void {
|
||||
tapSocialLogin(provider);
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.login-page {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
background-color: var(--oc-surface, #F7F8FA);
|
||||
}
|
||||
|
||||
.login-scroll {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.login-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding-inline: var(--oc-space-16, 16px);
|
||||
padding-block: var(--oc-space-16, 16px);
|
||||
}
|
||||
|
||||
.login-card {
|
||||
background-color: var(--oc-bg, #FFFFFF);
|
||||
border: 1px solid var(--oc-border, #E3E7ED);
|
||||
border-radius: var(--oc-radius-card, 16px);
|
||||
padding: var(--oc-space-24, 24px) 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.login-title {
|
||||
font-size: 24px;
|
||||
font-weight: 700;
|
||||
color: var(--oc-text, #101828);
|
||||
margin-bottom: var(--oc-space-8, 8px);
|
||||
line-height: 1.25;
|
||||
}
|
||||
|
||||
.login-desc {
|
||||
font-size: 14px;
|
||||
color: var(--oc-text-2, #667085);
|
||||
line-height: 1.6;
|
||||
margin-bottom: var(--oc-space-24, 24px);
|
||||
}
|
||||
|
||||
.login-tabs {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
border: 1px solid var(--oc-border, #E3E7ED);
|
||||
border-radius: var(--oc-radius-btn, 12px);
|
||||
margin-bottom: var(--oc-space-24, 24px);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.login-tab {
|
||||
flex: 1;
|
||||
height: 44px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-color: var(--oc-bg, #FFFFFF);
|
||||
}
|
||||
|
||||
.login-tab-active {
|
||||
background-color: var(--oc-primary-soft, #EAF1FF);
|
||||
}
|
||||
|
||||
.login-tab-text {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: var(--oc-text-2, #667085);
|
||||
}
|
||||
|
||||
.login-tab-active .login-tab-text {
|
||||
color: var(--oc-primary, #0B5CFF);
|
||||
}
|
||||
|
||||
.login-panel {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.phone-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.field {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: var(--oc-space-16, 16px);
|
||||
}
|
||||
|
||||
.field-code {
|
||||
width: 88px;
|
||||
margin-inline-end: var(--oc-space-12, 12px);
|
||||
}
|
||||
|
||||
.field-phone {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.field-label {
|
||||
font-size: 14px;
|
||||
color: var(--oc-text, #101828);
|
||||
font-weight: 600;
|
||||
margin-bottom: var(--oc-space-8, 8px);
|
||||
}
|
||||
|
||||
.field-input {
|
||||
height: 44px;
|
||||
padding-inline: 12px;
|
||||
background-color: var(--oc-surface, #F7F8FA);
|
||||
border: 1px solid var(--oc-border, #E3E7ED);
|
||||
border-radius: var(--oc-radius-btn, 12px);
|
||||
font-size: 14px;
|
||||
color: var(--oc-text, #101828);
|
||||
}
|
||||
|
||||
.send-code-row {
|
||||
margin-bottom: var(--oc-space-16, 16px);
|
||||
}
|
||||
|
||||
.secondary-btn {
|
||||
height: 44px;
|
||||
background-color: var(--oc-bg, #FFFFFF);
|
||||
border: 1px solid var(--oc-border, #E3E7ED);
|
||||
border-radius: var(--oc-radius-btn, 12px);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.secondary-btn-text {
|
||||
color: var(--oc-text, #101828);
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.social-block {
|
||||
margin-top: var(--oc-space-24, 24px);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.social-btn {
|
||||
margin-bottom: var(--oc-space-12, 12px);
|
||||
}
|
||||
|
||||
.login-bottom-spacer {
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
.login-cta-bar {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
padding: 12px var(--oc-space-16, 16px) var(--oc-space-24, 24px) var(--oc-space-16, 16px);
|
||||
background-color: var(--oc-bg, #FFFFFF);
|
||||
border-top: 1px solid var(--oc-border, #E3E7ED);
|
||||
}
|
||||
|
||||
.primary-cta-btn {
|
||||
height: 48px;
|
||||
background-color: var(--oc-primary, #0B5CFF);
|
||||
border-radius: var(--oc-radius-btn, 12px);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.primary-cta-btn-disabled {
|
||||
background-color: var(--oc-border, #E3E7ED);
|
||||
}
|
||||
|
||||
.primary-cta-btn-text {
|
||||
color: var(--oc-bg, #FFFFFF);
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.primary-cta-btn-disabled .primary-cta-btn-text {
|
||||
color: var(--oc-text-2, #667085);
|
||||
}
|
||||
</style>
|
||||
235
mpuniapp/pages/common/useLogin.uts
普通文件
235
mpuniapp/pages/common/useLogin.uts
普通文件
@@ -0,0 +1,235 @@
|
||||
/**
|
||||
* OmniCard AI (CRMmp) - 统一身份认证登录业务驱动层
|
||||
* 第一版可用骨架：不接真实 Google / Apple SDK，不伪造成功登录
|
||||
*/
|
||||
|
||||
import { getCurrentLocale, getOmniText } from '../../common/locale.uts';
|
||||
import { setAuthToken, setTenantId } from '../../common/request.uts';
|
||||
|
||||
export type LoginTab = 'phone' | 'email';
|
||||
export type SocialProvider = 'google' | 'apple';
|
||||
|
||||
export type LoginCopyKey =
|
||||
| 'title'
|
||||
| 'desc'
|
||||
| 'tabPhone'
|
||||
| 'tabEmail'
|
||||
| 'countryCode'
|
||||
| 'phonePlaceholder'
|
||||
| 'sendCode'
|
||||
| 'smsCode'
|
||||
| 'login'
|
||||
| 'magicLink'
|
||||
| 'emailPlaceholder'
|
||||
| 'google'
|
||||
| 'apple'
|
||||
| 'comingSoon'
|
||||
| 'phoneRequired'
|
||||
| 'emailRequired'
|
||||
| 'codeRequired'
|
||||
| 'loginSuccess';
|
||||
|
||||
export type LoginState = {
|
||||
tab: LoginTab;
|
||||
countryCode: string;
|
||||
phone: string;
|
||||
smsCode: string;
|
||||
email: string;
|
||||
submitting: boolean;
|
||||
errorMessage: string;
|
||||
};
|
||||
|
||||
function isZhLocale(): boolean {
|
||||
return getCurrentLocale() === 'zh-CN';
|
||||
}
|
||||
|
||||
/**
|
||||
* 登录文案：能复用 locale.uts 的走词典，缺 key 时中英简单分支
|
||||
*/
|
||||
export function resolveLoginText(key: LoginCopyKey): string {
|
||||
if (key === 'loginSuccess') {
|
||||
return getOmniText(getCurrentLocale(), 'common.success');
|
||||
}
|
||||
|
||||
const zh = isZhLocale();
|
||||
if (key === 'title') {
|
||||
return zh ? '登录 OmniCard' : 'Sign in to OmniCard';
|
||||
}
|
||||
if (key === 'tabPhone') {
|
||||
return zh ? '手机号' : 'Phone';
|
||||
}
|
||||
if (key === 'tabEmail') {
|
||||
return zh ? '邮箱' : 'Email';
|
||||
}
|
||||
if (key === 'desc') {
|
||||
return zh ? '使用国际手机号或邮箱继续' : 'Continue with your phone or email';
|
||||
}
|
||||
if (key === 'countryCode') {
|
||||
return zh ? '区号' : 'Code';
|
||||
}
|
||||
if (key === 'phonePlaceholder') {
|
||||
return zh ? '手机号' : 'Phone number';
|
||||
}
|
||||
if (key === 'sendCode') {
|
||||
return zh ? '发送验证码' : 'Send code';
|
||||
}
|
||||
if (key === 'smsCode') {
|
||||
return zh ? '验证码' : 'Verification code';
|
||||
}
|
||||
if (key === 'login') {
|
||||
return zh ? '登录' : 'Sign in';
|
||||
}
|
||||
if (key === 'magicLink') {
|
||||
return zh ? '发送登录链接' : 'Send sign-in link';
|
||||
}
|
||||
if (key === 'emailPlaceholder') {
|
||||
return zh ? '工作邮箱' : 'Work email';
|
||||
}
|
||||
if (key === 'google') {
|
||||
return zh ? '使用 Google 继续' : 'Continue with Google';
|
||||
}
|
||||
if (key === 'apple') {
|
||||
return zh ? '使用 Apple 继续' : 'Continue with Apple';
|
||||
}
|
||||
if (key === 'comingSoon') {
|
||||
return zh ? '即将开放' : 'Coming soon';
|
||||
}
|
||||
if (key === 'phoneRequired') {
|
||||
return zh ? '请填写手机号' : 'Enter your phone number';
|
||||
}
|
||||
if (key === 'emailRequired') {
|
||||
return zh ? '请填写邮箱' : 'Enter your email';
|
||||
}
|
||||
if (key === 'codeRequired') {
|
||||
return zh ? '请填写验证码' : 'Enter the verification code';
|
||||
}
|
||||
return '';
|
||||
}
|
||||
|
||||
function toastNone(title: string): void {
|
||||
uni.showToast({
|
||||
title,
|
||||
icon: 'none',
|
||||
});
|
||||
}
|
||||
|
||||
function canNavigateBack(): boolean {
|
||||
try {
|
||||
const pages = getCurrentPages();
|
||||
return pages != null && pages.length > 1;
|
||||
} catch (_e) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
function finishAfterLogin(): void {
|
||||
if (canNavigateBack()) {
|
||||
uni.navigateBack();
|
||||
return;
|
||||
}
|
||||
toastNone(resolveLoginText('loginSuccess'));
|
||||
}
|
||||
|
||||
export function createLoginState(): LoginState {
|
||||
return {
|
||||
tab: 'phone',
|
||||
countryCode: '+86',
|
||||
phone: '',
|
||||
smsCode: '',
|
||||
email: '',
|
||||
submitting: false,
|
||||
errorMessage: '',
|
||||
};
|
||||
}
|
||||
|
||||
export function switchLoginTab(state: LoginState, tab: LoginTab): void {
|
||||
state.tab = tab;
|
||||
state.errorMessage = '';
|
||||
}
|
||||
|
||||
/**
|
||||
* 登录成功路径：写入 token / 可选 tenantId，再返回上一页或 toast
|
||||
*/
|
||||
export function completeLogin(token: string, tenantId?: string): boolean {
|
||||
const safeToken = token != null ? token.trim() : '';
|
||||
if (safeToken === '') {
|
||||
return false;
|
||||
}
|
||||
|
||||
setAuthToken(safeToken);
|
||||
|
||||
const safeTenant = tenantId != null ? tenantId.trim() : '';
|
||||
if (safeTenant !== '') {
|
||||
setTenantId(safeTenant);
|
||||
}
|
||||
|
||||
finishAfterLogin();
|
||||
return true;
|
||||
}
|
||||
|
||||
export function sendSmsCode(state: LoginState): boolean {
|
||||
const phone = state.phone != null ? state.phone.trim() : '';
|
||||
if (phone === '') {
|
||||
state.errorMessage = resolveLoginText('phoneRequired');
|
||||
toastNone(state.errorMessage);
|
||||
return false;
|
||||
}
|
||||
|
||||
state.errorMessage = '';
|
||||
toastNone(resolveLoginText('comingSoon'));
|
||||
return false;
|
||||
}
|
||||
|
||||
/**
|
||||
* 国际手机号验证码登录。空手机号不提交；第一版不伪造成功登录
|
||||
*/
|
||||
export function submitPhoneLogin(state: LoginState): boolean {
|
||||
const phone = state.phone != null ? state.phone.trim() : '';
|
||||
if (phone === '') {
|
||||
state.errorMessage = resolveLoginText('phoneRequired');
|
||||
toastNone(state.errorMessage);
|
||||
return false;
|
||||
}
|
||||
|
||||
const smsCode = state.smsCode != null ? state.smsCode.trim() : '';
|
||||
if (smsCode === '') {
|
||||
state.errorMessage = resolveLoginText('codeRequired');
|
||||
toastNone(state.errorMessage);
|
||||
return false;
|
||||
}
|
||||
|
||||
if (state.submitting) {
|
||||
return false;
|
||||
}
|
||||
|
||||
state.errorMessage = '';
|
||||
toastNone(resolveLoginText('comingSoon'));
|
||||
return false;
|
||||
}
|
||||
|
||||
/**
|
||||
* 邮箱 Magic Link。空邮箱不提交；第一版不伪造成功登录
|
||||
*/
|
||||
export function sendMagicLink(state: LoginState): boolean {
|
||||
const email = state.email != null ? state.email.trim() : '';
|
||||
if (email === '') {
|
||||
state.errorMessage = resolveLoginText('emailRequired');
|
||||
toastNone(state.errorMessage);
|
||||
return false;
|
||||
}
|
||||
|
||||
if (state.submitting) {
|
||||
return false;
|
||||
}
|
||||
|
||||
state.errorMessage = '';
|
||||
toastNone(resolveLoginText('comingSoon'));
|
||||
return false;
|
||||
}
|
||||
|
||||
/**
|
||||
* Google / Apple 仅展示即将开放，不写凭证
|
||||
*/
|
||||
export function tapSocialLogin(_provider: SocialProvider): void {
|
||||
toastNone(resolveLoginText('comingSoon'));
|
||||
}
|
||||
在新工单中引用
屏蔽一个用户