diff --git a/nezha-fronted/src/assets/css/components/page/tool/ping.scss b/nezha-fronted/src/assets/css/components/page/tool/ping.scss index 592faf907..044b21297 100644 --- a/nezha-fronted/src/assets/css/components/page/tool/ping.scss +++ b/nezha-fronted/src/assets/css/components/page/tool/ping.scss @@ -1,4 +1,38 @@ .ping{ + .top-tool-left{ + // align-items: center; + } + .ipInput{ + width:250px; + min-height: 36px; + max-height: 62px; + } + .ti-tag-input{ + background: transparent ; + } + .vue-tags-input,.ti-new-tag-input { + .ti-input { + min-height: 36px; + max-height: 62px; + overflow-y: auto; + box-sizing: border-box; + border-radius: 2px; + border: 1px solid $--button-icon-border-color !important; + .ti-tag.ti-valid { + background-color: $--value-background-color; + color: $--value-color; + } + .ti-new-tag-input { + color: $--color-text-regular !important; + } + .ti-tags{ + .ti-tag{ + word-break: break-all; + } + } + } + .ti-input:hover{} + } .choose{ width: 50px !important; height: 36px !important; @@ -37,9 +71,14 @@ background: $--color-primary; } } - + .main-container{ + display: flex; + flex-direction: column; + } .nz-table2{ - height: calc(100% - 64px) !important; + height: auto !important; + overflow: hidden; + flex: 1; .empty{ width: 100%; height: 100%; @@ -47,7 +86,7 @@ justify-content: center; align-items: center; .el-steps{ - width: 620px; + width: 600px; } .el-step__icon{ width: 64px; @@ -77,6 +116,7 @@ } .data-wrap{ height: 100%; + overflow: hidden; .data-top{ width: 100%; padding-left: 15px; @@ -95,6 +135,7 @@ } .data-bottom{ height: calc(100% - 50px) !important; + overflow: hidden; .details{ padding: 20px; } diff --git a/nezha-fronted/src/assets/css/components/page/tool/trace.scss b/nezha-fronted/src/assets/css/components/page/tool/trace.scss index 1e51a79a0..e717af1f8 100644 --- a/nezha-fronted/src/assets/css/components/page/tool/trace.scss +++ b/nezha-fronted/src/assets/css/components/page/tool/trace.scss @@ -1,4 +1,38 @@ .trace{ + .top-tool-left{ + // align-items: center; + } + .ipInput{ + width:250px; + min-height: 36px; + max-height: 62px; + } + .ti-tag-input{ + background: transparent ; + } + .vue-tags-input,.ti-new-tag-input { + .ti-input { + min-height: 36px; + max-height: 62px; + overflow-y: auto; + box-sizing: border-box; + border-radius: 2px; + border: 1px solid $--button-icon-border-color !important; + .ti-tag.ti-valid { + background-color: $--value-background-color; + color: $--value-color; + } + .ti-new-tag-input { + color: $--color-text-regular !important; + } + .ti-tags{ + .ti-tag{ + word-break: break-all; + } + } + } + .ti-input:hover{} + } .choose{ width: 50px !important; height: 36px !important; @@ -37,9 +71,14 @@ background: $--color-primary; } } - + .main-container{ + display: flex; + flex-direction: column; + } .nz-table2{ - height: calc(100% - 64px) !important; + height: auto !important; + overflow: hidden; + flex: 1; .empty{ width: 100%; height: 100%; @@ -47,7 +86,7 @@ justify-content: center; align-items: center; .el-steps{ - width: 620px; + width: 600px; } .el-step__icon{ width: 64px; @@ -77,6 +116,7 @@ } .data-wrap{ height: 100%; + overflow: hidden; .data-top{ width: 100%; padding-left: 15px; @@ -95,6 +135,7 @@ } .data-bottom{ height: calc(100% - 50px) !important; + overflow: hidden; .details{ padding: 20px; } diff --git a/nezha-fronted/src/components/common/table/tool/pingTable.vue b/nezha-fronted/src/components/common/table/tool/pingTable.vue index 2f01f65c4..96292d368 100644 --- a/nezha-fronted/src/components/common/table/tool/pingTable.vue +++ b/nezha-fronted/src/components/common/table/tool/pingTable.vue @@ -67,35 +67,43 @@ export default { { label: this.$t('overall.dc'), prop: 'dc', - sortable: true + sortable: true, + minWidth: 200 }, { label: this.$t('ping.sourceIp'), prop: 'source', - sortable: true + sortable: true, + minWidth: 200 }, { label: this.$t('ping.targetIp'), prop: 'ip', - sortable: true + sortable: true, + minWidth: 200 }, { label: this.$t('overall.state'), prop: 'state', - sortable: true + sortable: true, + width: 150 }, { label: this.$t('ping.packetLossRate'), prop: 'rate', - sortable: true + sortable: true, + minWidth: 200 }, { label: this.$t('ping.rttAverage'), prop: 'avg', - sortable: true + sortable: true, + minWidth: 200 }, { label: this.$t('ping.rttMinimum'), prop: 'min', - sortable: true + sortable: true, + minWidth: 200 }, { label: this.$t('ping.rttMaximum'), prop: 'max', - sortable: true + sortable: true, + minWidth: 200 } ] } diff --git a/nezha-fronted/src/components/page/alert/alertMessage.vue b/nezha-fronted/src/components/page/alert/alertMessage.vue index 326d0d473..138d00847 100644 --- a/nezha-fronted/src/components/page/alert/alertMessage.vue +++ b/nezha-fronted/src/components/page/alert/alertMessage.vue @@ -18,7 +18,7 @@ - +