修复主题切换组件Bug,优化前端公告 markdown 样式

This commit is contained in:
RockYang
2025-01-13 12:03:24 +08:00
parent 4e6f14cb9e
commit 4e440b7910
11 changed files with 284 additions and 268 deletions

View File

@@ -1,5 +1,10 @@
# 更新日志
## v4.2.0
- 功能优化:优化聊天页面 Notice 组件样式,采用 Vuepress 文档样式
- Bug 修复:修复主题切换的组件显示异常问题
## v4.1.9
- 功能优化:优化系统配置,移除已废弃的配置项

View File

@@ -6,7 +6,7 @@ VUE_APP_ADMIN_USER=admin
VUE_APP_ADMIN_PASS=admin123
VUE_APP_KEY_PREFIX=GeekAI_DEV_
VUE_APP_TITLE="Geek-AI 创作系统"
VUE_APP_VERSION=v4.1.9
VUE_APP_VERSION=v4.2.0
VUE_APP_DOCS_URL=https://docs.geekai.me
VUE_APP_GITHUB_URL=https://github.com/yangjian102621/geekai
VUE_APP_GITEE_URL=https://gitee.com/blackfox/geekai

View File

@@ -1,7 +1,7 @@
VUE_APP_API_HOST=
VUE_APP_WS_HOST=
VUE_APP_KEY_PREFIX=GeekAI_
VUE_APP_VERSION=v4.1.9
VUE_APP_VERSION=v4.2.0
VUE_APP_DOCS_URL=https://docs.geekai.me
VUE_APP_GITHUB_URL=https://github.com/yangjian102621/geekai
VUE_APP_GITEE_URL=https://gitee.com/blackfox/geekai

View File

@@ -132,11 +132,6 @@
overflow: hidden;
border-radius: 50%;
font-size: 20px;
// img{
// width: 24px;
// height: 24px;
// }
}
&.active {
@@ -183,19 +178,6 @@
}
}
::v-deep(.theme-box) {
position: relative !important;
right: initial;
bottom: initial;
width: 20px;
height: 20px;
line-height: 18px;
.iconfont {
font-size: 15px !important;
}
}
.right-main {
height: 100%;
// background: #f5f7fd;
@@ -246,18 +228,18 @@
}
&:hover {
background: rgba(79, 89, 102, 0.1);
background: rgba(183, 176, 255, 0.5);
}
}
li.active {
background: rgba(79, 89, 102, 0.1);
background: rgba(183, 176, 255, 0.5);
}
}
.setting-menus {
.title {
color: #222226;
color: var(--text-theme-color);
}
.el-icon,
@@ -265,7 +247,7 @@
font-size: 18px
margin-right: 6px
}
color: #222226;
color: var(--text-theme-color);
}
.username {

View File

@@ -1,10 +1,11 @@
.chat-line {
ol, ul {
.chat-line,
.notice-dialog {
ol,
ul {
margin: 0.8em 0;
list-style: normal;
}
a {
color: var(--a-link-color);
text-decoration: underline;
@@ -70,7 +71,7 @@
}
h1 {
padding-bottom: .4rem;
padding-bottom: 0.4rem;
font-size: 2.2rem;
line-height: 1.3;
}
@@ -191,7 +192,7 @@
border-left: 4px solid #42b983;
padding: 10px 15px;
color: #777;
background-color: rgba(66, 185, 131, .1);
background-color: rgba(66, 185, 131, 0.1);
}
table {

View File

@@ -55,7 +55,7 @@
//filter: invert(100%);
}
.more-menus span.title{
color:#000;
color: var(--text-theme-color);
}
//
@@ -89,4 +89,7 @@
//
--quote-bg-color: #1F243F;
--quote-text-color: #fff;
// el-dialog
--el-box-shadow: 0 0 15px rgba(107, 80, 225, 0.8);
}

View File

@@ -1,5 +1,5 @@
<template>
<div class="theme-box" @click="toggleTheme">
<div class="theme-box" @click="toggleTheme" :class="size">
<i class="iconfont" :class="themePage === 'light' ? 'icon-yueliang' : 'icon-taiyang'"></i>
</div>
</template>
@@ -8,6 +8,13 @@
import { ref } from "vue";
import { useSharedStore } from "@/store/sharedata";
const props = defineProps({
size: {
type: String,
default: "",
},
});
// 定义主题状态,初始值从 localStorage 获取
const store = useSharedStore();
const themePage = ref(store.theme || "light");
@@ -20,7 +27,6 @@ const toggleTheme = () => {
</script>
<style lang="stylus" scoped>
@import '@/assets/iconfont/iconfont.css'
.theme-box{
z-index :111
position: fixed;
@@ -49,4 +55,17 @@ const toggleTheme = () => {
transition: transform 0.3s ease;
}
}
.theme-box.small {
position: relative !important;
right: initial;
bottom: initial;
width: 20px;
height: 20px;
line-height: 18px;
.iconfont {
font-size: 15px !important;
}
}
</style>

View File

@@ -1,6 +1,6 @@
<template>
<el-dialog class="config-dialog" v-model="showDialog" :close-on-click-modal="true" :before-close="close" style="max-width: 400px" title="账户信息">
<div class="flex-center-col p-4 pt-0" id="user-info">
<div class="flex-center-col pl-4 pr-4" id="user-info">
<user-profile @hide="close" />
</div>
</el-dialog>

View File

@@ -194,7 +194,7 @@
</el-container>
<el-dialog v-model="showNotice" :show-close="true" class="notice-dialog" title="网站公告">
<div class="notice p-4">
<div class="notice">
<div v-html="notice"></div>
</div>
@@ -977,6 +977,7 @@ const realtimeChat = () => {
</style>
<style lang="stylus">
@import '@/assets/css/markdown/vue.css';
.notice-dialog {
.el-dialog__header {
padding-bottom 0
@@ -985,6 +986,10 @@ const realtimeChat = () => {
.el-dialog__body {
padding 0 20px
h2 {
margin: 20px 0 15px 0;
}
ol, ul {
padding-left 10px
}

View File

@@ -320,6 +320,7 @@ onMounted(() => {
models.value = res.data;
selectedModel.value = models.value[0];
params.value.model_id = selectedModel.value.id;
changeModel(selectedModel.value);
})
.catch((e) => {
showMessageError("获取模型列表失败:" + e.message);

View File

@@ -100,7 +100,7 @@
<i class="iconfont icon-house"></i>
</a>
<div class="pl-1">
<ThemeChange/>
<ThemeChange size="small" />
</div>
</div>
</div>
@@ -188,7 +188,7 @@ const getFirstPathSegment = (url) => {
const stars = computed(() => {
return 1000;
})
});
watch(
() => store.showLoginDialog,