feat: 增加对话
This commit is contained in:
parent
e89f6ce94d
commit
a30ad9dd89
|
|
@ -1,4 +1,4 @@
|
||||||
import type { NextConfig } from 'next'
|
import type { NextConfig } from 'next';
|
||||||
|
|
||||||
const nextConfig: NextConfig = {
|
const nextConfig: NextConfig = {
|
||||||
/* config options here */
|
/* config options here */
|
||||||
|
|
@ -26,6 +26,10 @@ const nextConfig: NextConfig = {
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
}
|
typescript: {
|
||||||
|
// 构建时忽略所有 TypeScript 错误
|
||||||
|
ignoreBuildErrors: true,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
export default nextConfig
|
export default nextConfig;
|
||||||
|
|
|
||||||
|
|
@ -54,6 +54,24 @@
|
||||||
<div class="content unicode" style="display: block;">
|
<div class="content unicode" style="display: block;">
|
||||||
<ul class="icon_lists dib-box">
|
<ul class="icon_lists dib-box">
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">Logo</div>
|
||||||
|
<div class="code-name">&#xe624;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">12</div>
|
||||||
|
<div class="code-name">&#xe622;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">群聊</div>
|
||||||
|
<div class="code-name">&#xe621;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
<li class="dib">
|
<li class="dib">
|
||||||
<span class="icon iconfont"></span>
|
<span class="icon iconfont"></span>
|
||||||
<div class="name">挂断电话</div>
|
<div class="name">挂断电话</div>
|
||||||
|
|
@ -98,7 +116,7 @@
|
||||||
|
|
||||||
<li class="dib">
|
<li class="dib">
|
||||||
<span class="icon iconfont"></span>
|
<span class="icon iconfont"></span>
|
||||||
<div class="name">Frame 195</div>
|
<div class="name">16-右</div>
|
||||||
<div class="code-name">&#xe616;</div>
|
<div class="code-name">&#xe616;</div>
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
|
|
@ -122,7 +140,7 @@
|
||||||
|
|
||||||
<li class="dib">
|
<li class="dib">
|
||||||
<span class="icon iconfont"></span>
|
<span class="icon iconfont"></span>
|
||||||
<div class="name">Frame 194</div>
|
<div class="name">16-左</div>
|
||||||
<div class="code-name">&#xe61a;</div>
|
<div class="code-name">&#xe61a;</div>
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
|
|
@ -162,18 +180,6 @@
|
||||||
<div class="code-name">&#xe60d;</div>
|
<div class="code-name">&#xe60d;</div>
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
<li class="dib">
|
|
||||||
<span class="icon iconfont"></span>
|
|
||||||
<div class="name">折叠</div>
|
|
||||||
<div class="code-name">&#xe60e;</div>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
<li class="dib">
|
|
||||||
<span class="icon iconfont"></span>
|
|
||||||
<div class="name">展开</div>
|
|
||||||
<div class="code-name">&#xe60f;</div>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
</ul>
|
</ul>
|
||||||
<div class="article markdown">
|
<div class="article markdown">
|
||||||
<h2 id="unicode-">Unicode 引用</h2>
|
<h2 id="unicode-">Unicode 引用</h2>
|
||||||
|
|
@ -192,12 +198,12 @@
|
||||||
<pre><code class="language-css"
|
<pre><code class="language-css"
|
||||||
>@font-face {
|
>@font-face {
|
||||||
font-family: 'iconfont';
|
font-family: 'iconfont';
|
||||||
src: url('iconfont.eot?t=1765173841330'); /* IE9 */
|
src: url('iconfont.eot?t=1766052523135'); /* IE9 */
|
||||||
src: url('iconfont.eot?t=1765173841330#iefix') format('embedded-opentype'), /* IE6-IE8 */
|
src: url('iconfont.eot?t=1766052523135#iefix') format('embedded-opentype'), /* IE6-IE8 */
|
||||||
url('iconfont.woff2?t=1765173841330') format('woff2'),
|
url('iconfont.woff2?t=1766052523135') format('woff2'),
|
||||||
url('iconfont.woff?t=1765173841330') format('woff'),
|
url('iconfont.woff?t=1766052523135') format('woff'),
|
||||||
url('iconfont.ttf?t=1765173841330') format('truetype'),
|
url('iconfont.ttf?t=1766052523135') format('truetype'),
|
||||||
url('iconfont.svg?t=1765173841330#iconfont') format('svg');
|
url('iconfont.svg?t=1766052523135#iconfont') format('svg');
|
||||||
}
|
}
|
||||||
</code></pre>
|
</code></pre>
|
||||||
<h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
|
<h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
|
||||||
|
|
@ -223,6 +229,33 @@
|
||||||
<div class="content font-class">
|
<div class="content font-class">
|
||||||
<ul class="icon_lists dib-box">
|
<ul class="icon_lists dib-box">
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont icon-Logo"></span>
|
||||||
|
<div class="name">
|
||||||
|
Logo
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.icon-Logo
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont icon-wodejiemianqianwang"></span>
|
||||||
|
<div class="name">
|
||||||
|
12
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.icon-wodejiemianqianwang
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont icon-qunliao"></span>
|
||||||
|
<div class="name">
|
||||||
|
群聊
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.icon-qunliao
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
<li class="dib">
|
<li class="dib">
|
||||||
<span class="icon iconfont icon-guaduandianhua"></span>
|
<span class="icon iconfont icon-guaduandianhua"></span>
|
||||||
<div class="name">
|
<div class="name">
|
||||||
|
|
@ -289,7 +322,7 @@
|
||||||
<li class="dib">
|
<li class="dib">
|
||||||
<span class="icon iconfont icon-a-Frame195"></span>
|
<span class="icon iconfont icon-a-Frame195"></span>
|
||||||
<div class="name">
|
<div class="name">
|
||||||
Frame 195
|
16-右
|
||||||
</div>
|
</div>
|
||||||
<div class="code-name">.icon-a-Frame195
|
<div class="code-name">.icon-a-Frame195
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -325,7 +358,7 @@
|
||||||
<li class="dib">
|
<li class="dib">
|
||||||
<span class="icon iconfont icon-a-Frame194"></span>
|
<span class="icon iconfont icon-a-Frame194"></span>
|
||||||
<div class="name">
|
<div class="name">
|
||||||
Frame 194
|
16-左
|
||||||
</div>
|
</div>
|
||||||
<div class="code-name">.icon-a-Frame194
|
<div class="code-name">.icon-a-Frame194
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -385,24 +418,6 @@
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
<li class="dib">
|
|
||||||
<span class="icon iconfont icon-zhedie"></span>
|
|
||||||
<div class="name">
|
|
||||||
折叠
|
|
||||||
</div>
|
|
||||||
<div class="code-name">.icon-zhedie
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
<li class="dib">
|
|
||||||
<span class="icon iconfont icon-zhankai"></span>
|
|
||||||
<div class="name">
|
|
||||||
展开
|
|
||||||
</div>
|
|
||||||
<div class="code-name">.icon-zhankai
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
</ul>
|
</ul>
|
||||||
<div class="article markdown">
|
<div class="article markdown">
|
||||||
<h2 id="font-class-">font-class 引用</h2>
|
<h2 id="font-class-">font-class 引用</h2>
|
||||||
|
|
@ -430,6 +445,30 @@
|
||||||
<div class="content symbol">
|
<div class="content symbol">
|
||||||
<ul class="icon_lists dib-box">
|
<ul class="icon_lists dib-box">
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#icon-Logo"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">Logo</div>
|
||||||
|
<div class="code-name">#icon-Logo</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#icon-wodejiemianqianwang"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">12</div>
|
||||||
|
<div class="code-name">#icon-wodejiemianqianwang</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#icon-qunliao"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">群聊</div>
|
||||||
|
<div class="code-name">#icon-qunliao</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
<li class="dib">
|
<li class="dib">
|
||||||
<svg class="icon svg-icon" aria-hidden="true">
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
<use xlink:href="#icon-guaduandianhua"></use>
|
<use xlink:href="#icon-guaduandianhua"></use>
|
||||||
|
|
@ -490,7 +529,7 @@
|
||||||
<svg class="icon svg-icon" aria-hidden="true">
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
<use xlink:href="#icon-a-Frame195"></use>
|
<use xlink:href="#icon-a-Frame195"></use>
|
||||||
</svg>
|
</svg>
|
||||||
<div class="name">Frame 195</div>
|
<div class="name">16-右</div>
|
||||||
<div class="code-name">#icon-a-Frame195</div>
|
<div class="code-name">#icon-a-Frame195</div>
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
|
|
@ -522,7 +561,7 @@
|
||||||
<svg class="icon svg-icon" aria-hidden="true">
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
<use xlink:href="#icon-a-Frame194"></use>
|
<use xlink:href="#icon-a-Frame194"></use>
|
||||||
</svg>
|
</svg>
|
||||||
<div class="name">Frame 194</div>
|
<div class="name">16-左</div>
|
||||||
<div class="code-name">#icon-a-Frame194</div>
|
<div class="code-name">#icon-a-Frame194</div>
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
|
|
@ -574,22 +613,6 @@
|
||||||
<div class="code-name">#icon-sousuo</div>
|
<div class="code-name">#icon-sousuo</div>
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
<li class="dib">
|
|
||||||
<svg class="icon svg-icon" aria-hidden="true">
|
|
||||||
<use xlink:href="#icon-zhedie"></use>
|
|
||||||
</svg>
|
|
||||||
<div class="name">折叠</div>
|
|
||||||
<div class="code-name">#icon-zhedie</div>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
<li class="dib">
|
|
||||||
<svg class="icon svg-icon" aria-hidden="true">
|
|
||||||
<use xlink:href="#icon-zhankai"></use>
|
|
||||||
</svg>
|
|
||||||
<div class="name">展开</div>
|
|
||||||
<div class="code-name">#icon-zhankai</div>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
</ul>
|
</ul>
|
||||||
<div class="article markdown">
|
<div class="article markdown">
|
||||||
<h2 id="symbol-">Symbol 引用</h2>
|
<h2 id="symbol-">Symbol 引用</h2>
|
||||||
|
|
|
||||||
|
|
@ -1,11 +1,11 @@
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: "iconfont"; /* Project id 5076160 */
|
font-family: "iconfont"; /* Project id 5076160 */
|
||||||
src: url('iconfont.eot?t=1765173841330'); /* IE9 */
|
src: url('iconfont.eot?t=1766052523135'); /* IE9 */
|
||||||
src: url('iconfont.eot?t=1765173841330#iefix') format('embedded-opentype'), /* IE6-IE8 */
|
src: url('iconfont.eot?t=1766052523135#iefix') format('embedded-opentype'), /* IE6-IE8 */
|
||||||
url('iconfont.woff2?t=1765173841330') format('woff2'),
|
url('iconfont.woff2?t=1766052523135') format('woff2'),
|
||||||
url('iconfont.woff?t=1765173841330') format('woff'),
|
url('iconfont.woff?t=1766052523135') format('woff'),
|
||||||
url('iconfont.ttf?t=1765173841330') format('truetype'),
|
url('iconfont.ttf?t=1766052523135') format('truetype'),
|
||||||
url('iconfont.svg?t=1765173841330#iconfont') format('svg');
|
url('iconfont.svg?t=1766052523135#iconfont') format('svg');
|
||||||
}
|
}
|
||||||
|
|
||||||
.iconfont {
|
.iconfont {
|
||||||
|
|
@ -16,6 +16,18 @@
|
||||||
-moz-osx-font-smoothing: grayscale;
|
-moz-osx-font-smoothing: grayscale;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.icon-Logo:before {
|
||||||
|
content: "\e624";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-wodejiemianqianwang:before {
|
||||||
|
content: "\e622";
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-qunliao:before {
|
||||||
|
content: "\e621";
|
||||||
|
}
|
||||||
|
|
||||||
.icon-guaduandianhua:before {
|
.icon-guaduandianhua:before {
|
||||||
content: "\e620";
|
content: "\e620";
|
||||||
}
|
}
|
||||||
|
|
@ -88,11 +100,3 @@
|
||||||
content: "\e60d";
|
content: "\e60d";
|
||||||
}
|
}
|
||||||
|
|
||||||
.icon-zhedie:before {
|
|
||||||
content: "\e60e";
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon-zhankai:before {
|
|
||||||
content: "\e60f";
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
|
||||||
Binary file not shown.
File diff suppressed because one or more lines are too long
|
|
@ -5,6 +5,27 @@
|
||||||
"css_prefix_text": "icon-",
|
"css_prefix_text": "icon-",
|
||||||
"description": "",
|
"description": "",
|
||||||
"glyphs": [
|
"glyphs": [
|
||||||
|
{
|
||||||
|
"icon_id": "46381406",
|
||||||
|
"name": "Logo",
|
||||||
|
"font_class": "Logo",
|
||||||
|
"unicode": "e624",
|
||||||
|
"unicode_decimal": 58916
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "46339903",
|
||||||
|
"name": "12",
|
||||||
|
"font_class": "wodejiemianqianwang",
|
||||||
|
"unicode": "e622",
|
||||||
|
"unicode_decimal": 58914
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "46337600",
|
||||||
|
"name": "群聊",
|
||||||
|
"font_class": "qunliao",
|
||||||
|
"unicode": "e621",
|
||||||
|
"unicode_decimal": 58913
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"icon_id": "46281959",
|
"icon_id": "46281959",
|
||||||
"name": "挂断电话",
|
"name": "挂断电话",
|
||||||
|
|
@ -56,7 +77,7 @@
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"icon_id": "46252114",
|
"icon_id": "46252114",
|
||||||
"name": "Frame 195",
|
"name": "16-右",
|
||||||
"font_class": "a-Frame195",
|
"font_class": "a-Frame195",
|
||||||
"unicode": "e616",
|
"unicode": "e616",
|
||||||
"unicode_decimal": 58902
|
"unicode_decimal": 58902
|
||||||
|
|
@ -84,7 +105,7 @@
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"icon_id": "46252113",
|
"icon_id": "46252113",
|
||||||
"name": "Frame 194",
|
"name": "16-左",
|
||||||
"font_class": "a-Frame194",
|
"font_class": "a-Frame194",
|
||||||
"unicode": "e61a",
|
"unicode": "e61a",
|
||||||
"unicode_decimal": 58906
|
"unicode_decimal": 58906
|
||||||
|
|
@ -130,20 +151,6 @@
|
||||||
"font_class": "sousuo",
|
"font_class": "sousuo",
|
||||||
"unicode": "e60d",
|
"unicode": "e60d",
|
||||||
"unicode_decimal": 58893
|
"unicode_decimal": 58893
|
||||||
},
|
|
||||||
{
|
|
||||||
"icon_id": "46211226",
|
|
||||||
"name": "折叠",
|
|
||||||
"font_class": "zhedie",
|
|
||||||
"unicode": "e60e",
|
|
||||||
"unicode_decimal": 58894
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"icon_id": "46211225",
|
|
||||||
"name": "展开",
|
|
||||||
"font_class": "zhankai",
|
|
||||||
"unicode": "e60f",
|
|
||||||
"unicode_decimal": 58895
|
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|
|
||||||
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 23 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
|
@ -1,7 +1,19 @@
|
||||||
'use client';
|
'use client';
|
||||||
|
import { useMedia } from '@/hooks/tools';
|
||||||
import ChatSidebar from '@/layout/components/ChatSidebar';
|
import ChatSidebar from '@/layout/components/ChatSidebar';
|
||||||
|
import { useEffect } from 'react';
|
||||||
|
import { useRouter } from 'next/navigation';
|
||||||
|
|
||||||
export default function ChatPage() {
|
export default function ChatPage() {
|
||||||
|
const response = useMedia();
|
||||||
|
const router = useRouter();
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (response?.sm) {
|
||||||
|
router.push('/home');
|
||||||
|
}
|
||||||
|
}, [response?.sm]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="h-full">
|
<div className="h-full">
|
||||||
<ChatSidebar expand />
|
<ChatSidebar expand />
|
||||||
|
|
|
||||||
|
|
@ -171,7 +171,7 @@ export default function Profile({ onActiveTab }: ProfileProps) {
|
||||||
)}
|
)}
|
||||||
onClick={item.onClick}
|
onClick={item.onClick}
|
||||||
>
|
>
|
||||||
<div className="txt-label-l flex-1">{item.label}</div>
|
<div className="txt-label-l">{item.label}</div>
|
||||||
<div className="flex min-w-0 flex-1 cursor-pointer items-center justify-end gap-2">
|
<div className="flex min-w-0 flex-1 cursor-pointer items-center justify-end gap-2">
|
||||||
{item.value && (
|
{item.value && (
|
||||||
<div className="txt-body-l flex items-center text-txt-primary-normal truncate">
|
<div className="txt-body-l flex items-center text-txt-primary-normal truncate">
|
||||||
|
|
@ -193,7 +193,7 @@ export default function Profile({ onActiveTab }: ProfileProps) {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="flex h-full flex-col">
|
<div className="flex h-full flex-col">
|
||||||
<div className="flex flex-1 overflow-y-auto show-scrollbar flex-col gap-4">
|
<div className="flex flex-1 overflow-y-auto pr-1 show-scrollbar flex-col gap-4">
|
||||||
<CharacterAvatorAndName avator={character.headPortrait} name={character.name} />
|
<CharacterAvatorAndName avator={character.headPortrait} name={character.name} />
|
||||||
|
|
||||||
{/* Tags */}
|
{/* Tags */}
|
||||||
|
|
|
||||||
|
|
@ -57,7 +57,7 @@ export default function SettingDialog({ open, onOpenChange }: SettingProps) {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<AlertDialog open={open} onOpenChange={handleChange}>
|
<AlertDialog open={open} onOpenChange={handleChange}>
|
||||||
<AlertDialogContent showCloseButton={activeTab === 'profile'}>
|
<AlertDialogContent className="max-w-[500px]" showCloseButton={activeTab === 'profile'}>
|
||||||
<AlertDialogTitle className="flex justify-between">
|
<AlertDialogTitle className="flex justify-between">
|
||||||
{activeTab === 'profile' ? (
|
{activeTab === 'profile' ? (
|
||||||
<IconButton variant="tertiary" size="small" iconfont="icon-Like" />
|
<IconButton variant="tertiary" size="small" iconfont="icon-Like" />
|
||||||
|
|
|
||||||
|
|
@ -29,11 +29,11 @@ export default function ChatPage() {
|
||||||
</div>
|
</div>
|
||||||
<IconButton
|
<IconButton
|
||||||
onClick={() => setSettingOpen(!settingOpen)}
|
onClick={() => setSettingOpen(!settingOpen)}
|
||||||
className="absolute top-1 right-1"
|
className="absolute top-2 right-2"
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
size="small"
|
size="small"
|
||||||
>
|
>
|
||||||
<i className="iconfont-v2 iconv2-zhedie" />
|
<i className="iconfont-v2 iconv2-zhankai-1" />
|
||||||
</IconButton>
|
</IconButton>
|
||||||
</div>
|
</div>
|
||||||
<SettingDialog open={settingOpen} onOpenChange={setSettingOpen} />
|
<SettingDialog open={settingOpen} onOpenChange={setSettingOpen} />
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
// import { useGetSevenDaysSignList, useSignIn } from '@/hooks/useHome'
|
import { useGetSevenDaysSignList, useSignIn } from '@/hooks/useHome';
|
||||||
// import { SignInListOutput } from '@/services/home/types'
|
import { SignInListOutput } from '@/services/home/types';
|
||||||
import { useQueryClient } from '@tanstack/react-query';
|
import { useQueryClient } from '@tanstack/react-query';
|
||||||
import { homeKeys } from '@/lib/query-keys';
|
import { homeKeys } from '@/lib/query-keys';
|
||||||
import { CheckInCard } from './CheckInCard';
|
import { CheckInCard } from './CheckInCard';
|
||||||
|
|
@ -10,8 +10,8 @@ import { toast } from 'sonner';
|
||||||
|
|
||||||
export function CheckInGrid() {
|
export function CheckInGrid() {
|
||||||
const queryClient = useQueryClient();
|
const queryClient = useQueryClient();
|
||||||
// const { data: signListData, isLoading } = useGetSevenDaysSignList()
|
const { data: signListData, isLoading } = useGetSevenDaysSignList();
|
||||||
// const signInMutation = useSignIn()
|
const signInMutation = useSignIn();
|
||||||
const hasSignRef = useRef(false);
|
const hasSignRef = useRef(false);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
|
|
||||||
|
|
@ -28,7 +28,7 @@ const Character = () => {
|
||||||
return Math.floor(width / cardWidth);
|
return Math.floor(width / cardWidth);
|
||||||
}}
|
}}
|
||||||
renderItem={(character) => <AIStandardCard character={character} />}
|
renderItem={(character) => <AIStandardCard character={character} />}
|
||||||
getItemKey={(character) => character.id}
|
getItemKey={(character, index) => character.id + index}
|
||||||
hasNextPage={!noMoreData}
|
hasNextPage={!noMoreData}
|
||||||
isLoading={isFirstLoading || isLoadingMore}
|
isLoading={isFirstLoading || isLoadingMore}
|
||||||
fetchNextPage={onLoadMore}
|
fetchNextPage={onLoadMore}
|
||||||
|
|
|
||||||
|
|
@ -10,7 +10,7 @@ const Header = React.memo(() => {
|
||||||
const response = useMedia();
|
const response = useMedia();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Link href="/crushcoin">
|
// <Link href="/crushcoin">
|
||||||
<div
|
<div
|
||||||
className="h-25 sm:h-50 rounded-2xl sm:rounded-4xl px-6 mb-12 flex items-center justify-between"
|
className="h-25 sm:h-50 rounded-2xl sm:rounded-4xl px-6 mb-12 flex items-center justify-between"
|
||||||
style={{
|
style={{
|
||||||
|
|
@ -53,15 +53,10 @@ const Header = React.memo(() => {
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{response?.lg && (
|
{response?.lg && (
|
||||||
<Image
|
<Image src="/images/home/banner-header.png" alt="banner-header" width={250} height={250} />
|
||||||
src="/images/home/banner-header.png"
|
|
||||||
alt="banner-header"
|
|
||||||
width={250}
|
|
||||||
height={250}
|
|
||||||
/>
|
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
</Link>
|
// </Link>
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
const Story = () => {
|
const Story = () => {
|
||||||
return <div>Story</div>;
|
return <div>开发中ing</div>;
|
||||||
};
|
};
|
||||||
|
|
||||||
export default Story;
|
export default Story;
|
||||||
|
|
|
||||||
|
|
@ -1,75 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import { formatNumberToKMB } from '@/lib/utils'
|
|
||||||
import Image from 'next/image'
|
|
||||||
import { AiChatRankOutput, AiHeartbeatRankOutput, AiGiftRankOutput } from '@/services/home/types'
|
|
||||||
import { RankType } from '@/types/global'
|
|
||||||
import Link from 'next/link'
|
|
||||||
|
|
||||||
interface LargeRankCardProps {
|
|
||||||
item: AiChatRankOutput | AiHeartbeatRankOutput | AiGiftRankOutput
|
|
||||||
rankType: RankType
|
|
||||||
}
|
|
||||||
|
|
||||||
export default function LargeRankCard({ item, rankType }: LargeRankCardProps) {
|
|
||||||
// 根据排行榜类型获取对应的数值显示
|
|
||||||
const getDisplayValue = () => {
|
|
||||||
switch (rankType) {
|
|
||||||
case RankType.CHAT:
|
|
||||||
return formatNumberToKMB((item as AiChatRankOutput).chatNum || 0)
|
|
||||||
case RankType.CRUSH:
|
|
||||||
return `${(item as AiHeartbeatRankOutput).heartbeatValTotal || 0}℃`
|
|
||||||
case RankType.GIFTS:
|
|
||||||
return formatNumberToKMB(Math.floor((item as AiGiftRankOutput).giftCoinNum || 0) / 100)
|
|
||||||
default:
|
|
||||||
return '0'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 根据排行榜类型获取对应的图标
|
|
||||||
const getIcon = () => {
|
|
||||||
switch (rankType) {
|
|
||||||
case RankType.CHAT:
|
|
||||||
return <i className={`iconfont icon-Chat !text-[12px]`} />
|
|
||||||
case RankType.CRUSH:
|
|
||||||
return <Image src="/icons/icon-crush.svg" alt="" width={12} height={12} />
|
|
||||||
case RankType.GIFTS:
|
|
||||||
return <Image src="/icons/diamond.svg" alt="" width={12} height={12} />
|
|
||||||
default:
|
|
||||||
return <i className={`iconfont icon-Chat !text-[12px]`} />
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const imageUrl = item.homeImageUrl || ''
|
|
||||||
|
|
||||||
if (!item) {
|
|
||||||
return <div className="relative aspect-[240/360] w-[38.5%] overflow-hidden rounded-b-lg"></div>
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Link
|
|
||||||
href={`/chat/${item.aiId}`}
|
|
||||||
prefetch={false}
|
|
||||||
key={item.aiId}
|
|
||||||
className="relative aspect-[240/360] w-[38.5%] overflow-hidden rounded-b-lg"
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
className="absolute inset-0"
|
|
||||||
style={{
|
|
||||||
background: `url(${imageUrl}) #211a2b 50% / cover no-repeat`,
|
|
||||||
maskImage: 'linear-gradient(180deg, rgba(255, 255, 255, 0.00) 0%, #FFF 55%)',
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
<div className="absolute right-0 bottom-0 left-0 aspect-[240/112]">
|
|
||||||
<Image src="/images/leaderboard/1-st.svg" alt="" fill className="object-cover" />
|
|
||||||
</div>
|
|
||||||
<div className="absolute inset-0">
|
|
||||||
<div className="absolute right-0 bottom-[44] left-0 flex items-center justify-center gap-1">
|
|
||||||
{getIcon()}
|
|
||||||
<div className="txt-numMonotype-s">{getDisplayValue()}</div>
|
|
||||||
</div>
|
|
||||||
<div className="txt-numDisplay-m absolute right-0 bottom-1 left-0 text-center">1st</div>
|
|
||||||
</div>
|
|
||||||
</Link>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
@ -1,132 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import Image from 'next/image'
|
|
||||||
import { useMemo } from 'react'
|
|
||||||
import { AiChatRankOutput, AiHeartbeatRankOutput, AiGiftRankOutput } from '@/services/home/types'
|
|
||||||
import { RankType } from '@/types/global'
|
|
||||||
import { formatNumberToKMB } from '@/lib/utils'
|
|
||||||
import Link from 'next/link'
|
|
||||||
import { usePrefetchRoutes } from '@/hooks/useGlobalPrefetchRoutes'
|
|
||||||
|
|
||||||
interface RankingListProps {
|
|
||||||
rankData: (AiChatRankOutput | AiHeartbeatRankOutput | AiGiftRankOutput)[]
|
|
||||||
rankType: RankType
|
|
||||||
startFromRank?: number // 从第几名开始显示，默认为4
|
|
||||||
}
|
|
||||||
|
|
||||||
const RankingList: React.FC<RankingListProps> = ({ rankData, rankType, startFromRank = 4 }) => {
|
|
||||||
const filteredData = useMemo(
|
|
||||||
() => rankData.filter((item) => item.rankNo && item.rankNo >= startFromRank),
|
|
||||||
[rankData, startFromRank]
|
|
||||||
)
|
|
||||||
const chatRoutes = useMemo(
|
|
||||||
() => filteredData.map((item) => (item?.aiId ? `/chat/${item.aiId}` : null)),
|
|
||||||
[filteredData]
|
|
||||||
)
|
|
||||||
usePrefetchRoutes(chatRoutes, { limit: 20 })
|
|
||||||
|
|
||||||
// 根据排行榜类型获取格式化后的显示值
|
|
||||||
const getDisplayValue = (item: AiChatRankOutput | AiHeartbeatRankOutput | AiGiftRankOutput) => {
|
|
||||||
switch (rankType) {
|
|
||||||
case RankType.CHAT:
|
|
||||||
return formatNumberToKMB((item as AiChatRankOutput).chatNum || 0)
|
|
||||||
case RankType.CRUSH:
|
|
||||||
return `${(item as AiHeartbeatRankOutput).heartbeatValTotal || 0}℃`
|
|
||||||
case RankType.GIFTS:
|
|
||||||
return formatNumberToKMB(Math.floor(((item as AiGiftRankOutput).giftCoinNum || 0) / 100))
|
|
||||||
default:
|
|
||||||
return '0'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 根据排行榜类型获取对应的图标组件
|
|
||||||
const getRankIcon = () => {
|
|
||||||
switch (rankType) {
|
|
||||||
case RankType.CHAT:
|
|
||||||
return <i className="iconfont icon-Chat !text-[24px]" />
|
|
||||||
case RankType.CRUSH:
|
|
||||||
return <Image src="/icons/icon-crush.svg" alt="" width={24} height={24} />
|
|
||||||
case RankType.GIFTS:
|
|
||||||
return <Image src="/icons/diamond.svg" alt="" width={24} height={24} />
|
|
||||||
default:
|
|
||||||
return <i className="iconfont icon-Chat !text-[24px]" />
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const getLikedCount = (item: AiChatRankOutput | AiHeartbeatRankOutput | AiGiftRankOutput) => {
|
|
||||||
if ('likedNum' in item && typeof item.likedNum === 'number') {
|
|
||||||
return item.likedNum
|
|
||||||
}
|
|
||||||
return 0
|
|
||||||
}
|
|
||||||
|
|
||||||
if (filteredData.length === 0) {
|
|
||||||
return null
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="mx-auto mt-6 flex max-w-[752px] flex-col gap-2 px-4 pb-4">
|
|
||||||
{filteredData.map((item) => {
|
|
||||||
const displayValue = getDisplayValue(item)
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Link href={`/chat/${item.aiId}`} key={item.aiId} prefetch={false}>
|
|
||||||
<div
|
|
||||||
key={item.aiId}
|
|
||||||
className="box-border flex w-full items-center justify-center gap-4 p-2"
|
|
||||||
>
|
|
||||||
{/* 排名编号 */}
|
|
||||||
<div className="txt-numDisplay-s w-6 shrink-0 text-center">
|
|
||||||
{String(item.rankNo).padStart(2, '0')}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* 头像 */}
|
|
||||||
<div className="relative h-16 w-16 shrink-0">
|
|
||||||
<div className="absolute top-1/2 left-1/2 h-16 w-16 -translate-x-1/2 -translate-y-1/2">
|
|
||||||
<Image
|
|
||||||
src={item.headImg || ''}
|
|
||||||
alt={item.nickname || 'Avatar'}
|
|
||||||
width={64}
|
|
||||||
height={64}
|
|
||||||
className="h-full w-full rounded-full object-cover"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* 用户信息区域 */}
|
|
||||||
<div className="flex min-w-0 flex-1 flex-col gap-2">
|
|
||||||
{/* 用户名 */}
|
|
||||||
<div className="flex w-full items-start gap-2">
|
|
||||||
<div className="txt-title-m truncate">{item.nickname}</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* 喜欢数 */}
|
|
||||||
<div className="flex w-full items-center gap-2">
|
|
||||||
<div className="text-txt-secondary-normal flex items-center gap-1">
|
|
||||||
<i className="iconfont icon-Like-fill !text-[12px]" />
|
|
||||||
<div className="txt-numMonotype-s">
|
|
||||||
{formatNumberToKMB(getLikedCount(item) || 0)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* 排行榜数值 */}
|
|
||||||
<div className="flex items-center">
|
|
||||||
<div className="flex w-16 min-w-6 flex-col items-center justify-center gap-1 rounded-[4px] px-1 py-0.5 backdrop-blur-sm">
|
|
||||||
{/* 图标 */}
|
|
||||||
<div className="flex h-6 w-6 items-center justify-center">{getRankIcon()}</div>
|
|
||||||
|
|
||||||
{/* 数值 */}
|
|
||||||
<div className="txt-numMonotype-s text-center">{displayValue}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</Link>
|
|
||||||
)
|
|
||||||
})}
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export default RankingList
|
|
||||||
|
|
@ -1,83 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import { formatNumberToKMB } from '@/lib/utils'
|
|
||||||
import Image from 'next/image'
|
|
||||||
import { AiChatRankOutput, AiHeartbeatRankOutput, AiGiftRankOutput } from '@/services/home/types'
|
|
||||||
import { RankType } from '@/types/global'
|
|
||||||
import Link from 'next/link'
|
|
||||||
|
|
||||||
interface SmallRankCardProps {
|
|
||||||
item: AiChatRankOutput | AiHeartbeatRankOutput | AiGiftRankOutput
|
|
||||||
rankType: RankType
|
|
||||||
rank?: number // 用于显示排名，如果不传则使用item.rankNo
|
|
||||||
}
|
|
||||||
|
|
||||||
export default function SmallRankCard({ item, rankType, rank }: SmallRankCardProps) {
|
|
||||||
// 根据排行榜类型获取对应的数值显示
|
|
||||||
const getDisplayValue = () => {
|
|
||||||
switch (rankType) {
|
|
||||||
case RankType.CHAT:
|
|
||||||
return formatNumberToKMB((item as AiChatRankOutput).chatNum || 0)
|
|
||||||
case RankType.CRUSH:
|
|
||||||
return `${(item as AiHeartbeatRankOutput).heartbeatValTotal || 0}℃`
|
|
||||||
case RankType.GIFTS:
|
|
||||||
return formatNumberToKMB(Math.floor(((item as AiGiftRankOutput).giftCoinNum || 0) / 100))
|
|
||||||
default:
|
|
||||||
return '0'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 根据排行榜类型获取对应的图标
|
|
||||||
const getIcon = () => {
|
|
||||||
switch (rankType) {
|
|
||||||
case RankType.CHAT:
|
|
||||||
return <i className="iconfont icon-Chat !text-[12px]" />
|
|
||||||
case RankType.CRUSH:
|
|
||||||
return <Image src="/icons/icon-crush.svg" alt="" width={12} height={12} />
|
|
||||||
case RankType.GIFTS:
|
|
||||||
return <Image src="/icons/diamond.svg" alt="" width={12} height={12} />
|
|
||||||
default:
|
|
||||||
return <i className="iconfont icon-Chat !text-[12px]" />
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!item) {
|
|
||||||
return <div className="flex-1 py-12"></div>
|
|
||||||
}
|
|
||||||
|
|
||||||
const imageUrl = item.homeImageUrl || ''
|
|
||||||
const rankNo = rank || item.rankNo || 1
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Link href={`/chat/${item.aiId}`} prefetch={false} key={item.aiId} className="flex-1">
|
|
||||||
<div className="flex-1 py-12">
|
|
||||||
<div className="relative aspect-[240/360] w-full overflow-hidden rounded-b-lg">
|
|
||||||
<div
|
|
||||||
className="absolute inset-0"
|
|
||||||
style={{
|
|
||||||
background: `url(${imageUrl}) #211a2b 50% / cover no-repeat`,
|
|
||||||
maskImage: 'linear-gradient(180deg, rgba(255, 255, 255, 0.00) 0%, #FFF 55%)',
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
<div className="absolute right-0 bottom-0 left-0 aspect-[240/112]">
|
|
||||||
<Image
|
|
||||||
src={`/images/leaderboard/${rankNo}-st.svg`}
|
|
||||||
alt=""
|
|
||||||
fill
|
|
||||||
className="object-cover"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="absolute inset-0">
|
|
||||||
<div className="absolute right-0 bottom-[44] left-0 flex items-center justify-center gap-1">
|
|
||||||
{getIcon()}
|
|
||||||
<div className="txt-numMonotype-s">{getDisplayValue()}</div>
|
|
||||||
</div>
|
|
||||||
<div className="txt-numDisplay-m absolute right-0 bottom-1 left-0 text-center">
|
|
||||||
{rankNo === 2 ? '2nd' : '3rd'}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</Link>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
@ -1,68 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import { useMemo } from 'react'
|
|
||||||
import LargeRankCard from './LargeRankCard'
|
|
||||||
import SmallRankCard from './SmallRankCard'
|
|
||||||
import { AiChatRankOutput, AiHeartbeatRankOutput, AiGiftRankOutput } from '@/services/home/types'
|
|
||||||
import { RankType } from '@/types/global'
|
|
||||||
import { usePrefetchRoutes } from '@/hooks/useGlobalPrefetchRoutes'
|
|
||||||
|
|
||||||
interface TopHeaderProps {
|
|
||||||
rankData: AiChatRankOutput[] | AiHeartbeatRankOutput[] | AiGiftRankOutput[]
|
|
||||||
rankType: RankType
|
|
||||||
isLoading?: boolean
|
|
||||||
}
|
|
||||||
|
|
||||||
export default function TopHeader({ rankData, rankType, isLoading }: TopHeaderProps) {
|
|
||||||
const topThree = useMemo(() => (rankData || []).slice(0, 3), [rankData])
|
|
||||||
const chatRoutes = useMemo(
|
|
||||||
() => topThree.map((item) => (item?.aiId ? `/chat/${item.aiId}` : null)),
|
|
||||||
[topThree]
|
|
||||||
)
|
|
||||||
usePrefetchRoutes(chatRoutes, { limit: 3 })
|
|
||||||
|
|
||||||
if (isLoading) {
|
|
||||||
return (
|
|
||||||
<div className="mx-auto mt-6 max-w-[624px]">
|
|
||||||
<div className="flex w-full items-center gap-4">
|
|
||||||
<div className="flex-1 py-12">
|
|
||||||
<div className="bg-surface-nest-normal aspect-[240/360] w-full animate-pulse rounded-b-lg" />
|
|
||||||
</div>
|
|
||||||
<div className="bg-surface-nest-normal aspect-[240/360] w-[38.5%] animate-pulse rounded-b-lg" />
|
|
||||||
<div className="flex-1 py-12">
|
|
||||||
<div className="bg-surface-nest-normal aspect-[240/360] w-full animate-pulse rounded-b-lg" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!rankData || rankData.length === 0) {
|
|
||||||
return (
|
|
||||||
<div className="mx-auto mt-6 max-w-[624px]">
|
|
||||||
<div className="flex h-64 items-center justify-center">
|
|
||||||
<div className="text-txt-secondary-normal">No leaderboard data yet</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
const firstPlace = topThree[0]
|
|
||||||
const secondPlace = topThree[1]
|
|
||||||
const thirdPlace = topThree[2]
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="mx-auto mt-6 max-w-[624px]">
|
|
||||||
<div className="flex w-full items-center gap-4">
|
|
||||||
{/* 第二名 */}
|
|
||||||
<SmallRankCard item={secondPlace} rankType={rankType} rank={2} />
|
|
||||||
|
|
||||||
{/* 第一名 */}
|
|
||||||
<LargeRankCard item={firstPlace} rankType={rankType} />
|
|
||||||
|
|
||||||
{/* 第三名 */}
|
|
||||||
<SmallRankCard item={thirdPlace} rankType={rankType} rank={3} />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
@ -1,166 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import { Tabs, TabsList, TabsTrigger } from '@/components/ui/tabs'
|
|
||||||
import { cn } from '@/lib/utils'
|
|
||||||
import { useState, useEffect } from 'react'
|
|
||||||
import { useSearchParams } from 'next/navigation'
|
|
||||||
import TopHeader from './components/TopHeader'
|
|
||||||
import RankingList from './components/RankingList'
|
|
||||||
import { useGetChatRank, useGetHeartbeatRank, useGetGiftRank } from '@/hooks/useHome'
|
|
||||||
import { RankType } from '@/types/global'
|
|
||||||
import Image from 'next/image'
|
|
||||||
import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip'
|
|
||||||
import { IconButton } from '@/components/ui/button'
|
|
||||||
|
|
||||||
const LeaderboardPage = () => {
|
|
||||||
const searchParams = useSearchParams()
|
|
||||||
const typeFromUrl = searchParams.get('type')
|
|
||||||
|
|
||||||
// 验证并设置初始 tab，确保 typeFromUrl 是有效的 RankType
|
|
||||||
const getInitialTab = (): RankType => {
|
|
||||||
if (typeFromUrl && Object.values(RankType).includes(typeFromUrl as RankType)) {
|
|
||||||
return typeFromUrl as RankType
|
|
||||||
}
|
|
||||||
return RankType.CHAT
|
|
||||||
}
|
|
||||||
|
|
||||||
const [selectedTab, setSelectedTab] = useState<RankType>(getInitialTab())
|
|
||||||
|
|
||||||
// 当 URL 参数变化时，更新选中的 tab
|
|
||||||
useEffect(() => {
|
|
||||||
const newTab = getInitialTab()
|
|
||||||
setSelectedTab(newTab)
|
|
||||||
}, [typeFromUrl])
|
|
||||||
|
|
||||||
// 调用三个排行榜接口
|
|
||||||
const { data: chatRankData, isLoading: chatLoading, error: chatError } = useGetChatRank()
|
|
||||||
const {
|
|
||||||
data: heartbeatRankData,
|
|
||||||
isLoading: heartbeatLoading,
|
|
||||||
error: heartbeatError,
|
|
||||||
} = useGetHeartbeatRank()
|
|
||||||
const { data: giftRankData, isLoading: giftLoading, error: giftError } = useGetGiftRank()
|
|
||||||
|
|
||||||
const tabs = [
|
|
||||||
{ value: RankType.CHAT, label: 'Chat' },
|
|
||||||
{ value: RankType.CRUSH, label: 'Crush' },
|
|
||||||
{ value: RankType.GIFTS, label: 'Gifts' },
|
|
||||||
]
|
|
||||||
|
|
||||||
// 根据选中的tab获取对应的数据
|
|
||||||
const getCurrentRankData = () => {
|
|
||||||
switch (selectedTab) {
|
|
||||||
case RankType.CHAT:
|
|
||||||
return { data: chatRankData, isLoading: chatLoading, error: chatError }
|
|
||||||
case RankType.CRUSH:
|
|
||||||
return { data: heartbeatRankData, isLoading: heartbeatLoading, error: heartbeatError }
|
|
||||||
case RankType.GIFTS:
|
|
||||||
return { data: giftRankData, isLoading: giftLoading, error: giftError }
|
|
||||||
default:
|
|
||||||
return { data: chatRankData, isLoading: chatLoading, error: chatError }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const currentRankData = getCurrentRankData()
|
|
||||||
|
|
||||||
const backgroundColorMap = {
|
|
||||||
[RankType.CHAT]: 'linear-gradient(122.5deg, #F264A4 20.45%, #C241E6 100%)',
|
|
||||||
[RankType.CRUSH]: 'linear-gradient(122.5deg, #D664F2 20.45%, #416DE6 100%)',
|
|
||||||
[RankType.GIFTS]: 'linear-gradient(122.5deg, #FFC336 20.45%, #FF972F 100%)',
|
|
||||||
}
|
|
||||||
// return (background: linear-gradient(122.5deg, #F264A4 20.45%, #C241E6 100%);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="bg-background-default w-full">
|
|
||||||
<div className="bg-background-default absolute top-0 right-0 bottom-0 left-0">
|
|
||||||
<div
|
|
||||||
className="absolute -top-[215px] h-[300px] w-[100%] opacity-50 blur-3xl"
|
|
||||||
style={{
|
|
||||||
background: backgroundColorMap[selectedTab],
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
<Image src="/images/leaderboard/bg.png" alt="Bg" fill className="object-cover" />
|
|
||||||
</div>
|
|
||||||
<div className="relative mx-auto w-full max-w-[752px]">
|
|
||||||
<h1 className="txt-headline-m pt-12 text-center">Leaderboard</h1>
|
|
||||||
<Tooltip>
|
|
||||||
<TooltipTrigger asChild>
|
|
||||||
<IconButton
|
|
||||||
iconfont="icon-question"
|
|
||||||
variant="tertiaryDark"
|
|
||||||
size="small"
|
|
||||||
className="absolute top-0 right-0"
|
|
||||||
/>
|
|
||||||
</TooltipTrigger>
|
|
||||||
<TooltipContent>
|
|
||||||
<p>The hot chat list is ranked by the number of AI chat sessions.</p>
|
|
||||||
<p>
|
|
||||||
The heart list is ranked by the sum of the heart values generated by all the
|
|
||||||
interlocutors of the AI character.
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
The gift list is ranked by the sum of the gift value received by the AI character.
|
|
||||||
</p>
|
|
||||||
</TooltipContent>
|
|
||||||
</Tooltip>
|
|
||||||
<div className="mt-4 flex items-center justify-center">
|
|
||||||
<Tabs
|
|
||||||
className="h-auto rounded-none p-0"
|
|
||||||
value={selectedTab}
|
|
||||||
onValueChange={(value) => setSelectedTab(value as RankType)}
|
|
||||||
>
|
|
||||||
<TabsList>
|
|
||||||
{tabs.map((tab) => (
|
|
||||||
<TabsTrigger
|
|
||||||
key={tab.value}
|
|
||||||
value={tab.value}
|
|
||||||
className={cn(
|
|
||||||
'relative h-8 border-0 bg-transparent px-2 shadow-none',
|
|
||||||
'txt-title-m text-txt-secondary-normal',
|
|
||||||
'data-[state=active]:text-txt-primary-normal',
|
|
||||||
'data-[state=active]:bg-transparent',
|
|
||||||
'data-[state=active]:shadow-none',
|
|
||||||
'hover:text-txt-primary-normal',
|
|
||||||
'focus-visible:ring-0 focus-visible:ring-offset-0',
|
|
||||||
'flex cursor-pointer items-center justify-center'
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<span className="whitespace-nowrap">{tab.label}</span>
|
|
||||||
{/* 活跃状态指示器 */}
|
|
||||||
<div
|
|
||||||
className={cn(
|
|
||||||
'bg-primary-normal absolute bottom-0 left-1/2 h-1 w-5 -translate-x-1/2 rounded-xs transition-opacity',
|
|
||||||
selectedTab === tab.value ? 'opacity-100' : 'opacity-0'
|
|
||||||
)}
|
|
||||||
/>
|
|
||||||
</TabsTrigger>
|
|
||||||
))}
|
|
||||||
</TabsList>
|
|
||||||
</Tabs>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* 排行榜内容 */}
|
|
||||||
{
|
|
||||||
<>
|
|
||||||
<TopHeader
|
|
||||||
rankData={currentRankData.data || []}
|
|
||||||
rankType={selectedTab}
|
|
||||||
isLoading={currentRankData.isLoading}
|
|
||||||
/>
|
|
||||||
|
|
||||||
{/* 后续排名列表 */}
|
|
||||||
{!currentRankData.isLoading && (
|
|
||||||
<RankingList
|
|
||||||
rankData={currentRankData.data || []}
|
|
||||||
rankType={selectedTab}
|
|
||||||
startFromRank={4}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</>
|
|
||||||
}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export default LeaderboardPage
|
|
||||||
|
|
@ -1,11 +0,0 @@
|
||||||
import Leaderboard from './leaderboard-page'
|
|
||||||
|
|
||||||
const LeaderboardPage = () => {
|
|
||||||
return (
|
|
||||||
<div className="w-full">
|
|
||||||
<Leaderboard />
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export default LeaderboardPage
|
|
||||||
|
|
@ -1,14 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
interface AboutSectionProps {
|
|
||||||
introduction: string
|
|
||||||
}
|
|
||||||
|
|
||||||
export function AboutSection({ introduction }: AboutSectionProps) {
|
|
||||||
return (
|
|
||||||
<div className="bg-surface-base-normal flex w-full flex-col items-start justify-start gap-4 rounded-lg p-6">
|
|
||||||
<h3 className="txt-title-m text-txt-primary-normal">Introduction</h3>
|
|
||||||
<p className="txt-body-l text-txt-primary-normal">{introduction}</p>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
@ -1,266 +0,0 @@
|
||||||
'use client'
|
|
||||||
import { IAlbumItem, LikedStatus, LockStatus } from '@/services/user'
|
|
||||||
import { useAIUser } from '../context/aiUser'
|
|
||||||
import { Button, IconButton } from '@/components/ui/button'
|
|
||||||
import {
|
|
||||||
useLikeAlbumImage,
|
|
||||||
useSetAlbumImageUnlockMethod,
|
|
||||||
useSetDefaultAlbumImage,
|
|
||||||
} from '@/hooks/aiUser'
|
|
||||||
import { cn, delay } from '@/lib/utils'
|
|
||||||
import { Checkbox } from '@/components/ui/checkbox'
|
|
||||||
import {
|
|
||||||
AlertDialog,
|
|
||||||
AlertDialogAction,
|
|
||||||
AlertDialogCancel,
|
|
||||||
AlertDialogContent,
|
|
||||||
AlertDialogDescription,
|
|
||||||
AlertDialogFooter,
|
|
||||||
AlertDialogHeader,
|
|
||||||
AlertDialogTitle,
|
|
||||||
} from '@/components/ui/alert-dialog'
|
|
||||||
import { useState, useRef } from 'react'
|
|
||||||
import AlbumPriceSetting, { AlbumPriceFormData } from '@/components/features/album-price-setting'
|
|
||||||
import Image from 'next/image'
|
|
||||||
import AlbumDeleteAlert from '@/components/features/album-delete-alert'
|
|
||||||
import { formatFromCents } from '@/utils/number'
|
|
||||||
import { useUpdateWalletBalance } from '@/hooks/useWallet'
|
|
||||||
import { isChargeDrawerOpenAtom } from '@/atoms/im'
|
|
||||||
import { useSetAtom } from 'jotai'
|
|
||||||
import Decimal from 'decimal.js'
|
|
||||||
|
|
||||||
const AlbumImageViewerAction = ({
|
|
||||||
datas,
|
|
||||||
originalDatas,
|
|
||||||
currentIndex,
|
|
||||||
onDeleted,
|
|
||||||
onUnlock,
|
|
||||||
unlockingAlbumIdsRef,
|
|
||||||
}: {
|
|
||||||
currentIndex: number
|
|
||||||
datas: IAlbumItem[]
|
|
||||||
originalDatas: IAlbumItem[]
|
|
||||||
onUnlock?: (imageId: number) => Promise<void>
|
|
||||||
onDeleted?: (nextIndex: number | null) => void
|
|
||||||
unlockingAlbumIdsRef: React.RefObject<Set<number>>
|
|
||||||
}) => {
|
|
||||||
const [lockLoading, setLockLoading] = useState(false)
|
|
||||||
const [isDefaultDialogOpen, setIsDefaultDialogOpen] = useState(false)
|
|
||||||
const { isOwner, userId } = useAIUser()
|
|
||||||
const currentData = datas[currentIndex]
|
|
||||||
const { albumId: originalAlbumId } = currentData
|
|
||||||
const current = originalDatas.find((item) => item.albumId === originalAlbumId)
|
|
||||||
const walletUpdate = useUpdateWalletBalance()
|
|
||||||
const setIsChargeDrawerOpen = useSetAtom(isChargeDrawerOpenAtom)
|
|
||||||
|
|
||||||
if (!current) return null
|
|
||||||
const { lockStatus, likedStatus, isDefault, unlockPrice, albumId } = current
|
|
||||||
const isLiked = likedStatus === LikedStatus.Liked
|
|
||||||
|
|
||||||
const likeMutation = useLikeAlbumImage()
|
|
||||||
const setDefaultMutation = useSetDefaultAlbumImage()
|
|
||||||
const setAlbumImageUnlockMethodMutation = useSetAlbumImageUnlockMethod()
|
|
||||||
|
|
||||||
const handleLike = (albumId: number, isLiked: boolean) => {
|
|
||||||
if (!userId) return
|
|
||||||
likeMutation.mutate({
|
|
||||||
albumId,
|
|
||||||
likedStatus: isLiked ? LikedStatus.Canceled : LikedStatus.Liked,
|
|
||||||
aiId: userId,
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleSetDefault = (albumId: number) => {
|
|
||||||
if (!userId) return
|
|
||||||
// 如果是付费图片，则需要弹窗确认
|
|
||||||
if (lockStatus) {
|
|
||||||
setIsDefaultDialogOpen(true)
|
|
||||||
return
|
|
||||||
}
|
|
||||||
handleConfirmSetDefault(albumId)
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleUnlock = async () => {
|
|
||||||
if (!userId || lockLoading || unlockingAlbumIdsRef.current?.has(albumId)) return
|
|
||||||
|
|
||||||
if (!walletUpdate.checkSufficient((unlockPrice || 0) / 100)) {
|
|
||||||
setIsChargeDrawerOpen(true)
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
unlockingAlbumIdsRef.current?.add(albumId)
|
|
||||||
setLockLoading(true)
|
|
||||||
|
|
||||||
try {
|
|
||||||
await onUnlock?.(albumId)
|
|
||||||
} finally {
|
|
||||||
setLockLoading(false)
|
|
||||||
unlockingAlbumIdsRef.current?.delete(albumId)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleConfirmSetDefault = (albumId: number) => {
|
|
||||||
if (!userId) return
|
|
||||||
setDefaultMutation.mutate(
|
|
||||||
{
|
|
||||||
aiId: userId,
|
|
||||||
albumId,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
onSuccess: () => {
|
|
||||||
setIsDefaultDialogOpen(false)
|
|
||||||
},
|
|
||||||
onError: () => {
|
|
||||||
setIsDefaultDialogOpen(false)
|
|
||||||
},
|
|
||||||
}
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleSetAlbumImageUnlockMethod = async (data: AlbumPriceFormData) => {
|
|
||||||
if (!userId) return
|
|
||||||
await setAlbumImageUnlockMethodMutation.mutateAsync({
|
|
||||||
aiId: userId,
|
|
||||||
albumId: datas[currentIndex].albumId,
|
|
||||||
unlockPrice: data.price ? new Decimal(data.price).mul(100).toNumber() : 0,
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
const renderPayAction = () => {
|
|
||||||
if (lockStatus === LockStatus.Lock) {
|
|
||||||
return (
|
|
||||||
<div className="flex items-center gap-3">
|
|
||||||
<div className="txt-label-m text-txt-primary-normal">How to Unlock:</div>
|
|
||||||
<div className="flex items-center gap-1">
|
|
||||||
<Image src="/icons/diamond.svg" alt="diamond" width={16} height={16} />
|
|
||||||
<div className="txt-numMonotype-s text-txt-primary-normal">
|
|
||||||
{formatFromCents(unlockPrice)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
if (isOwner && lockStatus === LockStatus.Unlock) {
|
|
||||||
return (
|
|
||||||
<div className="flex items-center gap-3">
|
|
||||||
<div className="txt-label-m text-txt-primary-normal">How to Unlock:</div>
|
|
||||||
<div className="flex items-center gap-1">
|
|
||||||
<Image src="/icons/diamond.svg" alt="diamond" width={16} height={16} />
|
|
||||||
<div className="txt-numMonotype-s text-txt-primary-normal">
|
|
||||||
{formatFromCents(unlockPrice)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
return <div className="txt-label-m text-txt-primary-normal">How to Unlock: Free</div>
|
|
||||||
}
|
|
||||||
|
|
||||||
const renderDefaultAction = () => {
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<div className="bg-outline-normal h-6 w-px" />
|
|
||||||
<div
|
|
||||||
className="bg-surface-element-light-normal flex h-8 cursor-pointer items-center justify-center gap-2 rounded-full px-3 backdrop-blur-lg"
|
|
||||||
onClick={() => handleSetDefault(albumId)}
|
|
||||||
>
|
|
||||||
<Checkbox shape="round" checked={isDefault} />
|
|
||||||
<div className="txt-label-s">Default</div>
|
|
||||||
</div>
|
|
||||||
<AlertDialog open={isDefaultDialogOpen} onOpenChange={setIsDefaultDialogOpen}>
|
|
||||||
<AlertDialogContent>
|
|
||||||
<AlertDialogHeader>
|
|
||||||
<AlertDialogTitle>Default image</AlertDialogTitle>
|
|
||||||
</AlertDialogHeader>
|
|
||||||
<AlertDialogDescription>
|
|
||||||
After setting this as the default image, its unlock method can only be "Free."
|
|
||||||
</AlertDialogDescription>
|
|
||||||
<AlertDialogFooter>
|
|
||||||
<AlertDialogCancel>Cancel</AlertDialogCancel>
|
|
||||||
<Button
|
|
||||||
variant="primary"
|
|
||||||
loading={setDefaultMutation.isPending}
|
|
||||||
onClick={() => handleConfirmSetDefault(albumId)}
|
|
||||||
>
|
|
||||||
Confirm
|
|
||||||
</Button>
|
|
||||||
</AlertDialogFooter>
|
|
||||||
</AlertDialogContent>
|
|
||||||
</AlertDialog>
|
|
||||||
{!isDefault && <div className="bg-outline-normal h-6 w-px" />}
|
|
||||||
{!isDefault && (
|
|
||||||
<div className="flex items-center gap-3">
|
|
||||||
{renderPayAction()}
|
|
||||||
<AlbumPriceSetting
|
|
||||||
defaultUnlockPrice={unlockPrice || 0}
|
|
||||||
onConfirm={handleSetAlbumImageUnlockMethod}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
<div className="bg-outline-normal h-6 w-px" />
|
|
||||||
<AlbumDeleteAlert
|
|
||||||
aiId={userId!}
|
|
||||||
albumId={albumId}
|
|
||||||
isDefaultImage={!!isDefault}
|
|
||||||
onDeleted={() => {
|
|
||||||
const nextLength = datas.length - 1
|
|
||||||
if (nextLength <= 0) {
|
|
||||||
onDeleted?.(null)
|
|
||||||
return
|
|
||||||
}
|
|
||||||
const isLast = currentIndex >= nextLength
|
|
||||||
const nextIndex = isLast ? nextLength - 1 : currentIndex
|
|
||||||
onDeleted?.(nextIndex)
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<IconButton iconfont="icon-trashcan" variant="tertiary" size="small" />
|
|
||||||
</AlbumDeleteAlert>
|
|
||||||
</>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!isOwner) {
|
|
||||||
if (!lockStatus || lockStatus === LockStatus.Unlock) {
|
|
||||||
// 没有上锁的图片，显示点赞按钮
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<div className="bg-outline-normal h-6 w-px" />
|
|
||||||
<Button
|
|
||||||
variant="tertiary"
|
|
||||||
size="small"
|
|
||||||
className="gap-1"
|
|
||||||
onClick={() => handleLike(datas[currentIndex].albumId, isLiked)}
|
|
||||||
>
|
|
||||||
<i
|
|
||||||
className={cn('iconfont !text-[16px] leading-none', {
|
|
||||||
'icon-Like': !isLiked,
|
|
||||||
'icon-Like-fill !text-important-normal': isLiked,
|
|
||||||
})}
|
|
||||||
/>
|
|
||||||
<div className="txt-label-s">Like</div>
|
|
||||||
</Button>
|
|
||||||
</>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<div className="bg-outline-normal h-6 w-px" />
|
|
||||||
<Button
|
|
||||||
variant="primary"
|
|
||||||
size="small"
|
|
||||||
className="gap-1"
|
|
||||||
onClick={handleUnlock}
|
|
||||||
loading={lockLoading}
|
|
||||||
>
|
|
||||||
Unlock
|
|
||||||
</Button>
|
|
||||||
</>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
return <>{renderDefaultAction()}</>
|
|
||||||
}
|
|
||||||
|
|
||||||
export default AlbumImageViewerAction
|
|
||||||
|
|
@ -1,153 +0,0 @@
|
||||||
import { Tag } from '@/components/ui/tag'
|
|
||||||
import { cn, formatNumberToKMB } from '@/lib/utils'
|
|
||||||
import { IAlbumItem, LikedStatus, LockStatus } from '@/services/user'
|
|
||||||
import Image from 'next/image'
|
|
||||||
import { useState } from 'react'
|
|
||||||
import { useAIUser } from '../context/aiUser'
|
|
||||||
import { IconButton } from '@/components/ui/button'
|
|
||||||
import AlbumItemAction from './AlbumItemAction'
|
|
||||||
import { formatFromCents } from '@/utils/number'
|
|
||||||
|
|
||||||
interface AlbumItemProps {
|
|
||||||
item: IAlbumItem
|
|
||||||
onLike: (albumId: number, isLiked: boolean) => void
|
|
||||||
onImageClick: () => void
|
|
||||||
}
|
|
||||||
|
|
||||||
const AlbumItem = ({ item, onLike, onImageClick }: AlbumItemProps) => {
|
|
||||||
const [imageLoading, setImageLoading] = useState(true)
|
|
||||||
const { isOwner } = useAIUser()
|
|
||||||
|
|
||||||
const handleLike = () => {
|
|
||||||
onLike(item.albumId, item.likedStatus === LikedStatus.Liked)
|
|
||||||
}
|
|
||||||
|
|
||||||
const renderTag = () => {
|
|
||||||
if (item.isDefault) {
|
|
||||||
return null
|
|
||||||
}
|
|
||||||
if (isOwner) {
|
|
||||||
if (item.lockStatus) {
|
|
||||||
return (
|
|
||||||
<Tag variant="dark" className="absolute top-2 right-2 p-[6px]" size="small">
|
|
||||||
<i className="iconfont icon-private !text-[12px] leading-none" />
|
|
||||||
</Tag>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
if (item.lockStatus === LockStatus.Unlock) {
|
|
||||||
return (
|
|
||||||
<Tag
|
|
||||||
variant="default"
|
|
||||||
className="bg-primary-gradient-normal absolute top-2 right-2 p-[6px]"
|
|
||||||
size="small"
|
|
||||||
>
|
|
||||||
<i className="iconfont icon-public !text-[12px] leading-none" />
|
|
||||||
</Tag>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
return null
|
|
||||||
}
|
|
||||||
|
|
||||||
const renderOverlay = () => {
|
|
||||||
// 如果是自己的相册，则不显示解锁按钮
|
|
||||||
if (isOwner) {
|
|
||||||
return null
|
|
||||||
}
|
|
||||||
|
|
||||||
if (item.lockStatus === LockStatus.Lock) {
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
className="absolute inset-0 flex cursor-pointer flex-col items-center justify-center gap-3"
|
|
||||||
onClick={(e) => {
|
|
||||||
// e.stopPropagation();
|
|
||||||
// handleUnlock();
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<i className="iconfont icon-private-border !text-[24px] leading-none" />
|
|
||||||
<div className="flex items-center gap-2">
|
|
||||||
<div className="flex items-center gap-1">
|
|
||||||
<div className="relative h-4 w-4">
|
|
||||||
<Image src="/icons/diamond.svg" alt="diamond" fill className="object-contain" />
|
|
||||||
</div>
|
|
||||||
<span className="text-sm font-semibold text-white">
|
|
||||||
{formatFromCents(item.unlockPrice || 0)}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div className="txt-label-m text-txt-primary-normal">Unlock</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
return null
|
|
||||||
}
|
|
||||||
|
|
||||||
const renderDefaultTag = () => {
|
|
||||||
if (item.isDefault) {
|
|
||||||
return (
|
|
||||||
<Tag variant="dark" className="absolute top-2 left-2" size="small">
|
|
||||||
Default
|
|
||||||
</Tag>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
return null
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="group relative cursor-pointer overflow-hidden rounded-2xl pb-[134%]">
|
|
||||||
<div className="absolute inset-0" onClick={onImageClick}>
|
|
||||||
{/* 背景图片 */}
|
|
||||||
<div className="relative h-full w-full">
|
|
||||||
<Image
|
|
||||||
src={item.imgUrl || item.img1}
|
|
||||||
alt="Album image"
|
|
||||||
fill
|
|
||||||
className={cn(
|
|
||||||
'object-cover object-top transition-opacity duration-300',
|
|
||||||
imageLoading ? 'opacity-0' : 'opacity-100'
|
|
||||||
)}
|
|
||||||
onLoadingComplete={() => setImageLoading(false)}
|
|
||||||
sizes="(max-width: 768px) 50vw, 176px"
|
|
||||||
/>
|
|
||||||
{imageLoading && (
|
|
||||||
<div className="bg-surface-nest-normal absolute inset-0 animate-pulse" />
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
{renderDefaultTag()}
|
|
||||||
|
|
||||||
{/* 标签 */}
|
|
||||||
{renderTag()}
|
|
||||||
|
|
||||||
{/* 付费内容遮罩 */}
|
|
||||||
{renderOverlay()}
|
|
||||||
|
|
||||||
{/* 底部操作区 */}
|
|
||||||
<div
|
|
||||||
className="absolute right-2 bottom-2 left-2 flex items-center justify-between"
|
|
||||||
onClick={(e) => e.stopPropagation()}
|
|
||||||
>
|
|
||||||
{/* 点赞按钮 */}
|
|
||||||
{(item.lockStatus !== LockStatus.Lock || isOwner) && (
|
|
||||||
<div className="bg-surface-element-dark-normal flex items-center gap-[2px] rounded-full pr-1 backdrop-blur-lg">
|
|
||||||
<IconButton variant="ghost" size="xs" onClick={handleLike}>
|
|
||||||
{item.likedStatus === LikedStatus.Liked ? (
|
|
||||||
<i className="iconfont icon-Like-fill !text-important-normal !text-[16px] leading-none" />
|
|
||||||
) : (
|
|
||||||
<i className="iconfont icon-Like !text-[16px] leading-none" />
|
|
||||||
)}
|
|
||||||
</IconButton>
|
|
||||||
<span className="txt-numMonotype-xs text-white">
|
|
||||||
{formatNumberToKMB(item.likedCount ?? 0)}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<AlbumItemAction data={item} />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export default AlbumItem
|
|
||||||
|
|
@ -1,42 +0,0 @@
|
||||||
import {
|
|
||||||
DropdownMenu,
|
|
||||||
DropdownMenuContent,
|
|
||||||
DropdownMenuItem,
|
|
||||||
DropdownMenuTrigger,
|
|
||||||
} from '@/components/ui/dropdown-menu'
|
|
||||||
import { IconButton } from '@/components/ui/button'
|
|
||||||
import { useAIUser } from '../context/aiUser'
|
|
||||||
import { IAlbumItem } from '@/services/user/types'
|
|
||||||
import AlbumDeleteAlert from '@/components/features/album-delete-alert'
|
|
||||||
|
|
||||||
const AlbumItemAction = ({ data }: { data: IAlbumItem }) => {
|
|
||||||
const { isOwner, userId } = useAIUser()
|
|
||||||
|
|
||||||
if (!isOwner) {
|
|
||||||
return null
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<DropdownMenu>
|
|
||||||
<DropdownMenuTrigger asChild>
|
|
||||||
<IconButton
|
|
||||||
variant="tertiaryDark"
|
|
||||||
size="xs"
|
|
||||||
className="relative opacity-0 transition-opacity duration-200 group-hover:opacity-100 data-[state=open]:opacity-100"
|
|
||||||
>
|
|
||||||
<i className="iconfont icon-More !text-[16px] leading-none" />
|
|
||||||
</IconButton>
|
|
||||||
</DropdownMenuTrigger>
|
|
||||||
<DropdownMenuContent>
|
|
||||||
<AlbumDeleteAlert aiId={userId!} albumId={data.albumId} isDefaultImage={!!data.isDefault}>
|
|
||||||
<DropdownMenuItem onSelect={(e) => e.preventDefault()}>
|
|
||||||
<i className="iconfont icon-trashcan !text-[16px] leading-none" />
|
|
||||||
<span>Delete</span>
|
|
||||||
</DropdownMenuItem>
|
|
||||||
</AlbumDeleteAlert>
|
|
||||||
</DropdownMenuContent>
|
|
||||||
</DropdownMenu>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export default AlbumItemAction
|
|
||||||
|
|
@ -1,233 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import { useParams, useRouter, usePathname } from 'next/navigation'
|
|
||||||
import {
|
|
||||||
useGetAIUserAlbumInfinite,
|
|
||||||
useLikeAlbumImage,
|
|
||||||
useUnlockAlbumImage,
|
|
||||||
useUnlockImage,
|
|
||||||
} from '@/hooks/aiUser'
|
|
||||||
import { IAlbumItem, LikedStatus, LockStatus } from '@/services/user/types'
|
|
||||||
import Empty from '@/components/ui/empty'
|
|
||||||
import { toast } from 'sonner'
|
|
||||||
import AlbumItem from './AlbumItem'
|
|
||||||
import { InfiniteScrollList } from '@/components/ui/infinite-scroll-list'
|
|
||||||
import { ImageViewer, ImageViewerPaginationContent } from '@/components/ui/image-viewer'
|
|
||||||
import { useImageViewer } from '@/hooks/useImageViewer'
|
|
||||||
import { useMemo, useRef, useState } from 'react'
|
|
||||||
import { useAIUser } from '../context/aiUser'
|
|
||||||
import AlbumImageViewerAction from './AlbumImageViewerAction'
|
|
||||||
import Image from 'next/image'
|
|
||||||
import { formatFromCents } from '@/utils/number'
|
|
||||||
import { useToken } from '@/hooks/auth'
|
|
||||||
|
|
||||||
// 专门的相册骨架屏组件
|
|
||||||
const AlbumSkeleton = () => (
|
|
||||||
<div className="bg-surface-nest-normal relative animate-pulse overflow-hidden rounded-2xl pb-[134%]">
|
|
||||||
<div className="absolute inset-0">
|
|
||||||
<div className="h-full w-full rounded-2xl" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
|
|
||||||
const AlbumList = () => {
|
|
||||||
const { userId } = useParams()
|
|
||||||
const router = useRouter()
|
|
||||||
const pathname = usePathname()
|
|
||||||
const { isLogin } = useToken()
|
|
||||||
const pageSize = 20
|
|
||||||
const unlockingAlbumIdsRef = useRef<Set<number>>(new Set())
|
|
||||||
|
|
||||||
const { data, isLoading, fetchNextPage, hasNextPage, isFetchingNextPage, isError, refetch } =
|
|
||||||
useGetAIUserAlbumInfinite(Number(userId), pageSize)
|
|
||||||
const likeMutation = useLikeAlbumImage()
|
|
||||||
const unlockMutation = useUnlockImage()
|
|
||||||
const { isOwner } = useAIUser()
|
|
||||||
const [tempList, setTempList] = useState<IAlbumItem[]>([])
|
|
||||||
|
|
||||||
// 图片查看器
|
|
||||||
const {
|
|
||||||
isOpen: isViewerOpen,
|
|
||||||
currentIndex: viewerIndex,
|
|
||||||
openViewer,
|
|
||||||
closeViewer,
|
|
||||||
handleIndexChange,
|
|
||||||
} = useImageViewer()
|
|
||||||
|
|
||||||
// 展平所有页面的数据
|
|
||||||
const albumItems = useMemo(() => {
|
|
||||||
if (!data?.pages) return []
|
|
||||||
return data.pages.flatMap((page) => page.datas || [])
|
|
||||||
}, [data?.pages])
|
|
||||||
|
|
||||||
const handleLike = (albumId: number, isLiked: boolean) => {
|
|
||||||
likeMutation.mutate({
|
|
||||||
albumId,
|
|
||||||
likedStatus: isLiked ? LikedStatus.Canceled : LikedStatus.Liked,
|
|
||||||
aiId: Number(userId),
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleUnlock = async (imageId: number) => {
|
|
||||||
await unlockMutation.mutateAsync(
|
|
||||||
{ aiId: Number(userId), albumId: imageId },
|
|
||||||
{
|
|
||||||
onSuccess: () => {
|
|
||||||
toast.success('Unlocked successfully!')
|
|
||||||
},
|
|
||||||
onError: (error) => {},
|
|
||||||
}
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleImageClick = (item: IAlbumItem, index: number) => {
|
|
||||||
// 检查是否登录，如果未登录则跳转到登录页面
|
|
||||||
if (!isLogin) {
|
|
||||||
const loginUrl = `/login?redirect=${encodeURIComponent(pathname)}`
|
|
||||||
router.push(loginUrl)
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取所有图片URL
|
|
||||||
const imageUrls = albumItems.map((albumItem) => albumItem.imgUrl || albumItem.img3)
|
|
||||||
setTempList(albumItems)
|
|
||||||
// 打开图片查看器
|
|
||||||
openViewer(imageUrls, index)
|
|
||||||
}
|
|
||||||
|
|
||||||
const viewerImages: IAlbumItem[] = useMemo(() => {
|
|
||||||
return tempList.map((item) => {
|
|
||||||
const { albumId } = item
|
|
||||||
const data = albumItems.find((item) => item.albumId === albumId) || {}
|
|
||||||
return data as IAlbumItem
|
|
||||||
})
|
|
||||||
}, [tempList, albumItems])
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<InfiniteScrollList<IAlbumItem>
|
|
||||||
items={albumItems}
|
|
||||||
renderItem={(item, index) => (
|
|
||||||
<AlbumItem
|
|
||||||
item={item}
|
|
||||||
onLike={handleLike}
|
|
||||||
onImageClick={() => handleImageClick(item, index)}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
getItemKey={(item) => item.albumId}
|
|
||||||
hasNextPage={!!hasNextPage}
|
|
||||||
isLoading={isLoading || isFetchingNextPage}
|
|
||||||
fetchNextPage={fetchNextPage}
|
|
||||||
columns={{
|
|
||||||
default: 2,
|
|
||||||
sm: 3,
|
|
||||||
md: 4,
|
|
||||||
lg: 4,
|
|
||||||
xl: 5,
|
|
||||||
}}
|
|
||||||
gap={4}
|
|
||||||
LoadingSkeleton={AlbumSkeleton}
|
|
||||||
EmptyComponent={() => (
|
|
||||||
<div className="bg-surface-base-normal rounded-lg p-6 py-[117px]">
|
|
||||||
<Empty title="No photos yet" />
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
hasError={isError}
|
|
||||||
onRetry={refetch}
|
|
||||||
threshold={300}
|
|
||||||
enabled={true}
|
|
||||||
/>
|
|
||||||
|
|
||||||
{/* 图片查看器 */}
|
|
||||||
<ImageViewer
|
|
||||||
images={viewerImages.map((albumItem) => albumItem.imgUrl || albumItem.img3)}
|
|
||||||
currentIndex={viewerIndex}
|
|
||||||
open={isViewerOpen}
|
|
||||||
onClose={closeViewer}
|
|
||||||
onIndexChange={handleIndexChange}
|
|
||||||
showChooseButton={false}
|
|
||||||
ActionComponent={() => {
|
|
||||||
return (
|
|
||||||
<AlbumImageViewerAction
|
|
||||||
datas={tempList}
|
|
||||||
originalDatas={albumItems}
|
|
||||||
currentIndex={viewerIndex}
|
|
||||||
onUnlock={handleUnlock}
|
|
||||||
unlockingAlbumIdsRef={unlockingAlbumIdsRef}
|
|
||||||
onDeleted={(nextIndex) => {
|
|
||||||
if (nextIndex === null) {
|
|
||||||
// 删除后没有图片了
|
|
||||||
closeViewer()
|
|
||||||
return
|
|
||||||
}
|
|
||||||
// 调整到新的索引，避免越界
|
|
||||||
handleIndexChange(nextIndex)
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
)
|
|
||||||
}}
|
|
||||||
OverlayComponent={() => {
|
|
||||||
const findItem = albumItems.find((item, index) => index === viewerIndex)
|
|
||||||
const { unlockPrice, lockStatus } = findItem || {}
|
|
||||||
if (isOwner || !lockStatus || lockStatus === LockStatus.Unlock) {
|
|
||||||
return null
|
|
||||||
}
|
|
||||||
return (
|
|
||||||
<div className="absolute inset-0 z-10 flex flex-col items-center justify-center gap-6 bg-black/15 backdrop-blur-3xl">
|
|
||||||
<i className="iconfont icon-private !text-[48px] leading-none" />
|
|
||||||
<div className="flex items-center gap-2">
|
|
||||||
<Image src="/icons/diamond.svg" alt="diamond" width={32} height={32} />
|
|
||||||
<div className="txt-title-m">{`${formatFromCents(unlockPrice || 0)} to unlock`}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}}
|
|
||||||
PaginationComponent={() => {
|
|
||||||
const currentIndex = viewerIndex + 1
|
|
||||||
const findItem = tempList.find((item, index) => index === viewerIndex)
|
|
||||||
const { albumId } = findItem || {}
|
|
||||||
const { lockStatus } = albumItems.find((item) => item.albumId === albumId) || {}
|
|
||||||
|
|
||||||
if (isOwner) {
|
|
||||||
if (lockStatus) {
|
|
||||||
return (
|
|
||||||
<ImageViewerPaginationContent className="gap-2">
|
|
||||||
<i className="iconfont icon-private !text-[16px] leading-none" />
|
|
||||||
<span>{`${currentIndex}/${albumItems.length}`}</span>
|
|
||||||
</ImageViewerPaginationContent>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
return (
|
|
||||||
<ImageViewerPaginationContent>
|
|
||||||
<span>{`${currentIndex}/${albumItems.length}`}</span>
|
|
||||||
</ImageViewerPaginationContent>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
if (lockStatus === LockStatus.Lock) {
|
|
||||||
return (
|
|
||||||
<ImageViewerPaginationContent className="bg-primary-gradient-normal gap-2">
|
|
||||||
<i className="iconfont icon-private !text-[16px] leading-none" />
|
|
||||||
<span>{`${currentIndex}/${albumItems.length}`}</span>
|
|
||||||
</ImageViewerPaginationContent>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
if (lockStatus === LockStatus.Unlock) {
|
|
||||||
return (
|
|
||||||
<ImageViewerPaginationContent className="bg-primary-gradient-normal gap-2">
|
|
||||||
<i className="iconfont icon-public !text-[16px] leading-none" />
|
|
||||||
<span>{`${currentIndex}/${albumItems.length}`}</span>
|
|
||||||
</ImageViewerPaginationContent>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
return (
|
|
||||||
<ImageViewerPaginationContent>
|
|
||||||
<span>{`${currentIndex}/${albumItems.length}`}</span>
|
|
||||||
</ImageViewerPaginationContent>
|
|
||||||
)
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export default AlbumList
|
|
||||||
|
|
@ -1,53 +0,0 @@
|
||||||
'use client'
|
|
||||||
import Empty from '@/components/ui/empty'
|
|
||||||
import { useGetAIUserGifts } from '@/hooks/aiUser'
|
|
||||||
import { formatNumberToKMB } from '@/lib/utils'
|
|
||||||
import Image from 'next/image'
|
|
||||||
|
|
||||||
export function GiftGrid({ userId }: { userId: string }) {
|
|
||||||
const { data } = useGetAIUserGifts({ aiId: Number(userId), page: { pn: 1, ps: 100 } })
|
|
||||||
const { datas } = data || {}
|
|
||||||
|
|
||||||
if (datas && !datas.length) {
|
|
||||||
return (
|
|
||||||
<div className="flex w-full flex-col items-start justify-start gap-4 rounded-2xl bg-[#352e3e] p-6">
|
|
||||||
<h3 className="font-['Poppins'] text-[20px] leading-[24px] font-semibold text-white">
|
|
||||||
Gifts
|
|
||||||
</h3>
|
|
||||||
|
|
||||||
<div className="w-full py-20">
|
|
||||||
<Empty title="No gifts yet" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="flex w-full flex-col items-start justify-start gap-4 rounded-2xl bg-[#352e3e] p-6">
|
|
||||||
<h3 className="font-['Poppins'] text-[20px] leading-[24px] font-semibold text-white">
|
|
||||||
Gifts
|
|
||||||
</h3>
|
|
||||||
|
|
||||||
<div className="grid w-full gap-4 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-6">
|
|
||||||
{datas?.map((gift) => (
|
|
||||||
<div key={gift.id} className="flex flex-col items-start justify-start gap-1">
|
|
||||||
<div className="bg-surface-nest-normal relative flex w-full items-center justify-center rounded-sm pb-[100%]">
|
|
||||||
<div className="absolute inset-0 flex items-center justify-center p-4">
|
|
||||||
<Image
|
|
||||||
src={gift.icon ?? ''}
|
|
||||||
alt={gift.name ?? ''}
|
|
||||||
width={100}
|
|
||||||
height={100}
|
|
||||||
className="object-cover"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="txt-label-m text-txt-primary-normal w-full text-center">
|
|
||||||
{gift.name} X{formatNumberToKMB(gift.getNum ?? 0)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
@ -1,65 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import { useState } from 'react'
|
|
||||||
import { cn } from '@/lib/utils'
|
|
||||||
import { UserTab } from '../types'
|
|
||||||
|
|
||||||
interface TabNavigationProps {
|
|
||||||
activeTab?: UserTab
|
|
||||||
onTabChange?: (tab: UserTab) => void
|
|
||||||
}
|
|
||||||
|
|
||||||
export function TabNavigation({ activeTab = UserTab.About, onTabChange }: TabNavigationProps) {
|
|
||||||
const [currentTab, setCurrentTab] = useState(activeTab)
|
|
||||||
|
|
||||||
const handleTabClick = (tab: UserTab) => {
|
|
||||||
setCurrentTab(tab)
|
|
||||||
onTabChange?.(tab)
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="flex flex-row items-center justify-start">
|
|
||||||
{/* About 选项卡 */}
|
|
||||||
<div className="flex flex-col items-start justify-start py-0 pr-4 pl-0">
|
|
||||||
<button
|
|
||||||
onClick={() => handleTabClick(UserTab.About)}
|
|
||||||
className={cn(
|
|
||||||
'flex h-8 w-full flex-col items-center justify-start gap-1',
|
|
||||||
'transition-colors duration-200'
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
className={cn(
|
|
||||||
"text-left font-['Poppins'] text-[20px] leading-[24px] font-semibold whitespace-nowrap",
|
|
||||||
currentTab === UserTab.About ? 'text-white' : 'text-[#958e9e]'
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
About
|
|
||||||
</div>
|
|
||||||
{currentTab === UserTab.About && <div className="h-1 w-5 rounded bg-[#d21f77]" />}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Album 选项卡 */}
|
|
||||||
<div className="flex flex-col items-start justify-start py-0 pr-4 pl-0">
|
|
||||||
<button
|
|
||||||
onClick={() => handleTabClick(UserTab.Album)}
|
|
||||||
className={cn(
|
|
||||||
'flex h-8 w-full flex-col items-center justify-start gap-1',
|
|
||||||
'transition-colors duration-200'
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
className={cn(
|
|
||||||
"text-left font-['Poppins'] text-[20px] leading-[24px] font-semibold whitespace-nowrap",
|
|
||||||
currentTab === UserTab.Album ? 'text-white' : 'text-[#958e9e]'
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
Album
|
|
||||||
</div>
|
|
||||||
{currentTab === UserTab.Album && <div className="h-1 w-5 rounded bg-[#d21f77]" />}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
@ -1,100 +0,0 @@
|
||||||
import {
|
|
||||||
AlertDialog,
|
|
||||||
AlertDialogAction,
|
|
||||||
AlertDialogCancel,
|
|
||||||
AlertDialogContent,
|
|
||||||
AlertDialogDescription,
|
|
||||||
AlertDialogFooter,
|
|
||||||
AlertDialogHeader,
|
|
||||||
AlertDialogTitle,
|
|
||||||
} from '@/components/ui/alert-dialog'
|
|
||||||
import { IconButton } from '@/components/ui/button'
|
|
||||||
import {
|
|
||||||
DropdownMenu,
|
|
||||||
DropdownMenuContent,
|
|
||||||
DropdownMenuItem,
|
|
||||||
DropdownMenuTrigger,
|
|
||||||
} from '@/components/ui/dropdown-menu'
|
|
||||||
import { useDeleteCharacter } from '@/hooks/aiUser'
|
|
||||||
import { useState } from 'react'
|
|
||||||
import { useAIUser } from '../context/aiUser'
|
|
||||||
import { useParams, useRouter } from 'next/navigation'
|
|
||||||
import { useNimChat, useNimConversation, useNimMsgContext } from '@/context/NimChat/useNimChat'
|
|
||||||
|
|
||||||
const UserActionDropdown = () => {
|
|
||||||
const router = useRouter()
|
|
||||||
const [isDeleteCharacterDialogOpen, setIsDeleteCharacterDialogOpen] = useState(false)
|
|
||||||
const { userId, isOwner } = useAIUser()
|
|
||||||
const { removeConversationById } = useNimConversation()
|
|
||||||
const { clearHistoryMessage } = useNimMsgContext()
|
|
||||||
const { nim } = useNimChat()
|
|
||||||
|
|
||||||
const { mutate: deleteCharacter, isPending: isDeleteCharacterLoading } = useDeleteCharacter({
|
|
||||||
aiId: Number(userId),
|
|
||||||
})
|
|
||||||
|
|
||||||
const handleDeleteCharacter = () => {
|
|
||||||
setIsDeleteCharacterDialogOpen(true)
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleDeleteCharacterConfirm = async () => {
|
|
||||||
const conversationId = await nim.V2NIMConversationIdUtil.p2pConversationId(
|
|
||||||
`${userId}@r@t` as string
|
|
||||||
)
|
|
||||||
await removeConversationById(conversationId)
|
|
||||||
await clearHistoryMessage(conversationId)
|
|
||||||
await deleteCharacter({ aiId: Number(userId) })
|
|
||||||
router.replace('/profile')
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!isOwner) return null
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<div className="absolute top-0 right-0 left-0">
|
|
||||||
<div className="mx-auto max-w-[1120px] px-6">
|
|
||||||
<div className="relative w-full">
|
|
||||||
<div className="absolute top-0 right-0">
|
|
||||||
<DropdownMenu>
|
|
||||||
<DropdownMenuTrigger asChild>
|
|
||||||
<IconButton iconfont="icon-More" size="large" variant="tertiaryDark" />
|
|
||||||
</DropdownMenuTrigger>
|
|
||||||
<DropdownMenuContent align="end">
|
|
||||||
<DropdownMenuItem onClick={handleDeleteCharacter}>
|
|
||||||
<i className="iconfont icon-trashcan !text-[16px] leading-none" />
|
|
||||||
<span>Delete Character</span>
|
|
||||||
</DropdownMenuItem>
|
|
||||||
</DropdownMenuContent>
|
|
||||||
</DropdownMenu>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<AlertDialog open={isDeleteCharacterDialogOpen} onOpenChange={setIsDeleteCharacterDialogOpen}>
|
|
||||||
<AlertDialogContent>
|
|
||||||
<AlertDialogHeader>
|
|
||||||
<AlertDialogTitle>Delete Character</AlertDialogTitle>
|
|
||||||
</AlertDialogHeader>
|
|
||||||
<AlertDialogDescription>
|
|
||||||
Once deleted, the character cannot be restored. To ensure a good user experience, users
|
|
||||||
who have previously chatted with or made purchases for this character will still be able
|
|
||||||
to interact with them.
|
|
||||||
</AlertDialogDescription>
|
|
||||||
<AlertDialogFooter>
|
|
||||||
<AlertDialogCancel>Cancel</AlertDialogCancel>
|
|
||||||
<AlertDialogAction
|
|
||||||
variant="destructive"
|
|
||||||
loading={isDeleteCharacterLoading}
|
|
||||||
onClick={handleDeleteCharacterConfirm}
|
|
||||||
>
|
|
||||||
Delete
|
|
||||||
</AlertDialogAction>
|
|
||||||
</AlertDialogFooter>
|
|
||||||
</AlertDialogContent>
|
|
||||||
</AlertDialog>
|
|
||||||
</>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export default UserActionDropdown
|
|
||||||
|
|
@ -1,136 +0,0 @@
|
||||||
import { useGetAIUserBaseInfo } from '@/hooks/aiUser'
|
|
||||||
import { cn, loadImageAsync } from '@/lib/utils'
|
|
||||||
import { useParams } from 'next/navigation'
|
|
||||||
import { useEffect, useRef, useState } from 'react'
|
|
||||||
|
|
||||||
const getDominantColor = (data: Uint8ClampedArray) => {
|
|
||||||
let red = 0,
|
|
||||||
green = 0,
|
|
||||||
blue = 0
|
|
||||||
const length = data.length
|
|
||||||
for (let i = 0; i < length; i += 4) {
|
|
||||||
red += data[i]
|
|
||||||
green += data[i + 1]
|
|
||||||
blue += data[i + 2]
|
|
||||||
}
|
|
||||||
// 计算像素点数
|
|
||||||
const pixelCount = length / 4
|
|
||||||
red = Math.round(red / pixelCount)
|
|
||||||
green = Math.round(green / pixelCount)
|
|
||||||
blue = Math.round(blue / pixelCount)
|
|
||||||
return `${red}, ${green}, ${blue}`
|
|
||||||
}
|
|
||||||
|
|
||||||
const getImageRightDominantColor = (ctx: any, image: any) => {
|
|
||||||
const imageData = ctx.getImageData(image.width - 1, 0, 1, image.height)
|
|
||||||
return getDominantColor(imageData.data)
|
|
||||||
}
|
|
||||||
const getImageLeftDominantColor = (ctx: any, image: any) => {
|
|
||||||
const imageData = ctx.getImageData(0, 0, 1, image.height)
|
|
||||||
return getDominantColor(imageData.data)
|
|
||||||
}
|
|
||||||
|
|
||||||
const UserBackground = () => {
|
|
||||||
const { userId } = useParams()
|
|
||||||
const { data } = useGetAIUserBaseInfo({ aiId: Number(userId) })
|
|
||||||
const [colors, setColors] = useState({
|
|
||||||
leftColor: '#37363b',
|
|
||||||
rightColor: '#313133',
|
|
||||||
})
|
|
||||||
const [isLoading, setIsLoading] = useState(true)
|
|
||||||
const canvasRef = useRef<HTMLCanvasElement>(null)
|
|
||||||
|
|
||||||
// 获取图片两边的颜色
|
|
||||||
const getImageColors = async (url: string) => {
|
|
||||||
const image: any = await loadImageAsync(url)
|
|
||||||
const canvas: any = canvasRef.current
|
|
||||||
canvas.width = image.width
|
|
||||||
canvas.height = image.height
|
|
||||||
const ctx = canvas.getContext('2d')
|
|
||||||
ctx.drawImage(image, 0, 0)
|
|
||||||
const rightColor = getImageRightDominantColor(ctx, image)
|
|
||||||
const leftColor = getImageLeftDominantColor(ctx, image)
|
|
||||||
return {
|
|
||||||
leftColor,
|
|
||||||
rightColor,
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
const init = async () => {
|
|
||||||
if (data?.homeImageUrl) {
|
|
||||||
setIsLoading(true)
|
|
||||||
try {
|
|
||||||
const { leftColor, rightColor } = await getImageColors(data.homeImageUrl)
|
|
||||||
setColors({
|
|
||||||
leftColor,
|
|
||||||
rightColor,
|
|
||||||
})
|
|
||||||
} catch (error) {
|
|
||||||
console.error('获取图片颜色失败:', error)
|
|
||||||
} finally {
|
|
||||||
setIsLoading(false)
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
setIsLoading(false)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
init()
|
|
||||||
}, [data?.homeImageUrl])
|
|
||||||
|
|
||||||
if (!data) {
|
|
||||||
return null
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
{/* 背景头部区域 */}
|
|
||||||
<div className="bg-background-default absolute top-0 right-0 left-0 h-60 overflow-hidden">
|
|
||||||
{/* 加载状态 - 显示默认背景 */}
|
|
||||||
{isLoading && (
|
|
||||||
<>
|
|
||||||
<div className="absolute top-0 right-1/2 left-0 h-60 bg-[#36363b]" />
|
|
||||||
<div className="absolute top-0 right-0 left-1/2 h-60 bg-[#313133]" />
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{/* 加载完成后的背景 */}
|
|
||||||
{!isLoading && (
|
|
||||||
<>
|
|
||||||
<div
|
|
||||||
className="absolute top-0 right-1/2 left-0 h-60 bg-[#36363b] transition-all duration-500 ease-in-out"
|
|
||||||
style={{ background: `rgb(${colors.leftColor})` }}
|
|
||||||
/>
|
|
||||||
<div
|
|
||||||
className="absolute top-0 right-0 left-1/2 h-60 bg-[#313133] transition-all duration-500 ease-in-out"
|
|
||||||
style={{ background: `rgb(${colors.rightColor})` }}
|
|
||||||
/>
|
|
||||||
|
|
||||||
{/* 背景图片 */}
|
|
||||||
<div
|
|
||||||
className="absolute top-[-167px] left-1/2 h-[1337px] w-[752px] translate-x-[-50%] bg-cover bg-center bg-no-repeat transition-opacity duration-500 ease-in-out"
|
|
||||||
style={{ backgroundImage: `url(${data?.homeImageUrl || ''})` }}
|
|
||||||
/>
|
|
||||||
|
|
||||||
{/* 渐变遮罩 */}
|
|
||||||
<div
|
|
||||||
className="absolute top-0 left-1/2 flex h-full w-[752px] translate-x-[-50%] items-center justify-between transition-opacity duration-500 ease-in-out"
|
|
||||||
style={{
|
|
||||||
backgroundImage: `linear-gradient(90deg, rgba(${colors.leftColor}, 1) 0%, rgba(${colors.leftColor}, 0) 20%, rgba(${colors.rightColor}, 0) 80%, rgba(${colors.rightColor}, 1) 100%)`,
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{/* <div className={cn('h-60 w-32', `bg-gradient-to-r from-[${colors.leftColor}] to-transparent`)} />
|
|
||||||
<div className={cn('h-60 w-32', `bg-gradient-to-l from-[${colors.rightColor}] to-transparent`)} /> */}
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{/* 底部渐变遮罩 */}
|
|
||||||
<div className="to-background-default absolute inset-0 bg-linear-to-b from-transparent" />
|
|
||||||
<canvas ref={canvasRef} style={{ display: 'none' }}></canvas>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export default UserBackground
|
|
||||||
|
|
@ -1,223 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import { Button, IconButton } from '@/components/ui/button'
|
|
||||||
import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar'
|
|
||||||
import { useGetAIUserBaseInfo, useGetAIUserStat } from '@/hooks/aiUser'
|
|
||||||
import { useParams, useRouter } from 'next/navigation'
|
|
||||||
import { formatNumberToKMB, getAge } from '@/lib/utils'
|
|
||||||
import { Tag } from '@/components/ui/tag'
|
|
||||||
import Image from 'next/image'
|
|
||||||
import { useAIUser } from '../context/aiUser'
|
|
||||||
import { useEditFormStorage, useEditAI, useEditAIAvatar } from '@/hooks/create'
|
|
||||||
import { useNimChat, useNimConversation } from '@/context/NimChat/useNimChat'
|
|
||||||
import { useCurrentUser, useToken } from '@/hooks/auth'
|
|
||||||
import { AvatarCropModal } from '@/components/ui/avatar-crop-modal'
|
|
||||||
import { useState, useRef } from 'react'
|
|
||||||
import { BizTypeEnum } from '@/services/common'
|
|
||||||
import { AIPermission, CreateOrEditAiRequest } from '@/services/create'
|
|
||||||
import UserShare from './UserShare'
|
|
||||||
import UserLikeButton from './UserLikeButton'
|
|
||||||
import Decimal from 'decimal.js'
|
|
||||||
|
|
||||||
const genderMap = {
|
|
||||||
0: '/icons/male.svg',
|
|
||||||
1: '/icons/female.svg',
|
|
||||||
2: '/icons/gender-neutral.svg',
|
|
||||||
}
|
|
||||||
|
|
||||||
export function UserCard() {
|
|
||||||
const { userId } = useParams()
|
|
||||||
const { data } = useGetAIUserBaseInfo({ aiId: Number(userId) })
|
|
||||||
const { isOwner } = useAIUser()
|
|
||||||
const router = useRouter()
|
|
||||||
const { insertConversationActive } = useNimConversation()
|
|
||||||
|
|
||||||
const { birthday, characterName, headImg, nickname, sex, tagName, homeImageUrl } = data || {}
|
|
||||||
const { data: statData } = useGetAIUserStat({ aiId: Number(userId) })
|
|
||||||
const { chatNum, coinNum, conversationNum, likedNum } = statData || {}
|
|
||||||
const { clearFormData } = useEditFormStorage()
|
|
||||||
const { isNimLoggedIn } = useNimChat()
|
|
||||||
const { getLoginStatus } = useToken()
|
|
||||||
|
|
||||||
// AI用户编辑hook
|
|
||||||
const { mutateAsync: editAIAvatar, isPending: isEditingAIAvatar } = useEditAIAvatar()
|
|
||||||
|
|
||||||
// 头像裁剪相关状态
|
|
||||||
const [showCropModal, setShowCropModal] = useState(false)
|
|
||||||
const fileInputRef = useRef<HTMLInputElement>(null)
|
|
||||||
|
|
||||||
const statList = [
|
|
||||||
{
|
|
||||||
label: 'Likes',
|
|
||||||
value: formatNumberToKMB(likedNum || 0),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 'Chats',
|
|
||||||
value: formatNumberToKMB(chatNum || 0),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 'Users',
|
|
||||||
value: formatNumberToKMB(conversationNum || 0),
|
|
||||||
},
|
|
||||||
isOwner && {
|
|
||||||
label: 'CrushCoin',
|
|
||||||
value: formatNumberToKMB(new Decimal(coinNum || 0).div(100).toNumber()),
|
|
||||||
},
|
|
||||||
].filter(Boolean) as { label: string; value: string | number }[]
|
|
||||||
|
|
||||||
const handleEdit = () => {
|
|
||||||
clearFormData()
|
|
||||||
router.push(`/edit/${userId}/type`)
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleChat = () => {
|
|
||||||
if (!getLoginStatus()) {
|
|
||||||
router.push(`/chat/${userId}`)
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!isNimLoggedIn) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
// insertConversationActive({
|
|
||||||
// receiverId: `${userId}@r@t` as string,
|
|
||||||
// })
|
|
||||||
router.push(`/chat/${userId}`)
|
|
||||||
}
|
|
||||||
|
|
||||||
// 处理头像点击
|
|
||||||
const handleAvatarClick = () => {
|
|
||||||
if (!isOwner) return
|
|
||||||
setShowCropModal(true)
|
|
||||||
}
|
|
||||||
|
|
||||||
// 处理裁剪完成
|
|
||||||
const handleCropComplete = async (croppedImageUrl: string) => {
|
|
||||||
try {
|
|
||||||
// 更新AI用户头像 - 只更新头像，其他信息保持原样
|
|
||||||
await editAIAvatar({
|
|
||||||
aiId: Number(userId),
|
|
||||||
userHead: croppedImageUrl,
|
|
||||||
})
|
|
||||||
} catch (error) {
|
|
||||||
// 可以添加错误提示
|
|
||||||
} finally {
|
|
||||||
setShowCropModal(false)
|
|
||||||
// 清空文件输入
|
|
||||||
if (fileInputRef.current) {
|
|
||||||
fileInputRef.current.value = ''
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 处理裁剪取消
|
|
||||||
const handleCropCancel = () => {
|
|
||||||
setShowCropModal(false)
|
|
||||||
// 清空文件输入
|
|
||||||
if (fileInputRef.current) {
|
|
||||||
fileInputRef.current.value = ''
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const renderChatButton = () => {
|
|
||||||
if (isOwner) {
|
|
||||||
return (
|
|
||||||
<Button variant="tertiary" size="large" className="flex-1" onClick={handleEdit}>
|
|
||||||
Edit
|
|
||||||
</Button>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Button size="large" className="flex-1" onClick={handleChat}>
|
|
||||||
Chat
|
|
||||||
</Button>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!data) {
|
|
||||||
return null
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="relative">
|
|
||||||
{/* 背景卡片 */}
|
|
||||||
<div className="absolute top-16 right-0 bottom-0 left-0 rounded-2xl bg-[#352e3e]" />
|
|
||||||
|
|
||||||
{/* 内容 */}
|
|
||||||
<div className="relative flex flex-col items-center justify-start gap-6 px-6 pt-0 pb-6">
|
|
||||||
{/* 头像 */}
|
|
||||||
<div className="relative size-32">
|
|
||||||
<Avatar
|
|
||||||
className={`size-full ${isOwner ? 'cursor-pointer transition-opacity hover:opacity-80' : ''}`}
|
|
||||||
onClick={handleAvatarClick}
|
|
||||||
>
|
|
||||||
<AvatarImage src={headImg} width={128} height={128} className="object-cover" />
|
|
||||||
<AvatarFallback className="!txt-headline-l text-txt-primary-normal">
|
|
||||||
{nickname?.slice(0, 1)}
|
|
||||||
</AvatarFallback>
|
|
||||||
</Avatar>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* 用户信息 */}
|
|
||||||
<div className="flex w-full flex-col items-start justify-start gap-4">
|
|
||||||
{/* 用户名 */}
|
|
||||||
<h1 className="txt-headline-s w-full truncate text-center">{nickname}</h1>
|
|
||||||
|
|
||||||
{/* 标签 */}
|
|
||||||
<div className="flex w-full flex-wrap items-start justify-center gap-2">
|
|
||||||
{/* 年龄和性别标签 */}
|
|
||||||
<Tag>
|
|
||||||
<Image src={genderMap[sex ?? 0]} alt="Gender" width={16} height={16} />
|
|
||||||
<div>{getAge(birthday ?? 0)}</div>
|
|
||||||
</Tag>
|
|
||||||
<Tag>{characterName}</Tag>
|
|
||||||
<Tag>{tagName}</Tag>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* 统计数据 */}
|
|
||||||
<div className="bg-surface-nest-normal flex w-full flex-row items-start justify-start rounded-sm px-1 py-3">
|
|
||||||
{statList.map((item, index) => (
|
|
||||||
<div
|
|
||||||
key={index}
|
|
||||||
className="flex flex-1 flex-col items-center justify-start gap-1 px-1 py-0"
|
|
||||||
>
|
|
||||||
<div className="txt-numDisplay-s text-txt-primary-normal">{item.value}</div>
|
|
||||||
<div className="txt-label-s text-txt-secondary-normal">{item.label}</div>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* 操作按钮 */}
|
|
||||||
<div className="flex w-full flex-row items-start justify-center gap-4">
|
|
||||||
{/* 分享按钮 */}
|
|
||||||
<UserShare />
|
|
||||||
|
|
||||||
{/* 聊天 */}
|
|
||||||
{isOwner && (
|
|
||||||
<IconButton variant="tertiary" size="large" onClick={handleChat}>
|
|
||||||
<i className="iconfont icon-Chat" />
|
|
||||||
</IconButton>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<UserLikeButton />
|
|
||||||
|
|
||||||
{renderChatButton()}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* 头像裁剪弹窗 */}
|
|
||||||
{homeImageUrl && (
|
|
||||||
<AvatarCropModal
|
|
||||||
isOpen={showCropModal}
|
|
||||||
onClose={() => setShowCropModal(false)}
|
|
||||||
image={homeImageUrl}
|
|
||||||
onConfirm={handleCropComplete}
|
|
||||||
onCancel={handleCropCancel}
|
|
||||||
bizType={BizTypeEnum.Album}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
@ -1,59 +0,0 @@
|
||||||
'use client'
|
|
||||||
import { IconButton } from '@/components/ui/button'
|
|
||||||
import { useGetAIUserBaseInfo } from '@/hooks/aiUser'
|
|
||||||
import { useDoAiUserLiked } from '@/hooks/useCommon'
|
|
||||||
import { aiUserKeys, imKeys } from '@/lib/query-keys'
|
|
||||||
import { useQueryClient } from '@tanstack/react-query'
|
|
||||||
import { useParams, useRouter } from 'next/navigation'
|
|
||||||
import { useToken } from '@/hooks/auth'
|
|
||||||
|
|
||||||
const UserLikeButton = () => {
|
|
||||||
const { userId } = useParams()
|
|
||||||
const router = useRouter()
|
|
||||||
const { isLogin } = useToken()
|
|
||||||
const { data } = useGetAIUserBaseInfo({ aiId: Number(userId) })
|
|
||||||
const { mutateAsync: doAiUserLiked } = useDoAiUserLiked()
|
|
||||||
const { liked } = data || {}
|
|
||||||
const queryClient = useQueryClient()
|
|
||||||
|
|
||||||
const handleLike = () => {
|
|
||||||
// 检查是否登录，如果未登录则跳转到登录页面
|
|
||||||
if (!isLogin) {
|
|
||||||
const currentPath = `/@${userId}`
|
|
||||||
router.push(`/login?redirect=${encodeURIComponent(currentPath)}`)
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
doAiUserLiked({ aiId: Number(userId), likedStatus: liked ? 'CANCELED' : 'LIKED' })
|
|
||||||
queryClient.setQueryData(aiUserKeys.baseInfo({ aiId: Number(userId) }), (oldData: any) => {
|
|
||||||
return {
|
|
||||||
...oldData,
|
|
||||||
liked: !liked,
|
|
||||||
}
|
|
||||||
})
|
|
||||||
queryClient.setQueryData(imKeys.imUserInfo(Number(userId)), (oldData: any) => {
|
|
||||||
return {
|
|
||||||
...oldData,
|
|
||||||
liked: !liked,
|
|
||||||
}
|
|
||||||
})
|
|
||||||
queryClient.setQueryData(aiUserKeys.stat({ aiId: Number(userId) }), (oldData: any) => {
|
|
||||||
return {
|
|
||||||
...oldData,
|
|
||||||
likedNum: !liked ? oldData.likedNum + 1 : oldData.likedNum - 1,
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<IconButton variant="tertiary" size="large" onClick={handleLike}>
|
|
||||||
{!liked ? (
|
|
||||||
<i className="iconfont icon-Like" />
|
|
||||||
) : (
|
|
||||||
<i className="iconfont icon-Like-fill text-important-normal" />
|
|
||||||
)}
|
|
||||||
</IconButton>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export default UserLikeButton
|
|
||||||
|
|
@ -1,49 +0,0 @@
|
||||||
import { TabsList, TabsTrigger } from '@/components/ui/tabs'
|
|
||||||
import { UserTab } from '../types'
|
|
||||||
import { useAIUser } from '../context/aiUser'
|
|
||||||
import { Button } from '@/components/ui/button'
|
|
||||||
import { useRouter } from 'next/navigation'
|
|
||||||
|
|
||||||
const UserProfileTabs = ({ currentTab }: { currentTab: UserTab }) => {
|
|
||||||
const { isOwner, userId } = useAIUser()
|
|
||||||
const router = useRouter()
|
|
||||||
|
|
||||||
const handleCreatePhoto = () => {
|
|
||||||
router.push(`/generate/image-2-image?id=${userId}`)
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="flex items-center justify-between gap-4">
|
|
||||||
{/* Tab 列表 */}
|
|
||||||
<TabsList className="mb-0 h-auto w-fit justify-start gap-4 bg-transparent p-0">
|
|
||||||
<TabsTrigger
|
|
||||||
value={UserTab.About}
|
|
||||||
className="relative h-auto cursor-pointer flex-col gap-1"
|
|
||||||
>
|
|
||||||
<span className="txt-title-m text-txt-secondary-normal group-data-[state=active]:text-txt-primary-normal">
|
|
||||||
About
|
|
||||||
</span>
|
|
||||||
<div className="bg-primary-normal h-1 w-5 rounded opacity-0 group-data-[state=active]:opacity-100" />
|
|
||||||
</TabsTrigger>
|
|
||||||
|
|
||||||
<TabsTrigger
|
|
||||||
value={UserTab.Album}
|
|
||||||
className="relative h-auto cursor-pointer flex-col gap-1"
|
|
||||||
>
|
|
||||||
<span className="txt-title-m text-txt-secondary-normal group-data-[state=active]:text-txt-primary-normal">
|
|
||||||
Album
|
|
||||||
</span>
|
|
||||||
<div className="bg-primary-normal h-1 w-5 rounded opacity-0 group-data-[state=active]:opacity-100" />
|
|
||||||
</TabsTrigger>
|
|
||||||
</TabsList>
|
|
||||||
|
|
||||||
{isOwner && currentTab === UserTab.Album && (
|
|
||||||
<Button variant="secondary" size="small" onClick={handleCreatePhoto}>
|
|
||||||
Generate
|
|
||||||
</Button>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export default UserProfileTabs
|
|
||||||
|
|
@ -1,52 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import { IconButton } from '@/components/ui/button'
|
|
||||||
import {
|
|
||||||
DropdownMenu,
|
|
||||||
DropdownMenuContent,
|
|
||||||
DropdownMenuItem,
|
|
||||||
DropdownMenuTrigger,
|
|
||||||
} from '@/components/ui/dropdown-menu'
|
|
||||||
import useShare from '@/hooks/useShare'
|
|
||||||
import { useParams } from 'next/navigation'
|
|
||||||
|
|
||||||
const UserShare = () => {
|
|
||||||
const { userId } = useParams()
|
|
||||||
|
|
||||||
const { shareFacebook, shareTwitter } = useShare()
|
|
||||||
|
|
||||||
const handleShareFacebook = () => {
|
|
||||||
shareFacebook({
|
|
||||||
text: 'Come to Crushlevel for chat, Crush, and AI - chat.',
|
|
||||||
shareUrl: `${process.env.NEXT_PUBLIC_APP_URL}/@${userId}`,
|
|
||||||
})
|
|
||||||
}
|
|
||||||
const handleShareTwitter = () => {
|
|
||||||
shareTwitter({
|
|
||||||
text: 'Come to Crushlevel for chat, Crush, and AI - chat.',
|
|
||||||
shareUrl: `${process.env.NEXT_PUBLIC_APP_URL}/@${userId}`,
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<DropdownMenu>
|
|
||||||
<DropdownMenuTrigger asChild>
|
|
||||||
<IconButton variant="tertiary" size="large">
|
|
||||||
<i className="iconfont icon-Share-border" />
|
|
||||||
</IconButton>
|
|
||||||
</DropdownMenuTrigger>
|
|
||||||
<DropdownMenuContent>
|
|
||||||
<DropdownMenuItem onClick={handleShareFacebook}>
|
|
||||||
<i className="iconfont icon-social-facebook" />
|
|
||||||
<span>Share to Facebook</span>
|
|
||||||
</DropdownMenuItem>
|
|
||||||
<DropdownMenuItem onClick={handleShareTwitter}>
|
|
||||||
<i className="iconfont icon-social-twitter" />
|
|
||||||
<span>Share to X</span>
|
|
||||||
</DropdownMenuItem>
|
|
||||||
</DropdownMenuContent>
|
|
||||||
</DropdownMenu>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export default UserShare
|
|
||||||
|
|
@ -1,44 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import { AiUserBaseOutput } from '@/services/user'
|
|
||||||
import { createContext } from 'react'
|
|
||||||
import { useGetAIUserBaseInfo } from '@/hooks/aiUser'
|
|
||||||
import { useParams } from 'next/navigation'
|
|
||||||
import { useCurrentUser } from '@/hooks/auth'
|
|
||||||
import Empty from '@/components/ui/empty'
|
|
||||||
|
|
||||||
export * from './useAIUser'
|
|
||||||
|
|
||||||
const AIUserContext = createContext<{
|
|
||||||
user: AiUserBaseOutput | undefined
|
|
||||||
isOwner: boolean
|
|
||||||
userId: number | undefined
|
|
||||||
}>({
|
|
||||||
user: undefined,
|
|
||||||
isOwner: false,
|
|
||||||
userId: undefined,
|
|
||||||
})
|
|
||||||
|
|
||||||
export const AIUserProvider = ({ children }: { children: React.ReactNode }) => {
|
|
||||||
const { userId } = useParams()
|
|
||||||
|
|
||||||
const { data, error } = useGetAIUserBaseInfo({ aiId: Number(userId) })
|
|
||||||
const { data: currentUser } = useCurrentUser()
|
|
||||||
const isOwner = currentUser?.userId === data?.userId
|
|
||||||
|
|
||||||
if (error) {
|
|
||||||
return (
|
|
||||||
<div className="flex h-full w-full items-center justify-center">
|
|
||||||
<Empty title="Oops, there’s nothing here…" />
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<AIUserContext.Provider value={{ user: data, isOwner, userId: Number(userId) }}>
|
|
||||||
{children}
|
|
||||||
</AIUserContext.Provider>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export default AIUserContext
|
|
||||||
|
|
@ -1,10 +0,0 @@
|
||||||
import { useContext } from 'react'
|
|
||||||
import AIUserContext from '.'
|
|
||||||
|
|
||||||
export const useAIUser = () => {
|
|
||||||
const context = useContext(AIUserContext)
|
|
||||||
if (!context) {
|
|
||||||
throw new Error('useAIUser must be used within a AIUserProvider')
|
|
||||||
}
|
|
||||||
return context
|
|
||||||
}
|
|
||||||
|
|
@ -1,9 +0,0 @@
|
||||||
import Empty from '@/components/ui/empty'
|
|
||||||
|
|
||||||
export default async function NotFound() {
|
|
||||||
return (
|
|
||||||
<div className="flex h-full w-full items-center justify-center">
|
|
||||||
<Empty title="Oops, there’s nothing here…" />
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
@ -1,92 +0,0 @@
|
||||||
import UserPage from './user-page'
|
|
||||||
import { HydrationBoundary } from '@tanstack/react-query'
|
|
||||||
import { dehydrate } from '@tanstack/react-query'
|
|
||||||
import { QueryClient } from '@tanstack/react-query'
|
|
||||||
import { aiUserKeys } from '@/lib/query-keys'
|
|
||||||
import { userService } from '@/services/user'
|
|
||||||
import { ApiError } from '@/types/api'
|
|
||||||
import { notFound, redirect } from 'next/navigation'
|
|
||||||
import { headers } from 'next/headers'
|
|
||||||
import { isMobileDevice } from '@/utils/device'
|
|
||||||
|
|
||||||
export const generateMetadata = async ({ params }: { params: Promise<{ userId: string }> }) => {
|
|
||||||
const { userId } = await params
|
|
||||||
try {
|
|
||||||
const resp = await userService.getSEOUserBaseInfo({ aiId: Number(userId) })
|
|
||||||
const { nickname, homeImageUrl } = resp || {}
|
|
||||||
|
|
||||||
return {
|
|
||||||
title: `${nickname} - Crushlevel AI`,
|
|
||||||
description: `${nickname}`,
|
|
||||||
openGraph: {
|
|
||||||
title: `Crushlevel AI`,
|
|
||||||
description: `Grow your love story with CrushLevel AI—From ‘Hi’ to ‘I Do', sparked by every chat`,
|
|
||||||
images: {
|
|
||||||
url: homeImageUrl,
|
|
||||||
width: 720,
|
|
||||||
height: 1280,
|
|
||||||
alt: `${nickname} - Crushlevel AI`,
|
|
||||||
},
|
|
||||||
siteName: 'Crushlevel AI',
|
|
||||||
type: 'website',
|
|
||||||
url: `https://www.crushlevel.com/@${userId}`,
|
|
||||||
},
|
|
||||||
twitter: {
|
|
||||||
title: `Crushlevel AI`,
|
|
||||||
description: `Grow your love story with CrushLevel AI—From ‘Hi’ to ‘I Do', sparked by every chat`,
|
|
||||||
images: {
|
|
||||||
url: homeImageUrl,
|
|
||||||
width: 720,
|
|
||||||
height: 1280,
|
|
||||||
alt: `${nickname} - Crushlevel AI`,
|
|
||||||
},
|
|
||||||
siteName: 'Crushlevel AI',
|
|
||||||
type: 'website',
|
|
||||||
url: `https://www.crushlevel.com/@${userId}`,
|
|
||||||
},
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
return {
|
|
||||||
title: `Crushlevel AI`,
|
|
||||||
description: `Grow your love story with CrushLevel AI—From ‘Hi’ to ‘I Do', sparked by every chat`,
|
|
||||||
openGraph: {
|
|
||||||
title: `Crushlevel AI`,
|
|
||||||
description: `Grow your love story with CrushLevel AI—From ‘Hi’ to ‘I Do', sparked by every chat`,
|
|
||||||
},
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const Page = async ({ params }: { params: Promise<{ userId: string }> }) => {
|
|
||||||
const { userId } = await params
|
|
||||||
|
|
||||||
// 检测移动端设备并重定向到分享页面
|
|
||||||
const headersList = await headers()
|
|
||||||
const userAgent = headersList.get('user-agent') || ''
|
|
||||||
|
|
||||||
if (isMobileDevice(userAgent)) {
|
|
||||||
redirect(`/share/${userId}`)
|
|
||||||
}
|
|
||||||
|
|
||||||
const queryClient = new QueryClient()
|
|
||||||
|
|
||||||
// try {
|
|
||||||
// // 使用 fetchQuery 替代 prefetchQuery，因为 fetchQuery 会抛出错误
|
|
||||||
// await queryClient.fetchQuery({
|
|
||||||
// queryKey: aiUserKeys.tempBaseInfo({ aiId: Number(userId) }),
|
|
||||||
// queryFn: () => userService.getAIUserBaseInfo({ aiId: Number(userId) }),
|
|
||||||
// });
|
|
||||||
// } catch (error) {
|
|
||||||
// if (error instanceof ApiError && error.errorCode === "10010012") {
|
|
||||||
// notFound();
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
|
|
||||||
return (
|
|
||||||
<HydrationBoundary state={dehydrate(queryClient)}>
|
|
||||||
<UserPage />
|
|
||||||
</HydrationBoundary>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export default Page
|
|
||||||
|
|
@ -1,4 +0,0 @@
|
||||||
export enum UserTab {
|
|
||||||
About = 'about',
|
|
||||||
Album = 'album',
|
|
||||||
}
|
|
||||||
|
|
@ -1,80 +0,0 @@
|
||||||
'use client'
|
|
||||||
|
|
||||||
import { useParams, useSearchParams, useRouter } from 'next/navigation'
|
|
||||||
import { UserCard } from './components/UserCard'
|
|
||||||
import { AboutSection } from './components/AboutSection'
|
|
||||||
import { GiftGrid } from './components/GiftGrid'
|
|
||||||
import UserBackground from './components/UserBackground'
|
|
||||||
import AlbumList from './components/AlbumList'
|
|
||||||
import { UserTab } from './types'
|
|
||||||
import { useGetAIUserBaseInfo } from '@/hooks/aiUser'
|
|
||||||
import { Tabs, TabsContent } from '@/components/ui/tabs'
|
|
||||||
import { AIUserProvider } from './context/aiUser'
|
|
||||||
import UserActionDropdown from './components/UserActionDropdown'
|
|
||||||
import UserProfileTabs from './components/UserProfileTabs'
|
|
||||||
import { useCallback } from 'react'
|
|
||||||
|
|
||||||
const UserPage = () => {
|
|
||||||
const { userId } = useParams()
|
|
||||||
const searchParams = useSearchParams()
|
|
||||||
const router = useRouter()
|
|
||||||
const { data } = useGetAIUserBaseInfo({ aiId: Number(userId) })
|
|
||||||
const { introduction } = data || {}
|
|
||||||
|
|
||||||
// 从 URL 参数中获取当前 tab，如果没有或无效则默认为 About
|
|
||||||
const tabParam = searchParams.get('tab')
|
|
||||||
const currentTab = (
|
|
||||||
Object.values(UserTab).includes(tabParam as UserTab) ? tabParam : UserTab.About
|
|
||||||
) as UserTab
|
|
||||||
|
|
||||||
// 处理 tab 切换
|
|
||||||
const handleTabChange = useCallback(
|
|
||||||
(newTab: string) => {
|
|
||||||
const params = new URLSearchParams(searchParams.toString())
|
|
||||||
params.set('tab', newTab)
|
|
||||||
router.push(`/@${userId}?${params.toString()}`, { scroll: false })
|
|
||||||
},
|
|
||||||
[searchParams, router, userId]
|
|
||||||
)
|
|
||||||
|
|
||||||
return (
|
|
||||||
<AIUserProvider>
|
|
||||||
{data && (
|
|
||||||
<div className="w-full bg-[#211a2b] px-16">
|
|
||||||
<UserBackground />
|
|
||||||
|
|
||||||
{/* 主要内容 */}
|
|
||||||
<div className="relative flex justify-center pt-28 pb-20">
|
|
||||||
<UserActionDropdown />
|
|
||||||
|
|
||||||
{/* 左侧用户卡片 */}
|
|
||||||
<div className="w-[368px]">
|
|
||||||
<UserCard />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* 右侧内容区域 */}
|
|
||||||
<div className="max-w-[752px] flex-1 px-6 pt-4">
|
|
||||||
<Tabs value={currentTab} onValueChange={handleTabChange} className="w-full gap-4">
|
|
||||||
<UserProfileTabs currentTab={currentTab} />
|
|
||||||
|
|
||||||
{/* Tab 内容 */}
|
|
||||||
<TabsContent value={UserTab.About} className="mt-0">
|
|
||||||
<div className="flex flex-col gap-4">
|
|
||||||
<AboutSection introduction={introduction ?? ''} />
|
|
||||||
<GiftGrid userId={userId as string} />
|
|
||||||
</div>
|
|
||||||
</TabsContent>
|
|
||||||
|
|
||||||
<TabsContent value={UserTab.Album} className="mt-0">
|
|
||||||
<AlbumList />
|
|
||||||
</TabsContent>
|
|
||||||
</Tabs>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</AIUserProvider>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export default UserPage
|
|
||||||
|
|
@ -1,17 +1,16 @@
|
||||||
'use client'
|
'use client';
|
||||||
|
|
||||||
import { Button, IconButton } from '@/components/ui/button'
|
import { Button, IconButton } from '@/components/ui/button';
|
||||||
import { Drawer, DrawerContent, DrawerHeader, DrawerTitle } from '@/components/ui/drawer'
|
import { Drawer, DrawerContent, DrawerHeader, DrawerTitle } from '@/components/ui/drawer';
|
||||||
import { useState, useMemo } from 'react'
|
import { useState, useMemo } from 'react';
|
||||||
import SubscribeProducts from './SubscribeProducs'
|
import SubscribeProducts from './SubscribeProducs';
|
||||||
import SubscribeProductsSkeleton from './SubscribeProductsSkeleton'
|
import SubscribeProductsSkeleton from './SubscribeProductsSkeleton';
|
||||||
import CarouselBanner from './CarouselBanner'
|
import CarouselBanner from './CarouselBanner';
|
||||||
import { useGetSubProductCheckoutLink, useGetSubProductList } from '@/hooks/useWallet'
|
import { useGetSubProductCheckoutLink, useGetSubProductList } from '@/hooks/useWallet';
|
||||||
import { SubProductListOutput, Period, VipType } from '@/services/wallet/types'
|
import { SubProductListOutput, Period, VipType } from '@/services/wallet/types';
|
||||||
import { isVipDrawerOpenAtom } from '@/atoms/im'
|
import { useAtom } from 'jotai';
|
||||||
import { useAtom } from 'jotai'
|
import QueryString from 'qs';
|
||||||
import QueryString from 'qs'
|
import { usePathname, useRouter, useSearchParams } from 'next/navigation';
|
||||||
import { usePathname, useRouter, useSearchParams } from 'next/navigation'
|
|
||||||
|
|
||||||
function SubscribeBackground() {
|
function SubscribeBackground() {
|
||||||
return (
|
return (
|
||||||
|
|
@ -24,43 +23,43 @@ function SubscribeBackground() {
|
||||||
backgroundRepeat: 'no-repeat',
|
backgroundRepeat: 'no-repeat',
|
||||||
}}
|
}}
|
||||||
></div>
|
></div>
|
||||||
)
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
// 数据转换函数
|
// 数据转换函数
|
||||||
const convertProductListToPricingPlans = (productList: SubProductListOutput[]) => {
|
const convertProductListToPricingPlans = (productList: SubProductListOutput[]) => {
|
||||||
if (!productList) return []
|
if (!productList) return [];
|
||||||
|
|
||||||
return productList.map((product, index) => {
|
return productList.map((product, index) => {
|
||||||
// 根据订阅时长获取标题
|
// 根据订阅时长获取标题
|
||||||
const getTitleByPeriod = (period?: Period) => {
|
const getTitleByPeriod = (period?: Period) => {
|
||||||
switch (period) {
|
switch (period) {
|
||||||
case Period.SubMonth:
|
case Period.SubMonth:
|
||||||
return '1 Month'
|
return '1 Month';
|
||||||
case Period.SubSeason:
|
case Period.SubSeason:
|
||||||
return '3 Months'
|
return '3 Months';
|
||||||
case Period.SubYear:
|
case Period.SubYear:
|
||||||
return '12 Months'
|
return '12 Months';
|
||||||
default:
|
default:
|
||||||
return 'Unknown'
|
return 'Unknown';
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
};
|
||||||
|
|
||||||
// 计算月单价（如果不是月订阅）
|
// 计算月单价（如果不是月订阅）
|
||||||
const getSubtitle = (period?: Period, payAmount?: number) => {
|
const getSubtitle = (period?: Period, payAmount?: number) => {
|
||||||
if (!payAmount) return ''
|
if (!payAmount) return '';
|
||||||
|
|
||||||
const monthlyPrice = payAmount / 100 // 转换为元
|
const monthlyPrice = payAmount / 100; // 转换为元
|
||||||
|
|
||||||
switch (period) {
|
switch (period) {
|
||||||
case Period.SubSeason:
|
case Period.SubSeason:
|
||||||
return `$${(monthlyPrice / 3).toFixed(2)}/Month`
|
return `$${(monthlyPrice / 3).toFixed(2)}/Month`;
|
||||||
case Period.SubYear:
|
case Period.SubYear:
|
||||||
return `$${(monthlyPrice / 12).toFixed(2)}/Month`
|
return `$${(monthlyPrice / 12).toFixed(2)}/Month`;
|
||||||
default:
|
default:
|
||||||
return ''
|
return '';
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
};
|
||||||
|
|
||||||
return {
|
return {
|
||||||
id: index + 1, // 使用索引+1作为ID
|
id: index + 1, // 使用索引+1作为ID
|
||||||
|
|
@ -70,69 +69,73 @@ const convertProductListToPricingPlans = (productList: SubProductListOutput[]) =
|
||||||
discount: product.discount || '',
|
discount: product.discount || '',
|
||||||
isSelected: false, // 初始都不选中
|
isSelected: false, // 初始都不选中
|
||||||
productId: product.productId, // 保留原始产品ID用于后续操作
|
productId: product.productId, // 保留原始产品ID用于后续操作
|
||||||
}
|
};
|
||||||
})
|
});
|
||||||
}
|
};
|
||||||
|
|
||||||
const SubscribeVipDrawer = () => {
|
const SubscribeVipDrawer = () => {
|
||||||
const [selectedPlan, setSelectedPlan] = useState<number>(0) // 默认不选择任何计划
|
const [selectedPlan, setSelectedPlan] = useState<number>(0); // 默认不选择任何计划
|
||||||
const [isVipDrawerOpen, setIsVipDrawerOpen] = useAtom(isVipDrawerOpenAtom)
|
// const [isVipDrawerOpen, setIsVipDrawerOpen] = useAtom(isVipDrawerOpenAtom)
|
||||||
|
const [isVipDrawerOpen, setIsVipDrawerOpen] = useState({
|
||||||
|
open: false,
|
||||||
|
vipType: undefined,
|
||||||
|
});
|
||||||
|
|
||||||
const { data: productList, isLoading } = useGetSubProductList()
|
const { data: productList, isLoading } = useGetSubProductList();
|
||||||
const { mutateAsync, isPending } = useGetSubProductCheckoutLink()
|
const { mutateAsync, isPending } = useGetSubProductCheckoutLink();
|
||||||
const pathname = usePathname()
|
const pathname = usePathname();
|
||||||
const searchParams = useSearchParams()
|
const searchParams = useSearchParams();
|
||||||
|
|
||||||
// 转换产品数据为组件需要的格式
|
// 转换产品数据为组件需要的格式
|
||||||
const pricingPlans = useMemo(() => {
|
const pricingPlans = useMemo(() => {
|
||||||
const plans = convertProductListToPricingPlans(productList || [])
|
const plans = convertProductListToPricingPlans(productList || []);
|
||||||
// 设置选中状态
|
// 设置选中状态
|
||||||
return plans.map((plan) => ({
|
return plans.map((plan) => ({
|
||||||
...plan,
|
...plan,
|
||||||
isSelected: plan.id === selectedPlan,
|
isSelected: plan.id === selectedPlan,
|
||||||
}))
|
}));
|
||||||
}, [productList, selectedPlan])
|
}, [productList, selectedPlan]);
|
||||||
|
|
||||||
// 设置默认选中第二个计划（3个月）
|
// 设置默认选中第二个计划（3个月）
|
||||||
useMemo(() => {
|
useMemo(() => {
|
||||||
if (pricingPlans.length > 0 && selectedPlan === 0) {
|
if (pricingPlans.length > 0 && selectedPlan === 0) {
|
||||||
const seasonPlan = pricingPlans.find((plan) => plan.title === '3 Month')
|
const seasonPlan = pricingPlans.find((plan) => plan.title === '3 Month');
|
||||||
if (seasonPlan) {
|
if (seasonPlan) {
|
||||||
setSelectedPlan(seasonPlan.id)
|
setSelectedPlan(seasonPlan.id);
|
||||||
} else {
|
} else {
|
||||||
setSelectedPlan(pricingPlans[0].id) // 如果没有3个月计划，选择第一个
|
setSelectedPlan(pricingPlans[0].id); // 如果没有3个月计划，选择第一个
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}, [pricingPlans, selectedPlan])
|
}, [pricingPlans, selectedPlan]);
|
||||||
|
|
||||||
const handleClose = () => {
|
const handleClose = () => {
|
||||||
setIsVipDrawerOpen({ open: false, vipType: undefined })
|
setIsVipDrawerOpen({ open: false, vipType: undefined });
|
||||||
}
|
};
|
||||||
|
|
||||||
const handleSubscribe = async () => {
|
const handleSubscribe = async () => {
|
||||||
// 获取选中的计划详情
|
// 获取选中的计划详情
|
||||||
const selectedPlanData = pricingPlans.find((plan) => plan.id === selectedPlan)
|
const selectedPlanData = pricingPlans.find((plan) => plan.id === selectedPlan);
|
||||||
if (selectedPlanData && selectedPlanData.productId) {
|
if (selectedPlanData && selectedPlanData.productId) {
|
||||||
// 这里可以调用订阅API，使用selectedPlanData.productId
|
// 这里可以调用订阅API，使用selectedPlanData.productId
|
||||||
|
|
||||||
const query = {
|
const query = {
|
||||||
...QueryString.parse(searchParams.toString()),
|
...QueryString.parse(searchParams.toString()),
|
||||||
back: 1,
|
back: 1,
|
||||||
}
|
};
|
||||||
|
|
||||||
const baseURL = `${process.env.NEXT_PUBLIC_APP_URL}${pathname}?${QueryString.stringify(query)}`
|
const baseURL = `${process.env.NEXT_PUBLIC_APP_URL}${pathname}?${QueryString.stringify(query)}`;
|
||||||
|
|
||||||
const response = await mutateAsync({
|
const response = await mutateAsync({
|
||||||
subProductId: selectedPlanData.productId,
|
subProductId: selectedPlanData.productId,
|
||||||
returnUrl: baseURL,
|
returnUrl: baseURL,
|
||||||
cancelUrl: baseURL,
|
cancelUrl: baseURL,
|
||||||
})
|
});
|
||||||
const { payUrl } = response || {}
|
const { payUrl } = response || {};
|
||||||
if (payUrl) {
|
if (payUrl) {
|
||||||
window.location.href = payUrl
|
window.location.href = payUrl;
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Drawer
|
<Drawer
|
||||||
|
|
@ -178,7 +181,7 @@ const SubscribeVipDrawer = () => {
|
||||||
</div>
|
</div>
|
||||||
</DrawerContent>
|
</DrawerContent>
|
||||||
</Drawer>
|
</Drawer>
|
||||||
)
|
);
|
||||||
}
|
};
|
||||||
|
|
||||||
export default SubscribeVipDrawer
|
export default SubscribeVipDrawer;
|
||||||
|
|
|
||||||
|
|
@ -1,43 +1,41 @@
|
||||||
'use client'
|
'use client';
|
||||||
import { Button, IconButton } from '@/components/ui/button'
|
import { Button, IconButton } from '@/components/ui/button';
|
||||||
import { useRouter, useSearchParams } from 'next/navigation'
|
import { useRouter, useSearchParams } from 'next/navigation';
|
||||||
import { useGetMemberDetail } from '@/hooks/useWallet'
|
import { useGetMemberDetail } from '@/hooks/useWallet';
|
||||||
import SubscribeText from './components/SubscribeText'
|
import SubscribeText from './components/SubscribeText';
|
||||||
import { useSetAtom } from 'jotai'
|
import { VipType } from '@/services/wallet';
|
||||||
import { isVipDrawerOpenAtom } from '@/atoms/im'
|
import { useEffect, useState } from 'react';
|
||||||
import { VipType } from '@/services/wallet'
|
|
||||||
import { useEffect, useState } from 'react'
|
|
||||||
|
|
||||||
const VipPage = () => {
|
const VipPage = () => {
|
||||||
const router = useRouter()
|
const router = useRouter();
|
||||||
const searchParams = useSearchParams()
|
const searchParams = useSearchParams();
|
||||||
const back = searchParams.get('back')
|
const back = searchParams.get('back');
|
||||||
const setIsVipDrawerOpen = useSetAtom(isVipDrawerOpenAtom)
|
const setIsVipDrawerOpen = (P: any) => null;
|
||||||
const [enableQuery, setEnableQuery] = useState(!back)
|
const [enableQuery, setEnableQuery] = useState(!back);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (back) {
|
if (back) {
|
||||||
// 如果有 back 参数，等待 2 秒后再启用查询
|
// 如果有 back 参数，等待 2 秒后再启用查询
|
||||||
const timer = setTimeout(() => {
|
const timer = setTimeout(() => {
|
||||||
setEnableQuery(true)
|
setEnableQuery(true);
|
||||||
}, 2000)
|
}, 2000);
|
||||||
return () => clearTimeout(timer)
|
return () => clearTimeout(timer);
|
||||||
}
|
}
|
||||||
}, [back])
|
}, [back]);
|
||||||
|
|
||||||
const { data: memberDetail, isLoading } = useGetMemberDetail({ enabled: enableQuery })
|
const { data: memberDetail, isLoading } = useGetMemberDetail({ enabled: enableQuery });
|
||||||
const { memberPrivList, userMemberInfo } = memberDetail || {}
|
const { memberPrivList, userMemberInfo } = memberDetail || {};
|
||||||
|
|
||||||
const hasSubscribe =
|
const hasSubscribe =
|
||||||
userMemberInfo && userMemberInfo.expTime && new Date(userMemberInfo.expTime) > new Date()
|
userMemberInfo && userMemberInfo.expTime && new Date(userMemberInfo.expTime) > new Date();
|
||||||
|
|
||||||
const handleBack = () => {
|
const handleBack = () => {
|
||||||
if (back) {
|
if (back) {
|
||||||
window.history.go(-3)
|
window.history.go(-3);
|
||||||
return
|
return;
|
||||||
}
|
|
||||||
router.back()
|
|
||||||
}
|
}
|
||||||
|
router.back();
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="px-3 pt-12 pb-20 sm:px-6 lg:px-12">
|
<div className="px-3 pt-12 pb-20 sm:px-6 lg:px-12">
|
||||||
|
|
@ -126,7 +124,7 @@ const VipPage = () => {
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)
|
);
|
||||||
}
|
};
|
||||||
|
|
||||||
export default VipPage
|
export default VipPage;
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,8 @@
|
||||||
import { NextRequest, NextResponse } from 'next/server';
|
import { NextRequest, NextResponse } from 'next/server';
|
||||||
|
|
||||||
export async function GET(request: NextRequest) {
|
export async function GET(request: NextRequest) {
|
||||||
console.log('request', request);
|
// console.log('request', request);
|
||||||
const url = 'http://localhost:3000';
|
const url = request.nextUrl.origin;
|
||||||
try {
|
try {
|
||||||
const { searchParams } = new URL(request.url);
|
const { searchParams } = new URL(request.url);
|
||||||
const code = searchParams.get('code');
|
const code = searchParams.get('code');
|
||||||
|
|
|
||||||
|
|
@ -1,9 +1,9 @@
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'iconfont-v2'; /* Project id 5076160 - spicyxx.ai */
|
font-family: 'iconfont-v2'; /* Project id 5076160 - spicyxx.ai */
|
||||||
src:
|
src:
|
||||||
url('/font-v2/iconfont.woff2?t=1765173841330') format('woff2'),
|
url('/font-v2/iconfont.woff2?t=1766052523135') format('woff2'),
|
||||||
url('/font-v2/iconfont.woff?t=1765173841330') format('woff'),
|
url('/font-v2/iconfont.woff?t=1766052523135') format('woff'),
|
||||||
url('/font-v2/iconfont.ttf?t=1765173841330') format('truetype');
|
url('/font-v2/iconfont.ttf?t=1766052523135') format('truetype');
|
||||||
}
|
}
|
||||||
|
|
||||||
.iconfont-v2 {
|
.iconfont-v2 {
|
||||||
|
|
@ -14,6 +14,21 @@
|
||||||
-moz-osx-font-smoothing: grayscale;
|
-moz-osx-font-smoothing: grayscale;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Logo */
|
||||||
|
.iconv2-Logo:before {
|
||||||
|
content: '\e624';
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 我的界面前往 */
|
||||||
|
.iconv2-wodejiemianqianwang:before {
|
||||||
|
content: '\e622';
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 群聊 */
|
||||||
|
.iconv2-qunliao:before {
|
||||||
|
content: '\e621';
|
||||||
|
}
|
||||||
|
|
||||||
/* 挂断电话 */
|
/* 挂断电话 */
|
||||||
.iconv2-guaduandianhua:before {
|
.iconv2-guaduandianhua:before {
|
||||||
content: '\e620';
|
content: '\e620';
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,109 @@
|
||||||
|
'use client'
|
||||||
|
|
||||||
|
import { useEffect, useMemo } from 'react'
|
||||||
|
import { useRouter } from 'next/navigation'
|
||||||
|
import { useCurrentUser } from '@/hooks/auth'
|
||||||
|
import { useToken } from '@/hooks/auth'
|
||||||
|
|
||||||
|
const PUBLIC_PREFETCH_TARGETS = ['/']
|
||||||
|
|
||||||
|
const AUTH_PREFETCH_TARGETS = [
|
||||||
|
'/contact',
|
||||||
|
'/profile',
|
||||||
|
'/profile/edit',
|
||||||
|
'/profile/account',
|
||||||
|
'/vip',
|
||||||
|
'/wallet',
|
||||||
|
'/wallet/charge',
|
||||||
|
'/wallet/charge/result',
|
||||||
|
'/wallet/transactions',
|
||||||
|
'/leaderboard',
|
||||||
|
'/crushcoin',
|
||||||
|
'/generate/image',
|
||||||
|
'/generate/image-2-image',
|
||||||
|
'/generate/image-edit',
|
||||||
|
'/generate/image-2-background',
|
||||||
|
'/explore',
|
||||||
|
'/creator',
|
||||||
|
'/create/type',
|
||||||
|
'/create/dialogue',
|
||||||
|
'/create/character',
|
||||||
|
'/create/image',
|
||||||
|
]
|
||||||
|
|
||||||
|
// 受保护路由前缀列表（需要登录才能访问的路由）
|
||||||
|
const PROTECTED_ROUTE_PREFIXES = [
|
||||||
|
'/profile',
|
||||||
|
'/create',
|
||||||
|
'/settings',
|
||||||
|
'/login/fields',
|
||||||
|
'/chat',
|
||||||
|
'/contact',
|
||||||
|
'/vip',
|
||||||
|
'/wallet',
|
||||||
|
'/crushcoin',
|
||||||
|
'/leaderboard',
|
||||||
|
'/generate',
|
||||||
|
'/explore',
|
||||||
|
'/creator',
|
||||||
|
]
|
||||||
|
|
||||||
|
// 检查路由是否是受保护路由
|
||||||
|
const isProtectedRoute = (href: string): boolean => {
|
||||||
|
return PROTECTED_ROUTE_PREFIXES.some((prefix) => href.startsWith(prefix))
|
||||||
|
}
|
||||||
|
|
||||||
|
const DEFAULT_PREFETCH_TARGETS = [...PUBLIC_PREFETCH_TARGETS, ...AUTH_PREFETCH_TARGETS]
|
||||||
|
|
||||||
|
type NullableRoute = string | null | undefined
|
||||||
|
|
||||||
|
const prefetchedRouteCache = new Set<string>()
|
||||||
|
|
||||||
|
export function usePrefetchRoutes(
|
||||||
|
routes?: NullableRoute[],
|
||||||
|
options?: {
|
||||||
|
limit?: number
|
||||||
|
}
|
||||||
|
) {
|
||||||
|
const router = useRouter()
|
||||||
|
const { isLogin } = useToken()
|
||||||
|
const normalizedRoutes = useMemo(() => {
|
||||||
|
if (!routes || routes.length === 0) return []
|
||||||
|
return routes.filter(Boolean) as string[]
|
||||||
|
}, [routes])
|
||||||
|
const limit = options?.limit ?? Infinity
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (!normalizedRoutes.length) return
|
||||||
|
let count = 0
|
||||||
|
for (const href of normalizedRoutes) {
|
||||||
|
if (!href || prefetchedRouteCache.has(href)) continue
|
||||||
|
// 如果未登录且是受保护路由，跳过 prefetch，避免缓存重定向响应
|
||||||
|
if (!isLogin && isProtectedRoute(href)) continue
|
||||||
|
prefetchedRouteCache.add(href)
|
||||||
|
router.prefetch(href)
|
||||||
|
count += 1
|
||||||
|
if (count >= limit) break
|
||||||
|
}
|
||||||
|
}, [limit, normalizedRoutes, router, isLogin])
|
||||||
|
}
|
||||||
|
|
||||||
|
export function useGlobalPrefetchRoutes(extraRoutes?: NullableRoute[]) {
|
||||||
|
const { data: user } = useCurrentUser()
|
||||||
|
const isAuthenticated = !!user
|
||||||
|
|
||||||
|
const protectedTargets = useMemo(() => {
|
||||||
|
const routes = new Set(AUTH_PREFETCH_TARGETS)
|
||||||
|
extraRoutes?.forEach((href) => {
|
||||||
|
if (href && href !== '/') {
|
||||||
|
routes.add(href)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
return Array.from(routes)
|
||||||
|
}, [extraRoutes])
|
||||||
|
|
||||||
|
usePrefetchRoutes(PUBLIC_PREFETCH_TARGETS)
|
||||||
|
usePrefetchRoutes(isAuthenticated ? protectedTargets : [])
|
||||||
|
}
|
||||||
|
|
||||||
|
export const GLOBAL_PREFETCH_ROUTES = DEFAULT_PREFETCH_TARGETS
|
||||||
|
|
@ -0,0 +1,105 @@
|
||||||
|
import { useInfiniteQuery, useMutation, useQuery } from '@tanstack/react-query';
|
||||||
|
import { homeKeys } from '@/lib/query-keys';
|
||||||
|
import { GetMeetListRequest, homeService } from '@/services/home';
|
||||||
|
|
||||||
|
type PageParam = number | { page: number; exList: number[] };
|
||||||
|
|
||||||
|
export function useGetMeetList(params: Omit<GetMeetListRequest, 'pn'>, enabled: boolean = true) {
|
||||||
|
return useInfiniteQuery({
|
||||||
|
queryKey: homeKeys.getMeetList(params),
|
||||||
|
queryFn: ({ pageParam }: { pageParam: PageParam }) => {
|
||||||
|
// pageParam 可能是数字（第一页）或对象（后续页面包含 exList）
|
||||||
|
const page = typeof pageParam === 'number' ? pageParam : pageParam.page;
|
||||||
|
const exList =
|
||||||
|
typeof pageParam === 'object' && pageParam !== null ? pageParam.exList : undefined;
|
||||||
|
|
||||||
|
return homeService.getMeetList({
|
||||||
|
...params,
|
||||||
|
pn: page,
|
||||||
|
...(exList && { exList }),
|
||||||
|
});
|
||||||
|
},
|
||||||
|
initialPageParam: 1 as PageParam,
|
||||||
|
getNextPageParam: (lastPage, allPages) => {
|
||||||
|
// 如果最后一页的数据数量少于每页大小，说明没有更多数据了
|
||||||
|
if (lastPage.length < params.ps) {
|
||||||
|
return undefined;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 收集所有已获取的 aiId 作为下一页的排除列表
|
||||||
|
const exList: number[] = [];
|
||||||
|
|
||||||
|
// 首先添加初始传入的 exList（如果有的话）
|
||||||
|
if (params.exList && Array.isArray(params.exList)) {
|
||||||
|
exList.push(...params.exList);
|
||||||
|
}
|
||||||
|
|
||||||
|
// 然后添加所有已获取页面的 aiId
|
||||||
|
for (const page of allPages) {
|
||||||
|
for (const item of page) {
|
||||||
|
if (item.aiId) {
|
||||||
|
exList.push(item.aiId);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return { page: allPages.length + 1, exList } as PageParam;
|
||||||
|
},
|
||||||
|
enabled, // 控制是否启用查询
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function useGetChatRank() {
|
||||||
|
return useQuery({
|
||||||
|
queryKey: homeKeys.getChatRank(),
|
||||||
|
queryFn: homeService.getChatRank,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function useGetHeartbeatRank() {
|
||||||
|
return useQuery({
|
||||||
|
queryKey: homeKeys.getHeartbeatRank(),
|
||||||
|
queryFn: homeService.getHeartbeatRank,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function useGetGiftRank() {
|
||||||
|
return useQuery({
|
||||||
|
queryKey: homeKeys.getGiftRank(),
|
||||||
|
queryFn: homeService.getGiftRank,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function useGetSevenDaysSignList() {
|
||||||
|
return useQuery({
|
||||||
|
queryKey: homeKeys.getSevenDaysSignList(),
|
||||||
|
queryFn: homeService.getSevenDaysSignList,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function useSignIn() {
|
||||||
|
return useMutation({
|
||||||
|
mutationFn: homeService.signIn,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function useGetExplore() {
|
||||||
|
return useQuery({
|
||||||
|
queryKey: homeKeys.getExplore(),
|
||||||
|
queryFn: homeService.getExplore,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function useGetHomeAiCarouselList() {
|
||||||
|
return useQuery({
|
||||||
|
queryKey: homeKeys.getHomeAiCarouselList(),
|
||||||
|
queryFn: homeService.getHomeAiCarouselList,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export function useGetHomeAggregateRecommend() {
|
||||||
|
return useQuery({
|
||||||
|
queryKey: homeKeys.getHomeAggregateRecommend(),
|
||||||
|
queryFn: homeService.getHomeAggregateRecommend,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
@ -4,10 +4,10 @@ import { usePathname } from 'next/navigation';
|
||||||
import { useEffect, useRef } from 'react';
|
import { useEffect, useRef } from 'react';
|
||||||
import Sidebar from './Sidebar';
|
import Sidebar from './Sidebar';
|
||||||
import Topbar from './Topbar';
|
import Topbar from './Topbar';
|
||||||
import ChargeDrawer from '../components/features/charge-drawer';
|
// import ChargeDrawer from '../components/features/charge-drawer';
|
||||||
import SubscribeVipDrawer from '@/app/(main)/vip/components/SubscribeVipDrawer';
|
// import SubscribeVipDrawer from '@/app/(main)/vip/components/SubscribeVipDrawer';
|
||||||
import { cn } from '@/lib/utils';
|
import { cn } from '@/lib/utils';
|
||||||
import CreateReachedLimitDialog from '../components/features/create-reached-limit-dialog';
|
// import CreateReachedLimitDialog from '../components/features/create-reached-limit-dialog';
|
||||||
import { useMedia } from '@/hooks/tools';
|
import { useMedia } from '@/hooks/tools';
|
||||||
import BottomBar from './BottomBar';
|
import BottomBar from './BottomBar';
|
||||||
import { useStreamChatStore } from '@/app/(main)/chat/[id]/stream-chat';
|
import { useStreamChatStore } from '@/app/(main)/chat/[id]/stream-chat';
|
||||||
|
|
@ -60,9 +60,9 @@ export default function ConditionalLayout({ children }: ConditionalLayoutProps)
|
||||||
</main>
|
</main>
|
||||||
{response && !response.sm && <BottomBar />}
|
{response && !response.sm && <BottomBar />}
|
||||||
</div>
|
</div>
|
||||||
<ChargeDrawer />
|
{/* <ChargeDrawer /> */}
|
||||||
<SubscribeVipDrawer />
|
{/* <SubscribeVipDrawer /> */}
|
||||||
<CreateReachedLimitDialog />
|
{/* <CreateReachedLimitDialog /> */}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -22,7 +22,7 @@ function Topbar() {
|
||||||
const response = useMedia();
|
const response = useMedia();
|
||||||
const searchParamsString = searchParams.toString();
|
const searchParamsString = searchParams.toString();
|
||||||
const redirectURL = `${pathname}${searchParamsString ? `?${searchParamsString}` : ''}`;
|
const redirectURL = `${pathname}${searchParamsString ? `?${searchParamsString}` : ''}`;
|
||||||
const loginHref = `/login?redirect=${encodeURIComponent(redirectURL)}`;
|
// const loginHref = `/login?redirect=${encodeURIComponent(redirectURL)}`;
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
function handleScroll(event: Event) {
|
function handleScroll(event: Event) {
|
||||||
|
|
@ -42,7 +42,7 @@ function Topbar() {
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!user) {
|
if (!user) {
|
||||||
router.prefetch(loginHref);
|
router.prefetch('/login');
|
||||||
} else {
|
} else {
|
||||||
router.prefetch('/profile');
|
router.prefetch('/profile');
|
||||||
if (user.cpUserInfo) {
|
if (user.cpUserInfo) {
|
||||||
|
|
@ -55,11 +55,9 @@ function Topbar() {
|
||||||
if (!response) return null;
|
if (!response) return null;
|
||||||
if (response.sm || items.some((item) => item.path === pathname)) {
|
if (response.sm || items.some((item) => item.path === pathname)) {
|
||||||
return (
|
return (
|
||||||
<div className="h-8 w-[103.6px]">
|
|
||||||
<Link href="/">
|
<Link href="/">
|
||||||
<Image src="/logo.svg" alt="logo" width={103.6} height={32} />
|
<i className="iconfont-v2 iconv2-Logo" style={{ fontSize: '50px' }} />
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
return (
|
return (
|
||||||
|
|
@ -75,7 +73,7 @@ function Topbar() {
|
||||||
const rightDomRender = () => {
|
const rightDomRender = () => {
|
||||||
if (!user)
|
if (!user)
|
||||||
return (
|
return (
|
||||||
<Link href={loginHref} prefetch>
|
<Link href="/login" prefetch>
|
||||||
<Button size="small">Login in / Sign up</Button>
|
<Button size="small">Login in / Sign up</Button>
|
||||||
</Link>
|
</Link>
|
||||||
);
|
);
|
||||||
|
|
|
||||||
|
|
@ -17,6 +17,7 @@ const Notice = () => {
|
||||||
|
|
||||||
// 监听路径变化，刷新通知统计
|
// 监听路径变化，刷新通知统计
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
return;
|
||||||
if (user) {
|
if (user) {
|
||||||
// 当路径变化时，无效化并重新获取通知统计数据
|
// 当路径变化时，无效化并重新获取通知统计数据
|
||||||
queryClient.invalidateQueries({
|
queryClient.invalidateQueries({
|
||||||
|
|
@ -26,6 +27,7 @@ const Notice = () => {
|
||||||
}, [pathname]);
|
}, [pathname]);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
return;
|
||||||
if (isDrawerOpen && user) {
|
if (isDrawerOpen && user) {
|
||||||
queryClient.invalidateQueries({
|
queryClient.invalidateQueries({
|
||||||
queryKey: userKeys.noticeStat(),
|
queryKey: userKeys.noticeStat(),
|
||||||
|
|
|
||||||
|
|
@ -3,10 +3,9 @@ import type { NextRequest } from 'next/server';
|
||||||
|
|
||||||
// 需要认证的路由
|
// 需要认证的路由
|
||||||
const protectedRoutes = [
|
const protectedRoutes = [
|
||||||
// '/profile',
|
'/profile',
|
||||||
// '/profile/account',
|
'/profile/account',
|
||||||
// '/profile/edit',
|
'/profile/edit',
|
||||||
'/create',
|
|
||||||
'/settings',
|
'/settings',
|
||||||
'/login/fields',
|
'/login/fields',
|
||||||
'/chat',
|
'/chat',
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,59 @@
|
||||||
|
import { frogHttp } from '@/lib/http/instances'
|
||||||
|
import {
|
||||||
|
AiCarouselListOutput,
|
||||||
|
AiChatRankOutput,
|
||||||
|
AiGiftRankOutput,
|
||||||
|
AiHeartbeatRankOutput,
|
||||||
|
ExploreInfoOutput,
|
||||||
|
GetMeetListRequest,
|
||||||
|
GetMeetListResponse,
|
||||||
|
HomeRecommendV2Output,
|
||||||
|
SignInRoundOutput,
|
||||||
|
} from './types'
|
||||||
|
|
||||||
|
export const homeService = {
|
||||||
|
// 发现
|
||||||
|
getExplore: (): Promise<ExploreInfoOutput> => {
|
||||||
|
return frogHttp.post('/web/explore/info')
|
||||||
|
},
|
||||||
|
|
||||||
|
// 首页分类列表
|
||||||
|
getMeetList: (data: GetMeetListRequest): Promise<GetMeetListResponse[]> => {
|
||||||
|
return frogHttp.post('/web/home/classification-list', data)
|
||||||
|
},
|
||||||
|
|
||||||
|
// 热聊榜
|
||||||
|
getChatRank: (): Promise<AiChatRankOutput[]> => {
|
||||||
|
return frogHttp.post('/web/rank/chat')
|
||||||
|
},
|
||||||
|
|
||||||
|
// 心动榜
|
||||||
|
getHeartbeatRank: (): Promise<AiHeartbeatRankOutput[]> => {
|
||||||
|
return frogHttp.post('/web/rank/heartbeat')
|
||||||
|
},
|
||||||
|
|
||||||
|
// 送礼榜
|
||||||
|
getGiftRank: (): Promise<AiGiftRankOutput[]> => {
|
||||||
|
return frogHttp.post('/web/rank/gift')
|
||||||
|
},
|
||||||
|
|
||||||
|
// 七天签到列表
|
||||||
|
getSevenDaysSignList: (): Promise<SignInRoundOutput> => {
|
||||||
|
return frogHttp.post('/web/si/list')
|
||||||
|
},
|
||||||
|
|
||||||
|
// 签到
|
||||||
|
signIn: (): Promise<boolean> => {
|
||||||
|
return frogHttp.post('/web/si/asi')
|
||||||
|
},
|
||||||
|
|
||||||
|
// 首页AI轮播列表
|
||||||
|
getHomeAiCarouselList: (): Promise<AiCarouselListOutput[]> => {
|
||||||
|
return frogHttp.post('/web/home/ai-carousel-list')
|
||||||
|
},
|
||||||
|
|
||||||
|
// 首页聚合推荐
|
||||||
|
getHomeAggregateRecommend: (): Promise<HomeRecommendV2Output> => {
|
||||||
|
return frogHttp.post('/web/home/agg-recommend')
|
||||||
|
},
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,2 @@
|
||||||
|
export * from './types'
|
||||||
|
export * from './home.service'
|
||||||
|
|
@ -0,0 +1,819 @@
|
||||||
|
import { Gender } from 'nim-web-sdk-ng/dist/v2/NIM_BROWSER_SDK/UserServiceInterface'
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ClassificationListInput
|
||||||
|
*/
|
||||||
|
export interface GetMeetListRequest {
|
||||||
|
/**
|
||||||
|
* 情感性格code
|
||||||
|
*/
|
||||||
|
characterCodeList: string[]
|
||||||
|
/**
|
||||||
|
* 需要排除的aiId列表
|
||||||
|
*/
|
||||||
|
exList?: number[]
|
||||||
|
/**
|
||||||
|
* 页码
|
||||||
|
*/
|
||||||
|
pn?: number
|
||||||
|
/**
|
||||||
|
* 每页大小
|
||||||
|
*/
|
||||||
|
ps: number
|
||||||
|
/**
|
||||||
|
* 角色code列表
|
||||||
|
*/
|
||||||
|
roleCodeList?: string[]
|
||||||
|
sex?: Gender
|
||||||
|
age?: Age
|
||||||
|
/** 多选：性别列表 */
|
||||||
|
sexList?: Gender[]
|
||||||
|
/** 多选：年龄列表 */
|
||||||
|
ageList?: Age[]
|
||||||
|
/**
|
||||||
|
* 标签code列表
|
||||||
|
*/
|
||||||
|
tagCodeList?: string[]
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* GetMeetListResponse
|
||||||
|
*/
|
||||||
|
export interface GetMeetListResponse {
|
||||||
|
/**
|
||||||
|
* AI的id
|
||||||
|
*/
|
||||||
|
aiId?: number
|
||||||
|
/**
|
||||||
|
* 出生日期
|
||||||
|
*/
|
||||||
|
birthday?: string
|
||||||
|
/**
|
||||||
|
* 性格名称
|
||||||
|
*/
|
||||||
|
characterName?: string
|
||||||
|
/**
|
||||||
|
* 头像
|
||||||
|
*/
|
||||||
|
headImg?: string
|
||||||
|
/**
|
||||||
|
* 主页头图
|
||||||
|
*/
|
||||||
|
homeImageUrl?: string
|
||||||
|
/**
|
||||||
|
* 简介
|
||||||
|
*/
|
||||||
|
introduction?: string
|
||||||
|
/**
|
||||||
|
* 被喜欢数
|
||||||
|
*/
|
||||||
|
likedNum?: number
|
||||||
|
/**
|
||||||
|
* 昵称
|
||||||
|
*/
|
||||||
|
nickname?: string
|
||||||
|
/**
|
||||||
|
* 角色名称
|
||||||
|
*/
|
||||||
|
roleName?: string
|
||||||
|
/**
|
||||||
|
* 0,男;1,女;2,自定义
|
||||||
|
*/
|
||||||
|
sex?: number
|
||||||
|
/**
|
||||||
|
* 标签名称
|
||||||
|
*/
|
||||||
|
tagName?: string
|
||||||
|
/**
|
||||||
|
* ai所属用户id
|
||||||
|
*/
|
||||||
|
userId?: number
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* AiChatRankOutput
|
||||||
|
*/
|
||||||
|
export interface AiChatRankOutput {
|
||||||
|
/**
|
||||||
|
* AI的id
|
||||||
|
*/
|
||||||
|
aiId?: number
|
||||||
|
/**
|
||||||
|
* 出生日期
|
||||||
|
*/
|
||||||
|
birthday?: string
|
||||||
|
/**
|
||||||
|
* 性格名称
|
||||||
|
*/
|
||||||
|
characterName?: string
|
||||||
|
/**
|
||||||
|
* 聊天次数
|
||||||
|
*/
|
||||||
|
chatNum?: number
|
||||||
|
/**
|
||||||
|
* 头像
|
||||||
|
*/
|
||||||
|
headImg?: string
|
||||||
|
/**
|
||||||
|
* 主页头图
|
||||||
|
*/
|
||||||
|
homeImageUrl?: string
|
||||||
|
/**
|
||||||
|
* 简介
|
||||||
|
*/
|
||||||
|
introduction?: string
|
||||||
|
/**
|
||||||
|
* 昵称
|
||||||
|
*/
|
||||||
|
nickname?: string
|
||||||
|
/**
|
||||||
|
* 排名编号
|
||||||
|
*/
|
||||||
|
rankNo?: number
|
||||||
|
/**
|
||||||
|
* 角色名称
|
||||||
|
*/
|
||||||
|
roleName?: string
|
||||||
|
/**
|
||||||
|
* 0,男;1,女;2,自定义
|
||||||
|
*/
|
||||||
|
sex?: number
|
||||||
|
/**
|
||||||
|
* 标签名称
|
||||||
|
*/
|
||||||
|
tagName?: string
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* AiHeartbeatRankOutput
|
||||||
|
*/
|
||||||
|
export interface AiHeartbeatRankOutput {
|
||||||
|
/**
|
||||||
|
* AI的id
|
||||||
|
*/
|
||||||
|
aiId?: number
|
||||||
|
/**
|
||||||
|
* 出生日期
|
||||||
|
*/
|
||||||
|
birthday?: string
|
||||||
|
/**
|
||||||
|
* 性格名称
|
||||||
|
*/
|
||||||
|
characterName?: string
|
||||||
|
/**
|
||||||
|
* 头像
|
||||||
|
*/
|
||||||
|
headImg?: string
|
||||||
|
/**
|
||||||
|
* 心动总分值
|
||||||
|
*/
|
||||||
|
heartbeatValTotal?: number
|
||||||
|
/**
|
||||||
|
* 主页头图
|
||||||
|
*/
|
||||||
|
homeImageUrl?: string
|
||||||
|
/**
|
||||||
|
* 简介
|
||||||
|
*/
|
||||||
|
introduction?: string
|
||||||
|
/**
|
||||||
|
* 昵称
|
||||||
|
*/
|
||||||
|
nickname?: string
|
||||||
|
/**
|
||||||
|
* 排名编号
|
||||||
|
*/
|
||||||
|
rankNo?: number
|
||||||
|
/**
|
||||||
|
* 角色名称
|
||||||
|
*/
|
||||||
|
roleName?: string
|
||||||
|
/**
|
||||||
|
* 0,男;1,女;2,自定义
|
||||||
|
*/
|
||||||
|
sex?: number
|
||||||
|
/**
|
||||||
|
* 标签名称
|
||||||
|
*/
|
||||||
|
tagName?: string
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* AiGiftRankOutput
|
||||||
|
*/
|
||||||
|
export interface AiGiftRankOutput {
|
||||||
|
/**
|
||||||
|
* AI的id
|
||||||
|
*/
|
||||||
|
aiId?: number
|
||||||
|
/**
|
||||||
|
* 出生日期
|
||||||
|
*/
|
||||||
|
birthday?: string
|
||||||
|
/**
|
||||||
|
* 性格名称
|
||||||
|
*/
|
||||||
|
characterName?: string
|
||||||
|
/**
|
||||||
|
* 礼物
|
||||||
|
*/
|
||||||
|
giftCoinNum?: number
|
||||||
|
/**
|
||||||
|
* 头像
|
||||||
|
*/
|
||||||
|
headImg?: string
|
||||||
|
/**
|
||||||
|
* 主页头图
|
||||||
|
*/
|
||||||
|
homeImageUrl?: string
|
||||||
|
/**
|
||||||
|
* 简介
|
||||||
|
*/
|
||||||
|
introduction?: string
|
||||||
|
/**
|
||||||
|
* 昵称
|
||||||
|
*/
|
||||||
|
nickname?: string
|
||||||
|
/**
|
||||||
|
* 排名编号
|
||||||
|
*/
|
||||||
|
rankNo?: number
|
||||||
|
/**
|
||||||
|
* 角色名称
|
||||||
|
*/
|
||||||
|
roleName?: string
|
||||||
|
/**
|
||||||
|
* 0,男;1,女;2,自定义
|
||||||
|
*/
|
||||||
|
sex?: number
|
||||||
|
/**
|
||||||
|
* 标签名称
|
||||||
|
*/
|
||||||
|
tagName?: string
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* SignInRoundOutput
|
||||||
|
*/
|
||||||
|
export interface SignInRoundOutput {
|
||||||
|
/**
|
||||||
|
* 最大连续签到天数
|
||||||
|
*/
|
||||||
|
continuousDays?: number
|
||||||
|
/**
|
||||||
|
* 签到周期基础数据
|
||||||
|
*/
|
||||||
|
list?: SignInListOutput[]
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* SignInListOutput
|
||||||
|
*/
|
||||||
|
export interface SignInListOutput {
|
||||||
|
/**
|
||||||
|
* 得到coin的数量
|
||||||
|
*/
|
||||||
|
coinNum?: number
|
||||||
|
/**
|
||||||
|
* PST 天（yyyy-MM-dd）
|
||||||
|
*/
|
||||||
|
dayStr?: string
|
||||||
|
/**
|
||||||
|
* 是否已签到
|
||||||
|
*/
|
||||||
|
signIn?: boolean
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ExploreInfoOutput
|
||||||
|
*/
|
||||||
|
export interface ExploreInfoOutput {
|
||||||
|
/**
|
||||||
|
* AI总心动值榜单top3
|
||||||
|
*/
|
||||||
|
aiChatRankTop3List?: AiChatRankOutput[]
|
||||||
|
/**
|
||||||
|
* AI总心动值榜单top3
|
||||||
|
*/
|
||||||
|
aiGiftRankTop3List?: AiGiftRankOutput[]
|
||||||
|
/**
|
||||||
|
* AI总心动值榜单top3
|
||||||
|
*/
|
||||||
|
aiHeartbeatRankTop3List?: AiHeartbeatRankOutput[]
|
||||||
|
/**
|
||||||
|
* 广告列表
|
||||||
|
*/
|
||||||
|
outputList?: AdvertiseOutput[]
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* com.sonic.frog.domain.output.AiChatRankOutput
|
||||||
|
*
|
||||||
|
* AiChatRankOutput
|
||||||
|
*/
|
||||||
|
export interface AiChatRankOutput {
|
||||||
|
/**
|
||||||
|
* AI的id
|
||||||
|
*/
|
||||||
|
aiId?: number
|
||||||
|
/**
|
||||||
|
* 出生日期
|
||||||
|
*/
|
||||||
|
birthday?: string
|
||||||
|
/**
|
||||||
|
* 性格名称
|
||||||
|
*/
|
||||||
|
characterName?: string
|
||||||
|
/**
|
||||||
|
* 聊天次数
|
||||||
|
*/
|
||||||
|
chatNum?: number
|
||||||
|
/**
|
||||||
|
* 头像
|
||||||
|
*/
|
||||||
|
headImg?: string
|
||||||
|
/**
|
||||||
|
* 主页头图
|
||||||
|
*/
|
||||||
|
homeImageUrl?: string
|
||||||
|
/**
|
||||||
|
* 简介
|
||||||
|
*/
|
||||||
|
introduction?: string
|
||||||
|
/**
|
||||||
|
* 昵称
|
||||||
|
*/
|
||||||
|
nickname?: string
|
||||||
|
/**
|
||||||
|
* 排名编号
|
||||||
|
*/
|
||||||
|
rankNo?: number
|
||||||
|
/**
|
||||||
|
* 角色名称
|
||||||
|
*/
|
||||||
|
roleName?: string
|
||||||
|
/**
|
||||||
|
* 0,男;1,女;2,自定义
|
||||||
|
*/
|
||||||
|
sex?: number
|
||||||
|
/**
|
||||||
|
* 标签名称
|
||||||
|
*/
|
||||||
|
tagName?: string
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* com.sonic.frog.domain.output.AiGiftRankOutput
|
||||||
|
*
|
||||||
|
* AiGiftRankOutput
|
||||||
|
*/
|
||||||
|
export interface AiGiftRankOutput {
|
||||||
|
/**
|
||||||
|
* AI的id
|
||||||
|
*/
|
||||||
|
aiId?: number
|
||||||
|
/**
|
||||||
|
* 出生日期
|
||||||
|
*/
|
||||||
|
birthday?: string
|
||||||
|
/**
|
||||||
|
* 性格名称
|
||||||
|
*/
|
||||||
|
characterName?: string
|
||||||
|
/**
|
||||||
|
* 礼物
|
||||||
|
*/
|
||||||
|
giftCoinNum?: number
|
||||||
|
/**
|
||||||
|
* 头像
|
||||||
|
*/
|
||||||
|
headImg?: string
|
||||||
|
/**
|
||||||
|
* 主页头图
|
||||||
|
*/
|
||||||
|
homeImageUrl?: string
|
||||||
|
/**
|
||||||
|
* 简介
|
||||||
|
*/
|
||||||
|
introduction?: string
|
||||||
|
/**
|
||||||
|
* 昵称
|
||||||
|
*/
|
||||||
|
nickname?: string
|
||||||
|
/**
|
||||||
|
* 排名编号
|
||||||
|
*/
|
||||||
|
rankNo?: number
|
||||||
|
/**
|
||||||
|
* 角色名称
|
||||||
|
*/
|
||||||
|
roleName?: string
|
||||||
|
/**
|
||||||
|
* 0,男;1,女;2,自定义
|
||||||
|
*/
|
||||||
|
sex?: number
|
||||||
|
/**
|
||||||
|
* 标签名称
|
||||||
|
*/
|
||||||
|
tagName?: string
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* com.sonic.frog.domain.output.AiHeartbeatRankOutput
|
||||||
|
*
|
||||||
|
* AiHeartbeatRankOutput
|
||||||
|
*/
|
||||||
|
export interface AiHeartbeatRankOutput {
|
||||||
|
/**
|
||||||
|
* AI的id
|
||||||
|
*/
|
||||||
|
aiId?: number
|
||||||
|
/**
|
||||||
|
* 出生日期
|
||||||
|
*/
|
||||||
|
birthday?: string
|
||||||
|
/**
|
||||||
|
* 性格名称
|
||||||
|
*/
|
||||||
|
characterName?: string
|
||||||
|
/**
|
||||||
|
* 头像
|
||||||
|
*/
|
||||||
|
headImg?: string
|
||||||
|
/**
|
||||||
|
* 心动总分值
|
||||||
|
*/
|
||||||
|
heartbeatValTotal?: number
|
||||||
|
/**
|
||||||
|
* 主页头图
|
||||||
|
*/
|
||||||
|
homeImageUrl?: string
|
||||||
|
/**
|
||||||
|
* 简介
|
||||||
|
*/
|
||||||
|
introduction?: string
|
||||||
|
/**
|
||||||
|
* 昵称
|
||||||
|
*/
|
||||||
|
nickname?: string
|
||||||
|
/**
|
||||||
|
* 排名编号
|
||||||
|
*/
|
||||||
|
rankNo?: number
|
||||||
|
/**
|
||||||
|
* 角色名称
|
||||||
|
*/
|
||||||
|
roleName?: string
|
||||||
|
/**
|
||||||
|
* 0,男;1,女;2,自定义
|
||||||
|
*/
|
||||||
|
sex?: number
|
||||||
|
/**
|
||||||
|
* 标签名称
|
||||||
|
*/
|
||||||
|
tagName?: string
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* AdvertiseOutput
|
||||||
|
*/
|
||||||
|
export interface AdvertiseOutput {
|
||||||
|
/**
|
||||||
|
* 使用端点（WEB/ANDROID/IOS）
|
||||||
|
* endpoint
|
||||||
|
*/
|
||||||
|
endpoint?: string
|
||||||
|
/**
|
||||||
|
* 扩展字段
|
||||||
|
* ext
|
||||||
|
*/
|
||||||
|
ext?: string
|
||||||
|
/**
|
||||||
|
* 广告配图
|
||||||
|
* icon
|
||||||
|
*/
|
||||||
|
icon?: string
|
||||||
|
/**
|
||||||
|
* 是否弹窗(1.是,0.否)
|
||||||
|
* is_global
|
||||||
|
*/
|
||||||
|
isGlobal?: number
|
||||||
|
/**
|
||||||
|
* 跳转连接
|
||||||
|
* jump_link
|
||||||
|
*/
|
||||||
|
jumpLink?: string
|
||||||
|
/**
|
||||||
|
* 广告名称
|
||||||
|
* name
|
||||||
|
*/
|
||||||
|
name?: string
|
||||||
|
/**
|
||||||
|
* 展示结束时间
|
||||||
|
* show_end_time
|
||||||
|
*/
|
||||||
|
showEndTime?: string
|
||||||
|
/**
|
||||||
|
* 展示开始时间
|
||||||
|
* show_start_time
|
||||||
|
*/
|
||||||
|
showStartTime?: string
|
||||||
|
/**
|
||||||
|
* 排序
|
||||||
|
* sort
|
||||||
|
*/
|
||||||
|
sort?: number
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 年龄：单选 AGE_1（18-24）、AGE_2（25-34）、AGE_3（35-44）、AGE_4（45-54）、AGE_5（>54）
|
||||||
|
*/
|
||||||
|
export enum Age {
|
||||||
|
Age1 = 'AGE_1',
|
||||||
|
Age2 = 'AGE_2',
|
||||||
|
Age3 = 'AGE_3',
|
||||||
|
Age4 = 'AGE_4',
|
||||||
|
Age5 = 'AGE_5',
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ai轮播列表输出
|
||||||
|
*
|
||||||
|
* AiCarouselListOutput
|
||||||
|
*/
|
||||||
|
export interface AiCarouselListOutput {
|
||||||
|
/**
|
||||||
|
* AI的id
|
||||||
|
*/
|
||||||
|
aiId?: number
|
||||||
|
/**
|
||||||
|
* 出生日期
|
||||||
|
*/
|
||||||
|
birthday?: string
|
||||||
|
/**
|
||||||
|
* 性格名称
|
||||||
|
*/
|
||||||
|
characterName?: string
|
||||||
|
/**
|
||||||
|
* 头像
|
||||||
|
*/
|
||||||
|
headImg?: string
|
||||||
|
/**
|
||||||
|
* 主页头图
|
||||||
|
*/
|
||||||
|
homeImageUrl?: string
|
||||||
|
/**
|
||||||
|
* 简介
|
||||||
|
*/
|
||||||
|
introduction?: string
|
||||||
|
/**
|
||||||
|
* 是否点赞过
|
||||||
|
*/
|
||||||
|
liked?: boolean
|
||||||
|
/**
|
||||||
|
* 点赞数
|
||||||
|
*/
|
||||||
|
likedCount?: number
|
||||||
|
/**
|
||||||
|
* 昵称
|
||||||
|
*/
|
||||||
|
nickname?: string
|
||||||
|
/**
|
||||||
|
* 角色名称
|
||||||
|
*/
|
||||||
|
roleName?: string
|
||||||
|
/**
|
||||||
|
* 0,男;1,女;2,自定义
|
||||||
|
*/
|
||||||
|
sex?: number
|
||||||
|
/**
|
||||||
|
* 标签名称
|
||||||
|
*/
|
||||||
|
tagName?: string
|
||||||
|
/**
|
||||||
|
* ai所属用户id
|
||||||
|
*/
|
||||||
|
userId?: number
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* HomeRecommendV2Output
|
||||||
|
*/
|
||||||
|
export interface HomeRecommendV2Output {
|
||||||
|
mostChat?: AiChatRankOutput[]
|
||||||
|
mustCrush?: AiHeartbeatRankOutput[]
|
||||||
|
mustGifted?: AiGiftRankOutput[]
|
||||||
|
starAChat?: StartChatOutput[]
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* com.sonic.frog.domain.output.AiChatRankOutput
|
||||||
|
*
|
||||||
|
* AiChatRankOutput
|
||||||
|
*/
|
||||||
|
export interface AiChatRankOutput {
|
||||||
|
/**
|
||||||
|
* AI的id
|
||||||
|
*/
|
||||||
|
aiId?: number
|
||||||
|
/**
|
||||||
|
* 出生日期
|
||||||
|
*/
|
||||||
|
birthday?: string
|
||||||
|
/**
|
||||||
|
* 性格名称
|
||||||
|
*/
|
||||||
|
characterName?: string
|
||||||
|
/**
|
||||||
|
* 聊天次数
|
||||||
|
*/
|
||||||
|
chatNum?: number
|
||||||
|
/**
|
||||||
|
* 头像
|
||||||
|
*/
|
||||||
|
headImg?: string
|
||||||
|
/**
|
||||||
|
* 主页头图
|
||||||
|
*/
|
||||||
|
homeImageUrl?: string
|
||||||
|
/**
|
||||||
|
* 简介
|
||||||
|
*/
|
||||||
|
introduction?: string
|
||||||
|
/**
|
||||||
|
* 被喜欢数
|
||||||
|
*/
|
||||||
|
likedNum?: number
|
||||||
|
/**
|
||||||
|
* 昵称
|
||||||
|
*/
|
||||||
|
nickname?: string
|
||||||
|
/**
|
||||||
|
* 排名编号
|
||||||
|
*/
|
||||||
|
rankNo?: number
|
||||||
|
/**
|
||||||
|
* 角色名称
|
||||||
|
*/
|
||||||
|
roleName?: string
|
||||||
|
/**
|
||||||
|
* 0,男;1,女;2,自定义
|
||||||
|
*/
|
||||||
|
sex?: number
|
||||||
|
/**
|
||||||
|
* 标签名称
|
||||||
|
*/
|
||||||
|
tagName?: string
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* com.sonic.frog.domain.output.AiHeartbeatRankOutput
|
||||||
|
*
|
||||||
|
* AiHeartbeatRankOutput
|
||||||
|
*/
|
||||||
|
export interface AiHeartbeatRankOutput {
|
||||||
|
/**
|
||||||
|
* AI的id
|
||||||
|
*/
|
||||||
|
aiId?: number
|
||||||
|
/**
|
||||||
|
* 出生日期
|
||||||
|
*/
|
||||||
|
birthday?: string
|
||||||
|
/**
|
||||||
|
* 性格名称
|
||||||
|
*/
|
||||||
|
characterName?: string
|
||||||
|
/**
|
||||||
|
* 头像
|
||||||
|
*/
|
||||||
|
headImg?: string
|
||||||
|
/**
|
||||||
|
* 心动总分值
|
||||||
|
*/
|
||||||
|
heartbeatValTotal?: number
|
||||||
|
/**
|
||||||
|
* 主页头图
|
||||||
|
*/
|
||||||
|
homeImageUrl?: string
|
||||||
|
/**
|
||||||
|
* 简介
|
||||||
|
*/
|
||||||
|
introduction?: string
|
||||||
|
/**
|
||||||
|
* 被喜欢数
|
||||||
|
*/
|
||||||
|
likedNum?: number
|
||||||
|
/**
|
||||||
|
* 昵称
|
||||||
|
*/
|
||||||
|
nickname?: string
|
||||||
|
/**
|
||||||
|
* 排名编号
|
||||||
|
*/
|
||||||
|
rankNo?: number
|
||||||
|
/**
|
||||||
|
* 角色名称
|
||||||
|
*/
|
||||||
|
roleName?: string
|
||||||
|
/**
|
||||||
|
* 0,男;1,女;2,自定义
|
||||||
|
*/
|
||||||
|
sex?: number
|
||||||
|
/**
|
||||||
|
* 标签名称
|
||||||
|
*/
|
||||||
|
tagName?: string
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* com.sonic.frog.domain.output.AiGiftRankOutput
|
||||||
|
*
|
||||||
|
* AiGiftRankOutput
|
||||||
|
*/
|
||||||
|
export interface AiGiftRankOutput {
|
||||||
|
/**
|
||||||
|
* AI的id
|
||||||
|
*/
|
||||||
|
aiId?: number
|
||||||
|
/**
|
||||||
|
* 出生日期
|
||||||
|
*/
|
||||||
|
birthday?: string
|
||||||
|
/**
|
||||||
|
* 性格名称
|
||||||
|
*/
|
||||||
|
characterName?: string
|
||||||
|
/**
|
||||||
|
* 礼物
|
||||||
|
*/
|
||||||
|
giftCoinNum?: number
|
||||||
|
/**
|
||||||
|
* 头像
|
||||||
|
*/
|
||||||
|
headImg?: string
|
||||||
|
/**
|
||||||
|
* 主页头图
|
||||||
|
*/
|
||||||
|
homeImageUrl?: string
|
||||||
|
/**
|
||||||
|
* 简介
|
||||||
|
*/
|
||||||
|
introduction?: string
|
||||||
|
/**
|
||||||
|
* 被喜欢数
|
||||||
|
*/
|
||||||
|
likedNum?: number
|
||||||
|
/**
|
||||||
|
* 昵称
|
||||||
|
*/
|
||||||
|
nickname?: string
|
||||||
|
/**
|
||||||
|
* 排名编号
|
||||||
|
*/
|
||||||
|
rankNo?: number
|
||||||
|
/**
|
||||||
|
* 角色名称
|
||||||
|
*/
|
||||||
|
roleName?: string
|
||||||
|
/**
|
||||||
|
* 0,男;1,女;2,自定义
|
||||||
|
*/
|
||||||
|
sex?: number
|
||||||
|
/**
|
||||||
|
* 标签名称
|
||||||
|
*/
|
||||||
|
tagName?: string
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* com.sonic.frog.domain.output.StartChatOutput
|
||||||
|
*
|
||||||
|
* StartChatOutput
|
||||||
|
*/
|
||||||
|
export interface StartChatOutput {
|
||||||
|
/**
|
||||||
|
* AI的id
|
||||||
|
*/
|
||||||
|
aiId?: number
|
||||||
|
/**
|
||||||
|
* 开场白语音地址
|
||||||
|
*/
|
||||||
|
dialoguePrologueSound?: string
|
||||||
|
/**
|
||||||
|
* 头像
|
||||||
|
*/
|
||||||
|
headImg?: string
|
||||||
|
/**
|
||||||
|
* 被喜欢数
|
||||||
|
*/
|
||||||
|
likedNum?: number
|
||||||
|
/**
|
||||||
|
* 昵称
|
||||||
|
*/
|
||||||
|
nickname?: string
|
||||||
|
/**
|
||||||
|
* 主动聊天内容
|
||||||
|
*/
|
||||||
|
supportingContentList?: string[]
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue