diff --git a/README.md b/README.md index d98616e..219e930 100644 --- a/README.md +++ b/README.md @@ -54,4 +54,4 @@ yarn dev -Copyright ©️2025 北京数维无穹科技有限公司 \ No newline at end of file +Copyright ©2025 北京数维无穹科技有限公司 \ No newline at end of file diff --git a/src/assets/images/login.png b/src/assets/images/login.png new file mode 100644 index 0000000..4045413 Binary files /dev/null and b/src/assets/images/login.png differ diff --git a/src/assets/styles/index.scss b/src/assets/styles/index.scss index 87898e6..da3f034 100644 --- a/src/assets/styles/index.scss +++ b/src/assets/styles/index.scss @@ -4,7 +4,7 @@ @use './sidebar.scss'; @use './btn.scss'; @use './ruoyi.scss'; - +@use './reset.scss'; body { height: 100%; margin: 0; diff --git a/src/assets/styles/reset.scss b/src/assets/styles/reset.scss new file mode 100644 index 0000000..7d5e9f6 --- /dev/null +++ b/src/assets/styles/reset.scss @@ -0,0 +1,125 @@ +:root{ + --app-header-height: 80px; + --app-nav-bj: #F4F8FF; + --el-text-color-primary: #1f2329; +} + +#app .sidebar-container .el-menu, +#app .main-container{ + background-color: var(--app-nav-bj) !important; +} +#app .app-main{ + border-radius: 16px; + box-sizing: border-box; + background-color: #fff; +} + +#app .sidebar-container .svg-icon{ + margin-right: 8px; +} + +/* flex */ + +.flex { + display: flex; +} + +.flex-center { + display: flex; + align-items: center; + justify-content: center; +} + +.flex-between { + display: flex; + justify-content: space-between; + align-items: center; +} + +.flex-wrap { + display: flex; + flex-wrap: wrap; + align-content: space-between; +} + +.flex-direction-column { + display: flex; + flex-direction: column; +} + +.align-center { + align-items: center; +} + +.align-baseline { + align-items: baseline; +} + +.justify-center { + justify-content: center; +} + +.text-left { + text-align: left; +} + +.text-center { + text-align: center; +} + +.text-right { + text-align: right; +} + +.vertical-middle { + vertical-align: middle; +} + +.cursor { + cursor: pointer; +} + +.mr-6{ + margin-right: 6px; +} + +.mb-20{ + margin-bottom: 20px; +} +/* 重置tabs */ +.res-el-tab { + --el-tabs-header-height: 60px; + height: 100%; + .el-tabs__nav-wrap:after { + height: 0 !important; + } + .el-tabs__active-bar { + height: 4px; + border-radius: 4px 4px 0 0; + } +} + +/* 重置message */ +.el-message-box{ + padding: 24px; + --el-messagebox-font-size: 16px; + --el-messagebox-width: 475px; + .el-message-box__headerbtn{ + right: 10px; + top: 15px; + .el-message-box__close { + font-size: 20px; + } + } + .el-message-box__header, + .el-message-box__btns{ + padding: 0; + } + .el-message-box__content { + padding: 24px 0; + font-weight: 400; + } + .el-message-box__message{ + color: var(--el-text-color-primary); + } +} \ No newline at end of file diff --git a/src/assets/styles/ruoyi.scss b/src/assets/styles/ruoyi.scss index b3240c3..c445b31 100644 --- a/src/assets/styles/ruoyi.scss +++ b/src/assets/styles/ruoyi.scss @@ -78,7 +78,7 @@ .el-table__header-wrapper, .el-table__fixed-header-wrapper { th { word-break: break-word; - background-color: #f8f8f9 !important; + background-color: var(--app-nav-bj) !important; color: #515a6e; height: 40px !important; font-size: 13px; @@ -151,7 +151,7 @@ /** 表格更多操作下拉样式 */ .el-table .el-dropdown-link { cursor: pointer; - color: #409EFF; + color: #3067EF; margin-left: 10px; } diff --git a/src/assets/styles/sidebar.scss b/src/assets/styles/sidebar.scss index 54d7441..c275d9e 100644 --- a/src/assets/styles/sidebar.scss +++ b/src/assets/styles/sidebar.scss @@ -24,8 +24,12 @@ left: 0; z-index: 1001; overflow: hidden; - -webkit-box-shadow: 2px 0 6px rgba(0,21,41,.35); - box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.1); + // -webkit-box-shadow: 2px 0 6px rgba(0,21,41,.35); + // box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.1); + background-color: var(--app-nav-bj) !important; + .sidebar-logo-container{ + background-color: var(--app-nav-bj) !important; + } // reset element-ui css .horizontal-collapse-transition { @@ -84,7 +88,7 @@ .sub-menu-title-noDropdown, .el-sub-menu__title { &:hover { - background-color: rgba(0, 0, 0, 0.06) !important; + background-color: var(--app-nav-bj) !important; } } @@ -97,7 +101,7 @@ min-width: vars.$base-sidebar-width !important; &:hover { - background-color: rgba(0, 0, 0, 0.06) !important; + background-color: var(--app-nav-bj) !important; } } @@ -213,7 +217,7 @@ .el-menu-item { &:hover { // you can use $sub-menuHover - background-color: rgba(0, 0, 0, 0.06) !important; + background-color: var(--app-nav-bj) !important; } } diff --git a/src/assets/styles/variables.module.scss b/src/assets/styles/variables.module.scss index 8764e13..930c220 100644 --- a/src/assets/styles/variables.module.scss +++ b/src/assets/styles/variables.module.scss @@ -10,7 +10,7 @@ $panGreen: #30B08F; // 默认主题变量 $menuText: #bfcbd9; -$menuActiveText: #409eff; +$menuActiveText: #3067EF; $menuBg: #304156; $menuHover: #263445; @@ -18,7 +18,7 @@ $menuHover: #263445; $menuLightBg: #ffffff; $menuLightHover: #f0f1f5; $menuLightText: #303133; -$menuLightActiveText: #409EFF; +$menuLightActiveText: #3067EF; // 基础变量 $base-sidebar-width: 200px; @@ -32,7 +32,7 @@ $base-sub-menu-background: #1f2d3d; $base-sub-menu-hover: #001528; // 组件变量 -$--color-primary: #409EFF; +$--color-primary: #3067EF; $--color-success: #67C23A; $--color-warning: #E6A23C; $--color-danger: #F56C6C; diff --git a/src/layout/components/AppMain.vue b/src/layout/components/AppMain.vue index d6b95c6..d31ece1 100644 --- a/src/layout/components/AppMain.vue +++ b/src/layout/components/AppMain.vue @@ -38,7 +38,7 @@ function addIframe() {