Skip to content

9
91isoft_web_vue
Commit 45ceba5f authored by jiaxu.yan's avatar jiaxu.yan
Browse files
Options

fix: 框架文件调整

parent 79dcff0f
Hide whitespace changes
Inline Side-by-side
Showing with 158 additions and 130 deletions
src/layout/index.vue
View file @ 45ceba5f
<template> <template>
<div v-if="currentPath === '' || currentPath === null || currentPath === 'R' || currentPath === 'G'" :class="classObj" class="app-wrapper"> <div
<div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside" /> v-if="
currentPath === '' ||
currentPath === null ||
currentPath === 'R' ||
currentPath === 'G'
"
:class="classObj"
class="app-wrapper"
>
<div
v-if="device === 'mobile' && sidebar.opened"
class="drawer-bg"
@click="handleClickOutside"
/>
<sidebar class="sidebar-container" /> <sidebar class="sidebar-container" />
<div class="main-container"> <div class="main-container">
<div class="nav-container fixed-header"> <div class="nav-container fixed-header">
...@@ -8,10 +21,14 @@ ...@@ -8,10 +21,14 @@
</div> </div>
<div class="nav-container-two"> <div class="nav-container-two">
<div class="placeholder" /> <div class="placeholder" />
<tags-view /> <tags-view v-if="themeType && themeType !== '8'" />
<navbar /> <navbar v-if="themeType && themeType !== '8'" />
</div> </div>
<app-main /> <el-card v-if="themeType && themeType === '8'" style="margin:.75rem">
<app-main />
</el-card>
<app-main v-else />
<right-panel> <right-panel>
<settings /> <settings />
</right-panel> </right-panel>
...@@ -27,6 +44,7 @@ import RightPanel from '@/components/RightPanel' ...@@ -27,6 +44,7 @@ import RightPanel from '@/components/RightPanel'
import settings from '@/layout/components/Settings/index.vue' import settings from '@/layout/components/Settings/index.vue'
import { Navbar, Sidebar, AppMain, TagsView, Header } from './components' import { Navbar, Sidebar, AppMain, TagsView, Header } from './components'
import ResizeMixin from './mixin/ResizeHandler' import ResizeMixin from './mixin/ResizeHandler'
import { Card } from 'element-ui'
export default { export default {
name: 'Layout', name: 'Layout',
...@@ -45,6 +63,9 @@ export default { ...@@ -45,6 +63,9 @@ export default {
// R正常路由跳转 Y打开新页且没有菜单结构 G打开新页有菜单结构 // R正常路由跳转 Y打开新页且没有菜单结构 G打开新页有菜单结构
return this.$route.meta.jumpType return this.$route.meta.jumpType
}, },
themeType() {
return localStorage.getItem('theme')
},
sidebar() { sidebar() {
return this.$store.state.app.sidebar return this.$store.state.app.sidebar
}, },
...@@ -74,6 +95,4 @@ export default { ...@@ -74,6 +95,4 @@ export default {
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped></style>
</style>
src/styles/themeH/common.scss
View file @ 45ceba5f
//table列表title样式 //table列表title样式
.tableTitle{ .tableTitle {
margin: 20px 0;
color: #333333; color: #333333;
font-size: 0.88rem; font-size: 1rem;
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-weight: 700; font-weight: 700;
text-align: LEFT; text-align: LEFT;
position: absolute;
left: 0.25rem;
top: 0.45rem;
// background-color: #000;
}
.container {
margin: 0px !important;
position: relative;
} }
.el-tree{ .el-tree {
font-size: 14px; font-size: 14px;
} }
//登录验证码popover位置 //登录验证码popover位置
.verifyPopover{ .verifyPopover {
left: 576px!important; left: 576px !important;
padding: 12px 10px; padding: 12px 10px;
} }
.search{ .search {
border-bottom: 14px solid #FAFAFB; border-radius: 0.25rem 0.25rem 0rem 0rem;
background-color: #FAFAFB; display: flex;
.el-form-item{ justify-content: flex-end;
.el-form-item__label{ .el-form-item {
font-family: PingFangSC, PingFang SC; .el-form-item__label {
font-weight: 400; font-family: PingFangSC, PingFang SC;
font-size: 16px; font-weight: 400;
color: #171725; font-size: 16px;
} color: #171725;
.el-input__inner{ }
background: #FFFFFF; .el-input__inner {
border-radius: 0.25rem; background: #ffffff;
border: 1px solid #E2E2EA; border-radius: 0.25rem;
} border: 1px solid #e2e2ea;
// input 修改placeholder颜色 }
::-webkit-input-placeholder { // input 修改placeholder颜色
font-family: PingFangSC, PingFang SC; ::-webkit-input-placeholder {
font-weight: 400; font-family: PingFangSC, PingFang SC;
font-size: 14px; font-weight: 400;
color: #696974; font-size: 14px;
} color: #696974;
} }
} }
.queryBtn{ }
.queryBtn {
border: none; border: none;
background: #2288FF; background: #2288ff;
border-radius: 0.25rem; border-radius: 0.25rem;
font-family: PingFangSC, PingFang SC; font-family: PingFangSC, PingFang SC;
font-weight: 600; font-weight: 600;
...@@ -50,21 +58,21 @@ ...@@ -50,21 +58,21 @@
&:hover { &:hover {
opacity: 0.85; opacity: 0.85;
border: none; border: none;
background: #2288FF; background: #2288ff;
color: #fff; color: #fff;
border-radius: 10px; border-radius: 0.25rem;
} }
&:focus { &:focus {
opacity: 0.85; opacity: 0.85;
border: none; border: none;
background: #F1F1F5; background: #2288ff;
color: #696974; color: #696974;
border-radius: 10px; border-radius: 0.25rem;
} }
} }
.resetBtn{ .resetBtn {
border: none; border: none;
background: #2288FF; background: #2288ff;
border-radius: 0.25rem; border-radius: 0.25rem;
font-family: PingFangSC, PingFang SC; font-family: PingFangSC, PingFang SC;
font-weight: 600; font-weight: 600;
...@@ -73,45 +81,45 @@ ...@@ -73,45 +81,45 @@
&:hover { &:hover {
opacity: 0.85; opacity: 0.85;
border: none; border: none;
background: #2288FF; background: #2288ff;
color: #fff; color: #fff;
border-radius: 10px; border-radius: 0.25rem;
} }
&:focus { &:focus {
opacity: 0.85; opacity: 0.85;
border: none; border: none;
background: #F1F1F5; background: #2288ff;
color: #696974; color: #696974;
border-radius: 10px; border-radius: 0.25rem;
} }
} }
.addBtn{ .addBtn {
border: none; border: none;
background: #F1F1F5; background: #2288ff;
border-radius: 10px; border-radius: 0.25rem;
font-family: PingFangSC, PingFang SC; font-family: PingFangSC, PingFang SC;
font-weight: 600; font-weight: 600;
font-size: 16px; font-size: 16px;
color: #696974; color: #fff;
&:hover { &:hover {
opacity: 0.85; opacity: 0.85;
border: none; border: none;
background: #F1F1F5; background: #2288ff;
color: #696974; color: #fff;
border-radius: 10px; border-radius: 0.25rem;
} }
&:focus { &:focus {
opacity: 0.85; opacity: 0.85;
border: none; border: none;
background: #F1F1F5; background: #2288ff;
color: #696974; color: #696974;
border-radius: 10px; border-radius: 0.25rem;
} }
} }
.importBtn{ .importBtn {
border: none; border: none;
background: #F1F1F5; background: #2288ff;
border-radius: 10px; border-radius: 0.25rem;
font-family: PingFangSC, PingFang SC; font-family: PingFangSC, PingFang SC;
font-weight: 600; font-weight: 600;
font-size: 16px; font-size: 16px;
...@@ -119,122 +127,122 @@ ...@@ -119,122 +127,122 @@
&:hover { &:hover {
opacity: 0.85; opacity: 0.85;
border: none; border: none;
background: #F1F1F5; background: #2288ff;
color: #696974; color: #696974;
border-radius: 10px; border-radius: 0.25rem;
} }
&:focus { &:focus {
opacity: 0.85; opacity: 0.85;
border: none; border: none;
background: #F1F1F5; background: #2288ff;
color: #696974; color: #696974;
border-radius: 10px; border-radius: 0.25rem;
} }
} }
.exportBtn{ .exportBtn {
border: none; border: none;
background: #F1F1F5!important; background: #2288ff !important;
border-radius: 10px!important; border-radius: 0.25rem !important;
font-family: PingFangSC, PingFang SC; font-family: PingFangSC, PingFang SC;
font-weight: 600!important; font-weight: 600 !important;
font-size: 16px!important; font-size: 16px !important;
color: #696974!important; color: #fff !important;
&:hover { &:hover {
opacity: 0.85; opacity: 0.85;
border: none; border: none;
background: #F1F1F5!important; background: #2288ff !important;
color: #696974!important; color: #fff !important;
border-radius: 10px!important; border-radius: 0.25rem !important;
} }
&:focus { &:focus {
opacity: 0.85; opacity: 0.85;
border: none; border: none;
background: #F1F1F5!important; background: #f1f1f5 !important;
color: #696974!important; color: #696974 !important;
border-radius: 10px!important; border-radius: 0.25rem !important;
} }
} }
//修改按钮文字类型样式 //修改按钮文字类型样式
.updateBtn{ .updateBtn {
font-family: Microsoft YaHei, Microsoft YaHei-400; font-family: Microsoft YaHei, Microsoft YaHei-400;
font-weight: 400; font-weight: 400;
text-align: LEFT; text-align: LEFT;
color: #0062FF; color: #337AB7;
} }
.delBtn{ .delBtn {
font-family: Microsoft YaHei, Microsoft YaHei-400; font-family: Microsoft YaHei, Microsoft YaHei-400;
font-weight: 400; font-weight: 400;
text-align: LEFT; text-align: LEFT;
color: #FF4852; color: #337AB7;
} }
//tree的选中的check框样式 //tree的选中的check框样式
.el-checkbox__input.is-checked .el-checkbox__inner{ .el-checkbox__input.is-checked .el-checkbox__inner {
background-color: #0062FF; background-color: #0062ff;
} }
// switch开样式 // switch开样式
.el-switch.is-checked .el-switch__core{ .el-switch.is-checked .el-switch__core {
border-color: #0062FF; border-color: #0062ff;
background-color: #0062FF; background-color: #0062ff;
} }
// radio开样式 // radio开样式
.el-radio__input.is-checked .el-radio__inner{ .el-radio__input.is-checked .el-radio__inner {
border-color: #0062FF; border-color: #0062ff;
background-color: #0062FF; background-color: #0062ff;
} }
// radio选中的文字样式 // radio选中的文字样式
.el-radio__input.is-checked+.el-radio__label{ .el-radio__input.is-checked + .el-radio__label {
color: #0062FF; color: #0062ff;
} }
// table列表表头样式 // table列表表头样式
.el-table th .cell{ .el-table th .cell {
background: #f4f4f4; background: #f4f4f4;
font-size: 0.88rem; font-size: 0.88rem;
font-family: Poppins, Poppins; font-family: Poppins, Poppins;
font-weight: bold; font-weight: bold;
text-align: center; text-align: center;
color: #242A30; color: #242a30;
} }
// table列表内容样式 // table列表内容样式
.el-table td .cell{ .el-table td .cell {
font-size: 16px; font-size: 16px;
font-family: Poppins, Poppins; font-family: Poppins, Poppins;
font-weight: 500; font-weight: 500;
text-align: LEFT; text-align: LEFT;
color: #44444F; color: #44444f;
} }
.navbar{ .navbar {
background-color: #FAFAFB!important; background-color: #fafafb !important;
} }
.app-main{ .app-main {
background-color: #FAFAFB!important; background-color: #fff !important;
} }
.nav-container-two{ .nav-container-two {
background-color: #FAFAFB!important; background-color: #fafafb !important;
.placeholder{ .placeholder {
background-color: #FAFAFB!important; background-color: #fafafb !important;
} }
} }
.tags-view-container{ .tags-view-container {
background-color: #FAFAFB!important; background-color: #fafafb !important;
} }
.tags-view-container .tags-view-wrapper .tags-view-item{ .tags-view-container .tags-view-wrapper .tags-view-item {
border-radius: 16px!important; border-radius: 16px !important;
border: 1px solid #E2E2EA!important; border: 1px solid #e2e2ea !important;
font-family: PingFangSC, PingFang SC; font-family: PingFangSC, PingFang SC;
font-weight: 400!important; font-weight: 400 !important;
font-size: 14px!important; font-size: 14px !important;
color: #696974!important; color: #696974 !important;
background: #FAFAFB!important; background: #fafafb !important;
} }
.tags-view-container .tags-view-wrapper .tags-view-item.active{ .tags-view-container .tags-view-wrapper .tags-view-item.active {
border-radius: 16px!important; border-radius: 16px !important;
border: 1px solid #E2E2EA!important; border: 1px solid #e2e2ea !important;
font-family: PingFangSC, PingFang SC; font-family: PingFangSC, PingFang SC;
font-weight: 400!important; font-weight: 400 !important;
font-size: 14px!important; font-size: 14px !important;
color: #696974!important; color: #696974 !important;
background: #F1F1F5!important; background: #f1f1f5 !important;
} }
.el-pagination.is-background .el-pager li:not(.disabled).active{ .el-pagination.is-background .el-pager li:not(.disabled).active {
background-color: #242A30; background-color: #242a30;
} }
src/styles/themeH/layout.scss
View file @ 45ceba5f
@import "../../styles/mixin"; @import '../../styles/mixin';
@import "./variables"; @import './variables';
.app-wrapper { .app-wrapper {
@include clearfix; @include clearfix;
position: relative; position: relative;
height: 100%; height: 100%;
width: 100%; width: 100%;
&.mobile.openSidebar{ &.mobile.openSidebar {
position: fixed; position: fixed;
top: 0; top: 0;
} }
} }
.nav-container{ .nav-container {
/*height: 70px;*/ /*height: 70px;*/
//position: absolute; //position: absolute;
top: 0; top: 0;
width: 100%; width: 100%;
z-index: 1001; z-index: 1001;
} }
.nav-container-two{ .nav-container-two {
width: 100%; width: 100%;
z-index: 1001; z-index: 1001;
background-color: #ecf0f1;
.placeholder { .placeholder {
height: 1.2vh; height: 1.2vh;
width: 100%; width: 100%;
background-color: #F4F4F4; background-color: #f4f4f4;
} }
} }
.drawer-bg { .drawer-bg {
...@@ -47,7 +48,7 @@ ...@@ -47,7 +48,7 @@
} }
.hideSidebar .fixed-header { .hideSidebar .fixed-header {
width: calc(100% - #{ $sideHideWidth }) width: calc(100% - #{$sideHideWidth});
} }
.mobile .fixed-header { .mobile .fixed-header {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment