diff --git a/src/assets/css/common/cover-element-plus.scss b/src/assets/css/common/cover-element-plus.scss
index 1704e55c..3ece9d97 100644
--- a/src/assets/css/common/cover-element-plus.scss
+++ b/src/assets/css/common/cover-element-plus.scss
@@ -8,10 +8,10 @@
}
.el-table--border::before, .el-table__border-left-patch {
- //width: 0 !important;
+ width: 0 !important;
}
.el-table--border .el-table__inner-wrapper::after, .el-table__inner-wrapper::before {
- //height: 0 !important;
+ height: 0 !important;
}
.el-popper.is-pure {
@@ -66,3 +66,25 @@
.el-popover.el-popper {
padding: 0 !important;
}
+.my-header-cell-class .el-checkbox__input{
+ display: none;
+}
+.el-dialog {
+ padding: 0 !important;
+}
+.el-switch.is-checked .el-switch__core {
+ background-color: $--color-primary !important;
+}
+.el-date-table td.end-date .el-date-table-cell__text, .el-date-table td.start-date .el-date-table-cell__text {
+ background-color: $--color-primary !important;
+}
+.el-date-table td.available:hover {
+ color: $--color-primary !important;
+}
+.el-picker__popper.el-popper {
+ margin-top: 8px;
+}
+//.el-button:hover {
+// color: $--color-primary !important;
+// border-color: $--color-primary !important;
+//}
diff --git a/src/assets/css/common/right-box-common.scss b/src/assets/css/common/right-box-common.scss
index e7cd88f1..770b9a99 100644
--- a/src/assets/css/common/right-box-common.scss
+++ b/src/assets/css/common/right-box-common.scss
@@ -64,6 +64,9 @@
}
}
}
+ }
+ .container__form {
+
}
.el-form-item__content {
.input-box {
@@ -136,6 +139,9 @@
.el-input__inner:focus {
border-color: darken($--right-box-border-color, 20%);
}
+ .el-form-item__label {
+ padding-bottom: 2px;
+ }
}
.el-form-item.is-error .el-input__inner, .el-form-item.is-error .el-input__inner:focus, .el-form-item.is-error .el-textarea__inner, .el-form-item.is-error .el-textarea__inner:focus, .el-message-box__input input.invalid, .el-message-box__input input.invalid:focus {
border-color: #F56C6C
@@ -301,4 +307,24 @@
.el-form-item__content .el-autocomplete .el-input-group {
vertical-align: unset;
}
+ .el-input__wrapper {
+ border-radius: 2px;
+ 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 #e7eaed inset;
+ }
+ .el-input__inner, .el-textarea__inner {
+ border: none !important;
+ }
+ .el-select__wrapper {
+ height: 32px;
+ line-height: 32px;
+ }
+ .el-switch.is-checked .el-switch__core {
+ background-color: $--color-primary;
+ }
+ .el-textarea__inner {
+ font-size: 12px;
+ }
}
diff --git a/src/assets/css/common/table-common.scss b/src/assets/css/common/table-common.scss
index 3590af45..169eb1a8 100644
--- a/src/assets/css/common/table-common.scss
+++ b/src/assets/css/common/table-common.scss
@@ -55,6 +55,10 @@
.top-tool-btn--search:focus {
border-left: none !important;
}
+ .el-input--small .el-input__wrapper {
+ height: 28px !important;
+ border-radius: 2px 0 0 2px !important;
+ }
}
.top-tool-right {
diff --git a/src/assets/css/components/components/common/TimeRange/date-time-range.scss b/src/assets/css/components/components/common/TimeRange/date-time-range.scss
index a5f3513e..e48b3c98 100644
--- a/src/assets/css/components/components/common/TimeRange/date-time-range.scss
+++ b/src/assets/css/components/components/common/TimeRange/date-time-range.scss
@@ -144,6 +144,9 @@
background: $--select-bg-color-hover-1;
}
}
+ .el-range-editor.el-input__wrapper{
+ opacity: 0;
+ }
}
.date-range-panel-content-right {
diff --git a/src/assets/css/components/components/rightBox/report/reportBox.scss b/src/assets/css/components/components/rightBox/report/reportBox.scss
index 4ac674b8..d7961f2b 100644
--- a/src/assets/css/components/components/rightBox/report/reportBox.scss
+++ b/src/assets/css/components/components/rightBox/report/reportBox.scss
@@ -4,6 +4,7 @@
.el-checkbox {
margin-right: 24px;
line-height: 28px;
+ margin-top: -2px;
}
.el-checkbox-group {
line-height: 28px;
@@ -108,10 +109,40 @@
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;
+ }
+ }
+ .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-input__prefix {
+ //.el-select--small .el-select__prefix {
+ // left: 0;
+ // background-color: #f5f7fa;
+ // color: #999;
+ // padding: 0 1.07143rem;
+ // border: 1px solid #dcdfe6;
+ // border-radius: 2px 0 0 2px;
+ //}
+ .el-select__prefix, .el-input__prefix {
left: 0;
background-color: #f5f7fa;
color: #999;
@@ -119,6 +150,9 @@
border: 1px solid #dcdfe6;
border-radius: 2px 0 0 2px;
}
+ .el-select__wrapper {
+ padding-left: 0 !important;
+ }
}
}
.my-form-item .el-form-item__content {
diff --git a/src/assets/css/components/views/administration/Appearance.scss b/src/assets/css/components/views/administration/Appearance.scss
index af9a9b7c..79f08b22 100644
--- a/src/assets/css/components/views/administration/Appearance.scss
+++ b/src/assets/css/components/views/administration/Appearance.scss
@@ -10,6 +10,21 @@
display: flex;
flex-direction: column;
height: 100%;
+ .el-form-item {
+ margin-bottom: 27px;
+ }
+ .el-form-item__content {
+ width: 600px;
+ .el-select__wrapper {
+ min-height: 32px !important;
+ line-height: 32px;
+ padding: 0 10px 0 16px;
+ font-size: 13px;
+ }
+ }
+ .el-form--default.el-form--label-top .el-form-item .el-form-item__label {
+ margin-bottom: 4px;
+ }
.el-input {
width:600px;
}
@@ -60,3 +75,6 @@
}
}
}
+.el-popper.is-pure {
+ margin-top: 0;
+}
diff --git a/src/assets/css/components/views/detections/detection-tools.scss b/src/assets/css/components/views/detections/detection-tools.scss
index a2f3b0f4..a5e97b10 100644
--- a/src/assets/css/components/views/detections/detection-tools.scss
+++ b/src/assets/css/components/views/detections/detection-tools.scss
@@ -129,6 +129,10 @@
.el-input--small {
line-height: 27px;
+ .el-input__wrapper {
+ height: 28px !important;
+ border-radius: 2px 0 0 2px !important;
+ }
.el-input__inner {
height: 28px;
diff --git a/src/assets/css/components/views/report/report.scss b/src/assets/css/components/views/report/report.scss
index 20db63d4..8761760a 100644
--- a/src/assets/css/components/views/report/report.scss
+++ b/src/assets/css/components/views/report/report.scss
@@ -78,11 +78,37 @@
color: #1b2e3b;
background: #ebeef5;
}
+ .el-range-editor--small.el-input__wrapper {
+ height: 32px;
+ line-height: 32px;
+ }
.cn-detection__footer {
text-align: center;
+ display: flex;
+ justify-content: center;
.el-pagination__jump {
margin-left: 3px;
}
+ .el-pagination__goto {
+ display: none;
+ }
+ .el-input--small {
+ width: 46px !important;
+ .el-input__wrapper {
+ height: 22px;
+ }
+ }
+ .el-pagination--small {
+ .btn-prev {
+ margin-right: 10px;
+ }
+ .btn-next {
+ margin-left: 10px;
+ }
+ &span {
+ color: $--color-text-primary;
+ }
+ }
}
}
.block.drop-down-time {
@@ -176,6 +202,12 @@
}
}
}
+ .el-table__border-left-patch, .el-table--border::before {
+ width: 0;
+ }
+ .el-table--border .el-table__inner-wrapper::after, .el-table__inner-wrapper::before {
+ height: 0;
+ }
}
}
.table-operation-all {
diff --git a/src/assets/css/components/views/setting/knowledgeBase.scss b/src/assets/css/components/views/setting/knowledgeBase.scss
index f3af03a8..44efdcea 100644
--- a/src/assets/css/components/views/setting/knowledgeBase.scss
+++ b/src/assets/css/components/views/setting/knowledgeBase.scss
@@ -169,6 +169,8 @@
align-items: center;
.card-title-name {
width:100%;
+ height: 19.2px;
+ line-height: 19.2px;
overflow: hidden; //超出的文本隐藏
text-overflow: ellipsis; //溢出用省略号显示
white-space:nowrap;
@@ -996,6 +998,10 @@
padding-left: 20px;
overflow: auto;
+ .el-form--label-top .el-form-item .el-form-item__label {
+ margin-bottom: 3px !important;
+ }
+
.enable-form__mt {
.el-form {
margin-top:6px;
@@ -1176,6 +1182,7 @@
}
.el-textarea__inner {
padding-left: 8px;
+ font-size: 12px;
}
.form-select__disable {
@@ -1188,6 +1195,13 @@
.form-select__enable {
width: 100%;
+ .el-select__wrapper {
+ //padding-left: 22px !important;
+ .el-select__inner {
+ background-color: #521919 !important;
+ padding-left: 22px !important;
+ }
+ }
.el-input__inner {
background-color: white !important;
padding-left: 22px !important;
@@ -1899,6 +1913,7 @@
padding-top:0px;
padding-right:30px;
padding-left:30px;
+ padding-bottom:30px;
.dialog-message {
padding-left:0px !important;
padding-right:0px !important;
@@ -1920,12 +1935,21 @@
&.update-dialog__table--system-user {
height: calc(100% - 139px);
}
+ &.el-table .el-table__cell {
+ padding: 12px 0 !important;
+ }
+ &.el-table .el-table__row .el-table__cell {
+ padding: 8px 0 !important;
+ }
}
.update-knowledge-form {
.el-upload {
width:100%;
}
.form-input {
+ .el-input__wrapper {
+ padding: 1px 16px !important;
+ }
.el-input__inner{
padding-right: 50px !important;
font-size: 14px;
@@ -1936,7 +1960,8 @@
border: 1px solid rgba(222,222,222,1);
box-shadow: 0px 2px 4px 0px rgba(51,51,51,0.02);
border-radius: 2px;
- width:100%;
+ //width:100%;
+ width: 1020px;
height:28px;
min-height:28px !important;
color: #575757;
@@ -1962,6 +1987,16 @@
}
.knowledge-remark {
margin-bottom:0px !important;
+ .el-textarea__inner {
+ font-size: 12px;
+ padding: 5px 15px;
+ }
+ }
+ .el-form--label-top .el-form-item .el-form-item__label {
+ margin-bottom: 0 !important;
+ }
+ .el-form--default.el-form--label-top .el-form-item .el-form-item__label {
+ line-height: 14px;
}
}
.dialog-footer {
diff --git a/src/assets/css/components/views/system/Plugin.scss b/src/assets/css/components/views/system/Plugin.scss
index a8fe5573..a0f95128 100644
--- a/src/assets/css/components/views/system/Plugin.scss
+++ b/src/assets/css/components/views/system/Plugin.scss
@@ -43,4 +43,7 @@
-webkit-line-clamp: 2; // 超出多少行
-webkit-box-orient: vertical;
}
+ .cn-table .el-table:not(.chart-table) td {
+ padding: 8px 0 !important;
+ }
}
diff --git a/src/assets/css/themes/THEME_README.md b/src/assets/css/themes/THEME_README.md
index 0d022a63..837146ba 100644
--- a/src/assets/css/themes/THEME_README.md
+++ b/src/assets/css/themes/THEME_README.md
@@ -12,10 +12,10 @@
- // $arrow-selector: #{& + '__arrow'};
改为 $arrow-selector: '.el-popper__arrow';
-### 20240118element-plus升级
+### 20240118__element-plus升级
#### 变动事项
-- elemen-plus由1.0.2-beta.71升级至2.5.1,旧版本是将element-plus源文件放到theme/src中进行部分修改使用,现在启用该方法,直接使用element-plus组件,部分组件有差异改动,对比界面进行调整并记录在xxx.scss
+- elemen-plus由1.0.2-beta.71升级至2.5.1,旧版本是将element-plus源文件放到theme/src中进行部分修改使用,现在弃用该方案,直接使用element-plus组件,部分组件有差异改动,对比界面进行调整并记录在cover-element.scss
- 弃用之前的主题写法,改为官网的主题切换方法。删除body上的class,在html上添加class="dark"。默认明亮主题light,暗黑主题dark,默认引入theme-light.scss样式文件,暗黑主题theme-dark.scss样式文件
- 如需添加暗黑样式,先在theme-light.scss添加唯一样式名,再到theme-dark中添加同名样式。如在light中添加字体颜色$--text-color-1: #353636;,则需要在dark中添加$--text-color-1: #d8d8d8;
- header.vue的第四级面包屑导航栏,以及NetworkOverviewTabs.vue第一列搜索的popover。原结构的popover被上一层div包裹,但在html中解析成两个div,原来的popper-class需要提出来,不要在原div的class下,否则样式错乱
@@ -28,4 +28,6 @@
- icon图标:老版使用:。新版则是svg文件,需要单独引入封装成component的格式,使用时:
- select选择器:新版被el-select__wrapper的div包裹,与旧版顺序不同。
- * input和select的右侧图标和maxlength间距新版比旧版略大
-*
+- drawer抽屉:在header.vue中遇到,custom-class="cn-menu",渲染后class中没有cn-menu,也许是按需引入导致的,额外标注
+- message-box弹窗:新版在旧版的el-message-box的外层包裹了一层父div el-overlay-message-box,导致原样式会错乱
+- dialog: custom在2.4版本后被移除,使用class替代,插槽中的title也在2.4版本后移除,使用header替代
diff --git a/src/components/layout/Header.vue b/src/components/layout/Header.vue
index 6da5b2b3..3ccc4640 100644
--- a/src/components/layout/Header.vue
+++ b/src/components/layout/Header.vue
@@ -135,6 +135,7 @@
direction="ttb"
custom-class="cn-menu"
modal-class="cn-menu-modal"
+ class="cn-menu"
:with-header="false"
:show-close="false"
>
diff --git a/src/components/rightBox/settings/RoleBox.vue b/src/components/rightBox/settings/RoleBox.vue
index 1ed5fa35..7f6ce74f 100644
--- a/src/components/rightBox/settings/RoleBox.vue
+++ b/src/components/rightBox/settings/RoleBox.vue
@@ -27,8 +27,8 @@