mirror of
https://github.com/yangjian102621/geekai.git
synced 2025-09-18 01:06:39 +08:00
细节处修改
This commit is contained in:
parent
0c1f650e9c
commit
ab903e3cc1
@ -8,6 +8,9 @@
|
|||||||
::v-deep (.el-message-box__message){
|
::v-deep (.el-message-box__message){
|
||||||
font-size: 18px !important
|
font-size: 18px !important
|
||||||
}
|
}
|
||||||
|
.newChat{
|
||||||
|
margin-bottom: 10px
|
||||||
|
}
|
||||||
// left side
|
// left side
|
||||||
.el-container{
|
.el-container{
|
||||||
height: 100%;
|
height: 100%;
|
||||||
@ -115,7 +118,7 @@
|
|||||||
background-color :var(--theme-bg);
|
background-color :var(--theme-bg);
|
||||||
box-shadow: 0px 3px 9px rgba(112,144,176,0.12);
|
box-shadow: 0px 3px 9px rgba(112,144,176,0.12);
|
||||||
|
|
||||||
border: 1px solid var(--border-active);
|
border: 1px solid var(--shadow-color);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -219,6 +222,8 @@
|
|||||||
.chat-box {
|
.chat-box {
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
//border-bottom: 1px solid #4f4f4f
|
//border-bottom: 1px solid #4f4f4f
|
||||||
|
scrollbar-width: none; /* 隐藏滚动条(Firefox) */
|
||||||
|
-ms-overflow-style: none; /* 隐藏滚动条(IE、Edge) */
|
||||||
|
|
||||||
// 变量定义
|
// 变量定义
|
||||||
--content-font-size: 16px;
|
--content-font-size: 16px;
|
||||||
@ -234,6 +239,9 @@
|
|||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
::-webkit-scrollbar {
|
||||||
|
display: none; /* 隐藏滚动条(Webkit 浏览器) */
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.input-box {
|
.input-box {
|
||||||
|
@ -23,7 +23,8 @@
|
|||||||
--el-input-focus-border-color: #b0a0f8;
|
--el-input-focus-border-color: #b0a0f8;
|
||||||
--little-btn-bg:#e9d3f6;
|
--little-btn-bg:#e9d3f6;
|
||||||
--gray-btn-bg:#ededf591;
|
--gray-btn-bg:#ededf591;
|
||||||
--a-link-color: #3561ff
|
// --a-link-color: #3561ff
|
||||||
|
--a-link-color: #6e8eff
|
||||||
--shadow-color:rgba(223,71,255,0.6)
|
--shadow-color:rgba(223,71,255,0.6)
|
||||||
--sm-btn-bg:#6052ed;
|
--sm-btn-bg:#6052ed;
|
||||||
--theme-text-tertiary: #595959;
|
--theme-text-tertiary: #595959;
|
||||||
|
@ -23,4 +23,15 @@
|
|||||||
::-webkit-scrollbar-thumb:hover {
|
::-webkit-scrollbar-thumb:hover {
|
||||||
background-color: #666666;
|
background-color: #666666;
|
||||||
}
|
}
|
||||||
|
overflow: auto; /* 保持滚动功能 */
|
||||||
|
scrollbar-width: none; /* 隐藏滚动条(Firefox) */
|
||||||
|
-ms-overflow-style: none; /* 隐藏滚动条(IE、Edge) */
|
||||||
|
::-webkit-scrollbar {
|
||||||
|
display: none; /* 隐藏滚动条(Webkit 浏览器) */
|
||||||
|
}
|
||||||
|
&.showScrollbar {
|
||||||
|
::-webkit-scrollbar {
|
||||||
|
display: none; /* 隐藏滚动条(Webkit 浏览器) */
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
@ -379,7 +379,7 @@
|
|||||||
display block
|
display block
|
||||||
cursor pointer
|
cursor pointer
|
||||||
background-color #4E5058
|
background-color #4E5058
|
||||||
color var(--text-theme-color)
|
color #fff
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color #6D6F78
|
background-color #6D6F78
|
||||||
|
@ -259,7 +259,7 @@
|
|||||||
background none
|
background none
|
||||||
padding 6px
|
padding 6px
|
||||||
transition background 0.6s ease 0s
|
transition background 0.6s ease 0s
|
||||||
color #726E6C
|
color #919191
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
// background #5f5958
|
// background #5f5958
|
||||||
|
@ -164,6 +164,8 @@
|
|||||||
&:hover {
|
&:hover {
|
||||||
// box-shadow: 0 0 10px rgba(71, 255, 241, 0.6); /* 添加阴影效果 */
|
// box-shadow: 0 0 10px rgba(71, 255, 241, 0.6); /* 添加阴影效果 */
|
||||||
transform: translateY(-10px); /* 向上移动10像素 */
|
transform: translateY(-10px); /* 向上移动10像素 */
|
||||||
|
box-shadow: 0 0 10px var(--shadow-color);
|
||||||
|
background-color: #30323c;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
.el-overlay-dialog {
|
.el-overlay-dialog {
|
||||||
.el-dialog {
|
.el-dialog {
|
||||||
background-color #1a1b1e
|
// background-color #1a1b1e
|
||||||
|
|
||||||
.el-dialog__header {
|
.el-dialog__header {
|
||||||
.el-dialog__title {
|
.el-dialog__title {
|
||||||
@ -33,14 +33,15 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.task-info {
|
.task-info {
|
||||||
background-color #25262b
|
// background-color #25262b
|
||||||
padding 1rem 1.5rem
|
padding 1rem 1.5rem
|
||||||
|
|
||||||
|
|
||||||
.info-line {
|
.info-line {
|
||||||
width 100%
|
width 100%
|
||||||
|
|
||||||
.prompt {
|
.prompt {
|
||||||
background-color #35363b
|
// background-color #35363b
|
||||||
padding 10px
|
padding 10px
|
||||||
color #999999
|
color #999999
|
||||||
overflow auto
|
overflow auto
|
||||||
@ -64,16 +65,16 @@
|
|||||||
label {
|
label {
|
||||||
display flex
|
display flex
|
||||||
width 100px
|
width 100px
|
||||||
color #a5a5a5
|
color :var(--el-text-color-primary)
|
||||||
}
|
}
|
||||||
|
|
||||||
.item-value {
|
.item-value {
|
||||||
display flex
|
display flex
|
||||||
width 100%
|
width 100%
|
||||||
background-color #35363b
|
// background-color #35363b
|
||||||
padding 2px 5px
|
padding 2px 5px
|
||||||
border-radius 5px
|
border-radius 5px
|
||||||
color #F5F5F5
|
color: var(--text-theme-color);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -3,6 +3,13 @@
|
|||||||
height 100%
|
height 100%
|
||||||
// background-color #0E0808
|
// background-color #0E0808
|
||||||
overflow auto
|
overflow auto
|
||||||
|
.item-group{
|
||||||
|
scrollbar-width: auto !important; /* 恢复滚动条(Firefox) */
|
||||||
|
-ms-overflow-style: auto !important; /* 恢复滚动条(IE、Edge) */
|
||||||
|
::-webkit-scrollbar {
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.left-bar {
|
.left-bar {
|
||||||
max-width 340px
|
max-width 340px
|
||||||
@ -147,8 +154,14 @@
|
|||||||
position relative
|
position relative
|
||||||
overflow-x auto
|
overflow-x auto
|
||||||
overflow-y hidden
|
overflow-y hidden
|
||||||
|
scrollbar-width: auto !important; /* 恢复滚动条(Firefox) */
|
||||||
|
-ms-overflow-style: auto !important; /* 恢复滚动条(IE、Edge) */
|
||||||
width 100%
|
width 100%
|
||||||
|
|
||||||
|
::-webkit-scrollbar {
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
|
||||||
.inner {
|
.inner {
|
||||||
display flex
|
display flex
|
||||||
flex-flow row
|
flex-flow row
|
||||||
@ -256,7 +269,7 @@
|
|||||||
font-weight 700
|
font-weight 700
|
||||||
|
|
||||||
a {
|
a {
|
||||||
color vae( --a-link-color)
|
color var( --a-link-color)
|
||||||
&:hover {
|
&:hover {
|
||||||
text-decoration underline
|
text-decoration underline
|
||||||
}
|
}
|
||||||
@ -309,7 +322,7 @@
|
|||||||
background none
|
background none
|
||||||
padding 6px
|
padding 6px
|
||||||
transition background 0.6s ease 0s
|
transition background 0.6s ease 0s
|
||||||
color #726E6C
|
color #919191
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
// background #5f5958
|
// background #5f5958
|
||||||
|
@ -21,7 +21,8 @@
|
|||||||
--btnColor: linear-gradient(88deg, #af61f0 1.44%, #5b62ce);
|
--btnColor: linear-gradient(88deg, #af61f0 1.44%, #5b62ce);
|
||||||
--border-active:rgba(255, 255, 255, 0.1);
|
--border-active:rgba(255, 255, 255, 0.1);
|
||||||
// --card-bg: rgba(17, 28, 68, 1);
|
// --card-bg: rgba(17, 28, 68, 1);
|
||||||
--card-bg: #1f243f;
|
// --card-bg: #1f243f;
|
||||||
|
--card-bg:#252d58;
|
||||||
--card-bg-table: rgba(17, 28, 68, 1);
|
--card-bg-table: rgba(17, 28, 68, 1);
|
||||||
--theme-bg:rgb(13, 20, 53);
|
--theme-bg:rgb(13, 20, 53);
|
||||||
--theme-bg-all:rgb(13, 20, 53);
|
--theme-bg-all:rgb(13, 20, 53);
|
||||||
@ -34,7 +35,8 @@
|
|||||||
--el-bg-color-overlay: rgba(17, 28, 68, 1);
|
--el-bg-color-overlay: rgba(17, 28, 68, 1);
|
||||||
--el-border-color-light: rgba(255, 255, 255, 0.2);
|
--el-border-color-light: rgba(255, 255, 255, 0.2);
|
||||||
--line-box:rgba(255, 255, 255, 0.1);
|
--line-box:rgba(255, 255, 255, 0.1);
|
||||||
--chat-bg:#141a36;
|
// --chat-bg:#141a36;
|
||||||
|
--chat-bg:#1f243f
|
||||||
--el-bg-color:#141a36;
|
--el-bg-color:#141a36;
|
||||||
--el-fill-color-blank: rgba(17, 28, 68, 1);
|
--el-fill-color-blank: rgba(17, 28, 68, 1);
|
||||||
--el-fill-color-light: rgba(86, 86, 95, .2);
|
--el-fill-color-light: rgba(86, 86, 95, .2);
|
||||||
|
@ -432,10 +432,12 @@ const reGenerate = (prompt) => {
|
|||||||
line-height 1.5
|
line-height 1.5
|
||||||
|
|
||||||
code {
|
code {
|
||||||
color:var(--theme-text-color-primary);
|
color:#fff;
|
||||||
background-color var( --little-btn-bg)
|
background-color var( --el-color-primary)
|
||||||
padding 0 3px;
|
padding 0 3px;
|
||||||
border-radius 5px;
|
border-radius 5px;
|
||||||
|
font-size: 16px;
|
||||||
|
padding: 5px 7px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -539,7 +541,7 @@ const reGenerate = (prompt) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.bar-item.bg {
|
.bar-item.bg {
|
||||||
background-color var( --gray-btn-bg)
|
// background-color var( --gray-btn-bg)
|
||||||
cursor pointer
|
cursor pointer
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -41,7 +41,7 @@
|
|||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
</el-row>
|
</el-row>
|
||||||
<el-empty :image-size="100" v-else />
|
<el-empty :image-size="100" v-else :image="nodata" description="暂无数据" />
|
||||||
<div class="pagination">
|
<div class="pagination">
|
||||||
<el-pagination
|
<el-pagination
|
||||||
v-if="total > 0"
|
v-if="total > 0"
|
||||||
@ -59,6 +59,8 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
|
import nodata from "@/assets/img/no-data.png";
|
||||||
|
|
||||||
import { onMounted, ref } from "vue";
|
import { onMounted, ref } from "vue";
|
||||||
import { httpGet } from "@/utils/http";
|
import { httpGet } from "@/utils/http";
|
||||||
import { ElMessage } from "element-plus";
|
import { ElMessage } from "element-plus";
|
||||||
|
@ -1,29 +1,25 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="black-dialog">
|
<div class="black-dialog">
|
||||||
<el-dialog
|
<el-dialog
|
||||||
v-model="showDialog"
|
v-model="showDialog"
|
||||||
style="--el-dialog-bg-color:#414141;
|
:title="title"
|
||||||
--el-text-color-primary:#f1f1f1;
|
:width="width"
|
||||||
--el-border-color:#414141;
|
:before-close="cancel"
|
||||||
--el-color-primary:#21aa93;
|
|
||||||
--el-color-primary-dark-2:#41555d;
|
|
||||||
--el-color-white: #e1e1e1;
|
|
||||||
--el-color-primary-light-3:#549688;
|
|
||||||
--el-fill-color-blank:#616161;
|
|
||||||
--el-color-primary-light-7:#717171;
|
|
||||||
--el-color-primary-light-9:#717171;
|
|
||||||
--el-text-color-regular:#e1e1e1"
|
|
||||||
:title="title"
|
|
||||||
:width="width"
|
|
||||||
:before-close="cancel"
|
|
||||||
>
|
>
|
||||||
<div class="dialog-body">
|
<div class="dialog-body">
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
</div>
|
</div>
|
||||||
<template #footer v-if="!hideFooter">
|
<template #footer v-if="!hideFooter">
|
||||||
<div class="dialog-footer">
|
<div class="dialog-footer">
|
||||||
<el-button @click="cancel">{{cancelText}}</el-button>
|
<el-button @click="cancel" style="--el-border-radius-base: 8px">{{
|
||||||
<el-button type="primary" @click="$emit('confirm')" v-if="!hideConfirm">{{confirmText}}</el-button>
|
cancelText
|
||||||
|
}}</el-button>
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
@click="$emit('confirm')"
|
||||||
|
v-if="!hideConfirm"
|
||||||
|
>{{ confirmText }}</el-button
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
@ -31,45 +27,47 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
|
import { ref, watch } from "vue";
|
||||||
import {ref, watch} from "vue";
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
show : Boolean,
|
show: Boolean,
|
||||||
title: {
|
title: {
|
||||||
type: String,
|
type: String,
|
||||||
default: 'Tips',
|
default: "Tips"
|
||||||
},
|
},
|
||||||
width: {
|
width: {
|
||||||
type: String,
|
type: String,
|
||||||
default: 'auto',
|
default: "auto"
|
||||||
},
|
},
|
||||||
hideFooter:{
|
hideFooter: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false
|
default: false
|
||||||
},
|
},
|
||||||
hideConfirm:{
|
hideConfirm: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false
|
default: false
|
||||||
},
|
},
|
||||||
confirmText: {
|
confirmText: {
|
||||||
type: String,
|
type: String,
|
||||||
default: '确定',
|
default: "确定"
|
||||||
},
|
},
|
||||||
cancelText: {
|
cancelText: {
|
||||||
type: String,
|
type: String,
|
||||||
default: '取消',
|
default: "取消"
|
||||||
},
|
}
|
||||||
});
|
});
|
||||||
const emits = defineEmits(['confirm','cancal']);
|
const emits = defineEmits(["confirm", "cancal"]);
|
||||||
const showDialog = ref(props.show)
|
const showDialog = ref(props.show);
|
||||||
|
|
||||||
watch(() => props.show, (newValue) => {
|
watch(
|
||||||
showDialog.value = newValue
|
() => props.show,
|
||||||
})
|
(newValue) => {
|
||||||
|
showDialog.value = newValue;
|
||||||
|
}
|
||||||
|
);
|
||||||
const cancel = () => {
|
const cancel = () => {
|
||||||
showDialog.value = false
|
showDialog.value = false;
|
||||||
emits('cancal')
|
emits("cancal");
|
||||||
}
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="stylus">
|
<style lang="stylus">
|
||||||
@ -110,5 +108,4 @@ const cancel = () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
@ -3,12 +3,12 @@
|
|||||||
<el-container>
|
<el-container>
|
||||||
<el-aside>
|
<el-aside>
|
||||||
<div class="media-page">
|
<div class="media-page">
|
||||||
<!-- <el-button @click="_newChat" color="#21aa93">
|
<el-button @click="_newChat" type="primary" class="newChat">
|
||||||
<el-icon style="margin-right: 5px">
|
<el-icon style="margin-right: 5px">
|
||||||
<Plus/>
|
<Plus />
|
||||||
</el-icon>
|
</el-icon>
|
||||||
新建对话
|
新建对话
|
||||||
</el-button> -->
|
</el-button>
|
||||||
|
|
||||||
<div class="search-box">
|
<div class="search-box">
|
||||||
<el-input
|
<el-input
|
||||||
@ -248,7 +248,7 @@
|
|||||||
</textarea>
|
</textarea>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex-between">
|
<div class="flex-between">
|
||||||
<div @click="_newChat" class="flex-center add-new">
|
<!-- <div @click="_newChat" class="flex-center add-new">
|
||||||
<el-tooltip
|
<el-tooltip
|
||||||
class="box-item"
|
class="box-item"
|
||||||
effect="dark"
|
effect="dark"
|
||||||
@ -256,7 +256,7 @@
|
|||||||
>
|
>
|
||||||
<el-icon><CirclePlusFilled /></el-icon>
|
<el-icon><CirclePlusFilled /></el-icon>
|
||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
</div>
|
</div> -->
|
||||||
<div class="flex little-btns">
|
<div class="flex little-btns">
|
||||||
<span class="send-btn tool-item-btn">
|
<span class="send-btn tool-item-btn">
|
||||||
<!-- showStopGenerate -->
|
<!-- showStopGenerate -->
|
||||||
@ -688,7 +688,7 @@ const resizeElement = function () {
|
|||||||
|
|
||||||
// leftBoxHeight.value = window.innerHeight - 90 - 45 - 82;
|
// leftBoxHeight.value = window.innerHeight - 90 - 45 - 82;
|
||||||
// leftBoxHeight.value = window.innerHeight - 90 - 82;
|
// leftBoxHeight.value = window.innerHeight - 90 - 82;
|
||||||
leftBoxHeight.value = window.innerHeight - 90 - 50;
|
leftBoxHeight.value = window.innerHeight - 90 - 100;
|
||||||
};
|
};
|
||||||
|
|
||||||
const _newChat = () => {
|
const _newChat = () => {
|
||||||
|
@ -181,7 +181,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- :style="{ 'padding-left': isCollapse ? '65px' : '170px' }" -->
|
<!-- :style="{ 'padding-left': isCollapse ? '65px' : '170px' }" -->
|
||||||
<div class="right-main">
|
<el-scrollbar class="right-main">
|
||||||
<div
|
<div
|
||||||
v-if="loginUser.id === undefined || !loginUser.id"
|
v-if="loginUser.id === undefined || !loginUser.id"
|
||||||
class="loginMask"
|
class="loginMask"
|
||||||
@ -205,7 +205,7 @@
|
|||||||
</router-view>
|
</router-view>
|
||||||
</div>
|
</div>
|
||||||
<!-- </div> -->
|
<!-- </div> -->
|
||||||
</div>
|
</el-scrollbar>
|
||||||
<config-dialog
|
<config-dialog
|
||||||
v-if="loginUser.id"
|
v-if="loginUser.id"
|
||||||
:show="showConfigDialog"
|
:show="showConfigDialog"
|
||||||
@ -309,13 +309,20 @@ const changeNav = (item) => {
|
|||||||
curPath.value = item.url;
|
curPath.value = item.url;
|
||||||
if (item.url.indexOf("http") !== -1) {
|
if (item.url.indexOf("http") !== -1) {
|
||||||
// 外部链接
|
// 外部链接
|
||||||
router.push({ name: "ExternalLink", query: { url: item.url } });
|
window.open(item.url, "_blank");
|
||||||
} else {
|
} else {
|
||||||
router.push(item.url);
|
// 路由切换,确保路径变化
|
||||||
|
if (router.currentRoute.value.path !== item.url) {
|
||||||
|
router.push(item.url).then(() => {
|
||||||
|
// 刷新 `routerViewKey` 触发视图重新渲染
|
||||||
|
routerViewKey.value += 1;
|
||||||
|
});
|
||||||
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
|
curPath.value = router.currentRoute.value.path;
|
||||||
getSystemInfo()
|
getSystemInfo()
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
logo.value = res.data.logo;
|
logo.value = res.data.logo;
|
||||||
|
Loading…
Reference in New Issue
Block a user