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

feat: icon fix

Browse Source
This commit is contained in:
tim
2025-07-06 20:56:00 +08:00
parent 8c79b095c7
commit e86449eebe
2 changed files with 45 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
open-isle-cli/src/views/HomePageView.vue
View File

@@ -57,14 +57,14 @@
<div class="article-item-description main-item">{{ sanitizeDescription(article.description) }}</div>
<div class="article-info-container main-item">
<div class="article-info-item">
<i class="fas fa-user"></i>
<div class="article-info-item-text">{{ article.category }}</div>
<img class="article-info-item-img" :src="article.category.smallIcon" alt="category">
<div class="article-info-item-text">{{ article.category.name }}</div>
</div>
<div class="article-tags-container">
<div class="article-tag-item" v-for="tag in article.tags" :key="tag">
<i class="fas fa-tag"></i>
<div class="article-tag-item-text">{{ tag }}</div>
<div class="article-info-item" v-for="tag in article.tags" :key="tag">
<img class="article-info-item-img" :src="tag.smallIcon" alt="tag">
<div class="article-info-item-text">{{ tag.name }}</div>
</div>
</div>
</div>

50
open-isle-cli/src/views/PostPageView.vue
View File

@@ -1,18 +1,21 @@
<template>
<div class="post-page-container">
<div class="post-page-main-container" ref="mainContainer" @scroll="onScroll">
<div v-if="isWaitingFetchingPost" class="loading-container">
<l-hatch size="28" stroke="4" speed="3.5" color="var(--primary-color)"></l-hatch>
</div>
<div v-else class="post-page-main-container" ref="mainContainer" @scroll="onScroll">
<div class="article-title-container">
<div class="article-title">{{ title }}</div>
<div class="article-info-container">
<div class="article-info-item">
<i class="fas fa-user"></i>
<div class="article-info-item-text">开发调优</div>
<img class="article-info-item-img" :src="category.smallIcon" alt="category">
<div class="article-info-item-text">{{ category.name }}</div>
</div>
<div class="article-tags-container">
<div class="article-tag-item" v-for="tag in tags" :key="tag">
<i class="fas fa-tag"></i>
<div class="article-tag-item-text">{{ tag }}</div>
<div class="article-info-item" v-for="tag in tags" :key="tag">
<img class="article-info-item-img" :src="tag.smallIcon" alt="tag">
<div class="article-info-item-text">{{ tag.name }}</div>
</div>
</div>
</div>
@@ -71,13 +74,15 @@
<div class="post-page-scroller-container">
<div class="scroller">
<div class="scroller-time">{{ postTime }}</div>
<div v-if="isWaitingFetchingPost" class="scroller-time">loading...</div>
<div v-else class="scroller-time">{{ postTime }}</div>
<div class="scroller-middle">
<input type="range" class="scroller-range" :max="totalPosts" :min="1" v-model.number="currentIndex"
@input="onSliderInput" />
<div class="scroller-index">{{ currentIndex }}/{{ totalPosts }}</div>
</div>
<div class="scroller-time">{{ lastReplyTime }}</div>
<div v-if="isWaitingFetchingPost" class="scroller-time">loading...</div>
<div v-else class="scroller-time">{{ lastReplyTime }}</div>
</div>
</div>
</div>
@@ -91,6 +96,8 @@ import CommentEditor from '../components/CommentEditor.vue'
import { renderMarkdown } from '../utils/markdown'
import { API_BASE_URL, toast } from '../main'
import { getToken } from '../utils/auth'
import { hatch } from 'ldrs'
hatch.register()
export default {
name: 'PostPageView',
@@ -101,8 +108,10 @@ export default {
const title = ref('')
const postContent = ref('')
const category = ref('')
const tags = ref([])
const comments = ref([])
const isWaitingFetchingPost = ref(false);
const postTime = ref('')
const postItems = ref([])
const mainContainer = ref(null)
@@ -119,11 +128,14 @@ export default {
const fetchPost = async () => {
try {
isWaitingFetchingPost.value = true;
const res = await fetch(`${API_BASE_URL}/api/posts/${postId}`)
isWaitingFetchingPost.value = false;
if (!res.ok) return
const data = await res.json()
postContent.value = data.content
title.value = data.title
category.value = data.category
tags.value = data.tags || []
comments.value = (data.comments || []).map(mapComment)
postTime.value = new Date(data.createdAt).toLocaleDateString('zh-CN', { month: 'numeric', day: 'numeric' })
@@ -201,6 +213,7 @@ export default {
return {
postContent,
title,
category,
tags,
comments,
postTime,
@@ -213,7 +226,8 @@ export default {
onSliderInput,
onScroll: updateCurrentIndex,
copyPostLink,
renderMarkdown
renderMarkdown,
isWaitingFetchingPost
}
}
}
@@ -225,6 +239,14 @@ export default {
height: calc(100vh - var(--header-height));
}
.loading-container {
display: flex;
justify-content: center;
align-items: center;
height: 200px;
width: 85%;
}
.post-page-main-container {
overflow-y: auto;
scrollbar-width: none;
@@ -334,11 +356,19 @@ export default {
gap: 10px;
}
.article-tag-item {
.article-info-item {
display: flex;
flex-direction: row;
gap: 5px;
align-items: center;
font-size: 14px;
padding: 2px 4px;
background-color: #f0f0f0;
}
.article-info-item-img {
width: 16px;
height: 16px;
}
.info-content-container {