mirror of
https://github.com/nagisa77/OpenIsle.git
synced 2026-02-13 10:30:58 +08:00
Compare commits
212 Commits
feature/co
...
codex/rss
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
5f5b6f84a8 | ||
|
|
cd57d478f2 | ||
|
|
da07313df8 | ||
|
|
c08ecb5e33 | ||
|
|
0a722c81c5 | ||
|
|
15071471b2 | ||
|
|
98a9939738 | ||
|
|
9554030054 | ||
|
|
72e9a77373 | ||
|
|
ed7dcd9414 | ||
|
|
79fe8b5997 | ||
|
|
cfce4d7d1d | ||
|
|
b7f5d8485c | ||
|
|
d4677a5799 | ||
|
|
99644046fc | ||
|
|
22c9bd7d39 | ||
|
|
3fc6929075 | ||
|
|
4eed6889d6 | ||
|
|
959b0f6a48 | ||
|
|
91ffacc335 | ||
|
|
4969a759aa | ||
|
|
81e3a80d35 | ||
|
|
d717ce03c1 | ||
|
|
66035447a8 | ||
|
|
fa1148bc4e | ||
|
|
f60f184c84 | ||
|
|
06ffb180fe | ||
|
|
1b892828f1 | ||
|
|
1aa88ab0fe | ||
|
|
86126699d3 | ||
|
|
a6a07b9bda | ||
|
|
d8b3c68150 | ||
|
|
318b481c4b | ||
|
|
7338b891db | ||
|
|
eb18dc8e94 | ||
|
|
aec5321f89 | ||
|
|
2e658f37a4 | ||
|
|
7ccb2a44e3 | ||
|
|
0fa08e2260 | ||
|
|
38a49f7414 | ||
|
|
fb89c9fb25 | ||
|
|
e9458f5419 | ||
|
|
2d87c8f23d | ||
|
|
cb281e4030 | ||
|
|
9b85d77158 | ||
|
|
a3b28eafe4 | ||
|
|
805a8df7d3 | ||
|
|
02be045f55 | ||
|
|
ac3c7b7bec | ||
|
|
c344b5b4ae | ||
|
|
e7a1e1d159 | ||
|
|
30b56e54cf | ||
|
|
cc525c1c27 | ||
|
|
3f2829cd37 | ||
|
|
3258a42b44 | ||
|
|
a64fd71bbe | ||
|
|
1a12bec7b1 | ||
|
|
fbca19791a | ||
|
|
10b6fdd1cb | ||
|
|
7dd1f1b3d0 | ||
|
|
df92ff664c | ||
|
|
73168c1859 | ||
|
|
77856ff9af | ||
|
|
df49b21620 | ||
|
|
fbe2c66955 | ||
|
|
df7ca77652 | ||
|
|
fe84e3f2fa | ||
|
|
c307732696 | ||
|
|
35bcd2cdc2 | ||
|
|
a29bf7d860 | ||
|
|
27393c15f2 | ||
|
|
c91a787f29 | ||
|
|
6096712291 | ||
|
|
6d20addcde | ||
|
|
d8f9fd670c | ||
|
|
5ebe739917 | ||
|
|
022edc866a | ||
|
|
b06815cc59 | ||
|
|
f1b223a3c9 | ||
|
|
e65273daa6 | ||
|
|
d3a2acb605 | ||
|
|
bced24e47d | ||
|
|
425ad03e6f | ||
|
|
4462d8f711 | ||
|
|
1b31977ec6 | ||
|
|
42693cb1ff | ||
|
|
6b500466fc | ||
|
|
c84262eb88 | ||
|
|
fa2ffaa64a | ||
|
|
3037c856d0 | ||
|
|
7b1ce3f070 | ||
|
|
f4a15b3448 | ||
|
|
239f1f8c84 | ||
|
|
ac303184c4 | ||
|
|
7f16bbdb94 | ||
|
|
f1c83b0f68 | ||
|
|
22c2b1564d | ||
|
|
628d28c12d | ||
|
|
2577992ee3 | ||
|
|
5b837c9d7f | ||
|
|
017ad5bf54 | ||
|
|
f076b70e9b | ||
|
|
62d12ad2a7 | ||
|
|
923854bbc6 | ||
|
|
9ca5d7b167 | ||
|
|
9c3e1d17f0 | ||
|
|
7906062945 | ||
|
|
785c36d339 | ||
|
|
197cbca99c | ||
|
|
b1076d7256 | ||
|
|
ce94cd7e73 | ||
|
|
90147d6cd9 | ||
|
|
2c187cf2cd | ||
|
|
0b6d4f9709 | ||
|
|
cf3b6d8fc7 | ||
|
|
8d98c876d2 | ||
|
|
df4df1933a | ||
|
|
7507f1bb03 | ||
|
|
9b4c36c76a | ||
|
|
edfc81aeb0 | ||
|
|
7bd1225b27 | ||
|
|
2dd56e27af | ||
|
|
c3ecef3609 | ||
|
|
efc74d0f77 | ||
|
|
f27cb5c703 | ||
|
|
a756c2fab3 | ||
|
|
4e2171a8a6 | ||
|
|
bcbdff8768 | ||
|
|
b976a1f46f | ||
|
|
b9fd9711de | ||
|
|
642a527dcf | ||
|
|
88afcc5a8e | ||
|
|
2c5462cd97 | ||
|
|
2f29946b11 | ||
|
|
e27aa34cfd | ||
|
|
2322b2da15 | ||
|
|
79261054f9 | ||
|
|
86633e1f21 | ||
|
|
784598a6f0 | ||
|
|
fdad0e5d34 | ||
|
|
ebf63c4072 | ||
|
|
354d6bdaf9 | ||
|
|
d9aebdebdc | ||
|
|
d6f6495b35 | ||
|
|
300f8705ef | ||
|
|
1f74a29dce | ||
|
|
27ef792b11 | ||
|
|
8dd2d59617 | ||
|
|
077ba448d7 | ||
|
|
9ce85f2769 | ||
|
|
f5557cbf08 | ||
|
|
e042c499e1 | ||
|
|
e01afb168c | ||
|
|
c1d81eb1d1 | ||
|
|
2b0b429866 | ||
|
|
8ea85d78ee | ||
|
|
3b506fe8a8 | ||
|
|
3cc7a4c01a | ||
|
|
2e749a5672 | ||
|
|
7d553d7750 | ||
|
|
16105cef54 | ||
|
|
2b824d94f2 | ||
|
|
00d3c563e2 | ||
|
|
b26891261c | ||
|
|
c1d19b854b | ||
|
|
72e7ccf262 | ||
|
|
84ca6fd28c | ||
|
|
d1c148c5c4 | ||
|
|
ef58630dae | ||
|
|
f025e82e7c | ||
|
|
4380a988f7 | ||
|
|
2899f7af48 | ||
|
|
d4b05256a3 | ||
|
|
57a26e375d | ||
|
|
8a202c4fba | ||
|
|
089b2a3f5f | ||
|
|
0b3d7a21d5 | ||
|
|
fe8a705a28 | ||
|
|
974c7ba83e | ||
|
|
f2937d735d | ||
|
|
423248c574 | ||
|
|
5126cfda8c | ||
|
|
e009875797 | ||
|
|
04ff17f796 | ||
|
|
e9c9fbd742 | ||
|
|
b385945c2d | ||
|
|
24cbed2eda | ||
|
|
ba073b71a6 | ||
|
|
5ff098ea21 | ||
|
|
f6713b956e | ||
|
|
b8ea12646f | ||
|
|
e573e54c2b | ||
|
|
8ec005d392 | ||
|
|
b1f92f61a6 | ||
|
|
824b4dd8aa | ||
|
|
6b08db7e58 | ||
|
|
6f3830b3f7 | ||
|
|
d70dad723f | ||
|
|
2cf89e4802 | ||
|
|
1fc6460ae0 | ||
|
|
a04e5c2f6f | ||
|
|
77b26937f5 | ||
|
|
a1134b9d4b | ||
|
|
600f6ac1d1 | ||
|
|
9ad50b35c9 | ||
|
|
867ee3907b | ||
|
|
58fcd42745 | ||
|
|
0ee62a3a04 | ||
|
|
f0bc7a22a0 | ||
|
|
f6c0c8e226 | ||
|
|
8f3c0d6710 | ||
|
|
4f738778db |
23
.github/workflows/deploy-staging.yml
vendored
Normal file
23
.github/workflows/deploy-staging.yml
vendored
Normal file
@@ -0,0 +1,23 @@
|
|||||||
|
name: Staging CI & CD
|
||||||
|
|
||||||
|
on:
|
||||||
|
push:
|
||||||
|
branches: [main]
|
||||||
|
workflow_dispatch:
|
||||||
|
|
||||||
|
jobs:
|
||||||
|
build-and-deploy:
|
||||||
|
runs-on: ubuntu-latest
|
||||||
|
environment: Deploy
|
||||||
|
|
||||||
|
steps:
|
||||||
|
- uses: actions/checkout@v4
|
||||||
|
|
||||||
|
- name: Deploy to Server
|
||||||
|
uses: appleboy/ssh-action@v1.0.3
|
||||||
|
with:
|
||||||
|
host: ${{ secrets.SSH_HOST }}
|
||||||
|
username: root
|
||||||
|
key: ${{ secrets.SSH_KEY }}
|
||||||
|
script: bash /opt/openisle/deploy-staging.sh
|
||||||
|
|
||||||
20
.github/workflows/deploy.yml
vendored
20
.github/workflows/deploy.yml
vendored
@@ -1,9 +1,9 @@
|
|||||||
name: CI & CD
|
name: CI & CD
|
||||||
|
|
||||||
on:
|
on:
|
||||||
push:
|
|
||||||
branches: [main]
|
|
||||||
workflow_dispatch:
|
workflow_dispatch:
|
||||||
|
schedule:
|
||||||
|
- cron: "0 19 * * *" # 每天 UTC 19:00,相当于北京时间凌晨3点
|
||||||
|
|
||||||
jobs:
|
jobs:
|
||||||
build-and-deploy:
|
build-and-deploy:
|
||||||
@@ -13,22 +13,6 @@ jobs:
|
|||||||
steps:
|
steps:
|
||||||
- uses: actions/checkout@v4
|
- uses: actions/checkout@v4
|
||||||
|
|
||||||
# - uses: actions/setup-java@v4
|
|
||||||
# with:
|
|
||||||
# java-version: '17'
|
|
||||||
# distribution: 'temurin'
|
|
||||||
|
|
||||||
# - run: mvn -B clean package -DskipTests
|
|
||||||
|
|
||||||
# - uses: actions/setup-node@v4
|
|
||||||
# with:
|
|
||||||
# node-version: '20'
|
|
||||||
|
|
||||||
# - run: |
|
|
||||||
# cd open-isle-cli
|
|
||||||
# npm ci
|
|
||||||
# npm run build
|
|
||||||
|
|
||||||
- name: Deploy to Server
|
- name: Deploy to Server
|
||||||
uses: appleboy/ssh-action@v1.0.3
|
uses: appleboy/ssh-action@v1.0.3
|
||||||
with:
|
with:
|
||||||
|
|||||||
116
CONTRIBUTING.md
Normal file
116
CONTRIBUTING.md
Normal file
@@ -0,0 +1,116 @@
|
|||||||
|
#### **⚠️注意:仅想修改前端的朋友可不用部署后端服务**
|
||||||
|
|
||||||
|
## 如何部署
|
||||||
|
|
||||||
|
> Step1 先克隆仓库
|
||||||
|
|
||||||
|
```shell
|
||||||
|
git clone https://github.com/nagisa77/OpenIsle.git
|
||||||
|
cd OpenIsle
|
||||||
|
```
|
||||||
|
|
||||||
|
> Step2 后端部署
|
||||||
|
|
||||||
|
```shell
|
||||||
|
cd backend
|
||||||
|
```
|
||||||
|
|
||||||
|
以IDEA编辑器为例,IDEA打开backend文件夹。
|
||||||
|
|
||||||
|
- 设置VM Option,最好运行在其他端口,非8080,这里设置8081
|
||||||
|
|
||||||
|
```shell
|
||||||
|
-Dserver.port=8081
|
||||||
|
```
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
- 设置jdk版本为java 17
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
- 本机配置MySQL服务(网上很多教程,忽略)
|
||||||
|
- 设置环境变量.env 文件 或.properties 文件(二选一)
|
||||||
|
|
||||||
|
1. 环境变量文件生成
|
||||||
|
|
||||||
|
```shell
|
||||||
|
cp open-isle.env.example open-isle.env
|
||||||
|
```
|
||||||
|
|
||||||
|
修改环境变量,留下需要的,比如你要开发Google登录业务,就需要谷歌相关的变量,数据库是一定要的
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
应用环境文件, 选择刚刚的`open-isle.env`
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
2. 直接修改 .properities 文件
|
||||||
|
|
||||||
|
位置src/main/application.properties, 数据库需要修改标红处,其他按需修改
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
处理完环境问题直接跑起来就能通了
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
> Step3 前端部署
|
||||||
|
|
||||||
|
前端可以依赖本机部署的后端,也可以直接调用线上的后端接口
|
||||||
|
|
||||||
|
```shell
|
||||||
|
cd ../frontend_nuxt/
|
||||||
|
```
|
||||||
|
|
||||||
|
copy环境.env文件
|
||||||
|
|
||||||
|
```shell
|
||||||
|
cp .env.staging.example .env
|
||||||
|
```
|
||||||
|
|
||||||
|
1. 依赖本机部署的后端:打开本文件夹,修改.env 修改为瞄准本机后端端口
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
; 本地部署后端
|
||||||
|
NUXT_PUBLIC_API_BASE_URL=https://127.0.0.1:8081
|
||||||
|
; 预发环境后端
|
||||||
|
; NUXT_PUBLIC_API_BASE_URL=https://staging.open-isle.com
|
||||||
|
; 生产环境后端
|
||||||
|
; NUXT_PUBLIC_API_BASE_URL=https://www.open-isle.com
|
||||||
|
```
|
||||||
|
|
||||||
|
2. 依赖预发环境后台环境
|
||||||
|
|
||||||
|
**(⚠️强烈推荐只部署前端的朋友使用该环境)**
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
; 本地部署后端
|
||||||
|
; NUXT_PUBLIC_API_BASE_URL=https://127.0.0.1:8081
|
||||||
|
; 预发环境后端
|
||||||
|
NUXT_PUBLIC_API_BASE_URL=https://staging.open-isle.com
|
||||||
|
; 生产环境后端
|
||||||
|
; NUXT_PUBLIC_API_BASE_URL=https://www.open-isle.com
|
||||||
|
```
|
||||||
|
|
||||||
|
4. 依赖线上后台环境
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
; 本地部署后端
|
||||||
|
; NUXT_PUBLIC_API_BASE_URL=https://127.0.0.1:8081
|
||||||
|
; 预发环境后端
|
||||||
|
; NUXT_PUBLIC_API_BASE_URL=https://staging.open-isle.com
|
||||||
|
; 生产环境后端
|
||||||
|
NUXT_PUBLIC_API_BASE_URL=https://www.open-isle.com
|
||||||
|
```
|
||||||
|
|
||||||
|
```shell
|
||||||
|
# 安装依赖
|
||||||
|
npm install --verbose
|
||||||
|
|
||||||
|
# 运行前端服务
|
||||||
|
npm run dev
|
||||||
|
```
|
||||||
|
|
||||||
|
如此一来,浏览器访问 http://127.0.0.1:3000 即可访问前端页面
|
||||||
20
README.md
20
README.md
@@ -1,28 +1,18 @@
|
|||||||
<p align="center">
|
<p align="center">
|
||||||
<img alt="OpenIsle" src="https://openisle-1307107697.cos.ap-guangzhou.myqcloud.com/assert/image.png" width="200">
|
<img alt="OpenIsle" src="https://openisle-1307107697.cos.ap-guangzhou.myqcloud.com/assert/image.png" width="200">
|
||||||
<br><br>
|
<br>
|
||||||
高效的开源社区前后端端平台
|
高效的开源社区前后端端平台
|
||||||
<br><br>
|
<br><br><br>
|
||||||
<a href="LICENSE"><img src="https://img.shields.io/badge/license-MIT-blue.svg?style=flat-square"></a>
|
<img alt="Image" src="https://openisle-1307107697.cos.accelerate.myqcloud.com/dynamic_assert/22752cfac5a04a9c90c41995b9f55fed.png" width="1200">
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
## 💡 简介
|
## 💡 简介
|
||||||
|
|
||||||
OpenIsle 是一个使用 Spring Boot 和 Vue 3 构建的全栈开源社区平台,提供用户注册、登录、贴文发布、评论交互等完整功能,可用于项目社区或直接打造自主社区站点。
|
OpenIsle 是一个使用 Spring Boot 和 Vue 3 构建的全栈开源社区平台,提供用户注册、登录、贴文发布、评论交互等完整功能,可用于项目社区或直接打造自主社区站点。
|
||||||
|
|
||||||
## 🚀 部署
|
## 🚧 开发 & 部署
|
||||||
|
|
||||||
### 后端
|
详细见 [Contributing](https://github.com/nagisa77/OpenIsle?tab=contributing-ov-file)
|
||||||
|
|
||||||
1. 确保安装 JDK 17 及 Maven
|
|
||||||
2. 信息配置修改 `src/main/resources/application.properties`,或通过环境变量设置数据库等参数
|
|
||||||
3. 执行 `mvn clean package` 生成包,之后使用 `java -jar target/openisle-0.0.1-SNAPSHOT.jar`启动,或在开发时直接使用 `mvn spring-boot:run`
|
|
||||||
|
|
||||||
### 前端
|
|
||||||
|
|
||||||
1. `cd open-isle-cli`
|
|
||||||
2. 执行 `npm install`
|
|
||||||
3. `npm run serve`可在本地启动开发服务,产品环境使用 `npm run build`生成 `dist/` 文件,配合线上网站方式部署
|
|
||||||
|
|
||||||
## ✨ 项目特点
|
## ✨ 项目特点
|
||||||
|
|
||||||
|
|||||||
@@ -3,6 +3,12 @@ MYSQL_URL=jdbc:mysql://<数据库地址>:<端口>/<数据库名>?useUnicode=yes&
|
|||||||
MYSQL_USER=<数据库用户名>
|
MYSQL_USER=<数据库用户名>
|
||||||
MYSQL_PASSWORD=<数据库密码>
|
MYSQL_PASSWORD=<数据库密码>
|
||||||
|
|
||||||
|
# === JWT ===
|
||||||
|
JWT_SECRET=<jwt secret>
|
||||||
|
JWT_REASON_SECRET=<jwt reason secret>
|
||||||
|
JWT_RESET_SECRET=<jwt reset secret>
|
||||||
|
JWT_INVITE_SECRET=<jwt invite secret>
|
||||||
|
JWT_EXPIRATION=2592000000
|
||||||
|
|
||||||
# === Resend ===
|
# === Resend ===
|
||||||
RESEND_API_KEY=<你的resend-api-key>
|
RESEND_API_KEY=<你的resend-api-key>
|
||||||
@@ -30,4 +36,4 @@ OPENAI_API_KEY=<你的openai-api-key>
|
|||||||
WEBPUSH_PUBLIC_KEY=<你的webpush-public-key>
|
WEBPUSH_PUBLIC_KEY=<你的webpush-public-key>
|
||||||
WEBPUSH_PRIVATE_KEY=<你的webpush-private-key>
|
WEBPUSH_PRIVATE_KEY=<你的webpush-private-key>
|
||||||
|
|
||||||
# LOG_LEVEL=DEBUG
|
# LOG_LEVEL=DEBUG
|
||||||
|
|||||||
@@ -38,6 +38,16 @@
|
|||||||
<groupId>org.springframework.boot</groupId>
|
<groupId>org.springframework.boot</groupId>
|
||||||
<artifactId>spring-boot-starter-security</artifactId>
|
<artifactId>spring-boot-starter-security</artifactId>
|
||||||
</dependency>
|
</dependency>
|
||||||
|
<dependency>
|
||||||
|
<groupId>com.vladsch.flexmark</groupId>
|
||||||
|
<artifactId>flexmark-all</artifactId>
|
||||||
|
<version>0.64.8</version>
|
||||||
|
</dependency>
|
||||||
|
<dependency>
|
||||||
|
<groupId>org.jsoup</groupId>
|
||||||
|
<artifactId>jsoup</artifactId>
|
||||||
|
<version>1.17.2</version>
|
||||||
|
</dependency>
|
||||||
<dependency>
|
<dependency>
|
||||||
<groupId>com.mysql</groupId>
|
<groupId>com.mysql</groupId>
|
||||||
<artifactId>mysql-connector-j</artifactId>
|
<artifactId>mysql-connector-j</artifactId>
|
||||||
|
|||||||
@@ -6,6 +6,8 @@ import com.openisle.repository.ActivityRepository;
|
|||||||
import lombok.RequiredArgsConstructor;
|
import lombok.RequiredArgsConstructor;
|
||||||
import org.springframework.boot.CommandLineRunner;
|
import org.springframework.boot.CommandLineRunner;
|
||||||
import org.springframework.stereotype.Component;
|
import org.springframework.stereotype.Component;
|
||||||
|
import java.time.LocalDate;
|
||||||
|
import java.time.LocalDateTime;
|
||||||
|
|
||||||
@Component
|
@Component
|
||||||
@RequiredArgsConstructor
|
@RequiredArgsConstructor
|
||||||
@@ -22,5 +24,16 @@ public class ActivityInitializer implements CommandLineRunner {
|
|||||||
a.setContent("为了有利于建站推广以及激励发布内容,我们推出了建站送奶茶的活动,前50名达到level 1的用户,可以联系站长获取奶茶/咖啡一杯");
|
a.setContent("为了有利于建站推广以及激励发布内容,我们推出了建站送奶茶的活动,前50名达到level 1的用户,可以联系站长获取奶茶/咖啡一杯");
|
||||||
activityRepository.save(a);
|
activityRepository.save(a);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (activityRepository.findByType(ActivityType.INVITE_POINTS) == null) {
|
||||||
|
Activity a = new Activity();
|
||||||
|
a.setTitle("🎁邀请码送积分活动");
|
||||||
|
a.setType(ActivityType.INVITE_POINTS);
|
||||||
|
a.setIcon("https://img.icons8.com/color/96/gift.png");
|
||||||
|
a.setContent("使用邀请码注册或邀请好友即可获得积分奖励,快来参与吧!");
|
||||||
|
a.setStartTime(LocalDateTime.now());
|
||||||
|
a.setEndTime(LocalDate.of(LocalDate.now().getYear(), 10, 1).atStartOfDay());
|
||||||
|
activityRepository.save(a);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,31 @@
|
|||||||
|
package com.openisle.config;
|
||||||
|
|
||||||
|
import com.openisle.model.PointGood;
|
||||||
|
import com.openisle.repository.PointGoodRepository;
|
||||||
|
import lombok.RequiredArgsConstructor;
|
||||||
|
import org.springframework.boot.CommandLineRunner;
|
||||||
|
import org.springframework.stereotype.Component;
|
||||||
|
|
||||||
|
/** Initialize default point mall goods. */
|
||||||
|
@Component
|
||||||
|
@RequiredArgsConstructor
|
||||||
|
public class PointGoodInitializer implements CommandLineRunner {
|
||||||
|
private final PointGoodRepository pointGoodRepository;
|
||||||
|
|
||||||
|
@Override
|
||||||
|
public void run(String... args) {
|
||||||
|
if (pointGoodRepository.count() == 0) {
|
||||||
|
PointGood g1 = new PointGood();
|
||||||
|
g1.setName("GPT Plus 1 个月");
|
||||||
|
g1.setCost(20000);
|
||||||
|
g1.setImage("https://openisle-1307107697.cos.ap-guangzhou.myqcloud.com/assert/icons/chatgpt.png");
|
||||||
|
pointGoodRepository.save(g1);
|
||||||
|
|
||||||
|
PointGood g2 = new PointGood();
|
||||||
|
g2.setName("奶茶");
|
||||||
|
g2.setCost(5000);
|
||||||
|
g2.setImage("https://openisle-1307107697.cos.ap-guangzhou.myqcloud.com/assert/icons/coffee.png");
|
||||||
|
pointGoodRepository.save(g2);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -75,14 +75,16 @@ public class SecurityConfig {
|
|||||||
cfg.setAllowedOrigins(List.of(
|
cfg.setAllowedOrigins(List.of(
|
||||||
"http://127.0.0.1:8080",
|
"http://127.0.0.1:8080",
|
||||||
"http://127.0.0.1:3000",
|
"http://127.0.0.1:3000",
|
||||||
|
"http://127.0.0.1:3001",
|
||||||
"http://127.0.0.1",
|
"http://127.0.0.1",
|
||||||
"http://localhost:8080",
|
"http://localhost:8080",
|
||||||
"http://localhost:3000",
|
"http://localhost:3000",
|
||||||
|
"http://localhost:3001",
|
||||||
"http://localhost",
|
"http://localhost",
|
||||||
"http://30.211.97.238:3000",
|
"http://30.211.97.238:3000",
|
||||||
"http://30.211.97.238",
|
"http://30.211.97.238",
|
||||||
"http://192.168.7.70",
|
"http://192.168.7.98",
|
||||||
"http://192.168.7.70:8080",
|
"http://192.168.7.98:3000",
|
||||||
websiteUrl,
|
websiteUrl,
|
||||||
websiteUrl.replace("://www.", "://")
|
websiteUrl.replace("://www.", "://")
|
||||||
));
|
));
|
||||||
@@ -117,6 +119,9 @@ public class SecurityConfig {
|
|||||||
.requestMatchers(HttpMethod.GET, "/api/reaction-types").permitAll()
|
.requestMatchers(HttpMethod.GET, "/api/reaction-types").permitAll()
|
||||||
.requestMatchers(HttpMethod.GET, "/api/activities/**").permitAll()
|
.requestMatchers(HttpMethod.GET, "/api/activities/**").permitAll()
|
||||||
.requestMatchers(HttpMethod.GET, "/api/sitemap.xml").permitAll()
|
.requestMatchers(HttpMethod.GET, "/api/sitemap.xml").permitAll()
|
||||||
|
.requestMatchers(HttpMethod.GET, "/api/rss").permitAll()
|
||||||
|
.requestMatchers(HttpMethod.GET, "/api/point-goods").permitAll()
|
||||||
|
.requestMatchers(HttpMethod.POST, "/api/point-goods").permitAll()
|
||||||
.requestMatchers(HttpMethod.POST, "/api/categories/**").hasAuthority("ADMIN")
|
.requestMatchers(HttpMethod.POST, "/api/categories/**").hasAuthority("ADMIN")
|
||||||
.requestMatchers(HttpMethod.POST, "/api/tags/**").authenticated()
|
.requestMatchers(HttpMethod.POST, "/api/tags/**").authenticated()
|
||||||
.requestMatchers(HttpMethod.DELETE, "/api/categories/**").hasAuthority("ADMIN")
|
.requestMatchers(HttpMethod.DELETE, "/api/categories/**").hasAuthority("ADMIN")
|
||||||
@@ -149,7 +154,9 @@ public class SecurityConfig {
|
|||||||
uri.startsWith("/api/search") || uri.startsWith("/api/users") ||
|
uri.startsWith("/api/search") || uri.startsWith("/api/users") ||
|
||||||
uri.startsWith("/api/reaction-types") || uri.startsWith("/api/config") ||
|
uri.startsWith("/api/reaction-types") || uri.startsWith("/api/config") ||
|
||||||
uri.startsWith("/api/activities") || uri.startsWith("/api/push/public-key") ||
|
uri.startsWith("/api/activities") || uri.startsWith("/api/push/public-key") ||
|
||||||
uri.startsWith("/api/sitemap.xml") || uri.startsWith("/api/medals"));
|
uri.startsWith("/api/point-goods") ||
|
||||||
|
uri.startsWith("/api/sitemap.xml") || uri.startsWith("/api/medals") ||
|
||||||
|
uri.startsWith("/api/rss"));
|
||||||
|
|
||||||
if (authHeader != null && authHeader.startsWith("Bearer ")) {
|
if (authHeader != null && authHeader.startsWith("Bearer ")) {
|
||||||
String token = authHeader.substring(7);
|
String token = authHeader.substring(7);
|
||||||
|
|||||||
@@ -45,4 +45,14 @@ public class AdminPostController {
|
|||||||
public PostSummaryDto unpin(@PathVariable Long id) {
|
public PostSummaryDto unpin(@PathVariable Long id) {
|
||||||
return postMapper.toSummaryDto(postService.unpinPost(id));
|
return postMapper.toSummaryDto(postService.unpinPost(id));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@PostMapping("/{id}/rss-exclude")
|
||||||
|
public PostSummaryDto excludeFromRss(@PathVariable Long id) {
|
||||||
|
return postMapper.toSummaryDto(postService.excludeFromRss(id));
|
||||||
|
}
|
||||||
|
|
||||||
|
@PostMapping("/{id}/rss-include")
|
||||||
|
public PostSummaryDto includeInRss(@PathVariable Long id) {
|
||||||
|
return postMapper.toSummaryDto(postService.includeInRss(id));
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -29,6 +29,7 @@ public class AuthController {
|
|||||||
private final RegisterModeService registerModeService;
|
private final RegisterModeService registerModeService;
|
||||||
private final NotificationService notificationService;
|
private final NotificationService notificationService;
|
||||||
private final UserRepository userRepository;
|
private final UserRepository userRepository;
|
||||||
|
private final InviteService inviteService;
|
||||||
|
|
||||||
|
|
||||||
@Value("${app.captcha.enabled:false}")
|
@Value("${app.captcha.enabled:false}")
|
||||||
@@ -45,6 +46,27 @@ public class AuthController {
|
|||||||
if (captchaEnabled && registerCaptchaEnabled && !captchaService.verify(req.getCaptcha())) {
|
if (captchaEnabled && registerCaptchaEnabled && !captchaService.verify(req.getCaptcha())) {
|
||||||
return ResponseEntity.badRequest().body(Map.of("error", "Invalid captcha"));
|
return ResponseEntity.badRequest().body(Map.of("error", "Invalid captcha"));
|
||||||
}
|
}
|
||||||
|
if (req.getInviteToken() != null && !req.getInviteToken().isEmpty()) {
|
||||||
|
InviteService.InviteValidateResult result = inviteService.validate(req.getInviteToken());
|
||||||
|
if (!result.isValidate()) {
|
||||||
|
return ResponseEntity.badRequest().body(Map.of("error", "邀请码使用次数过多"));
|
||||||
|
}
|
||||||
|
try {
|
||||||
|
User user = userService.registerWithInvite(
|
||||||
|
req.getUsername(), req.getEmail(), req.getPassword());
|
||||||
|
inviteService.consume(req.getInviteToken(), user.getUsername());
|
||||||
|
emailService.sendEmail(user.getEmail(), "在网站填写验证码以验证", "您的验证码是 " + user.getVerificationCode());
|
||||||
|
return ResponseEntity.ok(Map.of(
|
||||||
|
"token", jwtService.generateToken(user.getUsername()),
|
||||||
|
"reason_code", "INVITE_APPROVED"
|
||||||
|
));
|
||||||
|
} catch (FieldException e) {
|
||||||
|
return ResponseEntity.badRequest().body(Map.of(
|
||||||
|
"field", e.getField(),
|
||||||
|
"error", e.getMessage()
|
||||||
|
));
|
||||||
|
}
|
||||||
|
}
|
||||||
User user = userService.register(
|
User user = userService.register(
|
||||||
req.getUsername(), req.getEmail(), req.getPassword(), "", registerModeService.getRegisterMode());
|
req.getUsername(), req.getEmail(), req.getPassword(), "", registerModeService.getRegisterMode());
|
||||||
emailService.sendEmail(user.getEmail(), "在网站填写验证码以验证", "您的验证码是 " + user.getVerificationCode());
|
emailService.sendEmail(user.getEmail(), "在网站填写验证码以验证", "您的验证码是 " + user.getVerificationCode());
|
||||||
@@ -58,10 +80,26 @@ public class AuthController {
|
|||||||
public ResponseEntity<?> verify(@RequestBody VerifyRequest req) {
|
public ResponseEntity<?> verify(@RequestBody VerifyRequest req) {
|
||||||
boolean ok = userService.verifyCode(req.getUsername(), req.getCode());
|
boolean ok = userService.verifyCode(req.getUsername(), req.getCode());
|
||||||
if (ok) {
|
if (ok) {
|
||||||
return ResponseEntity.ok(Map.of(
|
Optional<User> userOpt = userService.findByUsername(req.getUsername());
|
||||||
"message", "Verified",
|
if (userOpt.isEmpty()) {
|
||||||
"token", jwtService.generateReasonToken(req.getUsername())
|
return ResponseEntity.badRequest().body(Map.of("error", "Invalid credentials"));
|
||||||
));
|
}
|
||||||
|
|
||||||
|
User user = userOpt.get();
|
||||||
|
|
||||||
|
if (user.isApproved()) {
|
||||||
|
return ResponseEntity.ok(Map.of(
|
||||||
|
"message", "Verified and isApproved",
|
||||||
|
"reason_code", "VERIFIED_AND_APPROVED",
|
||||||
|
"token", jwtService.generateToken(req.getUsername())
|
||||||
|
));
|
||||||
|
} else {
|
||||||
|
return ResponseEntity.ok(Map.of(
|
||||||
|
"message", "Verified",
|
||||||
|
"reason_code", "VERIFIED",
|
||||||
|
"token", jwtService.generateReasonToken(req.getUsername())
|
||||||
|
));
|
||||||
|
}
|
||||||
}
|
}
|
||||||
return ResponseEntity.badRequest().body(Map.of("error", "Invalid verification code"));
|
return ResponseEntity.badRequest().body(Map.of("error", "Invalid verification code"));
|
||||||
}
|
}
|
||||||
@@ -106,27 +144,43 @@ public class AuthController {
|
|||||||
|
|
||||||
@PostMapping("/google")
|
@PostMapping("/google")
|
||||||
public ResponseEntity<?> loginWithGoogle(@RequestBody GoogleLoginRequest req) {
|
public ResponseEntity<?> loginWithGoogle(@RequestBody GoogleLoginRequest req) {
|
||||||
Optional<User> user = googleAuthService.authenticate(req.getIdToken(), registerModeService.getRegisterMode());
|
boolean viaInvite = req.getInviteToken() != null && !req.getInviteToken().isEmpty();
|
||||||
if (user.isPresent()) {
|
InviteService.InviteValidateResult inviteValidateResult = inviteService.validate(req.getInviteToken());
|
||||||
if (RegisterMode.DIRECT.equals(registerModeService.getRegisterMode())) {
|
if (viaInvite && !inviteValidateResult.isValidate()) {
|
||||||
return ResponseEntity.ok(Map.of("token", jwtService.generateToken(user.get().getUsername())));
|
return ResponseEntity.badRequest().body(Map.of("error", "Invalid invite token"));
|
||||||
|
}
|
||||||
|
Optional<AuthResult> resultOpt = googleAuthService.authenticate(
|
||||||
|
req.getIdToken(),
|
||||||
|
registerModeService.getRegisterMode(),
|
||||||
|
viaInvite);
|
||||||
|
if (resultOpt.isPresent()) {
|
||||||
|
AuthResult result = resultOpt.get();
|
||||||
|
if (viaInvite && result.isNewUser()) {
|
||||||
|
inviteService.consume(req.getInviteToken(), inviteValidateResult.getInviteToken().getInviter().getUsername());
|
||||||
|
return ResponseEntity.ok(Map.of(
|
||||||
|
"token", jwtService.generateToken(result.getUser().getUsername()),
|
||||||
|
"reason_code", "INVITE_APPROVED"
|
||||||
|
));
|
||||||
}
|
}
|
||||||
if (!user.get().isApproved()) {
|
if (RegisterMode.DIRECT.equals(registerModeService.getRegisterMode())) {
|
||||||
if (user.get().getRegisterReason() != null && !user.get().getRegisterReason().isEmpty()) {
|
return ResponseEntity.ok(Map.of("token", jwtService.generateToken(result.getUser().getUsername())));
|
||||||
|
}
|
||||||
|
if (!result.getUser().isApproved()) {
|
||||||
|
if (result.getUser().getRegisterReason() != null && !result.getUser().getRegisterReason().isEmpty()) {
|
||||||
return ResponseEntity.badRequest().body(Map.of(
|
return ResponseEntity.badRequest().body(Map.of(
|
||||||
"error", "Account awaiting approval",
|
"error", "Account awaiting approval",
|
||||||
"reason_code", "IS_APPROVING",
|
"reason_code", "IS_APPROVING",
|
||||||
"token", jwtService.generateReasonToken(user.get().getUsername())
|
"token", jwtService.generateReasonToken(result.getUser().getUsername())
|
||||||
));
|
));
|
||||||
}
|
}
|
||||||
return ResponseEntity.badRequest().body(Map.of(
|
return ResponseEntity.badRequest().body(Map.of(
|
||||||
"error", "Account awaiting approval",
|
"error", "Account awaiting approval",
|
||||||
"reason_code", "NOT_APPROVED",
|
"reason_code", "NOT_APPROVED",
|
||||||
"token", jwtService.generateReasonToken(user.get().getUsername())
|
"token", jwtService.generateReasonToken(result.getUser().getUsername())
|
||||||
));
|
));
|
||||||
}
|
}
|
||||||
|
|
||||||
return ResponseEntity.ok(Map.of("token", jwtService.generateToken(user.get().getUsername())));
|
return ResponseEntity.ok(Map.of("token", jwtService.generateToken(result.getUser().getUsername())));
|
||||||
}
|
}
|
||||||
return ResponseEntity.badRequest().body(Map.of(
|
return ResponseEntity.badRequest().body(Map.of(
|
||||||
"error", "Invalid google token",
|
"error", "Invalid google token",
|
||||||
@@ -165,28 +219,45 @@ public class AuthController {
|
|||||||
|
|
||||||
@PostMapping("/github")
|
@PostMapping("/github")
|
||||||
public ResponseEntity<?> loginWithGithub(@RequestBody GithubLoginRequest req) {
|
public ResponseEntity<?> loginWithGithub(@RequestBody GithubLoginRequest req) {
|
||||||
Optional<User> user = githubAuthService.authenticate(req.getCode(), registerModeService.getRegisterMode(), req.getRedirectUri());
|
boolean viaInvite = req.getInviteToken() != null && !req.getInviteToken().isEmpty();
|
||||||
if (user.isPresent()) {
|
InviteService.InviteValidateResult inviteValidateResult = inviteService.validate(req.getInviteToken());
|
||||||
if (RegisterMode.DIRECT.equals(registerModeService.getRegisterMode())) {
|
if (viaInvite && !inviteValidateResult.isValidate()) {
|
||||||
return ResponseEntity.ok(Map.of("token", jwtService.generateToken(user.get().getUsername())));
|
return ResponseEntity.badRequest().body(Map.of("error", "Invalid invite token"));
|
||||||
|
}
|
||||||
|
Optional<AuthResult> resultOpt = githubAuthService.authenticate(
|
||||||
|
req.getCode(),
|
||||||
|
registerModeService.getRegisterMode(),
|
||||||
|
req.getRedirectUri(),
|
||||||
|
viaInvite);
|
||||||
|
if (resultOpt.isPresent()) {
|
||||||
|
AuthResult result = resultOpt.get();
|
||||||
|
if (viaInvite && result.isNewUser()) {
|
||||||
|
inviteService.consume(req.getInviteToken(), inviteValidateResult.getInviteToken().getInviter().getUsername());
|
||||||
|
return ResponseEntity.ok(Map.of(
|
||||||
|
"token", jwtService.generateToken(result.getUser().getUsername()),
|
||||||
|
"reason_code", "INVITE_APPROVED"
|
||||||
|
));
|
||||||
}
|
}
|
||||||
if (!user.get().isApproved()) {
|
if (RegisterMode.DIRECT.equals(registerModeService.getRegisterMode())) {
|
||||||
if (user.get().getRegisterReason() != null && !user.get().getRegisterReason().isEmpty()) {
|
return ResponseEntity.ok(Map.of("token", jwtService.generateToken(result.getUser().getUsername())));
|
||||||
|
}
|
||||||
|
if (!result.getUser().isApproved()) {
|
||||||
|
if (result.getUser().getRegisterReason() != null && !result.getUser().getRegisterReason().isEmpty()) {
|
||||||
// 已填写注册理由
|
// 已填写注册理由
|
||||||
return ResponseEntity.badRequest().body(Map.of(
|
return ResponseEntity.badRequest().body(Map.of(
|
||||||
"error", "Account awaiting approval",
|
"error", "Account awaiting approval",
|
||||||
"reason_code", "IS_APPROVING",
|
"reason_code", "IS_APPROVING",
|
||||||
"token", jwtService.generateReasonToken(user.get().getUsername())
|
"token", jwtService.generateReasonToken(result.getUser().getUsername())
|
||||||
));
|
));
|
||||||
}
|
}
|
||||||
return ResponseEntity.badRequest().body(Map.of(
|
return ResponseEntity.badRequest().body(Map.of(
|
||||||
"error", "Account awaiting approval",
|
"error", "Account awaiting approval",
|
||||||
"reason_code", "NOT_APPROVED",
|
"reason_code", "NOT_APPROVED",
|
||||||
"token", jwtService.generateReasonToken(user.get().getUsername())
|
"token", jwtService.generateReasonToken(result.getUser().getUsername())
|
||||||
));
|
));
|
||||||
}
|
}
|
||||||
|
|
||||||
return ResponseEntity.ok(Map.of("token", jwtService.generateToken(user.get().getUsername())));
|
return ResponseEntity.ok(Map.of("token", jwtService.generateToken(result.getUser().getUsername())));
|
||||||
}
|
}
|
||||||
return ResponseEntity.badRequest().body(Map.of(
|
return ResponseEntity.badRequest().body(Map.of(
|
||||||
"error", "Invalid github code",
|
"error", "Invalid github code",
|
||||||
@@ -196,27 +267,44 @@ public class AuthController {
|
|||||||
|
|
||||||
@PostMapping("/discord")
|
@PostMapping("/discord")
|
||||||
public ResponseEntity<?> loginWithDiscord(@RequestBody DiscordLoginRequest req) {
|
public ResponseEntity<?> loginWithDiscord(@RequestBody DiscordLoginRequest req) {
|
||||||
Optional<User> user = discordAuthService.authenticate(req.getCode(), registerModeService.getRegisterMode(), req.getRedirectUri());
|
boolean viaInvite = req.getInviteToken() != null && !req.getInviteToken().isEmpty();
|
||||||
if (user.isPresent()) {
|
InviteService.InviteValidateResult inviteValidateResult = inviteService.validate(req.getInviteToken());
|
||||||
if (RegisterMode.DIRECT.equals(registerModeService.getRegisterMode())) {
|
if (viaInvite && !inviteValidateResult.isValidate()) {
|
||||||
return ResponseEntity.ok(Map.of("token", jwtService.generateToken(user.get().getUsername())));
|
return ResponseEntity.badRequest().body(Map.of("error", "Invalid invite token"));
|
||||||
|
}
|
||||||
|
Optional<AuthResult> resultOpt = discordAuthService.authenticate(
|
||||||
|
req.getCode(),
|
||||||
|
registerModeService.getRegisterMode(),
|
||||||
|
req.getRedirectUri(),
|
||||||
|
viaInvite);
|
||||||
|
if (resultOpt.isPresent()) {
|
||||||
|
AuthResult result = resultOpt.get();
|
||||||
|
if (viaInvite && result.isNewUser()) {
|
||||||
|
inviteService.consume(req.getInviteToken(), inviteValidateResult.getInviteToken().getInviter().getUsername());
|
||||||
|
return ResponseEntity.ok(Map.of(
|
||||||
|
"token", jwtService.generateToken(result.getUser().getUsername()),
|
||||||
|
"reason_code", "INVITE_APPROVED"
|
||||||
|
));
|
||||||
}
|
}
|
||||||
if (!user.get().isApproved()) {
|
if (RegisterMode.DIRECT.equals(registerModeService.getRegisterMode())) {
|
||||||
if (user.get().getRegisterReason() != null && !user.get().getRegisterReason().isEmpty()) {
|
return ResponseEntity.ok(Map.of("token", jwtService.generateToken(result.getUser().getUsername())));
|
||||||
|
}
|
||||||
|
if (!result.getUser().isApproved()) {
|
||||||
|
if (result.getUser().getRegisterReason() != null && !result.getUser().getRegisterReason().isEmpty()) {
|
||||||
return ResponseEntity.badRequest().body(Map.of(
|
return ResponseEntity.badRequest().body(Map.of(
|
||||||
"error", "Account awaiting approval",
|
"error", "Account awaiting approval",
|
||||||
"reason_code", "IS_APPROVING",
|
"reason_code", "IS_APPROVING",
|
||||||
"token", jwtService.generateReasonToken(user.get().getUsername())
|
"token", jwtService.generateReasonToken(result.getUser().getUsername())
|
||||||
));
|
));
|
||||||
}
|
}
|
||||||
return ResponseEntity.badRequest().body(Map.of(
|
return ResponseEntity.badRequest().body(Map.of(
|
||||||
"error", "Account awaiting approval",
|
"error", "Account awaiting approval",
|
||||||
"reason_code", "NOT_APPROVED",
|
"reason_code", "NOT_APPROVED",
|
||||||
"token", jwtService.generateReasonToken(user.get().getUsername())
|
"token", jwtService.generateReasonToken(result.getUser().getUsername())
|
||||||
));
|
));
|
||||||
}
|
}
|
||||||
|
|
||||||
return ResponseEntity.ok(Map.of("token", jwtService.generateToken(user.get().getUsername())));
|
return ResponseEntity.ok(Map.of("token", jwtService.generateToken(result.getUser().getUsername())));
|
||||||
}
|
}
|
||||||
return ResponseEntity.badRequest().body(Map.of(
|
return ResponseEntity.badRequest().body(Map.of(
|
||||||
"error", "Invalid discord code",
|
"error", "Invalid discord code",
|
||||||
@@ -226,31 +314,45 @@ public class AuthController {
|
|||||||
|
|
||||||
@PostMapping("/twitter")
|
@PostMapping("/twitter")
|
||||||
public ResponseEntity<?> loginWithTwitter(@RequestBody TwitterLoginRequest req) {
|
public ResponseEntity<?> loginWithTwitter(@RequestBody TwitterLoginRequest req) {
|
||||||
Optional<User> user = twitterAuthService.authenticate(
|
boolean viaInvite = req.getInviteToken() != null && !req.getInviteToken().isEmpty();
|
||||||
|
InviteService.InviteValidateResult inviteValidateResult = inviteService.validate(req.getInviteToken());
|
||||||
|
if (viaInvite && !inviteValidateResult.isValidate()) {
|
||||||
|
return ResponseEntity.badRequest().body(Map.of("error", "Invalid invite token"));
|
||||||
|
}
|
||||||
|
Optional<AuthResult> resultOpt = twitterAuthService.authenticate(
|
||||||
req.getCode(),
|
req.getCode(),
|
||||||
req.getCodeVerifier(),
|
req.getCodeVerifier(),
|
||||||
registerModeService.getRegisterMode(),
|
registerModeService.getRegisterMode(),
|
||||||
req.getRedirectUri());
|
req.getRedirectUri(),
|
||||||
if (user.isPresent()) {
|
viaInvite);
|
||||||
if (RegisterMode.DIRECT.equals(registerModeService.getRegisterMode())) {
|
if (resultOpt.isPresent()) {
|
||||||
return ResponseEntity.ok(Map.of("token", jwtService.generateToken(user.get().getUsername())));
|
AuthResult result = resultOpt.get();
|
||||||
|
if (viaInvite && result.isNewUser()) {
|
||||||
|
inviteService.consume(req.getInviteToken(), inviteValidateResult.getInviteToken().getInviter().getUsername());
|
||||||
|
return ResponseEntity.ok(Map.of(
|
||||||
|
"token", jwtService.generateToken(result.getUser().getUsername()),
|
||||||
|
"reason_code", "INVITE_APPROVED"
|
||||||
|
));
|
||||||
}
|
}
|
||||||
if (!user.get().isApproved()) {
|
if (RegisterMode.DIRECT.equals(registerModeService.getRegisterMode())) {
|
||||||
if (user.get().getRegisterReason() != null && !user.get().getRegisterReason().isEmpty()) {
|
return ResponseEntity.ok(Map.of("token", jwtService.generateToken(result.getUser().getUsername())));
|
||||||
|
}
|
||||||
|
if (!result.getUser().isApproved()) {
|
||||||
|
if (result.getUser().getRegisterReason() != null && !result.getUser().getRegisterReason().isEmpty()) {
|
||||||
return ResponseEntity.badRequest().body(Map.of(
|
return ResponseEntity.badRequest().body(Map.of(
|
||||||
"error", "Account awaiting approval",
|
"error", "Account awaiting approval",
|
||||||
"reason_code", "IS_APPROVING",
|
"reason_code", "IS_APPROVING",
|
||||||
"token", jwtService.generateReasonToken(user.get().getUsername())
|
"token", jwtService.generateReasonToken(result.getUser().getUsername())
|
||||||
));
|
));
|
||||||
}
|
}
|
||||||
return ResponseEntity.badRequest().body(Map.of(
|
return ResponseEntity.badRequest().body(Map.of(
|
||||||
"error", "Account awaiting approval",
|
"error", "Account awaiting approval",
|
||||||
"reason_code", "NOT_APPROVED",
|
"reason_code", "NOT_APPROVED",
|
||||||
"token", jwtService.generateReasonToken(user.get().getUsername())
|
"token", jwtService.generateReasonToken(result.getUser().getUsername())
|
||||||
));
|
));
|
||||||
}
|
}
|
||||||
|
|
||||||
return ResponseEntity.ok(Map.of("token", jwtService.generateToken(user.get().getUsername())));
|
return ResponseEntity.ok(Map.of("token", jwtService.generateToken(result.getUser().getUsername())));
|
||||||
}
|
}
|
||||||
return ResponseEntity.badRequest().body(Map.of(
|
return ResponseEntity.badRequest().body(Map.of(
|
||||||
"error", "Invalid twitter code",
|
"error", "Invalid twitter code",
|
||||||
|
|||||||
@@ -47,7 +47,7 @@ public class CommentController {
|
|||||||
Comment comment = commentService.addComment(auth.getName(), postId, req.getContent());
|
Comment comment = commentService.addComment(auth.getName(), postId, req.getContent());
|
||||||
CommentDto dto = commentMapper.toDto(comment);
|
CommentDto dto = commentMapper.toDto(comment);
|
||||||
dto.setReward(levelService.awardForComment(auth.getName()));
|
dto.setReward(levelService.awardForComment(auth.getName()));
|
||||||
dto.setPointReward(pointService.awardForComment(auth.getName(),postId));
|
dto.setPointReward(pointService.awardForComment(auth.getName(), postId, comment.getId()));
|
||||||
log.debug("createComment succeeded for comment {}", comment.getId());
|
log.debug("createComment succeeded for comment {}", comment.getId());
|
||||||
return ResponseEntity.ok(dto);
|
return ResponseEntity.ok(dto);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,23 @@
|
|||||||
|
package com.openisle.controller;
|
||||||
|
|
||||||
|
import com.openisle.service.InviteService;
|
||||||
|
import lombok.RequiredArgsConstructor;
|
||||||
|
import org.springframework.security.core.Authentication;
|
||||||
|
import org.springframework.web.bind.annotation.PostMapping;
|
||||||
|
import org.springframework.web.bind.annotation.RequestMapping;
|
||||||
|
import org.springframework.web.bind.annotation.RestController;
|
||||||
|
|
||||||
|
import java.util.Map;
|
||||||
|
|
||||||
|
@RestController
|
||||||
|
@RequestMapping("/api/invite")
|
||||||
|
@RequiredArgsConstructor
|
||||||
|
public class InviteController {
|
||||||
|
private final InviteService inviteService;
|
||||||
|
|
||||||
|
@PostMapping("/generate")
|
||||||
|
public Map<String, String> generate(Authentication auth) {
|
||||||
|
String token = inviteService.generate(auth.getName());
|
||||||
|
return Map.of("token", token);
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -23,9 +23,19 @@ public class NotificationController {
|
|||||||
private final NotificationMapper notificationMapper;
|
private final NotificationMapper notificationMapper;
|
||||||
|
|
||||||
@GetMapping
|
@GetMapping
|
||||||
public List<NotificationDto> list(@RequestParam(value = "read", required = false) Boolean read,
|
public List<NotificationDto> list(@RequestParam(value = "page", defaultValue = "0") int page,
|
||||||
|
@RequestParam(value = "size", defaultValue = "30") int size,
|
||||||
Authentication auth) {
|
Authentication auth) {
|
||||||
return notificationService.listNotifications(auth.getName(), read).stream()
|
return notificationService.listNotifications(auth.getName(), null, page, size).stream()
|
||||||
|
.map(notificationMapper::toDto)
|
||||||
|
.collect(Collectors.toList());
|
||||||
|
}
|
||||||
|
|
||||||
|
@GetMapping("/unread")
|
||||||
|
public List<NotificationDto> listUnread(@RequestParam(value = "page", defaultValue = "0") int page,
|
||||||
|
@RequestParam(value = "size", defaultValue = "30") int size,
|
||||||
|
Authentication auth) {
|
||||||
|
return notificationService.listNotifications(auth.getName(), false, page, size).stream()
|
||||||
.map(notificationMapper::toDto)
|
.map(notificationMapper::toDto)
|
||||||
.collect(Collectors.toList());
|
.collect(Collectors.toList());
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,28 @@
|
|||||||
|
package com.openisle.controller;
|
||||||
|
|
||||||
|
import com.openisle.dto.PointHistoryDto;
|
||||||
|
import com.openisle.mapper.PointHistoryMapper;
|
||||||
|
import com.openisle.service.PointService;
|
||||||
|
import lombok.RequiredArgsConstructor;
|
||||||
|
import org.springframework.security.core.Authentication;
|
||||||
|
import org.springframework.web.bind.annotation.GetMapping;
|
||||||
|
import org.springframework.web.bind.annotation.RequestMapping;
|
||||||
|
import org.springframework.web.bind.annotation.RestController;
|
||||||
|
|
||||||
|
import java.util.List;
|
||||||
|
import java.util.stream.Collectors;
|
||||||
|
|
||||||
|
@RestController
|
||||||
|
@RequestMapping("/api/point-histories")
|
||||||
|
@RequiredArgsConstructor
|
||||||
|
public class PointHistoryController {
|
||||||
|
private final PointService pointService;
|
||||||
|
private final PointHistoryMapper pointHistoryMapper;
|
||||||
|
|
||||||
|
@GetMapping
|
||||||
|
public List<PointHistoryDto> list(Authentication auth) {
|
||||||
|
return pointService.listHistory(auth.getName()).stream()
|
||||||
|
.map(pointHistoryMapper::toDto)
|
||||||
|
.collect(Collectors.toList());
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,39 @@
|
|||||||
|
package com.openisle.controller;
|
||||||
|
|
||||||
|
import com.openisle.dto.PointGoodDto;
|
||||||
|
import com.openisle.dto.PointRedeemRequest;
|
||||||
|
import com.openisle.mapper.PointGoodMapper;
|
||||||
|
import com.openisle.model.User;
|
||||||
|
import com.openisle.service.PointMallService;
|
||||||
|
import com.openisle.service.UserService;
|
||||||
|
import lombok.RequiredArgsConstructor;
|
||||||
|
import org.springframework.security.core.Authentication;
|
||||||
|
import org.springframework.web.bind.annotation.*;
|
||||||
|
|
||||||
|
import java.util.List;
|
||||||
|
import java.util.Map;
|
||||||
|
import java.util.stream.Collectors;
|
||||||
|
|
||||||
|
/** REST controller for point mall. */
|
||||||
|
@RestController
|
||||||
|
@RequestMapping("/api/point-goods")
|
||||||
|
@RequiredArgsConstructor
|
||||||
|
public class PointMallController {
|
||||||
|
private final PointMallService pointMallService;
|
||||||
|
private final UserService userService;
|
||||||
|
private final PointGoodMapper pointGoodMapper;
|
||||||
|
|
||||||
|
@GetMapping
|
||||||
|
public List<PointGoodDto> list() {
|
||||||
|
return pointMallService.listGoods().stream()
|
||||||
|
.map(pointGoodMapper::toDto)
|
||||||
|
.collect(Collectors.toList());
|
||||||
|
}
|
||||||
|
|
||||||
|
@PostMapping("/redeem")
|
||||||
|
public Map<String, Integer> redeem(@RequestBody PointRedeemRequest req, Authentication auth) {
|
||||||
|
User user = userService.findByIdentifier(auth.getName()).orElseThrow();
|
||||||
|
int point = pointMallService.redeem(user, req.getGoodId(), req.getContact());
|
||||||
|
return Map.of("point", point);
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -45,7 +45,7 @@ public class PostController {
|
|||||||
draftService.deleteDraft(auth.getName());
|
draftService.deleteDraft(auth.getName());
|
||||||
PostDetailDto dto = postMapper.toDetailDto(post, auth.getName());
|
PostDetailDto dto = postMapper.toDetailDto(post, auth.getName());
|
||||||
dto.setReward(levelService.awardForPost(auth.getName()));
|
dto.setReward(levelService.awardForPost(auth.getName()));
|
||||||
dto.setPointReward(pointService.awardForPost(auth.getName()));
|
dto.setPointReward(pointService.awardForPost(auth.getName(), post.getId()));
|
||||||
return ResponseEntity.ok(dto);
|
return ResponseEntity.ok(dto);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -62,6 +62,16 @@ public class PostController {
|
|||||||
postService.deletePost(id, auth.getName());
|
postService.deletePost(id, auth.getName());
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@PostMapping("/{id}/close")
|
||||||
|
public PostSummaryDto close(@PathVariable Long id, Authentication auth) {
|
||||||
|
return postMapper.toSummaryDto(postService.closePost(id, auth.getName()));
|
||||||
|
}
|
||||||
|
|
||||||
|
@PostMapping("/{id}/reopen")
|
||||||
|
public PostSummaryDto reopen(@PathVariable Long id, Authentication auth) {
|
||||||
|
return postMapper.toSummaryDto(postService.reopenPost(id, auth.getName()));
|
||||||
|
}
|
||||||
|
|
||||||
@GetMapping("/{id}")
|
@GetMapping("/{id}")
|
||||||
public ResponseEntity<PostDetailDto> getPost(@PathVariable Long id, Authentication auth) {
|
public ResponseEntity<PostDetailDto> getPost(@PathVariable Long id, Authentication auth) {
|
||||||
String viewer = auth != null ? auth.getName() : null;
|
String viewer = auth != null ? auth.getName() : null;
|
||||||
|
|||||||
304
backend/src/main/java/com/openisle/controller/RssController.java
Normal file
304
backend/src/main/java/com/openisle/controller/RssController.java
Normal file
@@ -0,0 +1,304 @@
|
|||||||
|
package com.openisle.controller;
|
||||||
|
|
||||||
|
import com.openisle.model.Post;
|
||||||
|
import com.openisle.model.Comment;
|
||||||
|
import com.openisle.model.CommentSort;
|
||||||
|
import com.openisle.service.PostService;
|
||||||
|
import com.openisle.service.CommentService;
|
||||||
|
import lombok.RequiredArgsConstructor;
|
||||||
|
import org.jsoup.Jsoup;
|
||||||
|
import org.jsoup.nodes.Document;
|
||||||
|
import org.jsoup.nodes.Element;
|
||||||
|
import org.jsoup.safety.Safelist;
|
||||||
|
import org.springframework.beans.factory.annotation.Value;
|
||||||
|
import org.springframework.web.bind.annotation.GetMapping;
|
||||||
|
import org.springframework.web.bind.annotation.RestController;
|
||||||
|
|
||||||
|
import com.vladsch.flexmark.ext.autolink.AutolinkExtension;
|
||||||
|
import com.vladsch.flexmark.ext.tables.TablesExtension;
|
||||||
|
import com.vladsch.flexmark.ext.gfm.strikethrough.StrikethroughExtension;
|
||||||
|
import com.vladsch.flexmark.ext.gfm.tasklist.TaskListExtension;
|
||||||
|
import com.vladsch.flexmark.html.HtmlRenderer;
|
||||||
|
import com.vladsch.flexmark.parser.Parser;
|
||||||
|
import com.vladsch.flexmark.util.data.MutableDataSet;
|
||||||
|
|
||||||
|
import java.net.URI;
|
||||||
|
import java.time.ZoneId;
|
||||||
|
import java.time.ZonedDateTime;
|
||||||
|
import java.time.format.DateTimeFormatter;
|
||||||
|
import java.util.*;
|
||||||
|
import java.util.regex.Matcher;
|
||||||
|
import java.util.regex.Pattern;
|
||||||
|
|
||||||
|
@RestController
|
||||||
|
@RequiredArgsConstructor
|
||||||
|
public class RssController {
|
||||||
|
private final PostService postService;
|
||||||
|
private final CommentService commentService;
|
||||||
|
|
||||||
|
@Value("${app.website-url:https://www.open-isle.com}")
|
||||||
|
private String websiteUrl;
|
||||||
|
|
||||||
|
// 兼容 Markdown/HTML 两类图片写法(用于 enclosure)
|
||||||
|
private static final Pattern MD_IMAGE = Pattern.compile("!\\[[^\\]]*\\]\\(([^)]+)\\)");
|
||||||
|
private static final Pattern HTML_IMAGE = Pattern.compile("<img[^>]+src=[\"']?([^\"'>]+)[\"']?[^>]*>");
|
||||||
|
|
||||||
|
private static final DateTimeFormatter RFC1123 = DateTimeFormatter.RFC_1123_DATE_TIME;
|
||||||
|
|
||||||
|
// flexmark:Markdown -> HTML
|
||||||
|
private static final Parser MD_PARSER;
|
||||||
|
private static final HtmlRenderer MD_RENDERER;
|
||||||
|
static {
|
||||||
|
MutableDataSet opts = new MutableDataSet();
|
||||||
|
opts.set(Parser.EXTENSIONS, Arrays.asList(
|
||||||
|
TablesExtension.create(),
|
||||||
|
AutolinkExtension.create(),
|
||||||
|
StrikethroughExtension.create(),
|
||||||
|
TaskListExtension.create()
|
||||||
|
));
|
||||||
|
// 允许内联 HTML(下游再做 sanitize)
|
||||||
|
opts.set(Parser.HTML_BLOCK_PARSER, true);
|
||||||
|
MD_PARSER = Parser.builder(opts).build();
|
||||||
|
MD_RENDERER = HtmlRenderer.builder(opts).escapeHtml(false).build();
|
||||||
|
}
|
||||||
|
|
||||||
|
@GetMapping(value = "/api/rss", produces = "application/rss+xml;charset=UTF-8")
|
||||||
|
public String feed() {
|
||||||
|
// 建议 20;你现在是 10,这里保留你的 10
|
||||||
|
List<Post> posts = postService.listLatestRssPosts(10);
|
||||||
|
String base = trimTrailingSlash(websiteUrl);
|
||||||
|
|
||||||
|
StringBuilder sb = new StringBuilder(4096);
|
||||||
|
sb.append("<?xml version=\"1.0\" encoding=\"UTF-8\"?>");
|
||||||
|
sb.append("<rss version=\"2.0\" xmlns:content=\"http://purl.org/rss/1.0/modules/content/\">");
|
||||||
|
sb.append("<channel>");
|
||||||
|
elem(sb, "title", cdata("OpenIsle RSS"));
|
||||||
|
elem(sb, "link", base + "/");
|
||||||
|
elem(sb, "description", cdata("Latest posts"));
|
||||||
|
ZonedDateTime updated = posts.stream()
|
||||||
|
.map(p -> p.getCreatedAt().atZone(ZoneId.systemDefault()))
|
||||||
|
.max(Comparator.naturalOrder())
|
||||||
|
.orElse(ZonedDateTime.now());
|
||||||
|
// channel lastBuildDate(GMT)
|
||||||
|
elem(sb, "lastBuildDate", toRfc1123Gmt(updated));
|
||||||
|
|
||||||
|
for (Post p : posts) {
|
||||||
|
String link = base + "/posts/" + p.getId();
|
||||||
|
|
||||||
|
// 1) Markdown -> HTML
|
||||||
|
String html = renderMarkdown(p.getContent());
|
||||||
|
|
||||||
|
// 2) Sanitize(白名单增强)
|
||||||
|
String safeHtml = sanitizeHtml(html);
|
||||||
|
|
||||||
|
// 3) 绝对化 href/src + 强制 rel/target
|
||||||
|
String absHtml = absolutifyHtml(safeHtml, base);
|
||||||
|
|
||||||
|
// 4) 纯文本摘要(用于 <description>)
|
||||||
|
String plain = textSummary(absHtml, 180);
|
||||||
|
|
||||||
|
// 5) enclosure(首图,已绝对化)
|
||||||
|
String enclosure = firstImage(p.getContent());
|
||||||
|
if (enclosure == null) {
|
||||||
|
// 如果 Markdown 没有图,尝试从渲染后的 HTML 再抓一次
|
||||||
|
enclosure = firstImage(absHtml);
|
||||||
|
}
|
||||||
|
if (enclosure != null) {
|
||||||
|
enclosure = absolutifyUrl(enclosure, base);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Top comments in Markdown
|
||||||
|
List<Comment> topComments = commentService
|
||||||
|
.getCommentsForPost(p.getId(), CommentSort.MOST_INTERACTIONS);
|
||||||
|
topComments = topComments.subList(0, Math.min(10, topComments.size()));
|
||||||
|
StringBuilder commentMd = new StringBuilder();
|
||||||
|
for (Comment c : topComments) {
|
||||||
|
commentMd.append("> @")
|
||||||
|
.append(nullSafe(c.getAuthor().getUsername()))
|
||||||
|
.append(": ")
|
||||||
|
.append(nullSafe(c.getContent()).replace("\r", ""))
|
||||||
|
.append("\n\n");
|
||||||
|
}
|
||||||
|
|
||||||
|
sb.append("<item>");
|
||||||
|
elem(sb, "title", cdata(nullSafe(p.getTitle())));
|
||||||
|
elem(sb, "link", link);
|
||||||
|
sb.append("<guid isPermaLink=\"true\">").append(link).append("</guid>");
|
||||||
|
elem(sb, "pubDate", toRfc1123Gmt(p.getCreatedAt().atZone(ZoneId.systemDefault())));
|
||||||
|
// 摘要
|
||||||
|
elem(sb, "description", cdata(plain));
|
||||||
|
// 全文(HTML)
|
||||||
|
sb.append("<content:encoded><![CDATA[").append(absHtml).append("]]></content:encoded>");
|
||||||
|
// 首图 enclosure(图片类型)
|
||||||
|
if (enclosure != null) {
|
||||||
|
sb.append("<enclosure url=\"").append(escapeXml(enclosure)).append("\" type=\"")
|
||||||
|
.append(getMimeType(enclosure)).append("\" />");
|
||||||
|
}
|
||||||
|
// Markdown comments
|
||||||
|
elem(sb, "commentsMarkdown", cdata(commentMd.toString()));
|
||||||
|
// Markdown original link
|
||||||
|
elem(sb, "originalLinkMarkdown", cdata("[原文链接](" + link + ")"));
|
||||||
|
|
||||||
|
sb.append("</item>");
|
||||||
|
}
|
||||||
|
|
||||||
|
sb.append("</channel></rss>");
|
||||||
|
return sb.toString();
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ===================== Markdown → HTML ===================== */
|
||||||
|
|
||||||
|
private static String renderMarkdown(String md) {
|
||||||
|
if (md == null || md.isEmpty()) return "";
|
||||||
|
return MD_RENDERER.render(MD_PARSER.parse(md));
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ===================== Sanitize & 绝对化 ===================== */
|
||||||
|
|
||||||
|
private static String sanitizeHtml(String html) {
|
||||||
|
if (html == null) return "";
|
||||||
|
Safelist wl = Safelist.relaxed()
|
||||||
|
.addTags("pre", "code", "figure", "figcaption", "picture", "source",
|
||||||
|
"table","thead","tbody","tr","th","td","h1","h2","h3","h4","h5","h6")
|
||||||
|
.addAttributes("a", "href", "title", "target", "rel")
|
||||||
|
.addAttributes("img", "src", "alt", "title", "width", "height")
|
||||||
|
.addAttributes("source", "srcset", "type", "media")
|
||||||
|
.addAttributes("code", "class")
|
||||||
|
.addAttributes("pre", "class")
|
||||||
|
.addProtocols("a", "href", "http", "https", "mailto")
|
||||||
|
.addProtocols("img", "src", "http", "https", "data")
|
||||||
|
.addProtocols("source", "srcset", "http", "https");
|
||||||
|
// 清除所有 on* 事件、style(避免阅读器环境差异)
|
||||||
|
return Jsoup.clean(html, wl);
|
||||||
|
}
|
||||||
|
|
||||||
|
private static String absolutifyHtml(String html, String baseUrl) {
|
||||||
|
if (html == null || html.isEmpty()) return "";
|
||||||
|
Document doc = Jsoup.parseBodyFragment(html, baseUrl);
|
||||||
|
// a[href]
|
||||||
|
for (Element a : doc.select("a[href]")) {
|
||||||
|
String href = a.attr("href");
|
||||||
|
String abs = absolutifyUrl(href, baseUrl);
|
||||||
|
a.attr("href", abs);
|
||||||
|
// 强制外链安全属性
|
||||||
|
a.attr("rel", "noopener noreferrer nofollow");
|
||||||
|
a.attr("target", "_blank");
|
||||||
|
}
|
||||||
|
// img[src]
|
||||||
|
for (Element img : doc.select("img[src]")) {
|
||||||
|
String src = img.attr("src");
|
||||||
|
String abs = absolutifyUrl(src, baseUrl);
|
||||||
|
img.attr("src", abs);
|
||||||
|
}
|
||||||
|
// source[srcset] (picture/webp)
|
||||||
|
for (Element s : doc.select("source[srcset]")) {
|
||||||
|
String srcset = s.attr("srcset");
|
||||||
|
s.attr("srcset", absolutifySrcset(srcset, baseUrl));
|
||||||
|
}
|
||||||
|
return doc.body().html();
|
||||||
|
}
|
||||||
|
|
||||||
|
private static String absolutifyUrl(String url, String baseUrl) {
|
||||||
|
if (url == null || url.isEmpty()) return url;
|
||||||
|
String u = url.trim();
|
||||||
|
if (u.startsWith("//")) {
|
||||||
|
return "https:" + u;
|
||||||
|
}
|
||||||
|
if (u.startsWith("#")) {
|
||||||
|
// 保留页面内锚点:拼接到首页(也可拼接到当前帖子的 link,但此处无上下文)
|
||||||
|
return baseUrl + "/" + u;
|
||||||
|
}
|
||||||
|
try {
|
||||||
|
URI base = URI.create(ensureTrailingSlash(baseUrl));
|
||||||
|
URI abs = base.resolve(u);
|
||||||
|
return abs.toString();
|
||||||
|
} catch (Exception e) {
|
||||||
|
return url;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private static String absolutifySrcset(String srcset, String baseUrl) {
|
||||||
|
if (srcset == null || srcset.isEmpty()) return srcset;
|
||||||
|
String[] parts = srcset.split(",");
|
||||||
|
List<String> out = new ArrayList<>(parts.length);
|
||||||
|
for (String part : parts) {
|
||||||
|
String p = part.trim();
|
||||||
|
if (p.isEmpty()) continue;
|
||||||
|
String[] seg = p.split("\\s+");
|
||||||
|
String url = seg[0];
|
||||||
|
String size = seg.length > 1 ? seg[1] : "";
|
||||||
|
out.add(absolutifyUrl(url, baseUrl) + (size.isEmpty() ? "" : " " + size));
|
||||||
|
}
|
||||||
|
return String.join(", ", out);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ===================== 摘要 & enclosure ===================== */
|
||||||
|
|
||||||
|
private static String textSummary(String html, int maxLen) {
|
||||||
|
if (html == null) return "";
|
||||||
|
String text = Jsoup.parse(html).text().replaceAll("\\s+", " ").trim();
|
||||||
|
if (text.length() <= maxLen) return text;
|
||||||
|
return text.substring(0, maxLen) + "…";
|
||||||
|
}
|
||||||
|
|
||||||
|
private String firstImage(String content) {
|
||||||
|
if (content == null) return null;
|
||||||
|
Matcher m = MD_IMAGE.matcher(content);
|
||||||
|
if (m.find()) return m.group(1);
|
||||||
|
m = HTML_IMAGE.matcher(content);
|
||||||
|
if (m.find()) return m.group(1);
|
||||||
|
// 再从纯 HTML 里解析一次(如果传入的是渲染后的)
|
||||||
|
try {
|
||||||
|
Document doc = Jsoup.parse(content);
|
||||||
|
Element img = doc.selectFirst("img[src]");
|
||||||
|
if (img != null) return img.attr("src");
|
||||||
|
} catch (Exception ignored) {}
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
private static String getMimeType(String url) {
|
||||||
|
String lower = url == null ? "" : url.toLowerCase(Locale.ROOT);
|
||||||
|
if (lower.endsWith(".png")) return "image/png";
|
||||||
|
if (lower.endsWith(".gif")) return "image/gif";
|
||||||
|
if (lower.endsWith(".webp")) return "image/webp";
|
||||||
|
if (lower.endsWith(".svg")) return "image/svg+xml";
|
||||||
|
if (lower.endsWith(".avif")) return "image/avif";
|
||||||
|
if (lower.endsWith(".jpg") || lower.endsWith(".jpeg")) return "image/jpeg";
|
||||||
|
// 默认兜底
|
||||||
|
return "image/jpeg";
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ===================== 时间/字符串/XML ===================== */
|
||||||
|
|
||||||
|
private static String toRfc1123Gmt(ZonedDateTime zdt) {
|
||||||
|
return zdt.withZoneSameInstant(ZoneId.of("GMT")).format(RFC1123);
|
||||||
|
}
|
||||||
|
|
||||||
|
private static String cdata(String s) {
|
||||||
|
if (s == null) return "<![CDATA[]]>";
|
||||||
|
// 防止出现 "]]>" 终止标记破坏 CDATA
|
||||||
|
return "<![CDATA[" + s.replace("]]>", "]]]]><![CDATA[>") + "]]>";
|
||||||
|
}
|
||||||
|
|
||||||
|
private static void elem(StringBuilder sb, String name, String value) {
|
||||||
|
sb.append('<').append(name).append('>').append(value).append("</").append(name).append('>');
|
||||||
|
}
|
||||||
|
|
||||||
|
private static String escapeXml(String s) {
|
||||||
|
if (s == null) return "";
|
||||||
|
return s.replace("&", "&").replace("<", "<").replace(">", ">")
|
||||||
|
.replace("\"", """).replace("'", "'");
|
||||||
|
}
|
||||||
|
|
||||||
|
private static String trimTrailingSlash(String s) {
|
||||||
|
if (s == null) return "";
|
||||||
|
return s.endsWith("/") ? s.substring(0, s.length() - 1) : s;
|
||||||
|
}
|
||||||
|
|
||||||
|
private static String ensureTrailingSlash(String s) {
|
||||||
|
if (s == null || s.isEmpty()) return "/";
|
||||||
|
return s.endsWith("/") ? s : s + "/";
|
||||||
|
}
|
||||||
|
|
||||||
|
private static String nullSafe(String s) { return s == null ? "" : s; }
|
||||||
|
}
|
||||||
@@ -7,4 +7,5 @@ import lombok.Data;
|
|||||||
public class DiscordLoginRequest {
|
public class DiscordLoginRequest {
|
||||||
private String code;
|
private String code;
|
||||||
private String redirectUri;
|
private String redirectUri;
|
||||||
|
private String inviteToken;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,4 +7,5 @@ import lombok.Data;
|
|||||||
public class GithubLoginRequest {
|
public class GithubLoginRequest {
|
||||||
private String code;
|
private String code;
|
||||||
private String redirectUri;
|
private String redirectUri;
|
||||||
|
private String inviteToken;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -6,4 +6,5 @@ import lombok.Data;
|
|||||||
@Data
|
@Data
|
||||||
public class GoogleLoginRequest {
|
public class GoogleLoginRequest {
|
||||||
private String idToken;
|
private String idToken;
|
||||||
|
private String inviteToken;
|
||||||
}
|
}
|
||||||
|
|||||||
12
backend/src/main/java/com/openisle/dto/PointGoodDto.java
Normal file
12
backend/src/main/java/com/openisle/dto/PointGoodDto.java
Normal file
@@ -0,0 +1,12 @@
|
|||||||
|
package com.openisle.dto;
|
||||||
|
|
||||||
|
import lombok.Data;
|
||||||
|
|
||||||
|
/** Point mall good info. */
|
||||||
|
@Data
|
||||||
|
public class PointGoodDto {
|
||||||
|
private Long id;
|
||||||
|
private String name;
|
||||||
|
private int cost;
|
||||||
|
private String image;
|
||||||
|
}
|
||||||
23
backend/src/main/java/com/openisle/dto/PointHistoryDto.java
Normal file
23
backend/src/main/java/com/openisle/dto/PointHistoryDto.java
Normal file
@@ -0,0 +1,23 @@
|
|||||||
|
package com.openisle.dto;
|
||||||
|
|
||||||
|
import com.openisle.model.PointHistoryType;
|
||||||
|
import lombok.Getter;
|
||||||
|
import lombok.Setter;
|
||||||
|
|
||||||
|
import java.time.LocalDateTime;
|
||||||
|
|
||||||
|
@Getter
|
||||||
|
@Setter
|
||||||
|
public class PointHistoryDto {
|
||||||
|
private Long id;
|
||||||
|
private PointHistoryType type;
|
||||||
|
private int amount;
|
||||||
|
private int balance;
|
||||||
|
private Long postId;
|
||||||
|
private String postTitle;
|
||||||
|
private Long commentId;
|
||||||
|
private String commentContent;
|
||||||
|
private Long fromUserId;
|
||||||
|
private String fromUserName;
|
||||||
|
private LocalDateTime createdAt;
|
||||||
|
}
|
||||||
@@ -0,0 +1,10 @@
|
|||||||
|
package com.openisle.dto;
|
||||||
|
|
||||||
|
import lombok.Data;
|
||||||
|
|
||||||
|
/** Request to redeem a point mall good. */
|
||||||
|
@Data
|
||||||
|
public class PointRedeemRequest {
|
||||||
|
private Long goodId;
|
||||||
|
private String contact;
|
||||||
|
}
|
||||||
@@ -31,5 +31,7 @@ public class PostSummaryDto {
|
|||||||
private int pointReward;
|
private int pointReward;
|
||||||
private PostType type;
|
private PostType type;
|
||||||
private LotteryDto lottery;
|
private LotteryDto lottery;
|
||||||
|
private boolean rssExcluded;
|
||||||
|
private boolean closed;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -9,4 +9,5 @@ public class RegisterRequest {
|
|||||||
private String email;
|
private String email;
|
||||||
private String password;
|
private String password;
|
||||||
private String captcha;
|
private String captcha;
|
||||||
|
private String inviteToken;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -8,4 +8,5 @@ public class TwitterLoginRequest {
|
|||||||
private String code;
|
private String code;
|
||||||
private String redirectUri;
|
private String redirectUri;
|
||||||
private String codeVerifier;
|
private String codeVerifier;
|
||||||
|
private String inviteToken;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,18 @@
|
|||||||
|
package com.openisle.mapper;
|
||||||
|
|
||||||
|
import com.openisle.dto.PointGoodDto;
|
||||||
|
import com.openisle.model.PointGood;
|
||||||
|
import org.springframework.stereotype.Component;
|
||||||
|
|
||||||
|
/** Mapper for point mall goods. */
|
||||||
|
@Component
|
||||||
|
public class PointGoodMapper {
|
||||||
|
public PointGoodDto toDto(PointGood good) {
|
||||||
|
PointGoodDto dto = new PointGoodDto();
|
||||||
|
dto.setId(good.getId());
|
||||||
|
dto.setName(good.getName());
|
||||||
|
dto.setCost(good.getCost());
|
||||||
|
dto.setImage(good.getImage());
|
||||||
|
return dto;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,34 @@
|
|||||||
|
package com.openisle.mapper;
|
||||||
|
|
||||||
|
import com.openisle.dto.PointHistoryDto;
|
||||||
|
import com.openisle.model.PointHistory;
|
||||||
|
import org.springframework.stereotype.Component;
|
||||||
|
|
||||||
|
@Component
|
||||||
|
public class PointHistoryMapper {
|
||||||
|
public PointHistoryDto toDto(PointHistory history) {
|
||||||
|
PointHistoryDto dto = new PointHistoryDto();
|
||||||
|
dto.setId(history.getId());
|
||||||
|
dto.setType(history.getType());
|
||||||
|
dto.setAmount(history.getAmount());
|
||||||
|
dto.setBalance(history.getBalance());
|
||||||
|
dto.setCreatedAt(history.getCreatedAt());
|
||||||
|
if (history.getPost() != null) {
|
||||||
|
dto.setPostId(history.getPost().getId());
|
||||||
|
dto.setPostTitle(history.getPost().getTitle());
|
||||||
|
}
|
||||||
|
if (history.getComment() != null) {
|
||||||
|
dto.setCommentId(history.getComment().getId());
|
||||||
|
dto.setCommentContent(history.getComment().getContent());
|
||||||
|
if (history.getComment().getPost() != null && dto.getPostId() == null) {
|
||||||
|
dto.setPostId(history.getComment().getPost().getId());
|
||||||
|
dto.setPostTitle(history.getComment().getPost().getTitle());
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (history.getFromUser() != null) {
|
||||||
|
dto.setFromUserId(history.getFromUser().getId());
|
||||||
|
dto.setFromUserName(history.getFromUser().getUsername());
|
||||||
|
}
|
||||||
|
return dto;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -63,6 +63,8 @@ public class PostMapper {
|
|||||||
dto.setCommentCount(commentService.countComments(post.getId()));
|
dto.setCommentCount(commentService.countComments(post.getId()));
|
||||||
dto.setStatus(post.getStatus());
|
dto.setStatus(post.getStatus());
|
||||||
dto.setPinnedAt(post.getPinnedAt());
|
dto.setPinnedAt(post.getPinnedAt());
|
||||||
|
dto.setRssExcluded(post.getRssExcluded() == null || post.getRssExcluded());
|
||||||
|
dto.setClosed(post.isClosed());
|
||||||
|
|
||||||
List<ReactionDto> reactions = reactionService.getReactionsForPost(post.getId())
|
List<ReactionDto> reactions = reactionService.getReactionsForPost(post.getId())
|
||||||
.stream()
|
.stream()
|
||||||
|
|||||||
@@ -3,5 +3,6 @@ package com.openisle.model;
|
|||||||
/** Activity type enumeration. */
|
/** Activity type enumeration. */
|
||||||
public enum ActivityType {
|
public enum ActivityType {
|
||||||
NORMAL,
|
NORMAL,
|
||||||
MILK_TEA
|
MILK_TEA,
|
||||||
|
INVITE_POINTS
|
||||||
}
|
}
|
||||||
|
|||||||
23
backend/src/main/java/com/openisle/model/InviteToken.java
Normal file
23
backend/src/main/java/com/openisle/model/InviteToken.java
Normal file
@@ -0,0 +1,23 @@
|
|||||||
|
package com.openisle.model;
|
||||||
|
|
||||||
|
import jakarta.persistence.*;
|
||||||
|
import lombok.Data;
|
||||||
|
|
||||||
|
import java.time.LocalDate;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Invite token entity tracking usage counts.
|
||||||
|
*/
|
||||||
|
@Data
|
||||||
|
@Entity
|
||||||
|
public class InviteToken {
|
||||||
|
@Id
|
||||||
|
private String token;
|
||||||
|
|
||||||
|
@ManyToOne
|
||||||
|
private User inviter;
|
||||||
|
|
||||||
|
private LocalDate createdDate;
|
||||||
|
|
||||||
|
private int usageCount;
|
||||||
|
}
|
||||||
@@ -14,6 +14,8 @@ public enum NotificationType {
|
|||||||
POST_REVIEW_REQUEST,
|
POST_REVIEW_REQUEST,
|
||||||
/** Your post under review was approved or rejected */
|
/** Your post under review was approved or rejected */
|
||||||
POST_REVIEWED,
|
POST_REVIEWED,
|
||||||
|
/** An administrator deleted your post */
|
||||||
|
POST_DELETED,
|
||||||
/** A subscribed post received a new comment */
|
/** A subscribed post received a new comment */
|
||||||
POST_UPDATED,
|
POST_UPDATED,
|
||||||
/** Someone subscribed to your post */
|
/** Someone subscribed to your post */
|
||||||
@@ -32,6 +34,8 @@ public enum NotificationType {
|
|||||||
REGISTER_REQUEST,
|
REGISTER_REQUEST,
|
||||||
/** A user redeemed an activity reward */
|
/** A user redeemed an activity reward */
|
||||||
ACTIVITY_REDEEM,
|
ACTIVITY_REDEEM,
|
||||||
|
/** A user redeemed a point good */
|
||||||
|
POINT_REDEEM,
|
||||||
/** You won a lottery post */
|
/** You won a lottery post */
|
||||||
LOTTERY_WIN,
|
LOTTERY_WIN,
|
||||||
/** Your lottery post was drawn */
|
/** Your lottery post was drawn */
|
||||||
|
|||||||
26
backend/src/main/java/com/openisle/model/PointGood.java
Normal file
26
backend/src/main/java/com/openisle/model/PointGood.java
Normal file
@@ -0,0 +1,26 @@
|
|||||||
|
package com.openisle.model;
|
||||||
|
|
||||||
|
import jakarta.persistence.*;
|
||||||
|
import lombok.Getter;
|
||||||
|
import lombok.NoArgsConstructor;
|
||||||
|
import lombok.Setter;
|
||||||
|
|
||||||
|
/** Item available in the point mall. */
|
||||||
|
@Entity
|
||||||
|
@Getter
|
||||||
|
@Setter
|
||||||
|
@NoArgsConstructor
|
||||||
|
@Table(name = "point_goods")
|
||||||
|
public class PointGood {
|
||||||
|
@Id
|
||||||
|
@GeneratedValue(strategy = GenerationType.IDENTITY)
|
||||||
|
private Long id;
|
||||||
|
|
||||||
|
@Column(nullable = false)
|
||||||
|
private String name;
|
||||||
|
|
||||||
|
@Column(nullable = false)
|
||||||
|
private int cost;
|
||||||
|
|
||||||
|
private String image;
|
||||||
|
}
|
||||||
49
backend/src/main/java/com/openisle/model/PointHistory.java
Normal file
49
backend/src/main/java/com/openisle/model/PointHistory.java
Normal file
@@ -0,0 +1,49 @@
|
|||||||
|
package com.openisle.model;
|
||||||
|
|
||||||
|
import jakarta.persistence.*;
|
||||||
|
import lombok.Getter;
|
||||||
|
import lombok.NoArgsConstructor;
|
||||||
|
import lombok.Setter;
|
||||||
|
|
||||||
|
import java.time.LocalDateTime;
|
||||||
|
|
||||||
|
/** Point change history for a user. */
|
||||||
|
@Entity
|
||||||
|
@Getter
|
||||||
|
@Setter
|
||||||
|
@NoArgsConstructor
|
||||||
|
@Table(name = "point_histories")
|
||||||
|
public class PointHistory {
|
||||||
|
@Id
|
||||||
|
@GeneratedValue(strategy = GenerationType.IDENTITY)
|
||||||
|
private Long id;
|
||||||
|
|
||||||
|
@ManyToOne(fetch = FetchType.LAZY, optional = false)
|
||||||
|
@JoinColumn(name = "user_id")
|
||||||
|
private User user;
|
||||||
|
|
||||||
|
@Enumerated(EnumType.STRING)
|
||||||
|
@Column(nullable = false)
|
||||||
|
private PointHistoryType type;
|
||||||
|
|
||||||
|
@Column(nullable = false)
|
||||||
|
private int amount;
|
||||||
|
|
||||||
|
@Column(nullable = false)
|
||||||
|
private int balance;
|
||||||
|
|
||||||
|
@ManyToOne(fetch = FetchType.LAZY)
|
||||||
|
@JoinColumn(name = "post_id")
|
||||||
|
private Post post;
|
||||||
|
|
||||||
|
@ManyToOne(fetch = FetchType.LAZY)
|
||||||
|
@JoinColumn(name = "comment_id")
|
||||||
|
private Comment comment;
|
||||||
|
|
||||||
|
@ManyToOne(fetch = FetchType.LAZY)
|
||||||
|
@JoinColumn(name = "from_user_id")
|
||||||
|
private User fromUser;
|
||||||
|
|
||||||
|
@Column(name = "created_at", nullable = false)
|
||||||
|
private LocalDateTime createdAt;
|
||||||
|
}
|
||||||
@@ -0,0 +1,11 @@
|
|||||||
|
package com.openisle.model;
|
||||||
|
|
||||||
|
public enum PointHistoryType {
|
||||||
|
POST,
|
||||||
|
COMMENT,
|
||||||
|
POST_LIKED,
|
||||||
|
COMMENT_LIKED,
|
||||||
|
INVITE,
|
||||||
|
SYSTEM_ONLINE,
|
||||||
|
REDEEM
|
||||||
|
}
|
||||||
@@ -64,7 +64,12 @@ public class Post {
|
|||||||
@Column(nullable = false)
|
@Column(nullable = false)
|
||||||
private PostType type = PostType.NORMAL;
|
private PostType type = PostType.NORMAL;
|
||||||
|
|
||||||
|
@Column(nullable = false)
|
||||||
|
private boolean closed = false;
|
||||||
|
|
||||||
@Column
|
@Column
|
||||||
private LocalDateTime pinnedAt;
|
private LocalDateTime pinnedAt;
|
||||||
|
|
||||||
|
@Column(nullable = true)
|
||||||
|
private Boolean rssExcluded = true;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,12 @@
|
|||||||
|
package com.openisle.repository;
|
||||||
|
|
||||||
|
import com.openisle.model.InviteToken;
|
||||||
|
import com.openisle.model.User;
|
||||||
|
import org.springframework.data.jpa.repository.JpaRepository;
|
||||||
|
|
||||||
|
import java.time.LocalDate;
|
||||||
|
import java.util.Optional;
|
||||||
|
|
||||||
|
public interface InviteTokenRepository extends JpaRepository<InviteToken, String> {
|
||||||
|
Optional<InviteToken> findByInviterAndCreatedDate(User inviter, LocalDate createdDate);
|
||||||
|
}
|
||||||
@@ -6,6 +6,8 @@ import com.openisle.model.Post;
|
|||||||
import com.openisle.model.Comment;
|
import com.openisle.model.Comment;
|
||||||
import com.openisle.model.NotificationType;
|
import com.openisle.model.NotificationType;
|
||||||
import org.springframework.data.jpa.repository.JpaRepository;
|
import org.springframework.data.jpa.repository.JpaRepository;
|
||||||
|
import org.springframework.data.domain.Page;
|
||||||
|
import org.springframework.data.domain.Pageable;
|
||||||
|
|
||||||
import java.util.List;
|
import java.util.List;
|
||||||
|
|
||||||
@@ -13,7 +15,12 @@ import java.util.List;
|
|||||||
public interface NotificationRepository extends JpaRepository<Notification, Long> {
|
public interface NotificationRepository extends JpaRepository<Notification, Long> {
|
||||||
List<Notification> findByUserOrderByCreatedAtDesc(User user);
|
List<Notification> findByUserOrderByCreatedAtDesc(User user);
|
||||||
List<Notification> findByUserAndReadOrderByCreatedAtDesc(User user, boolean read);
|
List<Notification> findByUserAndReadOrderByCreatedAtDesc(User user, boolean read);
|
||||||
|
Page<Notification> findByUserOrderByCreatedAtDesc(User user, Pageable pageable);
|
||||||
|
Page<Notification> findByUserAndReadOrderByCreatedAtDesc(User user, boolean read, Pageable pageable);
|
||||||
|
Page<Notification> findByUserAndTypeNotInOrderByCreatedAtDesc(User user, java.util.Collection<NotificationType> types, Pageable pageable);
|
||||||
|
Page<Notification> findByUserAndReadAndTypeNotInOrderByCreatedAtDesc(User user, boolean read, java.util.Collection<NotificationType> types, Pageable pageable);
|
||||||
long countByUserAndRead(User user, boolean read);
|
long countByUserAndRead(User user, boolean read);
|
||||||
|
long countByUserAndReadAndTypeNotIn(User user, boolean read, java.util.Collection<NotificationType> types);
|
||||||
List<Notification> findByPost(Post post);
|
List<Notification> findByPost(Post post);
|
||||||
List<Notification> findByComment(Comment comment);
|
List<Notification> findByComment(Comment comment);
|
||||||
|
|
||||||
|
|||||||
@@ -0,0 +1,8 @@
|
|||||||
|
package com.openisle.repository;
|
||||||
|
|
||||||
|
import com.openisle.model.PointGood;
|
||||||
|
import org.springframework.data.jpa.repository.JpaRepository;
|
||||||
|
|
||||||
|
/** Repository for point mall goods. */
|
||||||
|
public interface PointGoodRepository extends JpaRepository<PointGood, Long> {
|
||||||
|
}
|
||||||
@@ -0,0 +1,12 @@
|
|||||||
|
package com.openisle.repository;
|
||||||
|
|
||||||
|
import com.openisle.model.PointHistory;
|
||||||
|
import com.openisle.model.User;
|
||||||
|
import org.springframework.data.jpa.repository.JpaRepository;
|
||||||
|
|
||||||
|
import java.util.List;
|
||||||
|
|
||||||
|
public interface PointHistoryRepository extends JpaRepository<PointHistory, Long> {
|
||||||
|
List<PointHistory> findByUserOrderByIdDesc(User user);
|
||||||
|
long countByUser(User user);
|
||||||
|
}
|
||||||
@@ -106,4 +106,6 @@ public interface PostRepository extends JpaRepository<Post, Long> {
|
|||||||
"WHERE p.createdAt >= :start AND p.createdAt < :end GROUP BY d ORDER BY d")
|
"WHERE p.createdAt >= :start AND p.createdAt < :end GROUP BY d ORDER BY d")
|
||||||
java.util.List<Object[]> countDailyRange(@Param("start") LocalDateTime start,
|
java.util.List<Object[]> countDailyRange(@Param("start") LocalDateTime start,
|
||||||
@Param("end") LocalDateTime end);
|
@Param("end") LocalDateTime end);
|
||||||
|
|
||||||
|
List<Post> findByStatusAndRssExcludedFalseOrderByCreatedAtDesc(PostStatus status, Pageable pageable);
|
||||||
}
|
}
|
||||||
|
|||||||
12
backend/src/main/java/com/openisle/service/AuthResult.java
Normal file
12
backend/src/main/java/com/openisle/service/AuthResult.java
Normal file
@@ -0,0 +1,12 @@
|
|||||||
|
package com.openisle.service;
|
||||||
|
|
||||||
|
import com.openisle.model.User;
|
||||||
|
import lombok.Value;
|
||||||
|
|
||||||
|
/** Result for OAuth authentication indicating whether a new user was created. */
|
||||||
|
@Value
|
||||||
|
public class AuthResult {
|
||||||
|
User user;
|
||||||
|
boolean newUser;
|
||||||
|
}
|
||||||
|
|
||||||
@@ -52,6 +52,9 @@ public class CommentService {
|
|||||||
.orElseThrow(() -> new com.openisle.exception.NotFoundException("User not found"));
|
.orElseThrow(() -> new com.openisle.exception.NotFoundException("User not found"));
|
||||||
Post post = postRepository.findById(postId)
|
Post post = postRepository.findById(postId)
|
||||||
.orElseThrow(() -> new com.openisle.exception.NotFoundException("Post not found"));
|
.orElseThrow(() -> new com.openisle.exception.NotFoundException("Post not found"));
|
||||||
|
if (post.isClosed()) {
|
||||||
|
throw new IllegalStateException("Post closed");
|
||||||
|
}
|
||||||
Comment comment = new Comment();
|
Comment comment = new Comment();
|
||||||
comment.setAuthor(author);
|
comment.setAuthor(author);
|
||||||
comment.setPost(post);
|
comment.setPost(post);
|
||||||
@@ -94,6 +97,9 @@ public class CommentService {
|
|||||||
.orElseThrow(() -> new com.openisle.exception.NotFoundException("User not found"));
|
.orElseThrow(() -> new com.openisle.exception.NotFoundException("User not found"));
|
||||||
Comment parent = commentRepository.findById(parentId)
|
Comment parent = commentRepository.findById(parentId)
|
||||||
.orElseThrow(() -> new IllegalArgumentException("Comment not found"));
|
.orElseThrow(() -> new IllegalArgumentException("Comment not found"));
|
||||||
|
if (parent.getPost().isClosed()) {
|
||||||
|
throw new IllegalStateException("Post closed");
|
||||||
|
}
|
||||||
Comment comment = new Comment();
|
Comment comment = new Comment();
|
||||||
comment.setAuthor(author);
|
comment.setAuthor(author);
|
||||||
comment.setPost(parent.getPost());
|
comment.setPost(parent.getPost());
|
||||||
|
|||||||
@@ -26,7 +26,7 @@ public class DiscordAuthService {
|
|||||||
@Value("${discord.client-secret:}")
|
@Value("${discord.client-secret:}")
|
||||||
private String clientSecret;
|
private String clientSecret;
|
||||||
|
|
||||||
public Optional<User> authenticate(String code, com.openisle.model.RegisterMode mode, String redirectUri) {
|
public Optional<AuthResult> authenticate(String code, com.openisle.model.RegisterMode mode, String redirectUri, boolean viaInvite) {
|
||||||
try {
|
try {
|
||||||
String tokenUrl = "https://discord.com/api/oauth2/token";
|
String tokenUrl = "https://discord.com/api/oauth2/token";
|
||||||
HttpHeaders headers = new HttpHeaders();
|
HttpHeaders headers = new HttpHeaders();
|
||||||
@@ -67,13 +67,13 @@ public class DiscordAuthService {
|
|||||||
if (email == null) {
|
if (email == null) {
|
||||||
email = (username != null ? username : id) + "@users.noreply.discord.com";
|
email = (username != null ? username : id) + "@users.noreply.discord.com";
|
||||||
}
|
}
|
||||||
return Optional.of(processUser(email, username, avatar, mode));
|
return Optional.of(processUser(email, username, avatar, mode, viaInvite));
|
||||||
} catch (Exception e) {
|
} catch (Exception e) {
|
||||||
return Optional.empty();
|
return Optional.empty();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
private User processUser(String email, String username, String avatar, com.openisle.model.RegisterMode mode) {
|
private AuthResult processUser(String email, String username, String avatar, com.openisle.model.RegisterMode mode, boolean viaInvite) {
|
||||||
Optional<User> existing = userRepository.findByEmail(email);
|
Optional<User> existing = userRepository.findByEmail(email);
|
||||||
if (existing.isPresent()) {
|
if (existing.isPresent()) {
|
||||||
User user = existing.get();
|
User user = existing.get();
|
||||||
@@ -82,7 +82,7 @@ public class DiscordAuthService {
|
|||||||
user.setVerificationCode(null);
|
user.setVerificationCode(null);
|
||||||
userRepository.save(user);
|
userRepository.save(user);
|
||||||
}
|
}
|
||||||
return user;
|
return new AuthResult(user, false);
|
||||||
}
|
}
|
||||||
String baseUsername = username != null ? username : email.split("@")[0];
|
String baseUsername = username != null ? username : email.split("@")[0];
|
||||||
String finalUsername = baseUsername;
|
String finalUsername = baseUsername;
|
||||||
@@ -96,12 +96,12 @@ public class DiscordAuthService {
|
|||||||
user.setPassword("");
|
user.setPassword("");
|
||||||
user.setRole(Role.USER);
|
user.setRole(Role.USER);
|
||||||
user.setVerified(true);
|
user.setVerified(true);
|
||||||
user.setApproved(mode == com.openisle.model.RegisterMode.DIRECT);
|
user.setApproved(mode == com.openisle.model.RegisterMode.DIRECT || viaInvite);
|
||||||
if (avatar != null) {
|
if (avatar != null) {
|
||||||
user.setAvatar(avatar);
|
user.setAvatar(avatar);
|
||||||
} else {
|
} else {
|
||||||
user.setAvatar("https://cdn.discordapp.com/embed/avatars/0.png");
|
user.setAvatar("https://cdn.discordapp.com/embed/avatars/0.png");
|
||||||
}
|
}
|
||||||
return userRepository.save(user);
|
return new AuthResult(userRepository.save(user), true);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -30,7 +30,7 @@ public class GithubAuthService {
|
|||||||
@Value("${github.client-secret:}")
|
@Value("${github.client-secret:}")
|
||||||
private String clientSecret;
|
private String clientSecret;
|
||||||
|
|
||||||
public Optional<User> authenticate(String code, com.openisle.model.RegisterMode mode, String redirectUri) {
|
public Optional<AuthResult> authenticate(String code, com.openisle.model.RegisterMode mode, String redirectUri, boolean viaInvite) {
|
||||||
try {
|
try {
|
||||||
String tokenUrl = "https://github.com/login/oauth/access_token";
|
String tokenUrl = "https://github.com/login/oauth/access_token";
|
||||||
HttpHeaders headers = new HttpHeaders();
|
HttpHeaders headers = new HttpHeaders();
|
||||||
@@ -86,13 +86,13 @@ public class GithubAuthService {
|
|||||||
if (email == null) {
|
if (email == null) {
|
||||||
email = username + "@users.noreply.github.com";
|
email = username + "@users.noreply.github.com";
|
||||||
}
|
}
|
||||||
return Optional.of(processUser(email, username, avatarUrl, mode));
|
return Optional.of(processUser(email, username, avatarUrl, mode, viaInvite));
|
||||||
} catch (Exception e) {
|
} catch (Exception e) {
|
||||||
return Optional.empty();
|
return Optional.empty();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
private User processUser(String email, String username, String avatar, com.openisle.model.RegisterMode mode) {
|
private AuthResult processUser(String email, String username, String avatar, com.openisle.model.RegisterMode mode, boolean viaInvite) {
|
||||||
Optional<User> existing = userRepository.findByEmail(email);
|
Optional<User> existing = userRepository.findByEmail(email);
|
||||||
if (existing.isPresent()) {
|
if (existing.isPresent()) {
|
||||||
User user = existing.get();
|
User user = existing.get();
|
||||||
@@ -101,7 +101,7 @@ public class GithubAuthService {
|
|||||||
user.setVerificationCode(null);
|
user.setVerificationCode(null);
|
||||||
userRepository.save(user);
|
userRepository.save(user);
|
||||||
}
|
}
|
||||||
return user;
|
return new AuthResult(user, false);
|
||||||
}
|
}
|
||||||
String baseUsername = username != null ? username : email.split("@")[0];
|
String baseUsername = username != null ? username : email.split("@")[0];
|
||||||
String finalUsername = baseUsername;
|
String finalUsername = baseUsername;
|
||||||
@@ -115,12 +115,12 @@ public class GithubAuthService {
|
|||||||
user.setPassword("");
|
user.setPassword("");
|
||||||
user.setRole(Role.USER);
|
user.setRole(Role.USER);
|
||||||
user.setVerified(true);
|
user.setVerified(true);
|
||||||
user.setApproved(mode == com.openisle.model.RegisterMode.DIRECT);
|
user.setApproved(mode == com.openisle.model.RegisterMode.DIRECT || viaInvite);
|
||||||
if (avatar != null) {
|
if (avatar != null) {
|
||||||
user.setAvatar(avatar);
|
user.setAvatar(avatar);
|
||||||
} else {
|
} else {
|
||||||
user.setAvatar(avatarGenerator.generate(finalUsername));
|
user.setAvatar(avatarGenerator.generate(finalUsername));
|
||||||
}
|
}
|
||||||
return userRepository.save(user);
|
return new AuthResult(userRepository.save(user), true);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -25,7 +25,7 @@ public class GoogleAuthService {
|
|||||||
@Value("${google.client-id:}")
|
@Value("${google.client-id:}")
|
||||||
private String clientId;
|
private String clientId;
|
||||||
|
|
||||||
public Optional<User> authenticate(String idTokenString, com.openisle.model.RegisterMode mode) {
|
public Optional<AuthResult> authenticate(String idTokenString, com.openisle.model.RegisterMode mode, boolean viaInvite) {
|
||||||
GoogleIdTokenVerifier verifier = new GoogleIdTokenVerifier.Builder(new NetHttpTransport(), new JacksonFactory())
|
GoogleIdTokenVerifier verifier = new GoogleIdTokenVerifier.Builder(new NetHttpTransport(), new JacksonFactory())
|
||||||
.setAudience(Collections.singletonList(clientId))
|
.setAudience(Collections.singletonList(clientId))
|
||||||
.build();
|
.build();
|
||||||
@@ -38,13 +38,13 @@ public class GoogleAuthService {
|
|||||||
String email = payload.getEmail();
|
String email = payload.getEmail();
|
||||||
String name = (String) payload.get("name");
|
String name = (String) payload.get("name");
|
||||||
String picture = (String) payload.get("picture");
|
String picture = (String) payload.get("picture");
|
||||||
return Optional.of(processUser(email, name, picture, mode));
|
return Optional.of(processUser(email, name, picture, mode, viaInvite));
|
||||||
} catch (Exception e) {
|
} catch (Exception e) {
|
||||||
return Optional.empty();
|
return Optional.empty();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
private User processUser(String email, String name, String avatar, com.openisle.model.RegisterMode mode) {
|
private AuthResult processUser(String email, String name, String avatar, com.openisle.model.RegisterMode mode, boolean viaInvite) {
|
||||||
Optional<User> existing = userRepository.findByEmail(email);
|
Optional<User> existing = userRepository.findByEmail(email);
|
||||||
if (existing.isPresent()) {
|
if (existing.isPresent()) {
|
||||||
User user = existing.get();
|
User user = existing.get();
|
||||||
@@ -53,8 +53,7 @@ public class GoogleAuthService {
|
|||||||
user.setVerificationCode(null);
|
user.setVerificationCode(null);
|
||||||
userRepository.save(user);
|
userRepository.save(user);
|
||||||
}
|
}
|
||||||
|
return new AuthResult(user, false);
|
||||||
return user;
|
|
||||||
}
|
}
|
||||||
User user = new User();
|
User user = new User();
|
||||||
String baseUsername = email.split("@")[0];
|
String baseUsername = email.split("@")[0];
|
||||||
@@ -68,12 +67,12 @@ public class GoogleAuthService {
|
|||||||
user.setPassword("");
|
user.setPassword("");
|
||||||
user.setRole(Role.USER);
|
user.setRole(Role.USER);
|
||||||
user.setVerified(true);
|
user.setVerified(true);
|
||||||
user.setApproved(mode == com.openisle.model.RegisterMode.DIRECT);
|
user.setApproved(mode == com.openisle.model.RegisterMode.DIRECT || viaInvite);
|
||||||
if (avatar != null) {
|
if (avatar != null) {
|
||||||
user.setAvatar(avatar);
|
user.setAvatar(avatar);
|
||||||
} else {
|
} else {
|
||||||
user.setAvatar(avatarGenerator.generate(username));
|
user.setAvatar(avatarGenerator.generate(username));
|
||||||
}
|
}
|
||||||
return userRepository.save(user);
|
return new AuthResult(userRepository.save(user), true);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,64 @@
|
|||||||
|
package com.openisle.service;
|
||||||
|
|
||||||
|
import com.openisle.model.InviteToken;
|
||||||
|
import com.openisle.model.User;
|
||||||
|
import com.openisle.repository.InviteTokenRepository;
|
||||||
|
import com.openisle.repository.UserRepository;
|
||||||
|
import lombok.RequiredArgsConstructor;
|
||||||
|
import lombok.Value;
|
||||||
|
import org.springframework.stereotype.Service;
|
||||||
|
|
||||||
|
import java.time.LocalDate;
|
||||||
|
import java.util.Optional;
|
||||||
|
|
||||||
|
@Service
|
||||||
|
@RequiredArgsConstructor
|
||||||
|
public class InviteService {
|
||||||
|
private final InviteTokenRepository inviteTokenRepository;
|
||||||
|
private final UserRepository userRepository;
|
||||||
|
private final JwtService jwtService;
|
||||||
|
private final PointService pointService;
|
||||||
|
|
||||||
|
@Value
|
||||||
|
public class InviteValidateResult {
|
||||||
|
InviteToken inviteToken;
|
||||||
|
boolean validate;
|
||||||
|
}
|
||||||
|
|
||||||
|
public String generate(String username) {
|
||||||
|
User inviter = userRepository.findByUsername(username).orElseThrow();
|
||||||
|
LocalDate today = LocalDate.now();
|
||||||
|
Optional<InviteToken> existing = inviteTokenRepository.findByInviterAndCreatedDate(inviter, today);
|
||||||
|
if (existing.isPresent()) {
|
||||||
|
return existing.get().getToken();
|
||||||
|
}
|
||||||
|
String token = jwtService.generateInviteToken(username);
|
||||||
|
InviteToken inviteToken = new InviteToken();
|
||||||
|
inviteToken.setToken(token);
|
||||||
|
inviteToken.setInviter(inviter);
|
||||||
|
inviteToken.setCreatedDate(today);
|
||||||
|
inviteToken.setUsageCount(0);
|
||||||
|
inviteTokenRepository.save(inviteToken);
|
||||||
|
return token;
|
||||||
|
}
|
||||||
|
|
||||||
|
public InviteValidateResult validate(String token) {
|
||||||
|
if (token == null || token.isEmpty()) {
|
||||||
|
return new InviteValidateResult(null, false);
|
||||||
|
}
|
||||||
|
try {
|
||||||
|
jwtService.validateAndGetSubjectForInvite(token);
|
||||||
|
} catch (Exception e) {
|
||||||
|
return new InviteValidateResult(null, false);
|
||||||
|
}
|
||||||
|
InviteToken invite = inviteTokenRepository.findById(token).orElse(null);
|
||||||
|
return new InviteValidateResult(invite, invite != null && invite.getUsageCount() < 3);
|
||||||
|
}
|
||||||
|
|
||||||
|
public void consume(String token, String newUserName) {
|
||||||
|
InviteToken invite = inviteTokenRepository.findById(token).orElseThrow();
|
||||||
|
invite.setUsageCount(invite.getUsageCount() + 1);
|
||||||
|
inviteTokenRepository.save(invite);
|
||||||
|
pointService.awardForInvite(invite.getInviter().getUsername(), newUserName);
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -24,6 +24,9 @@ public class JwtService {
|
|||||||
@Value("${app.jwt.reset-secret}")
|
@Value("${app.jwt.reset-secret}")
|
||||||
private String resetSecret;
|
private String resetSecret;
|
||||||
|
|
||||||
|
@Value("${app.jwt.invite-secret}")
|
||||||
|
private String inviteSecret;
|
||||||
|
|
||||||
@Value("${app.jwt.expiration}")
|
@Value("${app.jwt.expiration}")
|
||||||
private long expiration;
|
private long expiration;
|
||||||
|
|
||||||
@@ -70,6 +73,17 @@ public class JwtService {
|
|||||||
.compact();
|
.compact();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public String generateInviteToken(String subject) {
|
||||||
|
Date now = new Date();
|
||||||
|
Date expiryDate = new Date(now.getTime() + expiration);
|
||||||
|
return Jwts.builder()
|
||||||
|
.setSubject(subject)
|
||||||
|
.setIssuedAt(now)
|
||||||
|
.setExpiration(expiryDate)
|
||||||
|
.signWith(getSigningKeyForSecret(inviteSecret))
|
||||||
|
.compact();
|
||||||
|
}
|
||||||
|
|
||||||
public String validateAndGetSubject(String token) {
|
public String validateAndGetSubject(String token) {
|
||||||
Claims claims = Jwts.parserBuilder()
|
Claims claims = Jwts.parserBuilder()
|
||||||
.setSigningKey(getSigningKeyForSecret(secret))
|
.setSigningKey(getSigningKeyForSecret(secret))
|
||||||
@@ -96,4 +110,13 @@ public class JwtService {
|
|||||||
.getBody();
|
.getBody();
|
||||||
return claims.getSubject();
|
return claims.getSubject();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public String validateAndGetSubjectForInvite(String token) {
|
||||||
|
Claims claims = Jwts.parserBuilder()
|
||||||
|
.setSigningKey(getSigningKeyForSecret(inviteSecret))
|
||||||
|
.build()
|
||||||
|
.parseClaimsJws(token)
|
||||||
|
.getBody();
|
||||||
|
return claims.getSubject();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -23,7 +23,6 @@ import java.util.HashSet;
|
|||||||
import java.util.List;
|
import java.util.List;
|
||||||
import java.util.ArrayList;
|
import java.util.ArrayList;
|
||||||
import java.util.concurrent.Executor;
|
import java.util.concurrent.Executor;
|
||||||
import java.util.stream.Collectors;
|
|
||||||
|
|
||||||
/** Service for creating and retrieving notifications. */
|
/** Service for creating and retrieving notifications. */
|
||||||
@Service
|
@Service
|
||||||
@@ -141,6 +140,19 @@ public class NotificationService {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Create notifications for all admins when a user redeems a point good.
|
||||||
|
* Old redeem notifications from the same user are removed first.
|
||||||
|
*/
|
||||||
|
@org.springframework.transaction.annotation.Transactional
|
||||||
|
public void createPointRedeemNotifications(User user, String content) {
|
||||||
|
// notificationRepository.deleteByTypeAndFromUser(NotificationType.POINT_REDEEM, user);
|
||||||
|
for (User admin : userRepository.findByRole(Role.ADMIN)) {
|
||||||
|
createNotification(admin, NotificationType.POINT_REDEEM, null, null,
|
||||||
|
null, user, null, content);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
public List<NotificationPreferenceDto> listPreferences(String username) {
|
public List<NotificationPreferenceDto> listPreferences(String username) {
|
||||||
User user = userRepository.findByUsername(username)
|
User user = userRepository.findByUsername(username)
|
||||||
.orElseThrow(() -> new com.openisle.exception.NotFoundException("User not found"));
|
.orElseThrow(() -> new com.openisle.exception.NotFoundException("User not found"));
|
||||||
@@ -167,17 +179,26 @@ public class NotificationService {
|
|||||||
userRepository.save(user);
|
userRepository.save(user);
|
||||||
}
|
}
|
||||||
|
|
||||||
public List<Notification> listNotifications(String username, Boolean read) {
|
public List<Notification> listNotifications(String username, Boolean read, int page, int size) {
|
||||||
User user = userRepository.findByUsername(username)
|
User user = userRepository.findByUsername(username)
|
||||||
.orElseThrow(() -> new com.openisle.exception.NotFoundException("User not found"));
|
.orElseThrow(() -> new com.openisle.exception.NotFoundException("User not found"));
|
||||||
Set<NotificationType> disabled = user.getDisabledNotificationTypes();
|
Set<NotificationType> disabled = user.getDisabledNotificationTypes();
|
||||||
List<Notification> list;
|
org.springframework.data.domain.Pageable pageable = org.springframework.data.domain.PageRequest.of(page, size);
|
||||||
|
org.springframework.data.domain.Page<Notification> result;
|
||||||
if (read == null) {
|
if (read == null) {
|
||||||
list = notificationRepository.findByUserOrderByCreatedAtDesc(user);
|
if (disabled.isEmpty()) {
|
||||||
|
result = notificationRepository.findByUserOrderByCreatedAtDesc(user, pageable);
|
||||||
|
} else {
|
||||||
|
result = notificationRepository.findByUserAndTypeNotInOrderByCreatedAtDesc(user, disabled, pageable);
|
||||||
|
}
|
||||||
} else {
|
} else {
|
||||||
list = notificationRepository.findByUserAndReadOrderByCreatedAtDesc(user, read);
|
if (disabled.isEmpty()) {
|
||||||
|
result = notificationRepository.findByUserAndReadOrderByCreatedAtDesc(user, read, pageable);
|
||||||
|
} else {
|
||||||
|
result = notificationRepository.findByUserAndReadAndTypeNotInOrderByCreatedAtDesc(user, read, disabled, pageable);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
return list.stream().filter(n -> !disabled.contains(n.getType())).collect(Collectors.toList());
|
return result.getContent();
|
||||||
}
|
}
|
||||||
|
|
||||||
public void markRead(String username, List<Long> ids) {
|
public void markRead(String username, List<Long> ids) {
|
||||||
@@ -196,8 +217,10 @@ public class NotificationService {
|
|||||||
User user = userRepository.findByUsername(username)
|
User user = userRepository.findByUsername(username)
|
||||||
.orElseThrow(() -> new com.openisle.exception.NotFoundException("User not found"));
|
.orElseThrow(() -> new com.openisle.exception.NotFoundException("User not found"));
|
||||||
Set<NotificationType> disabled = user.getDisabledNotificationTypes();
|
Set<NotificationType> disabled = user.getDisabledNotificationTypes();
|
||||||
return notificationRepository.findByUserAndReadOrderByCreatedAtDesc(user, false).stream()
|
if (disabled.isEmpty()) {
|
||||||
.filter(n -> !disabled.contains(n.getType())).count();
|
return notificationRepository.countByUserAndRead(user, false);
|
||||||
|
}
|
||||||
|
return notificationRepository.countByUserAndReadAndTypeNotIn(user, false, disabled);
|
||||||
}
|
}
|
||||||
|
|
||||||
public void notifyMentions(String content, User fromUser, Post post, Comment comment) {
|
public void notifyMentions(String content, User fromUser, Post post, Comment comment) {
|
||||||
|
|||||||
@@ -0,0 +1,48 @@
|
|||||||
|
package com.openisle.service;
|
||||||
|
|
||||||
|
import com.openisle.exception.FieldException;
|
||||||
|
import com.openisle.exception.NotFoundException;
|
||||||
|
import com.openisle.model.PointGood;
|
||||||
|
import com.openisle.model.PointHistory;
|
||||||
|
import com.openisle.model.PointHistoryType;
|
||||||
|
import com.openisle.model.User;
|
||||||
|
import com.openisle.repository.PointGoodRepository;
|
||||||
|
import com.openisle.repository.PointHistoryRepository;
|
||||||
|
import com.openisle.repository.UserRepository;
|
||||||
|
import lombok.RequiredArgsConstructor;
|
||||||
|
import org.springframework.stereotype.Service;
|
||||||
|
|
||||||
|
import java.util.List;
|
||||||
|
|
||||||
|
/** Service for point mall operations. */
|
||||||
|
@Service
|
||||||
|
@RequiredArgsConstructor
|
||||||
|
public class PointMallService {
|
||||||
|
private final PointGoodRepository pointGoodRepository;
|
||||||
|
private final UserRepository userRepository;
|
||||||
|
private final NotificationService notificationService;
|
||||||
|
private final PointHistoryRepository pointHistoryRepository;
|
||||||
|
|
||||||
|
public List<PointGood> listGoods() {
|
||||||
|
return pointGoodRepository.findAll();
|
||||||
|
}
|
||||||
|
|
||||||
|
public int redeem(User user, Long goodId, String contact) {
|
||||||
|
PointGood good = pointGoodRepository.findById(goodId)
|
||||||
|
.orElseThrow(() -> new NotFoundException("Good not found"));
|
||||||
|
if (user.getPoint() < good.getCost()) {
|
||||||
|
throw new FieldException("point", "Insufficient points");
|
||||||
|
}
|
||||||
|
user.setPoint(user.getPoint() - good.getCost());
|
||||||
|
userRepository.save(user);
|
||||||
|
notificationService.createPointRedeemNotifications(user, good.getName() + ": " + contact);
|
||||||
|
PointHistory history = new PointHistory();
|
||||||
|
history.setUser(user);
|
||||||
|
history.setType(PointHistoryType.REDEEM);
|
||||||
|
history.setAmount(-good.getCost());
|
||||||
|
history.setBalance(user.getPoint());
|
||||||
|
history.setCreatedAt(java.time.LocalDateTime.now());
|
||||||
|
pointHistoryRepository.save(history);
|
||||||
|
return user.getPoint();
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -1,7 +1,6 @@
|
|||||||
package com.openisle.service;
|
package com.openisle.service;
|
||||||
|
|
||||||
import com.openisle.model.PointLog;
|
import com.openisle.model.*;
|
||||||
import com.openisle.model.User;
|
|
||||||
import com.openisle.repository.*;
|
import com.openisle.repository.*;
|
||||||
import lombok.RequiredArgsConstructor;
|
import lombok.RequiredArgsConstructor;
|
||||||
import org.springframework.stereotype.Service;
|
import org.springframework.stereotype.Service;
|
||||||
@@ -16,14 +15,22 @@ public class PointService {
|
|||||||
private final PointLogRepository pointLogRepository;
|
private final PointLogRepository pointLogRepository;
|
||||||
private final PostRepository postRepository;
|
private final PostRepository postRepository;
|
||||||
private final CommentRepository commentRepository;
|
private final CommentRepository commentRepository;
|
||||||
|
private final PointHistoryRepository pointHistoryRepository;
|
||||||
|
|
||||||
public int awardForPost(String userName) {
|
public int awardForPost(String userName, Long postId) {
|
||||||
User user = userRepository.findByUsername(userName).orElseThrow();
|
User user = userRepository.findByUsername(userName).orElseThrow();
|
||||||
PointLog log = getTodayLog(user);
|
PointLog log = getTodayLog(user);
|
||||||
if (log.getPostCount() > 1) return 0;
|
if (log.getPostCount() > 1) return 0;
|
||||||
log.setPostCount(log.getPostCount() + 1);
|
log.setPostCount(log.getPostCount() + 1);
|
||||||
pointLogRepository.save(log);
|
pointLogRepository.save(log);
|
||||||
return addPoint(user, 30);
|
Post post = postRepository.findById(postId).orElseThrow();
|
||||||
|
return addPoint(user, 30, PointHistoryType.POST, post, null, null);
|
||||||
|
}
|
||||||
|
|
||||||
|
public int awardForInvite(String userName, String inviteeName) {
|
||||||
|
User user = userRepository.findByUsername(userName).orElseThrow();
|
||||||
|
User invitee = userRepository.findByUsername(inviteeName).orElseThrow();
|
||||||
|
return addPoint(user, 500, PointHistoryType.INVITE, null, null, invitee);
|
||||||
}
|
}
|
||||||
|
|
||||||
private PointLog getTodayLog(User user) {
|
private PointLog getTodayLog(User user) {
|
||||||
@@ -40,20 +47,41 @@ public class PointService {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
private int addPoint(User user, int amount) {
|
private int addPoint(User user, int amount, PointHistoryType type,
|
||||||
|
Post post, Comment comment, User fromUser) {
|
||||||
|
if (pointHistoryRepository.countByUser(user) == 0) {
|
||||||
|
recordHistory(user, PointHistoryType.SYSTEM_ONLINE, 0, null, null, null);
|
||||||
|
}
|
||||||
user.setPoint(user.getPoint() + amount);
|
user.setPoint(user.getPoint() + amount);
|
||||||
userRepository.save(user);
|
userRepository.save(user);
|
||||||
|
recordHistory(user, type, amount, post, comment, fromUser);
|
||||||
return amount;
|
return amount;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
private void recordHistory(User user, PointHistoryType type, int amount,
|
||||||
|
Post post, Comment comment, User fromUser) {
|
||||||
|
PointHistory history = new PointHistory();
|
||||||
|
history.setUser(user);
|
||||||
|
history.setType(type);
|
||||||
|
history.setAmount(amount);
|
||||||
|
history.setBalance(user.getPoint());
|
||||||
|
history.setPost(post);
|
||||||
|
history.setComment(comment);
|
||||||
|
history.setFromUser(fromUser);
|
||||||
|
history.setCreatedAt(java.time.LocalDateTime.now());
|
||||||
|
pointHistoryRepository.save(history);
|
||||||
|
}
|
||||||
|
|
||||||
// 同时为评论者和发帖人增加积分,返回值为评论者增加的积分数
|
// 同时为评论者和发帖人增加积分,返回值为评论者增加的积分数
|
||||||
// 注意需要考虑发帖和回复是同一人的场景
|
// 注意需要考虑发帖和回复是同一人的场景
|
||||||
public int awardForComment(String commenterName, Long postId) {
|
public int awardForComment(String commenterName, Long postId, Long commentId) {
|
||||||
// 标记评论者是否已达到积分奖励上限
|
// 标记评论者是否已达到积分奖励上限
|
||||||
boolean isTheRewardCapped = false;
|
boolean isTheRewardCapped = false;
|
||||||
|
|
||||||
// 根据帖子id找到发帖人
|
// 根据帖子id找到发帖人
|
||||||
User poster = postRepository.findById(postId).orElseThrow().getAuthor();
|
Post post = postRepository.findById(postId).orElseThrow();
|
||||||
|
User poster = post.getAuthor();
|
||||||
|
Comment comment = commentRepository.findById(commentId).orElseThrow();
|
||||||
|
|
||||||
// 获取评论者的加分日志
|
// 获取评论者的加分日志
|
||||||
User commenter = userRepository.findByUsername(commenterName).orElseThrow();
|
User commenter = userRepository.findByUsername(commenterName).orElseThrow();
|
||||||
@@ -69,15 +97,15 @@ public class PointService {
|
|||||||
} else {
|
} else {
|
||||||
log.setCommentCount(log.getCommentCount() + 1);
|
log.setCommentCount(log.getCommentCount() + 1);
|
||||||
pointLogRepository.save(log);
|
pointLogRepository.save(log);
|
||||||
return addPoint(commenter, 10);
|
return addPoint(commenter, 10, PointHistoryType.COMMENT, post, comment, null);
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
addPoint(poster, 10);
|
addPoint(poster, 10, PointHistoryType.COMMENT, post, comment, commenter);
|
||||||
// 如果发帖人与评论者不是同一个,则根据是否达到积分上限来判断评论者加分情况
|
// 如果发帖人与评论者不是同一个,则根据是否达到积分上限来判断评论者加分情况
|
||||||
if (isTheRewardCapped) {
|
if (isTheRewardCapped) {
|
||||||
return 0;
|
return 0;
|
||||||
} else {
|
} else {
|
||||||
return addPoint(commenter, 10);
|
return addPoint(commenter, 10, PointHistoryType.COMMENT, post, comment, null);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -96,7 +124,8 @@ public class PointService {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// 如果不是同一个,则为发帖人加分
|
// 如果不是同一个,则为发帖人加分
|
||||||
return addPoint(poster, 10);
|
Post post = postRepository.findById(postId).orElseThrow();
|
||||||
|
return addPoint(poster, 10, PointHistoryType.POST_LIKED, post, null, reactioner);
|
||||||
}
|
}
|
||||||
|
|
||||||
// 考虑点赞者和评论者是同一个的情况
|
// 考虑点赞者和评论者是同一个的情况
|
||||||
@@ -113,7 +142,17 @@ public class PointService {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// 如果不是同一个,则为发帖人加分
|
// 如果不是同一个,则为发帖人加分
|
||||||
return addPoint(commenter, 10);
|
Comment comment = commentRepository.findById(commentId).orElseThrow();
|
||||||
|
Post post = comment.getPost();
|
||||||
|
return addPoint(commenter, 10, PointHistoryType.COMMENT_LIKED, post, comment, reactioner);
|
||||||
|
}
|
||||||
|
|
||||||
|
public java.util.List<PointHistory> listHistory(String userName) {
|
||||||
|
User user = userRepository.findByUsername(userName).orElseThrow();
|
||||||
|
if (pointHistoryRepository.countByUser(user) == 0) {
|
||||||
|
recordHistory(user, PointHistoryType.SYSTEM_ONLINE, 0, null, null, null);
|
||||||
|
}
|
||||||
|
return pointHistoryRepository.findByUserOrderByIdDesc(user);
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -132,6 +132,23 @@ public class PostService {
|
|||||||
this.publishMode = publishMode;
|
this.publishMode = publishMode;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public List<Post> listLatestRssPosts(int limit) {
|
||||||
|
Pageable pageable = PageRequest.of(0, limit, Sort.by(Sort.Direction.DESC, "createdAt"));
|
||||||
|
return postRepository.findByStatusAndRssExcludedFalseOrderByCreatedAtDesc(PostStatus.PUBLISHED, pageable);
|
||||||
|
}
|
||||||
|
|
||||||
|
public Post excludeFromRss(Long id) {
|
||||||
|
Post post = postRepository.findById(id).orElseThrow(() -> new com.openisle.exception.NotFoundException("Post not found"));
|
||||||
|
post.setRssExcluded(true);
|
||||||
|
return postRepository.save(post);
|
||||||
|
}
|
||||||
|
|
||||||
|
public Post includeInRss(Long id) {
|
||||||
|
Post post = postRepository.findById(id).orElseThrow(() -> new com.openisle.exception.NotFoundException("Post not found"));
|
||||||
|
post.setRssExcluded(false);
|
||||||
|
return postRepository.save(post);
|
||||||
|
}
|
||||||
|
|
||||||
public Post createPost(String username,
|
public Post createPost(String username,
|
||||||
Long categoryId,
|
Long categoryId,
|
||||||
String title,
|
String title,
|
||||||
@@ -495,6 +512,30 @@ public class PostService {
|
|||||||
return postRepository.save(post);
|
return postRepository.save(post);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public Post closePost(Long id, String username) {
|
||||||
|
Post post = postRepository.findById(id)
|
||||||
|
.orElseThrow(() -> new com.openisle.exception.NotFoundException("Post not found"));
|
||||||
|
User user = userRepository.findByUsername(username)
|
||||||
|
.orElseThrow(() -> new com.openisle.exception.NotFoundException("User not found"));
|
||||||
|
if (!user.getId().equals(post.getAuthor().getId()) && user.getRole() != Role.ADMIN) {
|
||||||
|
throw new IllegalArgumentException("Unauthorized");
|
||||||
|
}
|
||||||
|
post.setClosed(true);
|
||||||
|
return postRepository.save(post);
|
||||||
|
}
|
||||||
|
|
||||||
|
public Post reopenPost(Long id, String username) {
|
||||||
|
Post post = postRepository.findById(id)
|
||||||
|
.orElseThrow(() -> new com.openisle.exception.NotFoundException("Post not found"));
|
||||||
|
User user = userRepository.findByUsername(username)
|
||||||
|
.orElseThrow(() -> new com.openisle.exception.NotFoundException("User not found"));
|
||||||
|
if (!user.getId().equals(post.getAuthor().getId()) && user.getRole() != Role.ADMIN) {
|
||||||
|
throw new IllegalArgumentException("Unauthorized");
|
||||||
|
}
|
||||||
|
post.setClosed(false);
|
||||||
|
return postRepository.save(post);
|
||||||
|
}
|
||||||
|
|
||||||
@org.springframework.transaction.annotation.Transactional
|
@org.springframework.transaction.annotation.Transactional
|
||||||
public Post updatePost(Long id,
|
public Post updatePost(Long id,
|
||||||
String username,
|
String username,
|
||||||
@@ -538,7 +579,9 @@ public class PostService {
|
|||||||
.orElseThrow(() -> new com.openisle.exception.NotFoundException("Post not found"));
|
.orElseThrow(() -> new com.openisle.exception.NotFoundException("Post not found"));
|
||||||
User user = userRepository.findByUsername(username)
|
User user = userRepository.findByUsername(username)
|
||||||
.orElseThrow(() -> new com.openisle.exception.NotFoundException("User not found"));
|
.orElseThrow(() -> new com.openisle.exception.NotFoundException("User not found"));
|
||||||
if (!user.getId().equals(post.getAuthor().getId()) && user.getRole() != Role.ADMIN) {
|
User author = post.getAuthor();
|
||||||
|
boolean adminDeleting = !user.getId().equals(author.getId()) && user.getRole() == Role.ADMIN;
|
||||||
|
if (!user.getId().equals(author.getId()) && user.getRole() != Role.ADMIN) {
|
||||||
throw new IllegalArgumentException("Unauthorized");
|
throw new IllegalArgumentException("Unauthorized");
|
||||||
}
|
}
|
||||||
for (Comment c : commentRepository.findByPostAndParentIsNullOrderByCreatedAtAsc(post)) {
|
for (Comment c : commentRepository.findByPostAndParentIsNullOrderByCreatedAtAsc(post)) {
|
||||||
@@ -555,7 +598,12 @@ public class PostService {
|
|||||||
future.cancel(false);
|
future.cancel(false);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
String title = post.getTitle();
|
||||||
postRepository.delete(post);
|
postRepository.delete(post);
|
||||||
|
if (adminDeleting) {
|
||||||
|
notificationService.createNotification(author, NotificationType.POST_DELETED,
|
||||||
|
null, null, null, user, null, title);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
public java.util.List<Post> getPostsByIds(java.util.List<Long> ids) {
|
public java.util.List<Post> getPostsByIds(java.util.List<Long> ids) {
|
||||||
|
|||||||
@@ -33,11 +33,12 @@ public class TwitterAuthService {
|
|||||||
@Value("${twitter.client-secret:}")
|
@Value("${twitter.client-secret:}")
|
||||||
private String clientSecret;
|
private String clientSecret;
|
||||||
|
|
||||||
public Optional<User> authenticate(
|
public Optional<AuthResult> authenticate(
|
||||||
String code,
|
String code,
|
||||||
String codeVerifier,
|
String codeVerifier,
|
||||||
RegisterMode mode,
|
RegisterMode mode,
|
||||||
String redirectUri) {
|
String redirectUri,
|
||||||
|
boolean viaInvite) {
|
||||||
|
|
||||||
logger.debug("Starting authentication with code {} and verifier {}", code, codeVerifier);
|
logger.debug("Starting authentication with code {} and verifier {}", code, codeVerifier);
|
||||||
|
|
||||||
@@ -106,10 +107,10 @@ public class TwitterAuthService {
|
|||||||
// Twitter v2 默认拿不到 email;如果你申请到 email.scope,可改用 /2/users/:id?user.fields=email
|
// Twitter v2 默认拿不到 email;如果你申请到 email.scope,可改用 /2/users/:id?user.fields=email
|
||||||
String email = username + "@twitter.com";
|
String email = username + "@twitter.com";
|
||||||
logger.debug("Processing user {} with email {}", username, email);
|
logger.debug("Processing user {} with email {}", username, email);
|
||||||
return Optional.of(processUser(email, username, avatar, mode));
|
return Optional.of(processUser(email, username, avatar, mode, viaInvite));
|
||||||
}
|
}
|
||||||
|
|
||||||
private User processUser(String email, String username, String avatar, com.openisle.model.RegisterMode mode) {
|
private AuthResult processUser(String email, String username, String avatar, com.openisle.model.RegisterMode mode, boolean viaInvite) {
|
||||||
Optional<User> existing = userRepository.findByEmail(email);
|
Optional<User> existing = userRepository.findByEmail(email);
|
||||||
if (existing.isPresent()) {
|
if (existing.isPresent()) {
|
||||||
User user = existing.get();
|
User user = existing.get();
|
||||||
@@ -119,7 +120,7 @@ public class TwitterAuthService {
|
|||||||
userRepository.save(user);
|
userRepository.save(user);
|
||||||
}
|
}
|
||||||
logger.debug("Existing user {} authenticated", user.getUsername());
|
logger.debug("Existing user {} authenticated", user.getUsername());
|
||||||
return user;
|
return new AuthResult(user, false);
|
||||||
}
|
}
|
||||||
String baseUsername = username != null ? username : email.split("@")[0];
|
String baseUsername = username != null ? username : email.split("@")[0];
|
||||||
String finalUsername = baseUsername;
|
String finalUsername = baseUsername;
|
||||||
@@ -133,13 +134,13 @@ public class TwitterAuthService {
|
|||||||
user.setPassword("");
|
user.setPassword("");
|
||||||
user.setRole(Role.USER);
|
user.setRole(Role.USER);
|
||||||
user.setVerified(true);
|
user.setVerified(true);
|
||||||
user.setApproved(mode == com.openisle.model.RegisterMode.DIRECT);
|
user.setApproved(mode == com.openisle.model.RegisterMode.DIRECT || viaInvite);
|
||||||
if (avatar != null) {
|
if (avatar != null) {
|
||||||
user.setAvatar(avatar);
|
user.setAvatar(avatar);
|
||||||
} else {
|
} else {
|
||||||
user.setAvatar("https://twitter.com/" + finalUsername + "/profile_image");
|
user.setAvatar("https://twitter.com/" + finalUsername + "/profile_image");
|
||||||
}
|
}
|
||||||
logger.debug("Creating new user {}", finalUsername);
|
logger.debug("Creating new user {}", finalUsername);
|
||||||
return userRepository.save(user);
|
return new AuthResult(userRepository.save(user), true);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -74,6 +74,13 @@ public class UserService {
|
|||||||
return userRepository.save(user);
|
return userRepository.save(user);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public User registerWithInvite(String username, String email, String password) {
|
||||||
|
User user = register(username, email, password, "", com.openisle.model.RegisterMode.DIRECT);
|
||||||
|
user.setVerified(true);
|
||||||
|
user.setVerificationCode(genCode());
|
||||||
|
return userRepository.save(user);
|
||||||
|
}
|
||||||
|
|
||||||
private String genCode() {
|
private String genCode() {
|
||||||
return String.format("%06d", new Random().nextInt(1000000));
|
return String.format("%06d", new Random().nextInt(1000000));
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -10,6 +10,7 @@ spring.jpa.hibernate.ddl-auto=update
|
|||||||
app.jwt.secret=${JWT_SECRET:jwt_sec}
|
app.jwt.secret=${JWT_SECRET:jwt_sec}
|
||||||
app.jwt.reason-secret=${JWT_REASON_SECRET:jwt_reason_sec}
|
app.jwt.reason-secret=${JWT_REASON_SECRET:jwt_reason_sec}
|
||||||
app.jwt.reset-secret=${JWT_RESET_SECRET:jwt_reset_sec}
|
app.jwt.reset-secret=${JWT_RESET_SECRET:jwt_reset_sec}
|
||||||
|
app.jwt.invite-secret=${JWT_INVITE_SECRET:jwt_invite_sec}
|
||||||
# 30 days
|
# 30 days
|
||||||
app.jwt.expiration=${JWT_EXPIRATION:2592000000}
|
app.jwt.expiration=${JWT_EXPIRATION:2592000000}
|
||||||
# Password strength: LOW, MEDIUM or HIGH
|
# Password strength: LOW, MEDIUM or HIGH
|
||||||
|
|||||||
@@ -0,0 +1 @@
|
|||||||
|
ALTER TABLE posts ADD COLUMN rss_excluded BOOLEAN NOT NULL DEFAULT 0;
|
||||||
@@ -45,7 +45,7 @@ class NotificationControllerTest {
|
|||||||
p.setId(2L);
|
p.setId(2L);
|
||||||
n.setPost(p);
|
n.setPost(p);
|
||||||
n.setCreatedAt(LocalDateTime.now());
|
n.setCreatedAt(LocalDateTime.now());
|
||||||
when(notificationService.listNotifications("alice", null))
|
when(notificationService.listNotifications("alice", null, 0, 30))
|
||||||
.thenReturn(List.of(n));
|
.thenReturn(List.of(n));
|
||||||
|
|
||||||
NotificationDto dto = new NotificationDto();
|
NotificationDto dto = new NotificationDto();
|
||||||
@@ -62,6 +62,24 @@ class NotificationControllerTest {
|
|||||||
.andExpect(jsonPath("$[0].post.id").value(2));
|
.andExpect(jsonPath("$[0].post.id").value(2));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@Test
|
||||||
|
void listUnreadNotifications() throws Exception {
|
||||||
|
Notification n = new Notification();
|
||||||
|
n.setId(5L);
|
||||||
|
n.setType(NotificationType.POST_VIEWED);
|
||||||
|
when(notificationService.listNotifications("alice", false, 0, 30))
|
||||||
|
.thenReturn(List.of(n));
|
||||||
|
|
||||||
|
NotificationDto dto = new NotificationDto();
|
||||||
|
dto.setId(5L);
|
||||||
|
when(notificationMapper.toDto(n)).thenReturn(dto);
|
||||||
|
|
||||||
|
mockMvc.perform(get("/api/notifications/unread")
|
||||||
|
.principal(new UsernamePasswordAuthenticationToken("alice","p")))
|
||||||
|
.andExpect(status().isOk())
|
||||||
|
.andExpect(jsonPath("$[0].id").value(5));
|
||||||
|
}
|
||||||
|
|
||||||
@Test
|
@Test
|
||||||
void markReadEndpoint() throws Exception {
|
void markReadEndpoint() throws Exception {
|
||||||
mockMvc.perform(post("/api/notifications/read")
|
mockMvc.perform(post("/api/notifications/read")
|
||||||
|
|||||||
@@ -11,6 +11,9 @@ import org.mockito.Mockito;
|
|||||||
|
|
||||||
import java.util.List;
|
import java.util.List;
|
||||||
import java.util.Optional;
|
import java.util.Optional;
|
||||||
|
import java.util.HashSet;
|
||||||
|
import org.springframework.data.domain.PageImpl;
|
||||||
|
import org.springframework.data.domain.Pageable;
|
||||||
|
|
||||||
import static org.junit.jupiter.api.Assertions.*;
|
import static org.junit.jupiter.api.Assertions.*;
|
||||||
import static org.mockito.Mockito.*;
|
import static org.mockito.Mockito.*;
|
||||||
@@ -62,15 +65,17 @@ class NotificationServiceTest {
|
|||||||
User user = new User();
|
User user = new User();
|
||||||
user.setId(2L);
|
user.setId(2L);
|
||||||
user.setUsername("bob");
|
user.setUsername("bob");
|
||||||
|
user.setDisabledNotificationTypes(new HashSet<>());
|
||||||
when(uRepo.findByUsername("bob")).thenReturn(Optional.of(user));
|
when(uRepo.findByUsername("bob")).thenReturn(Optional.of(user));
|
||||||
|
|
||||||
Notification n = new Notification();
|
Notification n = new Notification();
|
||||||
when(nRepo.findByUserOrderByCreatedAtDesc(user)).thenReturn(List.of(n));
|
when(nRepo.findByUserOrderByCreatedAtDesc(eq(user), any(Pageable.class)))
|
||||||
|
.thenReturn(new PageImpl<>(List.of(n)));
|
||||||
|
|
||||||
List<Notification> list = service.listNotifications("bob", null);
|
List<Notification> list = service.listNotifications("bob", null, 0, 10);
|
||||||
|
|
||||||
assertEquals(1, list.size());
|
assertEquals(1, list.size());
|
||||||
verify(nRepo).findByUserOrderByCreatedAtDesc(user);
|
verify(nRepo).findByUserOrderByCreatedAtDesc(eq(user), any(Pageable.class));
|
||||||
}
|
}
|
||||||
|
|
||||||
@Test
|
@Test
|
||||||
@@ -87,6 +92,7 @@ class NotificationServiceTest {
|
|||||||
User user = new User();
|
User user = new User();
|
||||||
user.setId(3L);
|
user.setId(3L);
|
||||||
user.setUsername("carl");
|
user.setUsername("carl");
|
||||||
|
user.setDisabledNotificationTypes(new HashSet<>());
|
||||||
when(uRepo.findByUsername("carl")).thenReturn(Optional.of(user));
|
when(uRepo.findByUsername("carl")).thenReturn(Optional.of(user));
|
||||||
when(nRepo.countByUserAndRead(user, false)).thenReturn(5L);
|
when(nRepo.countByUserAndRead(user, false)).thenReturn(5L);
|
||||||
|
|
||||||
@@ -96,6 +102,56 @@ class NotificationServiceTest {
|
|||||||
verify(nRepo).countByUserAndRead(user, false);
|
verify(nRepo).countByUserAndRead(user, false);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@Test
|
||||||
|
void listNotificationsFiltersDisabledTypes() {
|
||||||
|
NotificationRepository nRepo = mock(NotificationRepository.class);
|
||||||
|
UserRepository uRepo = mock(UserRepository.class);
|
||||||
|
ReactionRepository rRepo = mock(ReactionRepository.class);
|
||||||
|
EmailSender email = mock(EmailSender.class);
|
||||||
|
PushNotificationService push = mock(PushNotificationService.class);
|
||||||
|
Executor executor = Runnable::run;
|
||||||
|
NotificationService service = new NotificationService(nRepo, uRepo, email, push, rRepo, executor);
|
||||||
|
org.springframework.test.util.ReflectionTestUtils.setField(service, "websiteUrl", "https://ex.com");
|
||||||
|
|
||||||
|
User user = new User();
|
||||||
|
user.setId(4L);
|
||||||
|
user.setUsername("dana");
|
||||||
|
when(uRepo.findByUsername("dana")).thenReturn(Optional.of(user));
|
||||||
|
|
||||||
|
Notification n = new Notification();
|
||||||
|
when(nRepo.findByUserAndTypeNotInOrderByCreatedAtDesc(eq(user), eq(user.getDisabledNotificationTypes()), any(Pageable.class)))
|
||||||
|
.thenReturn(new PageImpl<>(List.of(n)));
|
||||||
|
|
||||||
|
List<Notification> list = service.listNotifications("dana", null, 0, 10);
|
||||||
|
|
||||||
|
assertEquals(1, list.size());
|
||||||
|
verify(nRepo).findByUserAndTypeNotInOrderByCreatedAtDesc(eq(user), eq(user.getDisabledNotificationTypes()), any(Pageable.class));
|
||||||
|
}
|
||||||
|
|
||||||
|
@Test
|
||||||
|
void countUnreadFiltersDisabledTypes() {
|
||||||
|
NotificationRepository nRepo = mock(NotificationRepository.class);
|
||||||
|
UserRepository uRepo = mock(UserRepository.class);
|
||||||
|
ReactionRepository rRepo = mock(ReactionRepository.class);
|
||||||
|
EmailSender email = mock(EmailSender.class);
|
||||||
|
PushNotificationService push = mock(PushNotificationService.class);
|
||||||
|
Executor executor = Runnable::run;
|
||||||
|
NotificationService service = new NotificationService(nRepo, uRepo, email, push, rRepo, executor);
|
||||||
|
org.springframework.test.util.ReflectionTestUtils.setField(service, "websiteUrl", "https://ex.com");
|
||||||
|
|
||||||
|
User user = new User();
|
||||||
|
user.setId(5L);
|
||||||
|
user.setUsername("erin");
|
||||||
|
when(uRepo.findByUsername("erin")).thenReturn(Optional.of(user));
|
||||||
|
when(nRepo.countByUserAndReadAndTypeNotIn(eq(user), eq(false), eq(user.getDisabledNotificationTypes())))
|
||||||
|
.thenReturn(2L);
|
||||||
|
|
||||||
|
long count = service.countUnread("erin");
|
||||||
|
|
||||||
|
assertEquals(2L, count);
|
||||||
|
verify(nRepo).countByUserAndReadAndTypeNotIn(eq(user), eq(false), eq(user.getDisabledNotificationTypes()));
|
||||||
|
}
|
||||||
|
|
||||||
@Test
|
@Test
|
||||||
void createRegisterRequestNotificationsDeletesOldOnes() {
|
void createRegisterRequestNotificationsDeletesOldOnes() {
|
||||||
NotificationRepository nRepo = mock(NotificationRepository.class);
|
NotificationRepository nRepo = mock(NotificationRepository.class);
|
||||||
@@ -144,6 +200,30 @@ class NotificationServiceTest {
|
|||||||
verify(nRepo).save(any(Notification.class));
|
verify(nRepo).save(any(Notification.class));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@Test
|
||||||
|
void createPointRedeemNotificationsDeletesOldOnes() {
|
||||||
|
NotificationRepository nRepo = mock(NotificationRepository.class);
|
||||||
|
UserRepository uRepo = mock(UserRepository.class);
|
||||||
|
ReactionRepository rRepo = mock(ReactionRepository.class);
|
||||||
|
EmailSender email = mock(EmailSender.class);
|
||||||
|
PushNotificationService push = mock(PushNotificationService.class);
|
||||||
|
Executor executor = Runnable::run;
|
||||||
|
NotificationService service = new NotificationService(nRepo, uRepo, email, push, rRepo, executor);
|
||||||
|
org.springframework.test.util.ReflectionTestUtils.setField(service, "websiteUrl", "https://ex.com");
|
||||||
|
|
||||||
|
User admin = new User();
|
||||||
|
admin.setId(10L);
|
||||||
|
User user = new User();
|
||||||
|
user.setId(20L);
|
||||||
|
|
||||||
|
when(uRepo.findByRole(Role.ADMIN)).thenReturn(List.of(admin));
|
||||||
|
|
||||||
|
service.createPointRedeemNotifications(user, "contact");
|
||||||
|
|
||||||
|
verify(nRepo).deleteByTypeAndFromUser(NotificationType.POINT_REDEEM, user);
|
||||||
|
verify(nRepo).save(any(Notification.class));
|
||||||
|
}
|
||||||
|
|
||||||
@Test
|
@Test
|
||||||
void createNotificationSendsEmailForCommentReply() {
|
void createNotificationSendsEmailForCommentReply() {
|
||||||
NotificationRepository nRepo = mock(NotificationRepository.class);
|
NotificationRepository nRepo = mock(NotificationRepository.class);
|
||||||
|
|||||||
@@ -61,6 +61,58 @@ class PostServiceTest {
|
|||||||
verify(postRepo).delete(post);
|
verify(postRepo).delete(post);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@Test
|
||||||
|
void deletePostByAdminNotifiesAuthor() {
|
||||||
|
PostRepository postRepo = mock(PostRepository.class);
|
||||||
|
UserRepository userRepo = mock(UserRepository.class);
|
||||||
|
CategoryRepository catRepo = mock(CategoryRepository.class);
|
||||||
|
TagRepository tagRepo = mock(TagRepository.class);
|
||||||
|
LotteryPostRepository lotteryRepo = mock(LotteryPostRepository.class);
|
||||||
|
NotificationService notifService = mock(NotificationService.class);
|
||||||
|
SubscriptionService subService = mock(SubscriptionService.class);
|
||||||
|
CommentService commentService = mock(CommentService.class);
|
||||||
|
CommentRepository commentRepo = mock(CommentRepository.class);
|
||||||
|
ReactionRepository reactionRepo = mock(ReactionRepository.class);
|
||||||
|
PostSubscriptionRepository subRepo = mock(PostSubscriptionRepository.class);
|
||||||
|
NotificationRepository notificationRepo = mock(NotificationRepository.class);
|
||||||
|
PostReadService postReadService = mock(PostReadService.class);
|
||||||
|
ImageUploader imageUploader = mock(ImageUploader.class);
|
||||||
|
TaskScheduler taskScheduler = mock(TaskScheduler.class);
|
||||||
|
EmailSender emailSender = mock(EmailSender.class);
|
||||||
|
ApplicationContext context = mock(ApplicationContext.class);
|
||||||
|
|
||||||
|
PostService service = new PostService(postRepo, userRepo, catRepo, tagRepo, lotteryRepo,
|
||||||
|
notifService, subService, commentService, commentRepo,
|
||||||
|
reactionRepo, subRepo, notificationRepo, postReadService,
|
||||||
|
imageUploader, taskScheduler, emailSender, context, PublishMode.DIRECT);
|
||||||
|
when(context.getBean(PostService.class)).thenReturn(service);
|
||||||
|
|
||||||
|
Post post = new Post();
|
||||||
|
post.setId(1L);
|
||||||
|
post.setTitle("T");
|
||||||
|
post.setContent("");
|
||||||
|
User author = new User();
|
||||||
|
author.setId(2L);
|
||||||
|
author.setRole(Role.USER);
|
||||||
|
post.setAuthor(author);
|
||||||
|
|
||||||
|
User admin = new User();
|
||||||
|
admin.setId(1L);
|
||||||
|
admin.setRole(Role.ADMIN);
|
||||||
|
|
||||||
|
when(postRepo.findById(1L)).thenReturn(Optional.of(post));
|
||||||
|
when(userRepo.findByUsername("admin")).thenReturn(Optional.of(admin));
|
||||||
|
when(commentRepo.findByPostAndParentIsNullOrderByCreatedAtAsc(post)).thenReturn(List.of());
|
||||||
|
when(reactionRepo.findByPost(post)).thenReturn(List.of());
|
||||||
|
when(subRepo.findByPost(post)).thenReturn(List.of());
|
||||||
|
when(notificationRepo.findByPost(post)).thenReturn(List.of());
|
||||||
|
|
||||||
|
service.deletePost(1L, "admin");
|
||||||
|
|
||||||
|
verify(notifService).createNotification(eq(author), eq(NotificationType.POST_DELETED), isNull(),
|
||||||
|
isNull(), isNull(), eq(admin), isNull(), eq("T"));
|
||||||
|
}
|
||||||
|
|
||||||
@Test
|
@Test
|
||||||
void createPostRespectsRateLimit() {
|
void createPostRespectsRateLimit() {
|
||||||
PostRepository postRepo = mock(PostRepository.class);
|
PostRepository postRepo = mock(PostRepository.class);
|
||||||
|
|||||||
@@ -1,6 +1,15 @@
|
|||||||
|
; 本地部署后端
|
||||||
|
; NUXT_PUBLIC_API_BASE_URL=https://127.0.0.1:8081
|
||||||
|
; 预发环境后端
|
||||||
|
; NUXT_PUBLIC_API_BASE_URL=https://staging.open-isle.com
|
||||||
|
; 生产环境后端
|
||||||
NUXT_PUBLIC_API_BASE_URL=https://www.open-isle.com
|
NUXT_PUBLIC_API_BASE_URL=https://www.open-isle.com
|
||||||
|
|
||||||
|
; 预发环境
|
||||||
|
; NUXT_PUBLIC_WEBSITE_BASE_URL=https://staging.open-isle.com
|
||||||
|
; 正式环境/生产环境
|
||||||
NUXT_PUBLIC_WEBSITE_BASE_URL=https://www.open-isle.com
|
NUXT_PUBLIC_WEBSITE_BASE_URL=https://www.open-isle.com
|
||||||
NUXT_PUBLIC_GOOGLE_CLIENT_ID=777830451304-xxx.apps.googleusercontent.com
|
NUXT_PUBLIC_GOOGLE_CLIENT_ID=777830451304-nt8afkkap18gui4f9entcha99unal744.apps.googleusercontent.com
|
||||||
NUXT_PUBLIC_GITHUB_CLIENT_ID=Ov23liVkO1NPAX5JyWxJ
|
NUXT_PUBLIC_GITHUB_CLIENT_ID=Ov23liVkO1NPAX5JyWxJ
|
||||||
NUXT_PUBLIC_DISCORD_CLIENT_ID=1394985417044000779
|
NUXT_PUBLIC_DISCORD_CLIENT_ID=1394985417044000779
|
||||||
NUXT_PUBLIC_TWITTER_CLIENT_ID=ZTRTU05KSk9KTTJrTTdrVC1tc1E6MTpjaQ
|
NUXT_PUBLIC_TWITTER_CLIENT_ID=ZTRTU05KSk9KTTJrTTdrVC1tc1E6MTpjaQ
|
||||||
|
|||||||
16
frontend_nuxt/.env.staging.example
Normal file
16
frontend_nuxt/.env.staging.example
Normal file
@@ -0,0 +1,16 @@
|
|||||||
|
; 本地部署后端
|
||||||
|
; NUXT_PUBLIC_API_BASE_URL=https://127.0.0.1:8081
|
||||||
|
; 预发环境后端
|
||||||
|
NUXT_PUBLIC_API_BASE_URL=https://staging.open-isle.com
|
||||||
|
; 生产环境后端
|
||||||
|
; NUXT_PUBLIC_API_BASE_URL=https://www.open-isle.com
|
||||||
|
|
||||||
|
; 预发环境
|
||||||
|
NUXT_PUBLIC_WEBSITE_BASE_URL=https://staging.open-isle.com
|
||||||
|
; 正式环境/生产环境
|
||||||
|
; NUXT_PUBLIC_WEBSITE_BASE_URL=https://www.open-isle.com
|
||||||
|
|
||||||
|
NUXT_PUBLIC_GOOGLE_CLIENT_ID=777830451304-nt8afkkap18gui4f9entcha99unal744.apps.googleusercontent.com
|
||||||
|
NUXT_PUBLIC_GITHUB_CLIENT_ID=Ov23liVkO1NPAX5JyWxJ
|
||||||
|
NUXT_PUBLIC_DISCORD_CLIENT_ID=1394985417044000779
|
||||||
|
NUXT_PUBLIC_TWITTER_CLIENT_ID=ZTRTU05KSk9KTTJrTTdrVC1tc1E6MTpjaQ
|
||||||
@@ -15,62 +15,79 @@
|
|||||||
<div class="content" :class="{ 'menu-open': menuVisible && !hideMenu }">
|
<div class="content" :class="{ 'menu-open': menuVisible && !hideMenu }">
|
||||||
<NuxtPage keepalive />
|
<NuxtPage keepalive />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div v-if="showNewPostIcon && isMobile" class="app-new-post-icon" @click="goToNewPost">
|
||||||
|
<i class="fas fa-edit"></i>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<GlobalPopups />
|
<GlobalPopups />
|
||||||
|
<ConfirmDialog />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script setup>
|
||||||
import HeaderComponent from '~/components/HeaderComponent.vue'
|
import HeaderComponent from '~/components/HeaderComponent.vue'
|
||||||
import MenuComponent from '~/components/MenuComponent.vue'
|
import MenuComponent from '~/components/MenuComponent.vue'
|
||||||
|
|
||||||
import GlobalPopups from '~/components/GlobalPopups.vue'
|
import GlobalPopups from '~/components/GlobalPopups.vue'
|
||||||
|
import ConfirmDialog from '~/components/ConfirmDialog.vue'
|
||||||
|
import { useIsMobile } from '~/utils/screen'
|
||||||
|
|
||||||
export default {
|
const isMobile = useIsMobile()
|
||||||
name: 'App',
|
const menuVisible = ref(!isMobile.value)
|
||||||
components: { HeaderComponent, MenuComponent, GlobalPopups },
|
|
||||||
setup() {
|
|
||||||
const isMobile = useIsMobile()
|
|
||||||
const menuVisible = ref(!isMobile.value)
|
|
||||||
const hideMenu = computed(() => {
|
|
||||||
return [
|
|
||||||
'/login',
|
|
||||||
'/signup',
|
|
||||||
'/404',
|
|
||||||
'/signup-reason',
|
|
||||||
'/github-callback',
|
|
||||||
'/twitter-callback',
|
|
||||||
'/discord-callback',
|
|
||||||
'/forgot-password',
|
|
||||||
'/google-callback',
|
|
||||||
].includes(useRoute().path)
|
|
||||||
})
|
|
||||||
|
|
||||||
const header = useTemplateRef('header')
|
const showNewPostIcon = computed(() => useRoute().path === '/')
|
||||||
|
|
||||||
onMounted(() => {
|
const hideMenu = computed(() => {
|
||||||
if (typeof window !== 'undefined') {
|
return [
|
||||||
menuVisible.value = window.innerWidth > 768
|
'/login',
|
||||||
}
|
'/signup',
|
||||||
})
|
'/404',
|
||||||
|
'/signup-reason',
|
||||||
|
'/github-callback',
|
||||||
|
'/twitter-callback',
|
||||||
|
'/discord-callback',
|
||||||
|
'/forgot-password',
|
||||||
|
'/google-callback',
|
||||||
|
].includes(useRoute().path)
|
||||||
|
})
|
||||||
|
|
||||||
const handleMenuOutside = (event) => {
|
const header = useTemplateRef('header')
|
||||||
const btn = header.value.$refs.menuBtn
|
|
||||||
if (btn && (btn === event.target || btn.contains(event.target))) {
|
|
||||||
return // 如果是菜单按钮的点击,不处理关闭
|
|
||||||
}
|
|
||||||
|
|
||||||
if (isMobile.value) {
|
onMounted(() => {
|
||||||
menuVisible.value = false
|
if (typeof window !== 'undefined') {
|
||||||
}
|
menuVisible.value = window.innerWidth > 768
|
||||||
}
|
}
|
||||||
|
})
|
||||||
|
|
||||||
return { menuVisible, hideMenu, handleMenuOutside, header }
|
const handleMenuOutside = (event) => {
|
||||||
},
|
const btn = header.value.$refs.menuBtn
|
||||||
|
if (btn && (btn === event.target || btn.contains(event.target))) {
|
||||||
|
return // 如果是菜单按钮的点击,不处理关闭
|
||||||
|
}
|
||||||
|
|
||||||
|
if (isMobile.value) {
|
||||||
|
menuVisible.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const goToNewPost = () => {
|
||||||
|
navigateTo('/new-post', { replace: false })
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style src="~/assets/global.css"></style>
|
<style src="~/assets/global.css"></style>
|
||||||
<style>
|
<style>
|
||||||
|
/* 页面过渡效果 */
|
||||||
|
.page-enter-active,
|
||||||
|
.page-leave-active {
|
||||||
|
transition: all 0.4s;
|
||||||
|
}
|
||||||
|
.page-enter-from,
|
||||||
|
.page-leave-to {
|
||||||
|
opacity: 0;
|
||||||
|
filter: blur(10px);
|
||||||
|
}
|
||||||
|
|
||||||
.header-container {
|
.header-container {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top: 0;
|
top: 0;
|
||||||
@@ -103,6 +120,24 @@ export default {
|
|||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.app-new-post-icon {
|
||||||
|
background-color: var(--new-post-icon-color);
|
||||||
|
color: white;
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
border-radius: 50%;
|
||||||
|
position: fixed;
|
||||||
|
bottom: 40px;
|
||||||
|
right: 20px;
|
||||||
|
font-size: 20px;
|
||||||
|
cursor: pointer;
|
||||||
|
z-index: 1000;
|
||||||
|
display: flex;
|
||||||
|
backdrop-filter: var(--blur-5);
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
@media (max-width: 768px) {
|
@media (max-width: 768px) {
|
||||||
.content,
|
.content,
|
||||||
.content.menu-open {
|
.content.menu-open {
|
||||||
|
|||||||
@@ -2,27 +2,35 @@
|
|||||||
--primary-color-hover: rgb(9, 95, 105);
|
--primary-color-hover: rgb(9, 95, 105);
|
||||||
--primary-color: rgb(10, 110, 120);
|
--primary-color: rgb(10, 110, 120);
|
||||||
--primary-color-disabled: rgba(93, 152, 156, 0.5);
|
--primary-color-disabled: rgba(93, 152, 156, 0.5);
|
||||||
|
--new-post-icon-color: rgba(10, 111, 120, 0.598);
|
||||||
--header-height: 60px;
|
--header-height: 60px;
|
||||||
--header-background-color: white;
|
--header-background-color: white;
|
||||||
--header-border-color: lightgray;
|
--header-border-color: lightgray;
|
||||||
--header-text-color: black;
|
--header-text-color: black;
|
||||||
--menu-background-color: white;
|
--blur-1: blur(1px);
|
||||||
|
--blur-2: blur(2px);
|
||||||
|
--blur-4: blur(4px);
|
||||||
|
--blur-5: blur(5px);
|
||||||
|
--blur-10: blur(10px);
|
||||||
|
/* 加一个app前缀防止与firefox的userChrome.css中的--menu-background-color冲突 */
|
||||||
|
--app-menu-background-color: white;
|
||||||
--background-color: white;
|
--background-color: white;
|
||||||
/* --background-color-blur: rgba(255, 255, 255, 0.57); */
|
--background-color-blur: rgba(255, 255, 255, 0.57);
|
||||||
--background-color-blur: var(--background-color);
|
|
||||||
--menu-border-color: lightgray;
|
--menu-border-color: lightgray;
|
||||||
--normal-border-color: lightgray;
|
--normal-border-color: lightgray;
|
||||||
--menu-selected-background-color: rgba(208, 250, 255, 0.659);
|
--menu-selected-background-color: rgba(208, 250, 255, 0.659);
|
||||||
--menu-text-color: black;
|
--menu-text-color: black;
|
||||||
--scroller-background-color: rgba(130, 175, 180, 0.5);
|
--scroller-background-color: rgba(130, 175, 180, 0.5);
|
||||||
--normal-background-color: rgb(241, 241, 241);
|
/* --normal-background-color: rgb(241, 241, 241); */
|
||||||
|
--normal-background-color: white;
|
||||||
--lottery-background-color: rgb(241, 241, 241);
|
--lottery-background-color: rgb(241, 241, 241);
|
||||||
|
--code-highlight-background-color: rgb(241, 241, 241);
|
||||||
--login-background-color: rgb(248, 248, 248);
|
--login-background-color: rgb(248, 248, 248);
|
||||||
--login-background-color-hover: #e0e0e0;
|
--login-background-color-hover: #e0e0e0;
|
||||||
--text-color: black;
|
--text-color: black;
|
||||||
--blockquote-text-color: #6a737d;
|
--blockquote-text-color: #6a737d;
|
||||||
--menu-width: 200px;
|
--menu-width: 200px;
|
||||||
--page-max-width: 1200px;
|
--page-max-width: 1400px;
|
||||||
--page-max-width-mobile: 900px;
|
--page-max-width-mobile: 900px;
|
||||||
--article-info-background-color: #f0f0f0;
|
--article-info-background-color: #f0f0f0;
|
||||||
--activity-card-background-color: #fafafa;
|
--activity-card-background-color: #fafafa;
|
||||||
@@ -33,8 +41,9 @@
|
|||||||
--header-border-color: #555;
|
--header-border-color: #555;
|
||||||
--primary-color: rgb(17, 182, 197);
|
--primary-color: rgb(17, 182, 197);
|
||||||
--primary-color-hover: rgb(13, 137, 151);
|
--primary-color-hover: rgb(13, 137, 151);
|
||||||
|
--new-post-icon-color: rgba(10, 111, 120, 0.598);
|
||||||
--header-text-color: white;
|
--header-text-color: white;
|
||||||
--menu-background-color: #333;
|
--app-menu-background-color: #333;
|
||||||
--background-color: #333;
|
--background-color: #333;
|
||||||
/* --background-color-blur: #333333a4; */
|
/* --background-color-blur: #333333a4; */
|
||||||
--background-color-blur: var(--background-color);
|
--background-color-blur: var(--background-color);
|
||||||
@@ -42,8 +51,10 @@
|
|||||||
--normal-border-color: #555;
|
--normal-border-color: #555;
|
||||||
--menu-selected-background-color: rgba(255, 255, 255, 0.1);
|
--menu-selected-background-color: rgba(255, 255, 255, 0.1);
|
||||||
--menu-text-color: white;
|
--menu-text-color: white;
|
||||||
--normal-background-color: #000000;
|
/* --normal-background-color: #000000; */
|
||||||
|
--normal-background-color: #333;
|
||||||
--lottery-background-color: #4e4e4e;
|
--lottery-background-color: #4e4e4e;
|
||||||
|
--code-highlight-background-color: #262b35;
|
||||||
--login-background-color: #575757;
|
--login-background-color: #575757;
|
||||||
--login-background-color-hover: #717171;
|
--login-background-color-hover: #717171;
|
||||||
--text-color: #eee;
|
--text-color: #eee;
|
||||||
@@ -52,6 +63,15 @@
|
|||||||
--activity-card-background-color: #585858;
|
--activity-card-background-color: #585858;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
:root[data-frosted='off'] {
|
||||||
|
--blur-1: none;
|
||||||
|
--blur-2: none;
|
||||||
|
--blur-4: none;
|
||||||
|
--blur-5: none;
|
||||||
|
--blur-10: none;
|
||||||
|
--background-color-blur: var(--background-color);
|
||||||
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
@@ -70,7 +90,8 @@ body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.vditor-toolbar--pin {
|
.vditor-toolbar--pin {
|
||||||
top: var(--header-height) !important;
|
top: calc(var(--header-height) + 1px) !important;
|
||||||
|
z-index: 2000;
|
||||||
}
|
}
|
||||||
|
|
||||||
.vditor-panel {
|
.vditor-panel {
|
||||||
@@ -132,7 +153,7 @@ body {
|
|||||||
|
|
||||||
.info-content-text pre {
|
.info-content-text pre {
|
||||||
display: flex;
|
display: flex;
|
||||||
background-color: var(--lottery-background-color);
|
background-color: var(--code-highlight-background-color);
|
||||||
padding: 8px 12px;
|
padding: 8px 12px;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
line-height: 1.5;
|
line-height: 1.5;
|
||||||
@@ -163,8 +184,8 @@ body {
|
|||||||
font-family: 'Maple Mono', monospace;
|
font-family: 'Maple Mono', monospace;
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
white-space: no-wrap;
|
white-space: break-spaces;
|
||||||
background-color: var(--lottery-background-color);
|
background-color: var(--code-highlight-background-color);
|
||||||
color: var(--text-color);
|
color: var(--text-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -186,11 +207,13 @@ body {
|
|||||||
opacity: 1;
|
opacity: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.about-content a,
|
||||||
.info-content-text a {
|
.info-content-text a {
|
||||||
color: var(--primary-color);
|
color: var(--primary-color);
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.about-content a:hover,
|
||||||
.info-content-text a:hover {
|
.info-content-text a:hover {
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
}
|
}
|
||||||
@@ -297,6 +320,29 @@ body {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Transition API */
|
||||||
|
::view-transition-old(root),
|
||||||
|
::view-transition-new(root) {
|
||||||
|
animation: none;
|
||||||
|
mix-blend-mode: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
::view-transition-old(root) {
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
::view-transition-new(root) {
|
||||||
|
z-index: 2147483646;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme='dark']::view-transition-old(root) {
|
||||||
|
z-index: 2147483646;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme='dark']::view-transition-new(root) {
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
/* NProgress styles */
|
/* NProgress styles */
|
||||||
#nprogress {
|
#nprogress {
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
|
|||||||
@@ -41,8 +41,8 @@ export default {
|
|||||||
left: 0;
|
left: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
backdrop-filter: blur(2px);
|
backdrop-filter: var(--blur-2);
|
||||||
-webkit-backdrop-filter: blur(2px);
|
-webkit-backdrop-filter: var(--blur-2);
|
||||||
}
|
}
|
||||||
.popup-content {
|
.popup-content {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|||||||
65
frontend_nuxt/components/BaseSwitch.vue
Normal file
65
frontend_nuxt/components/BaseSwitch.vue
Normal file
@@ -0,0 +1,65 @@
|
|||||||
|
<template>
|
||||||
|
<label class="switch">
|
||||||
|
<input
|
||||||
|
type="checkbox"
|
||||||
|
:checked="modelValue"
|
||||||
|
@change="$emit('update:modelValue', $event.target.checked)"
|
||||||
|
/>
|
||||||
|
<span class="slider"></span>
|
||||||
|
</label>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
defineProps({
|
||||||
|
modelValue: { type: Boolean, default: false },
|
||||||
|
})
|
||||||
|
|
||||||
|
defineEmits(['update:modelValue'])
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.switch {
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
width: 40px;
|
||||||
|
height: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.switch input {
|
||||||
|
opacity: 0;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.slider {
|
||||||
|
position: absolute;
|
||||||
|
cursor: pointer;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
background-color: #ccc;
|
||||||
|
transition: 0.2s;
|
||||||
|
border-radius: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.slider:before {
|
||||||
|
position: absolute;
|
||||||
|
content: '';
|
||||||
|
height: 16px;
|
||||||
|
width: 16px;
|
||||||
|
left: 2px;
|
||||||
|
bottom: 2px;
|
||||||
|
background-color: white;
|
||||||
|
transition: 0.2s;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
input:checked + .slider {
|
||||||
|
background-color: var(--primary-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
input:checked + .slider:before {
|
||||||
|
transform: translateX(20px);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -22,6 +22,7 @@ import {
|
|||||||
getEditorTheme as getEditorThemeUtil,
|
getEditorTheme as getEditorThemeUtil,
|
||||||
getPreviewTheme as getPreviewThemeUtil,
|
getPreviewTheme as getPreviewThemeUtil,
|
||||||
} from '~/utils/vditor'
|
} from '~/utils/vditor'
|
||||||
|
import '~/assets/global.css'
|
||||||
import LoginOverlay from '~/components/LoginOverlay.vue'
|
import LoginOverlay from '~/components/LoginOverlay.vue'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
|||||||
@@ -16,11 +16,11 @@
|
|||||||
<div class="info-content-header-left">
|
<div class="info-content-header-left">
|
||||||
<span class="user-name">{{ comment.userName }}</span>
|
<span class="user-name">{{ comment.userName }}</span>
|
||||||
<i class="fas fa-medal medal-icon"></i>
|
<i class="fas fa-medal medal-icon"></i>
|
||||||
<router-link
|
<NuxtLink
|
||||||
v-if="comment.medal"
|
v-if="comment.medal"
|
||||||
class="medal-name"
|
class="medal-name"
|
||||||
:to="`/users/${comment.userId}?tab=achievements`"
|
:to="`/users/${comment.userId}?tab=achievements`"
|
||||||
>{{ getMedalTitle(comment.medal) }}</router-link
|
>{{ getMedalTitle(comment.medal) }}</NuxtLink
|
||||||
>
|
>
|
||||||
<i v-if="comment.pinned" class="fas fa-thumbtack pin-icon"></i>
|
<i v-if="comment.pinned" class="fas fa-thumbtack pin-icon"></i>
|
||||||
<span v-if="level >= 2">
|
<span v-if="level >= 2">
|
||||||
@@ -57,7 +57,7 @@
|
|||||||
v-if="showEditor"
|
v-if="showEditor"
|
||||||
@submit="submitReply"
|
@submit="submitReply"
|
||||||
:loading="isWaitingForReply"
|
:loading="isWaitingForReply"
|
||||||
:disabled="!loggedIn"
|
:disabled="!loggedIn || postClosed"
|
||||||
:show-login-overlay="!loggedIn"
|
:show-login-overlay="!loggedIn"
|
||||||
:parent-user-name="comment.userName"
|
:parent-user-name="comment.userName"
|
||||||
/>
|
/>
|
||||||
@@ -76,6 +76,7 @@
|
|||||||
:level="level + 1"
|
:level="level + 1"
|
||||||
:default-show-replies="item.openReplies"
|
:default-show-replies="item.openReplies"
|
||||||
:post-author-id="postAuthorId"
|
:post-author-id="postAuthorId"
|
||||||
|
:post-closed="postClosed"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
</BaseTimeline>
|
</BaseTimeline>
|
||||||
@@ -122,6 +123,10 @@ const props = defineProps({
|
|||||||
type: [Number, String],
|
type: [Number, String],
|
||||||
required: true,
|
required: true,
|
||||||
},
|
},
|
||||||
|
postClosed: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
})
|
})
|
||||||
|
|
||||||
const emit = defineEmits(['deleted'])
|
const emit = defineEmits(['deleted'])
|
||||||
@@ -148,6 +153,7 @@ const toggleReplies = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const toggleEditor = () => {
|
const toggleEditor = () => {
|
||||||
|
if (props.postClosed) return
|
||||||
showEditor.value = !showEditor.value
|
showEditor.value = !showEditor.value
|
||||||
if (showEditor.value) {
|
if (showEditor.value) {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
@@ -213,6 +219,10 @@ const deleteComment = async () => {
|
|||||||
}
|
}
|
||||||
const submitReply = async (parentUserName, text, clear) => {
|
const submitReply = async (parentUserName, text, clear) => {
|
||||||
if (!text.trim()) return
|
if (!text.trim()) return
|
||||||
|
if (props.postClosed) {
|
||||||
|
toast.error('帖子已关闭')
|
||||||
|
return
|
||||||
|
}
|
||||||
isWaitingForReply.value = true
|
isWaitingForReply.value = true
|
||||||
const token = getToken()
|
const token = getToken()
|
||||||
if (!token) {
|
if (!token) {
|
||||||
|
|||||||
71
frontend_nuxt/components/ConfirmDialog.vue
Normal file
71
frontend_nuxt/components/ConfirmDialog.vue
Normal file
@@ -0,0 +1,71 @@
|
|||||||
|
<template>
|
||||||
|
<BasePopup :visible="visible" @close="onCancel">
|
||||||
|
<div class="confirm-dialog" role="dialog" aria-modal="true">
|
||||||
|
<h3 class="confirm-title">{{ title }}</h3>
|
||||||
|
<p class="confirm-message">{{ message }}</p>
|
||||||
|
<div class="confirm-actions">
|
||||||
|
<div class="cancel-button" @click="onCancel">取消</div>
|
||||||
|
<div class="confirm-button" @click="onConfirm">确认</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</BasePopup>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import BasePopup from '~/components/BasePopup.vue'
|
||||||
|
import { useConfirm } from '~/composables/useConfirm'
|
||||||
|
|
||||||
|
const { visible, title, message, onConfirm, onCancel } = useConfirm()
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.confirm-dialog {
|
||||||
|
padding: 20px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.confirm-title {
|
||||||
|
margin-top: 0;
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
.confirm-message {
|
||||||
|
margin: 16px 0 20px;
|
||||||
|
line-height: 1.6;
|
||||||
|
color: var(--text-secondary, #666);
|
||||||
|
}
|
||||||
|
.confirm-actions {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
.confirm-button,
|
||||||
|
.cancel-button {
|
||||||
|
min-width: 88px;
|
||||||
|
height: 36px;
|
||||||
|
padding: 0 14px;
|
||||||
|
border-radius: 8px;
|
||||||
|
cursor: pointer;
|
||||||
|
border: 1px solid transparent;
|
||||||
|
}
|
||||||
|
.confirm-button {
|
||||||
|
background: var(--primary-color);
|
||||||
|
color: #fff;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.confirm-button:hover {
|
||||||
|
background: var(--primary-color-hover);
|
||||||
|
}
|
||||||
|
.cancel-button {
|
||||||
|
background: transparent;
|
||||||
|
color: var(--primary-color);
|
||||||
|
border-color: currentColor;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.cancel-button:hover {
|
||||||
|
opacity: 0.85;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -114,7 +114,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { ref, computed, watch, onMounted } from 'vue'
|
import { computed, onMounted, ref, watch } from 'vue'
|
||||||
import { useIsMobile } from '~/utils/screen'
|
import { useIsMobile } from '~/utils/screen'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
@@ -312,7 +312,7 @@ export default {
|
|||||||
border: none;
|
border: none;
|
||||||
outline: none;
|
outline: none;
|
||||||
margin-left: 5px;
|
margin-left: 5px;
|
||||||
background-color: var(--menu-background-color);
|
background-color: var(--app-menu-background-color);
|
||||||
color: var(--text-color);
|
color: var(--text-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -352,7 +352,7 @@ export default {
|
|||||||
left: 0;
|
left: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
background-color: var(--menu-background-color);
|
background-color: var(--app-menu-background-color);
|
||||||
z-index: 1300;
|
z-index: 1300;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|||||||
@@ -3,22 +3,24 @@
|
|||||||
<div class="dropdown-trigger" @click="toggle">
|
<div class="dropdown-trigger" @click="toggle">
|
||||||
<slot name="trigger"></slot>
|
<slot name="trigger"></slot>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="visible" class="dropdown-menu-container">
|
<Transition name="dropdown-menu">
|
||||||
<div
|
<div v-if="visible" class="dropdown-menu-container">
|
||||||
v-for="(item, idx) in items"
|
<div
|
||||||
:key="idx"
|
v-for="(item, idx) in items"
|
||||||
class="dropdown-item"
|
:key="idx"
|
||||||
:style="{ color: item.color || 'inherit' }"
|
class="dropdown-item"
|
||||||
@click="handle(item)"
|
:style="{ color: item.color || 'inherit' }"
|
||||||
>
|
@click="handle(item)"
|
||||||
{{ item.text }}
|
>
|
||||||
|
{{ item.text }}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</Transition>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { ref, onMounted, onBeforeUnmount } from 'vue'
|
import { onBeforeUnmount, onMounted, ref } from 'vue'
|
||||||
export default {
|
export default {
|
||||||
name: 'DropdownMenu',
|
name: 'DropdownMenu',
|
||||||
props: {
|
props: {
|
||||||
@@ -61,17 +63,28 @@ export default {
|
|||||||
position: relative;
|
position: relative;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dropdown-trigger {
|
.dropdown-trigger {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.dropdown-menu-enter-active,
|
||||||
|
.dropdown-menu-leave-active {
|
||||||
|
transition: all 0.4s;
|
||||||
|
}
|
||||||
|
.dropdown-menu-enter-from,
|
||||||
|
.dropdown-menu-leave-to {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateY(-16px);
|
||||||
|
}
|
||||||
|
|
||||||
.dropdown-menu-container {
|
.dropdown-menu-container {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 100%;
|
top: 100%;
|
||||||
right: 0;
|
right: 0;
|
||||||
background-color: var(--menu-background-color);
|
background-color: var(--app-menu-background-color);
|
||||||
border: 1px solid var(--normal-border-color);
|
border: 1px solid var(--normal-border-color);
|
||||||
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
|
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
@@ -82,7 +95,9 @@ export default {
|
|||||||
.dropdown-item {
|
.dropdown-item {
|
||||||
padding: 8px 16px;
|
padding: 8px 16px;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dropdown-item:hover {
|
.dropdown-item:hover {
|
||||||
background-color: var(--menu-selected-background-color);
|
background-color: var(--menu-selected-background-color);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -8,6 +8,13 @@
|
|||||||
/>
|
/>
|
||||||
<NotificationSettingPopup :visible="showNotificationPopup" @close="closeNotificationPopup" />
|
<NotificationSettingPopup :visible="showNotificationPopup" @close="closeNotificationPopup" />
|
||||||
<MedalPopup :visible="showMedalPopup" :medals="newMedals" @close="closeMedalPopup" />
|
<MedalPopup :visible="showMedalPopup" :medals="newMedals" @close="closeMedalPopup" />
|
||||||
|
|
||||||
|
<ActivityPopup
|
||||||
|
:visible="showInviteCodePopup"
|
||||||
|
:icon="inviteCodeIcon"
|
||||||
|
text="邀请码活动开始了,速来参与大伙们🔥🔥🔥"
|
||||||
|
@close="closeInviteCodePopup"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -21,7 +28,10 @@ const config = useRuntimeConfig()
|
|||||||
const API_BASE_URL = config.public.apiBaseUrl
|
const API_BASE_URL = config.public.apiBaseUrl
|
||||||
|
|
||||||
const showMilkTeaPopup = ref(false)
|
const showMilkTeaPopup = ref(false)
|
||||||
|
const showInviteCodePopup = ref(false)
|
||||||
const milkTeaIcon = ref('')
|
const milkTeaIcon = ref('')
|
||||||
|
const inviteCodeIcon = ref('')
|
||||||
|
|
||||||
const showNotificationPopup = ref(false)
|
const showNotificationPopup = ref(false)
|
||||||
const showMedalPopup = ref(false)
|
const showMedalPopup = ref(false)
|
||||||
const newMedals = ref([])
|
const newMedals = ref([])
|
||||||
@@ -30,6 +40,9 @@ onMounted(async () => {
|
|||||||
await checkMilkTeaActivity()
|
await checkMilkTeaActivity()
|
||||||
if (showMilkTeaPopup.value) return
|
if (showMilkTeaPopup.value) return
|
||||||
|
|
||||||
|
await checkInviteCodeActivity()
|
||||||
|
if (showInviteCodePopup.value) return
|
||||||
|
|
||||||
await checkNotificationSetting()
|
await checkNotificationSetting()
|
||||||
if (showNotificationPopup.value) return
|
if (showNotificationPopup.value) return
|
||||||
|
|
||||||
@@ -37,7 +50,7 @@ onMounted(async () => {
|
|||||||
})
|
})
|
||||||
|
|
||||||
const checkMilkTeaActivity = async () => {
|
const checkMilkTeaActivity = async () => {
|
||||||
if (!process.client) return
|
if (!import.meta.client) return
|
||||||
if (localStorage.getItem('milkTeaActivityPopupShown')) return
|
if (localStorage.getItem('milkTeaActivityPopupShown')) return
|
||||||
try {
|
try {
|
||||||
const res = await fetch(`${API_BASE_URL}/api/activities`)
|
const res = await fetch(`${API_BASE_URL}/api/activities`)
|
||||||
@@ -53,26 +66,50 @@ const checkMilkTeaActivity = async () => {
|
|||||||
// ignore network errors
|
// ignore network errors
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const checkInviteCodeActivity = async () => {
|
||||||
|
if (!import.meta.client) return
|
||||||
|
if (localStorage.getItem('inviteCodeActivityPopupShown')) return
|
||||||
|
try {
|
||||||
|
const res = await fetch(`${API_BASE_URL}/api/activities`)
|
||||||
|
if (res.ok) {
|
||||||
|
const list = await res.json()
|
||||||
|
const a = list.find((i) => i.type === 'INVITE_POINTS' && !i.ended)
|
||||||
|
if (a) {
|
||||||
|
inviteCodeIcon.value = a.icon
|
||||||
|
showInviteCodePopup.value = true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
// ignore network errors
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const closeInviteCodePopup = () => {
|
||||||
|
if (!import.meta.client) return
|
||||||
|
localStorage.setItem('inviteCodeActivityPopupShown', 'true')
|
||||||
|
showInviteCodePopup.value = false
|
||||||
|
}
|
||||||
|
|
||||||
const closeMilkTeaPopup = () => {
|
const closeMilkTeaPopup = () => {
|
||||||
if (!process.client) return
|
if (!import.meta.client) return
|
||||||
localStorage.setItem('milkTeaActivityPopupShown', 'true')
|
localStorage.setItem('milkTeaActivityPopupShown', 'true')
|
||||||
showMilkTeaPopup.value = false
|
showMilkTeaPopup.value = false
|
||||||
checkNotificationSetting()
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const checkNotificationSetting = async () => {
|
const checkNotificationSetting = async () => {
|
||||||
if (!process.client) return
|
if (!import.meta.client) return
|
||||||
if (!authState.loggedIn) return
|
if (!authState.loggedIn) return
|
||||||
if (localStorage.getItem('notificationSettingPopupShown')) return
|
if (localStorage.getItem('notificationSettingPopupShown')) return
|
||||||
showNotificationPopup.value = true
|
showNotificationPopup.value = true
|
||||||
}
|
}
|
||||||
const closeNotificationPopup = () => {
|
const closeNotificationPopup = () => {
|
||||||
if (!process.client) return
|
if (!import.meta.client) return
|
||||||
localStorage.setItem('notificationSettingPopupShown', 'true')
|
localStorage.setItem('notificationSettingPopupShown', 'true')
|
||||||
showNotificationPopup.value = false
|
showNotificationPopup.value = false
|
||||||
checkNewMedals()
|
|
||||||
}
|
}
|
||||||
const checkNewMedals = async () => {
|
const checkNewMedals = async () => {
|
||||||
if (!process.client) return
|
if (!import.meta.client) return
|
||||||
if (!authState.loggedIn || !authState.userId) return
|
if (!authState.loggedIn || !authState.userId) return
|
||||||
try {
|
try {
|
||||||
const res = await fetch(`${API_BASE_URL}/api/medals?userId=${authState.userId}`)
|
const res = await fetch(`${API_BASE_URL}/api/medals?userId=${authState.userId}`)
|
||||||
@@ -90,7 +127,7 @@ const checkNewMedals = async () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
const closeMedalPopup = () => {
|
const closeMedalPopup = () => {
|
||||||
if (!process.client) return
|
if (!import.meta.client) return
|
||||||
const seen = new Set(JSON.parse(localStorage.getItem('seenMedals') || '[]'))
|
const seen = new Set(JSON.parse(localStorage.getItem('seenMedals') || '[]'))
|
||||||
newMedals.value.forEach((m) => seen.add(m.type))
|
newMedals.value.forEach((m) => seen.add(m.type))
|
||||||
localStorage.setItem('seenMedals', JSON.stringify([...seen]))
|
localStorage.setItem('seenMedals', JSON.stringify([...seen]))
|
||||||
|
|||||||
@@ -8,7 +8,7 @@
|
|||||||
</button>
|
</button>
|
||||||
<span v-if="isMobile && unreadCount > 0" class="menu-unread-dot"></span>
|
<span v-if="isMobile && unreadCount > 0" class="menu-unread-dot"></span>
|
||||||
</div>
|
</div>
|
||||||
<NuxtLink class="logo-container" :to="`/`">
|
<NuxtLink class="logo-container" :to="`/`" @click="refrechData">
|
||||||
<img
|
<img
|
||||||
alt="OpenIsle"
|
alt="OpenIsle"
|
||||||
src="https://openisle-1307107697.cos.ap-guangzhou.myqcloud.com/assert/image.png"
|
src="https://openisle-1307107697.cos.ap-guangzhou.myqcloud.com/assert/image.png"
|
||||||
@@ -20,11 +20,34 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<ClientOnly>
|
<ClientOnly>
|
||||||
<div v-if="isLogin" class="header-content-right">
|
<div class="header-content-right">
|
||||||
<div v-if="isMobile" class="search-icon" @click="search">
|
<div v-if="isMobile" class="search-icon" @click="search">
|
||||||
<i class="fas fa-search"></i>
|
<i class="fas fa-search"></i>
|
||||||
</div>
|
</div>
|
||||||
<DropdownMenu ref="userMenu" :items="headerMenuItems">
|
|
||||||
|
<div v-if="isMobile" class="theme-icon" @click="cycleTheme">
|
||||||
|
<i :class="iconClass"></i>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div v-if="!isMobile" class="invite_text" @click="copyInviteLink">
|
||||||
|
<i class="fas fa-copy"></i>
|
||||||
|
邀请
|
||||||
|
<i v-if="isCopying" class="fas fa-spinner fa-spin"></i>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<ToolTip content="复制RSS链接" placement="bottom">
|
||||||
|
<div class="rss-icon" @click="copyRssLink">
|
||||||
|
<i class="fas fa-rss"></i>
|
||||||
|
</div>
|
||||||
|
</ToolTip>
|
||||||
|
|
||||||
|
<ToolTip v-if="!isMobile && isLogin" content="发帖" placement="bottom">
|
||||||
|
<div class="new-post-icon" @click="goToNewPost">
|
||||||
|
<i class="fas fa-edit"></i>
|
||||||
|
</div>
|
||||||
|
</ToolTip>
|
||||||
|
|
||||||
|
<DropdownMenu v-if="isLogin" ref="userMenu" :items="headerMenuItems">
|
||||||
<template #trigger>
|
<template #trigger>
|
||||||
<div class="avatar-container">
|
<div class="avatar-container">
|
||||||
<img class="avatar-img" :src="avatar" alt="avatar" />
|
<img class="avatar-img" :src="avatar" alt="avatar" />
|
||||||
@@ -32,14 +55,11 @@
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</DropdownMenu>
|
</DropdownMenu>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div v-else class="header-content-right">
|
<div v-if="!isLogin" class="auth-btns">
|
||||||
<div v-if="isMobile" class="search-icon" @click="search">
|
<div class="header-content-item-main" @click="goToLogin">登录</div>
|
||||||
<i class="fas fa-search"></i>
|
<div class="header-content-item-secondary" @click="goToSignup">注册</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="header-content-item-main" @click="goToLogin">登录</div>
|
|
||||||
<div class="header-content-item-secondary" @click="goToSignup">注册</div>
|
|
||||||
</div>
|
</div>
|
||||||
</ClientOnly>
|
</ClientOnly>
|
||||||
|
|
||||||
@@ -52,10 +72,18 @@
|
|||||||
import { ClientOnly } from '#components'
|
import { ClientOnly } from '#components'
|
||||||
import { computed, nextTick, ref, watch } from 'vue'
|
import { computed, nextTick, ref, watch } from 'vue'
|
||||||
import DropdownMenu from '~/components/DropdownMenu.vue'
|
import DropdownMenu from '~/components/DropdownMenu.vue'
|
||||||
|
import ToolTip from '~/components/ToolTip.vue'
|
||||||
import SearchDropdown from '~/components/SearchDropdown.vue'
|
import SearchDropdown from '~/components/SearchDropdown.vue'
|
||||||
import { authState, clearToken, loadCurrentUser } from '~/utils/auth'
|
import { authState, clearToken, loadCurrentUser } from '~/utils/auth'
|
||||||
import { fetchUnreadCount, notificationState } from '~/utils/notification'
|
import { fetchUnreadCount, notificationState } from '~/utils/notification'
|
||||||
import { useIsMobile } from '~/utils/screen'
|
import { useIsMobile } from '~/utils/screen'
|
||||||
|
import { themeState, cycleTheme, ThemeMode } from '~/utils/theme'
|
||||||
|
import { toast } from '~/main'
|
||||||
|
import { getToken } from '~/utils/auth'
|
||||||
|
const config = useRuntimeConfig()
|
||||||
|
const API_BASE_URL = config.public.apiBaseUrl
|
||||||
|
const WEBSITE_BASE_URL = config.public.websiteBaseUrl
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
showMenuBtn: {
|
showMenuBtn: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
@@ -71,6 +99,7 @@ const showSearch = ref(false)
|
|||||||
const searchDropdown = ref(null)
|
const searchDropdown = ref(null)
|
||||||
const userMenu = ref(null)
|
const userMenu = ref(null)
|
||||||
const menuBtn = ref(null)
|
const menuBtn = ref(null)
|
||||||
|
const isCopying = ref(false)
|
||||||
|
|
||||||
const search = () => {
|
const search = () => {
|
||||||
showSearch.value = true
|
showSearch.value = true
|
||||||
@@ -89,6 +118,41 @@ const goToLogin = () => {
|
|||||||
const goToSettings = () => {
|
const goToSettings = () => {
|
||||||
navigateTo('/settings', { replace: true })
|
navigateTo('/settings', { replace: true })
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const copyInviteLink = async () => {
|
||||||
|
isCopying.value = true
|
||||||
|
const token = getToken()
|
||||||
|
if (!token) {
|
||||||
|
toast.error('请先登录')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
try {
|
||||||
|
const res = await fetch(`${API_BASE_URL}/api/invite/generate`, {
|
||||||
|
method: 'POST',
|
||||||
|
headers: { Authorization: `Bearer ${token}` },
|
||||||
|
})
|
||||||
|
if (res.ok) {
|
||||||
|
const data = await res.json()
|
||||||
|
const inviteLink = data.token ? `${WEBSITE_BASE_URL}/signup?invite_token=${data.token}` : ''
|
||||||
|
await navigator.clipboard.writeText(inviteLink)
|
||||||
|
toast.success('邀请链接已复制')
|
||||||
|
} else {
|
||||||
|
const data = await res.json().catch(() => ({}))
|
||||||
|
toast.error(data.error || '生成邀请链接失败')
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
toast.error('生成邀请链接失败')
|
||||||
|
} finally {
|
||||||
|
isCopying.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const copyRssLink = async () => {
|
||||||
|
const rssLink = `${API_BASE_URL}/api/rss`
|
||||||
|
await navigator.clipboard.writeText(rssLink)
|
||||||
|
toast.success('RSS链接已复制')
|
||||||
|
}
|
||||||
|
|
||||||
const goToProfile = async () => {
|
const goToProfile = async () => {
|
||||||
if (!authState.loggedIn) {
|
if (!authState.loggedIn) {
|
||||||
navigateTo('/login', { replace: true })
|
navigateTo('/login', { replace: true })
|
||||||
@@ -113,12 +177,33 @@ const goToLogout = () => {
|
|||||||
navigateTo('/login', { replace: true })
|
navigateTo('/login', { replace: true })
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const goToNewPost = () => {
|
||||||
|
navigateTo('/new-post', { replace: false })
|
||||||
|
}
|
||||||
|
|
||||||
|
const refrechData = async () => {
|
||||||
|
await fetchUnreadCount()
|
||||||
|
window.dispatchEvent(new Event('refresh-home'))
|
||||||
|
}
|
||||||
|
|
||||||
const headerMenuItems = computed(() => [
|
const headerMenuItems = computed(() => [
|
||||||
{ text: '设置', onClick: goToSettings },
|
{ text: '设置', onClick: goToSettings },
|
||||||
{ text: '个人主页', onClick: goToProfile },
|
{ text: '个人主页', onClick: goToProfile },
|
||||||
{ text: '退出', onClick: goToLogout },
|
{ text: '退出', onClick: goToLogout },
|
||||||
])
|
])
|
||||||
|
|
||||||
|
/** 其余逻辑保持不变 */
|
||||||
|
const iconClass = computed(() => {
|
||||||
|
switch (themeState.mode) {
|
||||||
|
case ThemeMode.DARK:
|
||||||
|
return 'fas fa-moon'
|
||||||
|
case ThemeMode.LIGHT:
|
||||||
|
return 'fas fa-sun'
|
||||||
|
default:
|
||||||
|
return 'fas fa-desktop'
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
const updateAvatar = async () => {
|
const updateAvatar = async () => {
|
||||||
if (authState.loggedIn) {
|
if (authState.loggedIn) {
|
||||||
@@ -152,11 +237,11 @@ onMounted(async () => {
|
|||||||
<style scoped>
|
<style scoped>
|
||||||
.header {
|
.header {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
height: var(--header-height);
|
height: var(--header-height);
|
||||||
background-color: var(--background-color-blur);
|
background-color: var(--background-color-blur);
|
||||||
backdrop-filter: blur(10px);
|
backdrop-filter: var(--blur-10);
|
||||||
color: var(--header-text-color);
|
color: var(--header-text-color);
|
||||||
border-bottom: 1px solid var(--header-border-color);
|
border-bottom: 1px solid var(--header-border-color);
|
||||||
}
|
}
|
||||||
@@ -175,11 +260,10 @@ onMounted(async () => {
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
margin: 0 auto;
|
|
||||||
max-width: var(--page-max-width);
|
max-width: var(--page-max-width);
|
||||||
|
backdrop-filter: var(--blur-10);
|
||||||
}
|
}
|
||||||
|
|
||||||
.header-content-left {
|
.header-content-left {
|
||||||
@@ -189,6 +273,14 @@ onMounted(async () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.header-content-right {
|
.header-content-right {
|
||||||
|
display: flex;
|
||||||
|
margin-left: auto;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
gap: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.auth-btns {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@@ -270,11 +362,47 @@ onMounted(async () => {
|
|||||||
background-color: var(--menu-selected-background-color);
|
background-color: var(--menu-selected-background-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
.search-icon {
|
.search-icon,
|
||||||
|
.theme-icon {
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.invite_text {
|
||||||
|
font-size: 12px;
|
||||||
|
cursor: pointer;
|
||||||
|
color: var(--primary-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.invite_text:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rss-icon,
|
||||||
|
.new-post-icon {
|
||||||
|
font-size: 18px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rss-icon {
|
||||||
|
animation: rss-glow 2s 3;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes rss-glow {
|
||||||
|
0% {
|
||||||
|
text-shadow: 0 0 0px var(--primary-color);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
text-shadow: 0 0 12px var(--primary-color);
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
text-shadow: 0 0 0px var(--primary-color);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@media (max-width: 1200px) {
|
@media (max-width: 1200px) {
|
||||||
.header-content {
|
.header-content {
|
||||||
padding-left: 15px;
|
padding-left: 15px;
|
||||||
@@ -291,5 +419,9 @@ onMounted(async () => {
|
|||||||
.logo-text {
|
.logo-text {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.header-content-right {
|
||||||
|
gap: 15px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
102
frontend_nuxt/components/InfiniteLoadMore.vue
Normal file
102
frontend_nuxt/components/InfiniteLoadMore.vue
Normal file
@@ -0,0 +1,102 @@
|
|||||||
|
<template>
|
||||||
|
<!-- 当 done 后整个容器自动隐藏,不再占位 -->
|
||||||
|
<div v-show="!done" class="infinite-loadmore">
|
||||||
|
<div v-show="isLoading" class="loading-container bottom-loading" aria-live="polite">
|
||||||
|
<l-hatch size="28" stroke="4" speed="3.5" color="var(--primary-color)"></l-hatch>
|
||||||
|
</div>
|
||||||
|
<!-- 永久存在的底部触发器(由组件内部持有与观察) -->
|
||||||
|
<div ref="sentinel" class="load-more-trigger" aria-hidden="true"></div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { ref, onMounted, onBeforeUnmount, watch, nextTick } from 'vue'
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
/** 父组件提供:执行“加载下一页”的函数
|
||||||
|
* 返回:
|
||||||
|
* - boolean:true 表示“已经没有更多数据(done)”
|
||||||
|
* - { done: boolean }:同上
|
||||||
|
*/
|
||||||
|
onLoad: { type: Function, required: true },
|
||||||
|
/** pause=true 时暂停观察(例如首屏/筛选加载过程) */
|
||||||
|
pause: { type: Boolean, default: false },
|
||||||
|
/** 预取范围,默认 200px */
|
||||||
|
rootMargin: { type: String, default: '200px 0px' },
|
||||||
|
/** 触发阈值 */
|
||||||
|
threshold: { type: Number, default: 0 },
|
||||||
|
})
|
||||||
|
|
||||||
|
const isLoading = ref(false)
|
||||||
|
const done = ref(false)
|
||||||
|
const sentinel = ref(null)
|
||||||
|
let io = null
|
||||||
|
|
||||||
|
const stopObserver = () => {
|
||||||
|
if (io) {
|
||||||
|
io.disconnect()
|
||||||
|
io = null
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const startObserver = () => {
|
||||||
|
if (!import.meta.client || props.pause || done.value) return
|
||||||
|
stopObserver()
|
||||||
|
io = new IntersectionObserver(
|
||||||
|
async (entries) => {
|
||||||
|
const e = entries[0]
|
||||||
|
if (!e?.isIntersecting || isLoading.value || done.value) return
|
||||||
|
isLoading.value = true
|
||||||
|
try {
|
||||||
|
const res = await props.onLoad()
|
||||||
|
const finished = typeof res === 'boolean' ? res : !!(res && res.done)
|
||||||
|
if (finished) {
|
||||||
|
done.value = true
|
||||||
|
stopObserver()
|
||||||
|
}
|
||||||
|
} finally {
|
||||||
|
isLoading.value = false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{ root: null, rootMargin: props.rootMargin, threshold: props.threshold },
|
||||||
|
)
|
||||||
|
if (sentinel.value) io.observe(sentinel.value)
|
||||||
|
}
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
nextTick(startObserver)
|
||||||
|
})
|
||||||
|
onBeforeUnmount(stopObserver)
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => props.pause,
|
||||||
|
(p) => {
|
||||||
|
if (p) stopObserver()
|
||||||
|
else nextTick(startObserver)
|
||||||
|
},
|
||||||
|
)
|
||||||
|
|
||||||
|
/** 父组件可选择性调用,用于外部强制重置(一般直接用 :key 重建更简单) */
|
||||||
|
const reset = () => {
|
||||||
|
done.value = false
|
||||||
|
nextTick(startObserver)
|
||||||
|
}
|
||||||
|
defineExpose({ reset })
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.infinite-loadmore {
|
||||||
|
}
|
||||||
|
|
||||||
|
.loading-container {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
height: 100px; /* 与原样式匹配 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.load-more-trigger {
|
||||||
|
width: 100%;
|
||||||
|
height: 1px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
190
frontend_nuxt/components/InviteCodeActivityComponent.vue
Normal file
190
frontend_nuxt/components/InviteCodeActivityComponent.vue
Normal file
@@ -0,0 +1,190 @@
|
|||||||
|
<template>
|
||||||
|
<div class="invite-code-activity">
|
||||||
|
<div class="invite-code-description">
|
||||||
|
<div class="invite-code-description-title">
|
||||||
|
<i class="fas fa-info-circle"></i>
|
||||||
|
<span class="invite-code-description-title-text">邀请规则说明</span>
|
||||||
|
</div>
|
||||||
|
<div class="invite-code-description-content">
|
||||||
|
<p>⚠️邀请好友注册并登录,每次可以获得500积分🎉🎉🎉</p>
|
||||||
|
<p>邀请链接的有效期为1个月</p>
|
||||||
|
<p>每一个邀请链接的邀请人数上限为3人</p>
|
||||||
|
<p>通过邀请链接注册,无需注册审核</p>
|
||||||
|
<p>每人每天仅能生产1个邀请链接</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div v-if="inviteLink" class="invite-code-link-content">
|
||||||
|
<p class="invite-code-link-content-text">
|
||||||
|
邀请链接:{{ inviteLink }}
|
||||||
|
<span @click="copyLink"><i class="fas fa-copy copy-icon"></i></span>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div :class="['generate-button', { disabled: !user || loadingInvite }]" @click="generateInvite">
|
||||||
|
生成邀请链接
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { toast } from '~/main'
|
||||||
|
import { fetchCurrentUser, getToken } from '~/utils/auth'
|
||||||
|
|
||||||
|
const config = useRuntimeConfig()
|
||||||
|
const API_BASE_URL = config.public.apiBaseUrl
|
||||||
|
const WEBSITE_BASE_URL = config.public.websiteBaseUrl
|
||||||
|
|
||||||
|
const user = ref(null)
|
||||||
|
const isLoadingUser = ref(true)
|
||||||
|
const inviteCode = ref('')
|
||||||
|
const loadingInvite = ref(false)
|
||||||
|
|
||||||
|
const inviteLink = computed(() =>
|
||||||
|
inviteCode.value ? `${WEBSITE_BASE_URL}/signup?invite_token=${inviteCode.value}` : '',
|
||||||
|
)
|
||||||
|
|
||||||
|
onMounted(async () => {
|
||||||
|
isLoadingUser.value = true
|
||||||
|
user.value = await fetchCurrentUser()
|
||||||
|
isLoadingUser.value = false
|
||||||
|
// if (user.value) {
|
||||||
|
// await fetchInvite(false)
|
||||||
|
// }
|
||||||
|
})
|
||||||
|
|
||||||
|
const fetchInvite = async (showToast = true) => {
|
||||||
|
loadingInvite.value = true
|
||||||
|
const token = getToken()
|
||||||
|
if (!token) {
|
||||||
|
toast.error('请先登录')
|
||||||
|
loadingInvite.value = false
|
||||||
|
return
|
||||||
|
}
|
||||||
|
try {
|
||||||
|
const res = await fetch(`${API_BASE_URL}/api/invite/generate`, {
|
||||||
|
method: 'POST',
|
||||||
|
headers: { Authorization: `Bearer ${token}` },
|
||||||
|
})
|
||||||
|
if (res.ok) {
|
||||||
|
const data = await res.json()
|
||||||
|
inviteCode.value = data.token
|
||||||
|
if (showToast) toast.success('邀请链接已生成')
|
||||||
|
} else {
|
||||||
|
const data = await res.json().catch(() => ({}))
|
||||||
|
toast.error(data.error || '生成邀请链接失败')
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
toast.error('生成邀请链接失败')
|
||||||
|
} finally {
|
||||||
|
loadingInvite.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const generateInvite = () => fetchInvite(true)
|
||||||
|
|
||||||
|
const copyLink = async () => {
|
||||||
|
if (!inviteLink.value) return
|
||||||
|
try {
|
||||||
|
await navigator.clipboard.writeText(inviteLink.value)
|
||||||
|
toast.success('已复制')
|
||||||
|
} catch (e) {
|
||||||
|
toast.error('复制失败')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.invite-code-description-title-text {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: bold;
|
||||||
|
margin-left: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.invite-code-description-content {
|
||||||
|
font-size: 12px;
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.status-title {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.status-text {
|
||||||
|
font-size: 12px;
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.invite-code-activity {
|
||||||
|
margin-top: 20px;
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.generate-button {
|
||||||
|
margin-top: 20px;
|
||||||
|
background-color: var(--primary-color);
|
||||||
|
color: #fff;
|
||||||
|
padding: 8px 16px;
|
||||||
|
border-radius: 10px;
|
||||||
|
width: fit-content;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.generate-button:hover {
|
||||||
|
background-color: var(--primary-color-hover);
|
||||||
|
}
|
||||||
|
|
||||||
|
.generate-button.disabled {
|
||||||
|
background-color: var(--primary-color-disabled);
|
||||||
|
cursor: not-allowed;
|
||||||
|
}
|
||||||
|
|
||||||
|
.generate-button.disabled:hover {
|
||||||
|
background-color: var(--primary-color-disabled);
|
||||||
|
}
|
||||||
|
|
||||||
|
.invite-code-status-container {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
gap: 30px;
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.invite-code-status {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 4px;
|
||||||
|
margin-top: 10px;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-level-text {
|
||||||
|
opacity: 0.8;
|
||||||
|
font-size: 12px;
|
||||||
|
color: var(--primary-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.invite-code-link-content {
|
||||||
|
margin-top: 20px;
|
||||||
|
font-size: 12px;
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.invite-code-link-content-text {
|
||||||
|
word-break: break-all;
|
||||||
|
}
|
||||||
|
|
||||||
|
.copy-icon {
|
||||||
|
cursor: pointer;
|
||||||
|
margin-left: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 768px) {
|
||||||
|
.invite-code-status-container {
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: flex-start;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -35,7 +35,7 @@ const goLogin = () => {
|
|||||||
left: 0;
|
left: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
backdrop-filter: blur(4px);
|
backdrop-filter: var(--blur-4);
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -1,168 +1,195 @@
|
|||||||
<template>
|
<template>
|
||||||
<transition name="slide">
|
<transition name="slide">
|
||||||
<nav v-if="visible" class="menu">
|
<nav v-if="visible" class="menu">
|
||||||
<div class="menu-item-container">
|
<div class="menu-content">
|
||||||
<NuxtLink class="menu-item" exact-active-class="selected" to="/" @click="handleItemClick">
|
<div class="menu-item-container">
|
||||||
<i class="menu-item-icon fas fa-hashtag"></i>
|
<NuxtLink class="menu-item" exact-active-class="selected" to="/" @click="handleItemClick">
|
||||||
<span class="menu-item-text">话题</span>
|
<i class="menu-item-icon fas fa-hashtag"></i>
|
||||||
</NuxtLink>
|
<span class="menu-item-text">话题</span>
|
||||||
<NuxtLink
|
</NuxtLink>
|
||||||
class="menu-item"
|
<NuxtLink
|
||||||
exact-active-class="selected"
|
class="menu-item"
|
||||||
to="/message"
|
exact-active-class="selected"
|
||||||
@click="handleItemClick"
|
to="/new-post"
|
||||||
>
|
@click="handleItemClick"
|
||||||
<i class="menu-item-icon fas fa-envelope"></i>
|
|
||||||
<span class="menu-item-text">我的消息</span>
|
|
||||||
<span v-if="unreadCount > 0" class="unread-container">
|
|
||||||
<span class="unread"> {{ showUnreadCount }} </span>
|
|
||||||
</span>
|
|
||||||
</NuxtLink>
|
|
||||||
<NuxtLink
|
|
||||||
class="menu-item"
|
|
||||||
exact-active-class="selected"
|
|
||||||
to="/about"
|
|
||||||
@click="handleItemClick"
|
|
||||||
>
|
|
||||||
<i class="menu-item-icon fas fa-info-circle"></i>
|
|
||||||
<span class="menu-item-text">关于</span>
|
|
||||||
</NuxtLink>
|
|
||||||
<NuxtLink
|
|
||||||
class="menu-item"
|
|
||||||
exact-active-class="selected"
|
|
||||||
to="/activities"
|
|
||||||
@click="handleItemClick"
|
|
||||||
>
|
|
||||||
<i class="menu-item-icon fas fa-gift"></i>
|
|
||||||
<span class="menu-item-text">🔥 活动</span>
|
|
||||||
</NuxtLink>
|
|
||||||
<NuxtLink
|
|
||||||
v-if="shouldShowStats"
|
|
||||||
class="menu-item"
|
|
||||||
exact-active-class="selected"
|
|
||||||
to="/about/stats"
|
|
||||||
@click="handleItemClick"
|
|
||||||
>
|
|
||||||
<i class="menu-item-icon fas fa-chart-line"></i>
|
|
||||||
<span class="menu-item-text">站点统计</span>
|
|
||||||
</NuxtLink>
|
|
||||||
<NuxtLink
|
|
||||||
class="menu-item"
|
|
||||||
exact-active-class="selected"
|
|
||||||
to="/new-post"
|
|
||||||
@click="handleItemClick"
|
|
||||||
>
|
|
||||||
<i class="menu-item-icon fas fa-edit"></i>
|
|
||||||
<span class="menu-item-text">发帖</span>
|
|
||||||
</NuxtLink>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="menu-section">
|
|
||||||
<div class="section-header" @click="categoryOpen = !categoryOpen">
|
|
||||||
<span>类别</span>
|
|
||||||
<i :class="categoryOpen ? 'fas fa-chevron-up' : 'fas fa-chevron-down'"></i>
|
|
||||||
</div>
|
|
||||||
<div v-if="categoryOpen" class="section-items">
|
|
||||||
<div v-if="isLoadingCategory" class="menu-loading-container">
|
|
||||||
<l-hatch size="28" stroke="4" speed="3.5" color="var(--primary-color)"></l-hatch>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
v-else
|
|
||||||
v-for="c in categoryData"
|
|
||||||
:key="c.id"
|
|
||||||
class="section-item"
|
|
||||||
@click="gotoCategory(c)"
|
|
||||||
>
|
>
|
||||||
<template v-if="c.smallIcon || c.icon">
|
<i class="menu-item-icon fas fa-edit"></i>
|
||||||
<img
|
<span class="menu-item-text">发帖</span>
|
||||||
v-if="isImageIcon(c.smallIcon || c.icon)"
|
</NuxtLink>
|
||||||
:src="c.smallIcon || c.icon"
|
<NuxtLink
|
||||||
class="section-item-icon"
|
class="menu-item"
|
||||||
:alt="c.name"
|
exact-active-class="selected"
|
||||||
/>
|
to="/message"
|
||||||
<i v-else :class="['section-item-icon', c.smallIcon || c.icon]"></i>
|
@click="handleItemClick"
|
||||||
</template>
|
>
|
||||||
<span class="section-item-text">
|
<i class="menu-item-icon fas fa-envelope"></i>
|
||||||
{{ c.name }}
|
<span class="menu-item-text">我的消息</span>
|
||||||
<span class="section-item-text-count" v-if="c.count >= 0">x {{ c.count }}</span>
|
<span v-if="unreadCount > 0" class="unread-container">
|
||||||
|
<span class="unread"> {{ showUnreadCount }} </span>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</NuxtLink>
|
||||||
|
<NuxtLink
|
||||||
|
class="menu-item"
|
||||||
|
exact-active-class="selected"
|
||||||
|
to="/about"
|
||||||
|
@click="handleItemClick"
|
||||||
|
>
|
||||||
|
<i class="menu-item-icon fas fa-info-circle"></i>
|
||||||
|
<span class="menu-item-text">关于</span>
|
||||||
|
</NuxtLink>
|
||||||
|
<NuxtLink
|
||||||
|
class="menu-item"
|
||||||
|
exact-active-class="selected"
|
||||||
|
to="/activities"
|
||||||
|
@click="handleItemClick"
|
||||||
|
>
|
||||||
|
<i class="menu-item-icon fas fa-gift"></i>
|
||||||
|
<span class="menu-item-text">🔥 活动</span>
|
||||||
|
</NuxtLink>
|
||||||
|
<NuxtLink
|
||||||
|
v-if="shouldShowStats"
|
||||||
|
class="menu-item"
|
||||||
|
exact-active-class="selected"
|
||||||
|
to="/about/stats"
|
||||||
|
@click="handleItemClick"
|
||||||
|
>
|
||||||
|
<i class="menu-item-icon fas fa-chart-line"></i>
|
||||||
|
<span class="menu-item-text">站点统计</span>
|
||||||
|
</NuxtLink>
|
||||||
|
<NuxtLink
|
||||||
|
v-if="authState.loggedIn"
|
||||||
|
class="menu-item"
|
||||||
|
exact-active-class="selected"
|
||||||
|
to="/points"
|
||||||
|
@click="handleItemClick"
|
||||||
|
>
|
||||||
|
<i class="menu-item-icon fas fa-coins"></i>
|
||||||
|
<span class="menu-item-text">
|
||||||
|
积分商城
|
||||||
|
<span v-if="myPoint !== null" class="point-count">{{ myPoint }}</span>
|
||||||
|
</span>
|
||||||
|
</NuxtLink>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="menu-section">
|
<div class="menu-section">
|
||||||
<div class="section-header" @click="tagOpen = !tagOpen">
|
<div class="section-header" @click="categoryOpen = !categoryOpen">
|
||||||
<span>tag</span>
|
<span>类别</span>
|
||||||
<i :class="tagOpen ? 'fas fa-chevron-up' : 'fas fa-chevron-down'"></i>
|
<i :class="categoryOpen ? 'fas fa-chevron-up' : 'fas fa-chevron-down'"></i>
|
||||||
</div>
|
|
||||||
<div v-if="tagOpen" class="section-items">
|
|
||||||
<div v-if="isLoadingTag" class="menu-loading-container">
|
|
||||||
<l-hatch size="28" stroke="4" speed="3.5" color="var(--primary-color)"></l-hatch>
|
|
||||||
</div>
|
</div>
|
||||||
<div v-else v-for="t in tagData" :key="t.id" class="section-item" @click="gotoTag(t)">
|
<div v-if="categoryOpen" class="section-items">
|
||||||
<img
|
<div v-if="isLoadingCategory" class="menu-loading-container">
|
||||||
v-if="isImageIcon(t.smallIcon || t.icon)"
|
<l-hatch size="28" stroke="4" speed="3.5" color="var(--primary-color)"></l-hatch>
|
||||||
:src="t.smallIcon || t.icon"
|
</div>
|
||||||
class="section-item-icon"
|
<div
|
||||||
:alt="t.name"
|
v-else
|
||||||
/>
|
v-for="c in categoryData"
|
||||||
<i v-else class="section-item-icon fas fa-hashtag"></i>
|
:key="c.id"
|
||||||
<span class="section-item-text"
|
class="section-item"
|
||||||
>{{ t.name }} <span class="section-item-text-count">x {{ t.count }}</span></span
|
@click="gotoCategory(c)"
|
||||||
>
|
>
|
||||||
|
<template v-if="c.smallIcon || c.icon">
|
||||||
|
<img
|
||||||
|
v-if="isImageIcon(c.smallIcon || c.icon)"
|
||||||
|
:src="c.smallIcon || c.icon"
|
||||||
|
class="section-item-icon"
|
||||||
|
:alt="c.name"
|
||||||
|
/>
|
||||||
|
<i v-else :class="['section-item-icon', c.smallIcon || c.icon]"></i>
|
||||||
|
</template>
|
||||||
|
<span class="section-item-text">
|
||||||
|
{{ c.name }}
|
||||||
|
<span class="section-item-text-count" v-if="c.count >= 0">x {{ c.count }}</span>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="menu-section">
|
||||||
|
<div class="section-header" @click="tagOpen = !tagOpen">
|
||||||
|
<span>tag</span>
|
||||||
|
<i :class="tagOpen ? 'fas fa-chevron-up' : 'fas fa-chevron-down'"></i>
|
||||||
|
</div>
|
||||||
|
<div v-if="tagOpen" class="section-items">
|
||||||
|
<div v-if="isLoadingTag" class="menu-loading-container">
|
||||||
|
<l-hatch size="28" stroke="4" speed="3.5" color="var(--primary-color)"></l-hatch>
|
||||||
|
</div>
|
||||||
|
<div v-else v-for="t in tagData" :key="t.id" class="section-item" @click="gotoTag(t)">
|
||||||
|
<img
|
||||||
|
v-if="isImageIcon(t.smallIcon || t.icon)"
|
||||||
|
:src="t.smallIcon || t.icon"
|
||||||
|
class="section-item-icon"
|
||||||
|
:alt="t.name"
|
||||||
|
/>
|
||||||
|
<i v-else class="section-item-icon fas fa-hashtag"></i>
|
||||||
|
<span class="section-item-text"
|
||||||
|
>{{ t.name }} <span class="section-item-text-count">x {{ t.count }}</span></span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="menu-footer">
|
<!-- 解决动态样式的水合错误 -->
|
||||||
<div class="menu-footer-btn" @click="cycleTheme">
|
<ClientOnly v-if="!isMobile">
|
||||||
<i :class="iconClass"></i>
|
<div class="menu-footer">
|
||||||
|
<div class="menu-footer-btn" @click="cycleTheme">
|
||||||
|
<i :class="iconClass"></i>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</ClientOnly>
|
||||||
</nav>
|
</nav>
|
||||||
</transition>
|
</transition>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref, computed, watch, onMounted } from 'vue'
|
import { computed, onMounted, ref, watch } from 'vue'
|
||||||
import { themeState, cycleTheme, ThemeMode } from '~/utils/theme'
|
import { authState, fetchCurrentUser } from '~/utils/auth'
|
||||||
import { authState } from '~/utils/auth'
|
|
||||||
import { fetchUnreadCount, notificationState } from '~/utils/notification'
|
import { fetchUnreadCount, notificationState } from '~/utils/notification'
|
||||||
|
import { useIsMobile } from '~/utils/screen'
|
||||||
|
import { cycleTheme, ThemeMode, themeState } from '~/utils/theme'
|
||||||
|
|
||||||
|
const isMobile = useIsMobile()
|
||||||
|
|
||||||
const config = useRuntimeConfig()
|
const config = useRuntimeConfig()
|
||||||
const API_BASE_URL = config.public.apiBaseUrl
|
const API_BASE_URL = config.public.apiBaseUrl
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
visible: {
|
visible: { type: Boolean, default: true },
|
||||||
type: Boolean,
|
|
||||||
default: true,
|
|
||||||
},
|
|
||||||
})
|
})
|
||||||
|
|
||||||
const emit = defineEmits(['item-click'])
|
const emit = defineEmits(['item-click'])
|
||||||
|
|
||||||
const categoryOpen = ref(true)
|
const categoryOpen = ref(true)
|
||||||
const tagOpen = ref(true)
|
const tagOpen = ref(true)
|
||||||
const isLoadingCategory = ref(false)
|
const myPoint = ref(null)
|
||||||
const isLoadingTag = ref(false)
|
|
||||||
const categoryData = ref([])
|
|
||||||
const tagData = ref([])
|
|
||||||
|
|
||||||
const fetchCategoryData = async () => {
|
/** ✅ 用 useAsyncData 替换原生 fetch,避免 SSR+CSR 二次请求 */
|
||||||
isLoadingCategory.value = true
|
const {
|
||||||
const res = await fetch(`${API_BASE_URL}/api/categories`)
|
data: categoryData,
|
||||||
const data = await res.json()
|
pending: isLoadingCategory,
|
||||||
categoryData.value = data
|
error: categoryError,
|
||||||
isLoadingCategory.value = false
|
} = await useAsyncData(
|
||||||
}
|
// 稳定 key:避免 hydration 期误判
|
||||||
|
'menu:categories',
|
||||||
|
() => $fetch(`${API_BASE_URL}/api/categories`),
|
||||||
|
{
|
||||||
|
server: true, // SSR 预取
|
||||||
|
default: () => [], // 初始默认值,减少空判断
|
||||||
|
// 5 分钟内复用缓存,避免路由往返重复请求
|
||||||
|
staleTime: 5 * 60 * 1000,
|
||||||
|
},
|
||||||
|
)
|
||||||
|
|
||||||
const fetchTagData = async () => {
|
const {
|
||||||
isLoadingTag.value = true
|
data: tagData,
|
||||||
const res = await fetch(`${API_BASE_URL}/api/tags?limit=10`)
|
pending: isLoadingTag,
|
||||||
const data = await res.json()
|
error: tagError,
|
||||||
tagData.value = data
|
} = await useAsyncData('menu:tags', () => $fetch(`${API_BASE_URL}/api/tags?limit=10`), {
|
||||||
isLoadingTag.value = false
|
server: true,
|
||||||
}
|
default: () => [],
|
||||||
|
staleTime: 5 * 60 * 1000,
|
||||||
|
})
|
||||||
|
|
||||||
|
/** 其余逻辑保持不变 */
|
||||||
const iconClass = computed(() => {
|
const iconClass = computed(() => {
|
||||||
switch (themeState.mode) {
|
switch (themeState.mode) {
|
||||||
case ThemeMode.DARK:
|
case ThemeMode.DARK:
|
||||||
@@ -178,6 +205,15 @@ const unreadCount = computed(() => notificationState.unreadCount)
|
|||||||
const showUnreadCount = computed(() => (unreadCount.value > 99 ? '99+' : unreadCount.value))
|
const showUnreadCount = computed(() => (unreadCount.value > 99 ? '99+' : unreadCount.value))
|
||||||
const shouldShowStats = computed(() => authState.role === 'ADMIN')
|
const shouldShowStats = computed(() => authState.role === 'ADMIN')
|
||||||
|
|
||||||
|
const loadPoint = async () => {
|
||||||
|
if (authState.loggedIn) {
|
||||||
|
const user = await fetchCurrentUser()
|
||||||
|
myPoint.value = user ? user.point : null
|
||||||
|
} else {
|
||||||
|
myPoint.value = null
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
const updateCount = async () => {
|
const updateCount = async () => {
|
||||||
if (authState.loggedIn) {
|
if (authState.loggedIn) {
|
||||||
await fetchUnreadCount()
|
await fetchUnreadCount()
|
||||||
@@ -187,8 +223,15 @@ const updateCount = async () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
await updateCount()
|
await Promise.all([updateCount(), loadPoint()])
|
||||||
watch(() => authState.loggedIn, updateCount)
|
// 登录态变化时再拉一次未读数和积分;与 useAsyncData 无关
|
||||||
|
watch(
|
||||||
|
() => authState.loggedIn,
|
||||||
|
() => {
|
||||||
|
updateCount()
|
||||||
|
loadPoint()
|
||||||
|
},
|
||||||
|
)
|
||||||
})
|
})
|
||||||
|
|
||||||
const handleItemClick = () => {
|
const handleItemClick = () => {
|
||||||
@@ -211,28 +254,35 @@ const gotoTag = (t) => {
|
|||||||
navigateTo({ path: '/', query: { tags: value } }, { replace: true })
|
navigateTo({ path: '/', query: { tags: value } }, { replace: true })
|
||||||
handleItemClick()
|
handleItemClick()
|
||||||
}
|
}
|
||||||
|
|
||||||
await Promise.all([fetchCategoryData(), fetchTagData()])
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.menu {
|
.menu {
|
||||||
position: sticky;
|
position: sticky;
|
||||||
top: var(--header-height);
|
top: var(--header-height);
|
||||||
width: 200px;
|
width: 220px;
|
||||||
background-color: var(--menu-background-color);
|
background-color: var(--app-menu-background-color);
|
||||||
height: calc(100vh - 20px - var(--header-height));
|
height: calc(100vh - 20px - var(--header-height));
|
||||||
border-right: 1px solid var(--menu-border-color);
|
border-right: 1px solid var(--menu-border-color);
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
padding: 10px;
|
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
scrollbar-width: none;
|
scrollbar-width: none;
|
||||||
|
backdrop-filter: var(--blur-10);
|
||||||
}
|
}
|
||||||
|
|
||||||
.menu-item-container {
|
.menu-content {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
overflow-y: auto;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 10px 10px 0 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* .menu-item-container { */
|
||||||
|
/**/
|
||||||
|
/* } */
|
||||||
|
|
||||||
.menu-item {
|
.menu-item {
|
||||||
padding: 4px 10px;
|
padding: 4px 10px;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
@@ -271,6 +321,12 @@ await Promise.all([fetchCategoryData(), fetchTagData()])
|
|||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.point-count {
|
||||||
|
margin-left: 4px;
|
||||||
|
font-size: 12px;
|
||||||
|
color: var(--primary-color);
|
||||||
|
}
|
||||||
|
|
||||||
.menu-item-icon {
|
.menu-item-icon {
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
@@ -278,10 +334,8 @@ await Promise.all([fetchCategoryData(), fetchTagData()])
|
|||||||
}
|
}
|
||||||
|
|
||||||
.menu-footer {
|
.menu-footer {
|
||||||
position: fixed;
|
position: relation;
|
||||||
height: 30px;
|
height: 30px;
|
||||||
bottom: 10px;
|
|
||||||
right: 10px;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: flex-end;
|
justify-content: flex-end;
|
||||||
@@ -369,6 +423,10 @@ await Promise.all([fetchCategoryData(), fetchTagData()])
|
|||||||
background-color: var(--background-color-blur);
|
background-color: var(--background-color-blur);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.menu-content {
|
||||||
|
border-radius: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
.slide-enter-active,
|
.slide-enter-active,
|
||||||
.slide-leave-active {
|
.slide-leave-active {
|
||||||
transition:
|
transition:
|
||||||
|
|||||||
@@ -40,30 +40,22 @@
|
|||||||
兑换
|
兑换
|
||||||
</div>
|
</div>
|
||||||
<div v-else class="redeem-button disabled">兑换</div>
|
<div v-else class="redeem-button disabled">兑换</div>
|
||||||
<BasePopup :visible="dialogVisible" @close="closeDialog">
|
<RedeemPopup
|
||||||
<div class="redeem-dialog-content">
|
:visible="dialogVisible"
|
||||||
<BaseInput
|
v-model="contact"
|
||||||
textarea=""
|
:loading="loading"
|
||||||
rows="5"
|
@close="closeDialog"
|
||||||
v-model="contact"
|
@submit="submitRedeem"
|
||||||
placeholder="联系方式 (手机号/Email/微信/instagram/telegram等, 务必注明来源)"
|
/>
|
||||||
/>
|
|
||||||
<div class="redeem-actions">
|
|
||||||
<div class="redeem-submit-button" @click="submitRedeem" :disabled="loading">提交</div>
|
|
||||||
<div class="redeem-cancel-button" @click="closeDialog">取消</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</BasePopup>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { toast } from '~/main'
|
import { toast } from '~/main'
|
||||||
import { fetchCurrentUser, getToken } from '~/utils/auth'
|
import { fetchCurrentUser, getToken } from '~/utils/auth'
|
||||||
import BaseInput from '~/components/BaseInput.vue'
|
|
||||||
import BasePopup from '~/components/BasePopup.vue'
|
|
||||||
import LevelProgress from '~/components/LevelProgress.vue'
|
import LevelProgress from '~/components/LevelProgress.vue'
|
||||||
import ProgressBar from '~/components/ProgressBar.vue'
|
import ProgressBar from '~/components/ProgressBar.vue'
|
||||||
|
import RedeemPopup from '~/components/RedeemPopup.vue'
|
||||||
const config = useRuntimeConfig()
|
const config = useRuntimeConfig()
|
||||||
const API_BASE_URL = config.public.apiBaseUrl
|
const API_BASE_URL = config.public.apiBaseUrl
|
||||||
|
|
||||||
@@ -185,56 +177,6 @@ const submitRedeem = async () => {
|
|||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.redeem-dialog-content {
|
|
||||||
position: relative;
|
|
||||||
z-index: 2;
|
|
||||||
background-color: var(--background-color);
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
gap: 10px;
|
|
||||||
min-width: 400px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.redeem-actions {
|
|
||||||
margin-top: 10px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
justify-content: flex-end;
|
|
||||||
gap: 20px;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.redeem-submit-button {
|
|
||||||
background-color: var(--primary-color);
|
|
||||||
color: #fff;
|
|
||||||
padding: 10px 20px;
|
|
||||||
border-radius: 10px;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.redeem-submit-button:disabled {
|
|
||||||
background-color: var(--primary-color-disabled);
|
|
||||||
cursor: not-allowed;
|
|
||||||
}
|
|
||||||
|
|
||||||
.redeem-submit-button:hover {
|
|
||||||
background-color: var(--primary-color-hover);
|
|
||||||
}
|
|
||||||
|
|
||||||
.redeem-submit-button:disabled:hover {
|
|
||||||
background-color: var(--primary-color-disabled);
|
|
||||||
}
|
|
||||||
|
|
||||||
.redeem-cancel-button {
|
|
||||||
color: var(--primary-color);
|
|
||||||
border-radius: 10px;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.redeem-cancel-button:hover {
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
|
|
||||||
.user-level-text {
|
.user-level-text {
|
||||||
opacity: 0.8;
|
opacity: 0.8;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
@@ -247,9 +189,5 @@ const submitRedeem = async () => {
|
|||||||
align-items: flex-start;
|
align-items: flex-start;
|
||||||
gap: 10px;
|
gap: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.redeem-dialog-content {
|
|
||||||
min-width: 300px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -16,6 +16,7 @@ import {
|
|||||||
getEditorTheme as getEditorThemeUtil,
|
getEditorTheme as getEditorThemeUtil,
|
||||||
getPreviewTheme as getPreviewThemeUtil,
|
getPreviewTheme as getPreviewThemeUtil,
|
||||||
} from '~/utils/vditor'
|
} from '~/utils/vditor'
|
||||||
|
import '~/assets/global.css'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'PostEditor',
|
name: 'PostEditor',
|
||||||
|
|||||||
@@ -51,6 +51,10 @@ import { computed, onMounted, ref, watch } from 'vue'
|
|||||||
import { toast } from '~/main'
|
import { toast } from '~/main'
|
||||||
import { authState, getToken } from '~/utils/auth'
|
import { authState, getToken } from '~/utils/auth'
|
||||||
import { reactionEmojiMap } from '~/utils/reactions'
|
import { reactionEmojiMap } from '~/utils/reactions'
|
||||||
|
import { useReactionTypes } from '~/composables/useReactionTypes'
|
||||||
|
|
||||||
|
const { reactionTypes, initialize } = useReactionTypes()
|
||||||
|
|
||||||
const config = useRuntimeConfig()
|
const config = useRuntimeConfig()
|
||||||
const API_BASE_URL = config.public.apiBaseUrl
|
const API_BASE_URL = config.public.apiBaseUrl
|
||||||
const emit = defineEmits(['update:modelValue'])
|
const emit = defineEmits(['update:modelValue'])
|
||||||
@@ -66,30 +70,6 @@ watch(
|
|||||||
)
|
)
|
||||||
|
|
||||||
const reactions = ref(props.modelValue)
|
const reactions = ref(props.modelValue)
|
||||||
const reactionTypes = ref([])
|
|
||||||
|
|
||||||
let cachedTypes = null
|
|
||||||
const fetchTypes = async () => {
|
|
||||||
if (cachedTypes) return cachedTypes
|
|
||||||
try {
|
|
||||||
const token = getToken()
|
|
||||||
const res = await fetch(`${API_BASE_URL}/api/reaction-types`, {
|
|
||||||
headers: { Authorization: token ? `Bearer ${token}` : '' },
|
|
||||||
})
|
|
||||||
if (res.ok) {
|
|
||||||
cachedTypes = await res.json()
|
|
||||||
} else {
|
|
||||||
cachedTypes = []
|
|
||||||
}
|
|
||||||
} catch {
|
|
||||||
cachedTypes = []
|
|
||||||
}
|
|
||||||
return cachedTypes
|
|
||||||
}
|
|
||||||
|
|
||||||
onMounted(async () => {
|
|
||||||
reactionTypes.value = await fetchTypes()
|
|
||||||
})
|
|
||||||
|
|
||||||
const counts = computed(() => {
|
const counts = computed(() => {
|
||||||
const c = {}
|
const c = {}
|
||||||
@@ -200,6 +180,10 @@ const toggleReaction = async (type) => {
|
|||||||
toast.error('操作失败')
|
toast.error('操作失败')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
onMounted(async () => {
|
||||||
|
await initialize()
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
@@ -253,7 +237,7 @@ const toggleReaction = async (type) => {
|
|||||||
|
|
||||||
.make-reaction-item {
|
.make-reaction-item {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
padding: 10px;
|
padding: 4px;
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
|
|||||||
103
frontend_nuxt/components/RedeemPopup.vue
Normal file
103
frontend_nuxt/components/RedeemPopup.vue
Normal file
@@ -0,0 +1,103 @@
|
|||||||
|
<template>
|
||||||
|
<BasePopup :visible="visible" @close="onClose">
|
||||||
|
<div class="redeem-dialog-content">
|
||||||
|
<BaseInput
|
||||||
|
textarea
|
||||||
|
rows="5"
|
||||||
|
v-model="innerContact"
|
||||||
|
placeholder="联系方式 (手机号/Email/微信/instagram/telegram等, 务必注明来源)"
|
||||||
|
/>
|
||||||
|
<div class="redeem-actions">
|
||||||
|
<div class="redeem-submit-button" @click="submit" :disabled="loading">提交</div>
|
||||||
|
<div class="redeem-cancel-button" @click="onClose">取消</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</BasePopup>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { ref, watch } from 'vue'
|
||||||
|
import BaseInput from '~/components/BaseInput.vue'
|
||||||
|
import BasePopup from '~/components/BasePopup.vue'
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
visible: { type: Boolean, default: false },
|
||||||
|
loading: { type: Boolean, default: false },
|
||||||
|
modelValue: { type: String, default: '' },
|
||||||
|
})
|
||||||
|
const emit = defineEmits(['update:modelValue', 'submit', 'close'])
|
||||||
|
|
||||||
|
const innerContact = ref(props.modelValue)
|
||||||
|
watch(
|
||||||
|
() => props.modelValue,
|
||||||
|
(v) => {
|
||||||
|
innerContact.value = v
|
||||||
|
},
|
||||||
|
)
|
||||||
|
watch(innerContact, (v) => emit('update:modelValue', v))
|
||||||
|
|
||||||
|
const submit = () => {
|
||||||
|
emit('submit')
|
||||||
|
}
|
||||||
|
const onClose = () => {
|
||||||
|
emit('close')
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.redeem-dialog-content {
|
||||||
|
position: relative;
|
||||||
|
z-index: 2;
|
||||||
|
background-color: var(--background-color);
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 10px;
|
||||||
|
min-width: 400px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.redeem-actions {
|
||||||
|
margin-top: 10px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: flex-end;
|
||||||
|
gap: 20px;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.redeem-submit-button {
|
||||||
|
background-color: var(--primary-color);
|
||||||
|
color: #fff;
|
||||||
|
padding: 10px 20px;
|
||||||
|
border-radius: 10px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.redeem-submit-button:disabled {
|
||||||
|
background-color: var(--primary-color-disabled);
|
||||||
|
cursor: not-allowed;
|
||||||
|
}
|
||||||
|
|
||||||
|
.redeem-submit-button:hover {
|
||||||
|
background-color: var(--primary-color-hover);
|
||||||
|
}
|
||||||
|
|
||||||
|
.redeem-submit-button:disabled:hover {
|
||||||
|
background-color: var(--primary-color-disabled);
|
||||||
|
}
|
||||||
|
|
||||||
|
.redeem-cancel-button {
|
||||||
|
color: var(--primary-color);
|
||||||
|
border-radius: 10px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.redeem-cancel-button:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 768px) {
|
||||||
|
.redeem-dialog-content {
|
||||||
|
min-width: 300px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -37,10 +37,10 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { useIsMobile } from '~/utils/screen'
|
import { ref, watch } from 'vue'
|
||||||
import Dropdown from '~/components/Dropdown.vue'
|
import Dropdown from '~/components/Dropdown.vue'
|
||||||
import { stripMarkdown } from '~/utils/markdown'
|
import { stripMarkdown } from '~/utils/markdown'
|
||||||
import { ref, watch } from 'vue'
|
import { useIsMobile } from '~/utils/screen'
|
||||||
const config = useRuntimeConfig()
|
const config = useRuntimeConfig()
|
||||||
const API_BASE_URL = config.public.apiBaseUrl
|
const API_BASE_URL = config.public.apiBaseUrl
|
||||||
|
|
||||||
@@ -110,6 +110,10 @@ watch(selected, (val) => {
|
|||||||
selected.value = null
|
selected.value = null
|
||||||
keyword.value = ''
|
keyword.value = ''
|
||||||
})
|
})
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
toggle,
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
@@ -131,7 +135,7 @@ watch(selected, (val) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.text-input {
|
.text-input {
|
||||||
background-color: var(--menu-background-color);
|
background-color: var(--app-menu-background-color);
|
||||||
color: var(--text-color);
|
color: var(--text-color);
|
||||||
border: none;
|
border: none;
|
||||||
outline: none;
|
outline: none;
|
||||||
|
|||||||
@@ -63,7 +63,7 @@ const isImageIcon = (icon) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const buildTagsUrl = (kw = '') => {
|
const buildTagsUrl = (kw = '') => {
|
||||||
const base = API_BASE_URL || (process.client ? window.location.origin : '')
|
const base = API_BASE_URL || (import.meta.client ? window.location.origin : '')
|
||||||
const url = new URL('/api/tags', base)
|
const url = new URL('/api/tags', base)
|
||||||
|
|
||||||
if (kw) url.searchParams.set('keyword', kw)
|
if (kw) url.searchParams.set('keyword', kw)
|
||||||
|
|||||||
547
frontend_nuxt/components/ToolTip.vue
Normal file
547
frontend_nuxt/components/ToolTip.vue
Normal file
@@ -0,0 +1,547 @@
|
|||||||
|
<template>
|
||||||
|
<div class="tooltip-wrapper" ref="wrapperRef">
|
||||||
|
<!-- 触发器 -->
|
||||||
|
<div
|
||||||
|
class="tooltip-trigger"
|
||||||
|
:tabindex="focusable ? 0 : -1"
|
||||||
|
:aria-describedby="visible ? ariaId : undefined"
|
||||||
|
@mouseenter="onTriggerMouseEnter"
|
||||||
|
@mouseleave="onTriggerMouseLeave"
|
||||||
|
@click="onTriggerClick"
|
||||||
|
@focus="onTriggerFocus"
|
||||||
|
@blur="onTriggerBlur"
|
||||||
|
>
|
||||||
|
<slot />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 提示内容(Teleport 到 body) -->
|
||||||
|
<Teleport to="body" v-if="mounted">
|
||||||
|
<Transition name="tooltip-fade">
|
||||||
|
<div
|
||||||
|
v-show="visible"
|
||||||
|
:id="ariaId"
|
||||||
|
ref="tooltipRef"
|
||||||
|
class="tooltip-content"
|
||||||
|
:class="[
|
||||||
|
`tooltip-${currentPlacement}`,
|
||||||
|
dark ? 'tooltip-dark' : 'tooltip-light',
|
||||||
|
props.trigger === 'hover' ? 'tooltip-noninteractive' : '',
|
||||||
|
]"
|
||||||
|
:style="tooltipInlineStyle"
|
||||||
|
role="tooltip"
|
||||||
|
>
|
||||||
|
<div class="tooltip-inner">
|
||||||
|
<slot name="content">
|
||||||
|
{{ content }}
|
||||||
|
</slot>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 箭头 -->
|
||||||
|
<div
|
||||||
|
class="tooltip-arrow"
|
||||||
|
:class="`tooltip-arrow-${currentPlacement}`"
|
||||||
|
:style="arrowStyle"
|
||||||
|
></div>
|
||||||
|
</div>
|
||||||
|
</Transition>
|
||||||
|
</Teleport>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import {
|
||||||
|
ref,
|
||||||
|
computed,
|
||||||
|
onMounted,
|
||||||
|
onBeforeUnmount,
|
||||||
|
nextTick,
|
||||||
|
watch,
|
||||||
|
defineProps,
|
||||||
|
defineEmits,
|
||||||
|
defineOptions,
|
||||||
|
useId,
|
||||||
|
} from 'vue'
|
||||||
|
|
||||||
|
defineOptions({ name: 'Tooltip' })
|
||||||
|
|
||||||
|
type Trigger = 'hover' | 'click' | 'focus' | 'manual'
|
||||||
|
type Placement = 'top' | 'bottom' | 'left' | 'right'
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
content: { type: String, default: '' },
|
||||||
|
trigger: {
|
||||||
|
type: String as () => Trigger,
|
||||||
|
default: 'hover',
|
||||||
|
validator: (v: string) => ['hover', 'click', 'focus', 'manual'].includes(v),
|
||||||
|
},
|
||||||
|
placement: {
|
||||||
|
type: String as () => Placement,
|
||||||
|
default: 'top',
|
||||||
|
validator: (v: string) => ['top', 'bottom', 'left', 'right'].includes(v),
|
||||||
|
},
|
||||||
|
dark: { type: Boolean, default: false },
|
||||||
|
delay: { type: Number, default: 100 },
|
||||||
|
disabled: { type: Boolean, default: false },
|
||||||
|
focusable: { type: Boolean, default: true },
|
||||||
|
offset: { type: Number, default: 8 },
|
||||||
|
maxWidth: { type: [String, Number], default: '200px' },
|
||||||
|
/** 隐藏延时(毫秒),hover 离开后等待一点点以防抖 */
|
||||||
|
hideDelay: { type: Number, default: 80 },
|
||||||
|
})
|
||||||
|
|
||||||
|
const emit = defineEmits<{
|
||||||
|
(e: 'show'): void
|
||||||
|
(e: 'hide'): void
|
||||||
|
}>()
|
||||||
|
|
||||||
|
const wrapperRef = ref<HTMLElement | null>(null)
|
||||||
|
const tooltipRef = ref<HTMLElement | null>(null)
|
||||||
|
const visible = ref(false)
|
||||||
|
const currentPlacement = ref<Placement>(props.placement)
|
||||||
|
const ariaId = ref(`tooltip-${useId()}`)
|
||||||
|
const mounted = ref(false)
|
||||||
|
|
||||||
|
let showTimer: number | null = null
|
||||||
|
let hideTimer: number | null = null
|
||||||
|
let ro: ResizeObserver | null = null
|
||||||
|
let rafId: number | null = null
|
||||||
|
|
||||||
|
const maxWidthValue = computed(() => {
|
||||||
|
return typeof props.maxWidth === 'number' ? `${props.maxWidth}px` : props.maxWidth
|
||||||
|
})
|
||||||
|
|
||||||
|
const tooltipTransform = ref('translate3d(-9999px, -9999px, 0)')
|
||||||
|
|
||||||
|
const tooltipInlineStyle = computed(() => ({
|
||||||
|
position: 'fixed',
|
||||||
|
top: '0px',
|
||||||
|
left: '0px',
|
||||||
|
zIndex: 2000,
|
||||||
|
maxWidth: maxWidthValue.value,
|
||||||
|
transform: tooltipTransform.value,
|
||||||
|
}))
|
||||||
|
|
||||||
|
const arrowStyle = ref<Record<string, string>>({})
|
||||||
|
|
||||||
|
const clearTimers = () => {
|
||||||
|
if (showTimer) {
|
||||||
|
window.clearTimeout(showTimer)
|
||||||
|
showTimer = null
|
||||||
|
}
|
||||||
|
if (hideTimer) {
|
||||||
|
window.clearTimeout(hideTimer)
|
||||||
|
hideTimer = null
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const show = async () => {
|
||||||
|
if (props.disabled) return
|
||||||
|
clearTimers()
|
||||||
|
showTimer = window.setTimeout(async () => {
|
||||||
|
visible.value = true
|
||||||
|
emit('show')
|
||||||
|
await nextTick()
|
||||||
|
updatePosition()
|
||||||
|
}, props.delay)
|
||||||
|
}
|
||||||
|
|
||||||
|
const hide = () => {
|
||||||
|
clearTimers()
|
||||||
|
hideTimer = window.setTimeout(() => {
|
||||||
|
visible.value = false
|
||||||
|
emit('hide')
|
||||||
|
}, props.hideDelay)
|
||||||
|
}
|
||||||
|
|
||||||
|
const showImmediately = async () => {
|
||||||
|
if (props.disabled) return
|
||||||
|
clearTimers()
|
||||||
|
visible.value = true
|
||||||
|
emit('show')
|
||||||
|
await nextTick()
|
||||||
|
updatePosition()
|
||||||
|
}
|
||||||
|
const hideImmediately = () => {
|
||||||
|
clearTimers()
|
||||||
|
visible.value = false
|
||||||
|
emit('hide')
|
||||||
|
}
|
||||||
|
|
||||||
|
// 触发器事件
|
||||||
|
const onTriggerMouseEnter = () => {
|
||||||
|
if (props.trigger === 'hover') show()
|
||||||
|
}
|
||||||
|
const onTriggerMouseLeave = () => {
|
||||||
|
// 关键修改:hover 模式下,离开触发区即开始隐藏计时,不再保持可交互
|
||||||
|
if (props.trigger === 'hover') hide()
|
||||||
|
}
|
||||||
|
const onTriggerClick = () => {
|
||||||
|
if (props.trigger !== 'click') return
|
||||||
|
visible.value ? hideImmediately() : showImmediately()
|
||||||
|
}
|
||||||
|
const onTriggerFocus = () => {
|
||||||
|
if (props.trigger === 'focus') showImmediately()
|
||||||
|
}
|
||||||
|
const onTriggerBlur = () => {
|
||||||
|
if (props.trigger === 'focus') hideImmediately()
|
||||||
|
}
|
||||||
|
|
||||||
|
// 点击外部关闭(只对 click 模式)
|
||||||
|
const onClickOutside = (e: MouseEvent) => {
|
||||||
|
if (props.trigger !== 'click') return
|
||||||
|
const w = wrapperRef.value
|
||||||
|
const t = tooltipRef.value
|
||||||
|
const target = e.target as Node
|
||||||
|
if (w && !w.contains(target) && t && !t.contains(target)) {
|
||||||
|
hideImmediately()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 定位算法
|
||||||
|
function clamp(n: number, min: number, max: number) {
|
||||||
|
return Math.max(min, Math.min(max, n))
|
||||||
|
}
|
||||||
|
|
||||||
|
function computeBasePosition(
|
||||||
|
placement: Placement,
|
||||||
|
triggerRect: DOMRect,
|
||||||
|
tooltipRect: DOMRect,
|
||||||
|
offset: number,
|
||||||
|
) {
|
||||||
|
const centerX = triggerRect.left + triggerRect.width / 2
|
||||||
|
const centerY = triggerRect.top + triggerRect.height / 2
|
||||||
|
|
||||||
|
switch (placement) {
|
||||||
|
case 'top':
|
||||||
|
return {
|
||||||
|
top: triggerRect.top - tooltipRect.height - offset,
|
||||||
|
left: centerX - tooltipRect.width / 2,
|
||||||
|
}
|
||||||
|
case 'bottom':
|
||||||
|
return {
|
||||||
|
top: triggerRect.bottom + offset,
|
||||||
|
left: centerX - tooltipRect.width / 2,
|
||||||
|
}
|
||||||
|
case 'left':
|
||||||
|
return {
|
||||||
|
top: centerY - tooltipRect.height / 2,
|
||||||
|
left: triggerRect.left - tooltipRect.width - offset,
|
||||||
|
}
|
||||||
|
case 'right':
|
||||||
|
return {
|
||||||
|
top: centerY - tooltipRect.height / 2,
|
||||||
|
left: triggerRect.right + offset,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function positionWithSmartFlip(
|
||||||
|
preferred: Placement,
|
||||||
|
triggerRect: DOMRect,
|
||||||
|
tooltipRect: DOMRect,
|
||||||
|
offset: number,
|
||||||
|
) {
|
||||||
|
const padding = 8
|
||||||
|
const vw = window.innerWidth
|
||||||
|
const vh = window.innerHeight
|
||||||
|
|
||||||
|
let placement: Placement = preferred
|
||||||
|
let { top, left } = computeBasePosition(placement, triggerRect, tooltipRect, offset)!
|
||||||
|
|
||||||
|
const outTop = top < padding
|
||||||
|
const outBottom = top + tooltipRect.height > vh - padding
|
||||||
|
const outLeft = left < padding
|
||||||
|
const outRight = left + tooltipRect.width > vw - padding
|
||||||
|
|
||||||
|
if (
|
||||||
|
placement === 'top' &&
|
||||||
|
outTop &&
|
||||||
|
triggerRect.bottom + offset + tooltipRect.height <= vh - padding
|
||||||
|
) {
|
||||||
|
placement = 'bottom'
|
||||||
|
;({ top, left } = computeBasePosition(placement, triggerRect, tooltipRect, offset)!)
|
||||||
|
} else if (
|
||||||
|
placement === 'bottom' &&
|
||||||
|
outBottom &&
|
||||||
|
triggerRect.top - offset - tooltipRect.height >= padding
|
||||||
|
) {
|
||||||
|
placement = 'top'
|
||||||
|
;({ top, left } = computeBasePosition(placement, triggerRect, tooltipRect, offset)!)
|
||||||
|
} else if (
|
||||||
|
placement === 'left' &&
|
||||||
|
outLeft &&
|
||||||
|
triggerRect.right + offset + tooltipRect.width <= vw - padding
|
||||||
|
) {
|
||||||
|
placement = 'right'
|
||||||
|
;({ top, left } = computeBasePosition(placement, triggerRect, tooltipRect, offset)!)
|
||||||
|
} else if (
|
||||||
|
placement === 'right' &&
|
||||||
|
outRight &&
|
||||||
|
triggerRect.left - offset - tooltipRect.width >= padding
|
||||||
|
) {
|
||||||
|
placement = 'left'
|
||||||
|
;({ top, left } = computeBasePosition(placement, triggerRect, tooltipRect, offset)!)
|
||||||
|
}
|
||||||
|
|
||||||
|
top = clamp(top, padding, vh - tooltipRect.height - padding)
|
||||||
|
left = clamp(left, padding, vw - tooltipRect.width - padding)
|
||||||
|
|
||||||
|
const triggerCenterX = triggerRect.left + triggerRect.width / 2
|
||||||
|
const triggerCenterY = triggerRect.top + triggerRect.height / 2
|
||||||
|
const arrowLeft = clamp(triggerCenterX - left, 10, tooltipRect.width - 10)
|
||||||
|
const arrowTop = clamp(triggerCenterY - top, 10, tooltipRect.height - 10)
|
||||||
|
|
||||||
|
return { placement, top, left, arrowLeft, arrowTop }
|
||||||
|
}
|
||||||
|
|
||||||
|
const updatePosition = () => {
|
||||||
|
if (!wrapperRef.value || !tooltipRef.value || !visible.value) return
|
||||||
|
if (rafId) cancelAnimationFrame(rafId)
|
||||||
|
rafId = requestAnimationFrame(() => {
|
||||||
|
const triggerEl = wrapperRef.value!.querySelector('.tooltip-trigger') as HTMLElement | null
|
||||||
|
const tooltipEl = tooltipRef.value!
|
||||||
|
if (!triggerEl) return
|
||||||
|
|
||||||
|
const triggerRect = triggerEl.getBoundingClientRect()
|
||||||
|
const tooltipRect = tooltipEl.getBoundingClientRect()
|
||||||
|
const { placement, top, left, arrowLeft, arrowTop } = positionWithSmartFlip(
|
||||||
|
props.placement,
|
||||||
|
triggerRect,
|
||||||
|
tooltipRect,
|
||||||
|
props.offset,
|
||||||
|
)
|
||||||
|
|
||||||
|
currentPlacement.value = placement
|
||||||
|
tooltipTransform.value = `translate3d(${Math.round(left)}px, ${Math.round(top)}px, 0)`
|
||||||
|
if (placement === 'top' || placement === 'bottom') {
|
||||||
|
arrowStyle.value = { '--arrow-left': `${Math.round(arrowLeft)}px` } as any
|
||||||
|
} else {
|
||||||
|
arrowStyle.value = { '--arrow-top': `${Math.round(arrowTop)}px` } as any
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const onEnvChanged = () => {
|
||||||
|
if (visible.value) updatePosition()
|
||||||
|
}
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => props.disabled,
|
||||||
|
(v) => {
|
||||||
|
if (v && visible.value) hideImmediately()
|
||||||
|
},
|
||||||
|
)
|
||||||
|
watch(
|
||||||
|
() => props.placement,
|
||||||
|
() => {
|
||||||
|
if (visible.value) nextTick(updatePosition)
|
||||||
|
},
|
||||||
|
)
|
||||||
|
watch(visible, (v) => {
|
||||||
|
if (!mounted.value) return
|
||||||
|
if (v) {
|
||||||
|
if ('ResizeObserver' in window && !ro) {
|
||||||
|
ro = new ResizeObserver(() => updatePosition())
|
||||||
|
if (tooltipRef.value) ro.observe(tooltipRef.value)
|
||||||
|
const triggerEl = wrapperRef.value?.querySelector('.tooltip-trigger') as HTMLElement | null
|
||||||
|
if (triggerEl) ro.observe(triggerEl)
|
||||||
|
}
|
||||||
|
updatePosition()
|
||||||
|
} else {
|
||||||
|
if (ro) {
|
||||||
|
ro.disconnect()
|
||||||
|
ro = null
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
mounted.value = true
|
||||||
|
window.addEventListener('resize', onEnvChanged, { passive: true })
|
||||||
|
window.addEventListener('scroll', onEnvChanged, { passive: true, capture: true })
|
||||||
|
document.addEventListener('click', onClickOutside, true)
|
||||||
|
})
|
||||||
|
|
||||||
|
onBeforeUnmount(() => {
|
||||||
|
clearTimers()
|
||||||
|
if (rafId) cancelAnimationFrame(rafId)
|
||||||
|
if (ro) {
|
||||||
|
ro.disconnect()
|
||||||
|
ro = null
|
||||||
|
}
|
||||||
|
document.removeEventListener('click', onClickOutside, true)
|
||||||
|
window.removeEventListener('resize', onEnvChanged)
|
||||||
|
window.removeEventListener('scroll', onEnvChanged, true)
|
||||||
|
})
|
||||||
|
|
||||||
|
// 暴露给父组件(manual 可用)
|
||||||
|
defineExpose({ show: showImmediately, hide: hideImmediately, updatePosition })
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.tooltip-wrapper {
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
.tooltip-trigger {
|
||||||
|
display: inline-block;
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
.tooltip-trigger:focus-visible {
|
||||||
|
outline: 2px solid var(--primary-color);
|
||||||
|
outline-offset: 2px;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tooltip-content {
|
||||||
|
will-change: transform;
|
||||||
|
pointer-events: auto; /* 默认允许交互(click/focus 模式) */
|
||||||
|
}
|
||||||
|
.tooltip-noninteractive {
|
||||||
|
/* hover 模式下禁用指针事件,避免移入浮层导致保持显示 */
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tooltip-inner {
|
||||||
|
padding: 8px 12px;
|
||||||
|
border-radius: 6px;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 1.4;
|
||||||
|
word-wrap: break-word;
|
||||||
|
border: 1px solid transparent;
|
||||||
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 主题 */
|
||||||
|
.tooltip-light .tooltip-inner {
|
||||||
|
background-color: var(--background-color);
|
||||||
|
color: var(--text-color);
|
||||||
|
border-color: var(--normal-border-color);
|
||||||
|
}
|
||||||
|
.tooltip-dark .tooltip-inner {
|
||||||
|
background-color: rgba(0, 0, 0, 0.9);
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 箭头(用 CSS 变量控制偏移) */
|
||||||
|
.tooltip-arrow {
|
||||||
|
position: absolute;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
border-style: solid;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 顶部 */
|
||||||
|
.tooltip-top .tooltip-arrow-top {
|
||||||
|
bottom: -6px;
|
||||||
|
left: var(--arrow-left, 50%);
|
||||||
|
transform: translateX(-50%);
|
||||||
|
border-width: 6px 6px 0 6px;
|
||||||
|
}
|
||||||
|
.tooltip-light.tooltip-top .tooltip-arrow-top {
|
||||||
|
border-color: var(--normal-border-color) transparent transparent transparent;
|
||||||
|
}
|
||||||
|
.tooltip-light.tooltip-top .tooltip-arrow-top::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: -7px;
|
||||||
|
left: -6px;
|
||||||
|
border-width: 6px 6px 0 6px;
|
||||||
|
border-style: solid;
|
||||||
|
border-color: var(--background-color) transparent transparent transparent;
|
||||||
|
}
|
||||||
|
.tooltip-dark.tooltip-top .tooltip-arrow-top {
|
||||||
|
border-color: rgba(0, 0, 0, 0.9) transparent transparent transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 底部 */
|
||||||
|
.tooltip-bottom .tooltip-arrow-bottom {
|
||||||
|
top: -6px;
|
||||||
|
left: var(--arrow-left, 50%);
|
||||||
|
transform: translateX(-50%);
|
||||||
|
border-width: 0 6px 6px 6px;
|
||||||
|
}
|
||||||
|
.tooltip-light.tooltip-bottom .tooltip-arrow-bottom {
|
||||||
|
border-color: transparent transparent var(--normal-border-color) transparent;
|
||||||
|
}
|
||||||
|
.tooltip-light.tooltip-bottom .tooltip-arrow-bottom::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 1px;
|
||||||
|
left: -6px;
|
||||||
|
border-width: 0 6px 6px 6px;
|
||||||
|
border-style: solid;
|
||||||
|
border-color: transparent transparent var(--background-color) transparent;
|
||||||
|
}
|
||||||
|
.tooltip-dark.tooltip-bottom .tooltip-arrow-bottom {
|
||||||
|
border-color: transparent transparent rgba(0, 0, 0, 0.9) transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 左侧 */
|
||||||
|
.tooltip-left .tooltip-arrow-left {
|
||||||
|
right: -6px;
|
||||||
|
top: var(--arrow-top, 50%);
|
||||||
|
transform: translateY(-50%);
|
||||||
|
border-width: 6px 0 6px 6px;
|
||||||
|
}
|
||||||
|
.tooltip-light.tooltip-left .tooltip-arrow-left {
|
||||||
|
border-color: transparent transparent transparent var(--normal-border-color);
|
||||||
|
}
|
||||||
|
.tooltip-light.tooltip-left .tooltip-arrow-left::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: -6px;
|
||||||
|
left: -7px;
|
||||||
|
border-width: 6px 0 6px 6px;
|
||||||
|
border-style: solid;
|
||||||
|
border-color: transparent transparent transparent var(--background-color);
|
||||||
|
}
|
||||||
|
.tooltip-dark.tooltip-left .tooltip-arrow-left {
|
||||||
|
border-color: transparent transparent transparent rgba(0, 0, 0, 0.9);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 右侧 */
|
||||||
|
.tooltip-right .tooltip-arrow-right {
|
||||||
|
left: -6px;
|
||||||
|
top: var(--arrow-top, 50%);
|
||||||
|
transform: translateY(-50%);
|
||||||
|
border-width: 6px 6px 6px 0;
|
||||||
|
}
|
||||||
|
.tooltip-light.tooltip-right .tooltip-arrow-right {
|
||||||
|
border-color: transparent var(--normal-border-color) transparent transparent;
|
||||||
|
}
|
||||||
|
.tooltip-light.tooltip-right .tooltip-arrow-right::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: -6px;
|
||||||
|
left: 1px;
|
||||||
|
border-width: 6px 6px 6px 0;
|
||||||
|
border-style: solid;
|
||||||
|
border-color: transparent var(--background-color) transparent transparent;
|
||||||
|
}
|
||||||
|
.tooltip-dark.tooltip-right .tooltip-arrow-right {
|
||||||
|
border-color: transparent rgba(0, 0, 0, 0.9) transparent transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 过渡动画 */
|
||||||
|
.tooltip-fade-enter-active,
|
||||||
|
.tooltip-fade-leave-active {
|
||||||
|
transition:
|
||||||
|
opacity 0.18s ease,
|
||||||
|
transform 0.18s ease;
|
||||||
|
}
|
||||||
|
.tooltip-fade-enter-from,
|
||||||
|
.tooltip-fade-leave-to {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translate3d(0, 4px, 0) scale(0.98);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 响应式微调 */
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.tooltip-inner {
|
||||||
|
padding: 6px 10px;
|
||||||
|
font-size: 13px;
|
||||||
|
max-width: 250px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
52
frontend_nuxt/composables/useConfirm.ts
Normal file
52
frontend_nuxt/composables/useConfirm.ts
Normal file
@@ -0,0 +1,52 @@
|
|||||||
|
// composables/useConfirm.ts
|
||||||
|
import { ref } from 'vue'
|
||||||
|
|
||||||
|
// 全局单例(SPA 下即可;Nuxt/SSR 下见文末“SSR 提醒”)
|
||||||
|
const visible = ref(false)
|
||||||
|
const title = ref('')
|
||||||
|
const message = ref('')
|
||||||
|
|
||||||
|
let resolver: ((ok: boolean) => void) | null = null
|
||||||
|
|
||||||
|
function reset() {
|
||||||
|
visible.value = false
|
||||||
|
title.value = ''
|
||||||
|
message.value = ''
|
||||||
|
resolver = null
|
||||||
|
}
|
||||||
|
|
||||||
|
export function useConfirm() {
|
||||||
|
/**
|
||||||
|
* 打开确认框,返回 Promise<boolean>
|
||||||
|
* - 确认 => resolve(true)
|
||||||
|
* - 取消/关闭 => resolve(false)
|
||||||
|
* 若并发调用,以最后一次为准(更简单直观)
|
||||||
|
*/
|
||||||
|
const confirm = (t: string, m: string) => {
|
||||||
|
title.value = t
|
||||||
|
message.value = m
|
||||||
|
visible.value = true
|
||||||
|
return new Promise<boolean>((resolve) => {
|
||||||
|
resolver = resolve
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const onConfirm = () => {
|
||||||
|
resolver?.(true)
|
||||||
|
reset()
|
||||||
|
}
|
||||||
|
|
||||||
|
const onCancel = () => {
|
||||||
|
resolver?.(false)
|
||||||
|
reset()
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
visible,
|
||||||
|
title,
|
||||||
|
message,
|
||||||
|
confirm,
|
||||||
|
onConfirm,
|
||||||
|
onCancel,
|
||||||
|
}
|
||||||
|
}
|
||||||
52
frontend_nuxt/composables/useReactionTypes.js
Normal file
52
frontend_nuxt/composables/useReactionTypes.js
Normal file
@@ -0,0 +1,52 @@
|
|||||||
|
import { ref } from 'vue'
|
||||||
|
|
||||||
|
const reactionTypes = ref([])
|
||||||
|
let isLoading = false
|
||||||
|
let isInitialized = false
|
||||||
|
|
||||||
|
export function useReactionTypes() {
|
||||||
|
const config = useRuntimeConfig()
|
||||||
|
const API_BASE_URL = config.public.apiBaseUrl
|
||||||
|
|
||||||
|
const fetchReactionTypes = async () => {
|
||||||
|
if (isInitialized || isLoading) {
|
||||||
|
reactionTypes.value = [...(window.reactionTypes || [])]
|
||||||
|
return reactionTypes.value
|
||||||
|
}
|
||||||
|
|
||||||
|
isLoading = true
|
||||||
|
try {
|
||||||
|
const token = getToken()
|
||||||
|
const res = await fetch(`${API_BASE_URL}/api/reaction-types`, {
|
||||||
|
headers: { Authorization: token ? `Bearer ${token}` : '' },
|
||||||
|
})
|
||||||
|
if (res.ok) {
|
||||||
|
reactionTypes.value = await res.json()
|
||||||
|
window.reactionTypes = [...reactionTypes.value]
|
||||||
|
isInitialized = true
|
||||||
|
} else {
|
||||||
|
reactionTypes.value = []
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Failed to fetch reaction types:', error)
|
||||||
|
reactionTypes.value = []
|
||||||
|
} finally {
|
||||||
|
isLoading = false
|
||||||
|
}
|
||||||
|
return reactionTypes.value
|
||||||
|
}
|
||||||
|
|
||||||
|
const initialize = async () => {
|
||||||
|
if (!isInitialized) {
|
||||||
|
await fetchReactionTypes()
|
||||||
|
}
|
||||||
|
return reactionTypes.value
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
reactionTypes: readonly(reactionTypes),
|
||||||
|
fetchReactionTypes,
|
||||||
|
initialize,
|
||||||
|
isInitialized: readonly(isInitialized)
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -1,7 +1,7 @@
|
|||||||
// 导出一个便捷的 toast 对象
|
// 导出一个便捷的 toast 对象
|
||||||
export const toast = {
|
export const toast = {
|
||||||
success: async (message) => {
|
success: async (message) => {
|
||||||
if (process.client) {
|
if (import.meta.client) {
|
||||||
try {
|
try {
|
||||||
const { useToast } = await import('vue-toastification')
|
const { useToast } = await import('vue-toastification')
|
||||||
const toastInstance = useToast()
|
const toastInstance = useToast()
|
||||||
@@ -12,7 +12,7 @@ export const toast = {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
error: async (message) => {
|
error: async (message) => {
|
||||||
if (process.client) {
|
if (import.meta.client) {
|
||||||
try {
|
try {
|
||||||
const { useToast } = await import('vue-toastification')
|
const { useToast } = await import('vue-toastification')
|
||||||
const toastInstance = useToast()
|
const toastInstance = useToast()
|
||||||
@@ -23,7 +23,7 @@ export const toast = {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
warning: async (message) => {
|
warning: async (message) => {
|
||||||
if (process.client) {
|
if (import.meta.client) {
|
||||||
try {
|
try {
|
||||||
const { useToast } = await import('vue-toastification')
|
const { useToast } = await import('vue-toastification')
|
||||||
const toastInstance = useToast()
|
const toastInstance = useToast()
|
||||||
@@ -34,7 +34,7 @@ export const toast = {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
info: async (message) => {
|
info: async (message) => {
|
||||||
if (process.client) {
|
if (import.meta.client) {
|
||||||
try {
|
try {
|
||||||
const { useToast } = await import('vue-toastification')
|
const { useToast } = await import('vue-toastification')
|
||||||
const toastInstance = useToast()
|
const toastInstance = useToast()
|
||||||
@@ -48,7 +48,7 @@ export const toast = {
|
|||||||
|
|
||||||
// 导出 useToast composable
|
// 导出 useToast composable
|
||||||
export const useToast = () => {
|
export const useToast = () => {
|
||||||
if (process.client) {
|
if (import.meta.client) {
|
||||||
return new Promise(async (resolve) => {
|
return new Promise(async (resolve) => {
|
||||||
try {
|
try {
|
||||||
const { useToast: useVueToast } = await import('vue-toastification')
|
const { useToast: useVueToast } = await import('vue-toastification')
|
||||||
|
|||||||
@@ -1 +1,5 @@
|
|||||||
export { toast } from './composables/useToast'
|
export { toast } from './composables/useToast'
|
||||||
|
|
||||||
|
export const API_DOMAIN = 'https://www.open-isle.com'
|
||||||
|
export const API_PORT = ''
|
||||||
|
export const API_BASE_URL = API_PORT ? `${API_DOMAIN}:${API_PORT}` : API_DOMAIN
|
||||||
|
|||||||
@@ -12,9 +12,9 @@ export default defineNuxtConfig({
|
|||||||
twitterClientId: process.env.NUXT_PUBLIC_TWITTER_CLIENT_ID || '',
|
twitterClientId: process.env.NUXT_PUBLIC_TWITTER_CLIENT_ID || '',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
// 确保 Vditor 样式在 global.css 覆盖前加载
|
|
||||||
css: ['vditor/dist/index.css', '~/assets/fonts.css', '~/assets/global.css'],
|
css: ['vditor/dist/index.css', '~/assets/fonts.css', '~/assets/global.css'],
|
||||||
app: {
|
app: {
|
||||||
|
pageTransition: { name: 'page', mode: 'out-in' },
|
||||||
head: {
|
head: {
|
||||||
script: [
|
script: [
|
||||||
{
|
{
|
||||||
@@ -26,7 +26,31 @@ export default defineNuxtConfig({
|
|||||||
const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
|
const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
|
||||||
const theme = mode === 'dark' || mode === 'light' ? mode : (prefersDark ? 'dark' : 'light');
|
const theme = mode === 'dark' || mode === 'light' ? mode : (prefersDark ? 'dark' : 'light');
|
||||||
document.documentElement.dataset.theme = theme;
|
document.documentElement.dataset.theme = theme;
|
||||||
} catch (e) {}
|
|
||||||
|
|
||||||
|
let themeColor = '#fff';
|
||||||
|
let themeStatus = 'default';
|
||||||
|
if (theme === 'dark') {
|
||||||
|
themeColor = '#333';
|
||||||
|
themeStatus = 'black-translucent';
|
||||||
|
} else {
|
||||||
|
themeColor = '#ffffff';
|
||||||
|
themeStatus = 'default';
|
||||||
|
}
|
||||||
|
|
||||||
|
const androidMeta = document.createElement('meta');
|
||||||
|
androidMeta.name = 'theme-color';
|
||||||
|
androidMeta.content = themeColor;
|
||||||
|
|
||||||
|
const iosMeta = document.createElement('meta');
|
||||||
|
iosMeta.name = 'apple-mobile-web-app-status-bar-style';
|
||||||
|
iosMeta.content = themeStatus;
|
||||||
|
|
||||||
|
document.head.appendChild(androidMeta);
|
||||||
|
document.head.appendChild(iosMeta);
|
||||||
|
} catch (e) {
|
||||||
|
console.warn('Theme initialization failed:', e);
|
||||||
|
}
|
||||||
})();
|
})();
|
||||||
`,
|
`,
|
||||||
},
|
},
|
||||||
@@ -60,4 +84,27 @@ export default defineNuxtConfig({
|
|||||||
isCustomElement: (tag) => ['l-hatch', 'l-hatch-spinner'].includes(tag),
|
isCustomElement: (tag) => ['l-hatch', 'l-hatch-spinner'].includes(tag),
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
vite: {
|
||||||
|
build: {
|
||||||
|
// increase warning limit and split large libraries into separate chunks
|
||||||
|
chunkSizeWarningLimit: 1024,
|
||||||
|
rollupOptions: {
|
||||||
|
output: {
|
||||||
|
manualChunks(id) {
|
||||||
|
if (id.includes('node_modules')) {
|
||||||
|
if (id.includes('vditor')) {
|
||||||
|
return 'vditor'
|
||||||
|
}
|
||||||
|
if (id.includes('echarts')) {
|
||||||
|
return 'echarts'
|
||||||
|
}
|
||||||
|
if (id.includes('highlight.js')) {
|
||||||
|
return 'highlight'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
})
|
})
|
||||||
|
|||||||
4950
frontend_nuxt/package-lock.json
generated
4950
frontend_nuxt/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -2,7 +2,7 @@
|
|||||||
<div class="not-found-page">
|
<div class="not-found-page">
|
||||||
<h1>404 - 页面不存在</h1>
|
<h1>404 - 页面不存在</h1>
|
||||||
<p>你访问的页面不存在或已被删除</p>
|
<p>你访问的页面不存在或已被删除</p>
|
||||||
<router-link to="/">返回首页</router-link>
|
<NuxtLink to="/">返回首页</NuxtLink>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
@@ -1,5 +1,8 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="site-stats-page">
|
<div class="site-stats-page">
|
||||||
|
<div v-if="isLoading" class="loading-message">
|
||||||
|
<l-hatch size="28" stroke="4" speed="3.5" color="var(--primary-color)"></l-hatch>
|
||||||
|
</div>
|
||||||
<ClientOnly>
|
<ClientOnly>
|
||||||
<VChart
|
<VChart
|
||||||
v-if="dauOption"
|
v-if="dauOption"
|
||||||
@@ -51,8 +54,10 @@ const dauOption = ref(null)
|
|||||||
const newUserOption = ref(null)
|
const newUserOption = ref(null)
|
||||||
const postOption = ref(null)
|
const postOption = ref(null)
|
||||||
const commentOption = ref(null)
|
const commentOption = ref(null)
|
||||||
|
const isLoading = ref(false)
|
||||||
|
|
||||||
async function loadData() {
|
async function loadData() {
|
||||||
|
isLoading.value = true
|
||||||
const token = getToken()
|
const token = getToken()
|
||||||
const headers = { Authorization: `Bearer ${token}` }
|
const headers = { Authorization: `Bearer ${token}` }
|
||||||
|
|
||||||
@@ -93,6 +98,7 @@ async function loadData() {
|
|||||||
const data = await commentRes.json()
|
const data = await commentRes.json()
|
||||||
commentOption.value = toOption('每日回贴量', data)
|
commentOption.value = toOption('每日回贴量', data)
|
||||||
}
|
}
|
||||||
|
isLoading.value = false
|
||||||
}
|
}
|
||||||
|
|
||||||
onMounted(loadData)
|
onMounted(loadData)
|
||||||
@@ -105,4 +111,11 @@ onMounted(loadData)
|
|||||||
background-color: var(--background-color);
|
background-color: var(--background-color);
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.loading-message {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
height: 400px;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -25,6 +25,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<MilkTeaActivityComponent v-if="a.type === 'MILK_TEA'" />
|
<MilkTeaActivityComponent v-if="a.type === 'MILK_TEA'" />
|
||||||
|
<InviteCodeActivityComponent v-if="a.type === 'INVITE_POINTS'" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@@ -32,6 +33,7 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import TimeManager from '~/utils/time'
|
import TimeManager from '~/utils/time'
|
||||||
import MilkTeaActivityComponent from '~/components/MilkTeaActivityComponent.vue'
|
import MilkTeaActivityComponent from '~/components/MilkTeaActivityComponent.vue'
|
||||||
|
import InviteCodeActivityComponent from '~/components/InviteCodeActivityComponent.vue'
|
||||||
const config = useRuntimeConfig()
|
const config = useRuntimeConfig()
|
||||||
const API_BASE_URL = config.public.apiBaseUrl
|
const API_BASE_URL = config.public.apiBaseUrl
|
||||||
|
|
||||||
@@ -75,6 +77,7 @@ onMounted(async () => {
|
|||||||
background-color: var(--activity-card-background-color);
|
background-color: var(--activity-card-background-color);
|
||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
|
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
|
||||||
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.activity-card-left-avatar-img {
|
.activity-card-left-avatar-img {
|
||||||
@@ -141,6 +144,10 @@ onMounted(async () => {
|
|||||||
color: inherit;
|
color: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.activity-card-normal-right {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
@media screen and (max-width: 768px) {
|
@media screen and (max-width: 768px) {
|
||||||
.activity-card-left-avatar-img {
|
.activity-card-left-avatar-img {
|
||||||
width: 80px;
|
width: 80px;
|
||||||
|
|||||||
@@ -1,3 +1,4 @@
|
|||||||
|
<!-- pages/discord-callback.vue -->
|
||||||
<template>
|
<template>
|
||||||
<CallbackPage />
|
<CallbackPage />
|
||||||
</template>
|
</template>
|
||||||
@@ -8,9 +9,30 @@ import { discordExchange } from '~/utils/discord'
|
|||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
const url = new URL(window.location.href)
|
const url = new URL(window.location.href)
|
||||||
const code = url.searchParams.get('code')
|
const code = url.searchParams.get('code') || ''
|
||||||
const state = url.searchParams.get('state')
|
const stateStr = url.searchParams.get('state') || ''
|
||||||
const result = await discordExchange(code, state, '')
|
|
||||||
|
// 从 state 解析 invite_token;兜底支持 query ?invite_token=
|
||||||
|
let inviteToken = ''
|
||||||
|
if (stateStr) {
|
||||||
|
try {
|
||||||
|
const s = new URLSearchParams(stateStr)
|
||||||
|
inviteToken = s.get('invite_token') || s.get('invitetoken') || ''
|
||||||
|
} catch {}
|
||||||
|
}
|
||||||
|
// if (!inviteToken) {
|
||||||
|
// inviteToken =
|
||||||
|
// url.searchParams.get('invite_token') ||
|
||||||
|
// url.searchParams.get('invitetoken') ||
|
||||||
|
// ''
|
||||||
|
// }
|
||||||
|
|
||||||
|
if (!code) {
|
||||||
|
navigateTo('/login', { replace: true })
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const result = await discordExchange(code, inviteToken, '')
|
||||||
|
|
||||||
if (result.needReason) {
|
if (result.needReason) {
|
||||||
navigateTo(`/signup-reason?token=${result.token}`, { replace: true })
|
navigateTo(`/signup-reason?token=${result.token}`, { replace: true })
|
||||||
|
|||||||
@@ -2,6 +2,7 @@
|
|||||||
<div class="forgot-page">
|
<div class="forgot-page">
|
||||||
<div class="forgot-content">
|
<div class="forgot-content">
|
||||||
<div class="forgot-title">找回密码</div>
|
<div class="forgot-title">找回密码</div>
|
||||||
|
|
||||||
<div v-if="step === 0" class="step-content">
|
<div v-if="step === 0" class="step-content">
|
||||||
<BaseInput icon="fas fa-envelope" v-model="email" placeholder="邮箱" />
|
<BaseInput icon="fas fa-envelope" v-model="email" placeholder="邮箱" />
|
||||||
<div v-if="emailError" class="error-message">{{ emailError }}</div>
|
<div v-if="emailError" class="error-message">{{ emailError }}</div>
|
||||||
@@ -19,6 +20,10 @@
|
|||||||
<div class="primary-button" @click="resetPassword" v-if="!isResetting">重置密码</div>
|
<div class="primary-button" @click="resetPassword" v-if="!isResetting">重置密码</div>
|
||||||
<div class="primary-button disabled" v-else>提交中...</div>
|
<div class="primary-button disabled" v-else>提交中...</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="hint-message">
|
||||||
|
<i class="fas fa-info-circle"></i>
|
||||||
|
使用 Google 注册的用户可使用对应的邮箱进行找回密码
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@@ -26,6 +31,8 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { toast } from '~/main'
|
import { toast } from '~/main'
|
||||||
import BaseInput from '~/components/BaseInput.vue'
|
import BaseInput from '~/components/BaseInput.vue'
|
||||||
|
import { useRoute } from 'vue-router'
|
||||||
|
|
||||||
const config = useRuntimeConfig()
|
const config = useRuntimeConfig()
|
||||||
const API_BASE_URL = config.public.apiBaseUrl
|
const API_BASE_URL = config.public.apiBaseUrl
|
||||||
|
|
||||||
@@ -39,6 +46,7 @@ const passwordError = ref('')
|
|||||||
const isSending = ref(false)
|
const isSending = ref(false)
|
||||||
const isVerifying = ref(false)
|
const isVerifying = ref(false)
|
||||||
const isResetting = ref(false)
|
const isResetting = ref(false)
|
||||||
|
const route = useRoute()
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
if (route.query.email) {
|
if (route.query.email) {
|
||||||
@@ -137,6 +145,21 @@ const resetPassword = async () => {
|
|||||||
font-size: 24px;
|
font-size: 24px;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.forgot-content .hint-message {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-start;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
padding: 8px 0;
|
||||||
|
font-size: 13px;
|
||||||
|
color: var(--blockquote-text-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.hint-message i {
|
||||||
|
color: var(--primary-color);
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
.step-content {
|
.step-content {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|||||||
@@ -1,3 +1,4 @@
|
|||||||
|
<!-- pages/github-callback.vue -->
|
||||||
<template>
|
<template>
|
||||||
<CallbackPage />
|
<CallbackPage />
|
||||||
</template>
|
</template>
|
||||||
@@ -8,9 +9,31 @@ import { githubExchange } from '~/utils/github'
|
|||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
const url = new URL(window.location.href)
|
const url = new URL(window.location.href)
|
||||||
const code = url.searchParams.get('code')
|
const code = url.searchParams.get('code') || ''
|
||||||
const state = url.searchParams.get('state')
|
const state = url.searchParams.get('state') || ''
|
||||||
const result = await githubExchange(code, state, '')
|
|
||||||
|
// 从 state 中解析 invite_token(githubAuthorize 已把它放进 state)
|
||||||
|
let inviteToken = ''
|
||||||
|
if (state) {
|
||||||
|
try {
|
||||||
|
const s = new URLSearchParams(state)
|
||||||
|
inviteToken = s.get('invite_token') || s.get('invitetoken') || ''
|
||||||
|
} catch {}
|
||||||
|
}
|
||||||
|
// 兜底:也支持直接跟在回调URL的查询参数上
|
||||||
|
// if (!inviteToken) {
|
||||||
|
// inviteToken =
|
||||||
|
// url.searchParams.get('invite_token') ||
|
||||||
|
// url.searchParams.get('invitetoken') ||
|
||||||
|
// ''
|
||||||
|
// }
|
||||||
|
|
||||||
|
if (!code) {
|
||||||
|
navigateTo('/login', { replace: true })
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const result = await githubExchange(code, inviteToken, '')
|
||||||
|
|
||||||
if (result.needReason) {
|
if (result.needReason) {
|
||||||
navigateTo(`/signup-reason?token=${result.token}`, { replace: true })
|
navigateTo(`/signup-reason?token=${result.token}`, { replace: true })
|
||||||
|
|||||||
@@ -9,6 +9,21 @@ import { googleAuthWithToken } from '~/utils/google'
|
|||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
const hash = new URLSearchParams(window.location.hash.substring(1))
|
const hash = new URLSearchParams(window.location.hash.substring(1))
|
||||||
const idToken = hash.get('id_token')
|
const idToken = hash.get('id_token')
|
||||||
|
|
||||||
|
// 优先从 state 中解析
|
||||||
|
let inviteToken = ''
|
||||||
|
const stateStr = hash.get('state') || ''
|
||||||
|
if (stateStr) {
|
||||||
|
const state = new URLSearchParams(stateStr)
|
||||||
|
inviteToken = state.get('invite_token') || ''
|
||||||
|
}
|
||||||
|
|
||||||
|
// 兜底:如果之前把 invite_token 放在回调 URL 的查询参数中
|
||||||
|
// if (!inviteToken) {
|
||||||
|
// const query = new URLSearchParams(window.location.search)
|
||||||
|
// inviteToken = query.get('invite_token') || ''
|
||||||
|
// }
|
||||||
|
|
||||||
if (idToken) {
|
if (idToken) {
|
||||||
await googleAuthWithToken(
|
await googleAuthWithToken(
|
||||||
idToken,
|
idToken,
|
||||||
@@ -18,6 +33,7 @@ onMounted(async () => {
|
|||||||
(token) => {
|
(token) => {
|
||||||
navigateTo(`/signup-reason?token=${token}`, { replace: true })
|
navigateTo(`/signup-reason?token=${token}`, { replace: true })
|
||||||
},
|
},
|
||||||
|
{ inviteToken },
|
||||||
)
|
)
|
||||||
} else {
|
} else {
|
||||||
navigateTo('/login', { replace: true })
|
navigateTo('/login', { replace: true })
|
||||||
|
|||||||
@@ -1,10 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="home-page">
|
<div class="home-page">
|
||||||
<div v-if="!isMobile" class="search-container">
|
<div v-if="!isMobile" class="search-container">
|
||||||
<div class="search-title">一切可能,从此刻启航</div>
|
<div class="search-title">一切可能,从此刻启航,在此遇见灵感与共鸣</div>
|
||||||
<div class="search-subtitle">
|
|
||||||
愿你在此遇见灵感与共鸣。若有疑惑,欢迎发问,亦可在知识的海洋中搜寻答案。
|
|
||||||
</div>
|
|
||||||
<SearchDropdown />
|
<SearchDropdown />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -105,25 +102,33 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<div v-else-if="selectedTopic === '热门'" class="placeholder-container">
|
<div v-else-if="selectedTopic === '热门'" class="placeholder-container">
|
||||||
热门帖子功能开发中,敬请期待。
|
热门帖子功能开发中,敬请期待。
|
||||||
</div>
|
</div>
|
||||||
<div v-else class="placeholder-container">分类浏览功能开发中,敬请期待。</div>
|
<div v-else class="placeholder-container">分类浏览功能开发中,敬请期待。</div>
|
||||||
<div v-if="isLoadingMore && articles.length > 0" class="loading-container bottom-loading">
|
|
||||||
<l-hatch size="28" stroke="4" speed="3.5" color="var(--primary-color)"></l-hatch>
|
<!-- ✅ 通用“底部加载更多”组件(自管 loading/observer/并发) -->
|
||||||
</div>
|
<InfiniteLoadMore
|
||||||
|
v-if="articles.length > 0"
|
||||||
|
:key="ioKey"
|
||||||
|
:on-load="fetchNextPage"
|
||||||
|
:pause="pendingFirst"
|
||||||
|
root-margin="200px 0px"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref, watch, watchEffect, computed, onMounted, onBeforeUnmount } from 'vue'
|
import { computed, onMounted, onBeforeUnmount, nextTick, ref, watch } from 'vue'
|
||||||
import ArticleCategory from '~/components/ArticleCategory.vue'
|
import ArticleCategory from '~/components/ArticleCategory.vue'
|
||||||
import ArticleTags from '~/components/ArticleTags.vue'
|
import ArticleTags from '~/components/ArticleTags.vue'
|
||||||
import CategorySelect from '~/components/CategorySelect.vue'
|
import CategorySelect from '~/components/CategorySelect.vue'
|
||||||
import SearchDropdown from '~/components/SearchDropdown.vue'
|
import SearchDropdown from '~/components/SearchDropdown.vue'
|
||||||
import TagSelect from '~/components/TagSelect.vue'
|
import TagSelect from '~/components/TagSelect.vue'
|
||||||
|
import InfiniteLoadMore from '~/components/InfiniteLoadMore.vue'
|
||||||
import { getToken } from '~/utils/auth'
|
import { getToken } from '~/utils/auth'
|
||||||
import { useScrollLoadMore } from '~/utils/loadMore'
|
|
||||||
import { stripMarkdown } from '~/utils/markdown'
|
import { stripMarkdown } from '~/utils/markdown'
|
||||||
import { useIsMobile } from '~/utils/screen'
|
import { useIsMobile } from '~/utils/screen'
|
||||||
import TimeManager from '~/utils/time'
|
import TimeManager from '~/utils/time'
|
||||||
@@ -147,17 +152,22 @@ const route = useRoute()
|
|||||||
const tagOptions = ref([])
|
const tagOptions = ref([])
|
||||||
const categoryOptions = ref([])
|
const categoryOptions = ref([])
|
||||||
|
|
||||||
const isLoadingMore = ref(false)
|
|
||||||
|
|
||||||
const topics = ref(['最新回复', '最新', '排行榜' /*, '热门', '类别'*/])
|
const topics = ref(['最新回复', '最新', '排行榜' /*, '热门', '类别'*/])
|
||||||
|
const selectedTopicCookie = useCookie('homeTab')
|
||||||
const selectedTopic = ref(
|
const selectedTopic = ref(
|
||||||
route.query.view === 'ranking' ? '排行榜' : route.query.view === 'latest' ? '最新' : '最新回复',
|
selectedTopicCookie.value
|
||||||
|
? selectedTopicCookie.value
|
||||||
|
: route.query.view === 'ranking'
|
||||||
|
? '排行榜'
|
||||||
|
: route.query.view === 'latest'
|
||||||
|
? '最新'
|
||||||
|
: '最新回复',
|
||||||
)
|
)
|
||||||
|
if (!selectedTopicCookie.value) selectedTopicCookie.value = selectedTopic.value
|
||||||
const articles = ref([])
|
const articles = ref([])
|
||||||
const page = ref(0)
|
const page = ref(0)
|
||||||
const pageSize = 10
|
const pageSize = 10
|
||||||
const isMobile = useIsMobile()
|
const isMobile = useIsMobile()
|
||||||
const allLoaded = ref(false)
|
|
||||||
|
|
||||||
/** URL 参数 -> 本地筛选值 **/
|
/** URL 参数 -> 本地筛选值 **/
|
||||||
const selectedCategorySet = (category) => {
|
const selectedCategorySet = (category) => {
|
||||||
@@ -178,6 +188,11 @@ onMounted(() => {
|
|||||||
const { category, tags } = route.query
|
const { category, tags } = route.query
|
||||||
if (category) selectedCategorySet(category)
|
if (category) selectedCategorySet(category)
|
||||||
if (tags) selectedTagsSet(tags)
|
if (tags) selectedTagsSet(tags)
|
||||||
|
|
||||||
|
const saved = localStorage.getItem('homeTab')
|
||||||
|
if (saved) {
|
||||||
|
selectedTopic.value = saved
|
||||||
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
/** 路由变更时同步筛选 **/
|
/** 路由变更时同步筛选 **/
|
||||||
@@ -195,7 +210,7 @@ watch(
|
|||||||
const loadOptions = async () => {
|
const loadOptions = async () => {
|
||||||
if (selectedCategory.value && !isNaN(selectedCategory.value)) {
|
if (selectedCategory.value && !isNaN(selectedCategory.value)) {
|
||||||
try {
|
try {
|
||||||
const res = await fetch(`${API_BASE_URL}/api/categories/${selectedCategory.value}`)
|
const res = await fetch(`${API_BASE_URL}/api/categories/`)
|
||||||
if (res.ok) categoryOptions.value = [await res.json()]
|
if (res.ok) categoryOptions.value = [await res.json()]
|
||||||
} catch {}
|
} catch {}
|
||||||
}
|
}
|
||||||
@@ -276,76 +291,54 @@ const {
|
|||||||
},
|
},
|
||||||
)
|
)
|
||||||
|
|
||||||
/** 首屏/筛选变更:重置分页并灌入 firstPage **/
|
/** 首屏/筛选变更:重置分页并灌入 firstPage(InfiniteLoadMore 会凭 key 重建状态) **/
|
||||||
watch(
|
watch(
|
||||||
firstPage,
|
firstPage,
|
||||||
(data) => {
|
(data) => {
|
||||||
page.value = 0
|
page.value = 0
|
||||||
articles.value = [...(data || [])]
|
articles.value = [...(data || [])]
|
||||||
allLoaded.value = (data?.length || 0) < pageSize
|
|
||||||
},
|
},
|
||||||
{ immediate: true },
|
{ immediate: true },
|
||||||
)
|
)
|
||||||
|
|
||||||
/** —— 滚动加载更多 —— **/
|
/** —— 提供给 InfiniteLoadMore 的加载函数 —— **/
|
||||||
let inflight = null
|
|
||||||
const fetchNextPage = async () => {
|
const fetchNextPage = async () => {
|
||||||
if (allLoaded.value || pendingFirst.value || inflight) return
|
// 若首屏仍在 pending,由组件 pause 控制,这里兜底返回“未完成”
|
||||||
|
if (pendingFirst.value) return false
|
||||||
|
|
||||||
const nextPage = page.value + 1
|
const nextPage = page.value + 1
|
||||||
isLoadingMore.value = true
|
const res = await $fetch(buildUrl({ pageNo: nextPage }), { headers: tokenHeader.value })
|
||||||
inflight = $fetch(buildUrl({ pageNo: nextPage }), { headers: tokenHeader.value })
|
const data = Array.isArray(res) ? res : []
|
||||||
.then((res) => {
|
const mapped = data.map((p) => ({
|
||||||
const data = Array.isArray(res) ? res : []
|
id: p.id,
|
||||||
const mapped = data.map((p) => ({
|
title: p.title,
|
||||||
id: p.id,
|
description: p.content,
|
||||||
title: p.title,
|
category: p.category,
|
||||||
description: p.content,
|
tags: p.tags || [],
|
||||||
category: p.category,
|
members: (p.participants || []).map((m) => ({ id: m.id, avatar: m.avatar })),
|
||||||
tags: p.tags || [],
|
comments: p.commentCount,
|
||||||
members: (p.participants || []).map((m) => ({ id: m.id, avatar: m.avatar })),
|
views: p.views,
|
||||||
comments: p.commentCount,
|
time: TimeManager.format(
|
||||||
views: p.views,
|
selectedTopic.value === '最新回复' ? p.lastReplyAt || p.createdAt : p.createdAt,
|
||||||
time: TimeManager.format(
|
),
|
||||||
selectedTopic.value === '最新回复' ? p.lastReplyAt || p.createdAt : p.createdAt,
|
pinned: Boolean(p.pinned ?? p.pinnedAt ?? p.pinned_at),
|
||||||
),
|
type: p.type,
|
||||||
pinned: Boolean(p.pinned ?? p.pinnedAt ?? p.pinned_at),
|
}))
|
||||||
type: p.type,
|
articles.value.push(...mapped)
|
||||||
}))
|
|
||||||
articles.value.push(...mapped)
|
const done = data.length < pageSize
|
||||||
if (data.length < pageSize) {
|
if (!done) page.value = nextPage
|
||||||
allLoaded.value = true
|
return done // ✅ 返回给组件,决定是否停止观察
|
||||||
} else {
|
|
||||||
page.value = nextPage
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
inflight = null
|
|
||||||
isLoadingMore.value = false
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 绑定滚动加载(避免挂载瞬间触发) **/
|
/** 选项首屏加载与状态持久 **/
|
||||||
let initialReady = false
|
|
||||||
const loadMoreGuarded = async () => {
|
|
||||||
if (!initialReady) return
|
|
||||||
await fetchNextPage()
|
|
||||||
}
|
|
||||||
useScrollLoadMore(loadMoreGuarded)
|
|
||||||
watch(
|
|
||||||
articles,
|
|
||||||
() => {
|
|
||||||
if (!initialReady && articles.value.length) initialReady = true
|
|
||||||
},
|
|
||||||
{ immediate: true },
|
|
||||||
)
|
|
||||||
|
|
||||||
/** 切换分类/标签/Tab:useAsyncData 已 watch,这里只需确保 options 加载 **/
|
|
||||||
watch([selectedCategory, selectedTags], () => {
|
watch([selectedCategory, selectedTags], () => {
|
||||||
loadOptions()
|
loadOptions()
|
||||||
})
|
})
|
||||||
watch(selectedTopic, () => {
|
watch(selectedTopic, (val) => {
|
||||||
// 仅当需要额外选项时加载
|
|
||||||
loadOptions()
|
loadOptions()
|
||||||
|
selectedTopicCookie.value = val
|
||||||
|
if (import.meta.client) localStorage.setItem('homeTab', val)
|
||||||
})
|
})
|
||||||
|
|
||||||
/** 选项首屏加载:服务端执行一次;客户端兜底 **/
|
/** 选项首屏加载:服务端执行一次;客户端兜底 **/
|
||||||
@@ -354,7 +347,14 @@ if (import.meta.server) {
|
|||||||
}
|
}
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
if (categoryOptions.value.length === 0 && tagOptions.value.length === 0) loadOptions()
|
if (categoryOptions.value.length === 0 && tagOptions.value.length === 0) loadOptions()
|
||||||
|
window.addEventListener('refresh-home', refreshFirst)
|
||||||
})
|
})
|
||||||
|
onBeforeUnmount(() => {
|
||||||
|
window.removeEventListener('refresh-home', refreshFirst)
|
||||||
|
})
|
||||||
|
|
||||||
|
/** 供 InfiniteLoadMore 重建用的 key:筛选/Tab 改变即重建内部状态 */
|
||||||
|
const ioKey = computed(() => asyncKey.value.join('::'))
|
||||||
|
|
||||||
/** 其他工具函数 **/
|
/** 其他工具函数 **/
|
||||||
const sanitizeDescription = (text) => stripMarkdown(text)
|
const sanitizeDescription = (text) => stripMarkdown(text)
|
||||||
@@ -371,8 +371,8 @@ const sanitizeDescription = (text) => stripMarkdown(text)
|
|||||||
}
|
}
|
||||||
|
|
||||||
.search-container {
|
.search-container {
|
||||||
margin-top: 100px;
|
margin-top: 32px;
|
||||||
padding: 20px;
|
padding: 20px 20px 32px;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@@ -384,10 +384,6 @@ const sanitizeDescription = (text) => stripMarkdown(text)
|
|||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
.search-subtitle {
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.loading-container {
|
.loading-container {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
@@ -395,6 +391,7 @@ const sanitizeDescription = (text) => stripMarkdown(text)
|
|||||||
height: 200px;
|
height: 200px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 这里的 bottom-loading 可保留给首屏 loading 使用;InfiniteLoadMore 自带同名样式也兼容 */
|
||||||
.bottom-loading {
|
.bottom-loading {
|
||||||
height: 100px;
|
height: 100px;
|
||||||
}
|
}
|
||||||
@@ -422,6 +419,7 @@ const sanitizeDescription = (text) => stripMarkdown(text)
|
|||||||
gap: 10px;
|
gap: 10px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding: 10px 0;
|
padding: 10px 0;
|
||||||
|
backdrop-filter: var(--blur-10);
|
||||||
}
|
}
|
||||||
|
|
||||||
.topic-item-container {
|
.topic-item-container {
|
||||||
@@ -537,10 +535,12 @@ const sanitizeDescription = (text) => stripMarkdown(text)
|
|||||||
}
|
}
|
||||||
|
|
||||||
.article-item-description {
|
.article-item-description {
|
||||||
|
max-width: 100%;
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
color: gray;
|
color: gray;
|
||||||
display: -webkit-box;
|
display: -webkit-box;
|
||||||
|
line-clamp: 3;
|
||||||
-webkit-line-clamp: 3;
|
-webkit-line-clamp: 3;
|
||||||
-webkit-box-orient: vertical;
|
-webkit-box-orient: vertical;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|||||||
@@ -27,11 +27,15 @@
|
|||||||
>找回密码</a
|
>找回密码</a
|
||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="hint-message">
|
||||||
|
<i class="fas fa-info-circle"></i>
|
||||||
|
使用右侧第三方OAuth注册/登录的用户可使用对应的邮箱进行重设密码
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="other-login-page-content">
|
<div class="other-login-page-content">
|
||||||
<div class="login-page-button" @click="googleAuthorize">
|
<div class="login-page-button" @click="loginWithGoogle">
|
||||||
<img class="login-page-button-icon" src="../assets/icons/google.svg" alt="Google Logo" />
|
<img class="login-page-button-icon" src="../assets/icons/google.svg" alt="Google Logo" />
|
||||||
<div class="login-page-button-text">Google 登录</div>
|
<div class="login-page-button-text">Google 登录</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -102,6 +106,9 @@ const submitLogin = async () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const loginWithGoogle = () => {
|
||||||
|
googleAuthorize()
|
||||||
|
}
|
||||||
const loginWithGithub = () => {
|
const loginWithGithub = () => {
|
||||||
githubAuthorize()
|
githubAuthorize()
|
||||||
}
|
}
|
||||||
@@ -259,6 +266,11 @@ const loginWithTwitter = () => {
|
|||||||
color: var(--primary-color);
|
color: var(--primary-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.hint-message {
|
||||||
|
font-size: 12px;
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|
||||||
@media (max-width: 768px) {
|
@media (max-width: 768px) {
|
||||||
.login-page {
|
.login-page {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|||||||
@@ -33,15 +33,13 @@
|
|||||||
<div v-if="selectedTab === 'control'">
|
<div v-if="selectedTab === 'control'">
|
||||||
<div class="message-control-container">
|
<div class="message-control-container">
|
||||||
<div class="message-control-title">通知设置</div>
|
<div class="message-control-title">通知设置</div>
|
||||||
<div class="message-control-push-item-container">
|
<div class="message-control-item-container">
|
||||||
<div
|
<div v-for="pref in notificationPrefs" :key="pref.type" class="message-control-item">
|
||||||
v-for="pref in notificationPrefs"
|
<div class="message-control-item-label">{{ formatType(pref.type) }}</div>
|
||||||
:key="pref.type"
|
<BaseSwitch
|
||||||
class="message-control-push-item"
|
:model-value="pref.enabled"
|
||||||
:class="{ select: pref.enabled }"
|
@update:modelValue="(val) => togglePref(pref, val)"
|
||||||
@click="togglePref(pref)"
|
/>
|
||||||
>
|
|
||||||
{{ formatType(pref.type) }}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -53,74 +51,74 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<BasePlaceholder
|
<BasePlaceholder
|
||||||
v-else-if="filteredNotifications.length === 0"
|
v-else-if="notifications.length === 0"
|
||||||
text="暂时没有消息 :)"
|
text="暂时没有消息 :)"
|
||||||
icon="fas fa-inbox"
|
icon="fas fa-inbox"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<div class="timeline-container" v-if="filteredNotifications.length > 0">
|
<div class="timeline-container" v-if="notifications.length > 0">
|
||||||
<BaseTimeline :items="filteredNotifications">
|
<BaseTimeline :items="notifications">
|
||||||
<template #item="{ item }">
|
<template #item="{ item }">
|
||||||
<div class="notif-content" :class="{ read: item.read }">
|
<div class="notif-content" :class="{ read: item.read }">
|
||||||
<span v-if="!item.read" class="unread-dot"></span>
|
<span v-if="!item.read" class="unread-dot"></span>
|
||||||
<span class="notif-type">
|
<span class="notif-type">
|
||||||
<template v-if="item.type === 'COMMENT_REPLY' && item.parentComment">
|
<template v-if="item.type === 'COMMENT_REPLY' && item.parentComment">
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/users/${item.comment.author.id}`"
|
:to="`/users/${item.comment.author.id}`"
|
||||||
>{{ item.comment.author.username }}
|
>{{ item.comment.author.username }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
对我的评论
|
对我的评论
|
||||||
<span>
|
<span>
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}#comment-${item.parentComment.id}`"
|
:to="`/posts/${item.post.id}#comment-${item.parentComment.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.parentComment.content, 100) }}
|
{{ stripMarkdownLength(item.parentComment.content, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
</span>
|
</span>
|
||||||
回复了
|
回复了
|
||||||
<span>
|
<span>
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}#comment-${item.comment.id}`"
|
:to="`/posts/${item.post.id}#comment-${item.comment.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.comment.content, 100) }}
|
{{ stripMarkdownLength(item.comment.content, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
</span>
|
</span>
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="item.type === 'COMMENT_REPLY' && !item.parentComment">
|
<template v-else-if="item.type === 'COMMENT_REPLY' && !item.parentComment">
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/users/${item.comment.author.id}`"
|
:to="`/users/${item.comment.author.id}`"
|
||||||
>{{ item.comment.author.username }}
|
>{{ item.comment.author.username }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
对我的文章
|
对我的文章
|
||||||
<span>
|
<span>
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}`"
|
:to="`/posts/${item.post.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.post.title, 100) }}
|
{{ stripMarkdownLength(item.post.title, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
</span>
|
</span>
|
||||||
回复了
|
回复了
|
||||||
<span>
|
<span>
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}#comment-${item.comment.id}`"
|
:to="`/posts/${item.post.id}#comment-${item.comment.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.comment.content, 100) }}
|
{{ stripMarkdownLength(item.comment.content, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
</span>
|
</span>
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
@@ -130,314 +128,320 @@
|
|||||||
申请进行奶茶兑换,联系方式是:{{ item.content }}
|
申请进行奶茶兑换,联系方式是:{{ item.content }}
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
|
<template v-else-if="item.type === 'POINT_REDEEM' && !item.parentComment">
|
||||||
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
|
<span class="notif-user">{{ item.fromUser.username }} </span>
|
||||||
|
申请积分兑换,联系方式是:{{ item.content }}
|
||||||
|
</NotificationContainer>
|
||||||
|
</template>
|
||||||
<template v-else-if="item.type === 'REACTION' && item.post && !item.comment">
|
<template v-else-if="item.type === 'REACTION' && item.post && !item.comment">
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
<span class="notif-user">{{ item.fromUser.username }} </span> 对我的文章
|
<span class="notif-user">{{ item.fromUser.username }} </span> 对我的文章
|
||||||
<span>
|
<span>
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}`"
|
:to="`/posts/${item.post.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.post.title, 100) }}
|
{{ stripMarkdownLength(item.post.title, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
</span>
|
</span>
|
||||||
进行了表态
|
进行了表态
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="item.type === 'REACTION' && item.comment">
|
<template v-else-if="item.type === 'REACTION' && item.comment">
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/users/${item.fromUser.id}`"
|
:to="`/users/${item.fromUser.id}`"
|
||||||
>{{ item.fromUser.username }}
|
>{{ item.fromUser.username }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
对我的评论
|
对我的评论
|
||||||
<span>
|
<span>
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}#comment-${item.comment.id}`"
|
:to="`/posts/${item.post.id}#comment-${item.comment.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.comment.content, 100) }}
|
{{ stripMarkdownLength(item.comment.content, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
</span>
|
</span>
|
||||||
进行了表态
|
进行了表态
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="item.type === 'POST_VIEWED'">
|
<template v-else-if="item.type === 'POST_VIEWED'">
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/users/${item.fromUser.id}`"
|
:to="`/users/${item.fromUser.id}`"
|
||||||
>
|
>
|
||||||
{{ item.fromUser.username }}
|
{{ item.fromUser.username }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
查看了您的帖子
|
查看了您的帖子
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}`"
|
:to="`/posts/${item.post.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.post.title, 100) }}
|
{{ stripMarkdownLength(item.post.title, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="item.type === 'LOTTERY_WIN'">
|
<template v-else-if="item.type === 'LOTTERY_WIN'">
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
恭喜你在抽奖贴
|
恭喜你在抽奖贴
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}`"
|
:to="`/posts/${item.post.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.post.title, 100) }}
|
{{ stripMarkdownLength(item.post.title, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
中获奖
|
中获奖
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="item.type === 'LOTTERY_DRAW'">
|
<template v-else-if="item.type === 'LOTTERY_DRAW'">
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
您的抽奖贴
|
您的抽奖贴
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}`"
|
:to="`/posts/${item.post.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.post.title, 100) }}
|
{{ stripMarkdownLength(item.post.title, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
已开奖
|
已开奖
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="item.type === 'POST_UPDATED'">
|
<template v-else-if="item.type === 'POST_UPDATED'">
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
您关注的帖子
|
您关注的帖子
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}`"
|
:to="`/posts/${item.post.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.post.title, 100) }}
|
{{ stripMarkdownLength(item.post.title, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
下面有新评论
|
下面有新评论
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}#comment-${item.comment.id}`"
|
:to="`/posts/${item.post.id}#comment-${item.comment.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.comment.content, 100) }}
|
{{ stripMarkdownLength(item.comment.content, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="item.type === 'USER_ACTIVITY' && item.parentComment">
|
<template v-else-if="item.type === 'USER_ACTIVITY' && item.parentComment">
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
你关注的
|
你关注的
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/users/${item.comment.author.id}`"
|
:to="`/users/${item.comment.author.id}`"
|
||||||
>
|
>
|
||||||
{{ item.comment.author.username }}
|
{{ item.comment.author.username }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
在 对评论
|
在 对评论
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}#comment-${item.parentComment.id}`"
|
:to="`/posts/${item.post.id}#comment-${item.parentComment.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.parentComment.content, 100) }}
|
{{ stripMarkdownLength(item.parentComment.content, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
回复了
|
回复了
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}#comment-${item.comment.id}`"
|
:to="`/posts/${item.post.id}#comment-${item.comment.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.comment.content, 100) }}
|
{{ stripMarkdownLength(item.comment.content, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="item.type === 'USER_ACTIVITY'">
|
<template v-else-if="item.type === 'USER_ACTIVITY'">
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
你关注的
|
你关注的
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/users/${item.comment.author.id}`"
|
:to="`/users/${item.comment.author.id}`"
|
||||||
>
|
>
|
||||||
{{ item.comment.author.username }}
|
{{ item.comment.author.username }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
在文章
|
在文章
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}`"
|
:to="`/posts/${item.post.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.post.title, 100) }}
|
{{ stripMarkdownLength(item.post.title, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
下面评论了
|
下面评论了
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}#comment-${item.comment.id}`"
|
:to="`/posts/${item.post.id}#comment-${item.comment.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.comment.content, 100) }}
|
{{ stripMarkdownLength(item.comment.content, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="item.type === 'MENTION' && item.comment">
|
<template v-else-if="item.type === 'MENTION' && item.comment">
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/users/${item.fromUser.id}`"
|
:to="`/users/${item.fromUser.id}`"
|
||||||
>
|
>
|
||||||
{{ item.fromUser.username }}
|
{{ item.fromUser.username }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
在评论中提到了你:
|
在评论中提到了你:
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}#comment-${item.comment.id}`"
|
:to="`/posts/${item.post.id}#comment-${item.comment.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.comment.content, 100) }}
|
{{ stripMarkdownLength(item.comment.content, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="item.type === 'MENTION'">
|
<template v-else-if="item.type === 'MENTION'">
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/users/${item.fromUser.id}`"
|
:to="`/users/${item.fromUser.id}`"
|
||||||
>
|
>
|
||||||
{{ item.fromUser.username }}
|
{{ item.fromUser.username }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
在帖子
|
在帖子
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}`"
|
:to="`/posts/${item.post.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.post.title, 100) }}
|
{{ stripMarkdownLength(item.post.title, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
中提到了你
|
中提到了你
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="item.type === 'USER_FOLLOWED'">
|
<template v-else-if="item.type === 'USER_FOLLOWED'">
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/users/${item.fromUser.id}`"
|
:to="`/users/${item.fromUser.id}`"
|
||||||
>
|
>
|
||||||
{{ item.fromUser.username }}
|
{{ item.fromUser.username }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
开始关注你了
|
开始关注你了
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="item.type === 'USER_UNFOLLOWED'">
|
<template v-else-if="item.type === 'USER_UNFOLLOWED'">
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/users/${item.fromUser.id}`"
|
:to="`/users/${item.fromUser.id}`"
|
||||||
>
|
>
|
||||||
{{ item.fromUser.username }}
|
{{ item.fromUser.username }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
取消关注你了
|
取消关注你了
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="item.type === 'FOLLOWED_POST'">
|
<template v-else-if="item.type === 'FOLLOWED_POST'">
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
你关注的
|
你关注的
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/users/${item.fromUser.id}`"
|
:to="`/users/${item.fromUser.id}`"
|
||||||
>
|
>
|
||||||
{{ item.fromUser.username }}
|
{{ item.fromUser.username }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
发布了文章
|
发布了文章
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}`"
|
:to="`/posts/${item.post.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.post.title, 100) }}
|
{{ stripMarkdownLength(item.post.title, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="item.type === 'POST_SUBSCRIBED'">
|
<template v-else-if="item.type === 'POST_SUBSCRIBED'">
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/users/${item.fromUser.id}`"
|
:to="`/users/${item.fromUser.id}`"
|
||||||
>
|
>
|
||||||
{{ item.fromUser.username }}
|
{{ item.fromUser.username }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
订阅了你的文章
|
订阅了你的文章
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}`"
|
:to="`/posts/${item.post.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.post.title, 100) }}
|
{{ stripMarkdownLength(item.post.title, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="item.type === 'POST_UNSUBSCRIBED'">
|
<template v-else-if="item.type === 'POST_UNSUBSCRIBED'">
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/users/${item.fromUser.id}`"
|
:to="`/users/${item.fromUser.id}`"
|
||||||
>
|
>
|
||||||
{{ item.fromUser.username }}
|
{{ item.fromUser.username }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
取消订阅了你的文章
|
取消订阅了你的文章
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}`"
|
:to="`/posts/${item.post.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.post.title, 100) }}
|
{{ stripMarkdownLength(item.post.title, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="item.type === 'POST_REVIEW_REQUEST' && item.fromUser">
|
<template v-else-if="item.type === 'POST_REVIEW_REQUEST' && item.fromUser">
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/users/${item.fromUser.id}`"
|
:to="`/users/${item.fromUser.id}`"
|
||||||
>
|
>
|
||||||
{{ item.fromUser.username }}
|
{{ item.fromUser.username }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
发布了帖子
|
发布了帖子
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}`"
|
:to="`/posts/${item.post.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.post.title, 100) }}
|
{{ stripMarkdownLength(item.post.title, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
,请审核
|
,请审核
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="item.type === 'POST_REVIEW_REQUEST'">
|
<template v-else-if="item.type === 'POST_REVIEW_REQUEST'">
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
您发布的帖子
|
您发布的帖子
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}`"
|
:to="`/posts/${item.post.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.post.title, 100) }}
|
{{ stripMarkdownLength(item.post.title, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
已提交审核
|
已提交审核
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
@@ -466,29 +470,47 @@
|
|||||||
<template v-else-if="item.type === 'POST_REVIEWED' && item.approved">
|
<template v-else-if="item.type === 'POST_REVIEWED' && item.approved">
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
您发布的帖子
|
您发布的帖子
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}`"
|
:to="`/posts/${item.post.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.post.title, 100) }}
|
{{ stripMarkdownLength(item.post.title, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
已审核通过
|
已审核通过
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="item.type === 'POST_REVIEWED' && item.approved === false">
|
<template v-else-if="item.type === 'POST_REVIEWED' && item.approved === false">
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
您发布的帖子
|
您发布的帖子
|
||||||
<router-link
|
<NuxtLink
|
||||||
class="notif-content-text"
|
class="notif-content-text"
|
||||||
@click="markRead(item.id)"
|
@click="markRead(item.id)"
|
||||||
:to="`/posts/${item.post.id}`"
|
:to="`/posts/${item.post.id}`"
|
||||||
>
|
>
|
||||||
{{ stripMarkdownLength(item.post.title, 100) }}
|
{{ stripMarkdownLength(item.post.title, 100) }}
|
||||||
</router-link>
|
</NuxtLink>
|
||||||
已被管理员拒绝
|
已被管理员拒绝
|
||||||
</NotificationContainer>
|
</NotificationContainer>
|
||||||
</template>
|
</template>
|
||||||
|
<template v-else-if="item.type === 'POST_DELETED'">
|
||||||
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
|
管理员
|
||||||
|
<template v-if="item.fromUser">
|
||||||
|
<NuxtLink
|
||||||
|
class="notif-content-text"
|
||||||
|
@click="markRead(item.id)"
|
||||||
|
:to="`/users/${item.fromUser.id}`"
|
||||||
|
>
|
||||||
|
{{ item.fromUser.username }}
|
||||||
|
</NuxtLink>
|
||||||
|
</template>
|
||||||
|
删除了您的帖子
|
||||||
|
<span class="notif-content-text">
|
||||||
|
{{ stripMarkdownLength(item.content, 100) }}
|
||||||
|
</span>
|
||||||
|
</NotificationContainer>
|
||||||
|
</template>
|
||||||
<template v-else>
|
<template v-else>
|
||||||
<NotificationContainer :item="item" :markRead="markRead">
|
<NotificationContainer :item="item" :markRead="markRead">
|
||||||
{{ formatType(item.type) }}
|
{{ formatType(item.type) }}
|
||||||
@@ -499,278 +521,89 @@
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</BaseTimeline>
|
</BaseTimeline>
|
||||||
|
<InfiniteLoadMore :key="selectedTab" :on-load="loadMore" :pause="isLoadingMessage" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref, onMounted, computed } from 'vue'
|
import { ref, watch, onActivated } from 'vue'
|
||||||
import BaseTimeline from '~/components/BaseTimeline.vue'
|
|
||||||
import BasePlaceholder from '~/components/BasePlaceholder.vue'
|
import BasePlaceholder from '~/components/BasePlaceholder.vue'
|
||||||
|
import BaseTimeline from '~/components/BaseTimeline.vue'
|
||||||
import NotificationContainer from '~/components/NotificationContainer.vue'
|
import NotificationContainer from '~/components/NotificationContainer.vue'
|
||||||
import { getToken, authState } from '~/utils/auth'
|
import InfiniteLoadMore from '~/components/InfiniteLoadMore.vue'
|
||||||
import { markNotificationsRead, fetchUnreadCount, notificationState } from '~/utils/notification'
|
|
||||||
import { toast } from '~/main'
|
import { toast } from '~/main'
|
||||||
|
import { authState, getToken } from '~/utils/auth'
|
||||||
import { stripMarkdownLength } from '~/utils/markdown'
|
import { stripMarkdownLength } from '~/utils/markdown'
|
||||||
|
import {
|
||||||
|
fetchNotifications,
|
||||||
|
fetchUnreadCount,
|
||||||
|
isLoadingMessage,
|
||||||
|
markNotificationRead,
|
||||||
|
notifications,
|
||||||
|
markAllRead,
|
||||||
|
hasMore,
|
||||||
|
fetchNotificationPreferences,
|
||||||
|
updateNotificationPreference,
|
||||||
|
} from '~/utils/notification'
|
||||||
import TimeManager from '~/utils/time'
|
import TimeManager from '~/utils/time'
|
||||||
import { reactionEmojiMap } from '~/utils/reactions'
|
import BaseSwitch from '~/components/BaseSwitch.vue'
|
||||||
|
|
||||||
const config = useRuntimeConfig()
|
const config = useRuntimeConfig()
|
||||||
const API_BASE_URL = config.public.apiBaseUrl
|
const API_BASE_URL = config.public.apiBaseUrl
|
||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
const notifications = ref([])
|
|
||||||
const isLoadingMessage = ref(false)
|
|
||||||
const selectedTab = ref(
|
const selectedTab = ref(
|
||||||
['all', 'unread', 'control'].includes(route.query.tab) ? route.query.tab : 'unread',
|
['all', 'unread', 'control'].includes(route.query.tab) ? route.query.tab : 'unread',
|
||||||
)
|
)
|
||||||
const notificationPrefs = ref([])
|
const notificationPrefs = ref([])
|
||||||
const filteredNotifications = computed(() =>
|
const page = ref(0)
|
||||||
selectedTab.value === 'all' ? notifications.value : notifications.value.filter((n) => !n.read),
|
const pageSize = 30
|
||||||
)
|
|
||||||
|
|
||||||
const markRead = async (id) => {
|
const loadMore = async () => {
|
||||||
if (!id) return
|
if (!hasMore.value) return true
|
||||||
const n = notifications.value.find((n) => n.id === id)
|
page.value++
|
||||||
if (!n || n.read) return
|
await fetchNotifications({
|
||||||
n.read = true
|
page: page.value,
|
||||||
if (notificationState.unreadCount > 0) notificationState.unreadCount--
|
size: pageSize,
|
||||||
const ok = await markNotificationsRead([id])
|
unread: selectedTab.value === 'unread',
|
||||||
if (!ok) {
|
append: true,
|
||||||
n.read = false
|
|
||||||
notificationState.unreadCount++
|
|
||||||
} else {
|
|
||||||
fetchUnreadCount()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const markAllRead = async () => {
|
|
||||||
// 除了 REGISTER_REQUEST 类型消息
|
|
||||||
const idsToMark = notifications.value
|
|
||||||
.filter((n) => n.type !== 'REGISTER_REQUEST' && !n.read)
|
|
||||||
.map((n) => n.id)
|
|
||||||
if (idsToMark.length === 0) return
|
|
||||||
notifications.value.forEach((n) => {
|
|
||||||
if (n.type !== 'REGISTER_REQUEST') n.read = true
|
|
||||||
})
|
})
|
||||||
notificationState.unreadCount = notifications.value.filter((n) => !n.read).length
|
return !hasMore.value
|
||||||
const ok = await markNotificationsRead(idsToMark)
|
|
||||||
if (!ok) {
|
|
||||||
notifications.value.forEach((n) => {
|
|
||||||
if (idsToMark.includes(n.id)) n.read = false
|
|
||||||
})
|
|
||||||
await fetchUnreadCount()
|
|
||||||
return
|
|
||||||
}
|
|
||||||
fetchUnreadCount()
|
|
||||||
if (authState.role === 'ADMIN') {
|
|
||||||
toast.success('已读所有消息(注册请求除外)')
|
|
||||||
} else {
|
|
||||||
toast.success('已读所有消息')
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const iconMap = {
|
watch(selectedTab, async (tab) => {
|
||||||
POST_VIEWED: 'fas fa-eye',
|
page.value = 0
|
||||||
COMMENT_REPLY: 'fas fa-reply',
|
await fetchNotifications({ page: 0, size: pageSize, unread: tab === 'unread' })
|
||||||
POST_REVIEWED: 'fas fa-shield-alt',
|
})
|
||||||
POST_REVIEW_REQUEST: 'fas fa-gavel',
|
|
||||||
POST_UPDATED: 'fas fa-comment-dots',
|
|
||||||
USER_ACTIVITY: 'fas fa-user',
|
|
||||||
FOLLOWED_POST: 'fas fa-feather-alt',
|
|
||||||
USER_FOLLOWED: 'fas fa-user-plus',
|
|
||||||
USER_UNFOLLOWED: 'fas fa-user-minus',
|
|
||||||
POST_SUBSCRIBED: 'fas fa-bookmark',
|
|
||||||
POST_UNSUBSCRIBED: 'fas fa-bookmark',
|
|
||||||
REGISTER_REQUEST: 'fas fa-user-clock',
|
|
||||||
ACTIVITY_REDEEM: 'fas fa-coffee',
|
|
||||||
LOTTERY_WIN: 'fas fa-trophy',
|
|
||||||
LOTTERY_DRAW: 'fas fa-bullhorn',
|
|
||||||
MENTION: 'fas fa-at',
|
|
||||||
}
|
|
||||||
|
|
||||||
const fetchNotifications = async () => {
|
|
||||||
try {
|
|
||||||
const token = getToken()
|
|
||||||
if (!token) {
|
|
||||||
toast.error('请先登录')
|
|
||||||
return
|
|
||||||
}
|
|
||||||
isLoadingMessage.value = true
|
|
||||||
notifications.value = []
|
|
||||||
const res = await fetch(`${API_BASE_URL}/api/notifications`, {
|
|
||||||
headers: {
|
|
||||||
Authorization: `Bearer ${token}`,
|
|
||||||
},
|
|
||||||
})
|
|
||||||
isLoadingMessage.value = false
|
|
||||||
if (!res.ok) {
|
|
||||||
toast.error('获取通知失败')
|
|
||||||
return
|
|
||||||
}
|
|
||||||
const data = await res.json()
|
|
||||||
|
|
||||||
for (const n of data) {
|
|
||||||
if (n.type === 'COMMENT_REPLY') {
|
|
||||||
notifications.value.push({
|
|
||||||
...n,
|
|
||||||
src: n.comment.author.avatar,
|
|
||||||
iconClick: () => {
|
|
||||||
markRead(n.id)
|
|
||||||
navigateTo(`/users/${n.comment.author.id}`, { replace: true })
|
|
||||||
},
|
|
||||||
})
|
|
||||||
} else if (n.type === 'REACTION') {
|
|
||||||
notifications.value.push({
|
|
||||||
...n,
|
|
||||||
emoji: reactionEmojiMap[n.reactionType],
|
|
||||||
iconClick: () => {
|
|
||||||
if (n.fromUser) {
|
|
||||||
markRead(n.id)
|
|
||||||
navigateTo(`/users/${n.fromUser.id}`, { replace: true })
|
|
||||||
}
|
|
||||||
},
|
|
||||||
})
|
|
||||||
} else if (n.type === 'POST_VIEWED') {
|
|
||||||
notifications.value.push({
|
|
||||||
...n,
|
|
||||||
src: n.fromUser ? n.fromUser.avatar : null,
|
|
||||||
icon: n.fromUser ? undefined : iconMap[n.type],
|
|
||||||
iconClick: () => {
|
|
||||||
if (n.fromUser) {
|
|
||||||
markRead(n.id)
|
|
||||||
navigateTo(`/users/${n.fromUser.id}`, { replace: true })
|
|
||||||
}
|
|
||||||
},
|
|
||||||
})
|
|
||||||
} else if (n.type === 'LOTTERY_WIN') {
|
|
||||||
notifications.value.push({
|
|
||||||
...n,
|
|
||||||
icon: iconMap[n.type],
|
|
||||||
iconClick: () => {
|
|
||||||
if (n.post) {
|
|
||||||
markRead(n.id)
|
|
||||||
router.push(`/posts/${n.post.id}`)
|
|
||||||
}
|
|
||||||
},
|
|
||||||
})
|
|
||||||
} else if (n.type === 'LOTTERY_DRAW') {
|
|
||||||
notifications.value.push({
|
|
||||||
...n,
|
|
||||||
icon: iconMap[n.type],
|
|
||||||
iconClick: () => {
|
|
||||||
if (n.post) {
|
|
||||||
markRead(n.id)
|
|
||||||
router.push(`/posts/${n.post.id}`)
|
|
||||||
}
|
|
||||||
},
|
|
||||||
})
|
|
||||||
} else if (n.type === 'POST_UPDATED') {
|
|
||||||
notifications.value.push({
|
|
||||||
...n,
|
|
||||||
src: n.comment.author.avatar,
|
|
||||||
iconClick: () => {
|
|
||||||
markRead(n.id)
|
|
||||||
navigateTo(`/users/${n.comment.author.id}`, { replace: true })
|
|
||||||
},
|
|
||||||
})
|
|
||||||
} else if (n.type === 'USER_ACTIVITY') {
|
|
||||||
notifications.value.push({
|
|
||||||
...n,
|
|
||||||
src: n.comment.author.avatar,
|
|
||||||
iconClick: () => {
|
|
||||||
markRead(n.id)
|
|
||||||
navigateTo(`/users/${n.comment.author.id}`, { replace: true })
|
|
||||||
},
|
|
||||||
})
|
|
||||||
} else if (n.type === 'MENTION') {
|
|
||||||
notifications.value.push({
|
|
||||||
...n,
|
|
||||||
icon: iconMap[n.type],
|
|
||||||
iconClick: () => {
|
|
||||||
if (n.fromUser) {
|
|
||||||
markRead(n.id)
|
|
||||||
navigateTo(`/users/${n.fromUser.id}`, { replace: true })
|
|
||||||
}
|
|
||||||
},
|
|
||||||
})
|
|
||||||
} else if (n.type === 'USER_FOLLOWED' || n.type === 'USER_UNFOLLOWED') {
|
|
||||||
notifications.value.push({
|
|
||||||
...n,
|
|
||||||
icon: iconMap[n.type],
|
|
||||||
iconClick: () => {
|
|
||||||
if (n.fromUser) {
|
|
||||||
markRead(n.id)
|
|
||||||
navigateTo(`/users/${n.fromUser.id}`, { replace: true })
|
|
||||||
}
|
|
||||||
},
|
|
||||||
})
|
|
||||||
} else if (n.type === 'FOLLOWED_POST') {
|
|
||||||
notifications.value.push({
|
|
||||||
...n,
|
|
||||||
icon: iconMap[n.type],
|
|
||||||
iconClick: () => {
|
|
||||||
if (n.post) {
|
|
||||||
markRead(n.id)
|
|
||||||
navigateTo(`/posts/${n.post.id}`, { replace: true })
|
|
||||||
}
|
|
||||||
},
|
|
||||||
})
|
|
||||||
} else if (n.type === 'POST_SUBSCRIBED' || n.type === 'POST_UNSUBSCRIBED') {
|
|
||||||
notifications.value.push({
|
|
||||||
...n,
|
|
||||||
icon: iconMap[n.type],
|
|
||||||
iconClick: () => {
|
|
||||||
if (n.post) {
|
|
||||||
markRead(n.id)
|
|
||||||
navigateTo(`/posts/${n.post.id}`, { replace: true })
|
|
||||||
}
|
|
||||||
},
|
|
||||||
})
|
|
||||||
} else if (n.type === 'POST_REVIEW_REQUEST') {
|
|
||||||
notifications.value.push({
|
|
||||||
...n,
|
|
||||||
src: n.fromUser ? n.fromUser.avatar : null,
|
|
||||||
icon: n.fromUser ? undefined : iconMap[n.type],
|
|
||||||
iconClick: () => {
|
|
||||||
if (n.post) {
|
|
||||||
markRead(n.id)
|
|
||||||
navigateTo(`/posts/${n.post.id}`, { replace: true })
|
|
||||||
}
|
|
||||||
},
|
|
||||||
})
|
|
||||||
} else if (n.type === 'REGISTER_REQUEST') {
|
|
||||||
notifications.value.push({
|
|
||||||
...n,
|
|
||||||
icon: iconMap[n.type],
|
|
||||||
iconClick: () => {},
|
|
||||||
})
|
|
||||||
} else {
|
|
||||||
notifications.value.push({
|
|
||||||
...n,
|
|
||||||
icon: iconMap[n.type],
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
} catch (e) {
|
|
||||||
console.error(e)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const fetchPrefs = async () => {
|
const fetchPrefs = async () => {
|
||||||
notificationPrefs.value = await fetchNotificationPreferences()
|
notificationPrefs.value = await fetchNotificationPreferences()
|
||||||
}
|
}
|
||||||
|
|
||||||
const togglePref = async (pref) => {
|
const togglePref = async (pref, value) => {
|
||||||
const ok = await updateNotificationPreference(pref.type, !pref.enabled)
|
const ok = await updateNotificationPreference(pref.type, value)
|
||||||
if (ok) {
|
if (ok) {
|
||||||
pref.enabled = !pref.enabled
|
pref.enabled = value
|
||||||
await fetchNotifications()
|
await fetchNotifications({
|
||||||
|
page: page.value,
|
||||||
|
size: pageSize,
|
||||||
|
unread: selectedTab.value === 'unread',
|
||||||
|
})
|
||||||
await fetchUnreadCount()
|
await fetchUnreadCount()
|
||||||
} else {
|
} else {
|
||||||
toast.error('操作失败')
|
toast.error('操作失败')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const markRead = async (id) => {
|
||||||
|
markNotificationRead(id)
|
||||||
|
if (selectedTab.value === 'unread') {
|
||||||
|
const index = notifications.value.findIndex((n) => n.id === id)
|
||||||
|
if (index !== -1) notifications.value.splice(index, 1)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
const approve = async (id, nid) => {
|
const approve = async (id, nid) => {
|
||||||
const token = getToken()
|
const token = getToken()
|
||||||
if (!token) return
|
if (!token) return
|
||||||
@@ -833,17 +666,22 @@ const formatType = (t) => {
|
|||||||
return '有人申请注册'
|
return '有人申请注册'
|
||||||
case 'ACTIVITY_REDEEM':
|
case 'ACTIVITY_REDEEM':
|
||||||
return '有人申请兑换奶茶'
|
return '有人申请兑换奶茶'
|
||||||
|
case 'POINT_REDEEM':
|
||||||
|
return '有人申请积分兑换'
|
||||||
case 'LOTTERY_WIN':
|
case 'LOTTERY_WIN':
|
||||||
return '抽奖中奖了'
|
return '抽奖中奖了'
|
||||||
case 'LOTTERY_DRAW':
|
case 'LOTTERY_DRAW':
|
||||||
return '抽奖已开奖'
|
return '抽奖已开奖'
|
||||||
|
case 'POST_DELETED':
|
||||||
|
return '帖子被删除'
|
||||||
default:
|
default:
|
||||||
return t
|
return t
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
onMounted(() => {
|
onActivated(async () => {
|
||||||
fetchNotifications()
|
page.value = 0
|
||||||
|
await fetchNotifications({ page: 0, size: pageSize, unread: selectedTab.value === 'unread' })
|
||||||
fetchPrefs()
|
fetchPrefs()
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
@@ -870,6 +708,7 @@ onMounted(() => {
|
|||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
backdrop-filter: var(--blur-10);
|
||||||
}
|
}
|
||||||
|
|
||||||
.message-page-header-right {
|
.message-page-header-right {
|
||||||
@@ -1006,26 +845,21 @@ onMounted(() => {
|
|||||||
padding: 20px;
|
padding: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.message-control-push-item-container {
|
.message-control-item-container {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: column;
|
||||||
flex-wrap: wrap;
|
|
||||||
gap: 10px;
|
gap: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.message-control-push-item {
|
.message-control-item {
|
||||||
font-size: 14px;
|
display: flex;
|
||||||
margin-bottom: 5px;
|
align-items: center;
|
||||||
padding: 8px 16px;
|
justify-content: space-between;
|
||||||
border: 1px solid var(--normal-border-color);
|
max-width: 200px;
|
||||||
border-radius: 10px;
|
|
||||||
cursor: pointer;
|
|
||||||
transition: all 0.3s ease;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.message-control-push-item.select {
|
.message-control-item-label {
|
||||||
background-color: var(--primary-color);
|
font-size: 14px;
|
||||||
color: white;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 768px) {
|
@media (max-width: 768px) {
|
||||||
|
|||||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user