603 lines
9.9 KiB
SCSS
603 lines
9.9 KiB
SCSS
* {
|
||
margin: 0;
|
||
padding: 0;
|
||
list-style: none;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
a {
|
||
text-decoration: none;
|
||
color: #333;
|
||
}
|
||
|
||
html, body, #app, .el-container, .el-aside, .el-main {
|
||
height: 100%;
|
||
}
|
||
.el-date-editor--year{
|
||
width: 100%!important;
|
||
}
|
||
|
||
.el-breadcrumb__item {
|
||
line-height: 65px;
|
||
}
|
||
|
||
.el-main {
|
||
background: #EFEFEF;
|
||
padding: 0 0 0 18px;
|
||
position: fixed;
|
||
left: 200px;
|
||
transition: left ease 0.15s;
|
||
margin-left: 0;
|
||
transition: margin-left .15s;
|
||
width: calc(100vw - 200px);
|
||
|
||
&::-webkit-scrollbar {
|
||
width: 6px;
|
||
}
|
||
|
||
// 滚动条轨道
|
||
&::-webkit-scrollbar-track {
|
||
background: rgb(239, 239, 239);
|
||
border-radius: 2px;
|
||
}
|
||
|
||
// 小滑块
|
||
&::-webkit-scrollbar-thumb {
|
||
background: rgba(80, 81, 82, 0.29);
|
||
border-radius: 10px;
|
||
}
|
||
}
|
||
|
||
.main-collapse {
|
||
left: 64px;
|
||
width: calc(100vw - 64px);
|
||
}
|
||
|
||
.el-aside {
|
||
//box-shadow: 4px 0 2px 1px rgb(171, 167, 167);
|
||
overflow: hidden;
|
||
width: 200px;
|
||
-webkit-transition: width .15s;
|
||
transition: width 0.15s;
|
||
position: fixed;
|
||
top: 0;
|
||
bottom: 0;
|
||
left: 0;
|
||
//z-index: 1001;
|
||
}
|
||
|
||
.el-dialog {
|
||
border-radius: 12px !important;
|
||
border: none;
|
||
|
||
.el-dialog__header {
|
||
border-top-left-radius: 12px;
|
||
border-top-right-radius: 12px;
|
||
// background-color: #262626;
|
||
margin: 0;
|
||
// .el-dialog__title{
|
||
// color: white;
|
||
// }
|
||
}
|
||
}
|
||
|
||
.table-header-btn {
|
||
display: flex;
|
||
justify-content: flex-start;
|
||
align-items: center;
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
.el-dialog__body {
|
||
padding: 10px 20px;
|
||
}
|
||
|
||
.stateIcon {
|
||
margin-top: 9px;
|
||
margin-right: 7px;
|
||
display: block;
|
||
width: 8px;
|
||
height: 8px;
|
||
border-radius: 4px;
|
||
opacity: 1;
|
||
}
|
||
|
||
.query-form {
|
||
//margin-left: 14px;
|
||
margin-top: 15px;
|
||
|
||
.el-tag__content {
|
||
font-size: 14px;
|
||
}
|
||
|
||
.el-form-item {
|
||
//display: flex;
|
||
//align-items: center;
|
||
margin-right: 18px;
|
||
}
|
||
|
||
.el-form-item__label {
|
||
font-weight: 700;
|
||
}
|
||
|
||
.el-button {
|
||
font-size: 13px;
|
||
}
|
||
|
||
.el-input {
|
||
width: 280px;
|
||
opacity: 1;
|
||
}
|
||
}
|
||
|
||
|
||
.query-btn {
|
||
margin-bottom: 10px;
|
||
|
||
.el-button {
|
||
font-size: 13px;
|
||
}
|
||
}
|
||
|
||
|
||
.table {
|
||
//margin-top: 15px;
|
||
//margin-bottom: 20px;
|
||
.el-tag {
|
||
.el-tag__content {
|
||
font-size: 13px;
|
||
}
|
||
}
|
||
|
||
.el-table {
|
||
border: none;
|
||
}
|
||
|
||
thead .el-table-column--selection .cell {
|
||
display: none;
|
||
}
|
||
|
||
.el-table__header-wrapper {
|
||
border-bottom: 1px solid #D1D4D6;
|
||
|
||
.el-table__header {
|
||
.cell {
|
||
font-size: 16px;
|
||
font-family: DengXian-Bold, DengXian;
|
||
color: #333333;
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
}
|
||
|
||
.dialog-form {
|
||
.el-form-item {
|
||
flex-direction: column;
|
||
margin-bottom: 10px;
|
||
|
||
.el-form-item__content {
|
||
.el-select {
|
||
flex-grow: 1;
|
||
}
|
||
}
|
||
|
||
.el-form-item__label {
|
||
justify-content: flex-start;
|
||
}
|
||
}
|
||
}
|
||
|
||
.custom-dialog {
|
||
:deep .el-dialog__header {
|
||
padding: 10px 20px;
|
||
|
||
.el-dialog__title {
|
||
font-size: 17px;
|
||
}
|
||
|
||
.el-dialog__headerbtn {
|
||
top: 15px;
|
||
|
||
.i {
|
||
font-size: large;
|
||
}
|
||
}
|
||
}
|
||
|
||
:deep .el-dialog__footer {
|
||
padding: 10px 20px;
|
||
}
|
||
}
|
||
|
||
//============node节点样式============
|
||
.node-error-state {
|
||
.node-body {
|
||
box-shadow: 0px 0px 5px 0px #F56C6C !important;
|
||
}
|
||
}
|
||
|
||
.node-error {
|
||
position: absolute;
|
||
right: -40px;
|
||
top: 20px;
|
||
font-size: 25px;
|
||
color: #F56C6C;
|
||
}
|
||
|
||
.node-footer {
|
||
position: relative;
|
||
|
||
.branch-merge {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
flex-direction: column;
|
||
font-size: 12px;
|
||
width: 30px;
|
||
height: 30px;
|
||
border-radius: 50%;
|
||
left: 0;
|
||
right: 0;
|
||
margin: -20px auto 0;
|
||
background: #fff;
|
||
box-shadow: 0 0 5px 0 #d8d8d8;
|
||
z-index: 0;
|
||
position: relative;
|
||
}
|
||
|
||
.btn {
|
||
width: 100%;
|
||
display: flex;
|
||
padding: 20px 0 32px;
|
||
justify-content: center;
|
||
z-index: 0;
|
||
position: relative;
|
||
|
||
.el-icon {
|
||
width: 1.4em;
|
||
height: 1.4em;
|
||
}
|
||
}
|
||
|
||
.el-button {
|
||
//height: 32px;
|
||
}
|
||
|
||
&::before {
|
||
content: "";
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
//z-index: -1;
|
||
margin: auto;
|
||
width: 2px;
|
||
height: 100%;
|
||
background-color: #000000;
|
||
}
|
||
}
|
||
|
||
//el-dialog的样式类名
|
||
.border {
|
||
.el-dialog__header {
|
||
border-bottom: 1px solid #e8e8e8;
|
||
}
|
||
|
||
.el-dialog__footer {
|
||
border-top: 1px solid #e8e8e8;
|
||
}
|
||
}
|
||
|
||
.layout {
|
||
display: flex;
|
||
justify-content: space-around;
|
||
|
||
.scrollbar-user {
|
||
height: calc(100vh - 250px) !important;
|
||
overflow: auto !important;
|
||
}
|
||
|
||
.scrollbar-dict {
|
||
border: 1px solid #ebeef5;
|
||
//min-height: 30vh;
|
||
//height: 60vh;
|
||
height: calc(100vh - 300px);
|
||
overflow-y: auto;
|
||
overflow-x: hidden;
|
||
|
||
&::-webkit-scrollbar {
|
||
width: 6px;
|
||
height: 6px;
|
||
}
|
||
|
||
// 滚动条轨道
|
||
&::-webkit-scrollbar-track {
|
||
background: rgb(239, 239, 239);
|
||
border-radius: 2px;
|
||
}
|
||
|
||
// 小滑块
|
||
&::-webkit-scrollbar-thumb {
|
||
background: rgba(80, 81, 82, 0.29);
|
||
border-radius: 10px;
|
||
}
|
||
|
||
.el-tree--highlight-current
|
||
.el-tree-node.is-current
|
||
> .el-tree-node__content {
|
||
// 设置颜色
|
||
background-color: rgba(135, 206, 235, 0.2); // 透明度为0.2的skyblue，作者比较喜欢的颜色
|
||
color: #409eff; // 节点的字体颜色
|
||
font-weight: bold; // 字体加粗
|
||
}
|
||
}
|
||
|
||
.layout-left {
|
||
width: 30%;
|
||
//border: 1px solid #ebeef5;
|
||
padding: 10px;
|
||
margin-top: 5px;
|
||
|
||
.dict-tree {
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
//:deep .el-button{
|
||
// //border: 1px solid;
|
||
// background-color: #fff;
|
||
//}
|
||
.left-type {
|
||
margin-right: 20px;
|
||
font-size: 12px;
|
||
color: #999;
|
||
}
|
||
}
|
||
}
|
||
|
||
.layout-right {
|
||
//width: 70%;
|
||
//border: 1px solid #ebeef5;
|
||
margin-left: 10px;
|
||
padding: 0 10px;
|
||
width: 80%;
|
||
border: none;
|
||
}
|
||
}
|
||
|
||
.top-dialog {
|
||
.el-overlay-dialog {
|
||
left: 0 !important;
|
||
}
|
||
}
|
||
|
||
.el-overlay-dialog {
|
||
left: 200px;
|
||
}
|
||
|
||
//.el-overlay-dialog {
|
||
// left: 200px !important;
|
||
//}
|
||
//放大缩小按钮上外边距
|
||
.scale {
|
||
margin-top: 10px;
|
||
//z-index: 666;
|
||
//position: static;
|
||
//top: -20px;
|
||
}
|
||
|
||
|
||
.el-overlay-dialog::-webkit-scrollbar, .scrollbar-dict::-webkit-scrollbar {
|
||
width: 6px;
|
||
height: 6px;
|
||
}
|
||
|
||
// 滚动条轨道
|
||
.el-overlay-dialog::-webkit-scrollbar-track, .scrollbar-dict::-webkit-scrollbar-track {
|
||
background: rgb(239, 239, 239);
|
||
border-radius: 2px;
|
||
}
|
||
|
||
// 小滑块
|
||
.el-overlay-dialog::-webkit-scrollbar-thumb, .scrollbar-dict::-webkit-scrollbar-thumb {
|
||
background: rgba(80, 81, 82, 0.29);
|
||
border-radius: 10px;
|
||
}
|
||
|
||
.nowrap {
|
||
white-space: pre
|
||
}
|
||
.el-empty__description {
|
||
margin-top: 0!important;
|
||
}
|
||
//SvgIcon组件的样式
|
||
.home-icon {
|
||
width: 4em;
|
||
height: 4em;
|
||
vertical-align: -0.15em;
|
||
fill: currentColor;
|
||
overflow: hidden;
|
||
margin-right: 5px;
|
||
}
|
||
.oran-icon{
|
||
width: 1em;
|
||
height: 1em;
|
||
margin-right: 4px;
|
||
vertical-align: -0.21em;
|
||
|
||
}
|
||
.svg-icon {
|
||
width: 1.2em;
|
||
height: 1.2em;
|
||
vertical-align: -0.15em;
|
||
fill: currentColor;
|
||
overflow: hidden;
|
||
margin-right: 5px;
|
||
}
|
||
|
||
.er-icon {
|
||
cursor: pointer;
|
||
width: 1.2em;
|
||
height: 1.2em;
|
||
vertical-align: -0.15em;
|
||
fill: currentColor;
|
||
overflow: hidden;
|
||
margin-right: 5px;
|
||
|
||
&:hover {
|
||
border: 1px solid darkgray;
|
||
}
|
||
}
|
||
|
||
.disabled-icon {
|
||
width: 1.2em;
|
||
height: 1.2em;
|
||
vertical-align: -0.15em;
|
||
fill: currentColor;
|
||
overflow: hidden;
|
||
margin-right: 5px;
|
||
}
|
||
|
||
.disabled-icon:hover {
|
||
cursor: not-allowed;
|
||
}
|
||
|
||
.black-icon {
|
||
width: 1.2em;
|
||
height: 1.2em;
|
||
vertical-align: -0.15em;
|
||
fill: #383737;
|
||
overflow: hidden;
|
||
margin-right: 5px;
|
||
}
|
||
|
||
.fen-icon {
|
||
width: 1.8em;
|
||
height: 1.7em;
|
||
}
|
||
.home-time{
|
||
width: 1.4em;
|
||
height: 1.4em;
|
||
margin-right: 5px;
|
||
}
|
||
.file-svg{
|
||
width: 1.4em;
|
||
height: 1.4em;
|
||
fill: #BEA266;
|
||
}
|
||
.middle-icon {
|
||
width: 1.4em;
|
||
height: 1.4em;
|
||
margin-right: 5px;
|
||
}
|
||
|
||
.close-icon {
|
||
width: 1.1em;
|
||
height: 1.1em;
|
||
margin-left: 5px;
|
||
vertical-align: -0.21em;
|
||
}
|
||
|
||
.tag:hover {
|
||
color: #418DFF;
|
||
|
||
.close-icon {
|
||
fill: #418DFF;
|
||
}
|
||
}
|
||
|
||
.active {
|
||
.close-icon {
|
||
fill: #BEA266;
|
||
}
|
||
}
|
||
|
||
.svg-icon:hover {
|
||
cursor: pointer;
|
||
//border: 1px solid #E9E9E9;
|
||
}
|
||
|
||
//IconSelect组件的样式
|
||
.icon-select {
|
||
width: 100%;
|
||
|
||
.icon-name {
|
||
width: 110px;
|
||
overflow: hidden; //超出的文本隐藏
|
||
text-overflow: ellipsis; //溢出用省略号显示
|
||
white-space: nowrap; //溢出不换行
|
||
}
|
||
|
||
.el-popper {
|
||
.el-select-dropdown {
|
||
max-width: 592px !important;
|
||
|
||
.el-select-dropdown__list {
|
||
display: flex !important;
|
||
flex-wrap: wrap;
|
||
|
||
.el-select-dropdown__item {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-start;
|
||
width: 148px;
|
||
padding: 0 0 0 5px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.query-form {
|
||
.el-form-item__content {
|
||
.el-select__wrapper {
|
||
width: 200px;
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
.el-pagination {
|
||
margin-top: 10px;
|
||
}
|
||
|
||
// 操作页面底部按钮
|
||
.oper-page-btn {
|
||
position: fixed;
|
||
top: 135px;
|
||
right: 15px;
|
||
z-index: 5;
|
||
}
|
||
|
||
.approval-record {
|
||
//padding-top: 10px;
|
||
padding-bottom: 30px;
|
||
position: relative;
|
||
.approval-title {
|
||
display: flex;
|
||
align-items: center;
|
||
//justify-content: space-between;
|
||
|
||
.diagram {
|
||
display: flex;
|
||
align-items: center;
|
||
float: right;
|
||
|
||
.base-title {
|
||
margin-left: 10px;
|
||
margin-right: 10px;
|
||
}
|
||
|
||
//.el-switch {
|
||
// margin-left: 15px;
|
||
//}
|
||
}
|
||
}
|
||
|
||
.process {
|
||
position: relative;
|
||
}
|
||
}
|