gfwleak/cyber-narrator-cn-ui
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

CN-1594 feat: right-box调整

Browse Source
This commit is contained in:
chenjinsong
2024-04-10 16:50:39 +08:00
parent 70edbb95fc
commit 5f1efe4466
19 changed files with 117 additions and 419 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/assets/css/common.scss
View File

@@ -40,10 +40,6 @@ body {
.fade-leave-to {
opacity: 0;
}
/* 调整表单错误提示上边距 */
.el-form-item__error {
padding-top: 0 !important;
}
/* 请求报错样式关于popover的修改 */
.error-popover {

145
src/assets/css/common/right-box-common.scss
View File

@@ -1,5 +1,3 @@
$border-color-light: var(--el-border-color-light);
$color-primary: var(--el-color-business);
$border-radius-small: 2px;
.common-right-box {
@@ -29,7 +27,7 @@ $border-radius-small: 2px;
align-items: center;
height: 60px;
padding: 0 20px;
border-bottom: 1px solid $border-color-light;
border-bottom: 1px solid var(--el-border-color-light);
.header__title {
font-size: 16px;
@@ -51,62 +49,6 @@ $border-radius-small: 2px;
overflow-x: hidden;
overflow-y: auto;
.el-textarea__inner {
padding: 5px 70px 4px 15px;
}
.container__form-width.container__form {
.input-box {
.el-textarea {
.el-textarea__inner {
width: 530px;
height: 32px;
padding: 5px 70px 4px 10px;
}
.el-input__count {
right: -40px;
line-height: 29px;
height: 25px;
}
}
}
}
.el-form-item__content {
.input-box {
.el-textarea {
.el-textarea__inner {
width: 517px;
height: 32px;
padding: 5px 70px 4px 10px;
}
.el-input__count {
right: -40px;
line-height: 29px;
height: 25px;
}
}
}
}
.form-row-item {
.input-box {
.el-textarea {
.el-textarea__inner {
width: 466px;
height: 32px;
padding: 5px 70px 4px 10px;
}
.el-input__count {
right: 0;
}
}
}
}
.el-form-item {
.el-input__count {
line-height: 29px;
@@ -114,25 +56,12 @@ $border-radius-small: 2px;
}
}
.el-form-item {
.el-input--small.not-fixed-height {
height: 32px;
.el-input__count {
line-height: 29px;
height: 25px;
}
}
}
.el-input__inner, .el-textarea__inner {
padding: 0 10px;
border-radius: $border-radius-small;
border: 1px solid $border-color-light;
}
.el-textarea__inner {
padding: 5px 70px 4px 15px;
padding-right: 70px;
}
.el-form {
@@ -148,14 +77,6 @@ $border-radius-small: 2px;
color: var(--el-text-color-regular);
}
.el-input__inner:hover {
border-color: darken(#e4e7ed, 10%); // 使用$border-color-light会提示识别不到颜色
}
.el-input__inner:focus {
border-color: darken(#e4e7ed, 20%);
}
.el-form-item__label {
padding-bottom: 2px;
}
@@ -198,18 +119,6 @@ $border-radius-small: 2px;
}
}
/*.form__create-btn {
margin-bottom: 20px;
width: 300px;
height: 28px;
border: 1px solid lighten($color-primary, 60%);
border-radius: $border-radius-small;
background-color: lighten($color-primary, 95%);
i {
color: $color-primary;
}
}*/
.form__flex-container {
display: flex;
justify-content: center;
@@ -251,33 +160,36 @@ $border-radius-small: 2px;
min-width: 74px;
padding: 0 15px;
color: var(--el-color-white);
//background-color: $--color-primary;
background-color: var(--el-color-business);
border: none;
border: 1px solid var(--el-color-business-dark-2);
border-radius: var(--el-border-radius-base);
outline: none;
font-size: 14px;
cursor: pointer;
transition: background-color linear var(--el-transition-duration-fast), color linear .1s;
transition: all linear .1s;
}
.footer__btn:hover:not(.footer__btn--disabled) {
background-color: lighten(#38ACD2, 10%);
background-color: var(--el-color-business-light-2);
}
.footer__btn:focus:not(.footer__btn--disabled) {
background-color: var(--el-color-business-dark-1);
}
.footer__btn--light {
.footer__btn.footer__btn--light {
background-color: var(--el-fill-color-blank);
border: 1px solid var(--el-color-info-light-7);
color: var(--el-text-color-primary);
}
.footer__btn.footer__btn--light:hover:not(.footer__btn--disabled) {
background-color: var(--el-fill-color-blank);
border-color: lighten(#38ACD2, 40%);
color: $color-primary;
background-color: var(--el-fill-color);
}
.footer__btn.footer__btn--light:focus:not(.footer__btn--disabled) {
background-color: var(--el-fill-color-darker);
}
.footer__btn--disabled {
.footer__btn.footer__btn--disabled {
opacity: .6;
cursor: default;
}
@@ -338,36 +250,7 @@ $border-radius-small: 2px;
justify-content: space-between;
}
.form-item--end-with-btn { // 末尾留出btn宽度空间的form item
}
.el-form-item__content .el-autocomplete .el-input-group {
vertical-align: unset;
}
.el-input__wrapper {
border-radius: $border-radius-small;
height: 32px !important;
line-height: 32px !important;
//box-shadow: 0 0 0 1px var(--el-input-border-color,var(--el-border-color)) inset;
box-shadow: 0 0 0 1px var(--el-border-color-light) inset;
}
.el-input__inner, .el-textarea__inner {
border: none !important;
}
.el-select__wrapper {
height: 32px;
line-height: 32px;
}
.el-switch {
--el-switch-on-color: #699DC9;
}
.el-textarea__inner {
font-size: 12px;
}
}

11
src/assets/css/components/components/advancedSearch/advanced-search2.scss
View File

@@ -181,6 +181,7 @@ $color-primary: var(--el-color-primary);
color: var(--el-text-color-primary);
font-weight: bold;
cursor: text;
.el-select {
min-width: 210px !important;
min-height: 20px !important;
@@ -192,9 +193,6 @@ $color-primary: var(--el-color-primary);
margin-top: -4px;
cursor: pointer;
}
.el-select__wrapper.is-focused {
box-shadow: 0 0 0 1px var(--el-color-business) inset !important;
}
}
.condition__operator {
color: $color-primary;
@@ -229,10 +227,3 @@ $color-primary: var(--el-color-primary);
min-width: 120px !important;
padding: 8px 10px !important;
}
.el-input__wrapper.is-focus {
box-shadow: 0 0 0 1px var(--el-color-business) inset !important;
}
.el-select-dropdown__item.is-selected {
//color: #2c72c6 !important;
color: var(--el-color-primary-light-3) !important;
}

20
src/assets/css/components/components/layout/layout.scss
View File

@@ -1,8 +1,8 @@
.cn-container {
height: calc(100% - 100px);
//background-color: $--content-right-background-color;
background-color: var(--bg-color);
background-color: var(--el-fill-color-blank);
width: 100%;
&>div {
height: 100%;
}
@@ -17,7 +17,7 @@
.cn-header__banner {
display: flex;
height: 60px;
background-color: #233447;
background-color: #233447; // TODO 暂无变量
.banner__left {
display: flex;
@@ -34,13 +34,13 @@
border-radius: 4px;
margin-left: 14px;
margin-right: 10px;
color: #F7F7F7;
color: var(--el-fill-color-lighter);
cursor: pointer;
background-color: transparent;
transition: all linear var(--el-transition-duration);
&.shrink-button--collapse {
background-color: #334355;
background-color: var(--el-text-color-primary);
}
}
}
@@ -125,7 +125,7 @@
font-size: 14px;
font-weight: bolder;
color: var(--el-text-color-primary);
border-bottom: 1px dashed #D8D8D8;
border-bottom: 1px dashed var(--el-border-color);
}
.middle-menus__body {
display: flex;
@@ -158,16 +158,17 @@
display: flex;
.el-dropdown {
color: #fff;
color: var(--el-fill-color-blank);
height: 40px;
line-height: 60px;
text-align: center;
margin: 0 20px 0 10px;
}
.login-user {
color: #fff;
color: var(--el-color-white);
i {
color: #fff;
color: var(--el-color-white);
font-size: 12px;
}
}
@@ -256,6 +257,7 @@
.search-input{
width: 100%;
padding: 4px 4px 0 4px;
.el-input__inner{
border-radius: 2px;
font-size: 12px;

57
src/assets/css/components/components/rightBox/report/reportBox.scss
View File

@@ -1,6 +1,3 @@
$color-light: var(--el-border-color-light);
$color-primary1: #1890FF;
.right-box.right-box-report {
.right-box__container {
.container__form {
@@ -32,20 +29,20 @@ $color-primary1: #1890FF;
height: 32px;
width: 160px;
text-align: center;
border: 1px solid $color-light;
border: 1px solid var(--el-border-color-light);
border-right: none;
line-height: 32px;
color: var(--el-text-color-primary);
}
.enable-tabs:nth-of-type(4) {
border-right: 1px solid $color-light;
border-right: 1px solid var(--el-border-color-light);
}
.enable-tabs.active {
border: 1px solid $color-primary1;
border: 1px solid var(--el-color-primary);
border-radius: 2px;
color: $color-primary1;
color: var(--el-color-primary);
}
.enable-tabs.disable {
@@ -63,20 +60,20 @@ $color-primary1: #1890FF;
height: 32px;
width: 290px;
text-align: center;
border: 1px solid $color-light;
border: 1px solid var(--el-border-color-light);
border-right: none;
line-height: 32px;
color: var(--el-text-color-primary);
}
.enable-month-tabs:nth-of-type(2) {
border-right: 1px solid $color-light;
border-right: 1px solid var(--el-border-color-light);
}
.enable-month-tabs.active {
border: 1px solid $color-primary1;
border: 1px solid var(--el-color-primary);
border-radius: 2px;
color: $color-primary1;
color: var(--el-color-primary);
}
.enable-month-tabs.disable {
@@ -107,17 +104,13 @@ $color-primary1: #1890FF;
color: var(--el-text-color-regular);
}
.enable-month-all, .enable-month-data-tabs {
display: flex;
}
.enable-month-week {
.enable-tabs-weekly, .enable-month-all, .enable-month-data-tabs, .enable-month-week {
display: flex;
margin-top: 10px;
}
.el-input-single {
width: 140px;
height: 32px;
margin-top: 10px;
.el-input__inner {
@@ -134,24 +127,13 @@ $color-primary1: #1890FF;
}
.right-box__select-single {
height: 32px;
margin: 10px 0 0 10px;
}
.el-input__wrapper {
height: 32px !important;
padding: 1px 11px !important;
border-radius: 2px;
}
.el-input__inner {
padding: 0;
}
.el-form-item__content {
line-height: 40px !important;
}
.report__display {
width: 100%;
display: flex;
@@ -169,40 +151,23 @@ $color-primary1: #1890FF;
}
}
.report__margin-t {
margin-top: 0.3125rem;
}
.report__params-vertical {
vertical-align: unset;
}
}
.el-input__inner {
border: none;
}
.el-select--small .el-select__wrapper {
padding: 0 10px;
min-height: 32px !important;
line-height: 32px !important;
margin-top: -2px;
border-radius: 2px;
}
}
.right-box__select--param {
.el-select__prefix, .el-input__prefix {
left: 0;
background-color: var(--el-border-color-extra-light);
color: var(--el-color-info);
padding: 0 15px;
border: 1px solid var(--el-border-color);
border-radius: 2px 0 0 2px;
}
.el-select__wrapper {
padding-left: 0 !important;
padding-left: 1px !important;
}
}
}

1
src/assets/css/components/views/administration/License.scss
View File

@@ -63,7 +63,6 @@
.el-form-item__content {
color: var(--el-text-color-primary) !important;
font-weight: 400;
font-size: 14px;
}
}

62
src/assets/css/components/views/detections/detection-create/detection-form-setting.scss
View File

@@ -13,11 +13,6 @@ $color-info-light: var(--el-color-info-light-7);
margin-top: -4px;
}
.el-select__wrapper, .el-input__wrapper {
min-height: 24px !important;
height: 24px !important;
}
.el-switch__label.is-active {
color: $color-primary;
}
@@ -27,15 +22,8 @@ $color-info-light: var(--el-color-info-light-7);
line-height: 14px;
padding: 0;
margin-bottom: 12px;
font-family: NotoSansHans-Medium;
font-size: 14px;
color: $color-primary;
font-weight: 500;
}
.el-form-item__content {
height: 24px;
line-height: 24px;
}
.block-mode {
@@ -67,19 +55,15 @@ $color-info-light: var(--el-color-info-light-7);
flex-direction: column;
.block-mode-title {
font-family: NotoSansSChineseRegular;
font-size: 14px;
color: $color-primary;
font-weight: 400;
line-height: 14px;
}
.block-mode-content {
font-family: NotoSansSChineseRegular;
font-size: 12px;
color: $color-regular;
line-height: 15px;
font-weight: 400;
margin: 10px 0;
}
@@ -90,10 +74,8 @@ $color-info-light: var(--el-color-info-light-7);
text-align: center;
background: $fill-color-light;
border-radius: 2px;
font-family: NotoSansHans-Medium;
font-size: 12px;
color: $color-primary;
font-weight: 500;
cursor: pointer;
transition: all var(--el-transition-duration-fast);
}
@@ -106,16 +88,13 @@ $color-info-light: var(--el-color-info-light-7);
}
.block-title {
font-family: NotoSansHans-Medium;
font-size: 14px;
line-height: 14px;
color: $color-primary;
font-weight: 500;
margin-bottom: 12px;
}
.block-title1 {
font-family: NotoSansHans-Medium;
font-size: 12px;
line-height: 12px;
color: $color-primary;
@@ -125,23 +104,6 @@ $color-info-light: var(--el-color-info-light-7);
.form-setting__select {
width: 620px !important;
.el-input--small .el-input__inner {
height: 24px !important;
line-height: 24px !important;
}
}
.form-setting__input {
&.el-input {
height: 24px !important;
line-height: 24px !important;
}
.el-input__inner {
height: 24px;
line-height: 24px;
}
}
.form-setting__textarea {
@@ -151,10 +113,8 @@ $color-info-light: var(--el-color-info-light-7);
}
.el-switch__label, .form-setting__block .el-switch__label {
font-family: NotoSansSChineseRegular;
font-size: 14px;
color: $color-primary;
font-weight: 400;
}
.block-dimension {
@@ -172,18 +132,11 @@ $color-info-light: var(--el-color-info-light-7);
background: var(--el-fill-color-darker);
border-radius: 2px;
opacity: 0.6;
font-family: NotoSansSChineseRegular;
font-size: 12px;
color: $color-primary;
font-weight: 400;
margin-right: 4px;
}
}
.el-input--small .el-input__inner {
height: 24px !important;
line-height: 24px !important;
}
}
.form-setting__block-key {
@@ -197,10 +150,8 @@ $color-info-light: var(--el-color-info-light-7);
border: 1px solid $color-info-light;
box-shadow: 0 2px 4px 0 rgba(51, 51, 51, 0.02);
border-radius: 2px;
font-family: NotoSansHans-Medium;
font-size: 12px;
color: $color-primary;
font-weight: 500;
margin-left: 12px;
display: flex;
align-items: center;
@@ -228,10 +179,8 @@ $color-info-light: var(--el-color-info-light-7);
background: var(--el-color-business);
border: 1px solid var(--el-color-business-dark-1);
border-radius: 2px;
font-family: NotoSansHans-Medium;
font-size: 12px;
color: $fill-color-blank;
font-weight: 500;
padding: 0 14px;
}
@@ -293,11 +242,6 @@ $color-info-light: var(--el-color-info-light-7);
width: 170px;
}
.el-input--small .el-input__inner {
height: 24px;
line-height: 24px;
}
i {
font-size: 12px !important;
font-variant-caps: all-small-caps;
@@ -416,10 +360,8 @@ $color-info-light: var(--el-color-info-light-7);
}
.condition-metric {
font-family: NotoSansSChineseRegular;
font-size: 14px;
color: $color-primary;
font-weight: 400;
display: flex;
flex-direction: column;
@@ -514,10 +456,8 @@ $color-info-light: var(--el-color-info-light-7);
border: 1px solid $color-info-light;
box-shadow: 0 2px 4px 0 rgba(51, 51, 51, 0.02);
border-radius: 2px;
font-family: NotoSansHans-Medium;
font-size: 12px;
color: $color-primary;
font-weight: 500;
cursor: pointer;
display: flex;
align-items: center;
@@ -536,10 +476,8 @@ $color-info-light: var(--el-color-info-light-7);
.el-divider__text {
padding: 0 4px;
font-family: NotoSansSChineseRegular;
font-size: 12px;
color: var(--el-text-color-disabled);
font-weight: 400;
}
}

36
src/assets/css/components/views/detections/detection-create/detection-form.scss
View File

@@ -7,7 +7,7 @@ $bg-color-page: var(--el-bg-color-page);
.detection-form-header {
font-size: 24px;
color: $text-color-primary;
font-weight: 900;
font-weight: bold;
margin-top: 10px;
}
@@ -59,9 +59,7 @@ $bg-color-page: var(--el-bg-color-page);
height: 24px;
line-height: 24px;
text-align: center;
font-family: NotoSansHans-Medium;
font-size: 16px;
font-weight: 500;
border-radius: 50%;
margin-right: 10px;
transition: 0.5s all;
@@ -80,7 +78,6 @@ $bg-color-page: var(--el-bg-color-page);
.form-collapse-header-title {
font-size: 16px;
color: $text-color-primary;
font-weight: 500;
}
}
@@ -89,22 +86,18 @@ $bg-color-page: var(--el-bg-color-page);
.trigger-block {
width: 620px;
height: 90px;
padding: 16px 12px;
padding: 16px 12px 0 12px;
border-radius: 2px;
border: 1px var(--el-border-color-light) solid;
display: flex;
flex-direction: column;
font-size: 14px;
color: $text-color-primary;
font-weight: 400;
.trigger-block-item {
display: flex;
align-items: flex-start;
justify-content: flex-start;
height: 24px;
line-height: 24px;
.policy-form-item {
.el-form-item__error {
@@ -113,24 +106,21 @@ $bg-color-page: var(--el-bg-color-page);
}
}
.el-input--small .el-input__inner {
width: 112px;
.el-form-item__content {
margin: 0 12px;
}
.el-input--small {
.el-input__inner {
width: 112px;
}
}
.el-select .el-input .el-select__caret {
height: 24px;
line-height: 24px;
margin-right: 12px;
}
.form-trigger__select {
margin-left: -12px;
}
.el-form-item__content {
height: 24px;
line-height: 24px !important;
.form-trigger__select .el-form-item__content {
margin-left: 0;
}
}
}
@@ -141,11 +131,7 @@ $bg-color-page: var(--el-bg-color-page);
}
.el-input__wrapper, .el-select__wrapper {
height: 24px !important;
line-height: 24px !important;
min-height: 24px !important;
width: 112px;
margin: 0 12px;
}
.el-input__inner {
@@ -155,8 +141,6 @@ $bg-color-page: var(--el-bg-color-page);
}
.el-input--small, .el-input--small .el-input__inner {
height: 24px !important;
line-height: 24px !important;
border-radius: 2px !important;
}
}

70
src/assets/css/components/views/detections/detection-filter.scss
View File

@@ -1,7 +1,3 @@
$color-primary: var(--el-text-color-primary);
$color-business: var(--el-color-business);
$color-light: var(--el-border-color-light);
.detection-filter-case {
display: flex;
flex-direction: column;
@@ -9,7 +5,7 @@ $color-light: var(--el-border-color-light);
margin-right: 12px;
overflow: auto;
z-index: 1;
border: 1px solid $color-light !important;
border: 1px solid var(--el-border-color-light) !important;
border-radius: var(--el-border-radius-base) !important;
.filter-case__header {
@@ -19,7 +15,7 @@ $color-light: var(--el-border-color-light);
color: var(--el-text-color-regular);
font-size: 14px;
background: var(--cn-bg-color-lighter);
box-shadow: 0 1px 0 0 $color-light;
box-shadow: 0 1px 0 0 var(--el-border-color-light);
border-radius: var(--el-border-radius-base) var(--el-border-radius-base) 0 0;
}
@@ -28,8 +24,7 @@ $color-light: var(--el-border-color-light);
line-height: 46px;
margin: 0 20px;
font-size: 14px;
color: $color-primary;
font-weight: 500;
color: var(--el-text-color-primary);
}
.filter__body {
@@ -51,7 +46,7 @@ $color-light: var(--el-border-color-light);
display: flex;
align-items: center;
font-size: 14px;
color: $color-primary;
color: var(--el-text-color-primary);
font-weight: 400;
.filter__body-item-left-index {
@@ -61,10 +56,9 @@ $color-light: var(--el-border-color-light);
background: var(--el-bg-color-page);
border-radius: 2px;
margin-right: 6px;
font-family: NotoSansHans-Black;
font-size: 9px;
color: var(--el-color-info);
font-weight: 900;
font-weight: bold;
display: flex;
align-items: center;
justify-content: center;
@@ -72,10 +66,8 @@ $color-light: var(--el-border-color-light);
.filter__body-item-left-label {
max-width: 180px;
font-family: NotoSansSChineseRegular;
font-size: 14px;
color: $color-primary;
font-weight: 400;
color: var(--el-text-color-primary);
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
@@ -84,10 +76,8 @@ $color-light: var(--el-border-color-light);
.filter__body-item-right {
flex-shrink: 0;
font-family: NotoSansSChineseRegular;
font-size: 12px;
color: var(--el-text-color-regular);
font-weight: 400;
margin-right: 10px;
}
}
@@ -129,7 +119,7 @@ $color-light: var(--el-border-color-light);
line-height: 32px;
background: var(--cn-bg-color-lighter);
padding: 0 20px;
box-shadow: 0 1px 0 0 $color-light;
box-shadow: 0 1px 0 0 var(--el-border-color-light);
border-radius: var(--el-border-radius-base) var(--el-border-radius-base) 0 0;
}
@@ -142,11 +132,10 @@ $color-light: var(--el-border-color-light);
}
.new-filter-content-title {
font-family: NotoSansHans-Medium;
font-size: 14px;
line-height: 14px;
margin-bottom: 10px;
color: $color-primary;
color: var(--el-text-color-primary);
font-weight: 500;
}
@@ -158,51 +147,12 @@ $color-light: var(--el-border-color-light);
line-height: 16px;
margin-bottom: 13.6px;
font-size: 14px;
color: $color-primary;
font-weight: 400;
color: var(--el-text-color-primary);
display: flex !important;
.el-checkbox__inner {
width: 16px !important;
height: 16px !important;
text-align: center !important;
line-height: 16px !important;
}
.el-checkbox__input.is-indeterminate .el-checkbox__inner {
border-color: var(--el-bg-color-page);
background: var(--el-bg-color-page);
border-radius: 2px;
}
.el-checkbox__input.is-indeterminate .el-checkbox__inner:before {
background: var(--el-fill-color-blank);
border-radius: 1px;
}
.el-checkbox__inner::after {
top: 2px;
left: 5px;
}
.el-checkbox__input.is-checked {
.el-checkbox__inner {
border-color: var(--el-bg-color-page);
background: var(--el-bg-color-page);
border-radius: 2px;
}
}
.el-checkbox__input.is-focus {
.el-checkbox__inner {
border-color: var(--el-bg-color-page);
}
}
.el-checkbox__label {
font-size: 14px;
color: $color-primary;
font-weight: 400;
color: var(--el-text-color-primary);
padding-left: 10px !important;
}
}

5
src/assets/css/components/views/detections/detections.scss
View File

@@ -25,21 +25,18 @@
overflow: auto;
.detection-title {
font-family: NotoSansHans-Black;
line-height: 24px;
font-size: 24px;
color: var(--el-text-color-primary);
font-weight: 900;
font-weight: bold;
display: flex;
flex-direction: column;
.detection-title-label {
font-family: NotoSansSChineseRegular;
font-size: 12px;
color: var(--el-text-color-regular);
letter-spacing: 0;
line-height: 18px;
font-weight: 400;
margin-top: 5px;
}
}

9
src/assets/css/main.scss
View File

@@ -39,6 +39,15 @@
'large': 32px,
'default': 28px,
'small': 24px
),
// dropdown
$dropdown: (
'menuItem-hover-fill': var(--el-fill-color-light),
'menuItem-hover-color': var(--el-text-color-regular)
),
$checkbox: (
'checked-input-border-color': var(--el-color-business),
'checked-bg-color': var(--el-color-business),
)
);
// 导出重写后的var.scss，暴露内部变量供别处使用

33
src/components/rightBox/report/ReportBox.vue
View File

@@ -11,7 +11,7 @@
<el-form ref="reportForm" :model="editObject" :rules="rules" label-position="top" label-width="120px">
<!--name-->
<el-form-item :label="$t('report.name')" prop="name">
<el-input id="account-input-name" v-model="editObject.name" maxlength="64" placeholder=" " show-word-limit size="small" type="text"></el-input>
<el-input id="account-input-name" v-model="editObject.name" maxlength="64" placeholder=" " show-word-limit type="text"></el-input>
</el-form-item>
<!--time limit-->
<el-form-item :label="$t('report.timeLimit')" prop="timeLimit">
@@ -20,8 +20,6 @@
class="right-box__select"
collapse-tags
placeholder=" "
popper-class="right-box-select-dropdown right-box-select-report "
size="small"
@change="timeConfigTypeChange"
>
<template v-for="time in timeRuleList" :key="time.value">
@@ -34,8 +32,7 @@
class="right-box__select"
collapse-tags
placeholder=" "
popper-class="right-box-select-dropdown right-box-select-report "
size="small"
style="margin-top: 10px;"
@change="()=>{ this.$forceUpdate() }">
<template v-for="time in timeUnitList" :key="time.value">
<el-option :label="$t(time.name)" :value="time.value"></el-option>
@@ -43,7 +40,7 @@
</el-select>
</template>
<div v-else-if="editObject.config.timeConfig.type === 'last' || editObject.config.timeConfig.type === 'previous'" class="report__display">
<el-input v-model.number="editObject.config.timeConfig.offset" size="small" class="el-input-single" placeholder=" ">
<el-input v-model.number="editObject.config.timeConfig.offset" class="el-input-single" placeholder=" ">
<template #prepend><i @click="timeOffsetHandle('m')" class="cn-icon cn-icon-a-"></i></template>
<template #append><i @click="timeOffsetHandle('p')" class="cn-icon cn-icon-a-1"></i></template>
</el-input>
@@ -53,7 +50,6 @@
collapse-tags
placeholder=" "
popper-class="right-box-select-dropdown el-select-last"
size="small"
@change="()=>{ this.$forceUpdate() }">
<template v-for="time in timeUnitList" :key="time.value">
<el-option :label="$t(time.name)" :value="time.value"></el-option>
@@ -67,7 +63,6 @@
<div class="block">
<el-date-picker
v-model="editObject.config.startTime"
size="small"
:format="dateFormat"
:disabled-date="startDisabledDate"
@change="startTimeChang"
@@ -84,7 +79,6 @@
<div class="block">
<el-date-picker
v-model="editObject.config.endTime"
size="small"
:format="dateFormat"
:disabled-date="endDisabledDate"
@change="endTimeChange"
@@ -105,17 +99,17 @@
</div>
<div class="enable-tabs-daily" v-if="scheduleType === scheduleTypeList[0].value">
<div class="enable-tabs-custom">{{$t('report.customEvery')}}</div>
<el-input v-model.number="editObject.config.schedulerConfig.interval" size="small" placeholder=" " class="report__margin-t">
<el-input v-model.number="editObject.config.schedulerConfig.interval" placeholder=" ">
<template #append>{{$t('report.day')}}</template>
</el-input>
</div>
<div class="enable-tabs-weekly" v-else-if="scheduleType === scheduleTypeList[1].value">
<!-- 每隔几周暂时隐藏 -->
<!-- <div class="enable-tabs-custom">{{$t('report.customEvery')}}</div>
<el-input v-model="editObject.config.schedulerConfig.interval" size="small" placeholder="Please input">
<el-input v-model="editObject.config.schedulerConfig.interval" placeholder="Please input">
<template #append>{{$t('report.week')}}</template>
</el-input>-->
<el-checkbox-group v-model="editObject.config.schedulerConfig.weekDates" class="report__margin-t">
<el-checkbox-group v-model="editObject.config.schedulerConfig.weekDates">
<el-checkbox v-for="(item, index) in weekdayList" :key="index" :label="item.value">{{$t(item.name)}}</el-checkbox>
</el-checkbox-group>
</div>
@@ -130,7 +124,7 @@
<!-- 自定义月，循环 -->
<template v-if="monthIsCycle">
<div class="enable-tabs-custom">{{$t('report.customEvery')}}</div>
<el-input v-model="editObject.config.schedulerConfig.interval" size="small" placeholder=" " class="report__margin-t">
<el-input v-model="editObject.config.schedulerConfig.interval" placeholder=" ">
<template #append>{{$t('report.month')}}</template>
</el-input>
</template>
@@ -158,10 +152,9 @@
<el-select id="account-input-roleIds"
v-model="editObject.config.schedulerConfig.monthWeekDates"
class="right-box__select"
style="margin-top: 10px;"
multiple
placeholder=" "
popper-class="right-box-select-dropdown right-box-select-report"
size="small"
@change="()=>{ this.$forceUpdate() }">
<template v-for="time in weekOptions" :key="time.value">
<el-option :label="$t(time.name)" :value="time.value"></el-option>
@@ -183,7 +176,6 @@
<div class="block">
<el-date-picker
v-model="editObject.schedulerStart"
size="small"
:format="dateFormat"
prefix-icon=""
type="datetime"
@@ -198,7 +190,6 @@
<div class="block">
<el-date-picker
v-model="editObject.schedulerEnd"
size="small"
:format="dateFormat"
prefix-icon=""
type="datetime"
@@ -215,8 +206,6 @@
collapse-tags
placeholder=" "
:disabled="!!editObject.id"
popper-class="right-box-select-dropdown right-box-select-report"
size="small"
>
<template v-for="category in categoryList" :key="category.id">
<el-option :label="category.name" :value="category.id"></el-option>
@@ -225,11 +214,11 @@
</el-form-item>
<!-- 参数 -->
<el-form-item :label="$t('config.operationlog.params')" prop="categoryParams" v-if="editObject.categoryParams && editObject.categoryParams.length > 0">
<!-- <el-input v-model="param.value" placeholder=" " v-for="(param, index) in editObject.categoryParams" :key="index" size="small" style="vertical-align: unset;" :disabled="!!editObject.id">
<!-- <el-input v-model="param.value" placeholder=" " v-for="(param, index) in editObject.categoryParams" :key="index" style="vertical-align: unset;" :disabled="!!editObject.id">
<template #prepend>{{param.key}}</template>
</el-input>-->
<template v-for="(param, index) in editObject.categoryParams" :key="index">
<el-input v-if="param.labelType === 'input'" v-model="param.value" placeholder=" " size="small" class="report__params-vertical" :disabled="!!editObject.id">
<el-input v-if="param.labelType === 'input'" v-model="param.value" placeholder=" " class="report__params-vertical" :disabled="!!editObject.id">
<template #prepend>{{param.key}}</template>
</el-input>
<el-select v-model="param.value"
@@ -238,8 +227,6 @@
placeholder=" "
filterable
:disabled="!!editObject.id"
popper-class="right-box-select-dropdown right-box-select-report "
size="small"
>
<template #prefix>
{{$t(param.i18n)}}

8
src/components/rightBox/settings/I18nBox.vue
View File

@@ -12,12 +12,12 @@
<!--name-->
<el-form-item :label="$t('overall.name')" prop="name">
<el-input id="account-input-name" v-model="editObject.name" :disabled="editObject.name==='admin' && editObject.id === 1"
maxlength="64" placeholder="" show-word-limit size="small" type="text"></el-input>
maxlength="64" placeholder="" show-word-limit type="text"></el-input>
</el-form-item>
<!--code-->
<el-form-item :label="$t('config.i18n.code')" prop="code">
<el-input id="account-input-code" v-model="editObject.code" :disabled="editObject.code==='admin' && editObject.id === 1"
maxlength="64" placeholder="" show-word-limit size="small" type="text"></el-input>
maxlength="64" placeholder="" show-word-limit type="text"></el-input>
</el-form-item>
<!--lang-->
<el-form-item :label="$t('config.i18n.lang')" prop="lang">
@@ -28,7 +28,7 @@
collapse-tags
placeholder=" "
popper-class="right-box-select-dropdown prevent-clickoutside"
size="small"
@change="()=>{ this.$forceUpdate() }">
<template v-for="role in langData" :key="role.value">
<el-option :label="role.value" :value="role.value"></el-option>
@@ -38,7 +38,7 @@
<!--value-->
<el-form-item :label="$t('config.i18n.value')" label-width="200px" prop="value">
<el-input id="account-input-value" v-model="editObject.value" maxlength="256" placeholder=""
show-word-limit size="small"></el-input>
show-word-limit></el-input>
</el-form-item>
</el-form>
</div>

2
src/components/rightBox/settings/RoleBox.vue
View File

@@ -12,7 +12,7 @@
<!--name-->
<el-form-item :label="$t('config.roles.name')" prop="name">
<el-input maxlength="64" placeholder="" id="role-box-input-name"
show-word-limit size="small" type="text" v-model="editRole.name"></el-input>
show-word-limit type="text" v-model="editRole.name"></el-input>
</el-form-item>
<el-form-item :label="$t('overall.remark')">
<el-input maxlength="255" show-word-limit :rows="2" size='mini' type="textarea" v-model="editRole.remark" id="role-box-input-remark"/>

16
src/components/rightBox/settings/UserBox.vue
View File

@@ -13,31 +13,31 @@
<el-form-item :label="$t('config.user.name')" prop="name">
<el-input id="account-input-name" v-model="editObject.name"
:disabled="editObject.username==='admin' && editObject.id === 1"
minlength="2" maxlength="64" placeholder="" show-word-limit size="small" type="text"></el-input>
minlength="2" maxlength="64" placeholder="" show-word-limit type="text"></el-input>
</el-form-item>
<!--username-->
<el-form-item :label="$t('config.user.username')" prop="username">
<el-input id="account-input-username" v-model="editObject.username"
:disabled="editObject.username==='admin' && editObject.id === 1"
minlength="2" maxlength="64" placeholder="" show-word-limit size="small" type="text"></el-input>
minlength="2" maxlength="64" placeholder="" show-word-limit type="text"></el-input>
</el-form-item>
<!--password-->
<el-form-item :label="$t('config.user.pin')" prop="pin">
<el-input id="account-input-password" v-model="editObject.pin" minlength="5" maxlength="64" placeholder=""
show-word-limit size="small" type="password" @blur="pinBlur" autocomplete="new-password"></el-input>
show-word-limit type="password" @blur="pinBlur" autocomplete="new-password"></el-input>
</el-form-item>
<!--pinChange-->
<el-form-item :label="$t('config.user.confirmPin')" label-width="200px" prop="pinChange">
<el-input id="account-input-pinChange" v-model="editObject.pinChange" minlength="5" maxlength="64" placeholder=""
show-word-limit size="small" type="password"></el-input>
show-word-limit type="password"></el-input>
</el-form-item>
<!--email-->
<el-form-item label="E-mail" prop="email">
<el-input id="account-input-email" v-model="editObject.email" maxlength="35" show-word-limit placeholder="" size="small" type="text"></el-input>
<el-input id="account-input-email" v-model="editObject.email" maxlength="35" show-word-limit placeholder="" type="text"></el-input>
</el-form-item>
<!--mobile-->
<el-form-item :label="$t('config.user.mobile')" prop="mobile">
<el-input id="account-input-mobile" v-model.number="editObject.mobile" maxlength="11" show-word-limit placeholder="" size="small" type="text"></el-input>
<el-input id="account-input-mobile" v-model.number="editObject.mobile" maxlength="11" show-word-limit placeholder="" type="text"></el-input>
</el-form-item>
<!--roles-->
<el-form-item :label="$t('config.user.roles')" prop="roleIds">
@@ -49,7 +49,7 @@
collapse-tags
placeholder=" "
popper-class="right-box-select-dropdown prevent-clickoutside"
size="small"
@change="()=>{ this.$forceUpdate() }">
<template v-for="role in roleData" :key="role.id">
<el-option :label="role.name" :value="role.id"></el-option>
@@ -65,7 +65,7 @@
collapse-tags
placeholder=" "
popper-class="right-box-select-dropdown prevent-clickoutside"
size="small">
>
<template v-for="lang in langData" :key="lang.value">
<el-option :label="lang.label" :value="lang.value"></el-option>
</template>

4
src/components/table/detection/GeneralSettings.vue
View File

@@ -43,7 +43,7 @@
<!--category-->
<el-form ref="form" :model="settingObj" label-position="top" :rules="rules">
<el-form-item :label="$t('overall.category')" prop="category" class="form-setting__block margin-b-20">
<el-select :disabled="settingObj.ruleId" v-model="settingObj.category" class="form-setting__select" placeholder=" " size="small" @change="changeEditFlag">
<el-select :disabled="settingObj.ruleId" v-model="settingObj.category" class="form-setting__select" placeholder=" " @change="changeEditFlag">
<el-option
v-for="item in categoryList"
:key="item.value"
@@ -55,7 +55,7 @@
<!--type-->
<el-form-item :label="$t('overall.type')" prop="eventType" class="form-setting__block margin-b-20">
<el-select v-model="settingObj.eventType" placeholder=" " size="small" class="form-setting__select" @change="changeEditFlag">
<el-select v-model="settingObj.eventType" placeholder=" " class="form-setting__select" @change="changeEditFlag">
<el-option
v-for="item in eventTypeList"
:key="item.value"

22
src/components/table/detection/RuleDefinition.vue
View File

@@ -5,7 +5,7 @@
<el-form ref="form" :model="thresholdRuleObj" label-position="top" :rules="rules">
<!--source-->
<el-form-item :label="$t('config.user.source')" prop="dataSource" class="form-setting__block margin-b-20">
<el-select v-model="thresholdRuleObj.dataSource" placeholder=" " size="small" class="form-setting__select">
<el-select v-model="thresholdRuleObj.dataSource" placeholder=" " class="form-setting__select">
<el-option
v-for="item in sourceList"
:key="item.value"
@@ -38,7 +38,7 @@
<div class="block-title1">{{ $t('detections.filters') }}</div>
<div class="definition-filter-block" v-if="showFilter">
<div class="definition-filter-item" v-for="(item, index) in thresholdRuleObj.filterList" :key="index">
<el-select class="filter-item__select margin-r-8" v-model="item.filter" placeholder=" " size="small">
<el-select class="filter-item__select margin-r-8" v-model="item.filter" placeholder=" ">
<el-option
v-for="item in selectList"
:key="item.value"
@@ -46,10 +46,10 @@
:value="item.value"
/>
</el-select>
<el-input class="filter-item__input margin-r-8" size="small" disabled placeholder="equal"></el-input>
<el-input class="filter-item__input margin-r-8" disabled placeholder="equal"></el-input>
<el-input
class="filter-item__input margin-r-8"
size="small"
oninput="value=value.replace(/[^\d]/g,'')"
v-model="item.value"></el-input>
<i class="cn-icon cn-icon-close" @click="delFilterItem(index, item)"></i>
@@ -70,7 +70,7 @@
<el-form ref="form2" :model="thresholdRuleObj" label-position="top">
<div class="definition-condition-block" v-for="(item, index) in thresholdRuleObj.conditionData" :key="index">
<el-form-item :label="$t('detection.level')" :prop="`conditionData.${index}.level`" :rules="rules.level">
<el-select class="condition__select margin-b-20" v-model="item.level" placeholder=" " size="small">
<el-select class="condition__select margin-b-20" v-model="item.level" placeholder=" ">
<template #prefix>
<div
class="condition__select__icon"
@@ -92,7 +92,7 @@
<div class="metric-item1__text">
<span style="margin-right: 9px;">If</span>
<el-form-item :prop="`conditionData.${index}.list.${i}.metric`" :rules="rules.metric">
<el-select v-model="data.metric" placeholder=" " size="small">
<el-select v-model="data.metric" placeholder=" ">
<el-option
v-for="item in metricList"
:key="item.label"
@@ -116,7 +116,7 @@
<div class="condition-metric-item2">
<div style="height: 24px;line-height: 24px;display: flex;">
<el-form-item :prop="`conditionData.${index}.list.${i}.condition`" :rules="rules.condition">
<el-select class="metric-item2__select" v-model="data.condition" placeholder=" " size="small">
<el-select class="metric-item2__select" v-model="data.condition" placeholder=" ">
<el-option
v-for="item in conditionList"
:key="item.label"
@@ -132,7 +132,7 @@
class="metric-item2__input"
v-model.number="data.value"
oninput="value=value.replace(/[^\d]/g,'')"
size="small"></el-input>
></el-input>
</el-form-item>
</div>
@@ -165,7 +165,7 @@
<el-form ref="form" :model="indicatorRuleObj" label-position="top" :rules="rules">
<!--Source-->
<el-form-item :label="$t('config.user.source')" prop="dataSource" class="form-setting__block margin-b-20">
<el-select v-model="indicatorRuleObj.dataSource" class="form-setting__select" placeholder=" " size="small" @change="handleParamsComplete">
<el-select v-model="indicatorRuleObj.dataSource" class="form-setting__select" placeholder=" " @change="handleParamsComplete">
<el-option
v-for="item in sourceList"
:key="item.value"
@@ -177,7 +177,7 @@
<!--Library-->
<el-form-item :label="$t('detection.library')" prop="knowledgeId" class="form-setting__block margin-b-20">
<el-select v-model="indicatorRuleObj.knowledgeId" class="form-setting__select" filterable placeholder=" " size="small" @change="handleParamsComplete">
<el-select v-model="indicatorRuleObj.knowledgeId" class="form-setting__select" filterable placeholder=" " @change="handleParamsComplete">
<el-option
v-for="item in libraryList"
:key="item.knowledgeId"
@@ -189,7 +189,7 @@
<!--Level-->
<el-form-item :label="$t('detection.level')" prop="level" class="form-setting__block">
<el-select v-model="indicatorRuleObj.level" class="condition__select form-setting__select" placeholder=" " size="small" @change="handleParamsComplete">
<el-select v-model="indicatorRuleObj.level" class="condition__select form-setting__select" placeholder=" " @change="handleParamsComplete">
<template #prefix>
<div
class="condition__select__icon"

9
src/views/administration/Appearance.vue
View File

@@ -7,8 +7,7 @@
v-model="appearanceObject.date_format"
collapse-tags
placeholder=" "
popper-class="right-box-select-dropdown right-box-select-report "
size="small">
>
<template v-for="dateFormat in dateFormatList" :key="dateFormat.id">
<el-option :label="dateFormat.label" :value="dateFormat.value" class="appearance__option">
<span>{{ dateFormat.label }}</span>
@@ -22,8 +21,7 @@
v-model="appearanceObject.lang"
collapse-tags
placeholder=" "
popper-class="right-box-select-dropdown right-box-select-report "
size="small">
>
<template v-for="lang in langList" :key="lang.id">
<el-option :label="lang.label" :value="lang.value"></el-option>
</template>
@@ -35,8 +33,7 @@
collapse-tags
filterable
placeholder=" "
popper-class="right-box-select-dropdown right-box-select-report "
size="small">
>
<template v-for="timezone in timezoneList" :key="timezone.id">
<el-option :label="timezone.name" :value="timezone.name" class="appearance__option">
<span>{{ timezone.name }}</span>

22
src/views/detections/detectionPolicies/PolicyForm.vue
View File

@@ -57,16 +57,16 @@
<div class="trigger-block-item margin-b-10">
<div>At least</div>
<el-form-item prop="atLeast">
<el-input size="small" maxlength="5" v-model="triggerObj.atLeast" oninput="value=value.replace(/[^\d]/g,'')" @input="resetEditFlag"></el-input>
<el-input maxlength="5" size="small" v-model="triggerObj.atLeast" oninput="value=value.replace(/[^\d]/g,'')" @input="resetEditFlag"></el-input>
</el-form-item>
<div>times within</div>
<el-form-item prop="interval" class="policy-form-item">
<el-input size="small" maxlength="5" v-model="triggerObj.interval" oninput="value=value.replace(/[^\d]/g,'')" @input="resetEditFlag"></el-input>
<el-input maxlength="5" size="small" v-model="triggerObj.interval" oninput="value=value.replace(/[^\d]/g,'')" @input="resetEditFlag"></el-input>
</el-form-item>
<el-form-item prop="intervalVal">
<el-select v-model="triggerObj.intervalVal" class="form-trigger__select" placeholder=" " size="small" @change="resetEditFlag">
<el-form-item prop="intervalVal" class="form-trigger__select">
<el-select v-model="triggerObj.intervalVal" placeholder=" " size="small" @change="resetEditFlag">
<el-option
v-for="item in intervalList"
:key="item.value"
@@ -80,10 +80,10 @@
<div class="trigger-block-item">
<div>With the counter resetting after no activity for</div>
<el-form-item prop="resetInterval" class="policy-form-item">
<el-input size="small" maxlength="5" v-model="triggerObj.resetInterval" oninput="value=value.replace(/[^\d]/g,'')" @input="resetEditFlag"></el-input>
<el-input maxlength="5" size="small" v-model="triggerObj.resetInterval" oninput="value=value.replace(/[^\d]/g,'')" @input="resetEditFlag"></el-input>
</el-form-item>
<el-form-item prop="resetIntervalVal">
<el-select v-model="triggerObj.resetIntervalVal" class="form-trigger__select" placeholder=" " size="small" @change="resetEditFlag">
<el-form-item prop="resetIntervalVal" class="form-trigger__select">
<el-select v-model="triggerObj.resetIntervalVal" placeholder=" " size="small" @change="resetEditFlag">
<el-option
v-for="item in intervalList"
:key="item.value"
@@ -101,8 +101,8 @@
<el-input size="small" maxlength="5" v-model="triggerObj.interval" oninput="value=value.replace(/[^\d]/g,'')" @input="resetEditFlag"></el-input>
</el-form-item>
<el-form-item prop="intervalVal">
<el-select v-model="triggerObj.intervalVal" class="form-trigger__select" placeholder=" " size="small" @change="resetEditFlag">
<el-form-item prop="intervalVal" class="form-trigger__select">
<el-select size="small" v-model="triggerObj.intervalVal" placeholder=" " @change="resetEditFlag">
<el-option
v-for="item in intervalList"
:key="item.value"
@@ -123,8 +123,8 @@
<el-form-item prop="resetInterval">
<el-input size="small" maxlength="5" v-model="triggerObj.resetInterval" oninput="value=value.replace(/[^\d]/g,'')" @input="resetEditFlag"></el-input>
</el-form-item>
<el-form-item prop="resetIntervalVal">
<el-select v-model="triggerObj.resetIntervalVal" class="form-trigger__select" placeholder=" " size="small" @change="resetEditFlag">
<el-form-item prop="resetIntervalVal" class="form-trigger__select">
<el-select size="small" v-model="triggerObj.resetIntervalVal" placeholder=" " @change="resetEditFlag">
<el-option
v-for="item in intervalList"
:key="item.value"