mirror of
https://gitee.com/blackfox/geekai.git
synced 2024-11-30 03:07:34 +08:00
feat: admin console dark theme
This commit is contained in:
RockYang
parent
468b48151f
commit
5e0be4d10e
@ -6,7 +6,7 @@
|
||||
* 功能优化：使用思维链提示词生成思维导图，确保生成的思维导图不会出现格式错误
|
||||
* 功能优化：优化首页登录注册页面的 UI
|
||||
* BUG修复：修复License验证的逻辑漏洞
|
||||
* 功能优化：支持点卡充值设置有效期
|
||||
* Bug修复：后台添加用户的时候密码规则限制跟前台注册保持一致
|
||||
|
||||
## v4.0.4
|
||||
|
||||
|
||||
@ -1,30 +1,95 @@
|
||||
.admin-home {
|
||||
.header {
|
||||
|
||||
.dark {
|
||||
color-scheme: dark;
|
||||
--el-color-primary: #409eff;
|
||||
--el-color-primary-light-3: #3375b9;
|
||||
--el-color-primary-light-5: #2a598a;
|
||||
--el-color-primary-light-7: #213d5b;
|
||||
--el-color-primary-light-8: #1d3043;
|
||||
--el-color-primary-light-9: #18222c;
|
||||
--el-color-primary-dark-2: #66b1ff;
|
||||
--el-color-success: #67c23a;
|
||||
--el-color-success-light-3: #4e8e2f;
|
||||
--el-color-success-light-5: #3e6b27;
|
||||
--el-color-success-light-7: #2d481f;
|
||||
--el-color-success-light-8: #25371c;
|
||||
--el-color-success-light-9: #1c2518;
|
||||
--el-color-success-dark-2: #85ce61;
|
||||
--el-color-warning: #e6a23c;
|
||||
--el-color-warning-light-3: #a77730;
|
||||
--el-color-warning-light-5: #7d5b28;
|
||||
--el-color-warning-light-7: #533f20;
|
||||
--el-color-warning-light-8: #3e301c;
|
||||
--el-color-warning-light-9: #292218;
|
||||
--el-color-warning-dark-2: #ebb563;
|
||||
--el-color-danger: #f56c6c;
|
||||
--el-color-danger-light-3: #b25252;
|
||||
--el-color-danger-light-5: #854040;
|
||||
--el-color-danger-light-7: #582e2e;
|
||||
--el-color-danger-light-8: #412626;
|
||||
--el-color-danger-light-9: #2b1d1d;
|
||||
--el-color-danger-dark-2: #f78989;
|
||||
--el-color-error: #f56c6c;
|
||||
--el-color-error-light-3: #b25252;
|
||||
--el-color-error-light-5: #854040;
|
||||
--el-color-error-light-7: #582e2e;
|
||||
--el-color-error-light-8: #412626;
|
||||
--el-color-error-light-9: #2b1d1d;
|
||||
--el-color-error-dark-2: #f78989;
|
||||
--el-color-info: #909399;
|
||||
--el-color-info-light-3: #6b6d71;
|
||||
--el-color-info-light-5: #525457;
|
||||
--el-color-info-light-7: #393a3c;
|
||||
--el-color-info-light-8: #2d2d2f;
|
||||
--el-color-info-light-9: #202121;
|
||||
--el-color-info-dark-2: #a6a9ad;
|
||||
--el-box-shadow: 0px 12px 32px 4px rgba(0, 0, 0, 0.36), 0px 8px 20px rgba(0, 0, 0, 0.72);
|
||||
--el-box-shadow-light: 0px 0px 12px rgba(0, 0, 0, 0.72);
|
||||
--el-box-shadow-lighter: 0px 0px 6px rgba(0, 0, 0, 0.72);
|
||||
--el-box-shadow-dark: 0px 16px 48px 16px rgba(0, 0, 0, 0.72), 0px 12px 32px #000000, 0px 8px 16px -8px #000000;
|
||||
--el-bg-color-page: #0a0a0a;
|
||||
--el-bg-color: #141414;
|
||||
--el-bg-color-overlay: #1d1e1f;
|
||||
--el-text-color-primary: #E5EAF3;
|
||||
--el-text-color-regular: #CFD3DC;
|
||||
--el-text-color-secondary: #A3A6AD;
|
||||
--el-text-color-placeholder: #8D9095;
|
||||
--el-text-color-disabled: #6C6E72;
|
||||
--el-border-color-darker: #636466;
|
||||
--el-border-color-dark: #58585B;
|
||||
--el-border-color: #4C4D4F;
|
||||
--el-border-color-light: #414243;
|
||||
--el-border-color-lighter: #363637;
|
||||
--el-border-color-extra-light: #2B2B2C;
|
||||
--el-fill-color-darker: #424243;
|
||||
--el-fill-color-dark: #39393A;
|
||||
--el-fill-color: #303030;
|
||||
--el-fill-color-light: #262727;
|
||||
--el-fill-color-lighter: #1D1D1D;
|
||||
--el-fill-color-extra-light: #191919;
|
||||
--el-fill-color-blank: transparent;
|
||||
--el-mask-color: rgba(0, 0, 0, 0.8);
|
||||
--el-mask-color-extra-light: rgba(0, 0, 0, 0.3)
|
||||
--el-menu-bg-color-dark: #39393A
|
||||
--el-menu-bg-color-darker: #424243
|
||||
}
|
||||
|
||||
.login-wrap {
|
||||
background: #324157;
|
||||
.dark .el-button {
|
||||
--el-button-disabled-text-color: rgba(255, 255, 255, 0.5)
|
||||
}
|
||||
|
||||
.plugins-tips {
|
||||
background: #eef1f6;
|
||||
.dark .el-card {
|
||||
--el-card-bg-color: var(--el-bg-color-overlay)
|
||||
}
|
||||
|
||||
.plugins-tips a {
|
||||
color: #20a0ff;
|
||||
}
|
||||
|
||||
.tags-li.active {
|
||||
border: 1px solid #409EFF;
|
||||
background-color: #409EFF;
|
||||
}
|
||||
|
||||
.message-title {
|
||||
color: #20a0ff;
|
||||
}
|
||||
|
||||
.collapse-btn:hover {
|
||||
background: rgb(40, 52, 70);
|
||||
}
|
||||
.dark .el-empty {
|
||||
--el-empty-fill-color-0: var(--el-color-black);
|
||||
--el-empty-fill-color-1: #4b4b52;
|
||||
--el-empty-fill-color-2: #36383d;
|
||||
--el-empty-fill-color-3: #1e1e20;
|
||||
--el-empty-fill-color-4: #262629;
|
||||
--el-empty-fill-color-5: #202124;
|
||||
--el-empty-fill-color-6: #212224;
|
||||
--el-empty-fill-color-7: #1b1c1f;
|
||||
--el-empty-fill-color-8: #1c1d1f;
|
||||
--el-empty-fill-color-9: #18181a
|
||||
}
|
||||
@ -37,6 +37,19 @@ body {
|
||||
transition: left .3s ease-in-out;
|
||||
background: #f0f0f0;
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 8px; /* 滚动条宽度 */
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: #666666;
|
||||
border-radius 8px
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background-color: #999999;
|
||||
}
|
||||
|
||||
.content {
|
||||
width: auto;
|
||||
height: 100vh;
|
||||
@ -45,14 +58,8 @@ body {
|
||||
|
||||
.container {
|
||||
padding: 15px 20px 30px 20px;
|
||||
background: #fff;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 5px;
|
||||
background: #ffffff;
|
||||
margin-bottom 80px
|
||||
|
||||
.handle-box {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.crumbs {
|
||||
@ -60,7 +67,7 @@ body {
|
||||
}
|
||||
|
||||
.el-table th {
|
||||
background-color: #f5f7fa !important;
|
||||
background-color: #f5f7fa;
|
||||
}
|
||||
|
||||
.pagination {
|
||||
@ -142,6 +149,23 @@ body {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.dark {
|
||||
background: var(--el-bg-color);
|
||||
|
||||
.container {
|
||||
background: var(--el-bg-color);
|
||||
}
|
||||
|
||||
.crumbs {
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.el-table th {
|
||||
background-color: var(--el-fill-color-darker);
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.content-collapse {
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="sidebar">
|
||||
<div class="sidebar dark">
|
||||
<div class="logo">
|
||||
<el-image :src="logo"/>
|
||||
<span class="text" v-show="!sidebar.collapse">{{ title }}</span>
|
||||
@ -234,4 +234,32 @@ setMenuItems(items)
|
||||
width: 0;
|
||||
}
|
||||
|
||||
.sidebar.dark {
|
||||
border-right 1px solid var(--el-border-color-dark)
|
||||
|
||||
.logo {
|
||||
background var(--el-bg-color)
|
||||
|
||||
.text {
|
||||
color var(--el-text-color-regular)
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
background var(--el-bg-color)
|
||||
|
||||
.el-menu-item.is-active {
|
||||
background-color var(--el-menu-bg-color-dark)
|
||||
}
|
||||
|
||||
.el-menu-item:hover {
|
||||
background-color var(--el-menu-bg-color-darker)
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-el-menu:not(.el-menu--collapse) {
|
||||
width: 250px;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
@ -284,15 +284,8 @@ const changePlatform = () => {
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.list {
|
||||
|
||||
.opt-box {
|
||||
padding-bottom: 10px;
|
||||
display: flex;
|
||||
justify-content flex-end
|
||||
|
||||
.el-icon {
|
||||
margin-right: 5px;
|
||||
}
|
||||
.handle-box {
|
||||
margin-bottom 20px
|
||||
}
|
||||
|
||||
.copy-key {
|
||||
|
||||
@ -343,8 +343,8 @@ const showMessages = (row) => {
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.chat-list {
|
||||
|
||||
.handle-box {
|
||||
margin-bottom 20px
|
||||
.handle-input {
|
||||
max-width 150px;
|
||||
margin-right 10px;
|
||||
|
||||
@ -350,14 +350,8 @@ const remove = function (row) {
|
||||
@import "@/assets/css/admin/form.styl";
|
||||
.model-list {
|
||||
|
||||
.opt-box {
|
||||
padding-bottom: 10px;
|
||||
display: flex;
|
||||
justify-content flex-end
|
||||
|
||||
.el-icon {
|
||||
margin-right: 5px;
|
||||
}
|
||||
.handle-box {
|
||||
margin-bottom 20px
|
||||
}
|
||||
|
||||
.cell {
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="container role-list" v-loading="loading">
|
||||
<div class="container function" v-loading="loading">
|
||||
<div class="handle-box">
|
||||
<el-button type="primary" :icon="Plus" @click="addRow">新增</el-button>
|
||||
</div>
|
||||
@ -296,15 +296,9 @@ const generateToken = () => {
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.role-list {
|
||||
.opt-box {
|
||||
padding-bottom: 10px;
|
||||
display flex;
|
||||
justify-content flex-end
|
||||
|
||||
.el-icon {
|
||||
margin-right 5px;
|
||||
}
|
||||
.function {
|
||||
.handle-box {
|
||||
margin-bottom 20px
|
||||
}
|
||||
|
||||
.param-line {
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
<div class="content-box" :class="{ 'content-collapse': sidebar.collapse }">
|
||||
<admin-header/>
|
||||
<admin-tags/>
|
||||
<div class="content">
|
||||
<div class="content dark">
|
||||
<router-view v-slot="{ Component }">
|
||||
<transition name="move" mode="out-in">
|
||||
<keep-alive :include="tags.nameList">
|
||||
@ -40,7 +40,7 @@ checkAdminSession().then(() => {
|
||||
</script>
|
||||
|
||||
<style scoped lang="stylus">
|
||||
@import '@/assets/css/main.css';
|
||||
@import '@/assets/css/color-dark.css';
|
||||
@import '@/assets/css/color-dark.styl';
|
||||
@import '@/assets/css/main.styl';
|
||||
@import '@/assets/iconfont/iconfont.css';
|
||||
</style>
|
||||
|
||||
@ -63,14 +63,8 @@ const fetchList = function (_page, _pageSize) {
|
||||
<style lang="stylus" scoped>
|
||||
.list {
|
||||
|
||||
.opt-box {
|
||||
padding-bottom: 10px;
|
||||
display flex;
|
||||
justify-content flex-start
|
||||
|
||||
.el-icon {
|
||||
margin-right: 5px;
|
||||
}
|
||||
.handle-box {
|
||||
margin-bottom 20px
|
||||
}
|
||||
|
||||
.el-select {
|
||||
|
||||
@ -170,14 +170,8 @@ const remove = function (row) {
|
||||
<style lang="stylus" scoped>
|
||||
.list {
|
||||
|
||||
.opt-box {
|
||||
padding-bottom: 10px;
|
||||
display flex;
|
||||
justify-content flex-end
|
||||
|
||||
.el-icon {
|
||||
margin-right: 5px;
|
||||
}
|
||||
.handle-box {
|
||||
margin-bottom 20px
|
||||
}
|
||||
|
||||
.el-select {
|
||||
|
||||
@ -129,6 +129,7 @@ const remove = function (row) {
|
||||
.order {
|
||||
|
||||
.handle-box {
|
||||
margin-bottom 20px
|
||||
.handle-input {
|
||||
max-width 150px;
|
||||
margin-right 10px;
|
||||
|
||||
@ -135,6 +135,7 @@ const fetchData = () => {
|
||||
<style lang="stylus" scoped>
|
||||
.power-log {
|
||||
.handle-box {
|
||||
margin-bottom 20px
|
||||
.handle-input {
|
||||
max-width 150px;
|
||||
margin-right 10px;
|
||||
|
||||
@ -207,6 +207,14 @@ const remove = function (row) {
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.product {
|
||||
.handle-box {
|
||||
margin-bottom 20px
|
||||
|
||||
.handle-input {
|
||||
max-width 150px;
|
||||
margin-right 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.opt-box {
|
||||
padding-bottom: 10px;
|
||||
|
||||
@ -82,6 +82,14 @@ const remove = function (row) {
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.list {
|
||||
.handle-box {
|
||||
margin-bottom 20px
|
||||
|
||||
.handle-input {
|
||||
max-width 150px;
|
||||
margin-right 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.opt-box {
|
||||
padding-bottom: 10px;
|
||||
|
||||
@ -322,6 +322,15 @@ const uploadImg = (file) => {
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
.role-list {
|
||||
.handle-box {
|
||||
margin-bottom 20px
|
||||
|
||||
.handle-input {
|
||||
max-width 150px;
|
||||
margin-right 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.opt-box {
|
||||
padding-bottom: 10px;
|
||||
display flex;
|
||||
|
||||
@ -332,6 +332,7 @@ const doResetPass = () => {
|
||||
.user-list {
|
||||
|
||||
.handle-box {
|
||||
margin-bottom 20px
|
||||
.handle-input {
|
||||
max-width 150px;
|
||||
margin-right 10px;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user