jiazhizhong/OpenIsle
1
0
Fork 0
mirror of https://github.com/nagisa77/OpenIsle.git synced 2026-03-06 03:50:47 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: ui 调整

Browse Source
This commit is contained in:
Tim
2025-08-21 12:27:50 +08:00
parent ed7dcd9414
commit 72e9a77373
4 changed files with 140 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
backend/src/main/java/com/openisle/controller/AuthController.java
View File

@@ -47,7 +47,8 @@ public class AuthController {
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()) { if (req.getInviteToken() != null && !req.getInviteToken().isEmpty()) {
if (!inviteService.validate(req.getInviteToken())) { InviteService.InviteValidateResult result = inviteService.validate(req.getInviteToken());
if (!result.isValidate()) {
return ResponseEntity.badRequest().body(Map.of("error", "邀请码使用次数过多")); return ResponseEntity.badRequest().body(Map.of("error", "邀请码使用次数过多"));
} }
try { try {
@@ -144,7 +145,8 @@ public class AuthController {
@PostMapping("/google") @PostMapping("/google")
public ResponseEntity<?> loginWithGoogle(@RequestBody GoogleLoginRequest req) { public ResponseEntity<?> loginWithGoogle(@RequestBody GoogleLoginRequest req) {
boolean viaInvite = req.getInviteToken() != null && !req.getInviteToken().isEmpty(); boolean viaInvite = req.getInviteToken() != null && !req.getInviteToken().isEmpty();
if (viaInvite && !inviteService.validate(req.getInviteToken())) { InviteService.InviteValidateResult inviteValidateResult = inviteService.validate(req.getInviteToken());
if (viaInvite && !inviteValidateResult.isValidate()) {
return ResponseEntity.badRequest().body(Map.of("error", "Invalid invite token")); return ResponseEntity.badRequest().body(Map.of("error", "Invalid invite token"));
} }
Optional<AuthResult> resultOpt = googleAuthService.authenticate( Optional<AuthResult> resultOpt = googleAuthService.authenticate(
@@ -154,7 +156,7 @@ public class AuthController {
if (resultOpt.isPresent()) { if (resultOpt.isPresent()) {
AuthResult result = resultOpt.get(); AuthResult result = resultOpt.get();
if (viaInvite && result.isNewUser()) { if (viaInvite && result.isNewUser()) {
inviteService.consume(req.getInviteToken(), user.getUsername()); inviteService.consume(req.getInviteToken(), inviteValidateResult.getInviteToken().getInviter().getUsername());
return ResponseEntity.ok(Map.of( return ResponseEntity.ok(Map.of(
"token", jwtService.generateToken(result.getUser().getUsername()), "token", jwtService.generateToken(result.getUser().getUsername()),
"reason_code", "INVITE_APPROVED" "reason_code", "INVITE_APPROVED"
@@ -218,7 +220,8 @@ public class AuthController {
@PostMapping("/github") @PostMapping("/github")
public ResponseEntity<?> loginWithGithub(@RequestBody GithubLoginRequest req) { public ResponseEntity<?> loginWithGithub(@RequestBody GithubLoginRequest req) {
boolean viaInvite = req.getInviteToken() != null && !req.getInviteToken().isEmpty(); boolean viaInvite = req.getInviteToken() != null && !req.getInviteToken().isEmpty();
if (viaInvite && !inviteService.validate(req.getInviteToken())) { InviteService.InviteValidateResult inviteValidateResult = inviteService.validate(req.getInviteToken());
if (viaInvite && !inviteValidateResult.isValidate()) {
return ResponseEntity.badRequest().body(Map.of("error", "Invalid invite token")); return ResponseEntity.badRequest().body(Map.of("error", "Invalid invite token"));
} }
Optional<AuthResult> resultOpt = githubAuthService.authenticate( Optional<AuthResult> resultOpt = githubAuthService.authenticate(
@@ -229,7 +232,7 @@ public class AuthController {
if (resultOpt.isPresent()) { if (resultOpt.isPresent()) {
AuthResult result = resultOpt.get(); AuthResult result = resultOpt.get();
if (viaInvite && result.isNewUser()) { if (viaInvite && result.isNewUser()) {
inviteService.consume(req.getInviteToken(), user.getUsername()); inviteService.consume(req.getInviteToken(), inviteValidateResult.getInviteToken().getInviter().getUsername());
return ResponseEntity.ok(Map.of( return ResponseEntity.ok(Map.of(
"token", jwtService.generateToken(result.getUser().getUsername()), "token", jwtService.generateToken(result.getUser().getUsername()),
"reason_code", "INVITE_APPROVED" "reason_code", "INVITE_APPROVED"
@@ -265,7 +268,8 @@ public class AuthController {
@PostMapping("/discord") @PostMapping("/discord")
public ResponseEntity<?> loginWithDiscord(@RequestBody DiscordLoginRequest req) { public ResponseEntity<?> loginWithDiscord(@RequestBody DiscordLoginRequest req) {
boolean viaInvite = req.getInviteToken() != null && !req.getInviteToken().isEmpty(); boolean viaInvite = req.getInviteToken() != null && !req.getInviteToken().isEmpty();
if (viaInvite && !inviteService.validate(req.getInviteToken())) { InviteService.InviteValidateResult inviteValidateResult = inviteService.validate(req.getInviteToken());
if (viaInvite && !inviteValidateResult.isValidate()) {
return ResponseEntity.badRequest().body(Map.of("error", "Invalid invite token")); return ResponseEntity.badRequest().body(Map.of("error", "Invalid invite token"));
} }
Optional<AuthResult> resultOpt = discordAuthService.authenticate( Optional<AuthResult> resultOpt = discordAuthService.authenticate(
@@ -276,7 +280,7 @@ public class AuthController {
if (resultOpt.isPresent()) { if (resultOpt.isPresent()) {
AuthResult result = resultOpt.get(); AuthResult result = resultOpt.get();
if (viaInvite && result.isNewUser()) { if (viaInvite && result.isNewUser()) {
inviteService.consume(req.getInviteToken(), user.getUsername()); inviteService.consume(req.getInviteToken(), inviteValidateResult.getInviteToken().getInviter().getUsername());
return ResponseEntity.ok(Map.of( return ResponseEntity.ok(Map.of(
"token", jwtService.generateToken(result.getUser().getUsername()), "token", jwtService.generateToken(result.getUser().getUsername()),
"reason_code", "INVITE_APPROVED" "reason_code", "INVITE_APPROVED"
@@ -311,7 +315,8 @@ public class AuthController {
@PostMapping("/twitter") @PostMapping("/twitter")
public ResponseEntity<?> loginWithTwitter(@RequestBody TwitterLoginRequest req) { public ResponseEntity<?> loginWithTwitter(@RequestBody TwitterLoginRequest req) {
boolean viaInvite = req.getInviteToken() != null && !req.getInviteToken().isEmpty(); boolean viaInvite = req.getInviteToken() != null && !req.getInviteToken().isEmpty();
if (viaInvite && !inviteService.validate(req.getInviteToken())) { InviteService.InviteValidateResult inviteValidateResult = inviteService.validate(req.getInviteToken());
if (viaInvite && !inviteValidateResult.isValidate()) {
return ResponseEntity.badRequest().body(Map.of("error", "Invalid invite token")); return ResponseEntity.badRequest().body(Map.of("error", "Invalid invite token"));
} }
Optional<AuthResult> resultOpt = twitterAuthService.authenticate( Optional<AuthResult> resultOpt = twitterAuthService.authenticate(
@@ -323,7 +328,7 @@ public class AuthController {
if (resultOpt.isPresent()) { if (resultOpt.isPresent()) {
AuthResult result = resultOpt.get(); AuthResult result = resultOpt.get();
if (viaInvite && result.isNewUser()) { if (viaInvite && result.isNewUser()) {
inviteService.consume(req.getInviteToken(), user.getUsername()); inviteService.consume(req.getInviteToken(), inviteValidateResult.getInviteToken().getInviter().getUsername());
return ResponseEntity.ok(Map.of( return ResponseEntity.ok(Map.of(
"token", jwtService.generateToken(result.getUser().getUsername()), "token", jwtService.generateToken(result.getUser().getUsername()),
"reason_code", "INVITE_APPROVED" "reason_code", "INVITE_APPROVED"

16
backend/src/main/java/com/openisle/service/InviteService.java
View File

@@ -5,6 +5,7 @@ import com.openisle.model.User;
import com.openisle.repository.InviteTokenRepository; import com.openisle.repository.InviteTokenRepository;
import com.openisle.repository.UserRepository; import com.openisle.repository.UserRepository;
import lombok.RequiredArgsConstructor; import lombok.RequiredArgsConstructor;
import lombok.Value;
import org.springframework.stereotype.Service; import org.springframework.stereotype.Service;
import java.time.LocalDate; import java.time.LocalDate;
@@ -18,6 +19,12 @@ public class InviteService {
private final JwtService jwtService; private final JwtService jwtService;
private final PointService pointService; private final PointService pointService;
@Value
public class InviteValidateResult {
InviteToken inviteToken;
boolean validate;
}
public String generate(String username) { public String generate(String username) {
User inviter = userRepository.findByUsername(username).orElseThrow(); User inviter = userRepository.findByUsername(username).orElseThrow();
LocalDate today = LocalDate.now(); LocalDate today = LocalDate.now();
@@ -35,14 +42,17 @@ public class InviteService {
return token; return token;
} }
public boolean validate(String token) { public InviteValidateResult validate(String token) {
if (token == null || token.isEmpty()) {
return new InviteValidateResult(null, false);
}
try { try {
jwtService.validateAndGetSubjectForInvite(token); jwtService.validateAndGetSubjectForInvite(token);
} catch (Exception e) { } catch (Exception e) {
return false; return new InviteValidateResult(null, false);
} }
InviteToken invite = inviteTokenRepository.findById(token).orElse(null); InviteToken invite = inviteTokenRepository.findById(token).orElse(null);
return invite != null && invite.getUsageCount() < 3; return new InviteValidateResult(invite, invite != null && invite.getUsageCount() < 3);
} }
public void consume(String token, String newUserName) { public void consume(String token, String newUserName) {

3
backend/src/main/java/com/openisle/service/PointService.java
View File

@@ -49,6 +49,9 @@ public class PointService {
private int addPoint(User user, int amount, PointHistoryType type, private int addPoint(User user, int amount, PointHistoryType type,
Post post, Comment comment, User fromUser) { 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); recordHistory(user, type, amount, post, comment, fromUser);

168
frontend_nuxt/pages/points.vue
View File

@@ -16,49 +16,52 @@
</div> </div>
<template v-if="selectedTab === 'mall'"> <template v-if="selectedTab === 'mall'">
<section class="rules"> <div class="point-mall-page-content">
<div class="section-title">🎉 积分规则</div> <section class="rules">
<div class="section-content"> <div class="section-title">🎉 积分规则</div>
<div class="section-item" v-for="(rule, idx) in pointRules" :key="idx">{{ rule }}</div> <div class="section-content">
</div> <div class="section-item" v-for="(rule, idx) in pointRules" :key="idx">{{ rule }}</div>
</section>
<div class="loading-points-container" v-if="isLoading">
<l-hatch size="28" stroke="4" speed="3.5" color="var(--primary-color)"></l-hatch>
</div>
<div class="point-info">
<p v-if="authState.loggedIn && point !== null">
<span><i class="fas fa-coins coin-icon"></i></span>我的积分：<span class="point-value">{{
point
}}</span>
</p>
</div>
<section class="goods">
<div class="goods-item" v-for="(good, idx) in goods" :key="idx">
<img class="goods-item-image" :src="good.image" alt="good.name" />
<div class="goods-item-name">{{ good.name }}</div>
<div class="goods-item-cost">
<i class="fas fa-coins"></i>
{{ good.cost }} 积分
</div>
<div
class="goods-item-button"
:class="{ disabled: !authState.loggedIn || point === null || point < good.cost }"
@click="openRedeem(good)"
>
兑换
</div> </div>
</section>
<div class="loading-points-container" v-if="isLoading">
<l-hatch size="28" stroke="4" speed="3.5" color="var(--primary-color)"></l-hatch>
</div> </div>
</section>
<RedeemPopup <div class="point-info">
:visible="dialogVisible" <p v-if="authState.loggedIn && point !== null">
v-model="contact" <span><i class="fas fa-coins coin-icon"></i></span>我的积分：<span
:loading="loading" class="point-value"
@close="closeRedeem" >{{ point }}</span
@submit="submitRedeem" >
/> </p>
</div>
<section class="goods">
<div class="goods-item" v-for="(good, idx) in goods" :key="idx">
<img class="goods-item-image" :src="good.image" alt="good.name" />
<div class="goods-item-name">{{ good.name }}</div>
<div class="goods-item-cost">
<i class="fas fa-coins"></i>
{{ good.cost }} 积分
</div>
<div
class="goods-item-button"
:class="{ disabled: !authState.loggedIn || point === null || point < good.cost }"
@click="openRedeem(good)"
>
兑换
</div>
</div>
</section>
<RedeemPopup
:visible="dialogVisible"
v-model="contact"
:loading="loading"
@close="closeRedeem"
@submit="submitRedeem"
/>
</div>
</template> </template>
<template v-else> <template v-else>
@@ -77,14 +80,30 @@
}}</NuxtLink> }}</NuxtLink>
，获得{{ item.amount }}积分 ，获得{{ item.amount }}积分
</template> </template>
<template v-else-if="item.type === 'COMMENT' && item.commentId && !item.fromUserId"> <template v-else-if="item.type === 'COMMENT'">
发送评论 在文章
<NuxtLink <NuxtLink :to="`/posts/${item.postId}`" class="timeline-link">{{
:to="`/posts/${item.postId}#comment-${item.commentId}`" item.postTitle
class="timeline-link" }}</NuxtLink>
>{{ stripMarkdownLength(item.commentContent, 100) }}</NuxtLink 中
> <template v-if="!item.fromUserId">
，获得{{ item.amount }}积分 发送评论
<NuxtLink
:to="`/posts/${item.postId}#comment-${item.commentId}`"
class="timeline-link"
>{{ stripMarkdownLength(item.commentContent, 100) }}</NuxtLink
>
，获得{{ item.amount }}积分
</template>
<template v-else>
被评论
<NuxtLink
:to="`/posts/${item.postId}#comment-${item.commentId}`"
class="timeline-link"
>{{ stripMarkdownLength(item.commentContent, 100) }}</NuxtLink
>
，获得{{ item.amount }}积分
</template>
</template> </template>
<template v-else-if="item.type === 'POST_LIKED' && item.fromUserId"> <template v-else-if="item.type === 'POST_LIKED' && item.fromUserId">
帖子 帖子
@@ -114,13 +133,13 @@
邀请了好友 邀请了好友
<NuxtLink :to="`/users/${item.fromUserId}`" class="timeline-link">{{ <NuxtLink :to="`/users/${item.fromUserId}`" class="timeline-link">{{
item.fromUserName item.fromUserName
}}</NuxtLink }}</NuxtLink>
>，加入社区，获得 {{ item.amount }} 积分 加入社区 🎉，获得 {{ item.amount }} 积分
</template>
<template v-else-if="item.type === 'SYSTEM_ONLINE'">
积分历史系统上线，你目前的积分是 {{ item.balance }}
</template> </template>
<template v-else-if="item.type === 'SYSTEM_ONLINE'"> 积分历史系统上线 </template>
<i class="fas fa-coins"></i> 你目前的积分是 {{ item.balance }}
</div> </div>
<div class="history-time">{{ TimeManager.format(item.createdAt) }}</div>
</template> </template>
</BaseTimeline> </BaseTimeline>
</div> </div>
@@ -136,6 +155,7 @@ import RedeemPopup from '~/components/RedeemPopup.vue'
import BaseTimeline from '~/components/BaseTimeline.vue' import BaseTimeline from '~/components/BaseTimeline.vue'
import BasePlaceholder from '~/components/BasePlaceholder.vue' import BasePlaceholder from '~/components/BasePlaceholder.vue'
import { stripMarkdownLength } from '~/utils/markdown' import { stripMarkdownLength } from '~/utils/markdown'
import TimeManager from '~/utils/time'
const config = useRuntimeConfig() const config = useRuntimeConfig()
const API_BASE_URL = config.public.apiBaseUrl const API_BASE_URL = config.public.apiBaseUrl
@@ -161,6 +181,15 @@ const contact = ref('')
const loading = ref(false) const loading = ref(false)
const selectedGood = ref(null) const selectedGood = ref(null)
const iconMap = {
POST: 'fas fa-file-alt',
COMMENT: 'fas fa-comment',
POST_LIKED: 'fas fa-thumbs-up',
COMMENT_LIKED: 'fas fa-thumbs-up',
INVITE: 'fas fa-user-plus',
SYSTEM_ONLINE: 'fas fa-clock',
}
onMounted(async () => { onMounted(async () => {
isLoading.value = true isLoading.value = true
if (authState.loggedIn) { if (authState.loggedIn) {
@@ -195,7 +224,10 @@ const loadHistory = async () => {
headers: { Authorization: `Bearer ${token}` }, headers: { Authorization: `Bearer ${token}` },
}) })
if (res.ok) { if (res.ok) {
histories.value = await res.json() histories.value = (await res.json()).map((item) => ({
...item,
icon: iconMap[item.type],
}))
} }
historyLoading.value = false historyLoading.value = false
historyLoaded.value = true historyLoaded.value = true
@@ -241,12 +273,15 @@ const submitRedeem = async () => {
<style scoped> <style scoped>
.point-mall-page { .point-mall-page {
padding: 0 20px;
max-width: var(--page-max-width); max-width: var(--page-max-width);
background-color: var(--background-color); background-color: var(--background-color);
margin: 0 auto; margin: 0 auto;
} }
.point-mall-page-content {
padding: 0 20px;
}
.point-tabs { .point-tabs {
display: flex; display: flex;
border-bottom: 1px solid var(--normal-border-color); border-bottom: 1px solid var(--normal-border-color);
@@ -259,15 +294,21 @@ const submitRedeem = async () => {
.point-tab-item.selected { .point-tab-item.selected {
border-bottom: 2px solid var(--primary-color); border-bottom: 2px solid var(--primary-color);
font-weight: bold; color: var(--primary-color);
} }
.timeline-container { .timeline-container {
margin-top: 20px; padding: 10px 20px;
} }
.timeline-link { .timeline-link {
color: var(--primary-color); color: var(--primary-color);
text-decoration: none;
font-weight: bold;
}
.timeline-link:hover {
text-decoration: underline;
} }
.loading-points-container { .loading-points-container {
@@ -350,6 +391,17 @@ const submitRedeem = async () => {
cursor: not-allowed; cursor: not-allowed;
} }
.history-content {
font-size: 14px;
opacity: 0.8;
}
.history-time {
font-size: 12px;
color: var(--text-color);
opacity: 0.7;
}
.section-title { .section-title {
font-size: 18px; font-size: 18px;
font-weight: bold; font-weight: bold;