opensource/mateclaw
2
0
Fork 0
mirror of https://gitee.com/mateos/mateclaw.git synced 2026-09-15 20:08:18 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

style(wiki): replace related-page signal emoji with Element Plus icons

Browse Source
This commit is contained in:
matevip 2026-06-13 07:29:39 +08:00
parent 4b6e0b2e0e
commit ac035d6d99
1 changed files with 21 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
mateclaw-ui/src/views/Wiki/components/RelatedPagesPanel.vue
View File

@ -15,7 +15,8 @@
class="signal-tag" class="signal-tag"
:class="sig" :class="sig"
> >
{{ signalIcon(sig) }} {{ t(`wiki.relation.${sig}`) }} <el-icon class="signal-tag-icon"><component :is="signalIcon(sig)" /></el-icon>
{{ t(`wiki.relation.${sig}`) }}
</span> </span>
</div> </div>
<div class="related-info"> <div class="related-info">
@ -29,7 +30,9 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref, watch } from 'vue' import { ref, watch } from 'vue'
import type { Component } from 'vue'
import { useI18n } from 'vue-i18n' import { useI18n } from 'vue-i18n'
import { Connection, Files, TopRight, Aim } from '@element-plus/icons-vue'
import { wikiApi } from '@/api/index' import { wikiApi } from '@/api/index'
const { t } = useI18n() const { t } = useI18n()
@ -53,14 +56,17 @@ interface RelatedPage {
const relatedPages = ref<RelatedPage[]>([]) const relatedPages = ref<RelatedPage[]>([])
function signalIcon(sig: string): string { // Map each relation signal to a project-standard Element Plus icon (replacing the
switch (sig) { // previous emoji glyphs, which rendered inconsistently across platforms/fonts).
case 'shared_chunk': return '🔗' const SIGNAL_ICONS: Record<string, Component> = {
case 'shared_raw': return '📂' shared_chunk: Connection,
case 'direct_link': return '↗' shared_raw: Files,
case 'semantic_near': return '◎' direct_link: TopRight,
default: return '•' semantic_near: Aim,
} }
function signalIcon(sig: string): Component {
return SIGNAL_ICONS[sig] || Connection
} }
async function fetchRelated() { async function fetchRelated() {
@ -123,11 +129,17 @@ watch(() => [props.kbId, props.slug], fetchRelated, { immediate: true })
} }
.signal-tag { .signal-tag {
display: inline-flex;
align-items: center;
gap: 3px;
font-size: 10px; font-size: 10px;
padding: 1px 6px; padding: 1px 6px;
border-radius: 4px; border-radius: 4px;
font-weight: 500; font-weight: 500;
} }
.signal-tag-icon {
font-size: 11px;
}
.signal-tag.shared_chunk { background: rgba(59,130,246,0.1); color: #3b82f6; } .signal-tag.shared_chunk { background: rgba(59,130,246,0.1); color: #3b82f6; }
.signal-tag.shared_raw { background: rgba(168,85,247,0.1); color: #a855f7; } .signal-tag.shared_raw { background: rgba(168,85,247,0.1); color: #a855f7; }
.signal-tag.direct_link { background: rgba(34,197,94,0.1); color: #22c55e; } .signal-tag.direct_link { background: rgba(34,197,94,0.1); color: #22c55e; }