gfwleak/nezha-nezha-fronted
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

NEZ-1072 feat: 主题内容

Browse Source
This commit is contained in:
chenjinsong
2021-11-04 09:29:01 +08:00
parent 543503c571
commit 561313d68c
43 changed files with 312 additions and 848 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
nezha-fronted/src/assets/css/common.scss
View File

@@ -176,3 +176,10 @@ td .nz-icon-gear:before{
fill: currentColor;
overflow: hidden;
}
.time-no-data {
text-align: center;
width: 100%;
color: $--color-text-secondary;
font-family: NotoSans !important;
font-size: 12px !important;
}

121
nezha-fronted/src/assets/css/common/button.scss
View File

@@ -36,62 +36,25 @@
opacity: 1;
color: white;
}
.nz-btn.nz-btn-size-normal {
font-size: 12px;
height: 28px;
padding: 0 8px;
}
.nz-btn.nz-btn-size-small {
font-size: 12px;
padding: 2px 5px;
}
.nz-btn.nz-btn-size-small i {
font-size: 12px;
}
.nz-btn-size-large {
padding: 0 15px;
height: 28px;
}
.nz-btn.nz-btn-style-light { /* 浅色按钮 */
background-image: $--background-color-empty;
border:0;
color: $--color-text-regular;
box-shadow: 0 0 1px 1px rgba(162,162,162,0.50);
letter-spacing: 0;
}
.nz-btn.nz-btn-style-pure-white { /*纯白色按钮*/
background-color: $--background-color-empty;
color: #444;
border: 1px solid #dcdfe6;
}
.nz-btn.nz-btn-size-small.nz-btn-style-square { /* 单图标时是个正方形*/
padding: 2px 5px;
}
.nz-btn.nz-btn-size-normal.nz-btn-style-square { /* 单图标时是个正方形*/
padding: 4px 6px;
}
.nz-btn.nz-btn-style-light:hover:not(.nz-btn-disabled) {
//background-image: $--background-color-empty-hover;
}
.nz-btn.nz-btn-style-pure-white:hover:not(.nz-btn-disabled) {
background-color: $--border-color-base;
}
.nz-btn.nz-btn-size-normal-new{
.nz-btn.nz-btn-size-normal {
height: 30px;
line-height: 30px;
text-align: center;
min-width: 74px;
padding: 0 10px;
}
.nz-btn.nz-btn-size-small-new{
.nz-btn.nz-btn-size-small {
height: 24px;
line-height: 22px;
text-align: center;
min-width: 60px;
padding: 0 10px;
}
.nz-btn.nz-btn-size-mini-new{
.nz-btn.nz-btn-size-mini {
height: 22px;
line-height: 22px;
text-align: center;
@@ -99,49 +62,69 @@
padding: 0 5px;
}
.nz-btn.nz-btn-style-normal { /* 新版橙色按钮 */
background: $--color-primary;
color: white;
border: 1px solid $--color-primary;
background: $--button-primary-background-color;
color: $--button-primary-color;
border: 1px solid $--button-primary-background-color;
}
.nz-btn.nz-btn-style-error-new { /* 新版红色色按钮 */
background: #EF7C62;
color: white;
border: 1px solid #EF7C62;
.nz-btn.nz-btn-style-error { /* 红色按钮 */
background: $--color-danger;
color: $--button-primary-color;
border: 1px solid $--color-danger;
}
.nz-btn.nz-btn-style-light-new { /* 新版浅色按钮 */
background: $--background-color-empty;
border: 1px solid $--border-color-base;
color: $--color-text-regular;
.nz-btn.nz-btn-style-gray { /* 灰色按钮 */
background: $--button-gray-background-color;
border: 1px solid $--button-gray-border-color;
color: $--button-gray-color;
letter-spacing: 0;
}
.nz-btn.nz-btn-style-normal:hover:not(.nz-btn-disabled) { /* 新版橙色按钮hover */
background: $--color-primary;
color: white;
border: 1px solid $--color-primary;
.nz-btn.nz-btn-style-light-gray { /* 浅灰色按钮 */
background: $--button-light-gray-background-color;
border: 1px solid $--button-light-gray-border-color;
color: $--button-light-gray-color;
letter-spacing: 0;
}
.nz-btn.nz-btn-style-error-new:hover:not(.nz-btn-disabled) { /* 新版红色按钮hover */
.nz-btn.nz-btn-style-normal:hover:not(.nz-btn-disabled) { /* 橙色按钮hover */
background: $--button-primary-hover-background-color;
color: $--button-primary-color;
border: 1px solid $--button-primary-hover-background-color;
}
.nz-btn.nz-btn-style-error:hover:not(.nz-btn-disabled) { /* 红色按钮hover */
background: #F38b73;
color: white;
color: $--button-primary-color;
border: 1px solid #F38b73;
}
.nz-btn.nz-btn-style-light-new:hover:not(.nz-btn-disabled) { /* 新版浅色按钮hover */
border: 1px solid rgba(250,144,28,0.3);
color: $--color-text-regular;
.nz-btn.nz-btn-style-gray:hover:not(.nz-btn-disabled) { /* 灰色按钮hover */
border: 1px solid $--button-gray-hover-border-color;
background: $--button-gray-hover-background-color;
color: $--button-gray-hover-color;
letter-spacing: 0;
}
.nz-btn.nz-btn-style-normal:active:not(.nz-btn-disabled) { /* 新版橙色按钮active' */
background: $--color-primary;
color: white;
border-color: $--color-primary;
.nz-btn.nz-btn-style-gray:hover:not(.nz-btn-disabled) { /* 浅灰色按钮hover */
border: 1px solid $--button-light-gray-hover-border-color;
background: $--button-light-gray-hover-background-color;
color: $--button-light-gray-hover-color;
letter-spacing: 0;
}
.nz-btn.nz-btn-style-error-new:active:not(.nz-btn-disabled) { /* 新版红色按钮active' */
.nz-btn.nz-btn-style-normal:active:not(.nz-btn-disabled) { /* 橙色按钮active' */
background: $--button-primary-active-background-color;
color: $--button-primary-color;
border-color: $--button-primary-active-background-color;
}
.nz-btn.nz-btn-style-error:active:not(.nz-btn-disabled) { /* 红色按钮active' */
background: #EF7C62;
color: white;
color: $--button-primary-color;
border-color: #Eb6D51;
}
.nz-btn.nz-btn-style-light-new:active:not(.nz-btn-disabled) { /* 新版浅色按钮active*/
border: 1px solid $--color-primary;
color: $--color-primary;
.nz-btn.nz-btn-style-gray:active:not(.nz-btn-disabled) { /* 灰色按钮active*/
background: $--button-gray-active-background-color;
border: 1px solid $--button-gray-active-border-color;
color: $--button-gray-active-color;
letter-spacing: 0;
}
.nz-btn.nz-btn-style-gray:active:not(.nz-btn-disabled) { /* 浅灰色按钮active*/
background: $--button-light-gray-active-background-color;
border: 1px solid $--button-light-gray-active-border-color;
color: $--button-light-gray-active-color;
letter-spacing: 0;
}

43
nezha-fronted/src/assets/css/common/tableCommon.scss
View File

@@ -74,17 +74,27 @@
height: 32px;
width: 36px;
cursor: pointer;
border: 1px solid $--border-color-base;
border: 1px solid $--button-gray-border-color;
outline: none;
border-radius: $--button-border-radius;
background-color: $--button-gray-background-color;
transition: background-color linear .1s;
color: $--button-gray-color;
i {
font-size: 14px;
color: $--button-gray-color;
}
}
.top-tool-btn.top-tool-btn--light-gray {
border: 1px solid $--button-light-gray-border-color;
color: $--button-light-gray-color;
background-color: $--button-light-gray-background-color;
i {
color: $--button-light-gray-color;
}
}
.top-tool-btn.top-tool-btn--text {
padding: 0 8px;
width: unset;
@@ -92,10 +102,36 @@
}
.top-tool-btn:hover:not(.nz-btn-disabled) {
background-color: $--button-gray-hover-background-color;
border: 1px solid $--button-gray-hover-border-color;
color: $--button-gray-hover-color;
i {
color: $--button-gray-hover-color;
}
}
.top-tool-btn:focus:not(.nz-btn-disabled), .top-tool-btn.is-focus {
background-color: $--button-gray-active-background-color;
border: 1px solid $--button-gray-active-border-color;
color: $--button-gray-active-color;
i {
color: $--button-gray-active-color;
}
}
.top-tool-btn.top-tool-btn--light-gray:hover:not(.nz-btn-disabled) {
background-color: $--button-gray-hover-background-color;
border: 1px solid #FBCEA4 !important;
border: 1px solid $--button-gray-hover-border-color;
color: $--button-gray-hover-color;
i {
color: $--button-gray-hover-color;
}
}
.top-tool-btn.top-tool-btn--light-gray:focus:not(.nz-btn-disabled), .top-tool-btn.top-tool-btn--light-gray.is-focus {
background-color: $--button-gray-active-background-color;
border: 1px solid $--button-gray-active-border-color;
color: $--button-gray-active-color;
i {
color: $--button-gray-active-color;
}
@@ -103,7 +139,6 @@
.top-tool-btn--delete.top-tool-btn:focus:not(.nz-btn-disabled) {
background-color: $--button-gray-hover-background-color;
border-color: #FFC4B9;
i {
color: #F0745A;
}
@@ -494,7 +529,7 @@
/*table提示样式*/
.el-tooltip__popper.is-light {
border: 1px solid #EBEEF5;
color: #606266;
color: $--color-text-regular;
box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
}
.col-resize-area {

47
nezha-fronted/src/assets/css/components/charts/chart.scss
View File

@@ -285,6 +285,10 @@
}
}
}
.single-stat-content{
background-color: $--background-color-empty;
color: $--color-text-primary;
}
.single-stat-screen-container{
height: 100%;
.single-stat-content{
@@ -690,49 +694,6 @@
padding: 1px 0;
}
}
.top-tool-btn-group {
display: flex;
.top-tool-btn:not(:last-of-type):not(:first-of-type) {
border-left: none;
border-radius: 0;
}
.top-tool-btn:first-of-type:not(:last-of-type) {
border-radius: $--button-border-radius 0 0 $--button-border-radius;
}
.top-tool-btn:last-of-type:not(:first-of-type) {
border-radius: 0 $--button-border-radius $--button-border-radius 0;
border-left: none;
}
}
.top-tool-btn {
height: 32px;
width: 36px;
border: 1px solid $--border-color-base;
outline: none;
border-radius: $--button-border-radius;
background-color: $--button-gray-background-color;
transition: background-color linear .1s;
i {
font-size: 14px;
color: $--button-gray-color;
}
}
.top-tool-btn.top-tool-btn--text {
padding: 0 8px;
width: unset;
color: $--color-text-regular;
}
.top-tool-btn:hover:not(.nz-btn-disabled) {
background-color: $--button-gray-hover-background-color;
}
.top-tool-btn:focus:not(.nz-btn-disabled), .top-tool-btn.is-focus {
background-color: $--button-gray-hover-background-color;
border: 1px solid $--color-primary !important;
i {
color: $--button-gray-active-color;
}
}
.line-area-box{
height: 100%;
width: 100%;

2
nezha-fronted/src/assets/css/components/cli/webSSH.scss
View File

@@ -235,7 +235,7 @@ div.sp-header{
.flex .el-form-item__content {
display: flex;
}
.nz-btn-style-normal-new {
.nz-btn-style-normal {
margin-left: 10px;
margin-top: 2px;
}

4
nezha-fronted/src/assets/css/components/common/loading.scss
View File

@@ -2,7 +2,5 @@
.loading-font {
color: #232f3e !important;
}
.el-loading-mask {
background-color: $--background-color-empty;
}
background-color: $--background-color-empty;
}

2
nezha-fronted/src/assets/css/components/common/project/L5/CanvasProps.scss
View File

@@ -500,7 +500,7 @@
.color-tab div {
text-align: center;
flex: 1;
color: #909399;
color: $--color-text-secondary;
transition: all .3s cubic-bezier(.645, .045, .355, 1);
background: #E4E7ED;
cursor: pointer;

617
nezha-fronted/src/assets/css/components/common/project/chart.scss
View File

@@ -1,597 +1,52 @@
.clearfix:after{
display: block;
content: "";
clear: both;
}
.clearfix{
margin-bottom: 0;
}
.hidden{
visibility: hidden;
}
.visible{
visibility: visible;
}
.legend-shape{
display:inline-block;
margin-right:5px;
border-radius:10px;
width:15px;
height:5px;
vertical-align: middle;
}
.ft-gr{
color:lightgray;
}
.legend-container{
width: calc(100% - 30px);
max-height:80px;
min-height:25px;
font-size:12px;
text-align:left;
left: 10px;
bottom: 0;
line-height: 18px;
position: absolute;
padding-bottom:3px;
}
.nz-icon-warning{
color: #e6a23c;
}
.legend-container-screen.legend-container {
max-height: 80px;
min-height:25px;
}
.legend-item{
text-overflow:ellipsis;
white-space:nowrap;
/*width:100%;*/
margin-right:10px;
overflow-x:hidden;
cursor:pointer;
display:inline-block;
float:left;
line-height: 20px;
}
.nz-chart-dropdown {
height: 180px;
li {
padding-left:15px !important;
padding-right:0 !important;
width:140px;
text-align: left;
i {
margin-right: 10px;
.project {
.nz-chart-dropdown {
height: 180px;
li {
width:140px;
}
}
}
.nz-chart-dropdown-one {
height: 36px;
li {
padding-left:15px !important;
padding-right:0 !important;
width:140px;
text-align: left;
i {
margin-right: 10px;
.nz-chart-dropdown-one {
li {
width:140px;
}
}
}
.panel-info-corner {
color: #767980;
cursor: pointer;
position: absolute;
display: none;
left: 0;
width: 28px;
height: 28px;
z-index: 2;
top: 0;
}
.panel-info-corner--error {
display: block;
color: #fff;
}
.panel-info-corner .fa {
position: relative;
top: -4px;
left: -6px;
font-size: 75%;
z-index: 3;
}
.panel-info-corner .fa-model {
position: relative;
top: -3px;
left: 4px;
font-size: 75%;
z-index: 3;
}
.fa, .fa-model{
display: inline-block;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
}
.panel-info-corner--error .panel-info-corner-inner {
border-left: 28px solid #e02f44;
border-right: none;
border-bottom: 28px solid rgba(0,0,0,0);
}
.panel-info-corner-inner {
width: 0;
height: 0;
position: absolute;
left: 0;
bottom: 0;
}
.chart-error-popper[x-placement^=top] .popper__arrow::after {
border-top-color: #e02f44;
bottom:0px;
}
.chart-error-popper[x-placement^=bottom] .popper__arrow::after {
border-bottom-color: #e02f44;
}
.popper__arrow::after{
border:solid 3px yellow
}
.chart-error-popper{
background-color:#e02f44;
color:#FFF;
word-wrap:break-word;
word-break:break-word;
max-width:280px;
border: 1px solid #e02f44;
}
.chart-warring-popper[x-placement^=top] .popper__arrow::after {
border-top-color: #e6a23c;
bottom:0;
}
.chart-warring-popper[x-placement^=bottom] .popper__arrow::after {
border-bottom-color: #e6a23c;
}
.popper__arrow::after{
border:solid 3px yellow
}
.chart-warring-popper{
background-color:#e6a23c;
color:#FFF;
word-wrap:break-word;
word-break:break-word;
max-width:280px;
border: 1px solid #e6a23c;
}
.moreTitle{
.panel-info-corner--error .panel-info-corner-inner {
border-left: 28px solid #e6a23c;
border-right: none;
border-bottom: 28px solid rgba(0,0,0,0);
}
.panel-info-corner-inner {
width: 0;
height: 0;
position: absolute;
left: 0;
bottom: 0;
}
.nz-icon-warning:before {
color: #fff;
}
}
.nz-chart-resize {
height: 100%;
width: 100%;
position: relative;
}
.resize-box {
border: 1px solid #d8dce1;
position: absolute;
box-sizing: border-box;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
.resize-shadow {
height: 100%;
width: 100%;
position: absolute;
box-sizing: border-box;
}
.resize-shadow-active {
background-color: #f5f9ff;
border: 1px solid #b7d0f7;
box-shadow: 1px 1px 1px #d3e1f8;
}
.drag-disabled .el-dropdown-link {
cursor: default !important;
}
.resize-box {
.pagination {
padding-top: 0;
}
.success {
background-color: #50d050;
color: white;
padding: 2px 5px;
border-radius: 4px;
}
.danger {
background-color: #d64f40;
color: white;
padding:2px 5px;
border-radius: 4px;
}
.chart-table, .chart-alert-info {
width: 100%;
.table-container {
padding: 0 6px;
box-sizing: border-box;
.nz-table {
margin-top: 6px;
box-sizing: border-box;
}
}
}
.chart-single-stat {
width: 100%;
.single-stat-container {
padding-left: 8px;
padding-right: 8px;
display: table;
text-align: center;
width: calc(100% - 16px);
.single-stat-content{
text-align:center;
vertical-align: middle;
display:table-cell;
font-size:30px;
}
}
}
.chart-container.chart-detail {
height: 100%;
position: relative;
background-color: white;
.chart-title:hover {
background-color:#d8dce1;
}
.chart-title:not(.drag-disabled) {
cursor: move;
}
.chart-title {
text-align: center;
width: 100%;
line-height: 30px;
padding: 1px 3px 0 3px;
box-sizing: border-box;
.nz-chart-top{
width:100%;
}
.el-dropdown-link {
.resize-box {
.chart-container.chart-detail {
.chart-title:not(.drag-disabled) {
cursor: move;
}
.nz-icon-arrow-down {
font-size: 12px;
}
.chart-title-text {
font-size: 14px;
line-height: 26px;
color: #52545c;
display:flex;
justify-content:center;
align-items:center;
max-width:calc(100% - 20px);
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
.chart-title-icon{
display: inline-block;
cursor: pointer;
}
}
}
.chart-info {
padding-top: 6px;
width: 100%;
height: calc(100% - 34px);
}
.active-icon {
margin: 0;
}
.chart-sub {
padding: 0 15px;
margin-bottom: 5px;
:last-of-type {
margin-bottom: 0;
}
}
.chart-sub-title {
background-color: #efefef;
font-size: 13px;
color: #505255;
padding-left: 2px;
height: 25px;
line-height: 25px;
user-select: none;
}
.chart-sub-content, .chart-third-content, .chart-forth-content {
width: 100%;
box-sizing: border-box;
>.content-item>.item-tip {
display: inline-block;
box-sizing: border-box;
}
>.content-item>.item-tip:not(.content-item-value-muti) {
padding: 0 3px 0 13px;
}
>.content-item {
font-size: 13px;
line-height: 26px;
border-top: 1px solid rgb(235, 238, 245);
display: flex;
position: relative;
flex-wrap: wrap;
.item-tip> {
.item-tip-hide {
display: none;
position: absolute;
bottom: 34px;
min-width: 50px;
white-space: normal;
}
.item-tip-key {
left: 17%;
transform: translateX(-50%);
width: 33%;
}
.item-tip-value {
left: 67%;
width: 63%;
transform: translateX(-50%);
}
.item-tip-hide::after {
content: '';
display: block;
width:0;
height:0;
overflow: hidden;
font-size: 0;
line-height: 0;
border: 5px;
border-style: dashed dashed solid dashed;
border-color: white transparent transparent transparent;
position: absolute;
left: 50%;
bottom: 0;
transform: translate(-50%, 10px);
}
}
.item-tip:hover>.item-tip-show {
display: block;
}
.item-tip.deep {
padding-left: 26px;
box-sizing: border-box;
height: 26px;
}
.item-tip.deepp {
padding-left: 39px;
box-sizing: border-box;
height: 26px;
}
.item-tip.deep:nth-of-type(2) {
padding-left: 13px;
box-sizing: border-box;
height: 26px;
}
.item-tip.deepp:last-of-type {
padding-left: 13px;
box-sizing: border-box;
height: 26px;
}
.tag-value:hover .item-tip-show {
display: block;
}
.tag-value {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.content-item-key {
color: #666;
width: 35%;
height: 26px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.content-item-key .no-overflow, .content-item-value .no-overflow {
text-overflow: unset;
white-space: normal;
}
.content-item-value {
.item-value-sub {
padding: 0 3px 0 13px;
box-sizing: border-box;
}
.item-value-sub:not(:last-of-type) {
border-bottom: 1px solid rgb(235, 238, 245);
}
.nz-table {
th .cell {
height: 25px;
line-height: 25px;
}
td .cell {
min-height: 26px;
line-height: 26px;
}
.el-table__body {
background-color: white;
}
.el-table__body tr:last-of-type td {
border: none;
}
.el-table__body tr td {
background-color: white;
}
.el-table__body tr:hover>td {
background-color: white;
}
}
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
border-left: 1px solid rgb(235, 238, 245);
color: #1a1a1a;
width: 65%;
height: 99%;
}
}
}
.chart-sub-content {
>.content-item:first-of-type {
border-top: none;
}
>.content-item:last-of-type {
border-bottom: 1px solid rgb(235, 238, 245);
}
}
}
.chart-url {
.url-container {
padding: 0 8px 8px 8px;
box-sizing: border-box;
}
}
.line-chart-block, .chart-table, .chart-single-stat, .chart-url, .chart-asset-info, .chart-alert-info, .chart-project-info, .chart-alert-rule-info ,.vis-network{
height: 100%;
position: relative;
background-color: white;
.chartTitle:hover {
background-color:#d8dce1;
}
.chartTitle {
text-align: center;
width: 100%;
line-height: 30px;
height: 28px;
padding: 1px 3px 0 3px;
box-sizing: border-box;
.nz-chart-top{
width:100%;
}
.el-dropdown-link {
cursor: move;
}
.nz-icon-arrow-down {
font-size: 12px;
}
.chart-title {
font-size: 16px;
line-height: 26px;
color: #52545c;
display:flex;
justify-content:center;
align-items:center;
.chart-title-text{
text-align: center;
width: 100%;
line-height: 30px;
padding: 1px 3px 0 3px;
box-sizing: border-box;
.nz-chart-top{
width:100%;
}
.el-dropdown-link {
cursor: move;
}
.nz-icon-arrow-down {
font-size: 12px;
}
.chart-title-text {
font-size: 14px;
line-height: 26px;
color: #52545c;
display:flex;
justify-content:center;
align-items:center;
max-width:calc(100% - 20px);
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
cursor: pointer;
}
.chart-title-icon{
display: inline-block;
cursor: pointer;
.chart-title-icon{
display: inline-block;
cursor: pointer;
}
}
}
}
.line-area {
box-sizing: border-box;
background: #FFF;
min-height: 95px;
padding-left:8px;
padding-right:8px;
}
.button-panel-height{
height:26px;
}
.button-panel-height button{
height:26px;
}
.edit {
position: absolute;
right: 20px;
top: 17px;
z-index: 10;
}
.chart-select {
position: absolute;
left: 40px;
top: 25px;
z-index: 10;
font-size: 14px;
.chart-select-btn {
margin-right: 10px;
cursor: pointer;
&.active {
color: #5aacff;
}
}
}
/*没有数据显示*/
.null {
position: absolute;
top: 50%;
width: 100%;
text-align: center;
font-size: 24px;
font-weight: 600;
}
}
}
.dialog-tool {
margin-right: 40px;
}
.line-chart-block-modal {
.el-dialog{
height: 80%;
}
.line-area {
box-sizing: border-box;
background: #FFF;
height: 100%;
span.highcharts-title {/*针对highcharts设置的样式，echarts需要修改？？*/
display: block !important;
width: 50%;
font-size: 14px !important;
overflow: hidden;
word-wrap: break-word !important;
white-space: pre-wrap !important;
}
}
.element-top-border {
padding-bottom: 5px;
border-top: 1px solid #dfe7f2;
margin-top:-25px;
}
.element-bottom-border {
border-bottom: 1px solid #dfe7f2;
margin-bottom:-20px;
}
.pt10{
padding-top:10px;
}
.el-dialog__body {
height: calc(100% - 80px);
}
.el-dialog__header{
padding: 20px 20px 0;
}
}

21
nezha-fronted/src/assets/css/components/common/project/topology.scss
View File

@@ -455,27 +455,6 @@
color: $--color-primary;
}
}
.top-tool-btn{
height: 32px;
width: 32px;
border: 1px solid $--border-color-base;
outline: none;
border-radius: 2px;
background-color: $--background-color-base;
-webkit-transition: background-color linear .1s;
transition: background-color linear .1s;
padding: 0;
}
.top-tool-btn:hover{
background-color: $--background-color-empty;
}
.top-tool-btn:focus{
background-color: $--background-color-empty;
border-color: #FBCEA4;
}
.top-tool-btn:focus .nz-icon{
color: #FBCEA4;
}
.right-bottom-zoom{
position: absolute;
bottom: 30px;

21
nezha-fronted/src/assets/css/components/common/rightBox/addEndpointBox.scss
View File

@@ -94,27 +94,6 @@
text-align: center;
line-height: 28px;
}
.top-tool-btn{
height: 32px;
width: 32px;
border: 1px solid $--border-color-base;
outline: none;
border-radius: 2px;
background-color: $--background-color-base;
-webkit-transition: background-color linear .1s;
transition: background-color linear .1s;
padding: 0;
}
.top-tool-btn:hover{
background-color: $--background-color-empty;
}
.top-tool-btn:focus{
background-color: $--background-color-empty;
border-color: #FBCEA4;
}
.top-tool-btn:focus .nz-icon{
color: #FBCEA4;
}
.el-form-item__content .el-input-group {
vertical-align: unset;
}

21
nezha-fronted/src/assets/css/components/common/rightBox/batchModifyEndpoint.scss
View File

@@ -212,27 +212,6 @@
text-align: center;
line-height: 28px;
}
.top-tool-btn{
height: 32px;
width: 32px;
border: 1px solid $--border-color-base;
outline: none;
border-radius: 2px;
background-color: $--background-color-base;
-webkit-transition: background-color linear .1s;
transition: background-color linear .1s;
padding: 0;
}
.top-tool-btn:hover{
background-color: #fff;
}
.top-tool-btn:focus{
background-color: #fff;
border-color: #FBCEA4;
}
.top-tool-btn:focus .nz-icon{
color: #FBCEA4;
}
.el-form-item__content .el-input-group {
vertical-align: unset;
}

4
nezha-fronted/src/assets/css/components/common/table/special/endpointQuery.scss
View File

@@ -16,11 +16,7 @@
}
.top-tool-btn--text {
background: $--background-color-empty;
border-radius: 2px 0 0 2px;
outline: none;
height: 32px;
border: 1px solid $--border-color-base;
border-right: none;
line-height: 30px;
margin-right: -5px;

6
nezha-fronted/src/assets/css/components/page/alert/nzAlertTag.scss
View File

@@ -49,10 +49,10 @@
}
}
.nz-alert-tag_info {
border-color: #909399;
border-color: $--color-text-secondary;
.nz-alert-tag__label {
border-right: 1px solid #909399;
background-color: #909399;
border-right: 1px solid $--color-text-secondary;
background-color: $--color-text-secondary;
color: white;
}
}

5
nezha-fronted/src/assets/css/components/page/dashboard/panel.scss
View File

@@ -21,6 +21,10 @@
overflow-y: auto;
height: calc(100% - 50px);
flex: 1;
background-color: $--dashboard-background-color-empty;
&>div {
background-color: $--dashboard-background-color-empty;
}
}
.box-content {
@@ -66,4 +70,5 @@
text-overflow:ellipsis;
white-space:nowrap;
vertical-align: bottom;
color: $--color-text-primary;
}

1
nezha-fronted/src/assets/css/font/metricPreview.scss
View File

@@ -9,7 +9,6 @@
}
.table-list {
padding-top: 20px;
overflow-y:auto;
height: 100%;
}
.row-width{

12
nezha-fronted/src/assets/css/themes/common.scss
View File

@@ -2,16 +2,4 @@
/* 按钮 */
$--button-border-radius: $--border-radius-small; // 按钮圆角
$--button-primary-color: $--background-color-empty; // 普通按钮字色
$--button-primary-background-color: $--color-primary; // 普通按钮背景色
$--button-gray-color: $--color-text-regular; // 灰色按钮字色
$--button-gray-hover-color: $--button-gray-color; // 灰色按钮hover字色
$--button-gray-active-color: $--color-primary; // 灰色按钮focus字色
$--button-gray-background-color: $--background-color-base; // 灰色按钮背景色
$--button-gray-hover-background-color: $--background-color-empty; // 灰色按钮hover背景色
$--button-gray-active-background-color: $--button-gray-hover-background-color; // 灰色按钮focus背景色
$--button-gray-border-color: $--border-color-base; // 灰色按钮边框色
$--button-gray-hover-border-color: $--button-gray-border-color; // 灰色按钮hover边框色
$--pop-box-shadow: 0 0 12px 0 rgba(0,0,0,0.2);

8
nezha-fronted/src/assets/css/themes/src/image.scss
View File

@@ -77,7 +77,7 @@
height: 40px;
font-size: 24px;
color: #fff;
background-color: #606266;
background-color: $--color-text-regular;
}
@include e(canvas) {
@@ -95,7 +95,7 @@
width: 282px;
height: 44px;
padding: 0 23px;
background-color: #606266;
background-color: $--color-text-regular;
border-color: #fff;
border-radius: 22px;
@@ -119,7 +119,7 @@
height: 44px;
font-size: 24px;
color: #fff;
background-color: #606266;
background-color: $--color-text-regular;
border-color: #fff;
left: 40px;
}
@@ -131,7 +131,7 @@
height: 44px;
font-size: 24px;
color: #fff;
background-color: #606266;
background-color: $--color-text-regular;
border-color: #fff;
right: 40px;
text-indent: 2px;

29
nezha-fronted/src/assets/css/themes/theme-dark.scss
View File

@@ -22,7 +22,7 @@ $--menu-item-hover-fill: #191A1E;
/* 3.字色 */
// 标题字色
$--color-text-primary: #FFFFFE;
$--color-text-primary: #D8D8D8;
// 普通字色
$--color-text-regular: #BEBEBE;
// 次要字色
@@ -85,6 +85,33 @@ $--dropdown-menu-box-shadow-color: rgba(8,3,3,0.77);
/* 11.input */
$--input-background-color: $--background-color-base;
/* 12.按钮 */
$--button-primary-color: #FFFFFE; // 普通按钮字色
$--button-primary-background-color: $--color-primary; // 普通按钮背景色
$--button-primary-hover-background-color: mix(#FFF, $--color-primary, 10%);
$--button-primary-active-background-color: mix(#000, $--color-primary, 10%);
// 黑暗模式下，灰按钮有两种色值，明亮模式下只有一种；为了区分黑暗模式的两种按钮，此处设button-gray和button-light-gray两种前缀，颜色一深一浅，明亮模式下这两种的色值是一样的；
// button-gray用于普通列表顶部的按钮，button-light-gray用户dashboard、panel顶部按钮
$--button-gray-color: $--color-text-secondary; // 灰色按钮字色
$--button-gray-hover-color: mix(#FFF, $--color-primary, 10%); // 灰色按钮hover字色
$--button-gray-active-color: mix(#000, $--color-primary, 10%); // 灰色按钮focus字色
$--button-gray-background-color: $--background-color-base; // 灰色按钮背景色
$--button-gray-hover-background-color: $--background-color-base; // 灰色按钮hover背景色
$--button-gray-active-background-color: $--background-color-base; // 灰色按钮focus背景色
$--button-gray-border-color: $--border-color-base; // 灰色按钮边框色
$--button-gray-hover-border-color: $--button-gray-hover-color; // 灰色按钮hover边框色
$--button-gray-active-border-color: $--button-gray-active-color; // 灰色按钮focus边框色
$--button-light-gray-color: $--color-text-secondary; // 灰色按钮字色
$--button-light-gray-hover-color: $--button-gray-hover-color; // 灰色按钮hover字色
$--button-light-gray-active-color: $--button-gray-active-color; // 灰色按钮focus字色
$--button-light-gray-background-color: $--background-color-empty; // 灰色按钮背景色
$--button-light-gray-hover-background-color: $--background-color-empty; // 灰色按钮hover背景色
$--button-light-gray-active-background-color: $--background-color-empty; // 灰色按钮focus背景色
$--button-light-gray-border-color: $--background-color-empty; // 灰色按钮边框色
$--button-light-gray-hover-border-color: $--button-gray-hover-border-color; // 灰色按钮hover边框色
$--button-light-gray-active-border-color: $--button-gray-active-border-color; // 灰色按钮focus边框色

28
nezha-fronted/src/assets/css/themes/theme-light.scss
View File

@@ -85,6 +85,34 @@ $--dropdown-menu-box-shadow-color: rgba(0, 0, 0, 0.1);
/* 11.input */
$--input-background-color: $--background-color-empty;
/* 12.按钮 */
$--button-primary-color: #FFFFFE; // 普通按钮字色
$--button-primary-background-color: $--color-primary; // 普通按钮背景色
$--button-primary-hover-background-color: mix(#FFF, $--color-primary, 10%);
$--button-primary-active-background-color: mix(#000, $--color-primary, 10%);
// 黑暗模式下，灰按钮有两种色值，明亮模式下只有一种；为了区分黑暗模式的两种按钮，此处设button-gray和button-light-gray两种前缀，颜色一深一浅，明亮模式下这两种的色值是一样的；
// button-gray用于普通列表顶部的按钮，button-light-gray用户dashboard、panel顶部按钮
$--button-gray-color: $--color-text-regular; // 灰色按钮字色
$--button-gray-hover-color: $--button-gray-color; // 灰色按钮hover字色
$--button-gray-active-color: $--color-primary; // 灰色按钮focus字色
$--button-gray-background-color: $--background-color-base; // 灰色按钮背景色
$--button-gray-hover-background-color: $--background-color-empty; // 灰色按钮hover背景色
$--button-gray-active-background-color: $--button-gray-hover-background-color; // 灰色按钮focus背景色
$--button-gray-border-color: $--border-color-base; // 灰色按钮边框色
$--button-gray-hover-border-color: $--button-gray-border-color; // 灰色按钮hover边框色
$--button-gray-active-border-color: $--button-gray-active-color; // 灰色按钮focus边框色
$--button-light-gray-color: $--color-text-regular; // 灰色按钮字色
$--button-light-gray-hover-color: $--button-gray-color; // 灰色按钮hover字色
$--button-light-gray-active-color: $--color-primary; // 灰色按钮focus字色
$--button-light-gray-background-color: $--background-color-base; // 灰色按钮背景色
$--button-light-gray-hover-background-color: $--background-color-empty; // 灰色按钮hover背景色
$--button-light-gray-active-background-color: $--button-gray-hover-background-color; // 灰色按钮focus背景色
$--button-light-gray-border-color: $--border-color-base; // 灰色按钮边框色
$--button-light-gray-hover-border-color: $--button-gray-border-color; // 灰色按钮hover边框色
$--button-light-gray-active-border-color: $--button-gray-border-color; // 灰色按钮focus边框色
/*** themes/common.scss是与主题切换无关的变量 ***/
@import './src/common/var.scss';

8
nezha-fronted/src/assets/stylus/main.scss
View File

@@ -1043,10 +1043,10 @@ li {
.el-message-box__btns {
.el-button:not(.el-button--primary):focus{
color: #606266;
color: $--color-text-regular;
}
.el-button:not(.el-button--primary):hover {
color: #606266;
color: $--color-text-regular;
opacity: .8;
border-color: #DCDFE6;
background-color: $--background-color-empty;
@@ -1327,7 +1327,7 @@ li {
background-color: #FAFAFA;
}
.el-dropdown-multi .el-dropdown-menu__item:focus {
color: #606266;
color: $--color-text-regular;
}
/*一些单选label宽度设为一样*/
.same-label-width .el-radio-button__inner {
@@ -1345,7 +1345,7 @@ li {
top:50%;
width:100%;
text-align:center;
color: #909399;
color: $--color-text-secondary;
font-family: NotoSans !important;
font-size: 12px !important;
}

4
nezha-fronted/src/components/charts/chart-single-stat.vue
View File

@@ -52,7 +52,7 @@
</el-dropdown>
</div>
<div class="mt-10 single-stat-container" v-cloak v-show="firstShow" >
<div :id="'chartContainer'+chartIndex" :style="{color:mapping?mapping.color.text:'#000',background:mapping?mapping.color.bac:'#fff'}" class="single-stat-content" ref="chartContainer">
<div :id="'chartContainer'+chartIndex" ref="chartContainer" :style="{color:mapping?mapping.color.text:'',background:mapping?mapping.color.bac:''}" class="single-stat-content">
{{serieSingleStat}}
<div class="chart-no-data" v-show="noData">No Data</div>
</div>
@@ -68,7 +68,7 @@
</div>
</div>
<div class="single-stat-screen-container" >
<div :style="{color:mapping?mapping.color.text:'#000',background:mapping?mapping.color.bac:'#fff'}" class="single-stat-content" id="chartScreenContainer" ref="chartScreenContainer">
<div id="chartScreenContainer" ref="chartScreenContainer" :style="{color:mapping?mapping.color.text:'',background:mapping?mapping.color.bac:''}" class="single-stat-content">
{{serieSingleStat}}
<div class="chart-no-data" v-show="noData">No Data</div>
</div>

2
nezha-fronted/src/components/cli/webSSH.vue
View File

@@ -168,7 +168,7 @@
:placeholder="$t('dashboard.panel.chartForm.selectAsset')"
id="box-input-asset-id"
:result-format="resultFormat"></v-selectpage>
<button @click.prevent="connect" type="button" :disabled="prevent_opt.save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new">Connect</button>
<button :disabled="prevent_opt.save" class="nz-btn nz-btn-size-normal nz-btn-style-normal" type="button" @click.prevent="connect">Connect</button>
</el-form-item>
</el-form>
</div>

10
nezha-fronted/src/components/common/ChartDiagram/diagram.vue
View File

@@ -104,18 +104,18 @@
>
{{$t('project.topology.preview')}}
</button>
<button @click="previewExit" v-if="isPreview" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new"
<button v-if="isPreview" class="nz-btn nz-btn-size-normal nz-btn-style-light-new" @click="previewExit"
style="margin-right: 20px"
>
{{$t('project.topology.previewExit')}}
</button>
<button @click="saveTopology" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new"
<button class="nz-btn nz-btn-size-normal nz-btn-style-normal" @click="saveTopology"
:disabled="prevent_opt.save"
:class="{'nz-btn-disabled':prevent_opt.save}"
style="margin-right: 20px">
{{$t('project.topology.save')}}
</button>
<button @click="cancelTopology" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" style="margin-right: 20px">
<button class="nz-btn nz-btn-size-normal nz-btn-style-normal" style="margin-right: 20px" @click="cancelTopology">
{{$t('project.topology.exit')}}
</button>
</span>
@@ -294,11 +294,11 @@
</el-row>
<div class="upload-pic-row" style="text-align: center">
<span>
<button @click="uploadPicShow=false" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" style="margin-right: 20px">
<button class="nz-btn nz-btn-size-normal nz-btn-style-light-new" style="margin-right: 20px" @click="uploadPicShow=false">
{{$t('project.topology.exit')}}
</button>
<button @click="imgUpload" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new"
<button class="nz-btn nz-btn-size-normal nz-btn-style-normal" @click="imgUpload"
v-has="'topo_icon_save'" :disabled="prevent_opt.save"
:class="{'nz-btn-disabled':prevent_opt.save}"
style="margin-right: 20px">

2
nezha-fronted/src/components/common/bottomBox/tabs/endpointQueryTab.vue
View File

@@ -114,7 +114,7 @@
{{$t("project.endpoint.dialogTitle")}}
<div class="float-right panel-calendar dialog-tool" style="display: flex">
<pick-time :refresh-data-func="queryChartDate" :use-refresh="false" v-model="searchTime" style="height: 28px;" @unitChange="chartUnitChange" id="endpoint-query-full-chart" :show-multiple="true" ref="pickTime"></pick-time>
<button @click="saveChart" class="nz-btn nz-btn-size-large nz-btn-style-normal-new" v-has="'project_endpoint_query_chart_toAdd'" id="endpoint-query-full-chart-save">{{$t('dashboard.metric.saveChart')}}</button>
<button id="endpoint-query-full-chart-save" v-has="'project_endpoint_query_chart_toAdd'" class="nz-btn nz-btn-size-large nz-btn-style-normal" @click="saveChart">{{$t('dashboard.metric.saveChart')}}</button>
</div>
</div>
<chart ref="endpointChart" :unit="chartUnit" :minusTime="minusTime"></chart>

8
nezha-fronted/src/components/common/elementSet.vue
View File

@@ -20,17 +20,17 @@
</div>
</div>
<div class="custom-bottom-btns">
<button v-if="isCancel" :id="tableId+'-element-set-none'" class="nz-btn nz-btn-size-small-new nz-btn-style-light-new is-cancel" type="button" @click="batchHandler(false)">
<button v-if="isCancel" :id="tableId+'-element-set-none'" class="nz-btn nz-btn-size-small nz-btn-style-light-new is-cancel" type="button" @click="batchHandler(false)">
<span class="top-tool-btn-txt">{{$t('overall.clear')}}</span>
</button>
<button v-if="!isCancel" :id="tableId+'-element-set-all'" class="nz-btn nz-btn-size-small-new nz-btn-style-light-new" type="button" @click="batchHandler(true)">
<button v-if="!isCancel" :id="tableId+'-element-set-all'" class="nz-btn nz-btn-size-small nz-btn-style-light-new" type="button" @click="batchHandler(true)">
<span class="top-tool-btn-txt">{{$t('overall.all')}}</span>
</button>
<div>
<button :id="tableId+'-element-set-esc'" class="nz-btn nz-btn-size-small-new nz-btn-style-light-new" type="button" @click="esc">
<button :id="tableId+'-element-set-esc'" class="nz-btn nz-btn-size-small nz-btn-style-light" type="button" @click="esc">
<span class="top-tool-btn-txt">{{$t('overall.esc')}}</span>
</button>
<button :id="tableId+'-element-set-save'" class="nz-btn nz-btn-size-small-new nz-btn-style-normal-new" type="button" @click="save">
<button :id="tableId+'-element-set-save'" class="nz-btn nz-btn-size-small nz-btn-style-normal" type="button" @click="save">
<span class="top-tool-btn-txt">{{$t('overall.save')}}</span>
</button>
</div>

2
nezha-fronted/src/components/common/exportXLSX.vue
View File

@@ -84,7 +84,7 @@
</div>
<div slot="footer" class="footer">
<div class="el-message-box__btns">
<button @click="rollbackImport" class="nz-btn nz-btn-size-normal-new nz-btn-style-error-new" :id="id+'-xlsx-import-rollback'">
<button :id="id+'-xlsx-import-rollback'" class="nz-btn nz-btn-size-normal nz-btn-style-error" @click="rollbackImport">
<span>{{$t('overall.rollbackImport')}}</span>
</button>
</div>

23
nezha-fronted/src/components/common/i18n.js
View File

@@ -1,13 +1,30 @@
import Vue from 'vue'
import locale from 'element-ui/lib/locale'
import VueI18n from 'vue-i18n'
import messages from './language'
import { get } from '@/http'
// import messages from './language'
Vue.use(VueI18n)
// 从localStorage获取语言选择。
const i18n = new VueI18n({
locale: localStorage.getItem('nz-language') || 'en', // 初始未选择默认 en 英文
messages
locale: localStorage.getItem('nz-language') || 'en' // 初始未选择默认 en 英文
// messages
})
locale.i18n((key, value) => i18n.t(key, value)) // 兼容element
export function loadI18n (i18nData) {
if (i18nData) {
Object.keys(i18nData).forEach(lang => {
i18n.setLocaleMessage(lang, i18nData[lang])
})
} else {
get('/sys/i18n/lang').then(response => {
if (response.code === 200) {
i18nData = response.data
Object.keys(i18nData).forEach(lang => {
i18n.setLocaleMessage(lang, i18nData[lang])
})
}
})
}
}
export default i18n

24
nezha-fronted/src/components/common/login.vue
View File

@@ -112,6 +112,8 @@
import { mapActions } from 'vuex'
import QRCode from 'qrcodejs2'
import bus from '@/libs/bus.js'
import { get } from '@/http'
import { loadI18n } from '@/components/common/i18n'
export default {
name: 'login',
data () {
@@ -158,6 +160,28 @@ export default {
this.authToken = res.data.authToken
this.lang = res.data.user.lang
this.$i18n.locale = this.lang
// 获取国际化内容
const getI18nData = new Promise(resolve => get('/sys/i18n/lang').then(response => {
if (response.code === 200) {
const i18nData = response.data
resolve(i18nData)
} else {
resolve()
}
}))
// 获取可选语言
const getLangList = new Promise(resolve => get('/sys/dict/all?type=lang').then(response => {
if (response.code === 200) {
const langList = response.data.map(lang => ({ name: lang.name, value: lang.value }))
this.$store.commit('setLangList', langList)
localStorage.setItem('nz-language-list', JSON.stringify(langList))
}
resolve()
}))
Promise.all([getI18nData, getLangList]).then(response => {
response[0] && loadI18n(response[0])
this.$store.commit('i18nReady', true)
})
sessionStorage.setItem('nz-token', res.data.authToken)
if (res.data.authFlag === 1) {
if (res.data.authBind === 0) {

2
nezha-fronted/src/components/common/multipleTime.vue
View File

@@ -29,7 +29,7 @@
</el-row>
</template>
<template v-else>
<div style="text-align: center;width: 100%;color: #909399;font-family: NotoSans !important;font-size: 12px !important;">{{$t("dashboard.panel.noDate")}}</div>
<div class="time-no-data">{{$t("dashboard.panel.noDate")}}</div>
</template>
<div class="el-dropdown-link" slot="reference">
<i class="nz-icon nz-icon-time" style="width:20px;"></i>

2
nezha-fronted/src/components/common/popBox/topToolMoreOptions.vue
View File

@@ -96,7 +96,7 @@
</div>
<div slot="footer" class="footer">
<div class="el-message-box__btns">
<button :id="id+'-xlsx-import-rollback'" class="nz-btn nz-btn-size-normal-new nz-btn-style-error-new" @click="rollbackImport">
<button :id="id+'-xlsx-import-rollback'" class="nz-btn nz-btn-size-normal nz-btn-style-error" @click="rollbackImport">
<span>{{$t('overall.rollbackImport')}}</span>
</button>
<button :id="id+'-xlsx-import-close'" class="nz-btn el-button el-button--default el-button--small" @click="closeDialog">

10
nezha-fronted/src/components/common/project/topologyL5.vue
View File

@@ -105,18 +105,18 @@
>
{{$t('project.topology.preview')}}
</button>
<button @click="previewExit" v-if="isPreview" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new"
<button v-if="isPreview" class="nz-btn nz-btn-size-normal nz-btn-style-light-new" @click="previewExit"
style="margin-right: 20px"
>
{{$t('project.topology.previewExit')}}
</button>
<button @click="saveTopology" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new"
<button class="nz-btn nz-btn-size-normal nz-btn-style-normal" @click="saveTopology"
:disabled="prevent_opt.save"
:class="{'nz-btn-disabled':prevent_opt.save}"
style="margin-right: 20px">
{{$t('project.topology.save')}}
</button>
<button @click="cancelTopology" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" style="margin-right: 20px">
<button class="nz-btn nz-btn-size-normal nz-btn-style-normal" style="margin-right: 20px" @click="cancelTopology">
{{$t('project.topology.exit')}}
</button>
</span>
@@ -319,11 +319,11 @@
</el-row>
<div class="upload-pic-row" style="text-align: center">
<span>
<button @click="uploadPicShow=false" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" style="margin-right: 20px">
<button class="nz-btn nz-btn-size-normal nz-btn-style-light" style="margin-right: 20px" @click="uploadPicShow=false">
{{$t('project.topology.exit')}}
</button>
<button @click="imgUpload" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new"
<button class="nz-btn nz-btn-size-normal nz-btn-style-normal" @click="imgUpload"
v-has="'topo_icon_save'" :disabled="prevent_opt.save"
:class="{'nz-btn-disabled':prevent_opt.save}"
style="margin-right: 20px">

4
nezha-fronted/src/components/common/rightBox/trafficSetting/trafficSettingBox.vue
View File

@@ -16,10 +16,10 @@
<!--底部按钮-->
<div class="right-box-bottom-btns">
<button type="button" v-cancel="{obj:traffic,func:esc}" id="traffic-setting-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
<button id="traffic-setting-esc" v-cancel="{obj:traffic,func:esc}" class="nz-btn nz-btn-size-normal nz-btn-style-light-new" type="button">
<span>{{$t('overall.cancel')}}</span>
</button>
<button @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="traffic-setting-save" type="button" v-has="'dc_trafficSetting_save'">
<button id="traffic-setting-save" v-has="'dc_trafficSetting_save'" class="nz-btn nz-btn-size-normal nz-btn-style-normal" type="button" @click="save">
<span>{{$t('overall.save')}}</span>
</button>
</div>

2
nezha-fronted/src/components/common/table/special/endpointQueryTab.vue
View File

@@ -70,7 +70,7 @@
{{$t("project.endpoint.dialogTitle")}}
<div class="float-right panel-calendar dialog-tool" style="display: flex;margin-right: 30px">
<pick-time :refresh-data-func="queryChartDate" :use-refresh="false" v-model="searchTime" style="height: 28px;" @unitChange="chartUnitChange" id="endpoint-query-full-chart" :show-multiple="true" ref="pickTime"></pick-time>
<button @click="saveChart" class="nz-btn nz-btn-size-large nz-btn-style-normal-new" v-has="'panel_chart_add'" id="endpoint-query-full-chart-save">{{$t('dashboard.metric.saveChart')}}</button>
<button id="endpoint-query-full-chart-save" v-has="'panel_chart_add'" class="nz-btn nz-btn-size-large nz-btn-style-normal" @click="saveChart">{{$t('dashboard.metric.saveChart')}}</button>
</div>
</div>
<chart ref="endpointChart" :unit="chartUnit" :minusTime="minusTime" v-if="graphShow"></chart>

2
nezha-fronted/src/components/common/timePicker.vue
View File

@@ -28,7 +28,7 @@
</el-row>
</template>
<template v-else>
<div style="text-align: center;width: 100%;color: #909399;font-family: NotoSans !important;font-size: 12px !important;">{{$t("dashboard.panel.noDate")}}</div>
<div class="time-no-data">{{$t("dashboard.panel.noDate")}}</div>
</template>
<div class="el-dropdown-link" slot="reference">
<i class="nz-icon nz-icon-time" style="width:20px;"></i>

2
nezha-fronted/src/components/page/config/agent.vue
View File

@@ -57,7 +57,7 @@
</el-select>
</el-form-item>
<el-form-item class="half-form-item">
<button :class="{'nz-btn-disabled':downloadAgentFlag}" :disabled="downloadAgentFlag" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" type="button" @click="downloadAgent">{{$t('config.agent.agent.download')}}</button>
<button :class="{'nz-btn-disabled':downloadAgentFlag}" :disabled="downloadAgentFlag" class="nz-btn nz-btn-size-normal nz-btn-style-normal" type="button" @click="downloadAgent">{{$t('config.agent.agent.download')}}</button>
</el-form-item>
<div class="right-box-sub-title">{{$t('config.agent.agent.autoScript')}}</div>
<div style="margin-bottom: 20px;width: 100%"></div>

12
nezha-fronted/src/components/page/config/profile.vue
View File

@@ -227,6 +227,11 @@ export default {
mounted () {
this.personalCenter()
},
computed: {
langList () {
return this.$store.getters.getLangList
}
},
methods: {
// 请求后端数据
personalCenter () {
@@ -242,10 +247,9 @@ export default {
}
this.tableProfile[1].prop = this.userList.email
this.tableProfile[2].prop = this.userList.mobile
if (this.userList.lang == 'cn') {
this.tableProfile[3].prop = '简体中文'
} else {
this.tableProfile[3].prop = 'English'
const findLang = this.langList.find(lang => this.userList.lang === lang.value)
if (findLang) {
this.tableProfile[3].prop = findLang.name
}
this.tableProfile[4].prop = this.userList.source
const name = this.userList.name.substr(0, 1)

6
nezha-fronted/src/components/page/config/setup.vue
View File

@@ -166,13 +166,13 @@
</template>
<div class="setup-bottom-btn">
<button @click="preStep" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" v-if="activeStep != 0" style="background-color:#fff;color:#333;border:1px solid rgba(0,0,0,0.15);">
<button v-if="activeStep != 0" class="nz-btn nz-btn-size-normal nz-btn-style-normal" style="background-color:#fff;color:#333;border:1px solid rgba(0,0,0,0.15);" @click="preStep">
<span>{{$t('setup.back')}}</span>
</button>
<button @click="nextStep" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" :disabled="prevent_next" v-if="activeStep != 3" :class="{'nz-btn-disabled':prevent_next}">
<button v-if="activeStep != 3" :class="{'nz-btn-disabled':prevent_next}" :disabled="prevent_next" class="nz-btn nz-btn-size-normal nz-btn-style-normal" @click="nextStep">
<span>{{$t('setup.next')}}</span>
</button>
<button @click="finishStep" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" :disabled="prevent_finish" v-if="activeStep == 3" :class="{'nz-btn-disabled':prevent_finish}">
<button v-if="activeStep == 3" :class="{'nz-btn-disabled':prevent_finish}" :disabled="prevent_finish" class="nz-btn nz-btn-size-normal nz-btn-style-normal" @click="finishStep">
<span>{{$t('setup.finish')}}</span>
</button>
</div>

14
nezha-fronted/src/components/page/config/system.vue
View File

@@ -42,7 +42,7 @@
<div class="el-form-item__tip">{{$t('config.system.basic.TwoFactorAuthentication')}}</div>
</el-form-item>
<el-form-item>
<button style="margin-top: 8px;" id="system-basic-save" @click="saveSetInfo('basic','basicForm')" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" type="button" v-has="'system_basic_save'" :disabled="prevent_opt.save" :class="{'nz-btn-disabled':prevent_opt.save}">{{$t('overall.submit')}}</button>
<button id="system-basic-save" v-has="'system_basic_save'" :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" class="nz-btn nz-btn-size-normal nz-btn-style-normal" style="margin-top: 8px;" type="button" @click="saveSetInfo('basic','basicForm')">{{$t('overall.submit')}}</button>
</el-form-item>
</el-form>
</div >
@@ -154,7 +154,7 @@
<!-- @click="resetForm('basicForm','basic')" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" type="button" id="system-basic-reset"-->
<!-- :disabled="prevent_opt.save" :class="{'nz-btn-disabled':prevent_opt.save}"-->
<!-- >{{$t('overall.reset')}}</button>-->
<button id="system-monitor-save" @click="saveSetInfo('monitor','monitorForm')" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" type="button" v-has="'system_basic_save'" :disabled="prevent_opt.save" :class="{'nz-btn-disabled':prevent_opt.save}">{{$t('overall.submit')}}</button>
<button id="system-monitor-save" v-has="'system_basic_save'" :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" class="nz-btn nz-btn-size-normal nz-btn-style-normal" type="button" @click="saveSetInfo('monitor','monitorForm')">{{$t('overall.submit')}}</button>
</el-form-item>
</el-form>
</div>
@@ -202,7 +202,7 @@
<el-form-item style="padding-top: 20px;">
<!-- <button id="system-email-reset" @click="resetForm('emailForm','email')" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" type="button">{{$t('overall.reset')}}</button>-->
<button id="system-email-test" :class="{'nz-btn-disabled':email.email_enable == 'off','nz-btn-disabled':prevent_opt.save}" :disabled="email.email_enable == 'off' || prevent_opt.save" @click="testSetInfo('email','emailForm')" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" type="button">{{$t('config.system.email.testConnection')}}</button>
<button id="system-email-save" @click="saveSetInfo('email','emailForm')" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" type="button" v-has="'system_email_save'" :disabled="prevent_opt.save" :class="{'nz-btn-disabled':prevent_opt.save}">{{$t('overall.submit')}}</button>
<button id="system-email-save" v-has="'system_email_save'" :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" class="nz-btn nz-btn-size-normal nz-btn-style-normal" type="button" @click="saveSetInfo('email','emailForm')">{{$t('overall.submit')}}</button>
</el-form-item>
</el-form>
</div>
@@ -228,7 +228,7 @@
</el-input>
</el-form-item>
<el-form-item>
<button @click="saveSetInfo('terminal','terminalForm')" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" type="button" v-has="'system_terminal_save'" :disabled="prevent_opt.save" :class="{'nz-btn-disabled':prevent_opt.save}">{{$t('overall.submit')}}</button>
<button v-has="'system_terminal_save'" :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" class="nz-btn nz-btn-size-normal nz-btn-style-normal" type="button" @click="saveSetInfo('terminal','terminalForm')">{{$t('overall.submit')}}</button>
</el-form-item>
</el-form>
</div>
@@ -269,8 +269,8 @@
</el-form-item>
<el-form-item>
<!-- <button id='system-ldap-reset' @click="resetForm('ldapForm','ldap')" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" type="button">{{$t('overall.reset')}}</button>-->
<button id='system-ldap-test' @click="testSetInfo('ldap','ldapForm')" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" type="button" :disabled="prevent_opt.save" :class="{'nz-btn-disabled':prevent_opt.save}">{{$t('config.system.email.testConnection')}}</button>
<button id='system-ldap-save' @click="saveSetInfo('ldap','ldapForm')" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" type="button" v-has="'system_ldap_save'" :disabled="prevent_opt.save" :class="{'nz-btn-disabled':prevent_opt.save}">{{$t('overall.submit')}}</button>
<button id='system-ldap-test' :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" class="nz-btn nz-btn-size-normal nz-btn-style-light" type="button" @click="testSetInfo('ldap','ldapForm')">{{$t('config.system.email.testConnection')}}</button>
<button id='system-ldap-save' v-has="'system_ldap_save'" :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" class="nz-btn nz-btn-size-normal nz-btn-style-normal" type="button" @click="saveSetInfo('ldap','ldapForm')">{{$t('overall.submit')}}</button>
</el-form-item>
</el-form>
</div>
@@ -310,7 +310,7 @@
<el-input id="system-reset-pin" v-model="reset.pin" type="password"></el-input>
</el-form-item>
<el-form-item>
<el-button @click="resetSys()" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" type="button" v-has="'system_reset_reset'" :disabled="prevent_opt.save" :class="{'nz-btn-disabled':prevent_opt.save}">{{$t('overall.reset')}}</el-button>
<el-button v-has="'system_reset_reset'" :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" class="nz-btn nz-btn-size-normal nz-btn-style-normal" type="button" @click="resetSys()">{{$t('overall.reset')}}</el-button>
</el-form-item>
</el-form>
</div>

4
nezha-fronted/src/components/page/config/system/apiKeyTable.vue
View File

@@ -90,8 +90,8 @@
<div slot="header" class="table-operation-title">{{$t('overall.option')}}</div>
<div slot-scope="scope" class="table-operation-items">
<template v-if="scope.row.edit">
<button type="button" class="nz-btn nz-btn-size-mini-new nz-btn-style-normal-new" v-has="'system_apiKey_edit'" :disabled="prevent_opt.save" @click="save(scope.row)" style="margin-right: 10px"><span>{{$t('overall.save')}}</span></button>
<button type="button" class="nz-btn nz-btn-size-mini-new nz-btn-style-light-new" @click="cancel(scope.row)" :disabled="prevent_opt.save"><span>{{$t('overall.cancel')}}</span></button>
<button v-has="'system_apiKey_edit'" :disabled="prevent_opt.save" class="nz-btn nz-btn-size-mini nz-btn-style-normal" style="margin-right: 10px" type="button" @click="save(scope.row)"><span>{{$t('overall.save')}}</span></button>
<button :disabled="prevent_opt.save" class="nz-btn nz-btn-size-mini nz-btn-style-light-new" type="button" @click="cancel(scope.row)"><span>{{$t('overall.cancel')}}</span></button>
</template>
<template v-else>
<button class="table-operation-item" @click="$emit('del',scope.row)" v-has="'system_apiKey_delete'"><i class="nz-icon nz-icon-delete"></i></button>

4
nezha-fronted/src/components/page/config/system/linkTable.vue
View File

@@ -61,8 +61,8 @@
<div slot="header" class="table-operation-title">{{$t('overall.option')}}</div>
<div slot-scope="scope" class="table-operation-items">
<template v-if="scope.row.edit">
<button type="button" class="nz-btn nz-btn-size-mini-new nz-btn-style-normal-new" :disabled="prevent_opt.save" @click="saveOrUpdate(scope.row)" style="margin-right: 10px"><span>{{$t('overall.save')}}</span></button>
<button type="button" class="nz-btn nz-btn-size-mini-new nz-btn-style-light-new" @click="cancel(scope.row)" :disabled="prevent_opt.save"><span>{{$t('overall.cancel')}}</span></button>
<button :disabled="prevent_opt.save" class="nz-btn nz-btn-size-mini nz-btn-style-normal" style="margin-right: 10px" type="button" @click="saveOrUpdate(scope.row)"><span>{{$t('overall.save')}}</span></button>
<button :disabled="prevent_opt.save" class="nz-btn nz-btn-size-mini nz-btn-style-light" type="button" @click="cancel(scope.row)"><span>{{$t('overall.cancel')}}</span></button>
</template>
<template v-else>
<button class="table-operation-item" @click="toEdit(scope.row)"><i class="nz-icon nz-icon-edit"></i></button>

4
nezha-fronted/src/components/page/config/system/notifyMethodTable.vue
View File

@@ -71,8 +71,8 @@
<div slot="header" class="table-operation-title">{{$t('overall.option')}}</div>
<div slot-scope="scope" class="table-operation-items">
<template v-if="scope.row.edit">
<button type="button" class="nz-btn nz-btn-size-mini-new nz-btn-style-normal-new" @click="saveOrUpdate(scope.row)" :disabled="prevent_opt.save" style="margin-right: 10px"><span>{{$t('overall.save')}}</span></button>
<button type="button" class="nz-btn nz-btn-size-mini-new nz-btn-style-light-new" @click="cancel(scope.row)" :disabled="prevent_opt.save"><span>{{$t('overall.cancel')}}</span></button>
<button :disabled="prevent_opt.save" class="nz-btn nz-btn-size-mini nz-btn-style-normal" style="margin-right: 10px" type="button" @click="saveOrUpdate(scope.row)"><span>{{$t('overall.save')}}</span></button>
<button :disabled="prevent_opt.save" class="nz-btn nz-btn-size-mini nz-btn-style-light-new" type="button" @click="cancel(scope.row)"><span>{{$t('overall.cancel')}}</span></button>
</template>
<template v-else>
<button :class="{'table-operation-item--disable':isBuiltIn(scope.row)}" :disabled="isBuiltIn(scope.row)" class="table-operation-item" @click="toEdit(scope.row)"><i class="nz-icon nz-icon-edit"></i></button>

8
nezha-fronted/src/components/page/dashboard/explore/promqlInput.vue
View File

@@ -144,10 +144,10 @@
</el-form-item>
</el-form>
<span slot="footer">
<button id="temp-box-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" @click="tempBoxShowChange(false)">
<button id="temp-box-esc" class="nz-btn nz-btn-size-normal nz-btn-style-light" @click="tempBoxShowChange(false)">
<span>{{$t('overall.cancel')}}</span>
</button>
<button :disabled="prevent_opt.save" @click="tempBoxShowChange(true)" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="chart-box-save" v-has="`expressionTemplate_add`" >
<button id="chart-box-save" v-has="`expressionTemplate_add`" :disabled="prevent_opt.save" class="nz-btn nz-btn-size-normal nz-btn-style-normal" @click="tempBoxShowChange(true)" >
<span>{{$t('overall.save')}}</span>
</button>
</span>
@@ -652,10 +652,10 @@ export default {
.nz-temp-box /deep/ .el-dialog__footer{
margin-top: 0;
}
.nz-temp-box .nz-btn-style-light-new{
.nz-temp-box .nz-btn-style-light{
margin-right: 10px;
}
.nz-temp-box .nz-btn-style-normal-new{
.nz-temp-box .nz-btn-style-normal{
margin-left: 10px;
}
</style>

2
nezha-fronted/src/components/page/monitor/endpoint/endpointList.vue
View File

@@ -206,7 +206,7 @@
</div>
<div slot="footer" class="footer">
<div class="el-message-box__btns">
<button :id="'xlsx-import-rollback'" class="nz-btn nz-btn-size-normal-new nz-btn-style-error-new" @click="rollbackImport">
<button :id="'xlsx-import-rollback'" class="nz-btn nz-btn-size-normal nz-btn-style-error" @click="rollbackImport">
<span>{{$t('overall.rollbackImport')}}</span>
</button>
<button :id="'xlsx-import-close'" class="nz-btn el-button el-button--default el-button--small" @click="closeDialog">