yvan/Study
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

vue3版本初版上线 自测已可用

Browse Source
This commit is contained in:
piexlmax
2021-08-26 12:45:41 +08:00
parent adc7f567f9
commit 265e42f513
81 changed files with 4478 additions and 18639 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/style/main.scss
+49 -140
View File
@@ -8,7 +8,6 @@
*/
@import '@/style/basics.scss';
html {
line-height: 1.15;
/* 1 */
@@ -535,17 +534,36 @@ li {
// 导航
#app {
.pd-lr-15 {
padding: 0 15px;
}
.height-full {
height: 100%;
}
.width-full {
width: 100%;
}
.dp-flex {
display: flex;
}
.justify-content-center {
justify-content: center;
}
.align-items {
align-items: center;
}
.pd-0 {
padding: 0;
}
.el-container {
position: relative;
height: 100%;
width: 100%;
}
.el-container.mobile.openside {
position: fixed;
top: 0;
}
.el-aside {
-webkit-transition: width .2s;
transition: width .2s;
@@ -559,11 +577,9 @@ li {
left: 0;
z-index: 1001;
overflow: hidden;
.el-menu {
border-right: none;
}
.tilte {
min-height: $height-aside-tilte;
line-height: $height-aside-tilte;
@@ -578,7 +594,6 @@ li {
border-radius: 50%;
padding: 3px;
}
.tit-text {
display: inline-block;
color: #fff;
@@ -588,15 +603,17 @@ li {
padding-left: 10px;
}
}
}
.aside {
.el-menu-item {
>div {
padding: 0 15px !important;
}
}
.el-menu-vertical {
transition: all 0.3s;
background-color: $bg-aside;
}
.el-submenu {
.el-sub-menu {
background-color: $bg-aside;
.el-menu {
.el-menu-item {
@@ -607,46 +624,43 @@ li {
.is-active {
background-color: #1890ff;
// 关闭三级菜单二级菜单样式
ul{
border:none;
ul {
border: none;
}
}
// 关闭三级菜单二级菜单样式
.is-active.is-opened{
.is-active.is-opened {
background-color: #191a23;
ul{
border:none;
ul {
border: none;
}
}
}
}
.el-menu-item:focus, .el-menu-item:hover{
.el-menu-item:focus,
.el-menu-item:hover {
background-color: transparent;
}
.el-menu-item:hover i,
.el-menu-item:hover span {
color: #fff;
}
.el-submenu__title:hover {
.el-sub-menu__title:hover {
background-color: $bg-aside;
}
.el-submenu__title:hover i,
.el-submenu__title:hover span {
.el-sub-menu__title:hover i,
.el-sub-menu__title:hover span {
color: #fff;
}
.el-menu--inline {
border-left: 5px solid #2c3b41;
}
}
.hideside {
.aside {
width: $width-hideside-aside;
}
}
.mobile.hideside {
.el-aside {
-webkit-transition-duration: .2s;
@@ -655,7 +669,6 @@ li {
transform: translate3d(-220px, 0, 0);
}
}
.mobile {
.el-aside {
-webkit-transition: -webkit-transform .28s;
@@ -665,9 +678,6 @@ li {
width: $width-mobile-aside;
}
}
.main-cont.el-main {
min-height: 100%;
-webkit-transition: margin-left .28s;
@@ -675,19 +685,16 @@ li {
margin-left: $width-aside;
position: relative;
}
.hideside {
.main-cont.el-main {
margin-left: 54px;
}
}
.mobile {
.main-cont.el-main {
margin-left: 0px;
}
}
.openside.mobile {
.shadowBg {
background: #000;
@@ -702,8 +709,6 @@ li {
}
}
// layout
.layout-cont {
.main-cont {
@@ -724,7 +729,6 @@ li {
height: 30px;
line-height: 30px;
}
.el-input__icon {
line-height: 30px;
}
@@ -736,65 +740,52 @@ li {
padding: 14px;
margin: 114px 14px 20px;
border-radius: 2px;
.el-table--border {
border-radius: 4px;
margin-bottom: 14px;
}
.el-table {
thead {
color: $color-table-thead;
}
th {
padding: 5px 0;
.cell {
min-height: 34px;
line-height: 34px;
}
}
td {
padding: 8px 0;
}
td,
th.is-leaf {
border-bottom: 1px solid #e8e8e8;
}
}
.search-term {
border-left: none;
border-right: none;
padding: 0 5px;
.el-form-item {
margin-bottom: 10px;
}
}
.el-pagination {
padding: 20px 0 0 0;
}
.upload-demo,
.upload {
padding: 0;
}
.system {
padding: 0;
}
.el-form.el-form--inline {
.el-form-item:last-child {
margin-bottom: 0;
}
}
.edit_container,
.edit {
padding: 0;
@@ -819,7 +810,6 @@ li {
padding: 0 15px;
border-left: 1px solid #ebeef5;
border-right: 1px solid #ebeef5;
.demo-form-inline {
margin-bottom: 10px;
}
@@ -850,13 +840,11 @@ li {
}
.el-pagination {
.btn-prev,
.btn-next {
border: 1px solid #ddd;
border-radius: 4px;
}
.el-pager {
li {
color: #666;
@@ -866,13 +854,11 @@ li {
border-radius: 4px;
}
}
padding: 20px 0 !important;
}
.el-row {
padding: 10px 0;
.el-col>label {
line-height: 30px;
text-align: right;
@@ -880,7 +866,6 @@ li {
padding-right: 15px;
display: inline-block;
}
.line {
line-height: 30px;
text-align: center;
@@ -891,7 +876,6 @@ li {
.edit_container {
background-color: $white-bg;
padding: 15px;
.el-button {
margin: 15px 0;
}
@@ -900,7 +884,6 @@ li {
.edit {
background-color: $white-bg;
padding: 15px;
.el-button {
margin: 15px 0;
}
@@ -911,12 +894,10 @@ li {
.upload {
background-color: $white-bg;
padding: 15px;
.el-upload-list__item-status-label {
right: 0;
left: 120px;
}
.el-upload__tip {
margin: 10px 0;
}
@@ -925,33 +906,27 @@ li {
// system
.system {
padding: 15px;
.el-input__inner {
width: 80%;
}
}
// .el-menu .el-menu--inline {
// background: #2c3b41;
// }
// .el-submenu .el-submenu {
// .el-sub-menu .el-sub-menu {
// background-color: #000408 !important;
// }
// .aside .el-scrollbar .el-scrollbar__view .el-submenu__title:hover {
// .aside .el-scrollbar .el-scrollbar__view .el-sub-menu__title:hover {
// background-color: $bg-aside !important;
// }
// .el-menu--vertical {
// .el-menu {
// margin-left: -8px;
// background-color: rgb(48, 65, 86);
// .el-menu-item {
// background-color: rgb(48, 65, 86);
// }
// .el-menu-item:focus,
// .el-menu-item:hover {
// background-color: #263445;
@@ -959,7 +934,6 @@ li {
// }
// }
// }
// 导航*****
// add 5.13
.el-container {
@@ -967,83 +941,67 @@ li {
// padding: 15px;
// margin: 115px 15px 20px;
// border-radius: 2px;
// .button-box {
// border: none;
// padding: 0 0 10px 0px;
// }
// .el-table--border {
// border-radius: 4px;
// margin-bottom: 15px;
// }
// .el-table {
// thead {
// color: $color-table-thead;
// }
// th {
// padding: 5px 0;
// .cell {
// min-height: 34px;
// line-height: 34px;
// }
// }
// td {
// padding: 8px 0;
// }
// td,
// th.is-leaf {
// border-bottom: 1px solid #e8e8e8;
// }
// }
// .search-term {
// border-left: none;
// border-right: none;
// padding: 0 5px;
// .el-form-item {
// margin-bottom: 10px;
// }
// }
// .el-pagination {
// padding: 20px 0 0 0;
// }
// .upload-demo,
// .upload {
// padding: 0;
// }
// .system {
// padding: 0;
// }
// .el-form.el-form--inline {
// .el-form-item:last-child {
// margin-bottom: 0;
// }
// }
// .edit_container,
// .edit {
// padding: 0;
// }
// }
// .admin-box:after,
// .admin-box:before {
// content: "";
// display: block;
// clear: both;
// }
.tips {
margin-top: 10px;
font-size: 14px;
@@ -1053,7 +1011,6 @@ li {
}
.el-container.layout-cont {
// .header-cont,
// .breadcrumb {
// height: 40px !important;
@@ -1061,13 +1018,11 @@ li {
// }
.main-cont.el-main {
background-color: $bg-main;
.menu-total {
font-size: 22px;
color: #838383;
margin-top: 16px;
}
// background-color: #f0f2f5;
}
}
@@ -1080,21 +1035,17 @@ li {
padding: 0 6px;
border-top: 1px solid $border-color;
padding: 0;
.el-tabs__header {
margin: 0px 0 0 0;
.el-tabs__item {
height: $height-nav-scroll;
height: $height-nav-scroll;
border: none;
border-left: 1px solid $border-color;
}
.el-tabs__item.is-active {
background-color: rgba(64, 158, 255, .08);
}
.el-tabs__nav {
border: none;
}
@@ -1107,7 +1058,6 @@ li {
.el-button.el-button--text.el-button--small {
position: relative;
}
// .el-button.el-button--text.el-button--small::after {
// content: '';
// position: absolute;
@@ -1139,7 +1089,6 @@ li {
border-right: 1.5px solid #ccc;
margin-left: 6px;
}
.el-table__placeholder {
width: 10px;
}
@@ -1152,7 +1101,6 @@ li {
border-right: 1.5px solid #ccc;
margin-left: 6px;
}
.el-table__placeholder {
width: 10px;
}
@@ -1180,7 +1128,6 @@ li {
$headerHigh: 52px;
$mainHight: 100vh;
.dropdown-group {
min-width: 100px;
}
@@ -1190,18 +1137,14 @@ $mainHight: 100vh;
top: 0;
box-sizing: border-box;
z-index: 999;
>.el-row{
>.el-row {
padding: 0;
.el-col-lg-14{
.el-col-lg-14 {
height: 60px;
}
}
}
.el-scrollbar__wrap {
padding-bottom: 17px;
}
@@ -1213,19 +1156,16 @@ $mainHight: 100vh;
text-align: center;
vertical-align: middle;
margin-right: 10px;
img {
vertical-align: middle;
border: 1px solid #ccc;
border-radius: 6px;
}
}
.header-cont {
height: $height-header;
background: #fff;
}
.main-cont {
.breadcrumb {
height: $height-header;
@@ -1234,21 +1174,17 @@ $mainHight: 100vh;
background-color: #fff;
padding: 0;
}
.fl-right {
// height: $height-header;
// line-height: $height-header;
}
&.el-main {
overflow: auto;
background: #fff;
}
height: $mainHight !important;
overflow: visible;
position: relative;
.menu-total {
float: left;
margin-top: 10px;
@@ -1257,16 +1193,13 @@ $mainHight: 100vh;
line-height: 30px;
font-size: 30px;
}
.aside {
overflow: auto;
// background: #fff;
&::-webkit-scrollbar {
display: none;
}
}
.el-menu-vertical {
height: calc(100vh - 64px) !important;
visibility: auto;
@@ -1274,38 +1207,30 @@ $mainHight: 100vh;
width: 220px;
}
}
.el-menu--collapse {
width: 54px;
li {
.el-tooltip,
.el-submenu__title {
.el-sub-menu__title {
padding: 0px 15px !important;
}
}
}
&::-webkit-scrollbar {
display: none;
}
&.main-left {
width: auto !important;
}
&.main-right {
.admin-title {
float: left;
font-size: 16px;
vertical-align: middle;
margin-left: 20px;
img {
vertical-align: middle;
}
&.collapse {
width: 53px;
}
@@ -1330,16 +1255,13 @@ $mainHight: 100vh;
height: 60px;
width: 120px;
text-align: center;
.el-input__inner {
border: none;
border-bottom: 1px solid #606266;
}
.el-dropdown-link {
cursor: pointer;
}
.search-icon {
font-size: $icon-size;
margin-right: 14px;
@@ -1348,7 +1270,6 @@ $mainHight: 100vh;
box-sizing: border-box;
color: #606266;
}
.dropdown-group {
min-width: 100px;
}
@@ -1377,18 +1298,15 @@ $mainHight: 100vh;
padding: 20px;
border-radius: 4px;
overflow: hidden;
.car-left {
height: $height-car;
// width: 70%;
// float: left;
}
.car-right {
height: $height-car;
// width: 29%;
// float: left;
.flow,
.user-number,
.feedback {
@@ -1401,54 +1319,48 @@ $mainHight: 100vh;
font-size: 13px;
margin-right: 5px;
}
.flow {
background-color: #fff7e8;
border-color: #feefd0;
color: #faad14;
}
.user-number {
background-color: #ecf5ff;
border-color: #d9ecff;
color: #409eff;
}
.feedback {
background-color: #eef9e8;
border-color: #dcf3d1;
color: #52c41a;
}
.car-item {
.card-item {
padding-right: 20px;
text-align: right;
margin-top: 12px;
b {
margin-top: 6px;
display: block;
}
}
}
.card-img {
width: $height-car;
height: $height-car;
display: inline-block;
float: left;
overflow: hidden;
img {
width: 100%;
height: 100%;
border-radius: 50%;
}
}
.text {
height: $height-car;
margin-left: 10px;
float: left;
margin-top: 14px;
h4 {
font-size: 20px;
color: #262626;
@@ -1457,13 +1369,12 @@ $mainHight: 100vh;
word-break: break-all;
text-overflow: ellipsis;
}
.tips-text {
color: #8c8c8c;
margin-top: 8px;
.el-icon{
.el-icon {
margin-right: 8px;
display:inline-block;
display: inline-block;
}
}
}
@@ -1471,14 +1382,12 @@ $mainHight: 100vh;
.shadow {
margin: 4px 0;
.grid-content {
background-color: $white-bg;
border-radius: 4px;
text-align: center;
padding: 10px 0;
cursor: pointer;
.el-icon {
width: $el-icon-small;
height: $el-icon-small;
@@ -1506,4 +1415,4 @@ $mainHight: 100vh;
::-webkit-scrollbar-thumb:hover {
background-color: #bbb;
}
}
web/src/style/newLogin.scss
+3 -1
View File
@@ -1,7 +1,7 @@
#userLayout{
margin: 0;
padding: 0;
background-image: url("~@/assets/login_background.svg");
// background-image: url("~@/assets/login_background.svg");
background-size: cover;
width: 100%;
height: 100%;
@@ -53,6 +53,8 @@
float: right !important;
background: #ccc;
img {
width: 100%;
height: 100%;
cursor: pointer;
vertical-align: middle;
}