小程序初始化
This commit is contained in:
@@ -0,0 +1,4 @@
|
||||
VITE_APP_ENV=dev
|
||||
VITE_API_BASE_URL=http://localhost:19089
|
||||
VITE_WS_URL=ws://localhost:19089
|
||||
VITE_DEBUG=true
|
||||
@@ -0,0 +1,4 @@
|
||||
VITE_APP_ENV=prod
|
||||
VITE_API_BASE_URL=http://101.200.208.45:19089/api
|
||||
VITE_WS_URL=ws://101.200.208.45:19089
|
||||
VITE_DEBUG=false
|
||||
@@ -1,48 +0,0 @@
|
||||
<script lang="uts">
|
||||
// #ifdef APP-ANDROID || APP-HARMONY
|
||||
let firstBackTime = 0
|
||||
// #endif
|
||||
export default {
|
||||
onLaunch: function () {
|
||||
console.log('App Launch')
|
||||
},
|
||||
onShow: function () {
|
||||
console.log('App Show')
|
||||
},
|
||||
onHide: function () {
|
||||
console.log('App Hide')
|
||||
},
|
||||
// #ifdef APP-ANDROID || APP-HARMONY
|
||||
onLastPageBackPress: function () {
|
||||
console.log('App LastPageBackPress')
|
||||
if (firstBackTime == 0) {
|
||||
uni.showToast({
|
||||
title: '再按一次退出应用',
|
||||
position: 'bottom',
|
||||
})
|
||||
firstBackTime = Date.now()
|
||||
setTimeout(() => {
|
||||
firstBackTime = 0
|
||||
}, 2000)
|
||||
} else if (Date.now() - firstBackTime < 2000) {
|
||||
firstBackTime = Date.now()
|
||||
uni.exit()
|
||||
}
|
||||
},
|
||||
// #endif
|
||||
onExit: function () {
|
||||
console.log('App Exit')
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/*每个页面公共css */
|
||||
.uni-row {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.uni-column {
|
||||
flex-direction: column;
|
||||
}
|
||||
</style>
|
||||
+2
-2
@@ -15,6 +15,6 @@
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"><!--app-html--></div>
|
||||
<script type="module" src="/main"></script>
|
||||
<script type="module" src="/src/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
||||
@@ -1,9 +0,0 @@
|
||||
import App from './App.uvue'
|
||||
|
||||
import { createSSRApp } from 'vue'
|
||||
export function createApp() {
|
||||
const app = createSSRApp(App)
|
||||
return {
|
||||
app
|
||||
}
|
||||
}
|
||||
Generated
+7652
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,24 @@
|
||||
{
|
||||
"name": "emotion-museum-uniapp",
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev:mp-weixin": "NODE_ENV=development VITE_CJS_IGNORE_WARNING=1 VITE_USER_NODE_ENV= UNI_PLATFORM=mp-weixin UNI_INPUT_DIR=src UNI_OUTPUT_DIR=unpackage/dist/dev/mp-weixin UNI_APP_X=false uni -p mp-weixin",
|
||||
"build:mp-weixin": "NODE_ENV=production VITE_CJS_IGNORE_WARNING=1 VITE_USER_NODE_ENV= UNI_PLATFORM=mp-weixin UNI_INPUT_DIR=src UNI_OUTPUT_DIR=unpackage/dist/build/mp-weixin UNI_APP_X=false uni build -p mp-weixin --outDir unpackage/dist/build/mp-weixin",
|
||||
"dev:h5": "NODE_ENV=development VITE_CJS_IGNORE_WARNING=1 VITE_USER_NODE_ENV= UNI_PLATFORM=h5 UNI_INPUT_DIR=src UNI_APP_X=false uni -p h5",
|
||||
"build:h5": "NODE_ENV=production VITE_CJS_IGNORE_WARNING=1 VITE_USER_NODE_ENV= UNI_PLATFORM=h5 UNI_INPUT_DIR=src UNI_APP_X=false uni build -p h5"
|
||||
},
|
||||
"dependencies": {
|
||||
"@dcloudio/uni-app": "3.0.0-alpha-5000120260211001",
|
||||
"@dcloudio/uni-mp-weixin": "3.0.0-alpha-5000120260211001",
|
||||
"vue": "3.4.21"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@dcloudio/vite-plugin-uni": "3.0.0-alpha-5000120260211001",
|
||||
"@vitejs/plugin-vue": "^5.2.0",
|
||||
"@vue/compiler-sfc": "3.4.21",
|
||||
"@vue/shared": "3.4.21",
|
||||
"@vue/server-renderer": "3.4.21",
|
||||
"vite": "5.2.8"
|
||||
}
|
||||
}
|
||||
@@ -1,41 +0,0 @@
|
||||
{
|
||||
"pages": [
|
||||
{
|
||||
"path": "pages/home/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "首页"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/login/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "登录"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/splash/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "首页-聊天"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/device-connect/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "设备连接"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/index/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "首页"
|
||||
}
|
||||
}
|
||||
],
|
||||
"globalStyle": {
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "Emotion Museum",
|
||||
"navigationBarBackgroundColor": "#F8F8F8",
|
||||
"backgroundColor": "#F8F8F8"
|
||||
},
|
||||
"uniIdRouter": {}
|
||||
}
|
||||
@@ -1,24 +0,0 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<image class="hero" src="/static/devices/search_illustration.png" mode="widthFix"></image>
|
||||
<view class="status">
|
||||
<image class="bt" src="/static/devices/bluetooth_off.png"></image>
|
||||
<text>未连接</text>
|
||||
</view>
|
||||
<button class="btn-primary">搜索设备</button>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.container { padding: 32rpx; }
|
||||
.hero { width: 100%; margin-bottom: 24rpx; }
|
||||
.status { display: flex; align-items: center; gap: 12rpx; margin-bottom: 24rpx; }
|
||||
.bt { width: 40rpx; height: 40rpx; }
|
||||
.btn-primary { background: #007AFF; color: #fff; border-radius: 12rpx; height: 88rpx; line-height: 88rpx; }
|
||||
</style>
|
||||
|
||||
|
||||
@@ -1,24 +0,0 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<image class="banner" src="/static/home/banner.png" mode="widthFix"></image>
|
||||
<view class="content">
|
||||
<text class="title">首页</text>
|
||||
<image class="device-entry" src="/static/devices/device_placeholder.png" mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.container { width: 750rpx; }
|
||||
.banner { width: 750rpx; }
|
||||
.content { padding: 24rpx; }
|
||||
.title { font-size: 32rpx; font-weight: 600; margin-bottom: 16rpx; }
|
||||
.device-entry { width: 100%; border-radius: 16rpx; }
|
||||
</style>
|
||||
|
||||
|
||||
@@ -1,36 +0,0 @@
|
||||
<template>
|
||||
<view>
|
||||
<image class="logo" src="/static/logo.png"></image>
|
||||
<text class="title">{{title}}</text>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
title: 'Hello'
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.logo {
|
||||
height: 100px;
|
||||
width: 100px;
|
||||
margin: 100px auto 25px auto;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 18px;
|
||||
color: #8f8f94;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
@@ -1,45 +0,0 @@
|
||||
<template>
|
||||
<scroll-view class="container">
|
||||
<image class="bg" src="/static/auth/login_bg.png" mode="widthFix"></image>
|
||||
<view class="card">
|
||||
<image class="illustration" src="/static/auth/login_illustration.png" mode="widthFix"></image>
|
||||
<view class="inputs">
|
||||
<input class="input" placeholder="手机号 / 邮箱" />
|
||||
<view class="password-row">
|
||||
<input class="input" placeholder="密码" password />
|
||||
<image class="eye" src="/static/auth/icon_eye_off.png"></image>
|
||||
</view>
|
||||
<button class="btn-primary">登录</button>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() { return {} },
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.container {
|
||||
width: 750rpx;
|
||||
}
|
||||
.bg { width: 750rpx; }
|
||||
.card {
|
||||
margin: 32rpx;
|
||||
padding: 32rpx;
|
||||
background: #fff;
|
||||
border-radius: 24rpx;
|
||||
box-shadow: 0 8rpx 24rpx rgba(0,0,0,0.06);
|
||||
}
|
||||
.illustration { width: 100%; margin-bottom: 24rpx; }
|
||||
.inputs { display: flex; flex-direction: column; gap: 24rpx; }
|
||||
.input { height: 88rpx; border: 1rpx solid #eee; border-radius: 12rpx; padding: 0 24rpx; }
|
||||
.password-row { position: relative; }
|
||||
.password-row .input { padding-right: 72rpx; }
|
||||
.eye { position: absolute; right: 24rpx; top: 24rpx; width: 40rpx; height: 40rpx; }
|
||||
.btn-primary { background: #007AFF; color: #fff; border-radius: 12rpx; height: 88rpx; line-height: 88rpx; }
|
||||
</style>
|
||||
|
||||
|
||||
@@ -1,52 +0,0 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<image class="bg" src="/static/splash/background.png" mode="aspectFill"></image>
|
||||
<view class="overlay">
|
||||
<image class="logo" src="/static/logo.png" mode="widthFix"></image>
|
||||
<text class="app-name">Emotion Museum</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
onLoad() {},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.container {
|
||||
position: relative;
|
||||
width: 750rpx;
|
||||
height: 100vh;
|
||||
}
|
||||
.bg {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 750rpx;
|
||||
height: 100vh;
|
||||
}
|
||||
.overlay {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 750rpx;
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.logo {
|
||||
width: 160rpx;
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
.app-name {
|
||||
font-size: 36rpx;
|
||||
color: #111;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
@@ -0,0 +1,35 @@
|
||||
{
|
||||
"setting": {
|
||||
"es6": true,
|
||||
"postcss": true,
|
||||
"minified": true,
|
||||
"uglifyFileName": false,
|
||||
"enhance": true,
|
||||
"packNpmRelationList": [],
|
||||
"babelSetting": {
|
||||
"ignore": [],
|
||||
"disablePlugins": [],
|
||||
"outputPath": ""
|
||||
},
|
||||
"useCompilerPlugins": false,
|
||||
"minifyWXML": true,
|
||||
"compileWorklet": false,
|
||||
"uploadWithSourceMap": true,
|
||||
"packNpmManually": false,
|
||||
"minifyWXSS": true,
|
||||
"localPlugins": false,
|
||||
"disableUseStrict": false,
|
||||
"condition": false,
|
||||
"swc": false,
|
||||
"disableSWC": true
|
||||
},
|
||||
"compileType": "miniprogram",
|
||||
"simulatorPluginLibVersion": {},
|
||||
"packOptions": {
|
||||
"ignore": [],
|
||||
"include": []
|
||||
},
|
||||
"appid": "wxaf2eaba72d28f0e4",
|
||||
"editorSetting": {},
|
||||
"libVersion": "3.14.2"
|
||||
}
|
||||
@@ -0,0 +1,21 @@
|
||||
{
|
||||
"libVersion": "3.14.2",
|
||||
"projectname": "UniApp",
|
||||
"setting": {
|
||||
"urlCheck": true,
|
||||
"coverView": true,
|
||||
"lazyloadPlaceholderEnable": false,
|
||||
"skylineRenderEnable": false,
|
||||
"preloadBackgroundData": false,
|
||||
"autoAudits": false,
|
||||
"showShadowRootInWxmlPanel": true,
|
||||
"compileHotReLoad": true,
|
||||
"useApiHook": true,
|
||||
"useStaticServer": false,
|
||||
"useLanDebug": false,
|
||||
"showES6CompileOption": false,
|
||||
"checkInvalidKey": true,
|
||||
"ignoreDevUnusedFiles": true,
|
||||
"bigPackageSizeSupport": false
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,207 @@
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import { onLaunch, onShow, onHide } from '@dcloudio/uni-app'
|
||||
import { useAppStore } from './stores/app.js'
|
||||
|
||||
const statusBarHeight = ref(0)
|
||||
const safeAreaTop = ref(0)
|
||||
const safeAreaBottom = ref(0)
|
||||
|
||||
onLaunch(async () => {
|
||||
console.log('App Launch')
|
||||
const store = useAppStore()
|
||||
await store.initialize()
|
||||
const systemInfo = uni.getSystemInfoSync()
|
||||
statusBarHeight.value = systemInfo.statusBarHeight || 20
|
||||
safeAreaTop.value = systemInfo.safeAreaInsets?.top || systemInfo.statusBarHeight || 20
|
||||
safeAreaBottom.value = systemInfo.safeAreaInsets?.bottom || 0
|
||||
uni.setStorageSync('statusBarHeight', statusBarHeight.value)
|
||||
uni.setStorageSync('safeAreaTop', safeAreaTop.value)
|
||||
uni.setStorageSync('safeAreaBottom', safeAreaBottom.value)
|
||||
})
|
||||
|
||||
onShow(() => {
|
||||
console.log('App Show')
|
||||
})
|
||||
|
||||
onHide(() => {
|
||||
console.log('App Hide')
|
||||
})
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
page {
|
||||
background-color: #0F071A;
|
||||
color: #F3E8FF;
|
||||
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.status-bar-space {
|
||||
width: 100%;
|
||||
background: transparent;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.safe-area-bottom {
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
}
|
||||
|
||||
.safe-area-top {
|
||||
padding-top: constant(safe-area-inset-top);
|
||||
padding-top: env(safe-area-inset-top);
|
||||
}
|
||||
|
||||
.glass-card {
|
||||
background: rgba(168, 85, 247, 0.05);
|
||||
backdrop-filter: blur(20px);
|
||||
-webkit-backdrop-filter: blur(20px);
|
||||
border: 1px solid rgba(168, 85, 247, 0.15);
|
||||
border-radius: 24rpx;
|
||||
}
|
||||
|
||||
.glass-card-gold {
|
||||
background: linear-gradient(135deg, rgba(168, 85, 247, 0.15), rgba(232, 121, 249, 0.1));
|
||||
border: 1px solid rgba(168, 85, 247, 0.3);
|
||||
border-radius: 32rpx;
|
||||
}
|
||||
|
||||
.glass-input {
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-radius: 24rpx;
|
||||
padding: 24rpx 32rpx;
|
||||
color: #F3E8FF;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.glass-input::placeholder {
|
||||
color: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background: linear-gradient(135deg, #9333EA 0%, #7C3AED 100%);
|
||||
border-radius: 32rpx;
|
||||
padding: 28rpx 48rpx;
|
||||
color: white;
|
||||
font-weight: 600;
|
||||
font-size: 30rpx;
|
||||
border: none;
|
||||
box-shadow: 0 8rpx 32rpx rgba(168, 85, 247, 0.3);
|
||||
}
|
||||
|
||||
.btn-primary:active {
|
||||
transform: scale(0.98);
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
border-radius: 24rpx;
|
||||
padding: 24rpx 40rpx;
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.bottom-nav {
|
||||
background: rgba(15, 7, 26, 0.85);
|
||||
backdrop-filter: blur(40rpx);
|
||||
-webkit-backdrop-filter: blur(40rpx);
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.05);
|
||||
}
|
||||
|
||||
.nav-item {
|
||||
color: rgba(255, 255, 255, 0.4);
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.nav-item.active {
|
||||
color: #C084FC;
|
||||
transform: translateY(-8rpx);
|
||||
}
|
||||
|
||||
.step-indicator {
|
||||
display: flex;
|
||||
gap: 12rpx;
|
||||
}
|
||||
|
||||
.step-dot {
|
||||
width: 24rpx;
|
||||
height: 8rpx;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border-radius: 4rpx;
|
||||
transition: all 0.4s ease;
|
||||
}
|
||||
|
||||
.step-dot.active {
|
||||
width: 40rpx;
|
||||
background: #A855F7;
|
||||
box-shadow: 0 0 24rpx rgba(168, 85, 247, 0.6);
|
||||
}
|
||||
|
||||
.hint-chip {
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-radius: 32rpx;
|
||||
padding: 12rpx 24rpx;
|
||||
font-size: 22rpx;
|
||||
color: rgba(243, 232, 255, 0.8);
|
||||
}
|
||||
|
||||
.hint-chip:active {
|
||||
background: rgba(168, 85, 247, 0.2);
|
||||
border-color: rgba(168, 85, 247, 0.4);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 4rpx;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: rgba(168, 85, 247, 0.3);
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
@keyframes fadeIn {
|
||||
from { opacity: 0; transform: translateY(20rpx); }
|
||||
to { opacity: 1; transform: translateY(0); }
|
||||
}
|
||||
|
||||
.animate-fade-in {
|
||||
animation: fadeIn 0.5s ease-out;
|
||||
}
|
||||
|
||||
@keyframes pulse {
|
||||
0%, 100% { opacity: 0.3; }
|
||||
50% { opacity: 0.7; }
|
||||
}
|
||||
|
||||
.animate-pulse-slow {
|
||||
animation: pulse 6s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.text-primary { color: #A855F7; }
|
||||
.text-primary-light { color: #C084FC; }
|
||||
.text-accent { color: #E879F9; }
|
||||
.text-muted { color: rgba(255, 255, 255, 0.4); }
|
||||
.font-serif { font-family: 'Cinzel', serif; }
|
||||
|
||||
.bg-dark { background-color: #0F071A; }
|
||||
.bg-gradient-purple {
|
||||
background: linear-gradient(180deg, #1A0B2E 0%, #0F071A 50%, #050208 100%);
|
||||
}
|
||||
|
||||
.safe-area-bottom {
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
}
|
||||
|
||||
.safe-area-top {
|
||||
padding-top: constant(safe-area-inset-top);
|
||||
padding-top: env(safe-area-inset-top);
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,84 @@
|
||||
const ENV_TYPE = {
|
||||
DEV: 'dev',
|
||||
TEST: 'test',
|
||||
PROD: 'prod'
|
||||
}
|
||||
|
||||
const normalizeEnv = (value) => {
|
||||
if (!value) return ENV_TYPE.DEV
|
||||
if (value === 'development' || value === 'dev') return ENV_TYPE.DEV
|
||||
if (value === 'production' || value === 'prod') return ENV_TYPE.PROD
|
||||
if (value === 'test') return ENV_TYPE.TEST
|
||||
return ENV_TYPE.DEV
|
||||
}
|
||||
|
||||
const currentEnv = normalizeEnv(import.meta.env.VITE_APP_ENV || import.meta.env.MODE)
|
||||
|
||||
const envConfig = {
|
||||
[ENV_TYPE.DEV]: {
|
||||
API_BASE_URL: 'http://localhost:19089',
|
||||
WS_URL: 'ws://localhost:19089',
|
||||
DEBUG: true
|
||||
},
|
||||
[ENV_TYPE.TEST]: {
|
||||
API_BASE_URL: 'http://101.200.208.45:19089/api',
|
||||
WS_URL: 'ws://101.200.208.45:19089',
|
||||
DEBUG: true
|
||||
},
|
||||
[ENV_TYPE.PROD]: {
|
||||
API_BASE_URL: 'http://101.200.208.45:19089/api',
|
||||
WS_URL: 'ws://101.200.208.45:19089',
|
||||
DEBUG: false
|
||||
}
|
||||
}
|
||||
|
||||
const getConfig = () => {
|
||||
const base = envConfig[currentEnv] || envConfig[ENV_TYPE.DEV]
|
||||
const apiBaseUrl = import.meta.env.VITE_API_BASE_URL || base.API_BASE_URL
|
||||
const wsUrl = import.meta.env.VITE_WS_URL || base.WS_URL
|
||||
const debug = import.meta.env.VITE_DEBUG !== undefined
|
||||
? import.meta.env.VITE_DEBUG === 'true'
|
||||
: base.DEBUG
|
||||
return {
|
||||
API_BASE_URL: apiBaseUrl,
|
||||
WS_URL: wsUrl,
|
||||
DEBUG: debug
|
||||
}
|
||||
}
|
||||
|
||||
const getEnvValue = (key) => {
|
||||
const config = getConfig()
|
||||
return config[key]
|
||||
}
|
||||
|
||||
const isDev = () => {
|
||||
return currentEnv === ENV_TYPE.DEV
|
||||
}
|
||||
|
||||
const isTest = () => {
|
||||
return currentEnv === ENV_TYPE.TEST
|
||||
}
|
||||
|
||||
const isProd = () => {
|
||||
return currentEnv === ENV_TYPE.PROD
|
||||
}
|
||||
|
||||
export {
|
||||
ENV_TYPE,
|
||||
currentEnv,
|
||||
getConfig,
|
||||
getEnvValue,
|
||||
isDev,
|
||||
isTest,
|
||||
isProd
|
||||
}
|
||||
|
||||
export default {
|
||||
ENV_TYPE,
|
||||
currentEnv,
|
||||
getConfig,
|
||||
getEnvValue,
|
||||
isDev,
|
||||
isTest,
|
||||
isProd
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
import App from './App.vue'
|
||||
import { createSSRApp } from 'vue'
|
||||
|
||||
export function createApp() {
|
||||
const app = createSSRApp(App)
|
||||
return { app }
|
||||
}
|
||||
@@ -5,11 +5,9 @@
|
||||
"versionName" : "1.0.0",
|
||||
"versionCode" : "100",
|
||||
"uni-app-x" : {},
|
||||
/* 快应用特有相关 */
|
||||
"quickapp" : {},
|
||||
/* 小程序特有相关 */
|
||||
"mp-weixin" : {
|
||||
"appid" : "",
|
||||
"appid" : "wxaf2eaba72d28f0e4",
|
||||
"setting" : {
|
||||
"urlCheck" : false
|
||||
},
|
||||
@@ -0,0 +1,41 @@
|
||||
{
|
||||
"pages": [
|
||||
{
|
||||
"path": "pages/splash/index",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/login/index",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/onboarding/index",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/main/index",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/profile/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "个人中心"
|
||||
}
|
||||
}
|
||||
],
|
||||
"globalStyle": {
|
||||
"navigationBarTextStyle": "white",
|
||||
"navigationBarTitleText": "人生OS",
|
||||
"navigationBarBackgroundColor": "#0F071A",
|
||||
"backgroundColor": "#0F071A"
|
||||
},
|
||||
"uniIdRouter": {}
|
||||
}
|
||||
@@ -0,0 +1,343 @@
|
||||
<template>
|
||||
<view class="login-page">
|
||||
<view class="status-bar" :style="{ height: statusBarHeight + 'px' }"></view>
|
||||
|
||||
<view class="bg-decoration">
|
||||
<view class="aurora-top"></view>
|
||||
<view class="aurora-bottom"></view>
|
||||
</view>
|
||||
|
||||
<view class="content" :style="{ paddingTop: safeAreaTop + 20 + 'px' }">
|
||||
<view class="login-card">
|
||||
<view class="header">
|
||||
<text class="title font-serif">欢迎回来</text>
|
||||
<text class="subtitle">开启你的数字生命档案</text>
|
||||
</view>
|
||||
|
||||
<view class="form">
|
||||
<view class="input-group">
|
||||
<text class="input-label">手机号码</text>
|
||||
<input
|
||||
class="glass-input"
|
||||
type="number"
|
||||
maxlength="11"
|
||||
placeholder="输入手机号"
|
||||
v-model="phone"
|
||||
/>
|
||||
</view>
|
||||
|
||||
<view class="input-group">
|
||||
<text class="input-label">验证码</text>
|
||||
<view class="code-row">
|
||||
<input
|
||||
class="glass-input code-input"
|
||||
type="number"
|
||||
maxlength="6"
|
||||
placeholder="请输入验证码"
|
||||
v-model="code"
|
||||
/>
|
||||
<view
|
||||
class="code-btn"
|
||||
:class="{ disabled: isCountingDown || phone.length !== 11 }"
|
||||
@click="handleGetCode"
|
||||
>
|
||||
<text v-if="isCountingDown" class="countdown">{{ countdown }}s</text>
|
||||
<text v-else>获取验证码</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view
|
||||
class="btn-primary login-btn"
|
||||
:class="{ disabled: !canSubmit || loading }"
|
||||
@click="handleLogin"
|
||||
>
|
||||
<text v-if="loading">登录中...</text>
|
||||
<text v-else>开启旅程</text>
|
||||
</view>
|
||||
|
||||
<text class="agreement">
|
||||
登录即代表同意《用户协议》与《隐私政策》
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, onMounted } from 'vue'
|
||||
import { useAppStore } from '../../stores/app.js'
|
||||
import { getSmsCode } from '../../services/auth.js'
|
||||
|
||||
const store = useAppStore()
|
||||
|
||||
const statusBarHeight = ref(uni.getStorageSync('statusBarHeight') || 20)
|
||||
const safeAreaTop = ref(uni.getStorageSync('safeAreaTop') || 20)
|
||||
const safeAreaBottom = ref(uni.getStorageSync('safeAreaBottom') || 0)
|
||||
|
||||
onMounted(() => {
|
||||
const systemInfo = uni.getSystemInfoSync()
|
||||
statusBarHeight.value = systemInfo.statusBarHeight || 20
|
||||
safeAreaTop.value = systemInfo.safeAreaInsets?.top || systemInfo.statusBarHeight || 20
|
||||
safeAreaBottom.value = systemInfo.safeAreaInsets?.bottom || 0
|
||||
})
|
||||
|
||||
const phone = ref('')
|
||||
const code = ref('')
|
||||
const loading = ref(false)
|
||||
const countdown = ref(60)
|
||||
const isCountingDown = ref(false)
|
||||
|
||||
const canSubmit = computed(() => {
|
||||
return phone.value.length === 11 && code.value.length === 6
|
||||
})
|
||||
|
||||
const handleGetCode = async () => {
|
||||
if (isCountingDown.value || loading.value) return
|
||||
|
||||
if (phone.value.length !== 11) {
|
||||
uni.showToast({ title: '请输入正确的手机号', icon: 'none' })
|
||||
return
|
||||
}
|
||||
|
||||
try {
|
||||
await getSmsCode(phone.value)
|
||||
uni.showToast({ title: '验证码已发送', icon: 'success' })
|
||||
startCountdown()
|
||||
} catch (error) {
|
||||
uni.showToast({ title: '验证码已发送 (模拟: 888888)', icon: 'none' })
|
||||
startCountdown()
|
||||
}
|
||||
}
|
||||
|
||||
const startCountdown = () => {
|
||||
isCountingDown.value = true
|
||||
countdown.value = 60
|
||||
|
||||
const timer = setInterval(() => {
|
||||
countdown.value--
|
||||
if (countdown.value <= 0) {
|
||||
clearInterval(timer)
|
||||
isCountingDown.value = false
|
||||
}
|
||||
}, 1000)
|
||||
}
|
||||
|
||||
const handleLogin = async () => {
|
||||
if (!canSubmit.value || loading.value) return
|
||||
|
||||
loading.value = true
|
||||
|
||||
try {
|
||||
const result = await store.login(phone.value, code.value)
|
||||
|
||||
if (result.success) {
|
||||
if (result.hasProfile) {
|
||||
uni.redirectTo({ url: '/pages/main/index' })
|
||||
} else {
|
||||
uni.redirectTo({ url: '/pages/onboarding/index' })
|
||||
}
|
||||
} else {
|
||||
uni.showToast({ title: result.error || '登录失败', icon: 'none' })
|
||||
}
|
||||
} catch (error) {
|
||||
uni.showToast({ title: '登录失败', icon: 'none' })
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.login-page {
|
||||
min-height: 100vh;
|
||||
background: linear-gradient(180deg, #0F071A 0%, #1A0B2E 50%, #0F071A 100%);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.status-bar {
|
||||
height: constant(safe-area-inset-top);
|
||||
height: env(safe-area-inset-top);
|
||||
width: 100%;
|
||||
background: transparent;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.bg-decoration {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.aurora-top {
|
||||
position: absolute;
|
||||
top: -10%;
|
||||
left: -10%;
|
||||
width: 120%;
|
||||
height: 60%;
|
||||
background: rgba(168, 85, 247, 0.08);
|
||||
filter: blur(120rpx);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.aurora-bottom {
|
||||
position: absolute;
|
||||
bottom: -10%;
|
||||
right: -10%;
|
||||
width: 100%;
|
||||
height: 50%;
|
||||
background: rgba(139, 92, 246, 0.05);
|
||||
filter: blur(100rpx);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.content {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 40rpx;
|
||||
padding-top: calc(40rpx + constant(safe-area-inset-top));
|
||||
padding-top: calc(40rpx + env(safe-area-inset-top));
|
||||
}
|
||||
|
||||
.login-card {
|
||||
width: 100%;
|
||||
max-width: 720rpx;
|
||||
background: rgba(168, 85, 247, 0.05);
|
||||
backdrop-filter: blur(40rpx);
|
||||
border: 1px solid rgba(168, 85, 247, 0.15);
|
||||
border-radius: 48rpx;
|
||||
padding: 64rpx 40rpx;
|
||||
}
|
||||
|
||||
.header {
|
||||
text-align: center;
|
||||
margin-bottom: 64rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
display: block;
|
||||
font-size: 48rpx;
|
||||
font-weight: 300;
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
letter-spacing: 6rpx;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
color: rgba(255, 255, 255, 0.4);
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.form {
|
||||
margin-bottom: 48rpx;
|
||||
}
|
||||
|
||||
.input-group {
|
||||
margin-bottom: 32rpx;
|
||||
}
|
||||
|
||||
.input-label {
|
||||
display: block;
|
||||
font-size: 18rpx;
|
||||
color: rgba(255, 255, 255, 0.35);
|
||||
margin-bottom: 16rpx;
|
||||
letter-spacing: 4rpx;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.glass-input {
|
||||
width: 100%;
|
||||
height: 92rpx;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-radius: 24rpx;
|
||||
padding: 0 32rpx;
|
||||
color: #F3E8FF;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.glass-input::placeholder {
|
||||
color: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
.code-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 16rpx;
|
||||
align-items: stretch;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.code-input {
|
||||
flex: 1;
|
||||
width: auto;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.code-btn {
|
||||
width: 220rpx;
|
||||
height: 92rpx;
|
||||
background: linear-gradient(135deg, rgba(147, 51, 234, 0.5), rgba(124, 58, 237, 0.4));
|
||||
border: 1px solid rgba(168, 85, 247, 0.4);
|
||||
border-radius: 24rpx;
|
||||
color: rgba(255, 255, 255, 0.95);
|
||||
font-size: 22rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-shrink: 0;
|
||||
letter-spacing: 2rpx;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.code-btn:active {
|
||||
transform: scale(0.97);
|
||||
opacity: 0.85;
|
||||
}
|
||||
|
||||
.code-btn.disabled {
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border-color: rgba(255, 255, 255, 0.1);
|
||||
color: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
.countdown {
|
||||
font-size: 26rpx;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
width: 100%;
|
||||
height: 100rpx;
|
||||
background: linear-gradient(135deg, #9333EA 0%, #7C3AED 100%);
|
||||
border-radius: 32rpx;
|
||||
color: white;
|
||||
font-weight: 600;
|
||||
font-size: 30rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: none;
|
||||
box-shadow: 0 8rpx 32rpx rgba(168, 85, 247, 0.3);
|
||||
margin-bottom: 32rpx;
|
||||
}
|
||||
|
||||
.btn-primary.disabled {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.agreement {
|
||||
display: block;
|
||||
text-align: center;
|
||||
font-size: 22rpx;
|
||||
color: rgba(255, 255, 255, 0.25);
|
||||
line-height: 1.6;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,258 @@
|
||||
<template>
|
||||
<view class="path-view">
|
||||
<text class="page-title">实现路径</text>
|
||||
|
||||
<view v-if="!selectedScript" class="empty-state glass-card">
|
||||
<text class="empty-icon">🗺️</text>
|
||||
<text class="empty-text">先生成剧本，方能洞察路径。</text>
|
||||
<button class="btn-secondary empty-btn" @click="goToScript">去生成剧本</button>
|
||||
</view>
|
||||
|
||||
<view v-else-if="!currentPath" class="empty-state glass-card">
|
||||
<text class="empty-icon">🎯</text>
|
||||
<text class="empty-text">等待开启人生导航...</text>
|
||||
</view>
|
||||
|
||||
<view v-else class="path-content">
|
||||
<view class="target-card glass-card-gold">
|
||||
<text class="target-label">目标：{{ currentPath.title }}</text>
|
||||
<text class="target-summary">{{ (currentPath.description || currentPath.summary || currentPath.content || '').slice(0, 80) }}...</text>
|
||||
</view>
|
||||
|
||||
<view class="timeline">
|
||||
<view class="timeline-line"></view>
|
||||
|
||||
<view
|
||||
v-for="(step, index) in currentPath.steps"
|
||||
:key="index"
|
||||
class="timeline-item"
|
||||
>
|
||||
<view class="timeline-dot" :class="{ done: step.done }">
|
||||
<view class="dot-inner" :class="{ pulse: step.done }"></view>
|
||||
</view>
|
||||
|
||||
<view class="step-card glass-card" :class="{ done: step.done }">
|
||||
<text class="step-phase">节点 {{ index + 1 }}</text>
|
||||
<text class="step-task">{{ step.task }}</text>
|
||||
<text class="step-desc">{{ step.desc }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed, ref, onMounted, watch } from 'vue'
|
||||
import { useAppStore } from '../../stores/app.js'
|
||||
import * as lifePathService from '../../services/lifePath.js'
|
||||
|
||||
const store = useAppStore()
|
||||
|
||||
const pathData = ref(null)
|
||||
|
||||
const selectedScript = computed(() => {
|
||||
return store.scripts.find(s => s.isSelected)
|
||||
})
|
||||
|
||||
const currentPath = computed(() => {
|
||||
if (pathData.value) return pathData.value
|
||||
if (store.currentPath) return store.currentPath
|
||||
return null
|
||||
})
|
||||
|
||||
const loadPath = async (scriptId) => {
|
||||
if (!scriptId) return
|
||||
try {
|
||||
const res = await lifePathService.getPathByScriptId(scriptId)
|
||||
pathData.value = res.data || null
|
||||
store.setCurrentPath(pathData.value)
|
||||
} catch (error) {
|
||||
pathData.value = null
|
||||
}
|
||||
}
|
||||
|
||||
const goToScript = () => {
|
||||
uni.$emit('switchTab', 'script')
|
||||
}
|
||||
|
||||
watch(selectedScript, (val) => {
|
||||
if (val?.id) {
|
||||
loadPath(val.id)
|
||||
} else {
|
||||
pathData.value = null
|
||||
}
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
if (selectedScript.value?.id) {
|
||||
loadPath(selectedScript.value.id)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.path-view {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 32rpx;
|
||||
}
|
||||
|
||||
.page-title {
|
||||
font-size: 36rpx;
|
||||
font-weight: 400;
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
margin-bottom: 8rpx;
|
||||
letter-spacing: 4rpx;
|
||||
}
|
||||
|
||||
.empty-state {
|
||||
padding: 120rpx 64rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 32rpx;
|
||||
}
|
||||
|
||||
.empty-icon {
|
||||
font-size: 80rpx;
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
.empty-text {
|
||||
font-size: 24rpx;
|
||||
color: rgba(192, 132, 252, 0.5);
|
||||
font-style: italic;
|
||||
text-align: center;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.empty-btn {
|
||||
font-size: 22rpx;
|
||||
padding: 18rpx 36rpx;
|
||||
}
|
||||
|
||||
.path-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 48rpx;
|
||||
}
|
||||
|
||||
.target-card {
|
||||
padding: 40rpx;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.target-label {
|
||||
display: block;
|
||||
font-size: 18rpx;
|
||||
color: #C084FC;
|
||||
font-weight: 600;
|
||||
letter-spacing: 4rpx;
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.target-summary {
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.timeline {
|
||||
position: relative;
|
||||
padding-left: 60rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 48rpx;
|
||||
}
|
||||
|
||||
.timeline-line {
|
||||
position: absolute;
|
||||
left: 30rpx;
|
||||
top: 30rpx;
|
||||
bottom: 30rpx;
|
||||
width: 2rpx;
|
||||
background: linear-gradient(to bottom, #C084FC, rgba(192, 132, 252, 0.2), transparent);
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
.timeline-item {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.timeline-dot {
|
||||
position: absolute;
|
||||
left: -46rpx;
|
||||
top: 24rpx;
|
||||
width: 48rpx;
|
||||
height: 48rpx;
|
||||
border-radius: 50%;
|
||||
border: 2rpx solid rgba(255, 255, 255, 0.1);
|
||||
background: #0F071A;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.timeline-dot.done {
|
||||
border-color: #C084FC;
|
||||
box-shadow: 0 0 30rpx rgba(192, 132, 252, 0.4);
|
||||
}
|
||||
|
||||
.dot-inner {
|
||||
width: 16rpx;
|
||||
height: 16rpx;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.dot-inner.done {
|
||||
background: #C084FC;
|
||||
}
|
||||
|
||||
.dot-inner.pulse {
|
||||
animation: pulse 2s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes pulse {
|
||||
0%, 100% { opacity: 1; transform: scale(1); }
|
||||
50% { opacity: 0.6; transform: scale(1.2); }
|
||||
}
|
||||
|
||||
.step-card {
|
||||
padding: 32rpx;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.step-card.done {
|
||||
opacity: 1;
|
||||
border-color: rgba(192, 132, 252, 0.3);
|
||||
}
|
||||
|
||||
.step-phase {
|
||||
display: block;
|
||||
font-size: 18rpx;
|
||||
color: #C084FC;
|
||||
font-weight: 600;
|
||||
letter-spacing: 4rpx;
|
||||
margin-bottom: 12rpx;
|
||||
}
|
||||
|
||||
.step-task {
|
||||
display: block;
|
||||
font-size: 30rpx;
|
||||
font-weight: 500;
|
||||
color: rgba(255, 255, 255, 0.95);
|
||||
margin-bottom: 12rpx;
|
||||
}
|
||||
|
||||
.step-desc {
|
||||
display: block;
|
||||
font-size: 22rpx;
|
||||
color: rgba(255, 255, 255, 0.5);
|
||||
line-height: 1.5;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,277 @@
|
||||
<template>
|
||||
<view class="record-view">
|
||||
<view class="input-card glass-card">
|
||||
<view class="card-header">
|
||||
<view class="dot"></view>
|
||||
<text class="card-title">记叙当下</text>
|
||||
</view>
|
||||
|
||||
<input
|
||||
class="title-input"
|
||||
placeholder="为这段记忆命名"
|
||||
v-model="newEvent.title"
|
||||
/>
|
||||
|
||||
<picker class="date-picker" mode="date" :value="newEvent.time" @change="onDateChange">
|
||||
<view class="date-value">{{ newEvent.time || '选择日期' }}</view>
|
||||
</picker>
|
||||
|
||||
<textarea
|
||||
class="content-textarea"
|
||||
placeholder="此刻的心境或发生的事..."
|
||||
v-model="newEvent.content"
|
||||
rows="3"
|
||||
/>
|
||||
|
||||
<button
|
||||
class="btn-primary save-btn"
|
||||
:disabled="!canSave"
|
||||
:class="{ disabled: !canSave }"
|
||||
@click="saveEvent"
|
||||
>
|
||||
镌刻至星海
|
||||
</button>
|
||||
</view>
|
||||
|
||||
<view class="events-list">
|
||||
<view
|
||||
v-for="event in events"
|
||||
:key="event.id"
|
||||
class="event-card glass-card"
|
||||
>
|
||||
<view class="event-header">
|
||||
<text class="event-title">{{ event.title }}</text>
|
||||
<text class="event-date">{{ event.time }}</text>
|
||||
</view>
|
||||
|
||||
<text class="event-content">{{ event.content }}</text>
|
||||
|
||||
<view class="ai-reply">
|
||||
<view class="ai-header">
|
||||
<text class="ai-icon">✨</text>
|
||||
<text class="ai-title">Life Harmony AI</text>
|
||||
</view>
|
||||
<text class="ai-content" :class="{ typing: event.isNew }">
|
||||
{{ event.aiFeedback }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, onMounted } from 'vue'
|
||||
import { useAppStore } from '../../stores/app.js'
|
||||
|
||||
const store = useAppStore()
|
||||
|
||||
const newEvent = ref({
|
||||
title: '',
|
||||
time: getTodayDate(),
|
||||
content: ''
|
||||
})
|
||||
|
||||
const events = computed(() => store.events)
|
||||
|
||||
const canSave = computed(() => {
|
||||
return newEvent.value.title && newEvent.value.content
|
||||
})
|
||||
|
||||
function getTodayDate() {
|
||||
const today = new Date()
|
||||
return today.toISOString().split('T')[0]
|
||||
}
|
||||
|
||||
const onDateChange = (e) => {
|
||||
newEvent.value.time = e.detail.value
|
||||
}
|
||||
|
||||
const saveEvent = async () => {
|
||||
if (!canSave.value) return
|
||||
|
||||
const eventData = {
|
||||
...newEvent.value,
|
||||
aiFeedback: '星河守望者正在解读这段紫色波频...',
|
||||
isNew: true
|
||||
}
|
||||
|
||||
await store.createEvent(eventData)
|
||||
|
||||
newEvent.value = {
|
||||
title: '',
|
||||
time: getTodayDate(),
|
||||
content: ''
|
||||
}
|
||||
|
||||
setTimeout(async () => {
|
||||
const fullReply = `这段记忆碎片在星海中漾起涟漪。你在${eventData.title}中展现的特质，正在重新定义你人生OS的底层代码。继续保持这份觉知。`
|
||||
eventData.aiFeedback = fullReply
|
||||
eventData.isNew = false
|
||||
await store.fetchEvents()
|
||||
}, 1500)
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
store.fetchEvents()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.record-view {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 32rpx;
|
||||
}
|
||||
|
||||
.input-card {
|
||||
padding: 32rpx;
|
||||
}
|
||||
|
||||
.card-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12rpx;
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.dot {
|
||||
width: 16rpx;
|
||||
height: 16rpx;
|
||||
background: #C084FC;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.card-title {
|
||||
font-size: 18rpx;
|
||||
color: rgba(192, 132, 252, 0.8);
|
||||
font-weight: 600;
|
||||
letter-spacing: 4rpx;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.title-input {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
background: transparent;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.12);
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
font-size: 28rpx;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.title-input::placeholder {
|
||||
color: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
.date-picker {
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.date-value {
|
||||
font-size: 22rpx;
|
||||
color: rgba(168, 85, 247, 0.6);
|
||||
}
|
||||
|
||||
.content-textarea {
|
||||
width: 100%;
|
||||
height: 160rpx;
|
||||
background: transparent;
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
font-size: 26rpx;
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.content-textarea::placeholder {
|
||||
color: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
.save-btn {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
background: linear-gradient(90deg, rgba(147, 51, 234, 0.4), rgba(124, 58, 237, 0.4));
|
||||
border: 1px solid rgba(168, 85, 247, 0.3);
|
||||
}
|
||||
|
||||
.save-btn.disabled {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.events-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 24rpx;
|
||||
}
|
||||
|
||||
.event-card {
|
||||
padding: 32rpx;
|
||||
}
|
||||
|
||||
.event-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.event-title {
|
||||
font-size: 30rpx;
|
||||
font-weight: 500;
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
|
||||
.event-date {
|
||||
font-size: 20rpx;
|
||||
color: rgba(168, 85, 247, 0.5);
|
||||
}
|
||||
|
||||
.event-content {
|
||||
display: block;
|
||||
font-size: 26rpx;
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
line-height: 1.6;
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.ai-reply {
|
||||
background: rgba(168, 85, 247, 0.08);
|
||||
border: 1px solid rgba(168, 85, 247, 0.2);
|
||||
border-radius: 20rpx;
|
||||
padding: 24rpx;
|
||||
}
|
||||
|
||||
.ai-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8rpx;
|
||||
margin-bottom: 12rpx;
|
||||
}
|
||||
|
||||
.ai-icon {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.ai-title {
|
||||
font-size: 18rpx;
|
||||
color: rgba(192, 132, 252, 0.8);
|
||||
font-weight: 600;
|
||||
letter-spacing: 4rpx;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.ai-content {
|
||||
font-size: 22rpx;
|
||||
color: rgba(243, 232, 255, 0.8);
|
||||
font-style: italic;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.ai-content.typing {
|
||||
animation: typing 2s ease-out;
|
||||
}
|
||||
|
||||
@keyframes typing {
|
||||
from { opacity: 0; transform: translateY(10rpx); }
|
||||
to { opacity: 1; transform: translateY(0); }
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,576 @@
|
||||
<template>
|
||||
<view class="script-view">
|
||||
<text class="page-title font-serif">剧本生成器</text>
|
||||
|
||||
<view class="section-card glass-card">
|
||||
<view class="section-header">
|
||||
<text class="section-title">我的基础人设</text>
|
||||
<text class="section-hint">可自由修改</text>
|
||||
</view>
|
||||
|
||||
<view class="profile-grid">
|
||||
<input
|
||||
class="glass-input"
|
||||
placeholder="姓名"
|
||||
v-model="nickname"
|
||||
/>
|
||||
<picker class="glass-picker" mode="selector" :range="zodiacOptions" :value="zodiacIndex" @change="onZodiacChange">
|
||||
<view class="picker-value">{{ registrationData.zodiac || '星座' }}</view>
|
||||
</picker>
|
||||
<picker class="glass-picker" mode="selector" :range="mbtiOptions" :value="mbtiIndex" @change="onMbtiChange">
|
||||
<view class="picker-value">{{ registrationData.mbti || 'MBTI' }}</view>
|
||||
</picker>
|
||||
<input
|
||||
class="glass-input"
|
||||
placeholder="职业"
|
||||
v-model="profession"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="section-card glass-card">
|
||||
<view class="input-group">
|
||||
<text class="label">剧本主题</text>
|
||||
<input
|
||||
class="glass-input"
|
||||
placeholder="如：巅峰重现、治愈之旅、赛博觉醒..."
|
||||
v-model="scriptConfig.theme"
|
||||
/>
|
||||
</view>
|
||||
|
||||
<view class="input-group">
|
||||
<view class="npc-header">
|
||||
<text class="label">关键配角/新的人设</text>
|
||||
<button class="add-btn" @click="addNpc">+ 添加</button>
|
||||
</view>
|
||||
|
||||
<view class="npc-form">
|
||||
<input
|
||||
class="glass-input npc-input"
|
||||
placeholder="姓名"
|
||||
v-model="npcConfig.name"
|
||||
/>
|
||||
<picker class="glass-picker npc-picker" mode="selector" :range="npcRoleOptions" :value="npcRoleIndex" @change="onNpcRoleChange">
|
||||
<view class="picker-value">{{ npcConfig.role || '角色' }}</view>
|
||||
</picker>
|
||||
<picker class="glass-picker npc-picker" mode="selector" :range="npcRelationOptions" :value="npcRelationIndex" @change="onNpcRelationChange">
|
||||
<view class="picker-value">{{ npcConfig.relation || '关系' }}</view>
|
||||
</picker>
|
||||
</view>
|
||||
|
||||
<textarea
|
||||
class="glass-textarea"
|
||||
placeholder="自由描述TA的人设特点或关键剧情点..."
|
||||
v-model="npcConfig.desc"
|
||||
rows="2"
|
||||
/>
|
||||
|
||||
<view class="npc-list">
|
||||
<view
|
||||
v-for="(npc, index) in customNpcs"
|
||||
:key="index"
|
||||
class="npc-tag"
|
||||
>
|
||||
<text>{{ npc.name }} ({{ npc.role }})</text>
|
||||
<text class="delete-btn" @click="removeNpc(index)">×</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="params-row">
|
||||
<view class="param-group">
|
||||
<text class="param-label">叙事风格</text>
|
||||
<view class="param-options">
|
||||
<text
|
||||
v-for="style in scriptStyles"
|
||||
:key="style"
|
||||
class="param-option"
|
||||
:class="{ active: scriptConfig.style === style }"
|
||||
@click="scriptConfig.style = style"
|
||||
>
|
||||
{{ style }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="param-group">
|
||||
<text class="param-label">故事篇幅</text>
|
||||
<view class="param-options">
|
||||
<text
|
||||
v-for="length in scriptLengths"
|
||||
:key="length"
|
||||
class="param-option"
|
||||
:class="{ active: scriptConfig.length === length }"
|
||||
@click="scriptConfig.length = length"
|
||||
>
|
||||
{{ length }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<button
|
||||
class="btn-primary generate-btn"
|
||||
:loading="isGenerating"
|
||||
:disabled="isGenerating || !scriptConfig.theme"
|
||||
@click="generateScript"
|
||||
>
|
||||
<text v-if="isGenerating">命运编织中...</text>
|
||||
<text v-else>生成平行人生剧本</text>
|
||||
</button>
|
||||
</view>
|
||||
|
||||
<view v-if="scripts.length > 0" class="scripts-list">
|
||||
<view
|
||||
v-for="script in scripts"
|
||||
:key="script.id"
|
||||
class="script-card glass-card"
|
||||
:class="{ selected: script.isSelected }"
|
||||
>
|
||||
<view class="script-header">
|
||||
<text class="script-title">{{ script.title }}</text>
|
||||
<text class="script-persona">{{ script.theme || '追光者' }}</text>
|
||||
</view>
|
||||
|
||||
<text class="script-summary" lines="3">{{ getScriptSummary(script) }}</text>
|
||||
|
||||
<view class="script-footer">
|
||||
<text class="script-style">{{ script.style || '风格' }}</text>
|
||||
<button class="select-btn" @click="selectScript(script.id)">
|
||||
路径映射 →
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-else-if="!isGenerating" class="empty-state glass-card">
|
||||
<text class="empty-icon">🎬</text>
|
||||
<text class="empty-text">尚未生成剧本，定义你的未来篇章</text>
|
||||
</view>
|
||||
|
||||
<view v-if="isGenerating" class="generating-state glass-card">
|
||||
<view class="spinner"></view>
|
||||
<text class="generating-text">正在采集星海中的深紫色碎屑...</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, reactive, onMounted } from 'vue'
|
||||
import { useAppStore } from '../../stores/app.js'
|
||||
|
||||
const store = useAppStore()
|
||||
|
||||
const zodiacOptions = ['白羊座', '金牛座', '双子座', '巨蟹座', '狮子座', '处女座', '天秤座', '天蝎座', '射手座', '摩羯座', '水瓶座', '双鱼座']
|
||||
const mbtiOptions = ['INTJ', 'INTP', 'ENTJ', 'ENTP', 'INFJ', 'INFP', 'ENFJ', 'ENFP', 'ISTJ', 'ISFJ', 'ESTJ', 'ESFJ', 'ISTP', 'ISFP', 'ESTP', 'ESFP']
|
||||
const npcRoleOptions = ['伙伴', '宿敌', '导师', '挚爱', '下属', '路人']
|
||||
const npcRelationOptions = ['信任', '对立', '暧昧', '敬畏', '背叛', '守护']
|
||||
const scriptStyles = ['爽文', '治愈', '热血', '玄幻', '职场', '赛博']
|
||||
const scriptLengths = ['短篇', '中篇', '长篇', '史诗']
|
||||
|
||||
const registrationData = computed(() => store.registrationData || {})
|
||||
const scripts = computed(() => store.scripts || [])
|
||||
|
||||
const nickname = computed({
|
||||
get: () => registrationData.value.nickname || '',
|
||||
set: (val) => store.updateRegistration({ nickname: val })
|
||||
})
|
||||
|
||||
const profession = computed({
|
||||
get: () => registrationData.value.profession || '',
|
||||
set: (val) => store.updateRegistration({ profession: val })
|
||||
})
|
||||
|
||||
const zodiacIndex = computed(() => zodiacOptions.indexOf(registrationData.value.zodiac))
|
||||
const mbtiIndex = computed(() => mbtiOptions.indexOf(registrationData.value.mbti))
|
||||
|
||||
const scriptConfig = reactive({
|
||||
theme: '',
|
||||
style: '爽文',
|
||||
length: '中篇'
|
||||
})
|
||||
|
||||
const npcConfig = reactive({
|
||||
name: '',
|
||||
role: '伙伴',
|
||||
relation: '信任',
|
||||
desc: ''
|
||||
})
|
||||
|
||||
const customNpcs = ref([])
|
||||
const isGenerating = ref(false)
|
||||
|
||||
const npcRoleIndex = computed(() => npcRoleOptions.indexOf(npcConfig.role))
|
||||
const npcRelationIndex = computed(() => npcRelationOptions.indexOf(npcConfig.relation))
|
||||
|
||||
const onZodiacChange = (e) => {
|
||||
store.updateRegistration({ zodiac: zodiacOptions[e.detail.value] })
|
||||
}
|
||||
|
||||
const onMbtiChange = (e) => {
|
||||
store.updateRegistration({ mbti: mbtiOptions[e.detail.value] })
|
||||
}
|
||||
|
||||
const onNpcRoleChange = (e) => {
|
||||
npcConfig.role = npcRoleOptions[e.detail.value]
|
||||
}
|
||||
|
||||
const onNpcRelationChange = (e) => {
|
||||
npcConfig.relation = npcRelationOptions[e.detail.value]
|
||||
}
|
||||
|
||||
const addNpc = () => {
|
||||
if (npcConfig.name) {
|
||||
customNpcs.value.push({ ...npcConfig })
|
||||
npcConfig.name = ''
|
||||
npcConfig.desc = ''
|
||||
}
|
||||
}
|
||||
|
||||
const removeNpc = (index) => {
|
||||
customNpcs.value.splice(index, 1)
|
||||
}
|
||||
|
||||
const generateScript = async () => {
|
||||
if (!scriptConfig.theme || isGenerating.value) return
|
||||
|
||||
isGenerating.value = true
|
||||
|
||||
try {
|
||||
await store.createScript({
|
||||
theme: scriptConfig.theme,
|
||||
style: scriptConfig.style,
|
||||
length: scriptConfig.length,
|
||||
character: registrationData.value,
|
||||
events: store.events
|
||||
})
|
||||
scriptConfig.theme = ''
|
||||
} finally {
|
||||
isGenerating.value = false
|
||||
}
|
||||
}
|
||||
|
||||
const selectScript = async (id) => {
|
||||
await store.selectScript(id)
|
||||
uni.$emit('switchTab', 'path')
|
||||
}
|
||||
|
||||
const getScriptSummary = (script) => {
|
||||
const text = script.summary || script.content || ''
|
||||
return text.replace(/\s+/g, ' ').trim()
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
await store.fetchUserProfile()
|
||||
await store.fetchEvents()
|
||||
await store.fetchScripts()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.script-view {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 32rpx;
|
||||
}
|
||||
|
||||
.page-title {
|
||||
font-size: 36rpx;
|
||||
font-weight: 400;
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
margin-bottom: 8rpx;
|
||||
letter-spacing: 4rpx;
|
||||
}
|
||||
|
||||
.section-card {
|
||||
padding: 32rpx;
|
||||
}
|
||||
|
||||
.section-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 22rpx;
|
||||
color: rgba(192, 132, 252, 0.6);
|
||||
font-weight: 600;
|
||||
letter-spacing: 4rpx;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.section-hint {
|
||||
font-size: 16rpx;
|
||||
color: rgba(255, 255, 255, 0.35);
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.profile-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 16rpx;
|
||||
}
|
||||
|
||||
.glass-input, .glass-picker {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-radius: 16rpx;
|
||||
padding: 0 24rpx;
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.glass-input::placeholder {
|
||||
color: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
.picker-value {
|
||||
line-height: 80rpx;
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
|
||||
.input-group {
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.label {
|
||||
display: block;
|
||||
font-size: 18rpx;
|
||||
color: rgba(255, 255, 255, 0.35);
|
||||
font-weight: 600;
|
||||
letter-spacing: 4rpx;
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.npc-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.add-btn {
|
||||
font-size: 20rpx;
|
||||
color: #C084FC;
|
||||
border: 1px solid rgba(192, 132, 252, 0.3);
|
||||
padding: 8rpx 16rpx;
|
||||
border-radius: 12rpx;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.npc-form {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
gap: 12rpx;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.npc-input, .npc-picker {
|
||||
height: 72rpx;
|
||||
padding: 0 16rpx;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.npc-picker .picker-value {
|
||||
line-height: 72rpx;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.glass-textarea {
|
||||
width: 100%;
|
||||
height: 120rpx;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-radius: 16rpx;
|
||||
padding: 20rpx;
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
font-size: 24rpx;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.npc-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 12rpx;
|
||||
}
|
||||
|
||||
.npc-tag {
|
||||
background: rgba(168, 85, 247, 0.1);
|
||||
border: 1px solid rgba(168, 85, 247, 0.3);
|
||||
border-radius: 24rpx;
|
||||
padding: 8rpx 20rpx;
|
||||
font-size: 20rpx;
|
||||
color: rgba(243, 232, 255, 0.8);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8rpx;
|
||||
}
|
||||
|
||||
.delete-btn {
|
||||
color: rgba(255, 255, 255, 0.4);
|
||||
font-size: 28rpx;
|
||||
padding: 0 4rpx;
|
||||
}
|
||||
|
||||
.params-row {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 24rpx;
|
||||
margin-bottom: 32rpx;
|
||||
}
|
||||
|
||||
.param-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12rpx;
|
||||
}
|
||||
|
||||
.param-label {
|
||||
font-size: 18rpx;
|
||||
color: rgba(255, 255, 255, 0.35);
|
||||
margin-left: 8rpx;
|
||||
}
|
||||
|
||||
.param-options {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 12rpx;
|
||||
}
|
||||
|
||||
.param-option {
|
||||
padding: 10rpx 20rpx;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-radius: 16rpx;
|
||||
font-size: 22rpx;
|
||||
color: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.param-option.active {
|
||||
background: rgba(168, 85, 247, 0.2);
|
||||
border-color: rgba(168, 85, 247, 0.5);
|
||||
color: #C084FC;
|
||||
}
|
||||
|
||||
.generate-btn {
|
||||
width: 100%;
|
||||
height: 96rpx;
|
||||
box-shadow: 0 8rpx 40rpx rgba(168, 85, 247, 0.3);
|
||||
}
|
||||
|
||||
.scripts-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 24rpx;
|
||||
}
|
||||
|
||||
.script-card {
|
||||
padding: 32rpx;
|
||||
border-left: 4rpx solid transparent;
|
||||
}
|
||||
|
||||
.script-card.selected {
|
||||
border-left-color: #C084FC;
|
||||
}
|
||||
|
||||
.script-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.script-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: 500;
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
|
||||
.script-persona {
|
||||
font-size: 18rpx;
|
||||
color: rgba(168, 85, 247, 0.6);
|
||||
background: rgba(168, 85, 247, 0.1);
|
||||
padding: 6rpx 16rpx;
|
||||
border-radius: 12rpx;
|
||||
border: 1px solid rgba(168, 85, 247, 0.2);
|
||||
}
|
||||
|
||||
.script-summary {
|
||||
display: block;
|
||||
font-size: 24rpx;
|
||||
color: rgba(255, 255, 255, 0.5);
|
||||
line-height: 1.6;
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.script-footer {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.script-style {
|
||||
font-size: 20rpx;
|
||||
color: #C084FC;
|
||||
}
|
||||
|
||||
.select-btn {
|
||||
font-size: 24rpx;
|
||||
color: #C084FC;
|
||||
font-weight: 600;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.empty-state {
|
||||
padding: 80rpx 48rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 24rpx;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.empty-icon {
|
||||
font-size: 64rpx;
|
||||
}
|
||||
|
||||
.empty-text {
|
||||
font-size: 24rpx;
|
||||
color: rgba(255, 255, 255, 0.5);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.generating-state {
|
||||
padding: 80rpx 48rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 32rpx;
|
||||
}
|
||||
|
||||
.spinner {
|
||||
width: 64rpx;
|
||||
height: 64rpx;
|
||||
border: 4rpx solid #A855F7;
|
||||
border-top-color: transparent;
|
||||
border-radius: 50%;
|
||||
animation: spin 0.8s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
from { transform: rotate(0deg); }
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
.generating-text {
|
||||
font-size: 26rpx;
|
||||
color: rgba(192, 132, 252, 0.6);
|
||||
font-style: italic;
|
||||
letter-spacing: 2rpx;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,273 @@
|
||||
<template>
|
||||
<view class="main-page">
|
||||
<view class="bg-decoration">
|
||||
<view class="aurora-top"></view>
|
||||
<view class="aurora-bottom"></view>
|
||||
</view>
|
||||
|
||||
<view class="header" :style="{ paddingTop: safeAreaTop + 20 + 'px' }">
|
||||
<view class="header-left">
|
||||
<view class="logo-box">
|
||||
<image class="logo" src="/static/logo.svg" mode="aspectFit" />
|
||||
</view>
|
||||
<view class="brand">
|
||||
<text class="brand-title font-serif">人生OS</text>
|
||||
<text class="brand-subtitle">LIFE HARMONY v3.1</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="header-right" @click="goToProfile">
|
||||
<view class="avatar-box">
|
||||
<image class="avatar" :src="userAvatar" mode="aspectFill" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<scroll-view class="page-content" scroll-y>
|
||||
<view v-if="activeTab === 'record'" class="tab-page">
|
||||
<RecordView></RecordView>
|
||||
</view>
|
||||
|
||||
<view v-if="activeTab === 'script'" class="tab-page">
|
||||
<ScriptView></ScriptView>
|
||||
</view>
|
||||
|
||||
<view v-if="activeTab === 'path'" class="tab-page">
|
||||
<PathView></PathView>
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
<view class="bottom-nav" :style="{ paddingBottom: safeAreaBottom + 'px' }">
|
||||
<view
|
||||
class="nav-item"
|
||||
:class="{ active: activeTab === 'record' }"
|
||||
@click="switchTab('record')"
|
||||
>
|
||||
<text class="nav-icon">📖</text>
|
||||
<text class="nav-label">回溯过去</text>
|
||||
</view>
|
||||
<view
|
||||
class="nav-item"
|
||||
:class="{ active: activeTab === 'script' }"
|
||||
@click="switchTab('script')"
|
||||
>
|
||||
<text class="nav-icon">✨</text>
|
||||
<text class="nav-label">创造未来</text>
|
||||
</view>
|
||||
<view
|
||||
class="nav-item"
|
||||
:class="{ active: activeTab === 'path' }"
|
||||
@click="switchTab('path')"
|
||||
>
|
||||
<text class="nav-icon">🗺️</text>
|
||||
<text class="nav-label">路径实现</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, onMounted, onUnmounted } from 'vue'
|
||||
import { useAppStore } from '../../stores/app.js'
|
||||
import RecordView from './RecordView.vue'
|
||||
import ScriptView from './ScriptView.vue'
|
||||
import PathView from './PathView.vue'
|
||||
|
||||
const store = useAppStore()
|
||||
const activeTab = ref('record')
|
||||
|
||||
const safeAreaTop = ref(uni.getStorageSync('safeAreaTop') || 20)
|
||||
const safeAreaBottom = ref(uni.getStorageSync('safeAreaBottom') || 0)
|
||||
|
||||
onMounted(() => {
|
||||
const systemInfo = uni.getSystemInfoSync()
|
||||
safeAreaTop.value = systemInfo.safeAreaInsets?.top || systemInfo.statusBarHeight || 20
|
||||
safeAreaBottom.value = systemInfo.safeAreaInsets?.bottom || 0
|
||||
|
||||
store.initialize()
|
||||
uni.$on('switchTab', switchTab)
|
||||
})
|
||||
|
||||
const userAvatar = computed(() => {
|
||||
const nickname = store.userProfile?.nickname || 'user'
|
||||
return `https://api.dicebear.com/7.x/avataaars/svg?seed=${nickname}&backgroundColor=A855F7`
|
||||
})
|
||||
|
||||
const switchTab = (tab) => {
|
||||
activeTab.value = tab
|
||||
}
|
||||
|
||||
onUnmounted(() => {
|
||||
uni.$off('switchTab', switchTab)
|
||||
})
|
||||
|
||||
const goToProfile = () => {
|
||||
uni.navigateTo({ url: '/pages/profile/index' })
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.main-page {
|
||||
min-height: 100vh;
|
||||
background: linear-gradient(180deg, #0F071A 0%, #1A0B2E 50%, #0F071A 100%);
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.bg-decoration {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.aurora-top {
|
||||
position: absolute;
|
||||
top: -10%;
|
||||
left: -10%;
|
||||
width: 120%;
|
||||
height: 60%;
|
||||
background: rgba(168, 85, 247, 0.08);
|
||||
filter: blur(120rpx);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.aurora-bottom {
|
||||
position: absolute;
|
||||
bottom: -10%;
|
||||
right: -10%;
|
||||
width: 100%;
|
||||
height: 50%;
|
||||
background: rgba(139, 92, 246, 0.05);
|
||||
filter: blur(100rpx);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.header {
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 24rpx 32rpx;
|
||||
padding-top: calc(24rpx + constant(safe-area-inset-top));
|
||||
padding-top: calc(24rpx + env(safe-area-inset-top));
|
||||
background: rgba(15, 7, 26, 0.6);
|
||||
backdrop-filter: blur(20rpx);
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
|
||||
}
|
||||
|
||||
.header-left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16rpx;
|
||||
}
|
||||
|
||||
.logo-box {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
border-radius: 20rpx;
|
||||
background: linear-gradient(135deg, #9333EA 0%, #7C3AED 100%);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.logo {
|
||||
width: 64rpx;
|
||||
height: 64rpx;
|
||||
}
|
||||
|
||||
.brand-title {
|
||||
display: block;
|
||||
font-size: 26rpx;
|
||||
font-weight: 600;
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
letter-spacing: 6rpx;
|
||||
}
|
||||
|
||||
.brand-subtitle {
|
||||
display: block;
|
||||
font-size: 16rpx;
|
||||
color: rgba(168, 85, 247, 0.6);
|
||||
letter-spacing: 4rpx;
|
||||
}
|
||||
|
||||
.avatar-box {
|
||||
width: 72rpx;
|
||||
height: 72rpx;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.page-content {
|
||||
flex: 1;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.tab-page {
|
||||
padding: 32rpx;
|
||||
padding-bottom: calc(180rpx + constant(safe-area-inset-bottom));
|
||||
padding-bottom: calc(180rpx + env(safe-area-inset-bottom));
|
||||
}
|
||||
|
||||
.bottom-nav {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 140rpx;
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
background: rgba(15, 7, 26, 0.95);
|
||||
backdrop-filter: blur(40rpx);
|
||||
-webkit-backdrop-filter: blur(40rpx);
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.08);
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.nav-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 6rpx;
|
||||
padding: 16rpx 32rpx;
|
||||
color: rgba(255, 255, 255, 0.4);
|
||||
transition: all 0.3s ease;
|
||||
min-width: 160rpx;
|
||||
}
|
||||
|
||||
.nav-item.active {
|
||||
color: #C084FC;
|
||||
transform: translateY(-8rpx);
|
||||
}
|
||||
|
||||
.nav-icon {
|
||||
font-size: 40rpx;
|
||||
}
|
||||
|
||||
.nav-label {
|
||||
font-size: 18rpx;
|
||||
font-weight: 600;
|
||||
letter-spacing: 4rpx;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.safe-area-bottom {
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,657 @@
|
||||
<template>
|
||||
<view class="onboarding-page">
|
||||
<view class="bg-decoration">
|
||||
<view class="aurora-top"></view>
|
||||
<view class="aurora-bottom"></view>
|
||||
</view>
|
||||
|
||||
<view class="content" :style="{ paddingTop: safeAreaTop + 20 + 'px', paddingBottom: safeAreaBottom + 20 + 'px' }">
|
||||
<scroll-view class="step-content" scroll-y>
|
||||
<view class="step-inner">
|
||||
<view v-if="currentStep === 1" class="step animate-fade-in">
|
||||
<view class="step-header">
|
||||
<text class="step-title font-serif">系统初始化</text>
|
||||
<text class="step-subtitle">定义你在人生OS中的唯一代码</text>
|
||||
</view>
|
||||
|
||||
<view class="form-grid">
|
||||
<view class="input-group">
|
||||
<text class="label">你的昵称</text>
|
||||
<input
|
||||
class="glass-input"
|
||||
placeholder="输入昵称"
|
||||
v-model="formData.nickname"
|
||||
/>
|
||||
</view>
|
||||
|
||||
<view class="input-group">
|
||||
<text class="label">性别</text>
|
||||
<picker class="glass-picker" mode="selector" :range="genderOptions" :value="genderIndex" @change="onGenderChange">
|
||||
<view class="picker-value">{{ formData.gender || '请选择' }}</view>
|
||||
</picker>
|
||||
</view>
|
||||
|
||||
<view class="input-group">
|
||||
<text class="label">星座</text>
|
||||
<picker class="glass-picker" mode="selector" :range="zodiacOptions" :value="zodiacIndex" @change="onZodiacChange">
|
||||
<view class="picker-value">{{ formData.zodiac || '请选择' }}</view>
|
||||
</picker>
|
||||
</view>
|
||||
|
||||
<view class="input-group">
|
||||
<text class="label">MBTI人格</text>
|
||||
<picker class="glass-picker" mode="selector" :range="mbtiOptions" :value="mbtiIndex" @change="onMbtiChange">
|
||||
<view class="picker-value">{{ formData.mbti || '请选择' }}</view>
|
||||
</picker>
|
||||
</view>
|
||||
|
||||
<view class="input-group full-width">
|
||||
<text class="label">兴趣爱好</text>
|
||||
<input
|
||||
class="glass-input"
|
||||
placeholder="用逗号分隔，如：阅读，旅行，摄影"
|
||||
v-model="hobbiesText"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="currentStep === 2" class="step animate-fade-in">
|
||||
<view class="step-header">
|
||||
<text class="step-title font-serif">回溯起源</text>
|
||||
<text class="step-subtitle">一段让你感到温暖的早期时光</text>
|
||||
</view>
|
||||
|
||||
<view class="memory-form">
|
||||
<view class="input-group">
|
||||
<text class="label">日期</text>
|
||||
<picker class="glass-picker" mode="date" :value="formData.childhood.date" @change="onChildhoodDateChange">
|
||||
<view class="picker-value">{{ formData.childhood.date || '请选择日期' }}</view>
|
||||
</picker>
|
||||
</view>
|
||||
|
||||
<view class="input-group">
|
||||
<text class="label">回忆一段具体且温暖的午后...</text>
|
||||
<textarea
|
||||
class="glass-textarea"
|
||||
rows="4"
|
||||
placeholder="描述那段时光..."
|
||||
v-model="formData.childhood.text"
|
||||
/>
|
||||
</view>
|
||||
|
||||
<view class="hint-section">
|
||||
<view class="hint-title">
|
||||
<text class="icon">✨</text>
|
||||
<text>灵感气泡</text>
|
||||
</view>
|
||||
<view class="hint-tags">
|
||||
<text
|
||||
v-for="(hint, index) in childhoodHints"
|
||||
:key="index"
|
||||
class="hint-tag"
|
||||
@click="addChildhoodHint(hint)"
|
||||
>
|
||||
{{ hint }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="currentStep === 3" class="step animate-fade-in">
|
||||
<view class="step-header">
|
||||
<text class="step-title font-serif">悦然时刻</text>
|
||||
<text class="step-subtitle">一段感受到生命跃动的经历</text>
|
||||
</view>
|
||||
|
||||
<view class="memory-form">
|
||||
<view class="input-group">
|
||||
<text class="label">日期</text>
|
||||
<picker class="glass-picker" mode="date" :value="formData.joy.date" @change="onJoyDateChange">
|
||||
<view class="picker-value">{{ formData.joy.date || '请选择日期' }}</view>
|
||||
</picker>
|
||||
</view>
|
||||
|
||||
<view class="input-group">
|
||||
<text class="label">想一个令你会心一笑的瞬间...</text>
|
||||
<textarea
|
||||
class="glass-textarea"
|
||||
rows="4"
|
||||
placeholder="描述那个瞬间..."
|
||||
v-model="formData.joy.text"
|
||||
/>
|
||||
</view>
|
||||
|
||||
<view class="hint-section">
|
||||
<view class="hint-title">
|
||||
<text class="icon">✨</text>
|
||||
<text>灵感气泡</text>
|
||||
</view>
|
||||
<view class="hint-tags">
|
||||
<text
|
||||
v-for="(hint, index) in joyHints"
|
||||
:key="index"
|
||||
class="hint-tag"
|
||||
@click="addJoyHint(hint)"
|
||||
>
|
||||
{{ hint }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="currentStep === 4" class="step animate-fade-in">
|
||||
<view class="step-header">
|
||||
<text class="step-title font-serif">破茧成蝶</text>
|
||||
<text class="step-subtitle">在宁静中默默积蓄力量的日子</text>
|
||||
</view>
|
||||
|
||||
<view class="memory-form">
|
||||
<view class="input-group">
|
||||
<text class="label">日期</text>
|
||||
<picker class="glass-picker" mode="date" :value="formData.low.date" @change="onLowDateChange">
|
||||
<view class="picker-value">{{ formData.low.date || '请选择日期' }}</view>
|
||||
</picker>
|
||||
</view>
|
||||
|
||||
<view class="input-group">
|
||||
<text class="label">描述那段有些艰难但让你成长的日子...</text>
|
||||
<textarea
|
||||
class="glass-textarea"
|
||||
rows="4"
|
||||
placeholder="描述那段经历..."
|
||||
v-model="formData.low.text"
|
||||
/>
|
||||
</view>
|
||||
|
||||
<view class="hint-section">
|
||||
<view class="hint-title">
|
||||
<text class="icon">✨</text>
|
||||
<text>灵感气泡</text>
|
||||
</view>
|
||||
<view class="hint-tags">
|
||||
<text
|
||||
v-for="(hint, index) in lowHints"
|
||||
:key="index"
|
||||
class="hint-tag"
|
||||
@click="addLowHint(hint)"
|
||||
>
|
||||
{{ hint }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="currentStep === 5" class="step animate-fade-in">
|
||||
<view class="step-header">
|
||||
<text class="step-title font-serif">未来憧憬</text>
|
||||
<text class="step-subtitle">对未来理想生活状态的预见</text>
|
||||
</view>
|
||||
|
||||
<view class="memory-form">
|
||||
<view class="input-group">
|
||||
<text class="label">你想成为怎样的人？</text>
|
||||
<textarea
|
||||
class="glass-textarea"
|
||||
rows="3"
|
||||
placeholder="描述你对未来的愿景..."
|
||||
v-model="formData.future.vision"
|
||||
/>
|
||||
</view>
|
||||
|
||||
<view class="input-group">
|
||||
<text class="label">你的理想生活状态</text>
|
||||
<textarea
|
||||
class="glass-textarea"
|
||||
rows="3"
|
||||
placeholder="描述理想的一天..."
|
||||
v-model="formData.future.ideal"
|
||||
/>
|
||||
</view>
|
||||
|
||||
<view class="quote-box">
|
||||
<text class="quote-icon">✨</text>
|
||||
<text class="quote-text">"照见未来，便是创造的开始。"</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
<view class="bottom-bar">
|
||||
<view class="step-dots">
|
||||
<view
|
||||
v-for="step in 5"
|
||||
:key="step"
|
||||
class="step-dot"
|
||||
:class="{ active: currentStep === step }"
|
||||
/>
|
||||
</view>
|
||||
|
||||
<view class="actions">
|
||||
<button
|
||||
v-if="currentStep > 1"
|
||||
class="btn-secondary"
|
||||
@click="prevStep"
|
||||
>
|
||||
返回
|
||||
</button>
|
||||
|
||||
<button
|
||||
class="btn-primary next-btn"
|
||||
:loading="isSaving"
|
||||
@click="nextStep"
|
||||
>
|
||||
<text v-if="currentStep === 5">{{ isSaving ? '保存中...' : '开启人生' }}</text>
|
||||
<text v-else>继续</text>
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, reactive, onMounted, watch } from 'vue'
|
||||
import { useAppStore } from '../../stores/app.js'
|
||||
import * as lifeEventService from '../../services/lifeEvent.js'
|
||||
|
||||
const store = useAppStore()
|
||||
|
||||
const safeAreaTop = ref(uni.getStorageSync('safeAreaTop') || 20)
|
||||
const safeAreaBottom = ref(uni.getStorageSync('safeAreaBottom') || 0)
|
||||
|
||||
onMounted(async () => {
|
||||
const systemInfo = uni.getSystemInfoSync()
|
||||
safeAreaTop.value = systemInfo.safeAreaInsets?.top || systemInfo.statusBarHeight || 20
|
||||
safeAreaBottom.value = systemInfo.safeAreaInsets?.bottom || 0
|
||||
await store.fetchUserProfile()
|
||||
Object.assign(formData, store.registrationData)
|
||||
currentStep.value = store.currentStep || 1
|
||||
})
|
||||
|
||||
const currentStep = ref(store.currentStep || 1)
|
||||
const isSaving = ref(false)
|
||||
|
||||
const formData = reactive({
|
||||
nickname: '',
|
||||
gender: '',
|
||||
mbti: '',
|
||||
zodiac: '',
|
||||
profession: '',
|
||||
hobbies: [],
|
||||
childhood: { date: '', text: '' },
|
||||
joy: { date: '', text: '' },
|
||||
low: { date: '', text: '' },
|
||||
future: { vision: '', ideal: '' }
|
||||
})
|
||||
|
||||
const genderOptions = ['男', '女']
|
||||
const zodiacOptions = ['白羊座', '金牛座', '双子座', '巨蟹座', '狮子座', '处女座', '天秤座', '天蝎座', '射手座', '摩羯座', '水瓶座', '双鱼座']
|
||||
const mbtiOptions = ['INTJ', 'INTP', 'ENTJ', 'ENTP', 'INFJ', 'INFP', 'ENFJ', 'ENFP', 'ISTJ', 'ISFJ', 'ESTJ', 'ESFJ', 'ISTP', 'ISFP', 'ESTP', 'ESFP']
|
||||
|
||||
const childhoodHints = ['秘密花园', '老旧弄堂', '秋千', '夏蝉', '被保护的', '好奇心']
|
||||
const joyHints = ['突破', '共鸣', '清晨阳光', '认可', '旅行终点', '深呼吸']
|
||||
const lowHints = ['迷茫', '无力感', '雨后街道', '重新出发', '裂痕中的光', '蜕变']
|
||||
|
||||
const hobbiesText = computed({
|
||||
get: () => formData.hobbies.join('，'),
|
||||
set: (val) => {
|
||||
formData.hobbies = val.split(/[,，]/).map(s => s.trim()).filter(s => s)
|
||||
}
|
||||
})
|
||||
|
||||
const genderIndex = computed(() => genderOptions.indexOf(formData.gender))
|
||||
const zodiacIndex = computed(() => zodiacOptions.indexOf(formData.zodiac))
|
||||
const mbtiIndex = computed(() => mbtiOptions.indexOf(formData.mbti))
|
||||
|
||||
const onGenderChange = (e) => {
|
||||
formData.gender = genderOptions[e.detail.value]
|
||||
}
|
||||
|
||||
const onZodiacChange = (e) => {
|
||||
formData.zodiac = zodiacOptions[e.detail.value]
|
||||
}
|
||||
|
||||
const onMbtiChange = (e) => {
|
||||
formData.mbti = mbtiOptions[e.detail.value]
|
||||
}
|
||||
|
||||
const onChildhoodDateChange = (e) => {
|
||||
formData.childhood.date = e.detail.value
|
||||
}
|
||||
|
||||
const onJoyDateChange = (e) => {
|
||||
formData.joy.date = e.detail.value
|
||||
}
|
||||
|
||||
const onLowDateChange = (e) => {
|
||||
formData.low.date = e.detail.value
|
||||
}
|
||||
|
||||
const addChildhoodHint = (hint) => {
|
||||
formData.childhood.text += hint + ' '
|
||||
}
|
||||
|
||||
const addJoyHint = (hint) => {
|
||||
formData.joy.text += hint + ' '
|
||||
}
|
||||
|
||||
const addLowHint = (hint) => {
|
||||
formData.low.text += hint + ' '
|
||||
}
|
||||
|
||||
const prevStep = () => {
|
||||
if (currentStep.value > 1) {
|
||||
saveStepData()
|
||||
currentStep.value--
|
||||
}
|
||||
}
|
||||
|
||||
const nextStep = async () => {
|
||||
saveStepData()
|
||||
|
||||
if (currentStep.value < 5) {
|
||||
currentStep.value++
|
||||
} else {
|
||||
isSaving.value = true
|
||||
try {
|
||||
const result = await store.saveUserProfile()
|
||||
if (result.success) {
|
||||
const eventsToSave = [
|
||||
{ data: formData.childhood, type: 'childhood', title: '童年记忆' },
|
||||
{ data: formData.joy, type: 'joy', title: '光芒闪耀的时刻' },
|
||||
{ data: formData.low, type: 'low', title: '在暗夜中潜行' }
|
||||
]
|
||||
await Promise.all(
|
||||
eventsToSave.map(({ data, type, title }) => {
|
||||
if (!data?.date || !data?.text) return Promise.resolve()
|
||||
return lifeEventService.createEvent({
|
||||
title,
|
||||
time: data.date,
|
||||
content: data.text,
|
||||
eventType: 'milestone',
|
||||
tags: [type]
|
||||
})
|
||||
})
|
||||
)
|
||||
await store.fetchEvents()
|
||||
uni.showToast({ title: '欢迎开启人生OS', icon: 'success' })
|
||||
setTimeout(() => {
|
||||
uni.redirectTo({ url: '/pages/main/index' })
|
||||
}, 1500)
|
||||
} else {
|
||||
uni.showToast({ title: result.error || '保存失败', icon: 'none' })
|
||||
}
|
||||
} catch (error) {
|
||||
uni.showToast({ title: '保存失败', icon: 'none' })
|
||||
} finally {
|
||||
isSaving.value = false
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const saveStepData = () => {
|
||||
store.updateRegistration({ ...formData })
|
||||
}
|
||||
|
||||
watch(currentStep, (val) => {
|
||||
store.setCurrentStep(val)
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.onboarding-page {
|
||||
min-height: 100vh;
|
||||
background: linear-gradient(180deg, #0F071A 0%, #1A0B2E 50%, #0F071A 100%);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.bg-decoration {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.aurora-top {
|
||||
position: absolute;
|
||||
top: -10%;
|
||||
left: -10%;
|
||||
width: 120%;
|
||||
height: 60%;
|
||||
background: rgba(168, 85, 247, 0.08);
|
||||
filter: blur(120rpx);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.aurora-bottom {
|
||||
position: absolute;
|
||||
bottom: -10%;
|
||||
right: -10%;
|
||||
width: 100%;
|
||||
height: 50%;
|
||||
background: rgba(139, 92, 246, 0.05);
|
||||
filter: blur(100rpx);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.content {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 40rpx;
|
||||
padding-top: calc(40rpx + constant(safe-area-inset-top));
|
||||
padding-top: calc(40rpx + env(safe-area-inset-top));
|
||||
}
|
||||
|
||||
.step-content {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.step-inner {
|
||||
padding-bottom: 40rpx;
|
||||
}
|
||||
|
||||
.step {
|
||||
animation: fadeIn 0.5s ease-out;
|
||||
}
|
||||
|
||||
@keyframes fadeIn {
|
||||
from { opacity: 0; transform: translateY(20rpx); }
|
||||
to { opacity: 1; transform: translateY(0); }
|
||||
}
|
||||
|
||||
.step-header {
|
||||
margin-bottom: 48rpx;
|
||||
}
|
||||
|
||||
.step-title {
|
||||
display: block;
|
||||
font-size: 46rpx;
|
||||
font-weight: 400;
|
||||
color: rgba(255, 255, 255, 0.95);
|
||||
margin-bottom: 12rpx;
|
||||
letter-spacing: 4rpx;
|
||||
}
|
||||
|
||||
.step-subtitle {
|
||||
display: block;
|
||||
font-size: 24rpx;
|
||||
color: rgba(192, 132, 252, 0.6);
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.form-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 24rpx;
|
||||
}
|
||||
|
||||
.full-width {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
|
||||
.input-group {
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.label {
|
||||
display: block;
|
||||
font-size: 18rpx;
|
||||
color: rgba(255, 255, 255, 0.35);
|
||||
margin-bottom: 12rpx;
|
||||
letter-spacing: 4rpx;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.glass-input, .glass-picker {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-radius: 20rpx;
|
||||
padding: 0 24rpx;
|
||||
color: #F3E8FF;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.glass-input::placeholder {
|
||||
color: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
.picker-value {
|
||||
line-height: 88rpx;
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
}
|
||||
|
||||
.glass-textarea {
|
||||
width: 100%;
|
||||
height: 200rpx;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-radius: 20rpx;
|
||||
padding: 24rpx;
|
||||
color: #F3E8FF;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.glass-textarea::placeholder {
|
||||
color: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
.memory-form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 24rpx;
|
||||
}
|
||||
|
||||
.hint-section {
|
||||
background: rgba(168, 85, 247, 0.08);
|
||||
border: 1px solid rgba(168, 85, 247, 0.15);
|
||||
border-radius: 32rpx;
|
||||
padding: 32rpx;
|
||||
margin-top: 16rpx;
|
||||
box-shadow: inset 0 0 30rpx rgba(168, 85, 247, 0.08);
|
||||
}
|
||||
|
||||
.hint-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8rpx;
|
||||
font-size: 18rpx;
|
||||
color: rgba(192, 132, 252, 0.6);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 4rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.icon {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.hint-tags {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 16rpx;
|
||||
}
|
||||
|
||||
.hint-tag {
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-radius: 32rpx;
|
||||
padding: 10rpx 22rpx;
|
||||
font-size: 22rpx;
|
||||
color: rgba(243, 232, 255, 0.8);
|
||||
}
|
||||
|
||||
.hint-tag:active {
|
||||
background: rgba(168, 85, 247, 0.2);
|
||||
border-color: rgba(168, 85, 247, 0.4);
|
||||
}
|
||||
|
||||
.quote-box {
|
||||
background: linear-gradient(135deg, rgba(168, 85, 247, 0.15), rgba(232, 121, 249, 0.1));
|
||||
border: 1px solid rgba(168, 85, 247, 0.3);
|
||||
border-radius: 20rpx;
|
||||
padding: 32rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16rpx;
|
||||
margin-top: 16rpx;
|
||||
}
|
||||
|
||||
.quote-icon {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.quote-text {
|
||||
font-size: 26rpx;
|
||||
color: rgba(243, 232, 255, 0.7);
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.bottom-bar {
|
||||
padding-top: 32rpx;
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.05);
|
||||
}
|
||||
|
||||
.step-dots {
|
||||
display: flex;
|
||||
gap: 8rpx;
|
||||
margin-bottom: 32rpx;
|
||||
}
|
||||
|
||||
.step-dot {
|
||||
flex: 1;
|
||||
height: 8rpx;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
border-radius: 4rpx;
|
||||
transition: all 0.4s ease;
|
||||
}
|
||||
|
||||
.step-dot.active {
|
||||
flex: 1;
|
||||
height: 8rpx;
|
||||
background: #A855F7;
|
||||
box-shadow: 0 0 24rpx rgba(168, 85, 247, 0.6);
|
||||
}
|
||||
|
||||
.actions {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
gap: 24rpx;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.next-btn {
|
||||
min-width: 200rpx;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,296 @@
|
||||
<template>
|
||||
<view class="profile-page">
|
||||
<view class="bg-decoration">
|
||||
<view class="aurora-top"></view>
|
||||
<view class="aurora-bottom"></view>
|
||||
</view>
|
||||
|
||||
<scroll-view class="content" scroll-y :style="{ paddingTop: safeAreaTop + 20 + 'px', paddingBottom: safeAreaBottom + 20 + 'px' }">
|
||||
<view class="user-card">
|
||||
<view class="avatar-box">
|
||||
<image class="avatar" :src="userAvatar" mode="aspectFill" />
|
||||
<view class="verified-badge">✓</view>
|
||||
</view>
|
||||
|
||||
<view class="user-info">
|
||||
<text class="nickname font-serif">{{ userProfile.nickname || '未同步系统' }}</text>
|
||||
<text class="user-tags">{{ userTags }}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="stats-row">
|
||||
<view class="stat-card glass-card">
|
||||
<text class="stat-label">觉醒深度</text>
|
||||
<text class="stat-value">Lv.4</text>
|
||||
</view>
|
||||
<view class="stat-card glass-card">
|
||||
<text class="stat-label">星历契合</text>
|
||||
<text class="stat-value">98%</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="menu-list">
|
||||
<view class="menu-item glass-card" @click="editProfile">
|
||||
<view class="menu-left">
|
||||
<text class="menu-icon">👤</text>
|
||||
<text class="menu-title">个人档案设置</text>
|
||||
</view>
|
||||
<text class="menu-arrow">›</text>
|
||||
</view>
|
||||
|
||||
<view class="menu-item glass-card">
|
||||
<view class="menu-left">
|
||||
<text class="menu-icon">🔄</text>
|
||||
<text class="menu-title">多账号切换</text>
|
||||
</view>
|
||||
<text class="menu-arrow">›</text>
|
||||
</view>
|
||||
|
||||
<view class="menu-item glass-card">
|
||||
<view class="menu-left">
|
||||
<text class="menu-icon">📧</text>
|
||||
<text class="menu-title">与开发者对话</text>
|
||||
</view>
|
||||
<text class="menu-arrow">↗</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<button class="logout-btn" @click="handleLogout">
|
||||
TERMINATE LIFE HARMONY
|
||||
</button>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed, ref, onMounted } from 'vue'
|
||||
import { useAppStore } from '../../stores/app.js'
|
||||
|
||||
const store = useAppStore()
|
||||
|
||||
const safeAreaTop = ref(uni.getStorageSync('safeAreaTop') || 20)
|
||||
const safeAreaBottom = ref(uni.getStorageSync('safeAreaBottom') || 0)
|
||||
|
||||
onMounted(() => {
|
||||
const systemInfo = uni.getSystemInfoSync()
|
||||
safeAreaTop.value = systemInfo.safeAreaInsets?.top || systemInfo.statusBarHeight || 20
|
||||
safeAreaBottom.value = systemInfo.safeAreaInsets?.bottom || 0
|
||||
})
|
||||
|
||||
const userProfile = computed(() => store.userProfile || {})
|
||||
|
||||
const userAvatar = computed(() => {
|
||||
const nickname = userProfile.value.nickname || 'user'
|
||||
return `https://api.dicebear.com/7.x/avataaars/svg?seed=${nickname}&backgroundColor=A855F7`
|
||||
})
|
||||
|
||||
const userTags = computed(() => {
|
||||
const { mbti, zodiac, profession } = userProfile.value
|
||||
const tags = [mbti || 'QUESTER', zodiac || 'STAR', profession || '星民']
|
||||
return tags.join(' · ')
|
||||
})
|
||||
|
||||
const editProfile = () => {
|
||||
uni.navigateTo({ url: '/pages/onboarding/index?edit=1' })
|
||||
}
|
||||
|
||||
const handleLogout = () => {
|
||||
uni.showModal({
|
||||
title: '确认退出',
|
||||
content: '确定要退出登录吗？',
|
||||
success: async (res) => {
|
||||
if (res.confirm) {
|
||||
await store.logout()
|
||||
uni.reLaunch({ url: '/pages/login/index' })
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.profile-page {
|
||||
min-height: 100vh;
|
||||
background: linear-gradient(180deg, #0F071A 0%, #1A0B2E 50%, #0F071A 100%);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.bg-decoration {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.aurora-top {
|
||||
position: absolute;
|
||||
top: -10%;
|
||||
left: -10%;
|
||||
width: 120%;
|
||||
height: 60%;
|
||||
background: rgba(168, 85, 247, 0.08);
|
||||
filter: blur(120rpx);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.aurora-bottom {
|
||||
position: absolute;
|
||||
bottom: -10%;
|
||||
right: -10%;
|
||||
width: 100%;
|
||||
height: 50%;
|
||||
background: rgba(139, 92, 246, 0.05);
|
||||
filter: blur(100rpx);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.content {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
padding: 40rpx;
|
||||
padding-top: calc(60rpx + constant(safe-area-inset-top));
|
||||
padding-top: calc(60rpx + env(safe-area-inset-top));
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
}
|
||||
|
||||
.user-card {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 48rpx 0;
|
||||
margin-bottom: 32rpx;
|
||||
}
|
||||
|
||||
.avatar-box {
|
||||
position: relative;
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
border-radius: 50%;
|
||||
border: 4rpx solid rgba(168, 85, 247, 0.3);
|
||||
padding: 8rpx;
|
||||
margin-bottom: 32rpx;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
background: rgba(168, 85, 247, 0.1);
|
||||
}
|
||||
|
||||
.verified-badge {
|
||||
position: absolute;
|
||||
bottom: 8rpx;
|
||||
right: 8rpx;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
background: #9333EA;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 20rpx;
|
||||
color: white;
|
||||
border: 4rpx solid #0F071A;
|
||||
}
|
||||
|
||||
.user-info {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.nickname {
|
||||
display: block;
|
||||
font-size: 40rpx;
|
||||
font-weight: 300;
|
||||
color: rgba(255, 255, 255, 0.95);
|
||||
margin-bottom: 16rpx;
|
||||
letter-spacing: 4rpx;
|
||||
}
|
||||
|
||||
.user-tags {
|
||||
display: block;
|
||||
font-size: 18rpx;
|
||||
color: rgba(168, 85, 247, 0.6);
|
||||
letter-spacing: 4rpx;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.stats-row {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 24rpx;
|
||||
margin-bottom: 48rpx;
|
||||
}
|
||||
|
||||
.stat-card {
|
||||
padding: 32rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 12rpx;
|
||||
}
|
||||
|
||||
.stat-label {
|
||||
font-size: 18rpx;
|
||||
color: rgba(255, 255, 255, 0.35);
|
||||
letter-spacing: 4rpx;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.stat-value {
|
||||
font-size: 36rpx;
|
||||
font-weight: 300;
|
||||
color: rgba(243, 232, 255, 0.9);
|
||||
}
|
||||
|
||||
.menu-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20rpx;
|
||||
margin-bottom: 64rpx;
|
||||
}
|
||||
|
||||
.menu-item {
|
||||
padding: 32rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.menu-left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 24rpx;
|
||||
}
|
||||
|
||||
.menu-icon {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.menu-title {
|
||||
font-size: 26rpx;
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
}
|
||||
|
||||
.menu-arrow {
|
||||
font-size: 32rpx;
|
||||
color: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
.logout-btn {
|
||||
width: 100%;
|
||||
padding: 32rpx;
|
||||
background: transparent;
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-radius: 24rpx;
|
||||
color: rgba(255, 255, 255, 0.3);
|
||||
font-size: 20rpx;
|
||||
letter-spacing: 6rpx;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.logout-btn:active {
|
||||
color: rgba(168, 85, 247, 0.5);
|
||||
border-color: rgba(168, 85, 247, 0.2);
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,131 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="bg-decoration">
|
||||
<view class="aurora-top"></view>
|
||||
<view class="aurora-bottom"></view>
|
||||
</view>
|
||||
<view class="overlay">
|
||||
<view class="status-bar-space" :style="{ height: statusBarHeight + 'px' }"></view>
|
||||
<view class="content-area" :style="{ paddingBottom: safeAreaBottom + 'px' }">
|
||||
<image class="logo" src="/static/logo.svg" mode="widthFix"></image>
|
||||
<text class="app-name font-serif">人生OS</text>
|
||||
<text class="app-version">LIFE HARMONY v3.1</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import { useAppStore } from '../../stores/app.js'
|
||||
|
||||
const statusBarHeight = ref(20)
|
||||
const safeAreaBottom = ref(0)
|
||||
|
||||
onLoad(() => {
|
||||
const systemInfo = uni.getSystemInfoSync()
|
||||
statusBarHeight.value = systemInfo.statusBarHeight || 20
|
||||
safeAreaBottom.value = systemInfo.safeAreaInsets?.bottom || 0
|
||||
setTimeout(async () => {
|
||||
const store = useAppStore()
|
||||
const token = uni.getStorageSync('access_token')
|
||||
if (token) {
|
||||
await store.fetchUserProfile()
|
||||
if (store.hasProfile) {
|
||||
uni.reLaunch({ url: '/pages/main/index' })
|
||||
} else {
|
||||
uni.reLaunch({ url: '/pages/onboarding/index' })
|
||||
}
|
||||
} else {
|
||||
uni.reLaunch({ url: '/pages/login/index' })
|
||||
}
|
||||
}, 2000)
|
||||
})
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.container {
|
||||
position: relative;
|
||||
width: 750rpx;
|
||||
min-height: 100vh;
|
||||
height: 100vh;
|
||||
background: linear-gradient(180deg, #0F071A 0%, #1A0B2E 50%, #0F071A 100%);
|
||||
}
|
||||
|
||||
.status-bar-space {
|
||||
height: constant(safe-area-inset-top);
|
||||
height: env(safe-area-inset-top);
|
||||
width: 100%;
|
||||
background: transparent;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.bg-decoration {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.aurora-top {
|
||||
position: absolute;
|
||||
top: -10%;
|
||||
left: -10%;
|
||||
width: 120%;
|
||||
height: 60%;
|
||||
background: rgba(168, 85, 247, 0.08);
|
||||
filter: blur(120rpx);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.aurora-bottom {
|
||||
position: absolute;
|
||||
bottom: -10%;
|
||||
right: -10%;
|
||||
width: 100%;
|
||||
height: 50%;
|
||||
background: rgba(139, 92, 246, 0.05);
|
||||
filter: blur(100rpx);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.overlay {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.content-area {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
}
|
||||
|
||||
.logo {
|
||||
width: 180rpx;
|
||||
margin-bottom: 32rpx;
|
||||
}
|
||||
|
||||
.app-name {
|
||||
font-size: 52rpx;
|
||||
font-weight: 300;
|
||||
color: rgba(255, 255, 255, 0.95);
|
||||
letter-spacing: 8rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.app-version {
|
||||
font-size: 24rpx;
|
||||
color: rgba(168, 85, 247, 0.7);
|
||||
letter-spacing: 4rpx;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,123 @@
|
||||
/**
|
||||
* 认证服务
|
||||
* 处理登录、注册、验证码等认证相关接口
|
||||
* 与Web端(life-script/src/services/auth.js)保持一致
|
||||
*/
|
||||
|
||||
import { get, post } from './request.js'
|
||||
|
||||
/**
|
||||
* 获取短信验证码
|
||||
* @param {string} phone - 手机号
|
||||
* @returns {Promise<Object>} 验证码响应
|
||||
*/
|
||||
export const getSmsCode = async (phone) => {
|
||||
const response = await get('/auth/sms-code', { phone })
|
||||
return response
|
||||
}
|
||||
|
||||
/**
|
||||
* 用户登录（手机号 + 验证码）
|
||||
* @param {Object} params - 登录参数
|
||||
* @param {string} params.phone - 手机号
|
||||
* @param {string} params.smsCode - 短信验证码
|
||||
* @returns {Promise<Object>} 登录响应（包含 token）
|
||||
*/
|
||||
export const login = async ({ phone, smsCode }) => {
|
||||
const response = await post('/auth/login', { phone, smsCode })
|
||||
|
||||
// 保存token
|
||||
if (response.data) {
|
||||
const { accessToken, refreshToken } = response.data
|
||||
if (accessToken) {
|
||||
uni.setStorageSync('access_token', accessToken)
|
||||
}
|
||||
if (refreshToken) {
|
||||
uni.setStorageSync('refresh_token', refreshToken)
|
||||
}
|
||||
}
|
||||
|
||||
return response
|
||||
}
|
||||
|
||||
/**
|
||||
* 用户登出
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
export const logout = async () => {
|
||||
try {
|
||||
await post('/auth/logout')
|
||||
} finally {
|
||||
// 无论成功失败都清除本地token
|
||||
uni.removeStorageSync('access_token')
|
||||
uni.removeStorageSync('refresh_token')
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 刷新token
|
||||
* @returns {Promise<Object>} 新的token
|
||||
*/
|
||||
export const refreshToken = async () => {
|
||||
const refreshToken = uni.getStorageSync('refresh_token')
|
||||
if (!refreshToken) {
|
||||
throw new Error('No refresh token')
|
||||
}
|
||||
|
||||
const response = await post('/auth/refreshToken', { refreshToken })
|
||||
|
||||
// 更新token
|
||||
if (response.data) {
|
||||
const { accessToken, refreshToken: newRefreshToken } = response.data
|
||||
if (accessToken) {
|
||||
uni.setStorageSync('access_token', accessToken)
|
||||
}
|
||||
if (newRefreshToken) {
|
||||
uni.setStorageSync('refresh_token', newRefreshToken)
|
||||
}
|
||||
}
|
||||
|
||||
return response
|
||||
}
|
||||
|
||||
/**
|
||||
* 验证token是否有效
|
||||
* @returns {Promise<boolean>}
|
||||
*/
|
||||
export const validateToken = async () => {
|
||||
try {
|
||||
const response = await get('/auth/validateToken')
|
||||
return response.data === true
|
||||
} catch {
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取当前用户信息
|
||||
* @returns {Promise<Object>} 用户信息
|
||||
*/
|
||||
export const getCurrentUserInfo = async () => {
|
||||
const response = await get('/auth/userInfo')
|
||||
return response
|
||||
}
|
||||
|
||||
/**
|
||||
* 检查手机号是否已注册
|
||||
* @param {string} phone - 手机号
|
||||
* @returns {Promise<boolean>}
|
||||
*/
|
||||
export const checkPhone = async (phone) => {
|
||||
const response = await get('/auth/checkPhone', { phone })
|
||||
return response.data
|
||||
}
|
||||
|
||||
export default {
|
||||
getSmsCode,
|
||||
login,
|
||||
logout,
|
||||
refreshToken,
|
||||
validateToken,
|
||||
getCurrentUserInfo,
|
||||
checkPhone
|
||||
}
|
||||
@@ -0,0 +1,202 @@
|
||||
/**
|
||||
* 爽文剧本服务
|
||||
* 处理剧本的增删改查
|
||||
*/
|
||||
|
||||
import { get, post, put, del } from './request.js'
|
||||
|
||||
export const getScriptList = async () => {
|
||||
const response = await get('/epicScript/listAll')
|
||||
return response
|
||||
}
|
||||
|
||||
export const getScriptPage = async ({ pageNum = 1, pageSize = 10 }) => {
|
||||
const response = await get('/epicScript/page', { pageNum, pageSize })
|
||||
return response
|
||||
}
|
||||
|
||||
export const getScriptById = async (id) => {
|
||||
const response = await get('/epicScript/detail', { id })
|
||||
return response
|
||||
}
|
||||
|
||||
export const createScript = async (scriptData) => {
|
||||
const requestData = transformToBackendFormat(scriptData)
|
||||
const response = await post('/epicScript/create', requestData)
|
||||
return response
|
||||
}
|
||||
|
||||
export const updateScript = async (scriptData) => {
|
||||
const requestData = transformToBackendFormat(scriptData)
|
||||
const response = await put('/epicScript/update', requestData)
|
||||
return response
|
||||
}
|
||||
|
||||
export const selectScript = async (id) => {
|
||||
const response = await put('/epicScript/select', null, { params: { id } })
|
||||
return response
|
||||
}
|
||||
|
||||
export const deleteScript = async (id) => {
|
||||
const response = await del('/epicScript/delete', { id })
|
||||
return response
|
||||
}
|
||||
|
||||
const transformToBackendFormat = (frontendData) => {
|
||||
const {
|
||||
id,
|
||||
theme,
|
||||
style,
|
||||
length,
|
||||
content,
|
||||
isSelected,
|
||||
character,
|
||||
events
|
||||
} = frontendData
|
||||
|
||||
let title = theme || '我的剧本'
|
||||
let plotIntro = ''
|
||||
let plotTurning = ''
|
||||
let plotClimax = ''
|
||||
let plotEnding = ''
|
||||
|
||||
if (content) {
|
||||
const sections = content.split(/【[^】]+】/)
|
||||
const titles = content.match(/【[^】]+】/g) || []
|
||||
|
||||
titles.forEach((t, index) => {
|
||||
const sectionContent = sections[index + 1]?.trim() || ''
|
||||
if (t.includes('序幕') || t.includes('低谷')) {
|
||||
plotIntro = sectionContent
|
||||
} else if (t.includes('转折') || t.includes('契机')) {
|
||||
plotTurning = sectionContent
|
||||
} else if (t.includes('高潮') || t.includes('抉择')) {
|
||||
plotClimax = sectionContent
|
||||
} else if (t.includes('结局') || t.includes('开始')) {
|
||||
plotEnding = sectionContent
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
let characterInfo = ''
|
||||
if (character) {
|
||||
const parts = [
|
||||
`姓名：${character.nickname || '未设置'}`,
|
||||
`性别：${character.gender || '未设置'}`,
|
||||
`MBTI：${character.mbti || '未设置'}`,
|
||||
`星座：${character.zodiac || '未设置'}`,
|
||||
`职业：${character.profession || '未设置'}`,
|
||||
`兴趣爱好：${character.hobbies?.join(',') || '无'}`
|
||||
]
|
||||
|
||||
if (character.future) {
|
||||
if (character.future.vision) parts.push(`未来愿景：${character.future.vision}`)
|
||||
if (character.future.ideal) parts.push(`理想生活：${character.future.ideal}`)
|
||||
}
|
||||
|
||||
characterInfo = parts.join('\n')
|
||||
}
|
||||
|
||||
let lifeEventsSummary = ''
|
||||
const eventParts = []
|
||||
|
||||
if (character) {
|
||||
if (character.childhood?.text) {
|
||||
eventParts.push(`【童年记忆】(${character.childhood.date || '未知时间'}): ${character.childhood.text}`)
|
||||
}
|
||||
if (character.joy?.text) {
|
||||
eventParts.push(`【高光时刻】(${character.joy.date || '未知时间'}): ${character.joy.text}`)
|
||||
}
|
||||
if (character.low?.text) {
|
||||
eventParts.push(`【至暗时刻】(${character.low.date || '未知时间'}): ${character.low.text}`)
|
||||
}
|
||||
}
|
||||
|
||||
if (events && Array.isArray(events)) {
|
||||
events.forEach(e => {
|
||||
const dateStr = e.time || e.eventDate || '未知时间'
|
||||
const titleStr = e.title || '无标题'
|
||||
const contentStr = e.content || ''
|
||||
eventParts.push(`【人生事件】(${dateStr}) ${titleStr}${contentStr ? ': ' + contentStr : ''}`)
|
||||
})
|
||||
}
|
||||
|
||||
lifeEventsSummary = eventParts.join('\n')
|
||||
|
||||
return {
|
||||
id,
|
||||
title,
|
||||
theme,
|
||||
style,
|
||||
length,
|
||||
plotIntro,
|
||||
plotTurning,
|
||||
plotClimax,
|
||||
plotEnding,
|
||||
plotJson: content ? { fullContent: content } : null,
|
||||
isSelected,
|
||||
characterInfo,
|
||||
lifeEventsSummary
|
||||
}
|
||||
}
|
||||
|
||||
export const transformToFrontendFormat = (backendData) => {
|
||||
if (!backendData) return null
|
||||
|
||||
const {
|
||||
id,
|
||||
userId,
|
||||
title,
|
||||
theme,
|
||||
style,
|
||||
length,
|
||||
plotIntro,
|
||||
plotTurning,
|
||||
plotClimax,
|
||||
plotEnding,
|
||||
plotJson,
|
||||
isSelected,
|
||||
createTime
|
||||
} = backendData
|
||||
|
||||
let content = ''
|
||||
if (plotJson?.fullContent) {
|
||||
content = plotJson.fullContent
|
||||
} else {
|
||||
const parts = []
|
||||
if (plotIntro) parts.push(`【序幕：低谷回响】\n${plotIntro}`)
|
||||
if (plotTurning) parts.push(`【转折：契机出现】\n${plotTurning}`)
|
||||
if (plotClimax) parts.push(`【高潮：命运抉择】\n${plotClimax}`)
|
||||
if (plotEnding) parts.push(`【结局：新的开始】\n${plotEnding}`)
|
||||
content = parts.join('\n\n')
|
||||
}
|
||||
|
||||
return {
|
||||
id,
|
||||
userId,
|
||||
title: title || theme || '未命名剧本',
|
||||
theme: theme || '',
|
||||
style: style || '',
|
||||
length: length || 'medium',
|
||||
content,
|
||||
isSelected: isSelected || false,
|
||||
date: createTime ? new Date(createTime).toLocaleDateString() : new Date().toLocaleDateString()
|
||||
}
|
||||
}
|
||||
|
||||
export const transformListToFrontend = (backendList) => {
|
||||
if (!Array.isArray(backendList)) return []
|
||||
return backendList.map(transformToFrontendFormat)
|
||||
}
|
||||
|
||||
export default {
|
||||
getScriptList,
|
||||
getScriptPage,
|
||||
getScriptById,
|
||||
createScript,
|
||||
updateScript,
|
||||
selectScript,
|
||||
deleteScript,
|
||||
transformToFrontendFormat,
|
||||
transformListToFrontend
|
||||
}
|
||||
@@ -0,0 +1,112 @@
|
||||
/**
|
||||
* 生命事件服务
|
||||
* 处理生命事件的增删改查
|
||||
*/
|
||||
|
||||
import { get, post, put, del } from './request.js'
|
||||
|
||||
export const getEventList = async () => {
|
||||
const response = await get('/lifeEvent/list')
|
||||
return response
|
||||
}
|
||||
|
||||
export const getEventPage = async ({ pageNum = 1, pageSize = 10 }) => {
|
||||
const response = await get('/lifeEvent/page', { pageNum, pageSize })
|
||||
return response
|
||||
}
|
||||
|
||||
export const getEventById = async (id) => {
|
||||
const response = await get('/lifeEvent/detail', { id })
|
||||
return response
|
||||
}
|
||||
|
||||
export const createEvent = async (eventData) => {
|
||||
const requestData = transformToBackendFormat(eventData)
|
||||
const response = await post('/lifeEvent/create', requestData)
|
||||
return response
|
||||
}
|
||||
|
||||
export const updateEvent = async (eventData) => {
|
||||
const requestData = transformToBackendFormat(eventData)
|
||||
const response = await put('/lifeEvent/update', requestData)
|
||||
return response
|
||||
}
|
||||
|
||||
export const deleteEvent = async (id) => {
|
||||
const response = await del('/lifeEvent/delete', { id })
|
||||
return response
|
||||
}
|
||||
|
||||
const transformToBackendFormat = (frontendData) => {
|
||||
const {
|
||||
id,
|
||||
title,
|
||||
time,
|
||||
content,
|
||||
aiFeedback,
|
||||
eventType = 'daily_log',
|
||||
emotionType,
|
||||
emotionScore,
|
||||
tags
|
||||
} = frontendData
|
||||
|
||||
return {
|
||||
id,
|
||||
title,
|
||||
eventDate: time,
|
||||
content,
|
||||
aiReply: aiFeedback,
|
||||
eventType,
|
||||
emotionType,
|
||||
emotionScore,
|
||||
tags
|
||||
}
|
||||
}
|
||||
|
||||
export const transformToFrontendFormat = (backendData) => {
|
||||
if (!backendData) return null
|
||||
|
||||
const {
|
||||
id,
|
||||
userId,
|
||||
title,
|
||||
eventDate,
|
||||
content,
|
||||
aiReply,
|
||||
eventType,
|
||||
emotionType,
|
||||
emotionScore,
|
||||
tags,
|
||||
createTime
|
||||
} = backendData
|
||||
|
||||
return {
|
||||
id,
|
||||
userId,
|
||||
title: title || '',
|
||||
time: eventDate ? eventDate.split('T')[0] : '',
|
||||
content: content || '',
|
||||
aiFeedback: aiReply || '',
|
||||
eventType: eventType || 'daily_log',
|
||||
emotionType,
|
||||
emotionScore,
|
||||
tags: tags || [],
|
||||
createTime
|
||||
}
|
||||
}
|
||||
|
||||
export const transformListToFrontend = (backendList) => {
|
||||
if (!Array.isArray(backendList)) return []
|
||||
return backendList.map(transformToFrontendFormat)
|
||||
}
|
||||
|
||||
export default {
|
||||
getEventList,
|
||||
getEventPage,
|
||||
getEventById,
|
||||
createEvent,
|
||||
updateEvent,
|
||||
deleteEvent,
|
||||
transformToFrontendFormat,
|
||||
transformListToFrontend
|
||||
}
|
||||
@@ -0,0 +1,148 @@
|
||||
/**
|
||||
* 实现路径服务
|
||||
* 处理路径的增删改查
|
||||
*/
|
||||
|
||||
import { get, post, put, del } from './request.js'
|
||||
|
||||
export const getPathList = async () => {
|
||||
const response = await get('/lifePath/listAll')
|
||||
return response
|
||||
}
|
||||
|
||||
export const getPathPage = async ({ pageNum = 1, pageSize = 10 }) => {
|
||||
const response = await get('/lifePath/page', { pageNum, pageSize })
|
||||
return response
|
||||
}
|
||||
|
||||
export const getPathByScriptId = async (scriptId) => {
|
||||
const response = await get('/lifePath/byScript', { scriptId })
|
||||
return response
|
||||
}
|
||||
|
||||
export const getPathById = async (id) => {
|
||||
const response = await get('/lifePath/detail', { id })
|
||||
return response
|
||||
}
|
||||
|
||||
export const createPath = async (pathData) => {
|
||||
const requestData = transformToBackendFormat(pathData)
|
||||
const response = await post('/lifePath/create', requestData)
|
||||
return response
|
||||
}
|
||||
|
||||
export const updatePath = async (pathData) => {
|
||||
const requestData = transformToBackendFormat(pathData)
|
||||
const response = await put('/lifePath/update', requestData)
|
||||
return response
|
||||
}
|
||||
|
||||
export const deletePath = async (id) => {
|
||||
const response = await del('/lifePath/delete', { id })
|
||||
return response
|
||||
}
|
||||
|
||||
const transformToBackendFormat = (frontendData) => {
|
||||
const {
|
||||
id,
|
||||
scriptId,
|
||||
title,
|
||||
description,
|
||||
content,
|
||||
status = 'active',
|
||||
progress = 0
|
||||
} = frontendData
|
||||
|
||||
let steps = []
|
||||
if (content) {
|
||||
const stepMatches = content.match(/(\d+)\.\s*([^:：]+)[：:]\s*([^\n]+)/g)
|
||||
if (stepMatches) {
|
||||
steps = stepMatches.map((match, index) => {
|
||||
const parts = match.match(/(\d+)\.\s*([^:：]+)[：:]\s*(.+)/)
|
||||
return {
|
||||
phase: `阶段${index + 1}`,
|
||||
time: parts?.[2]?.trim() || '',
|
||||
content: parts?.[3]?.trim() || match,
|
||||
action: '',
|
||||
resources: '',
|
||||
habit: ''
|
||||
}
|
||||
})
|
||||
} else {
|
||||
const lines = content.split('\n').filter(line => line.trim())
|
||||
steps = lines.map((line, index) => ({
|
||||
phase: `阶段${index + 1}`,
|
||||
time: '',
|
||||
content: line.trim(),
|
||||
action: '',
|
||||
resources: '',
|
||||
habit: ''
|
||||
}))
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
id,
|
||||
scriptId,
|
||||
title: title || '实现路径',
|
||||
description,
|
||||
steps,
|
||||
status,
|
||||
progress
|
||||
}
|
||||
}
|
||||
|
||||
export const transformToFrontendFormat = (backendData) => {
|
||||
if (!backendData) return null
|
||||
|
||||
const {
|
||||
id,
|
||||
userId,
|
||||
scriptId,
|
||||
title,
|
||||
description,
|
||||
steps,
|
||||
status,
|
||||
progress,
|
||||
createTime
|
||||
} = backendData
|
||||
|
||||
let content = ''
|
||||
if (Array.isArray(steps) && steps.length > 0) {
|
||||
content = steps.map((step, index) => {
|
||||
const phase = step.phase || `阶段${index + 1}`
|
||||
const time = step.time ? `（${step.time}）` : ''
|
||||
return `${index + 1}. ${phase}${time}：${step.content || ''}`
|
||||
}).join('\n')
|
||||
}
|
||||
|
||||
return {
|
||||
id,
|
||||
userId,
|
||||
scriptId,
|
||||
title: title || '实现路径',
|
||||
description: description || '',
|
||||
content,
|
||||
steps: steps || [],
|
||||
status: status || 'active',
|
||||
progress: progress || 0,
|
||||
createTime
|
||||
}
|
||||
}
|
||||
|
||||
export const transformListToFrontend = (backendList) => {
|
||||
if (!Array.isArray(backendList)) return []
|
||||
return backendList.map(transformToFrontendFormat)
|
||||
}
|
||||
|
||||
export default {
|
||||
getPathList,
|
||||
getPathPage,
|
||||
getPathByScriptId,
|
||||
getPathById,
|
||||
createPath,
|
||||
updatePath,
|
||||
deletePath,
|
||||
transformToFrontendFormat,
|
||||
transformListToFrontend
|
||||
}
|
||||
@@ -0,0 +1,103 @@
|
||||
import { getEnvValue, isDev } from '../config/env.js'
|
||||
|
||||
const API_BASE_URL = getEnvValue('API_BASE_URL')
|
||||
|
||||
/**
|
||||
* 请求拦截处理
|
||||
* 自动添加token到请求头
|
||||
*/
|
||||
const getHeaders = () => {
|
||||
const token = uni.getStorageSync('access_token')
|
||||
const headers = {
|
||||
'Content-Type': 'application/json'
|
||||
}
|
||||
if (token) {
|
||||
headers.Authorization = `Bearer ${token}`
|
||||
}
|
||||
return headers
|
||||
}
|
||||
|
||||
/**
|
||||
* 统一请求方法
|
||||
* @param {Object} options - 请求配置
|
||||
* @returns {Promise} 请求Promise
|
||||
*/
|
||||
const request = (options) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
uni.request({
|
||||
url: `${API_BASE_URL}${options.url}`,
|
||||
method: options.method || 'GET',
|
||||
data: options.data,
|
||||
header: getHeaders(),
|
||||
timeout: 30000,
|
||||
success: (res) => {
|
||||
const { data, statusCode } = res
|
||||
|
||||
// 处理401未授权
|
||||
if (statusCode === 401) {
|
||||
uni.removeStorageSync('access_token')
|
||||
uni.removeStorageSync('refresh_token')
|
||||
uni.redirectTo({ url: '/pages/login/index' })
|
||||
reject(new Error('登录已过期，请重新登录'))
|
||||
return
|
||||
}
|
||||
|
||||
// 后端返回格式: { code, message, data }
|
||||
if (data.code === 200 || data.code === 0) {
|
||||
resolve(data)
|
||||
} else {
|
||||
reject(new Error(data.message || '请求失败'))
|
||||
}
|
||||
},
|
||||
fail: (err) => {
|
||||
reject(new Error(err.errMsg || '网络错误'))
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* GET请求
|
||||
*/
|
||||
export const get = (url, params = {}) => {
|
||||
// 构建查询字符串
|
||||
const queryString = Object.keys(params)
|
||||
.map(key => `${encodeURIComponent(key)}=${encodeURIComponent(params[key])}`)
|
||||
.join('&')
|
||||
const fullUrl = queryString ? `${url}?${queryString}` : url
|
||||
|
||||
return request({ url: fullUrl, method: 'GET' })
|
||||
}
|
||||
|
||||
/**
|
||||
* POST请求
|
||||
*/
|
||||
export const post = (url, data = {}) => {
|
||||
return request({ url, method: 'POST', data })
|
||||
}
|
||||
|
||||
/**
|
||||
* PUT请求
|
||||
*/
|
||||
export const put = (url, data = {}) => {
|
||||
return request({ url, method: 'PUT', data })
|
||||
}
|
||||
|
||||
/**
|
||||
* DELETE请求
|
||||
*/
|
||||
export const del = (url, params = {}) => {
|
||||
const queryString = Object.keys(params)
|
||||
.map(key => `${encodeURIComponent(key)}=${encodeURIComponent(params[key])}`)
|
||||
.join('&')
|
||||
const fullUrl = queryString ? `${url}?${queryString}` : url
|
||||
|
||||
return request({ url: fullUrl, method: 'DELETE' })
|
||||
}
|
||||
|
||||
export default {
|
||||
get,
|
||||
post,
|
||||
put,
|
||||
del
|
||||
}
|
||||
@@ -0,0 +1,151 @@
|
||||
/**
|
||||
* 用户档案服务
|
||||
* 处理用户档案的增删改查
|
||||
* 与Web端(life-script/src/services/userProfile.js)保持一致
|
||||
*/
|
||||
|
||||
import { get, post, put } from './request.js'
|
||||
|
||||
/**
|
||||
* 获取当前用户档案
|
||||
* @returns {Promise<Object|null>} 用户档案
|
||||
*/
|
||||
export const getCurrentProfile = async () => {
|
||||
const response = await get('/user-profile/me')
|
||||
return response
|
||||
}
|
||||
|
||||
/**
|
||||
* 创建用户档案
|
||||
* @param {Object} profileData - 档案数据
|
||||
* @returns {Promise<Object>} 创建的档案
|
||||
*/
|
||||
export const createProfile = async (profileData) => {
|
||||
// 转换前端数据格式为后端格式
|
||||
const requestData = transformToBackendFormat(profileData)
|
||||
const response = await post('/user-profile/create', requestData)
|
||||
return response
|
||||
}
|
||||
|
||||
/**
|
||||
* 更新用户档案
|
||||
* @param {Object} profileData - 档案数据（必须包含id）
|
||||
* @returns {Promise<Object>} 更新后的档案
|
||||
*/
|
||||
export const updateProfile = async (profileData) => {
|
||||
const requestData = transformToBackendFormat(profileData)
|
||||
const response = await put('/user-profile/update', requestData)
|
||||
return response
|
||||
}
|
||||
|
||||
/**
|
||||
* 将前端数据格式转换为后端格式
|
||||
* @param {Object} frontendData - 前端数据
|
||||
* @returns {Object} 后端格式数据
|
||||
*/
|
||||
const transformToBackendFormat = (frontendData) => {
|
||||
const {
|
||||
id,
|
||||
nickname,
|
||||
gender,
|
||||
zodiac,
|
||||
profession,
|
||||
mbti,
|
||||
hobbies,
|
||||
childhood,
|
||||
joy,
|
||||
low,
|
||||
future
|
||||
} = frontendData
|
||||
|
||||
return {
|
||||
id,
|
||||
nickname,
|
||||
gender,
|
||||
zodiac,
|
||||
profession,
|
||||
mbti,
|
||||
// 兴趣爱好转为JSON字符串
|
||||
hobbies: Array.isArray(hobbies) ? JSON.stringify(hobbies) : hobbies,
|
||||
// 童年经历
|
||||
childhoodDate: childhood?.date || null,
|
||||
childhoodContent: childhood?.text || null,
|
||||
// 高光时刻（对应前端的joy）
|
||||
peakDate: joy?.date || null,
|
||||
peakContent: joy?.text || null,
|
||||
// 低谷时期（对应前端的low）
|
||||
valleyDate: low?.date || null,
|
||||
valleyContent: low?.text || null,
|
||||
// 未来期许
|
||||
futureVision: future?.vision || null,
|
||||
// 理想生活状态
|
||||
idealLife: future?.ideal || null
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 将后端数据格式转换为前端格式
|
||||
* @param {Object} backendData - 后端数据
|
||||
* @returns {Object} 前端格式数据
|
||||
*/
|
||||
export const transformToFrontendFormat = (backendData) => {
|
||||
if (!backendData) return null
|
||||
|
||||
const {
|
||||
id,
|
||||
userId,
|
||||
nickname,
|
||||
gender,
|
||||
zodiac,
|
||||
profession,
|
||||
mbti,
|
||||
hobbies,
|
||||
childhoodDate,
|
||||
childhoodContent,
|
||||
peakDate,
|
||||
peakContent,
|
||||
valleyDate,
|
||||
valleyContent,
|
||||
futureVision,
|
||||
idealLife
|
||||
} = backendData
|
||||
|
||||
return {
|
||||
id,
|
||||
userId,
|
||||
nickname: nickname || '',
|
||||
gender: gender || '',
|
||||
zodiac: zodiac || '',
|
||||
profession: profession || '',
|
||||
mbti: mbti || '',
|
||||
// 兴趣爱好从JSON字符串解析
|
||||
hobbies: hobbies ? (typeof hobbies === 'string' ? JSON.parse(hobbies) : hobbies) : [],
|
||||
// 童年经历
|
||||
childhood: {
|
||||
date: childhoodDate || '',
|
||||
text: childhoodContent || ''
|
||||
},
|
||||
// 高光时刻
|
||||
joy: {
|
||||
date: peakDate || '',
|
||||
text: peakContent || ''
|
||||
},
|
||||
// 低谷时期
|
||||
low: {
|
||||
date: valleyDate || '',
|
||||
text: valleyContent || ''
|
||||
},
|
||||
// 未来期许
|
||||
future: {
|
||||
vision: futureVision || '',
|
||||
ideal: idealLife || ''
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default {
|
||||
getCurrentProfile,
|
||||
createProfile,
|
||||
updateProfile,
|
||||
transformToFrontendFormat
|
||||
}
|
||||
|
Before Width: | Height: | Size: 693 B After Width: | Height: | Size: 693 B |
|
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 1.2 KiB |
|
Before Width: | Height: | Size: 941 B After Width: | Height: | Size: 941 B |
|
Before Width: | Height: | Size: 2.5 KiB After Width: | Height: | Size: 2.5 KiB |
|
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 1.3 KiB |
|
Before Width: | Height: | Size: 966 B After Width: | Height: | Size: 966 B |
|
Before Width: | Height: | Size: 1.0 MiB After Width: | Height: | Size: 1.0 MiB |
|
Before Width: | Height: | Size: 195 KiB After Width: | Height: | Size: 195 KiB |
|
Before Width: | Height: | Size: 675 B After Width: | Height: | Size: 675 B |
|
Before Width: | Height: | Size: 959 B After Width: | Height: | Size: 959 B |
|
Before Width: | Height: | Size: 1.1 MiB After Width: | Height: | Size: 1.1 MiB |
|
Before Width: | Height: | Size: 47 KiB After Width: | Height: | Size: 47 KiB |
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 12 KiB |
|
Before Width: | Height: | Size: 670 KiB After Width: | Height: | Size: 670 KiB |
|
Before Width: | Height: | Size: 79 KiB After Width: | Height: | Size: 79 KiB |
|
Before Width: | Height: | Size: 727 B After Width: | Height: | Size: 727 B |
|
Before Width: | Height: | Size: 758 B After Width: | Height: | Size: 758 B |
|
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 1.2 KiB |
|
Before Width: | Height: | Size: 887 B After Width: | Height: | Size: 887 B |
|
Before Width: | Height: | Size: 2.4 KiB After Width: | Height: | Size: 2.4 KiB |
|
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 1.2 KiB |
|
Before Width: | Height: | Size: 7.5 KiB After Width: | Height: | Size: 7.5 KiB |
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.4 KiB |
|
Before Width: | Height: | Size: 3.0 KiB After Width: | Height: | Size: 3.0 KiB |
|
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 1.2 KiB |
|
Before Width: | Height: | Size: 1.0 MiB After Width: | Height: | Size: 1.0 MiB |
|
Before Width: | Height: | Size: 1.0 MiB After Width: | Height: | Size: 1.0 MiB |
|
Before Width: | Height: | Size: 986 KiB After Width: | Height: | Size: 986 KiB |
|
Before Width: | Height: | Size: 1.0 MiB After Width: | Height: | Size: 1.0 MiB |
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.4 KiB |
|
Before Width: | Height: | Size: 589 B After Width: | Height: | Size: 589 B |
|
Before Width: | Height: | Size: 919 B After Width: | Height: | Size: 919 B |
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 927 B After Width: | Height: | Size: 927 B |
|
Before Width: | Height: | Size: 2.0 KiB After Width: | Height: | Size: 2.0 KiB |
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.4 KiB |
|
Before Width: | Height: | Size: 3.2 KiB After Width: | Height: | Size: 3.2 KiB |
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.4 KiB |
|
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.5 KiB |
|
Before Width: | Height: | Size: 1.0 MiB After Width: | Height: | Size: 1.0 MiB |
|
Before Width: | Height: | Size: 673 KiB After Width: | Height: | Size: 673 KiB |
|
Before Width: | Height: | Size: 1.1 MiB After Width: | Height: | Size: 1.1 MiB |
@@ -0,0 +1,192 @@
|
||||
import { reactive, computed, readonly } from 'vue'
|
||||
import * as authService from '../services/auth.js'
|
||||
import * as userProfileService from '../services/userProfile.js'
|
||||
import * as lifeEventService from '../services/lifeEvent.js'
|
||||
import * as epicScriptService from '../services/epicScript.js'
|
||||
import * as lifePathService from '../services/lifePath.js'
|
||||
|
||||
const state = reactive({
|
||||
isLoggedIn: false,
|
||||
isLoading: false,
|
||||
currentStep: 1,
|
||||
userInfo: null,
|
||||
userProfile: null,
|
||||
events: [],
|
||||
scripts: [],
|
||||
paths: [],
|
||||
currentPath: null,
|
||||
registrationData: {
|
||||
nickname: '',
|
||||
gender: '',
|
||||
mbti: '',
|
||||
zodiac: '',
|
||||
profession: '',
|
||||
hobbies: [],
|
||||
childhood: { date: '', text: '' },
|
||||
joy: { date: '', text: '' },
|
||||
low: { date: '', text: '' },
|
||||
future: { vision: '', ideal: '' }
|
||||
}
|
||||
})
|
||||
|
||||
const hasProfile = computed(() => {
|
||||
return state.userProfile && state.userProfile.nickname
|
||||
})
|
||||
|
||||
const login = async (phone, smsCode) => {
|
||||
state.isLoading = true
|
||||
try {
|
||||
const res = await authService.login({ phone, smsCode })
|
||||
state.isLoggedIn = true
|
||||
await fetchUserProfile()
|
||||
return { success: true, hasProfile: hasProfile.value }
|
||||
} catch (error) {
|
||||
return { success: false, error: error.message }
|
||||
} finally {
|
||||
state.isLoading = false
|
||||
}
|
||||
}
|
||||
|
||||
const logout = async () => {
|
||||
await authService.logout()
|
||||
state.isLoggedIn = false
|
||||
state.userInfo = null
|
||||
state.userProfile = null
|
||||
}
|
||||
|
||||
const fetchUserProfile = async () => {
|
||||
try {
|
||||
const res = await userProfileService.getCurrentProfile()
|
||||
if (res.data) {
|
||||
state.userProfile = userProfileService.transformToFrontendFormat(res.data)
|
||||
Object.assign(state.registrationData, state.userProfile)
|
||||
}
|
||||
return res.data
|
||||
} catch (error) {
|
||||
return null
|
||||
}
|
||||
}
|
||||
|
||||
const saveUserProfile = async () => {
|
||||
state.isLoading = true
|
||||
try {
|
||||
const dataToSave = { ...state.registrationData }
|
||||
if (state.userProfile?.id) {
|
||||
await userProfileService.updateProfile({
|
||||
id: state.userProfile.id,
|
||||
...dataToSave
|
||||
})
|
||||
} else {
|
||||
await userProfileService.createProfile(dataToSave)
|
||||
}
|
||||
await fetchUserProfile()
|
||||
return { success: true }
|
||||
} catch (error) {
|
||||
return { success: false, error: error.message }
|
||||
} finally {
|
||||
state.isLoading = false
|
||||
}
|
||||
}
|
||||
|
||||
const updateRegistration = (data) => {
|
||||
Object.assign(state.registrationData, data)
|
||||
}
|
||||
|
||||
const setCurrentStep = (step) => {
|
||||
state.currentStep = step
|
||||
}
|
||||
|
||||
const fetchEvents = async () => {
|
||||
try {
|
||||
const res = await lifeEventService.getEventList()
|
||||
state.events = lifeEventService.transformListToFrontend(res.data || [])
|
||||
return state.events
|
||||
} catch (error) {
|
||||
return []
|
||||
}
|
||||
}
|
||||
|
||||
const createEvent = async (eventData) => {
|
||||
try {
|
||||
await lifeEventService.createEvent(eventData)
|
||||
await fetchEvents()
|
||||
return { success: true }
|
||||
} catch (error) {
|
||||
return { success: false, error: error.message }
|
||||
}
|
||||
}
|
||||
|
||||
const fetchScripts = async () => {
|
||||
try {
|
||||
const res = await epicScriptService.getScriptList()
|
||||
state.scripts = epicScriptService.transformListToFrontend(res.data || [])
|
||||
return state.scripts
|
||||
} catch (error) {
|
||||
return []
|
||||
}
|
||||
}
|
||||
|
||||
const createScript = async (scriptData) => {
|
||||
try {
|
||||
await epicScriptService.createScript(scriptData)
|
||||
await fetchScripts()
|
||||
return { success: true }
|
||||
} catch (error) {
|
||||
return { success: false, error: error.message }
|
||||
}
|
||||
}
|
||||
|
||||
const selectScript = async (id) => {
|
||||
try {
|
||||
await epicScriptService.selectScript(id)
|
||||
await fetchScripts()
|
||||
return { success: true }
|
||||
} catch (error) {
|
||||
return { success: false, error: error.message }
|
||||
}
|
||||
}
|
||||
|
||||
const fetchPaths = async () => {
|
||||
try {
|
||||
const res = await lifePathService.getPathList()
|
||||
state.paths = lifePathService.transformListToFrontend(res.data || [])
|
||||
return state.paths
|
||||
} catch (error) {
|
||||
return []
|
||||
}
|
||||
}
|
||||
|
||||
const setCurrentPath = (path) => {
|
||||
state.currentPath = path
|
||||
}
|
||||
|
||||
const initialize = async () => {
|
||||
const token = uni.getStorageSync('access_token')
|
||||
if (token) {
|
||||
state.isLoggedIn = true
|
||||
await fetchUserProfile()
|
||||
}
|
||||
}
|
||||
|
||||
export const useAppStore = () => {
|
||||
return readonly({
|
||||
...state,
|
||||
hasProfile,
|
||||
login,
|
||||
logout,
|
||||
fetchUserProfile,
|
||||
saveUserProfile,
|
||||
updateRegistration,
|
||||
setCurrentStep,
|
||||
fetchEvents,
|
||||
createEvent,
|
||||
fetchScripts,
|
||||
createScript,
|
||||
selectScript,
|
||||
fetchPaths,
|
||||
setCurrentPath,
|
||||
initialize
|
||||
})
|
||||
}
|
||||
|
||||
export default useAppStore
|
||||
@@ -0,0 +1,104 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Life OS - 登录</title>
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<style>
|
||||
:root {
|
||||
--bg-dark: #0F071A;
|
||||
--primary: #A855F7;
|
||||
--primary-light: #C084FC;
|
||||
--accent: #E879F9;
|
||||
}
|
||||
|
||||
body {
|
||||
background: linear-gradient(180deg, #0F071A 0%, #1A0B2E 50%, #0F071A 100%);
|
||||
min-height: 100vh;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
||||
color: #F3E8FF;
|
||||
}
|
||||
|
||||
.glass-card {
|
||||
background: rgba(168, 85, 247, 0.05);
|
||||
backdrop-filter: blur(40px);
|
||||
border: 1px solid rgba(168, 85, 247, 0.15);
|
||||
border-radius: 48rpx;
|
||||
}
|
||||
|
||||
.glass-input {
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-radius: 24rpx;
|
||||
color: #F3E8FF;
|
||||
}
|
||||
|
||||
.glass-input::placeholder {
|
||||
color: rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background: linear-gradient(135deg, #9333EA 0%, #7C3AED 100%);
|
||||
border-radius: 32rpx;
|
||||
box-shadow: 0 8px 32px rgba(168, 85, 247, 0.3);
|
||||
}
|
||||
|
||||
.aurora-top {
|
||||
position: fixed;
|
||||
top: -10%;
|
||||
left: -10%;
|
||||
width: 120%;
|
||||
height: 60%;
|
||||
background: rgba(168, 85, 247, 0.08);
|
||||
filter: blur(120px);
|
||||
border-radius: 50%;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.aurora-bottom {
|
||||
position: fixed;
|
||||
bottom: -10%;
|
||||
right: -10%;
|
||||
width: 100%;
|
||||
height: 50%;
|
||||
background: rgba(139, 92, 246, 0.05);
|
||||
filter: blur(100px);
|
||||
border-radius: 50%;
|
||||
pointer-events: none;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body class="flex items-center justify-center p-6">
|
||||
<div class="aurora-top"></div>
|
||||
<div class="aurora-bottom"></div>
|
||||
|
||||
<div class="glass-card w-full max-w-md p-12 relative z-10">
|
||||
<div class="text-center mb-12">
|
||||
<h1 class="text-4xl font-light text-white/90 mb-4 tracking-wider">欢迎回来</h1>
|
||||
<p class="text-white/40 italic">开启你的数字生命档案</p>
|
||||
</div>
|
||||
|
||||
<div class="space-y-6 mb-8">
|
||||
<div>
|
||||
<label class="block text-sm text-white/60 mb-3 tracking-widest">手机号码</label>
|
||||
<input type="tel" placeholder="输入手机号" class="glass-input w-full h-14 px-6 text-center text-lg tracking-widest">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block text-sm text-white/60 mb-3 tracking-widest">验证码</label>
|
||||
<div class="flex gap-3">
|
||||
<input type="text" placeholder="六位验证码" class="glass-input flex-1 h-14 px-6 text-center">
|
||||
<button class="glass-input h-14 px-6 text-sm text-white/80 whitespace-nowrap">获取</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button class="btn-primary w-full h-14 text-white font-semibold mb-6">开启旅程</button>
|
||||
|
||||
<p class="text-xs text-center text-white/25 leading-relaxed">
|
||||
登录即代表同意《用户协议》与《隐私政策》
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,60 @@
|
||||
import { defineConfig } from 'vite'
|
||||
import { resolve } from 'path'
|
||||
import uni from '@dcloudio/vite-plugin-uni'
|
||||
|
||||
const uniPlugin = uni.default || uni
|
||||
|
||||
const vueCompatPlugin = () => {
|
||||
const virtualId = '\0virtual:vue-compat'
|
||||
const publicId = 'virtual:vue-compat'
|
||||
return {
|
||||
name: 'vue-compat-uni',
|
||||
resolveId(id) {
|
||||
if (id === publicId) return virtualId
|
||||
if (id === 'vue') return virtualId
|
||||
return null
|
||||
},
|
||||
load(id) {
|
||||
if (id !== virtualId) return null
|
||||
return [
|
||||
"import * as VueRuntime from 'vue/dist/vue.runtime.esm-bundler.js'",
|
||||
"export * from 'vue/dist/vue.runtime.esm-bundler.js'",
|
||||
'export default VueRuntime',
|
||||
'export const injectHook = () => {}',
|
||||
'export const isInSSRComponentSetup = () => false'
|
||||
].join('\n')
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default defineConfig(({ command }) => {
|
||||
const isMpWeixin = process.env.UNI_PLATFORM === 'mp-weixin'
|
||||
const inputDir = process.env.UNI_INPUT_DIR || '.'
|
||||
const mpEntry = resolve(inputDir, 'main.js')
|
||||
const outDir = isMpWeixin
|
||||
? (command === 'serve' ? 'unpackage/dist/dev/mp-weixin' : 'unpackage/dist/build/mp-weixin')
|
||||
: 'dist'
|
||||
return {
|
||||
envDir: __dirname,
|
||||
server: {
|
||||
watch: {
|
||||
usePolling: true,
|
||||
interval: 100
|
||||
},
|
||||
hmr: true
|
||||
},
|
||||
resolve: {
|
||||
alias: [
|
||||
{ find: /^vue$/, replacement: 'virtual:vue-compat' }
|
||||
]
|
||||
},
|
||||
build: {
|
||||
outDir,
|
||||
emptyOutDir: false,
|
||||
rollupOptions: isMpWeixin
|
||||
? { input: mpEntry }
|
||||
: undefined
|
||||
},
|
||||
plugins: [vueCompatPlugin(), uniPlugin()]
|
||||
}
|
||||
})
|
||||
Reference in New Issue
Block a user