Skip to content

S
so-manage-ui
Commit b02fb229 authored by 张耀's avatar 张耀
Browse files
Options

Merge branch 'dev' into zy

parents a1e5f8ff aa58d260
Hide whitespace changes
Inline Side-by-side
Showing with 1599 additions and 886 deletions
src/assets/css/index.css
View file @ b02fb229
[v-cloak] { [v-cloak] {
display: none; display: none;
} }
/* 新增按钮颜色 */ /* 新增按钮颜色 */
.form-group .el-button--primary { .form-group .el-button--primary {
background-color: #264dd9 !important; background-color: #264dd9 !important;
border-color: #264dd9 !important; border-color: #264dd9 !important;
} }
/* 返回按钮颜色 */ /* 返回按钮颜色 */
.from_return>.el-button--primary { .from_return>.el-button--primary {
background-color: #edf0ff !important; background-color: #edf0ff !important;
border-color: #edf0ff !important; border-color: #edf0ff !important;
color: #264dd9 !important; color: #264dd9 !important;
} }
/* 取消按钮颜色 */ /* 取消按钮颜色 */
.form_c { .form_c {
background-color: #dde4ff !important; background-color: #dde4ff !important;
border-color: #dde4ff !important; border-color: #dde4ff !important;
color: #264dd9 !important; color: #264dd9 !important;
} }
/* 确定按钮颜色 */ /* 确定按钮颜色 */
.form_t { .form_t {
background-color: #264dd9 !important; background-color: #264dd9 !important;
border-color: #264dd9 !important; border-color: #264dd9 !important;
color: #f4f7fc !important; color: #f4f7fc !important;
} }
/* 搜索框颜色 */ /* 搜索框颜色 */
.form-group .el-input__inner { .form-group .el-input__inner {
border-radius: 28px !important; border-radius: 28px !important;
border: 1px solid #bcc1d0 !important; border: 1px solid #bcc1d0 !important;
background: #f4f7fc !important; background: #f4f7fc !important;
color: #8890a7 !important; color: #8890a7 !important;
} }
.drawer_return .el-input__inner { .drawer_return .el-input__inner {
border-radius: 28px !important; border-radius: 28px !important;
border: 1px solid #bcc1d0 !important; border: 1px solid #bcc1d0 !important;
background: #f4f7fc !important; background: #f4f7fc !important;
color: #8890a7 !important; color: #8890a7 !important;
} }
/* 多行文本框样式 */ /* 多行文本框样式 */
.jbxx_desc textarea { .jbxx_desc textarea {
height: 150px !important; height: 150px !important;
border-radius: 8px !important; border-radius: 8px !important;
border-color: #bcc1d0 !important; border-color: #bcc1d0 !important;
outline: none !important; outline: none !important;
resize: none !important; resize: none !important;
} }
/* 面包屑文字大小 */ /* 面包屑文字大小 */
.el-breadcrumb { .el-breadcrumb {
font-size: 14px; font-size: 14px;
color: #898d9e; color: #898d9e;
} }
/* 编辑颜色*/ /* 编辑颜色*/
.primary-edit { .primary-edit {
color: #264dd9; color: #264dd9;
cursor: pointer; cursor: pointer;
} }
/* 删除颜色 */ /* 删除颜色 */
.primary-del { .primary-del {
color: #264dd9; color: #264dd9;
cursor: pointer; cursor: pointer;
} }
.space_bet {} .space_bet {}
/* reset */ /* reset */
html {} html {}
html, html,
body { body {
margin: 0; margin: 0;
font-family: Microsoft YaHei, sans-serif; font-family: Microsoft YaHei, sans-serif;
/* font-size: 17px; */ /* font-size: 17px; */
} }
ul { ul {
list-style: none; list-style: none;
padding: 0; padding: 0;
margin: 0; margin: 0;
} }
p { p {
margin: 0; margin: 0;
} }
h1, h1,
...@@ -118,264 +98,249 @@ h2, ...@@ -118,264 +98,249 @@ h2,
h3, h3,
h4, h4,
h5 { h5 {
margin: 0; margin: 0;
font-weight: normal; font-weight: normal;
} }
h1 { h1 {
font-size: 32px; font-size: 32px;
} }
h2 { h2 {
font-size: 24px; font-size: 24px;
} }
h3 { h3 {
font-size: 18.7px; font-size: 18.7px;
} }
h4 { h4 {
font-size: 16px; font-size: 16px;
} }
div { div {
box-sizing: border-box; box-sizing: border-box;
} }
/* reset end */ /* reset end */
/* common */ /* common */
/* #app { /* #app {
height: 100%; height: 100%;
overflow: hidden; overflow: hidden;
} */ } */
.text_clip { .text_clip {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
word-break: break-all; word-break: break-all;
white-space: nowrap; white-space: nowrap;
} }
.text_clip_2 { .text_clip_2 {
text-overflow: -o-ellipsis-lastline; text-overflow: -o-ellipsis-lastline;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
display: -webkit-box; display: -webkit-box;
line-clamp: 2; line-clamp: 2;
-webkit-line-clamp: 2; -webkit-line-clamp: 2;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
} }
.map_container { .map_container {
background-color: #eee; background-color: #eee;
} }
.ss_card { .ss_card {
padding: 1.2rem; padding: 1.2rem;
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
align-items: flex-start; align-items: flex-start;
} }
.ss_card>.sc_left_container { .ss_card>.sc_left_container {
width: 6rem; width: 6rem;
height: 6rem; height: 6rem;
flex-shrink: 0; flex-shrink: 0;
border-radius: 0.5rem; border-radius: 0.5rem;
overflow: hidden; overflow: hidden;
font-size: 0; font-size: 0;
} }
.ss_card>.sc_right_container { .ss_card>.sc_right_container {
width: calc(100% - 7rem); width: calc(100% - 7rem);
flex-grow: 1; flex-grow: 1;
margin-left: 1.2rem; margin-left: 1.2rem;
} }
.ss_card>.sc_right_container>.sc_title { .ss_card>.sc_right_container>.sc_title {
font-size: 1.6rem; font-size: 1.6rem;
font-weight: bold; font-weight: bold;
line-height: 2.6rem; line-height: 2.6rem;
} }
.ss_card>.sc_right_container>.sc_info { .ss_card>.sc_right_container>.sc_info {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
.form-group { .form-group {
padding: 20px 20px 15px; padding: 20px 20px 15px;
box-sizing: border-box; box-sizing: border-box;
border-bottom: 1px solid #edf0ff; border-bottom: 1px solid #edf0ff;
} }
.padding_table { .padding_table {
padding: 0 20px; padding: 0 20px;
} }
/* 设置抽屉的样式 */ /* 设置抽屉的样式 */
.el-drawer__header { .el-drawer__header {
display: none; display: none;
} }
.from_return { .from_return {
text-align: center; text-align: center;
padding: 18px 20px 10px; padding: 18px 20px 10px;
border-bottom: 1px solid #edf0ff; border-bottom: 1px solid #edf0ff;
position: relative; position: relative;
} }
.from_return>.el-button--primary { .from_return>.el-button--primary {
position: absolute; position: absolute;
top: 15px; top: 15px;
left: 20px; left: 20px;
} }
.from_return>span { .from_return>span {
color: #1a2236; color: #1a2236;
font-size: 16px; font-size: 16px;
} }
.demo-drawer__content .el-form-item__label { .demo-drawer__content .el-form-item__label {
color: #242c43; color: #242c43;
} }
.demo-drawer__content .el-input__inner { .demo-drawer__content .el-input__inner {
border: 1px solid #bcc1d0; border: 1px solid #bcc1d0;
border-radius: 17px; border-radius: 17px;
color: #58617a; color: #58617a;
background: #fff; background: #fff;
} }
.demo-drawer__footer { .demo-drawer__footer {
text-align: right; text-align: right;
padding-right: 40px; padding-right: 40px;
margin-top: 40px; margin-top: 40px;
} }
.el-form-item__error { .el-form-item__error {
font-size: 11px; font-size: 11px;
} }
/* 设置提示弹窗的样式 */ /* 设置提示弹窗的样式 */
.el-dialog { .el-dialog {
border-radius: 6px; border-radius: 6px;
margin-top: 240px; margin-top: 240px;
} }
.el-dialog__header { .el-dialog__header {
border-bottom: 1px solid #edf0ff; border-bottom: 1px solid #edf0ff;
padding: 16px; padding: 16px;
margin-right: 0; margin-right: 0;
} }
.el-dialog__title { .el-dialog__title {
font-size: 18px; font-size: 18px;
font-weight: 700; font-weight: 700;
color: #1d1e20; color: #1d1e20;
padding-left: 12px; padding-left: 12px;
position: relative; position: relative;
} }
.el-dialog__title::before { .el-dialog__title::before {
content: ""; content: "";
position: absolute; position: absolute;
width: 4px; width: 4px;
height: 16px; height: 16px;
border-radius: 2px; border-radius: 2px;
background-color: #515fe7; background-color: #515fe7;
left: 0; left: 0;
top: 5px; top: 5px;
} }
.el-dialog__headerbtn .el-dialog__close { .el-dialog__headerbtn .el-dialog__close {
color: #8890a7; color: #8890a7;
} }
.el-dialog__headerbtn:focus .el-dialog__close, .el-dialog__headerbtn:focus .el-dialog__close,
.el-dialog__headerbtn:hover .el-dialog__close { .el-dialog__headerbtn:hover .el-dialog__close {
color: #515fe7; color: #515fe7;
} }
.el-dialog__body { .el-dialog__body {
font-size: 16px; font-size: 16px;
color: #404a62; color: #404a62;
text-align: center; text-align: center;
padding: 0 16px; padding: 0 20px;
line-height: 1; line-height: 1;
} }
.dialog_box .el-dialog__body { .dialog_box .el-dialog__body {
padding: 24px; padding: 24px;
} }
.dialog_box .el-dialog__footer { .dialog_box .el-dialog__footer {
padding: 16px; padding: 16px;
} }
.dialog_box1 .el-dialog__body { .dialog_box1 .el-dialog__body {
padding: 16px; padding: 16px;
} }
/* 设置tab切换的样式 */ /* 设置tab切换的样式 */
.el-tabs__item.is-disabled { .el-tabs__item.is-disabled {
color: #8890a7 !important; color: #8890a7 !important;
} }
.el-tabs__item { .el-tabs__item {
font-size: 14px; font-size: 14px;
color: #404a62; color: #404a62;
line-height: 14px !important; line-height: 14px !important;
} }
/* .el-tabs__nav-scroll { /* .el-tabs__nav-scroll {
height: 35px; height: 35px;
} */ } */
.el-tabs__nav-scroll .el-tabs__nav { .el-tabs__nav-scroll .el-tabs__nav {
height: 40px; height: 40px;
} }
.el-tabs__nav-scroll .el-tabs__item { .el-tabs__nav-scroll .el-tabs__item {
line-height: 14px !important; line-height: 14px !important;
height: 40px !important; height: 40px !important;
} }
.el-tabs__item:hover { .el-tabs__item:hover {
color: #404a62; color: #404a62;
} }
.el-tabs__item.is-active { .el-tabs__item.is-active {
color: #3759be !important; color: #3759be !important;
} }
.el-tabs__active-bar { .el-tabs__active-bar {
height: 3px; height: 3px;
border-radius: 1px; border-radius: 1px;
background-color: #2b4695 !important; background-color: #2b4695 !important;
} }
.el-tabs__nav-wrap::after { .el-tabs__nav-wrap::after {
height: 1px; height: 1px;
background-color: #edf0ff; background-color: #edf0ff;
} }
/* 设置tree的样式 */ /* 设置tree的样式 */
/* .el-tree { /* .el-tree {
position: static!important; position: static!important;
} }
...@@ -384,11 +349,9 @@ div { ...@@ -384,11 +349,9 @@ div {
} }
.el-tree-node__content:hover { .el-tree-node__content:hover {
background-image: linear-gradient(90deg, background-image: linear-gradient(90deg,
rgba(255, 255, 255, 0.05) 83%, rgba(255, 255, 255, 0.05) 83%,
rgba(0, 0, 0, 0.05) 86%); rgba(0, 0, 0, 0.05) 86%);
} */ } */
/* .usrrole .el-tree-node:focus>.el-tree-node__content{ /* .usrrole .el-tree-node:focus>.el-tree-node__content{
background: rgb(248, 249, 253) !important; background: rgb(248, 249, 253) !important;
} }
...@@ -430,164 +393,151 @@ border-radius:8px; ...@@ -430,164 +393,151 @@ border-radius:8px;
border-bottom-left-radius:0; border-bottom-left-radius:0;
border-bottom-right-radius:0; border-bottom-right-radius:0;
} */ } */
/* 左右布局 */ /* 左右布局 */
.flex { .flex {
height: 100%; height: 100%;
display: -webkit-box; display: -webkit-box;
/* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */ /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */
display: -moz-box; display: -moz-box;
/* Firefox 17- */ /* Firefox 17- */
display: -webkit-flex; display: -webkit-flex;
/* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */ /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */
display: -moz-flex; display: -moz-flex;
/* Firefox 18+ */ /* Firefox 18+ */
display: -ms-flexbox; display: -ms-flexbox;
/* IE 10 */ /* IE 10 */
display: flex; display: flex;
/* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */ /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
} }
.flex-left { .flex-left {
width: 178px; width: 178px;
background-color: #1a2236; background-color: #1a2236;
height: 100%; height: 100%;
} }
.flex-right { .flex-right {
padding: 0 20px 20px; padding: 0 20px 20px;
box-sizing: border-box; box-sizing: border-box;
-webkit-box-flex: auto; -webkit-box-flex: auto;
-ms-flex: auto; -ms-flex: auto;
-webkit-flex: auto; -webkit-flex: auto;
flex: 1; flex: 1;
overflow-y: auto; overflow-y: auto;
} }
.flex-right-box { .flex-right-box {
width: 100%; width: 100%;
height: 100%; height: 100%;
position: relative; position: relative;
} }
.ces-main { .ces-main {
position: absolute; position: absolute;
width: 100%; width: 100%;
} }
.v-modal { .v-modal {
background: #000a2b !important; background: #000a2b !important;
} }
.drawer600 { .drawer600 {
width: 600px !important; width: 600px !important;
} }
.drawer620 { .drawer620 {
width: 620px !important; width: 620px !important;
} }
.drawer1202 { .drawer1202 {
width: 1202px !important; width: 1202px !important;
} }
/* .el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap>.el-form-item__label:before, /* .el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap>.el-form-item__label:before,
.el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label:before { .el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label:before {
content: ""; content: "";
} */ } */
/* 设置switch的样式 */ /* 设置switch的样式 */
.switchStyle1 .el-switch__label { .switchStyle1 .el-switch__label {
position: absolute; position: absolute;
display: none; display: none;
color: #fff; color: #fff;
} }
/*打开时文字位置设置*/ /*打开时文字位置设置*/
.switchStyle1 .el-switch__label--right { .switchStyle1 .el-switch__label--right {
z-index: 1; z-index: 1;
right: -10px; right: -10px;
top: 1px; top: 1px;
} }
/*关闭时文字位置设置*/ /*关闭时文字位置设置*/
.switchStyle1 .el-switch__label--left { .switchStyle1 .el-switch__label--left {
z-index: 1; z-index: 1;
left: 28px; left: 28px;
top: 1px; top: 1px;
} }
.switchStyle1 .el-switch__label.is-active { .switchStyle1 .el-switch__label.is-active {
display: block; display: block;
} }
.switchStyle1.el-switch .el-switch__core, .switchStyle1.el-switch .el-switch__core,
.switchStyle1.el-switch .el-switch__label { .switchStyle1.el-switch .el-switch__label {
width: 62px !important; width: 62px !important;
height: 28px !important; height: 28px !important;
border-radius: 28px !important; border-radius: 28px !important;
} }
.switchStyle1 .el-switch__core { .switchStyle1 .el-switch__core {
background: #f8f9fd !important; background: #f8f9fd !important;
border: 1px solid #8890a7 !important; border: 1px solid #8890a7 !important;
} }
.switchStyle1 .el-switch__core:after { .switchStyle1 .el-switch__core:after {
background: #8890a7 !important; background: #8890a7 !important;
width: 22px; width: 22px;
height: 22px; height: 22px;
left: 2px; left: 2px;
top: 2.1px; top: 2.1px;
} }
.switchStyle1.el-switch.is-checked .el-switch__core { .switchStyle1.el-switch.is-checked .el-switch__core {
background: #f8f9fd !important; background: #f8f9fd !important;
border: 1px solid #5c82ff !important; border: 1px solid #5c82ff !important;
} }
.switchStyle1.el-switch.is-checked .el-switch__core:after { .switchStyle1.el-switch.is-checked .el-switch__core:after {
background: #5c82ff !important; background: #5c82ff !important;
width: 22px; width: 22px;
height: 22px; height: 22px;
right: 0; right: 0;
top: 2.1px; top: 2.1px;
} }
.switchStyle1.el-switch.is-checked .el-switch__core::after { .switchStyle1.el-switch.is-checked .el-switch__core::after {
margin-left: -25px; margin-left: -25px;
} }
.switchStyle1 .el-switch__label * { .switchStyle1 .el-switch__label * {
font-size: 14px !important; font-size: 14px !important;
font-weight: 800; font-weight: 800;
} }
.switchStyle1.el-switch .el-switch__label { .switchStyle1.el-switch .el-switch__label {
color: #8890a7 !important; color: #8890a7 !important;
} }
.switchStyle1.el-switch.is-checked .el-switch__label { .switchStyle1.el-switch.is-checked .el-switch__label {
color: #5c82ff !important; color: #5c82ff !important;
} }
.switchStyle1.el-switch:hover { .switchStyle1.el-switch:hover {
opacity: 0.8; opacity: 0.8;
} }
/* 自定义图表提示框小三角 */ /* 自定义图表提示框小三角 */
/* .div-tip-warp { /* .div-tip-warp {
position: relative; position: relative;
line-height: 22px; line-height: 22px;
...@@ -608,516 +558,501 @@ border-radius:8px; ...@@ -608,516 +558,501 @@ border-radius:8px;
.triangle-position { .triangle-position {
margin-left: 35px; margin-left: 35px;
} */ } */
.el-input__inner { .el-input__inner {
border-radius: 6px; border-radius: 6px;
} }
.el-input-group__append, .el-input-group__append,
.el-input-group__prepend { .el-input-group__prepend {
border-radius: 8px; border-radius: 8px;
} }
.el-button { .el-button {
border-radius: 4px; border-radius: 4px;
height: 36px; height: 36px;
line-height: 36px; line-height: 36px;
} }
.el-select-dropdown { .el-select-dropdown {
z-index: 20000 !important; z-index: 20000 !important;
} }
/* /*
下拉选样式 下拉选样式
此处勿删，apaasV3下拉选择样式统一用这个 此处勿删，apaasV3下拉选择样式统一用这个
*/ */
.el-select-dropdown { .el-select-dropdown {
border-radius: 8px; border-radius: 8px;
} }
.el-select-dropdown__empty { .el-select-dropdown__empty {
color: #f4f7fc; color: #f4f7fc;
border-radius: 8px; border-radius: 8px;
} }
.el-select-dropdown__list { .el-select-dropdown__list {
padding: 0; padding: 0;
top: 10px; top: 10px;
border-radius: 4px; border-radius: 4px;
} }
.el-select-dropdown__item { .el-select-dropdown__item {
font-size: 12px; font-size: 12px;
padding: 0 20px; padding: 0 20px;
height: 34px; height: 34px;
line-height: 34px; line-height: 34px;
} }
.el-select-dropdown.is-multiple .el-select-dropdown__item.selected { .el-select-dropdown.is-multiple .el-select-dropdown__item.selected {
background-color: transparent; background-color: transparent;
color: #2b4695; color: #2b4695;
} }
.el-scrollbar { .el-scrollbar {
border-radius: 8px; border-radius: 8px;
} }
.el-popper[x-placement^="bottom"] .popper__arrow::after { .el-popper[x-placement^="bottom"] .popper__arrow::after {
border-bottom-color: transparent; border-bottom-color: transparent;
} }
.el-popper[x-placement^="top"] .popper__arrow::after { .el-popper[x-placement^="top"] .popper__arrow::after {
border-top-color: transparent; border-top-color: transparent;
} }
/* 单选激活样式 */ /* 单选激活样式 */
.el-radio__input .el-radio__inner { .el-radio__input .el-radio__inner {
border-color: #dadee7; border-color: #dadee7;
background-color: #fff; background-color: #fff;
width: 16px; width: 16px;
height: 16px; height: 16px;
} }
.el-radio__input.is-checked .el-radio__inner { .el-radio__input.is-checked .el-radio__inner {
border-color: #dadee7; border-color: #dadee7;
background-color: #fff; background-color: #fff;
} }
.el-radio__input.is-checked+.el-radio__label { .el-radio__input.is-checked+.el-radio__label {
color: #1a2236; color: #1a2236;
font-weight: 700; font-weight: 700;
} }
.el-radio__inner::after { .el-radio__inner::after {
width: 8px; width: 8px;
height: 8px; height: 8px;
} }
.el-radio__input.is-checked .el-radio__inner::after { .el-radio__input.is-checked .el-radio__inner::after {
background-color: #2b4695; background-color: #2b4695;
} }
.el-radio__inner:hover { .el-radio__inner:hover {
border-color: #2b4695; border-color: #2b4695;
} }
/* 面包屑样式 */ /* 面包屑样式 */
.bread_crumb { .bread_crumb {
margin: 20px; margin: 20px;
font-size: 14px; font-size: 14px;
} }
.bread_crumb .el-breadcrumb__inner { .bread_crumb .el-breadcrumb__inner {
color: #b4c0f5 !important; color: #b4c0f5 !important;
} }
.bread_crumb .is-link { .bread_crumb .is-link {
color: #626de9 !important; color: #626de9 !important;
} }
.bread_crumb1 { .bread_crumb1 {
margin: 20px; margin: 20px;
font-size: 14px; font-size: 14px;
} }
.bread_crumb1 .el-breadcrumb__inner { .bread_crumb1 .el-breadcrumb__inner {
color: #242c43 !important; color: #242c43 !important;
} }
.bread_crumb1 .is-link { .bread_crumb1 .is-link {
color: #898d9e !important; color: #898d9e !important;
} }
/* 应用超市详情页公共样式 */ /* 应用超市详情页公共样式 */
.sevice_detail { .sevice_detail {
max-width: 1340px; max-width: 1340px;
padding-top: 1px; padding-top: 1px;
margin: 0 auto; margin: 0 auto;
} }
/* common */ /* common */
.apass_breadcrumb>.el-breadcrumb { .apass_breadcrumb>.el-breadcrumb {
padding: 10px 0; padding: 10px 0;
} }
.apass_breadcrumb>.el-breadcrumb .el-breadcrumb__inner { .apass_breadcrumb>.el-breadcrumb .el-breadcrumb__inner {
font-size: 14px; font-size: 14px;
font-weight: 400; font-weight: 400;
color: #898d9e; color: #898d9e;
line-height: 23px; line-height: 23px;
} }
.apass_breadcrumb>.el-breadcrumb .el-breadcrumb__item:last-child .el-breadcrumb__inner { .apass_breadcrumb>.el-breadcrumb .el-breadcrumb__item:last-child .el-breadcrumb__inner {
color: #242c43; color: #242c43;
font-weight: normal; font-weight: normal;
} }
.apaas_button .el-button { .apaas_button .el-button {
/* min-width: 90px; */ /* min-width: 90px; */
color: #404a62; color: #404a62;
} }
.apaas_button .el-button--mini, .apaas_button .el-button--mini,
.apaas_button .el-button--mini.is-round { .apaas_button .el-button--mini.is-round {
padding: 10px 15px; padding: 10px 15px;
} }
.apaas_button .el-button--primary { .apaas_button .el-button--primary {
color: #fff; color: #fff;
background-color: #2b4695; background-color: #2b4695;
border-color: #2b4695; border-color: #2b4695;
} }
.apaas_button .el-button--primary.is-plain { .apaas_button .el-button--primary.is-plain {
color: #2b4695; color: #2b4695;
background-color: #e1e4fb; background-color: #e1e4fb;
border-color: #e1e4fb; border-color: #e1e4fb;
} }
.apaas_button .el-button--info { .apaas_button .el-button--info {
color: #fff; color: #fff;
background-color: #404a62; background-color: #404a62;
border-color: #404a62; border-color: #404a62;
} }
.apaas_button .el-button--info:hover { .apaas_button .el-button--info:hover {
background-color: #5c6579; background-color: #5c6579;
border-color: #5c6579; border-color: #5c6579;
} }
.apaas_button .el-button--info:active { .apaas_button .el-button--info:active {
background-color: #363f53; background-color: #363f53;
border-color: #363f53; border-color: #363f53;
} }
.apaas_button .el-button--danger { .apaas_button .el-button--danger {
color: #fff; color: #fff;
background-color: #ad3a4a; background-color: #ad3a4a;
border-color: #ad3a4a; border-color: #ad3a4a;
} }
.apaas_button .el-button.is-disabled, .apaas_button .el-button.is-disabled,
.apaas_button .el-button.is-disabled:focus, .apaas_button .el-button.is-disabled:focus,
.apaas_button .el-button.is-disabled:hover { .apaas_button .el-button.is-disabled:hover {
cursor: not-allowed; cursor: not-allowed;
} }
.apaas_button .el-button--warning.is-plain { .apaas_button .el-button--warning.is-plain {
background-color: #fcefd6; background-color: #fcefd6;
border-color: #fac266; border-color: #fac266;
color: #e56600; color: #e56600;
} }
.apaas_button .el-button--warning { .apaas_button .el-button--warning {
background-color: #e56600; background-color: #e56600;
border-color: #e56600; border-color: #e56600;
color: #fcefd6; color: #fcefd6;
} }
.apaas_button .el-button--success { .apaas_button .el-button--success {
background-color: #429e8a; background-color: #429e8a;
border-color: #429e8a; border-color: #429e8a;
color: #fff; color: #fff;
} }
.apaas_button .gray-button { .apaas_button .gray-button {
color: #fff; color: #fff;
background-color: #404a62; background-color: #404a62;
border-color: #404a62; border-color: #404a62;
} }
.apaas_button .el-button.is-disabled, .apaas_button .el-button.is-disabled,
.apaas_button .el-button.is-disabled:focus, .apaas_button .el-button.is-disabled:focus,
.apaas_button .el-button.is-disabled:hover { .apaas_button .el-button.is-disabled:hover {
color: #c0c4cc; color: #c0c4cc;
cursor: not-allowed; cursor: not-allowed;
background-image: none; background-image: none;
background-color: #fff; background-color: #fff;
border-color: #ebeef5; border-color: #ebeef5;
} }
.apass_table .el-table th>.cell { .apass_table .el-table th>.cell {
color: #1a2236; color: #1a2236;
} }
.apass_table .el-table td, .apass_table .el-table td,
.apass_table .el-table th.is-leaf { .apass_table .el-table th.is-leaf {
border: none !important; border: none !important;
line-height: 23px; line-height: 23px;
} }
.apass_table .el-table::before { .apass_table .el-table::before {
display: none; display: none;
} }
.apass_table .el-table { .apass_table .el-table {
width: 100%; width: 100%;
} }
.apass_table .el-table__row:nth-child(odd) td { .apass_table .el-table__row:nth-child(odd) td {
background-color: #f7f7f9; background-color: #f7f7f9;
} }
.apass_table .table_html a { .apass_table .table_html a {
font-size: 14px; font-size: 14px;
color: #2b4695; color: #2b4695;
cursor: pointer; cursor: pointer;
} }
.apass_table .row_action { .apass_table .row_action {
user-select: none; user-select: none;
} }
.apass_table .row_action .btn { .apass_table .row_action .btn {
font-size: 14px; font-size: 14px;
color: #3759be; color: #3759be;
cursor: pointer; cursor: pointer;
} }
.apass_table .row_action .btn.warn { .apass_table .row_action .btn.warn {
color: #830f53; color: #830f53;
} }
.apass_table .row_action .btn.disabled { .apass_table .row_action .btn.disabled {
color: #999; color: #999;
cursor: not-allowed; cursor: not-allowed;
} }
.apass_table .row_action .disabled.hide { .apass_table .row_action .disabled.hide {
opacity: 0; opacity: 0;
cursor: auto; cursor: auto;
} }
.apass_table .row_action .interval_line { .apass_table .row_action .interval_line {
font-size: 14px; font-size: 14px;
color: #c1c7d7; color: #c1c7d7;
margin: 0 20px; margin: 0 20px;
} }
.apass_table .border-active td { .apass_table .border-active td {
padding: 10px 0; padding: 10px 0;
background-color: #e6ebfe; background-color: #e6ebfe;
border-top: 2px solid #515fe7 !important; border-top: 2px solid #515fe7 !important;
border-bottom: 2px solid #515fe7 !important; border-bottom: 2px solid #515fe7 !important;
} }
.apass_table .border-active td:first-child { .apass_table .border-active td:first-child {
border-left: 2px solid #515fe7 !important; border-left: 2px solid #515fe7 !important;
} }
.apass_table .border-active td:last-child { .apass_table .border-active td:last-child {
border-right: 2px solid #515fe7 !important; border-right: 2px solid #515fe7 !important;
} }
.apass_checkbox .el-checkbox__input.is-checked .el-checkbox__inner, .apass_checkbox .el-checkbox__input.is-checked .el-checkbox__inner,
.apass_checkbox .el-checkbox__input.is-indeterminate .el-checkbox__inner { .apass_checkbox .el-checkbox__input.is-indeterminate .el-checkbox__inner {
background-color: #3759be; background-color: #3759be;
border-color: #515fe7; border-color: #515fe7;
} }
.apass_checkbox .el-checkbox__input.is-checked+.el-checkbox__label { .apass_checkbox .el-checkbox__input.is-checked+.el-checkbox__label {
color: #58617a; color: #58617a;
} }
.apaas_scroll::-webkit-scrollbar { .apaas_scroll::-webkit-scrollbar {
width: 16px; width: 16px;
height: 1px; height: 1px;
} }
.apaas_scroll::-webkit-scrollbar-thumb { .apaas_scroll::-webkit-scrollbar-thumb {
border-radius: 8px; border-radius: 8px;
/* background: #dde4ff; */ /* background: #dde4ff; */
box-shadow: 8px 0 0 #a5adb7 inset; box-shadow: 8px 0 0 #a5adb7 inset;
border: 4px solid rgba(0, 0, 0, 0); border: 4px solid rgba(0, 0, 0, 0);
} }
.apaas_scroll::-webkit-scrollbar-track { .apaas_scroll::-webkit-scrollbar-track {
border-radius: 8px; border-radius: 8px;
/* background: #f4f4f4; */ /* background: #f4f4f4; */
box-shadow: 8px 0 0 #f4f4f4 inset; box-shadow: 8px 0 0 #f4f4f4 inset;
border: 4px solid rgba(0, 0, 0, 0); border: 4px solid rgba(0, 0, 0, 0);
} }
.apaas_scroll_nor::-webkit-scrollbar { .apaas_scroll_nor::-webkit-scrollbar {
width: 0px; width: 0px;
height: 0px; height: 0px;
} }
.apaas_scroll_min::-webkit-scrollbar { .apaas_scroll_min::-webkit-scrollbar {
width: 6px; width: 6px;
height: 1px; height: 1px;
} }
.apaas_scroll_min::-webkit-scrollbar-thumb { .apaas_scroll_min::-webkit-scrollbar-thumb {
border-radius: 3px; border-radius: 3px;
background: #e6e9ef; background: #e6e9ef;
box-shadow: 8px 0 0 #e6e9ef inset; box-shadow: 8px 0 0 #e6e9ef inset;
border: 4px solid rgba(0, 0, 0, 0); border: 4px solid rgba(0, 0, 0, 0);
} }
.apaas_scroll_min::-webkit-scrollbar-track { .apaas_scroll_min::-webkit-scrollbar-track {
border-radius: 3px; border-radius: 3px;
background: #fff; background: #fff;
box-shadow: 8px 0 0 #fff inset; box-shadow: 8px 0 0 #fff inset;
border: 4px solid rgba(0, 0, 0, 0); border: 4px solid rgba(0, 0, 0, 0);
} }
/* 详情页公共样式 by xuyiming */ /* 详情页公共样式 by xuyiming */
.apaas_detail_container { .apaas_detail_container {
padding: 0 20px; padding: 0 20px;
} }
.apaas_detail_container .main_contaner { .apaas_detail_container .main_contaner {
min-height: calc(100vh - 32px - 83px); min-height: calc(100vh - 32px - 83px);
flex-grow: 1; flex-grow: 1;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: flex-start; justify-content: flex-start;
align-items: stretch; align-items: stretch;
padding: 30px; padding: 30px;
background-color: #fff; background-color: #fff;
border-radius: 10px; border-radius: 10px;
margin-bottom: 14px; margin-bottom: 14px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
} }
.apaas_detail_container .main_contaner.locked_height { .apaas_detail_container .main_contaner.locked_height {
height: calc(100vh - 58px - 83px); height: calc(100vh - 58px - 83px);
min-height: 400px; min-height: 400px;
} }
.apaas_detail_container .main_contaner.locked_height_900 { .apaas_detail_container .main_contaner.locked_height_900 {
height: calc(100vh - 58px - 83px); height: calc(100vh - 58px - 83px);
min-height: 900px; min-height: 900px;
} }
.apaas_detail_container .detail_action { .apaas_detail_container .detail_action {
text-align: right; text-align: right;
margin-top: 50px; margin-top: 50px;
} }
.apaas_detail_container .detail_action .el-button+.el-button { .apaas_detail_container .detail_action .el-button+.el-button {
margin-left: 30px; margin-left: 30px;
} }
.apaas_detail_form { .apaas_detail_form {
max-width: 970px; max-width: 970px;
} }
.apaas_detail_form .el-input__inner, .apaas_detail_form .el-input__inner,
.apaas_detail_form .el-textarea__inner { .apaas_detail_form .el-textarea__inner {
width: 100%; width: 100%;
background-color: #f7f8f9; background-color: #f7f8f9;
} }
.apaas_detail_form .el-select { .apaas_detail_form .el-select {
width: 100%; width: 100%;
} }
.apaas_detail_form.el-form--label-top .el-form-item__label { .apaas_detail_form.el-form--label-top .el-form-item__label {
padding: 0 0 15px; padding: 0 0 15px;
font-size: 14px; font-size: 14px;
line-height: 1; line-height: 1;
color: #58617a; color: #58617a;
} }
.apaas_detail_form .el-form-item { .apaas_detail_form .el-form-item {
margin-bottom: 30px; margin-bottom: 30px;
} }
.apaas_detail_form .textarea_count { .apaas_detail_form .textarea_count {
font-size: 14px; font-size: 14px;
line-height: 1; line-height: 1;
color: #a9aec0; color: #a9aec0;
text-align: right; text-align: right;
margin-top: 10px; margin-top: 10px;
} }
.apaas_steps { .apaas_steps {
height: 100%; height: 100%;
} }
.apaas_steps .apaas_step { .apaas_steps .apaas_step {
height: 100%; height: 100%;
position: relative; position: relative;
} }
.apaas_steps .apaas_step .apaas_step_content { .apaas_steps .apaas_step .apaas_step_content {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
width: 100%; width: 100%;
height: calc(100% - 64px); height: calc(100% - 64px);
border-bottom: 1px solid #f4f7fc; border-bottom: 1px solid #f4f7fc;
/* overflow: hidden; */ /* overflow: hidden; */
} }
.apaas_steps .apaas_step .apaas_step_action { .apaas_steps .apaas_step .apaas_step_action {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
left: 0; left: 0;
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: flex-start; align-items: flex-start;
} }
.apaas_steps .apaas_step .apaas_step_action .el-button { .apaas_steps .apaas_step .apaas_step_action .el-button {
height: 44px; height: 44px;
width: 124px; width: 124px;
} }
.apaas_steps .apaas_step .apaas_step_action .el-button+.el-button { .apaas_steps .apaas_step .apaas_step_action .el-button+.el-button {
margin-left: 20px; margin-left: 20px;
} }
.top_fliter { .top_fliter {
display: flex; display: flex;
} }
.filter_list { .filter_list {
flex-grow: 1; flex-grow: 1;
font-size: 0; font-size: 0;
} }
.filter_list>.filter_item { .filter_list>.filter_item {
display: flex; display: flex;
align-items: center; align-items: center;
margin: 0 34px 16px 0; margin: 0 34px 16px 0;
} }
/* .filter_list>.filter_item>* { /* .filter_list>.filter_item>* {
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
} */ } */
.filter_list>.filter_item>.filter_title { .filter_list>.filter_item>.filter_title {
text-align: right; text-align: right;
font-size: 14px; font-size: 14px;
color: #242c43; color: #242c43;
margin-right: 10px; margin-right: 10px;
width: 84px; width: 84px;
white-space: pre-wrap; white-space: pre-wrap;
font-weight: normal; font-weight: normal;
} }
/* .filter_list>.filter_item>.filter_title+* { /* .filter_list>.filter_item>.filter_title+* {
width: 300px; width: 300px;
} }
...@@ -1133,443 +1068,575 @@ border-radius:8px; ...@@ -1133,443 +1068,575 @@ border-radius:8px;
} */ } */
.top_fliter .filter_action { .top_fliter .filter_action {
flex-shrink: 0; flex-shrink: 0;
margin-left: 25px; margin-left: 25px;
text-align: right; text-align: right;
} }
.filter_action>.el-button { .filter_action>.el-button {
/* min-width: 90px; */ /* min-width: 90px; */
height: 36px; height: 36px;
margin-top: 16px; margin-top: 16px;
padding: 12px 17px; padding: 12px 17px;
} }
.filter_action>.el-button+.el-button { .filter_action>.el-button+.el-button {
margin-left: 10px; margin-left: 10px;
} }
.meassage_detail_dialog { .meassage_detail_dialog {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
text-align: left; text-align: left;
} }
.meassage_detail_dialog .detail_item { .meassage_detail_dialog .detail_item {
flex: 1 1 auto; flex: 1 1 auto;
width: 50%; width: 50%;
margin-top: 20px; margin-top: 20px;
} }
.meassage_detail_dialog .detail_item.full_line { .meassage_detail_dialog .detail_item.full_line {
width: 100%; width: 100%;
} }
.meassage_detail_dialog .detail_item p { .meassage_detail_dialog .detail_item p {
padding: 0 15px; padding: 0 15px;
font-size: 14px; font-size: 14px;
line-height: 22px; line-height: 22px;
color: #8890a7; color: #8890a7;
} }
.meassage_detail_dialog .detail_item .item_content { .meassage_detail_dialog .detail_item .item_content {
color: #000; color: #000;
margin-top: 10px; margin-top: 10px;
} }
.meassage_detail_dialog .detail_item .full_content { .meassage_detail_dialog .detail_item .full_content {
padding: 10px 0; padding: 10px 0;
border-radius: 8px; border-radius: 8px;
background-color: #f8f9fd; background-color: #f8f9fd;
margin-top: 5px; margin-top: 5px;
} }
.meassage_detail_dialog .detail_item .full_content>.apaas_scroll { .meassage_detail_dialog .detail_item .full_content>.apaas_scroll {
height: 176px; height: 176px;
overflow: auto; overflow: auto;
} }
.meassage_detail_dialog .detail_item .full_content .item_content { .meassage_detail_dialog .detail_item .full_content .item_content {
margin: 0; margin: 0;
} }
.no_wrap .apass_table td .cell { .no_wrap .apass_table td .cell {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
word-break: break-all; word-break: break-all;
white-space: nowrap; white-space: nowrap;
} }
/* 详情页公共样式 by xuyiming ~~~end */ /* 详情页公共样式 by xuyiming ~~~end */
/* /*
form_content form_content
*/ */
.from_content1 { .from_content1 {
width: calc(100% - 40px); width: calc(100% - 40px);
background-color: rgba(255, 255, 255, 1); background-color: rgba(255, 255, 255, 1);
overflow: hidden; overflow: hidden;
margin: 0 20px 20px; margin: 0 20px 20px;
position: relative; position: relative;
box-shadow: 0px 3px 6px 0px rgba(15, 19, 65, 0.05); box-shadow: 0px 3px 6px 0px rgba(15, 19, 65, 0.05);
border-radius: 12px; border-radius: 12px;
padding-top: 20px; padding-top: 20px;
} }
.from_content { .from_content {
width: calc(100% - 40px); width: calc(100% - 40px);
background-color: rgba(255, 255, 255, 1); background-color: rgba(255, 255, 255, 1);
/* flex: 1 0 auto; */ /* flex: 1 0 auto; */
position: relative; position: relative;
box-shadow: 0px 3px 6px 0px rgba(15, 19, 65, 0.05); box-shadow: 0px 3px 6px 0px rgba(15, 19, 65, 0.05);
border-radius: 12px; border-radius: 12px;
margin: 0 20px; margin: 0 20px;
padding: 20px 20px 30px; padding: 20px 20px 30px;
} }
.from_content_table { .from_content_table {
height: calc(100% - 90px); height: calc(100% - 90px);
} }
.from_content_table_app { .from_content_table_app {
height: calc(100% - 170px); height: calc(100% - 170px);
} }
.from_content_table_auth { .from_content_table_auth {
height: calc(100% - 100px); height: calc(100% - 100px);
} }
.from_content_btn { .from_content_btn {
height: 40px; height: 40px;
margin-bottom: 20px; margin-bottom: 20px;
} }
/* 时间控件样式 */ /* 时间控件样式 */
.el-picker-panel { .el-picker-panel {
background-color: #fff !important; background-color: #fff !important;
border-radius: 8px !important; border-radius: 8px !important;
font-size: 12px !important; font-size: 12px !important;
color: #202531 !important; color: #202531 !important;
box-shadow: 0 !important; box-shadow: 0 !important;
border: none !important; border: none !important;
} }
.el-date-editor.el-input__wrapper { .el-date-editor.el-input__wrapper {
background-color: #fff; background-color: #fff;
} }
/* .el-picker-panel__footer {
/* border-top: 1px solid #3f4864 !important;
.el-picker-panel__footer { background-color: #242c43 !important;
border-top: 1px solid #3f4864 !important;
background-color: #242c43 !important;
} */ } */
.el-picker-panel__icon-btn { .el-picker-panel__icon-btn {
color: #202531; color: #202531;
} }
.el-date-table th { .el-date-table th {
border-bottom: 1px solid #e6e9ef !important; border-bottom: 1px solid #e6e9ef !important;
color: #202531 !important; color: #202531 !important;
} }
.el-date-table td.current:not(.disabled) span { .el-date-table td.current:not(.disabled) span {
color: #e3e5ef !important; color: #e3e5ef !important;
background-color: #315efc !important; background-color: #315efc !important;
} }
.el-date-table td.next-month, .el-date-table td.next-month,
.el-date-table td.prev-month { .el-date-table td.prev-month {
color: #a9b1c7 !important; color: #a9b1c7 !important;
} }
.el-date-picker__time-header { .el-date-picker__time-header {
border-bottom: 1px solid #3f4864 !important; border-bottom: 1px solid #3f4864 !important;
} }
.el-picker-panel__body .el-input__inner { .el-picker-panel__body .el-input__inner {
height: 24px !important; height: 24px !important;
line-height: 24px !important; line-height: 24px !important;
border-radius: 12px !important; border-radius: 12px !important;
font-size: 12px; font-size: 12px;
} }
.el-picker-panel__footer .el-button { .el-picker-panel__footer .el-button {
background-color: #264dd9; background-color: #264dd9;
border-radius: 12px; border-radius: 12px;
padding: 5px 12px; padding: 5px 12px;
color: #f4f7fc; color: #f4f7fc;
font-size: 12px; font-size: 12px;
border: none !important; border: none !important;
} }
.el-picker-panel__footer .el-button--text { .el-picker-panel__footer .el-button--text {
background-color: #dde4ff; background-color: #dde4ff;
border-radius: 12px; border-radius: 12px;
padding: 5px 12px; padding: 5px 12px;
color: #264dd9; color: #264dd9;
font-size: 12px; font-size: 12px;
} }
.el-button.is-plain:focus, .el-button.is-plain:focus,
.el-button.is-plain:hover { .el-button.is-plain:hover {
background-color: #264dd9; background-color: #264dd9;
color: #f4f7fc; color: #f4f7fc;
} }
.el-button--text:focus, .el-button--text:focus,
.el-button--text:hover { .el-button--text:hover {
color: #264dd9; color: #264dd9;
} }
.el-time-panel { .el-time-panel {
border-radius: 8px !important; border-radius: 8px !important;
/* border: 1px solid #3f4864 !important; /* border: 1px solid #3f4864 !important;
background-color: #242c43 !important; */ background-color: #242c43 !important; */
} }
.el-time-panel__footer { .el-time-panel__footer {
/* border: 1px solid #3f4864 !important; */ /* border: 1px solid #3f4864 !important; */
} }
.el-time-panel__btn.confirm { .el-time-panel__btn.confirm {
background-color: #264dd9; background-color: #264dd9;
border-radius: 12px !important; border-radius: 12px !important;
padding: 0px 12px; padding: 0px 12px;
color: #f4f7fc !important; color: #f4f7fc !important;
font-size: 12px !important; font-size: 12px !important;
} }
.el-time-panel__btn { .el-time-panel__btn {
line-height: 22px !important; line-height: 22px !important;
height: 22px !important; height: 22px !important;
} }
.el-time-spinner__item:hover:not(.disabled):not(.active) { .el-time-spinner__item:hover:not(.disabled):not(.active) {
/* background-color: #264dd9 !important; */ /* background-color: #264dd9 !important;
/* border-radius: 12px !important; */ border-radius: 12px !important; */
color: #f4f7fc; color: #f4f7fc;
} }
.el-time-spinner__item { .el-time-spinner__item {
color: #58617a !important; color: #58617a !important;
} }
.el-date-table td.in-range div, .el-date-table td.in-range div,
.el-date-table td.in-range div:hover, .el-date-table td.in-range div:hover,
.el-date-table.is-week-mode .el-date-table__row.current div, .el-date-table.is-week-mode .el-date-table__row.current div,
.el-date-table.is-week-mode .el-date-table__row:hover div { .el-date-table.is-week-mode .el-date-table__row:hover div {
background-color: #eff2fa !important; background-color: #eff2fa !important;
} }
.el-date-table td.end-date .el-date-table-cell__text, .el-date-table td.end-date .el-date-table-cell__text,
.el-date-table td.start-date .el-date-table-cell__text { .el-date-table td.start-date .el-date-table-cell__text {
background-color: #3759be !important; background-color: #3759be !important;
} }
.el-date-table td.end-date span, .el-date-table td.end-date span,
.el-date-table td.start-date span { .el-date-table td.start-date span {
background-color: #264dd9; background-color: #264dd9;
} }
.el-date-table td.today span { .el-date-table td.today span {
color: #0c3ff7; color: #0c3ff7;
} }
.el-date-editor .el-range-separator { .el-date-editor .el-range-separator {
width: 15%; width: 15%;
line-height: 28px; line-height: 28px;
color: #202531; color: #202531;
} }
/* table select window */ /* table select window */
.el-checkbox__input.is-checked .el-checkbox__inner, .el-checkbox__input.is-checked .el-checkbox__inner,
.el-checkbox__input.is-indeterminate .el-checkbox__inner { .el-checkbox__input.is-indeterminate .el-checkbox__inner {
background-color: #3759be; background-color: #3759be;
border-color: #2b4695; border-color: #2b4695;
} }
.el-checkbox__input.is-focus .el-checkbox__inner { .el-checkbox__input.is-focus .el-checkbox__inner {
border-color: #2b4695; border-color: #2b4695;
} }
.el-checkbox__input:hover .el-checkbox__inner { .el-checkbox__input:hover .el-checkbox__inner {
border-color: #2b4695; border-color: #2b4695;
} }
.el-date-editor .el-range-input { .el-date-editor .el-range-input {
width: 36%; width: 36%;
} }
.el-input__inner:focus { .el-input__inner:focus {
border-color: #515fe7; border-color: #515fe7;
} }
.el-textarea__inner:focus { .el-textarea__inner:focus {
border-color: #515fe7; border-color: #515fe7;
} }
.el-select .el-input .el-select__caret { .el-select .el-input .el-select__caret {
color: #515fe7; color: #909bb6;
} }
.el-input-number__decrease, .el-input-number__decrease,
.el-input-number__increase { .el-input-number__increase {
color: #515fe7; color: #515fe7;
} }
.el-input__inner::-webkit-input-placeholder, .el-input__inner::-webkit-input-placeholder,
.el-textarea__inner::-webkit-input-placeholder { .el-textarea__inner::-webkit-input-placeholder {
color: #a9aec0; color: #a9aec0;
} }
.el-input__inner:-moz-placeholder, .el-input__inner:-moz-placeholder,
.el-textarea__inner:-moz-placeholder { .el-textarea__inner:-moz-placeholder {
/* Firefox 18- */ /* Firefox 18- */
color: #a9aec0; color: #a9aec0;
} }
.el-input__inner::-moz-placeholder, .el-input__inner::-moz-placeholder,
.el-textarea__inner::-moz-placeholder { .el-textarea__inner::-moz-placeholder {
/* Firefox 19+ */ /* Firefox 19+ */
color: #a9aec0; color: #a9aec0;
} }
.el-input__inner:-ms-input-placeholder, .el-input__inner:-ms-input-placeholder,
.el-textarea__inner:-ms-input-placeholder { .el-textarea__inner:-ms-input-placeholder {
color: #a9aec0; color: #a9aec0;
} }
[class*=" el-icon-"], [class*=" el-icon-"],
[class^="el-icon-"] { [class^="el-icon-"] {
font-weight: 700; font-weight: 700;
} }
.el-rate__item .el-rate__icon { .el-rate__item .el-rate__icon {
font-size: 18px; font-size: 18px;
margin-right: 0; margin-right: 0;
} }
.detai_form .el-input__inner, .detai_form .el-input__inner,
.detai_form .el-textarea__inner { .detai_form .el-textarea__inner {
background-color: #f7f7f9; background-color: #f7f7f9;
border-radius: 4px; border-radius: 4px;
border: solid 1px #dadee7; border: solid 1px #dadee7;
} }
.detai_form .el-input.is-disabled .el-input__inner { .detai_form .el-input.is-disabled .el-input__inner {
background-color: #e6e9ef; background-color: #e6e9ef;
} }
.tip-box-popper { .tip-box-popper {
background: #242c43 !important; background: #242c43 !important;
} }
.p-1 { .p-1 {
padding: 5px; padding: 5px;
} }
.source_table .el-table thead tr { .source_table .el-table thead tr {
background-color: #dfe5f6 !important; background-color: #dfe5f6 !important;
} }
.source_table .el-table th { .source_table .el-table th {
background-color: transparent; background-color: transparent;
} }
.source_table .el-table td { .source_table .el-table td {
border-bottom: 1px solid #dadee7 !important; border-bottom: 1px solid #dadee7 !important;
} }
.source_table .el-table__header { .source_table .el-table__header {
border: 1px solid #b0bee8; border: 1px solid #b0bee8;
} }
.source_table .el-table__body-wrapper { .source_table .el-table__body-wrapper {
border-left: 1px solid #dadee7 !important; border-left: 1px solid #dadee7 !important;
border-right: 1px solid #dadee7 !important; border-right: 1px solid #dadee7 !important;
} }
.source_table .el-table__empty-block { .source_table .el-table__empty-block {
border-bottom: 1px solid #dadee7 !important; border-bottom: 1px solid #dadee7 !important;
} }
.source_footer { .source_footer {
margin-top: 15px; margin-top: 15px;
text-align: center; text-align: center;
} }
.source_title { .source_title {
font-size: 14px; font-size: 14px;
padding: 10px 0; padding: 10px 0;
text-align: left; text-align: left;
} }
.headerBox { .headerBox {
font-size: 18px; font-size: 18px;
line-height: 18px; line-height: 18px;
font-weight: 700; font-weight: 700;
font-stretch: normal; font-stretch: normal;
letter-spacing: 0px; letter-spacing: 0px;
color: #1a1a1a; color: #1a1a1a;
} }
.headerBox span:first-child { .headerBox span:first-child {
display: inline-block; display: inline-block;
width: 4px; width: 4px;
height: 16px; height: 16px;
background-color: #3759be; background-color: #3759be;
border-radius: 2px; border-radius: 2px;
margin-right: 10px; margin-right: 10px;
vertical-align: bottom; vertical-align: bottom;
} }
.row_text { .row_text {
-webkit-line-clamp: 2; -webkit-line-clamp: 2;
display: -webkit-box; display: -webkit-box;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
word-break: break-all; word-break: break-all;
} }
.close_reason { .close_reason {
padding: 2px 5px; padding: 2px 5px;
background-color: #dedede; background-color: #dedede;
display: inline-block; display: inline-block;
margin-top: 10px; margin-top: 10px;
} }
.pointer { .pointer {
cursor: pointer; cursor: pointer;
} }
.pr-1 { .pr-1 {
padding-right: 10px; padding-right: 10px;
} }
.page_container { .page_container {
width: 100%; width: 100%;
padding: 0 24px; padding: 0 24px;
/* min-height: 100%; */ /* min-height: 100%; */
height: 100%; height: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: flex-start; justify-content: flex-start;
align-items: stretch; align-items: stretch;
} }
.page_content { .page_content {
background-color: #fff; background-color: #fff;
height: calc(100% - 46px - 20px); height: calc(100% - 46px - 20px);
box-shadow: 0px 1px 4px 0px rgba(0, 7, 101, 0.15); box-shadow: 0px 1px 4px 0px rgba(0, 7, 101, 0.15);
border-radius: 6px; border-radius: 6px;
}
.flex_row {
display: flex;
height: 100%;
overflow: hidden;
}
.flex_left {
height: calc(100% - 16px);
width: 320px;
margin-right: 10px;
overflow: hidden;
}
.flex_right {
height: calc(100% - 16px);
flex: 1;
overflow: hidden;
}
.bgc_white {
box-shadow: 0px 1px 4px 0px rgba(0, 7, 101, 0.15);
border-radius: 6px;
background-color: #fff;
}
.tree::-webkit-scrollbar {
width: 6px;
height: 6px;
}
.tree::-webkit-scrollbar-thumb {
background: #bcc1d0;
border-radius: 10px;
height: 6px;
}
.tree::-webkit-scrollbar-track {
background: transparent;
border-radius: 2px;
}
.font_bold {
font-size: 18px;
color: #202531;
font-weight: bold;
margin-bottom: 20px;
}
.header_info {
font-size: 14px;
color: #404a62;
padding-left: 20px;
}
.fr {
float: right;
}
.pl-1 {
padding-left: 1rem;
}
.label-text {
font-size: 14px;
color: #404a62;
}
.icon_eye {
font-size: 12px;
color: #a9b1c7;
margin-right: 8px;
vertical-align: baseline;
cursor: pointer;
}
/* 可点击文字颜色、指针样式 */
.can_click_text {
cursor: pointer;
color: #3759be;
}
.can_click_text:hover {
color: #738bd2;
}
.can_click_text:active {
color: #2c4798;
}
.warning_info {
background-color: #f7f7f9;
font-size: 14px;
color: #404a62;
padding: 0 8px;
text-align: left;
margin: 16px 0;
line-height: 38px;
border-radius: 4px;
}
.danger_info {
color: #d75138;
}
.register_btn {
display: flex;
align-items: center;
background-color: #eff2fa;
border-radius: 4px;
border: solid 1px #b0bee8;
color: #3759be;
}
.register_btn .icon-arrow-right {
margin-left: 39px;
}
.forget_psd {
font-size: 14px;
color: #3759be;
cursor: pointer;
}
.select-empty {
color: #616f94;
text-align: center;
padding: 20px;
}
.tip-image {
position: absolute;
right: -24px;
bottom: 9px;
width: 16px;
height: 16px;
margin-left: 8px;
background-image: url("../imgs/ic_tips.png");
background-size: contain;
} }
\ No newline at end of file
src/bg-ui/bg-code-editor.vue
View file @ b02fb229
...@@ -3,14 +3,14 @@ ...@@ -3,14 +3,14 @@
v-model:value="states.content" v-model:value="states.content"
class="vue-ace-editor" class="vue-ace-editor"
:class="{ 'vue-ace-editor-disable': props.disabled }" :class="{ 'vue-ace-editor-disable': props.disabled }"
@input="codeChange"
:lang="props.lang" :lang="props.lang"
:theme="props.theme" :theme="props.theme"
:options="{ :options="{
useWorker: true, useWorker: true,
readOnly: props.disabled, readOnly: props.disabled,
wrap: true, wrap: true,
}" /> }"
@input="codeChange" />
</template> </template>
<script setup> <script setup>
import { reactive, toRefs, watch, onMounted } from "vue"; import { reactive, toRefs, watch, onMounted } from "vue";
...@@ -85,6 +85,7 @@ const codeChange = () => { ...@@ -85,6 +85,7 @@ const codeChange = () => {
onMounted(() => { onMounted(() => {
let obj = ""; let obj = "";
// console.log(typeof JSON.parse(this.datas));
try { try {
if (typeof JSON.parse(props.modelValue) == "object") { if (typeof JSON.parse(props.modelValue) == "object") {
obj = JSON.stringify(JSON.parse(props.modelValue), null, "\t"); obj = JSON.stringify(JSON.parse(props.modelValue), null, "\t");
...@@ -128,9 +129,10 @@ const { content } = toRefs(states); ...@@ -128,9 +129,10 @@ const { content } = toRefs(states);
width: 0; width: 0;
} }
.vue-ace-editor :deep() .ace_scroller { .vue-ace-editor :deep() .ace_scroller {
background-color: #1a1a1a; background-color: #fff;
color: #fff; color: #495266;
caret-color: #fff; caret-color: #fff;
right: 0 !important;
} }
/* 光标颜色 */ /* 光标颜色 */
.vue-ace-editor :deep() .ace_cursor { .vue-ace-editor :deep() .ace_cursor {
...@@ -138,6 +140,20 @@ const { content } = toRefs(states); ...@@ -138,6 +140,20 @@ const { content } = toRefs(states);
} }
.vue-ace-editor-disable :deep() .ace_scrollbar-v { .vue-ace-editor-disable :deep() .ace_scrollbar-v {
width: 6px !important; width: 6px !important;
right: 2px;
}
.vue-ace-editor-disable :deep().ace_scrollbar::-webkit-scrollbar {
height: 6px;
width: 6px;
}
.vue-ace-editor-disable :deep().ace_scrollbar::-webkit-scrollbar-track {
background-color: #f7f7f9; /* Matches ace monokai */
border-radius: 3px;
}
.vue-ace-editor-disable :deep().ace_scrollbar::-webkit-scrollbar-thumb {
background-color: #c1c7d7;
border-radius: 3px;
} }
.vue-ace-editor-disable :deep() .ace_gutter { .vue-ace-editor-disable :deep() .ace_gutter {
background-color: #202531; background-color: #202531;
......
src/bg-ui/bg-form-gap.vue
View file @ b02fb229
...@@ -34,10 +34,10 @@ const props = defineProps({ ...@@ -34,10 +34,10 @@ const props = defineProps({
background-color: #3759be; background-color: #3759be;
border-radius: 2px; border-radius: 2px;
} }
/* .gap-title::after { .gap-title::after {
content: ""; content: "";
display: inline-block; display: inline-block;
flex: 1; flex: 1;
border-top: 1px dashed #dadee7; border-top: 1px dashed #dadee7;
} */ }
</style> </style>
src/page/main/auto-maintenance/task-manage/add/base-info.vue 0 → 100644
View file @ b02fb229
<template>
<div>
<el-form ref="ruleFormRef" :model="state.ruleForm" :rules="state.rules" label-position="top" label-width="120px">
<el-form-item label="任务名称" prop="name">
<el-input v-model="state.ruleForm.name" maxlength="20" placeholder="请输入任务名称" show-word-limit />
</el-form-item>
<el-form-item label="任务描述" prop="desc">
<el-input
v-model="state.ruleForm.desc"
type="textarea"
maxlength="200"
placeholder="请输入任务描述"
:autosize="{
minRows: 4,
}"
show-word-limit />
</el-form-item>
</el-form>
</div>
</template>
<script setup>
import { reactive, ref, onBeforeMount, toRefs } from "vue";
import { useRouter, useRoute } from "vue-router";
import { ElMessage } from "element-plus";
const router = useRouter();
const route = useRoute();
const props = defineProps({
data: {
type: Object,
default: () => {},
},
});
const state = reactive({
ruleForm: {
name: props.data?.name,
desc: props.data?.desc,
},
rules: {
name: [
{ required: true, message: "请输入任务名称", trigger: "blur" },
{ max: 20, message: "最大长度20", trigger: "blur" },
],
desc: [{ max: 200, message: "最大长度200", trigger: "blur" }],
},
});
const save = () => {};
defineExpose({
save,
});
</script>
<style scoped></style>
src/page/main/auto-maintenance/task-manage/add/finish.vue 0 → 100644
View file @ b02fb229
<template>
<div class="step-container">
<div class="step-base">
<img src="@/assets/imgs/img_data-complete.png" />
<p class="tips">新增成功</p>
<div class="apaas_button btns">
<el-button type="default" @click="goStepOne"> 返回列表 </el-button>
<el-button type="primary" @click="putawayAction"> 继续新增 </el-button>
</div>
</div>
</div>
</template>
<script setup>
import { reactive, ref, onBeforeMount, toRefs } from "vue";
import { useRouter, useRoute } from "vue-router";
import { ElMessage } from "element-plus";
const router = useRouter();
const route = useRoute();
const state = reactive({ data: 1 });
const { data } = toRefs(state);
</script>
<style scoped>
.step-container {
position: relative;
height: 100%;
}
.step-base {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 300px;
}
.tips {
margin: 60px 0;
text-align: center;
font-size: 18px;
color: #202531;
font-weight: 600;
}
.btns {
width: 208px;
margin: 0 auto;
display: flex;
justify-content: space-around;
}
</style>
src/page/main/auto-maintenance/task-manage/add/index.vue 0 → 100644
View file @ b02fb229
<template>
<div class="detail_container">
<bg-breadcrumb></bg-breadcrumb>
<div class="main_container">
<div class="content_process">
<div>
<el-steps :active="step">
<el-step title="" :class="{ process_complete: step > 1 }">
<template #icon>
<span class="process_desc">
<span class="icon_box" v-if="step > 0"
><bg-icon class="step_icon" icon="#bg-ic-file-editing"></bg-icon
></span>
<span class="circle" v-else></span>
基本信息
</span>
</template>
</el-step>
<el-step title="" :class="{ process_complete: step > 2 }">
<template #icon>
<span class="process_desc">
<span class="icon_box" v-if="step > 1"
><bg-icon class="step_icon" icon="#bg-ic-file-lock"></bg-icon
></span>
<span class="circle" v-else></span>
执行内容
</span>
</template>
</el-step>
<el-step title="">
<template #icon>
<span class="process_desc">
<span class="icon_box" v-if="step > 2"
><bg-icon class="step_icon" icon="#bg-ic-file-success"></bg-icon
></span>
<span class="circle" v-else></span>
完成
</span>
</template>
</el-step>
</el-steps>
</div>
</div>
<div class="content_main log_content_nor" :style="step == 3 ? { height: 'calc(100vh - 234px)' } : {}">
<base-info v-show="step == 1"></base-info>
<use-content v-show="step == 2"></use-content>
<finish v-show="step == 3"></finish>
</div>
<div class="content_foot apaas_button" v-if="step == 1 || step == 2">
<el-button type="default" @click="cancel"> 取消 </el-button>
<el-button type="default" v-if="step == 2" @click="confirm(-1)"> 上一步 </el-button>
<el-button type="primary" v-if="step == 1" @click="confirm(1)"> 下一步 </el-button>
<el-button type="primary" v-if="step == 2" @click="confirm(1)"> 保存 </el-button>
<el-button type="success" v-if="step == 2" @click="useScript"> 立即执行 </el-button>
</div>
</div>
</div>
</template>
<script setup>
import { reactive, ref, onBeforeMount, toRefs } from "vue";
import { useRouter, useRoute } from "vue-router";
import { ElMessage } from "element-plus";
import axios from "@/request/http.js";
import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
import baseInfo from "./base-info.vue";
import useContent from "./use-content.vue";
import finish from "./finish.vue";
const router = useRouter();
const route = useRoute();
const step = ref(1);
const state = reactive({ data: 1 });
const cancel = () => {
router.back();
};
const confirm = (val) => {
step.value = step.value + val;
};
const useScript = () => {};
</script>
<style scoped>
.content_process {
border-bottom: 1px solid #e6e9ef;
padding: 38px 16%;
}
.content_main {
height: calc(100vh - 287px);
padding: 30px;
overflow-x: hidden;
overflow-y: scroll;
box-sizing: border-box;
}
.content_foot {
border-top: 1px solid #e6e9ef;
padding: 16px 16px 0 16px;
display: flex;
justify-content: flex-end;
}
.process_desc {
background-color: #fff;
display: inline-block;
position: absolute;
padding: 0 5px;
font-size: 18px;
color: #202531;
font-weight: bold;
}
.process_desc img {
height: 25px;
width: 25px;
vertical-align: middle;
}
.process_end {
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.process_end div {
text-align: center;
}
.step_icon {
color: #fff;
font-weight: 600;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.icon_box {
display: inline-block;
background-color: #2b4695;
width: 48px;
height: 48px;
border-radius: 99px;
position: relative;
border: 3px solid #b0bee8;
vertical-align: middle;
}
.circle {
display: inline-block;
background-color: #a9b1c7;
width: 24px;
height: 24px;
border-radius: 50%;
position: relative;
border: 6px solid #e6e9ef;
vertical-align: middle;
}
.content_process :deep(.el-step.is-horizontal .el-step__line) {
height: 4px;
}
.content_process :deep(.el-step__head.is-finish .el-step__line) {
background: linear-gradient(to right, #2b4695 50%, #e6e9ef 50%);
}
.process_complete :deep(.el-step__head.is-finish .el-step__line) {
background: linear-gradient(to right, #2b4695 100%, #e6e9ef 0%);
}
</style>
src/page/main/auto-maintenance/task-manage/add/use-content.vue 0 → 100644
View file @ b02fb229
<template>
<div>
<bg-form-gap title="执行脚本"></bg-form-gap>
<bg-inner-tabs v-model="state.useType" :data="state.useData"></bg-inner-tabs>
<div style="height: 493px; margin-bottom: 23px" v-show="state.useType == 0">
<bg-code-editor v-model="state.useText"></bg-code-editor>
</div>
<div v-show="state.useType == 1" class="file-box">
<p>上传文件</p>
<bg-upload v-model="state.doc_file" custom-tips :file-types="['yaml', 'yml']" :file-max-size="20" :limit="1">
<span>将文件拖到此处，或 点击上传</span><br />
<span>支持上传一个后缀为.yaml或.yml的文件</span><br />
<span>文件大小不超过20M</span>
</bg-upload>
</div>
<bg-form-gap title="执行主机"></bg-form-gap>
<el-form ref="ruleFormRef" :model="state.ruleForm" :rules="state.rules" label-position="top" label-width="120px">
<el-form-item label="主机分组名称" prop="name" style="width: 1100px">
<el-select v-model="state.ruleForm.name" style="width: 1020px" clearable placeholder="请选择">
<el-option v-for="item in state.options" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<span class="add-pc can_click_text">去创建</span>
</el-form-item>
</el-form>
</div>
</template>
<script setup>
import { reactive, ref, onBeforeMount, toRefs } from "vue";
import { useRouter, useRoute } from "vue-router";
import { ElMessage } from "element-plus";
const router = useRouter();
const route = useRoute();
const state = reactive({
useType: 0,
useData: ["文本执行", "文件执行"],
useText: "",
doc_file: [],
ruleForm: {
name: "",
},
rules: {
name: [{ required: true, message: "请选择主机分组", trigger: "change" }],
},
options: [
{
label: "12",
value: "qwqw",
},
],
});
</script>
<style lang="scss" scoped>
.add-pc {
font-size: 14px;
margin-left: 10px;
}
.file-box {
margin-top: 20px;
margin-bottom: 20px;
p {
color: #202531;
font-size: 14px;
margin-bottom: 10px;
}
}
</style>
src/page/main/auto-maintenance/task-manage/index.vue
View file @ b02fb229
...@@ -153,6 +153,10 @@ import { ElMessage } from "element-plus"; ...@@ -153,6 +153,10 @@ import { ElMessage } from "element-plus";
import axios from "@/request/http.js"; import axios from "@/request/http.js";
import { Search } from "@element-plus/icons-vue"; import { Search } from "@element-plus/icons-vue";
import bgBreadcrumb from "@/components/bg-breadcrumb.vue"; import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
import { useRouter, useRoute } from "vue-router";
const router = useRouter();
const route = useRoute();
const bgForm = ref(null); const bgForm = ref(null);
const dataTable = ref(null); const dataTable = ref(null);
const headers = [ const headers = [
...@@ -343,24 +347,8 @@ const changeSize = (size) => { ...@@ -343,24 +347,8 @@ const changeSize = (size) => {
}; // 改变每页条数 }; // 改变每页条数
const register = () => { const register = () => {
state.formData = { router.push(`/auto-maintenance/task-manage/add`);
name: "", };
describe: "",
state: 1,
p_dict_id: state.fatherRow ? state.fatherRow.dict_id : "",
};
if (state.bgForm) {
nextTick().then(() => {
state.bgForm.validate((valid) => {
if (!valid) {
state.bgForm.clearValidate();
}
});
});
}
state.addType = 1;
state.addDialog = true;
}; // 新增字典按钮
onBeforeMount(() => { onBeforeMount(() => {
getTypeList(); getTypeList();
......
src/page/main/forewarning/list/index.vue
View file @ b02fb229
...@@ -123,75 +123,59 @@ ...@@ -123,75 +123,59 @@
</div> </div>
</div> </div>
<!-- todo: 推送提醒 --> <!-- todo: 推送提醒 -->
<!-- <el-dialog <el-dialog title="推送提醒" v-model="pushDialog" width="780px" :before-close="cancelPushDialog">
class="dialog_box" <div class="warning_info">
:title="addType == 1 ? '新增' : '编辑'" <bg-icon
v-model="addDialog" style="font-size: 12px; color: #a9b1c7; margin-right: 8px; vertical-align: middle"
width="758px"> icon="#bg-ic-s-circle-tips"></bg-icon
<el-form ref="bgForm" :model="formData" :rules="rules" label-width="80px" class="bg_form"> >该推送为临时推送，可调整推送人员，仅本次有效！如固定通知人员，则前往【预警规则设置】调整预警内容
<el-form-item label="名称" prop="name"> </div>
<el-input <el-form ref="pushForm" :model="pushFormData" :rules="pushRules" label-width="120px" class="bg_form">
v-model.trim="formData.name" <el-form-item label="预警工单推送" prop="method" style="margin-bottom: 24px">
show-word-limit <el-checkbox-group v-model="pushFormData.method">
:maxlength=" <el-checkbox :label="1">钉钉</el-checkbox>
nodeClassifyId == 'eb9c7d70-c123-42b7-8e61-dde1b022b669' <el-checkbox :label="2">短信</el-checkbox>
? 6 </el-checkbox-group>
: nodeClassifyId == 'efd9ec3b-7f18-49e2-9d88-bcca022243bb'
? 4
: nodeClassifyId == '949a1138-4995-464e-97a9-424d097eb271'
? 2
: 20
"
placeholder="请输入名称"></el-input>
</el-form-item>
<el-form-item label="描述" prop="describe">
<el-input
v-model="formData.describe"
type="textarea"
:autosize="{ minRows: 5 }"
show-word-limit
maxlength="200"
resize="vertical"
placeholder="请输入描述"></el-input>
</el-form-item>
<el-form-item label="是否启用" prop="state" style="margin-bottom: 0px">
<el-switch
class="bg-switch-ele"
v-model="formData.state"
:active-value="1"
:inactive-value="0"
inline-prompt
active-text="是"
inactive-text="否" />
</el-form-item> </el-form-item>
</el-form> </el-form>
<user-input-table v-if="userTableFlag" ref="userTable" :data="userData" @change="changeData" />
<template v-slot:footer> <template v-slot:footer>
<div class="apaas_button"> <div class="apaas_button">
<el-button type="default" @click="addDialog = false">取 消</el-button> <el-button type="default" @click="cancelPushDialog">取消</el-button>
<el-button type="primary" @click="addConfirm">保 存</el-button> <el-button type="primary" @click="pushConfirm">确定</el-button>
</div> </div>
</template> </template>
</el-dialog> --> </el-dialog>
<!-- todo：关闭提醒 --> <!-- 关闭提醒 -->
<!-- <el-dialog <el-dialog
class="dialog_box" class="dialog_box"
title="提示" title="关闭预警"
v-model="dialogDelete" v-model="closeWarningDialog"
width="400px" width="400px"
:before-close=" :before-close="cancelCloseWarningDialog">
() => { <el-form ref="closeForm" :model="closeFormData" :rules="closeRules" label-width="80px" class="bg_form">
dialogDelete = false; <el-form-item label="关闭备注" prop="close_notes">
} <el-input
"> v-model="closeFormData.close_notes"
<div>确定要删除此字典值吗？</div> type="textarea"
:autosize="{ minRows: 2 }"
show-word-limit
maxlength="30"
resize="vertical"
placeholder="请输入内容"></el-input>
</el-form-item>
<el-form-item label="" prop="close_remind" style="margin-bottom: 0px">
<el-checkbox v-model="closeFormData.close_remind" label="三天内将不再推送该预警信息" />
</el-form-item>
</el-form>
<template v-slot:footer> <template v-slot:footer>
<div class="apaas_button"> <div class="apaas_button">
<el-button type="default" @click="dialogDelete = false">取 消</el-button> <el-button type="default" @click="cancelCloseWarningDialog">取消</el-button>
<el-button type="primary" @click="deleteData">确 定</el-button> <el-button type="primary" @click="confirmClose">确定</el-button>
</div> </div>
</template> </template>
</el-dialog> --> </el-dialog>
</div> </div>
</template> </template>
...@@ -201,11 +185,14 @@ import { ElMessage } from "element-plus"; ...@@ -201,11 +185,14 @@ import { ElMessage } from "element-plus";
import axios from "@/request/http.js"; import axios from "@/request/http.js";
import { Search } from "@element-plus/icons-vue"; import { Search } from "@element-plus/icons-vue";
import bgBreadcrumb from "@/components/bg-breadcrumb.vue"; import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
import userInputTable from "./user-input-table.vue";
const bgForm = ref(null); const bgForm = ref(null);
const dataTable = ref(null); const dataTable = ref(null);
const closeForm = ref(null);
const userTable = ref(null);
const pushForm = ref(null);
const state = reactive({ const state = reactive({
bgForm,
warningTypes: [ warningTypes: [
{ {
name: "全部", name: "全部",
...@@ -338,25 +325,28 @@ const state = reactive({ ...@@ -338,25 +325,28 @@ const state = reactive({
limit: 10, limit: 10,
}, // 表格筛选项 }, // 表格筛选项
actionRow: null, // 当前操作的数据 actionRow: null, // 当前操作的数据
dialogDelete: false, // 删除弹窗 closeWarningDialog: false, // 删除弹窗
addType: 0, // closeFormData: {
addDialog: false, close_notes: "",
formData: { close_remind: false,
name: "", },
describe: "", closeRules: {
state: 1, close_notes: [{ required: true, message: "请输入关闭备注", trigger: "blur" }],
p_dict_id: "", },
pushDialog: false,
userData: [],
pushFormData: {
method: [],
}, },
rules: { pushRules: {
name: [{ required: true, message: "请输入名称", trigger: "blur" }], method: [{ type: "array", required: true, message: "请最少选择一种推送方式", trigger: "change" }],
describe: [
{ required: true, message: "请输入描述", trigger: "blur" },
{ max: 200, message: "描述最大为200字", trigger: "blur" },
],
state: [{ required: true, message: "请选择是否启用", trigger: "change" }],
}, },
}); });
const userTableFlag = computed(() => {
return !!state.pushDialog;
});
const selectRows = (data) => { const selectRows = (data) => {
state.selected = data.selection; state.selected = data.selection;
}; };
...@@ -424,7 +414,7 @@ const getTableRows = () => { ...@@ -424,7 +414,7 @@ const getTableRows = () => {
notice_people_num: 2, notice_people_num: 2,
push_times: 2, push_times: 2,
last_push_time: "2020-01-01 00:00:00", last_push_time: "2020-01-01 00:00:00",
state: 1, state: 0,
}, },
{ {
id: 2, id: 2,
...@@ -474,19 +464,87 @@ const batchPush = () => { ...@@ -474,19 +464,87 @@ const batchPush = () => {
const pushWarning = (row) => { const pushWarning = (row) => {
state.actionRow = row; state.actionRow = row;
console.log("推送提醒"); console.log("推送提醒");
state.userData = [
{
account: 1,
name: "张一",
mobile: "13111111111",
},
{
account: 2,
name: "张二二",
mobile: "13222222222",
},
{
account: 4,
name: "张四三",
mobile: "13443434344",
},
];
state.pushDialog = true;
}; // 推送提醒 }; // 推送提醒
const changeData = (data) => {
state.userData = data.data;
};
const cancelPushDialog = () => {
pushForm.value.resetFields();
state.pushDialog = false;
}; // 预警推送弹窗取消按钮：重置表单
const pushConfirm = () => {
pushForm.value.validate((valid) => {
if (valid) {
console.log(state.actionRow.id, state.userData);
console.log(state.pushFormData);
cancelPushDialog();
}
});
};
const closeWarning = (row) => { const closeWarning = (row) => {
state.actionRow = row; state.actionRow = row;
state.closeWarningDialog = true;
console.log("关闭预警"); console.log("关闭预警");
}; // 关闭预警 }; // 关闭预警
const cancelCloseWarningDialog = () => {
closeForm.value.resetFields();
state.closeWarningDialog = false;
}; // 关闭预警弹窗取消按钮：重置表单
const confirmClose = () => {
closeForm.value.validate((valid) => {
if (valid) {
console.log(state.actionRow.id);
console.log(state.closeFormData);
cancelCloseWarningDialog();
}
});
}; // 关闭预警弹窗确定按钮：提交表单
onBeforeMount(() => { onBeforeMount(() => {
getTableRows(); getTableRows();
}); });
const { headers, tableRows, tableTotal, filter, warningTypes, warningTargets, riskLevels, stateOptions } = const {
toRefs(state); headers,
tableRows,
tableTotal,
filter,
warningTypes,
warningTargets,
riskLevels,
stateOptions,
closeWarningDialog,
closeFormData,
closeRules,
pushDialog,
userData,
pushFormData,
pushRules,
} = toRefs(state);
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
...@@ -548,7 +606,7 @@ const { headers, tableRows, tableTotal, filter, warningTypes, warningTargets, ri ...@@ -548,7 +606,7 @@ const { headers, tableRows, tableTotal, filter, warningTypes, warningTargets, ri
width: 100%; width: 100%;
box-sizing: border-box; box-sizing: border-box;
.el-form-item { .el-form-item {
margin-bottom: 24px; margin-bottom: 16px;
:deep().el-form-item__label { :deep().el-form-item__label {
line-height: 36px; line-height: 36px;
height: 36px; height: 36px;
...@@ -557,26 +615,19 @@ const { headers, tableRows, tableTotal, filter, warningTypes, warningTargets, ri ...@@ -557,26 +615,19 @@ const { headers, tableRows, tableTotal, filter, warningTypes, warningTargets, ri
width: 100%; width: 100%;
.el-textarea { .el-textarea {
:deep().el-input__count { :deep().el-input__count {
bottom: -16px; bottom: 6px;
right: 4px; right: 4px;
font-family: Roboto-Regular; font-family: Roboto-Regular;
color: #a9b1c7; color: #a9b1c7;
} }
} }
.bg-switch-ele {
width: 52px;
height: 24px;
:deep().el-switch__core {
width: 100%;
height: 24px;
.el-switch__inner,
.el-switch__action {
top: 3px;
}
}
}
} }
} }
} }
:deep().dialog_box {
.el-dialog__body {
padding-bottom: 0;
}
}
} }
</style> </style>
src/page/main/forewarning/list/user-input-table.vue 0 → 100644
View file @ b02fb229
<template>
<el-form ref="ruleFormRef" class="ruleForm" :model="tableRows" :size="formSize" :rules="formRules">
<bg-table-pro showIndex :headers="headers" :data="tableRows" ref="input-table" :border="true" :stripe="false">
<template v-slot:account="{ row, index }">
<el-form-item :prop="`[${index}].account`" :rules="formRules.account" style="width: 100%">
<el-select
v-model="row.account"
placeholder="请选择帐号"
style="width: 100%"
@change="changeAccount(row)"
:disabled="disabled">
<el-option
v-for="(item, index) in userLists"
:key="'userItem' + index"
:disabled="item.disabled"
:label="item.account"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
</template>
<template v-slot:name="{ row, index }">
<el-form-item :prop="`[${index}].name`" :rules="formRules.name" style="width: 100%">
<el-input @change="changeName" placeholder="请输入姓名" :disabled="disabled" v-model.trim="row.name" />
</el-form-item>
</template>
<template v-slot:mobile="{ row, index }">
<el-form-item :prop="`[${index}].mobile`" :rules="formRules.mobile" style="width: 100%">
<el-input
@change="changeMobile"
placeholder="请输入联系方式"
:disabled="disabled"
v-model.trim="row.mobile" />
</el-form-item>
</template>
<template v-slot:action="{ row, index }">
<bg-table-btn
:disabled="disabled || !canAdd"
:click="
() => {
addParam(index);
}
"
>增加</bg-table-btn
>
<bg-table-btn
:disabled="disabled"
:click="
() => {
removeParam(row, index);
}
">
删除
</bg-table-btn>
</template>
</bg-table-pro>
</el-form>
</template>
<script setup>
import { reactive, toRefs, onBeforeMount, onMounted, ref, getCurrentInstance, watch, computed } from "vue";
import { v4 as uuidv4 } from "uuid";
import { validatePhone } from "@/services/rules.js";
const props = defineProps({
data: {
type: Array,
default: () => [],
},
disabled: {
type: Boolean,
default: false,
},
});
const emit = defineEmits(["change"]);
const formSize = ref("default");
const ruleFormRef = ref(null);
const formRules = reactive({
name: [
{
required: true,
message: "请输入键",
trigger: "blur",
},
{
max: 50,
message: "最多50个字符",
trigger: "blur",
},
],
account: [
{
required: true,
message: "请选择帐号",
trigger: "change",
},
],
mobile: [
{
required: true,
message: "请输入联系方式",
trigger: "blur",
},
{ validator: validatePhone, trigger: "blur" },
],
});
const headers = reactive([
{
label: "帐号",
prop: "account",
required: true,
},
{
label: "姓名",
prop: "name",
required: true,
},
{
label: "联系方式",
prop: "mobile",
required: true,
},
{
label: "操作",
prop: "action",
width: 120,
},
]);
const state = reactive({
tableRows: [],
userLists: [
{
account: "admin",
id: 1,
name: "张一",
mobile: "13111111111",
},
{
account: "ys-admin",
id: 2,
name: "张二",
mobile: "13222222222",
},
{
account: "yf-user",
id: 3,
name: "张三",
mobile: "13333333333",
},
{
account: "putong",
id: 4,
name: "张四",
mobile: "13444444444",
},
],
});
watch(
() => state.tableRows,
(n, o) => {
let list = state.tableRows.map((e) => {
return e.account;
});
state.userLists.forEach((e) => {
if (list.indexOf(e.id) > -1) {
e.disabled = true;
} else {
e.disabled = false;
}
});
},
{
deep: true,
}
);
const canAdd = computed(() => {
return state.tableRows.length >= 5 ? false : true;
}); // 最多五条数据，控制下新增按钮的禁用
onBeforeMount(() => {
initTable();
});
var initTable = () => {
if (props.data && props.data.length >= 1) {
state.tableRows = props.data;
} else {
state.tableRows = [];
addParam(0);
}
};
var createRow = () => {
return {
id: uuidv4(),
account: "",
name: "",
mobile: "",
};
};
var addParam = (index) => {
state.tableRows.splice(index + 1, 0, createRow());
};
var removeParam = (row, index) => {
state.tableRows.splice(index, 1);
if (state.tableRows.length === 0) {
addParam(0);
}
};
const changeAccount = (row) => {
state.userLists.forEach((e) => {
if (e.id == row.account) {
row.name = e.name;
row.mobile = e.mobile;
}
});
emit("change", {
type: "account",
data: state.tableRows,
});
};
const changeName = () => {
emit("change", {
type: "name",
data: state.tableRows,
});
};
const changeMobile = () => {
emit("change", {
type: "mobile",
data: state.tableRows,
});
};
var getInputData = () => {
let lastData = [];
let tempObj = {};
state.tableRows.forEach((e) => {
tempObj[e.name] = e;
});
for (const key in tempObj) {
if (key && tempObj[key].value) {
lastData.push(tempObj[key]);
}
}
return lastData;
};
const { tableRows, userLists } = toRefs(state);
//暴露获取数据方法
defineExpose({
getInputData,
initTable,
});
</script>
<style scoped></style>
src/router/index.js
View file @ b02fb229
...@@ -3,98 +3,84 @@ ...@@ -3,98 +3,84 @@
import { createRouter, createWebHashHistory } from "vue-router"; import { createRouter, createWebHashHistory } from "vue-router";
import store from "../store"; import store from "../store";
//写入初始必须有的路由 //写入初始必须有的路由
//或者隐藏式路由，不会表现在菜单上，但是需要存在的路由 //或者隐藏式路由，不会表现在菜单上，但是需要存在的路由
const routes = [{ const routes = [
path: "/login", {
name: "login", path: "/login",
show: true, name: "login",
component: () => show: true,
import ("../page/login/index.vue"), component: () => import("../page/login/index.vue"),
}, },
{ {
path: "/register", path: "/register",
name: "register", name: "register",
show: true, show: true,
component: () => component: () => import("../page/register/index.vue"),
import ("../page/register/index.vue"), },
}, {
{ path: "/",
path: "/password", name: "index",
name: "password", component: () => import("../page/welcom.vue"),
show: true, },
component: () => {
import ("../page/password/index.vue"), path: "/404",
}, show: true,
{ component: () => import("../page/404.vue"),
path: "/", },
name: "index",
component: () =>
import ("../page/welcom.vue"),
},
{
path: "/404",
show: true,
component: () =>
import ("../page/404.vue"),
},
]; ];
//重新创建router //重新创建router
function newRouterFunc() { function newRouterFunc() {
return createRouter({ return createRouter({
history: createWebHashHistory(), history: createWebHashHistory(),
routes, routes,
}); });
} }
const router = newRouterFunc(); const router = newRouterFunc();
function inWhiteList(toPath) { function inWhiteList(toPath) {
//配置白名单 //配置白名单
const whiteList = ['/login'] const whiteList = ["/login"];
const path = whiteList.find((value) => { const path = whiteList.find((value) => {
// 使用正则匹配 // 使用正则匹配
const reg = new RegExp('^' + value) const reg = new RegExp("^" + value);
return reg.test(toPath) return reg.test(toPath);
}) });
return !!path return !!path;
} }
router.beforeEach((to, from, next) => { router.beforeEach((to, from, next) => {
const userInfo = store.state.userInfo;
const userInfo = store.state.userInfo
//已登录不可跳转登陆页
//已登录不可跳转登陆页 if (userInfo && to.path == "/login") {
if (userInfo && to.path == '/login') { next({ path: from.path });
next({ path: from.path }) }
}
// 检查to.path是否存在于免登陆白名单
// 检查to.path是否存在于免登陆白名单 if (inWhiteList(to.path)) {
if (inWhiteList(to.path)) { next();
next() } else {
} else { // 判断是否已经登录，未登录则重定向到首页或其他页面（通过query传参记录原来的路径）
// 判断是否已经登录，未登录则重定向到首页或其他页面（通过query传参记录原来的路径） // 根据配置判断是否跳转第三方登录，跳转第三方登录则不跳login
// 根据配置判断是否跳转第三方登录，跳转第三方登录则不跳login // axios封装中也需要对是否登录过期进行判断，如果登录过期，则跳转登录页，具体跳转地址根据配置来·
// axios封装中也需要对是否登录过期进行判断，如果登录过期，则跳转登录页，具体跳转地址根据配置来· // if (!userInfo) {
// if (!userInfo) { // next({
// next({ // path: '/login',
// path: '/login', // })
// }) // } else {
// } else { // }
}
// }
} //判读是否匹配，否则跳转404
if (to.matched.length !== 0) {
//判读是否匹配，否则跳转404 next();
if (to.matched.length !== 0) { } else {
next() return next({ path: "/404" });
} else { }
return next({ path: '/404' }) });
}
})
// 在路由完成初始导航时调用，如果有异步操作放置到这里 // 在路由完成初始导航时调用，如果有异步操作放置到这里
// 请求相应的角色和菜单 // 请求相应的角色和菜单
...@@ -102,38 +88,33 @@ router.beforeEach((to, from, next) => { ...@@ -102,38 +88,33 @@ router.beforeEach((to, from, next) => {
// generateRoutes() // generateRoutes()
// }) // })
function addRoute(router, routers) { function addRoute(router, routers) {
routers.forEach(e => { routers.forEach((e) => {
router.addRoute(e) router.addRoute(e);
if (e.children && e.children.length) { if (e.children && e.children.length) {
addRoute(router, e.children) addRoute(router, e.children);
} }
}); });
} }
export function generateRoutes() { export function generateRoutes() {
const _asyncRoutes = store.state.route const _asyncRoutes = store.state.route;
if (_asyncRoutes) {
//动态添加路由
addRoute(router, _asyncRoutes)
}
router.addRoute({ if (_asyncRoutes) {
path: '/:pathMatch(.*)', //动态添加路由
redirect: '/404'
})
addRoute(router, _asyncRoutes);
}
router.addRoute({
path: "/:pathMatch(.*)",
redirect: "/404",
});
} }
//新创建一个router替代之前的router，并把matcher方法替换成新的router的matcher //新创建一个router替代之前的router，并把matcher方法替换成新的router的matcher
export function resetRouter() { export function resetRouter() {
const newRouter = newRouterFunc() const newRouter = newRouterFunc();
router.matcher = newRouter.matcher router.matcher = newRouter.matcher;
} }
export default router;
export default router
\ No newline at end of file
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