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

fix：解决冲突

Browse Source
This commit is contained in:
zyh
2022-11-17 18:05:36 +08:00
parent 336b131d94 99bc195001
commit 12879ffe52
75 changed files with 1114 additions and 4269 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -576,6 +576,12 @@ textarea {
.el-icon-arrow-right:before {
content: "\e6ad";
}
.el-icon-arrow-up{
font-family: nz-icon!important;
}
.el-icon-arrow-up:before{
content: "\e6af";
}
.el-icon-arrow-down{
font-family: nz-icon!important;
}

69
nezha-fronted/src/assets/css/components/common/bottomBox/bottomBox.scss
View File

@@ -97,14 +97,16 @@
}
}
.nz-btn-group {
#endpoint-query-changetime,#recordRules-query-changetime:hover {
#endpoint-query-changetime,
#recordRules-query-changetime:hover {
border: 1px solid $--asset-label-btn-border-color;
}
.nz-btn.nz-btn-size-normal.nz-btn-style-light.control-icon-unchecked:hover {
border: 1px solid $--asset-label-btn-border-color;
z-index: 2;
}
.nz-btn.nz-btn-size-normal.nz-btn-style-light.control-icon-unchecked,.nz-btn.nz-btn-size-normal.nz-btn-style-light.control-icon-checked {
.nz-btn.nz-btn-size-normal.nz-btn-style-light.control-icon-unchecked,
.nz-btn.nz-btn-size-normal.nz-btn-style-light.control-icon-checked {
margin-right: -1px;
}
.project-calendar.nz-input-group-middle {
@@ -277,6 +279,60 @@
height: calc(100% - 15px) !important;
}
}
#assetProcessTable {
.el-popover__reference {
display: flex;
align-items: center;
}
.bar {
width: 3px;
height: 14px;
border-radius: 0;
margin-right: 0px;
line-height: 100%;
}
.process-name {
height: 100%;
margin-left: 6px;
line-height: 24px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
#container {
width: 120px;
min-width: 120px;
height: 18px;
margin-right: 20px;
}
.percentage {
flex-grow: 1;
word-wrap: break-word;
}
.el-progress-bar__outer {
border-radius: 2px;
background-color: #e6eaed;
}
.el-progress-bar__inner {
border-radius: 0;
}
.active-icon {
margin-left: 5px;
}
}
#assetNetworkTable{
.process-name{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
#assetVsysTable{
}
// comments
#commentBottomTab {
.sub-container .nz-table-list {
@@ -311,7 +367,7 @@
flex: 1;
}
.ql-container.ql-snow {
border: unset !important
border: unset !important;
}
.text-too-long {
display: none;
@@ -368,3 +424,10 @@
}
}
}
//endpoint 二级页面搜索
.endpoint-tab-new {
.top-tool-right .nz-btn.nz-btn-size-normal {
box-sizing: content-box;
}
}

2
nezha-fronted/src/assets/css/components/common/bottomBox/panelTabNew.scss
View File

@@ -146,7 +146,7 @@
outline: none;
border: 1px solid #ccc;
}
button:hover {
button:hover:not(.footer__btn) {
background: $--background-color-empty;
}
.nz-btn-style-normal {

8
nezha-fronted/src/assets/css/components/common/multipleTime.scss
View File

@@ -15,14 +15,14 @@
color: #fff;
}
.calendar-dropdown-title {
line-height: 28px;
line-height: 30px;
padding-left: 5px;
margin-left: 0;
margin-top: -3px !important;
margin-top: -5px !important;
text-align: left;
border-radius: 2px;
min-width: 80px;
height: 28px;
height: 30px;
border: solid 1px $--border-color-base;
white-space: nowrap;
overflow: hidden;
@@ -65,7 +65,7 @@
box-sizing: content-box;
line-height: unset;
height: 100%;
margin-left: -6px;
margin-left: -1px;
margin-right: 10px;
}
.nz-icon-compare {

13
nezha-fronted/src/assets/css/components/page/config/mibBrowser.scss
View File

@@ -116,6 +116,9 @@
height: 100%;
padding-right: 12px;
overflow: auto;
text-overflow: initial;
white-space: normal;
box-sizing: content-box;
}
/*第一列宽25%*/
.mib-browser-detail-row>div:first-of-type {
@@ -129,6 +132,15 @@
border-left: 1px solid $--border-color-light;
word-break: break-all;
color: $--color-text-secondary;
box-sizing: border-box;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
.document-copy-text{
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
.mib-browser-detail-row:not(:last-of-type) {
border-bottom: 1px solid $--border-color-light;
@@ -139,7 +151,6 @@
}
.mib-browser-detail-row>div {
padding-left: 5px;
box-sizing: border-box;
}
.mib-browser-detail-description {
padding: 0 14px 0 0;

72
nezha-fronted/src/assets/css/components/page/config/system.scss
View File

@@ -36,7 +36,6 @@
.el-input.el-input--small {
width: calc(100% - 49px);
}
}
}
#system-basic {
@@ -47,6 +46,25 @@
}
}
}
.system-config-form.basicForm {
.vue-tags-input {
max-width: unset !important;
}
.vue-tags-input.interface-name .ti-input{
padding: 0px !important;
}
.vue-tags-input .ti-input {
min-height: 32px;
padding: 0px 0px 0px 15px !important;
}
.vue-tags-input .ti-input .ti-new-tag-input-wrapper {
padding: 0;
margin: 0;
}
.vue-tags-input.interface-name .ti-input .ti-new-tag-input-wrapper {
padding-left: 7px;
}
}
.system-config-form {
width: 61.8% !important;
position: relative;
@@ -183,14 +201,20 @@
margin-bottom: 20px;
}
}
.el-form-item:last-of-type.monitorLastElement {
.el-form-item__content {
margin-left: 180px !important;
}
}
.el-tabs__nav-scroll {
background-color: $--background-color-empty;
}
.el-tabs__nav-scroll,.el-tabs__header,.el-tabs__nav-wrap{
.el-tabs__nav-scroll,
.el-tabs__header,
.el-tabs__nav-wrap {
border-bottom: 0;
}
.el-form-item:last-of-type {
.el-form-item__content {
margin-left: 0 !important;
text-align: center;
@@ -206,7 +230,8 @@
.list-page .main-container {
padding: unset;
}
.table-column-setting,.pagination-bottom{
.table-column-setting,
.pagination-bottom {
display: none;
}
}
@@ -222,11 +247,11 @@
color: $--color-primary;
background: $--background-color-empty;
border-bottom: none;
margin-left: .1px;
margin-left: 0.1px;
}
.el-tabs--border-card > .el-tabs__header .el-tabs__item:not(.is-disabled):hover {
color: $--color-primary;
opacity: .8;
opacity: 0.8;
}
.el-tabs--border-card > .el-tabs__header .el-tabs__item {
height: 40px;
@@ -249,7 +274,10 @@
border: 1px solid $--border-color-light;
border-left: none;
}
.el-input-number__decrease,.el-input-number__increase,.el-input-number__decrease.is-disabled,.el-input-number__increase.is-disabled {
.el-input-number__decrease,
.el-input-number__increase,
.el-input-number__decrease.is-disabled,
.el-input-number__increase.is-disabled {
background-color: $--popover-background-color;
}
.el-input-number__decrease {
@@ -318,22 +346,32 @@
margin-bottom: 54px;
}
@keyframes warnBackground {
0% {background-color: #FFFFFF;}
25% {background-color: #EF7458;}
50% {background-color: #FFFFFF;}
75% {background-color: #EF7458;}
100% {background-color: #FFFFFF;}
0% {
background-color: #ffffff;
}
25% {
background-color: #ef7458;
}
50% {
background-color: #ffffff;
}
75% {
background-color: #ef7458;
}
100% {
background-color: #ffffff;
}
}
.warn-pop {
background-color: #FEF0F0;
border-color: #FEF0F0;
color:#F66C6C;
background-color: #fef0f0;
border-color: #fef0f0;
color: #f66c6c;
}
.warn-pop .popper__arrow:after {
border-top-color: #FEF0F0 !important;
border-top-color: #fef0f0 !important;
}
.system .logo-upload-tip {
color:#F66C6C;
color: #f66c6c;
font-size: 12px;
line-height: 20px;
}

5
nezha-fronted/src/assets/css/components/page/config/system/notifyMethodTab.scss
View File

@@ -1,6 +1,9 @@
.notify-method-tab {
.notify-table {
height: calc(100% - 110px)
height: calc(100% - 110px);
.pagination-bottom {
width: 0 !important;
}
}
.notify-table .el-table {
height: calc(100% - 10px) !important;

10
nezha-fronted/src/assets/css/components/page/dashboard/explore/explore.scss
View File

@@ -3,6 +3,16 @@
padding: 0px 0 10px 0px;
background-color: $--background-color-base;
box-sizing: border-box;
.main-list::after{
content: '';
display: block;
position: absolute;
bottom: -10px;
left: 0;
right: 14px;
height: 10px;
background-color: $--background-color-empty;
}
pre {
border: 1px solid $--border-color-base;
border-left: 4px solid #e6522c;

4
nezha-fronted/src/assets/css/components/page/dashboard/explore/promqlInput.scss
View File

@@ -16,6 +16,10 @@
border: 1px solid $--border-color-light;
}
}
.not-fixed-height.no-resize.no-close{
height: 100%;
box-sizing: border-box;
}
.query-row {
display: flex;

30
nezha-fronted/src/assets/css/font/iconfont.css
View File

File diff suppressed because one or more lines are too long

2
nezha-fronted/src/assets/css/font/iconfont.js
View File

File diff suppressed because one or more lines are too long

42
nezha-fronted/src/assets/css/font/iconfont.json
View File

@@ -5,6 +5,48 @@
"css_prefix_text": "nz-icon-",
"description": "",
"glyphs": [
{
"icon_id": "586976",
"name": "map-sankey",
"font_class": "sankey",
"unicode": "e784",
"unicode_decimal": 59268
},
{
"icon_id": "6537184",
"name": "地图",
"font_class": "map",
"unicode": "e66c",
"unicode_decimal": 58988
},
{
"icon_id": "6807270",
"name": "Diagram-2",
"font_class": "diagram",
"unicode": "ec02",
"unicode_decimal": 60418
},
{
"icon_id": "11488020",
"name": "clock",
"font_class": "clock",
"unicode": "e762",
"unicode_decimal": 59234
},
{
"icon_id": "17692259",
"name": "走马灯",
"font_class": "projectTopology",
"unicode": "e765",
"unicode_decimal": 59237
},
{
"icon_id": "20559415",
"name": "165ranking",
"font_class": "rank",
"unicode": "e7ac",
"unicode_decimal": 59308
},
{
"icon_id": "32442422",
"name": "New",

BIN
nezha-fronted/src/assets/css/font/iconfont.ttf
View File

Binary file not shown.

BIN
nezha-fronted/src/assets/css/font/iconfont.woff
View File

Binary file not shown.

BIN
nezha-fronted/src/assets/css/font/iconfont.woff2
View File

Binary file not shown.

43
nezha-fronted/src/assets/css/nzIcon.css
View File

File diff suppressed because one or more lines are too long

2
nezha-fronted/src/assets/css/themes/src/pagination.scss
View File

@@ -74,7 +74,7 @@
.el-icon {
display: block;
font-size: 12px;
font-size: 12px !important;
font-weight: bold;
}
}

326
nezha-fronted/src/components/chart/chart/chartHexagon.vue
View File

@@ -1,326 +0,0 @@
<template>
<div style="width: 100%;height: 100%" v-my-loading="loading">
<hexagonBox
ref="hexagonBox"
:hexData="hexData"
:col="col"
:length="length"
:colorFrom="'level'"
:colorSet="colorSet"
:infoSet="infoSet"
:infoShow="infoShow"
:infoHide="infoHide"
:hexagonEdge="hexagonEdge"
:from="from"
:hexagonSvgID="hexagonSvgID"
:showTooltip="showTooltip"
@changeAsset="changeAsset"
@assetMove="assetMove"
@closeAsset="closeAsset"
/>
<alertLabel
v-if="showTooltip&&assetData.show"
v-my-loading="assetData.loading"
ref="alertLabel"
:id="assetData.id"
:that="assetData"
:type="fromType"
:LRTriangle="LRTriangle"
></alertLabel>
</div>
</template>
<script>
import hexagonBox from '@/components/common/honeycomb/hexagonFigureSvg'
import alertLabel from '@/components/common/alert/alertLabel2'
function textMouseDown (e) {
window.event ? window.event.cancelBubble = true : e.stopPropagation()
}
// eslint-disable-next-line no-unused-vars
function textMouseEnter (e) {
window.event ? window.event.cancelBubble = true : e.stopPropagation()
}
// eslint-disable-next-line no-unused-vars
function textMouseLeave (e) {
window.event ? window.event.cancelBubble = true : e.stopPropagation()
}
export default {
name: 'chartHexagon',
components: {
hexagonBox,
alertLabel
},
props: {
chartData: {},
chartInfo: {}
},
watch: {
chartData: {
immediate: true,
deep: true,
handler () {
setTimeout(() => {
this.initHexagon()
})
}
},
chartInfo: {
immediate: true,
deep: true,
handler () {
}
},
length: {
immediate: false,
deep: true,
handler () {
}
}
},
data () {
return {
hexData: [],
hexagonEdge: 90,
loading: false,
assetData: {
id: '',
loading: false,
show: false,
rate: 1,
position: {
top: 0,
left: 0,
mt: 0
}
},
boxWidth: '',
LRTriangle: true, // true 左三角 false 右
timer: null,
col: 8,
length: 48,
from: '',
hexagonSvgID: '',
showTooltip: false,
fromType: ''
}
},
methods: {
initHexagon () {
const param = this.chartInfo.param
if (param) {
this.col = param.col || 9
this.length = param.length || 48
this.from = param.from || 'module'
this.hexagonSvgID = 'hexagonSvg' + this.chartInfo.id
this.showTooltip = param.showTooltip || true
this.fromType = param.from || 'module'
}
setTimeout(() => {
this.hexData = this.chartData
}, 100)
},
colorSet (item) { // 设置方块颜色
const alert = item.alert[0]
if (alert.P1 > 0) {
return {
color: '#DA4D4D',
hoverColor: '#E87F7F'
}
} else if (alert.P2 > 0) {
return {
color: '#FFAB99',
hoverColor: '#FABEB2'
}
} else if (alert.P3 > 0) {
return {
color: '#FFCF92',
hoverColor: '#FFE0B8'
}
} else {
return { color: '#99D7C2', hoverColor: '#B2ECD9' }
}
},
infoSet (group, allHexagonRect, allHexagonText, data, item, fontSize, that) {
// 设置内部文本
// group 对应六边形所在的组。allHexagonRect吧所有文本框放入，方便控制显示隐藏。data 六边形的相关数 data.center 中心点。that 子组件实例
const rgbColor = '0,0,0'
let str = ''
let textPaddingWidth = ''
let textPaddingHeight = ''
const rect0 = group.rect(that.hexagonEdge + 20, that.hexagonEdge / 3)
.attr({
x: data.center[0] - that.hexagonEdge / 2 - 10,
y: data.center[1] - that.hexagonEdge,
rx: 5,
ry: 5
}).fill({ color: `rgba(${rgbColor},0)` }).data({ color: rgbColor })
str = this.from === 'asset' ? item.name : item.name
str += ''
if (str.length >= 15) {
str = str.slice(0, 12) + '...'
}
const text0 = group.text(str).attr({ x: 0, y: 0, style: 'cursor:text' }).font({ size: fontSize }).fill({ opacity: 0, color: '#fff', weight: 600, cursor: 'text' })
textPaddingWidth = (that.hexagonEdge + 20) - (text0.bbox().width)
textPaddingHeight = (that.hexagonEdge / 3) - (text0.bbox().height)
text0.attr({
x: data.center[0] - that.hexagonEdge / 2 - 10 + textPaddingWidth / 2,
y: data.center[1] - that.hexagonEdge + textPaddingHeight / 2 - 4
}).hide()
allHexagonRect.push(rect0)
allHexagonText.push(text0)
text0.on('mousedown', textMouseDown)
const rect1 = group.rect(that.hexagonEdge + 20, that.hexagonEdge / 3)
.attr({
x: data.center[0] - that.hexagonEdge / 2 - 10,
y: data.center[1] - that.hexagonEdge / 2 - 7.5,
rx: 6,
ry: 6
}).fill({ color: `rgba(${rgbColor},0)` }).data({ color: rgbColor })
str = 'P1 : ' + item.alert[0].P1
if (str.length >= 15) {
str = str.slice(0, 12) + '...'
}
const text1 = group.text(str).attr({ x: 0, y: 0, style: 'cursor:default' }).font({ size: fontSize }).fill({ opacity: 0, color: '#fff', weight: 600, cursor: 'default' })
textPaddingWidth = (that.hexagonEdge + 20) - (text1.bbox().width)
textPaddingHeight = (that.hexagonEdge / 3) - (text1.bbox().height)
text1.attr({
x: data.center[0] - that.hexagonEdge / 2 - 10 + textPaddingWidth / 2,
y: data.center[1] - that.hexagonEdge / 2 - 7.5 + textPaddingHeight / 2 - 4
}).hide()
allHexagonRect.push(rect1)
allHexagonText.push(text1)
const rect2 = group.rect(that.hexagonEdge + 20, that.hexagonEdge / 3).attr({
x: data.center[0] - that.hexagonEdge / 2 - 10,
y: data.center[1] - that.hexagonEdge / 2 + that.hexagonEdge / 3 + 0.5,
rx: 6,
ry: 6
}).fill({ color: `rgba(${rgbColor},0)` }).data({ color: rgbColor })
str = 'P2 : ' + item.alert[0].P2
if (str.length >= 15) {
str = str.slice(0, 12) + '...'
}
const text2 = group.text(str).attr({ x: 0, y: 0, style: 'cursor:default' }).font({ size: fontSize }).fill({ opacity: 0, color: '#fff', weight: 600, cursor: 'default' })
textPaddingWidth = (that.hexagonEdge + 20) - (text2.bbox().width)
textPaddingHeight = (that.hexagonEdge / 3) - (text2.bbox().height)
text2.attr({
x: data.center[0] - that.hexagonEdge / 2 - 10 + textPaddingWidth / 2,
y: data.center[1] - that.hexagonEdge / 2 + that.hexagonEdge / 3 + 0.5 + textPaddingHeight / 2 - 4
}).hide()
allHexagonRect.push(rect2)
allHexagonText.push(text2)
const rect3 = group.rect(that.hexagonEdge + 20, that.hexagonEdge / 3)
.attr({
x: data.center[0] - that.hexagonEdge / 2 - 10,
y: data.center[1] - that.hexagonEdge / 2 + that.hexagonEdge / 3 * 2 + 5.5,
rx: 6,
ry: 6
}).fill({ color: `rgba(${rgbColor},0)` }).data({ color: rgbColor })
str = 'P3 : ' + item.alert[0].P3
if (str.length >= 15) {
str = str.slice(0, 12) + '...'
}
const text3 = group.text(str).attr({ x: 0, y: 0, style: 'cursor:default' }).font({ size: fontSize }).fill({ opacity: 0, color: '#fff', weight: 600, cursor: 'default' })
textPaddingWidth = (that.hexagonEdge + 20) - (text3.bbox().width)
textPaddingHeight = (that.hexagonEdge / 3) - (text3.bbox().height)
text3.attr({
x: data.center[0] - that.hexagonEdge / 2 - 10 + textPaddingWidth / 2,
y: data.center[1] - that.hexagonEdge / 2 + that.hexagonEdge / 3 * 2 + 5.5 + textPaddingHeight / 2 - 4
}).hide()
allHexagonRect.push(rect3)
allHexagonText.push(text3)
},
infoShow (allHexagonRect, allHexagonText) {
allHexagonRect.forEach(item => {
const rgbColor = item.data('color')
item.fill({ color: `rgba(${rgbColor},0.2)` })
})
allHexagonText.forEach(item => {
item.fill({ opacity: 1 }).show()
})
},
infoHide (allHexagonRect, allHexagonText) {
allHexagonRect.forEach(item => {
const rgbColor = item.data('color')
item.fill({ color: `rgba(${rgbColor},0)` })
})
allHexagonText.forEach(item => {
item.fill({ opacity: 0 }).hide()
})
},
changeAsset (data, e) {
if (this.timer) {
clearTimeout(this.timer)
}
this.assetData.id = data
const boxWidth = this.$refs.hexagonBox.$el.offsetWidth
this.boxWidth = boxWidth
// this.assetData.rate=window.screen.height/1297;
this.$nextTick(() => {
this.assetData.show = true
this.$nextTick(() => {
this.calcPosition(e)
})
})
},
assetMove (e) {
if (!this.assetData.show) { return }
this.calcPosition(e)
},
calcPosition (e) {
const boxWidth = this.boxWidth
const distance = this.fromType === 'asset' ? 300 : 50
const minus = (e.offsetY - distance) + this.$refs.alertLabel.$el.offsetHeight - window.innerHeight
// window.innerHeight
if (minus <= 0) {
this.assetData.position.top = e.offsetY - distance
this.assetData.position.mt = distance
} else if (minus > 0) {
this.assetData.position.top = window.innerHeight - this.$refs.alertLabel.$el.offsetHeight
this.assetData.position.mt = e.offsetY - (window.innerHeight - this.$refs.alertLabel.$el.offsetHeight)
}
if (boxWidth / 2 > e.pageX - 200) {
this.assetData.position.left = e.pageX + 35
this.assetData.position.right = 0
this.LRTriangle = true
} else {
this.assetData.position.right = window.innerWidth - (e.pageX - 35)
this.assetData.position.left = 0
this.LRTriangle = false
}
},
closeAsset () {
if (!this.timer) {
this.timer = setTimeout(() => {
this.assetData.show = false
this.timer = null
}, 100)
} else {
clearTimeout(this.timer)
this.timer = setTimeout(() => {
this.assetData.show = false
this.timer = null
}, 100)
}
},
endLoading () {
this.loading = false
},
startLoading () {
this.loading = true
},
resize () {
this.hexData = [...this.chartData]
}
}
}
</script>
<style scoped>
</style>

2
nezha-fronted/src/components/chart/chartHeader.vue
View File

@@ -42,7 +42,7 @@
</span>
<div class="chart-header__title" v-if="!isGroup" :title="nameFormate()">{{nameFormate()}}</div>
<div class="chart-header__title groupTitle" v-else >
<span @click="groupShow"> <i class="nz-icon" :class="chartInfo.param.collapse ? 'nz-icon-arrow-right': 'nz-icon-arrow-down'"></i></span>
<span @click="groupShow" style="cursor:pointer"> <i class="nz-icon" :class="chartInfo.param.collapse ? 'nz-icon-arrow-right': 'nz-icon-arrow-down'"></i></span>
{{nameFormate()}}
<span v-show="chartInfo.param.collapse" class="collapse-content">({{chartData ? chartData.length : 0}} charts)</span>
</div>

9
nezha-fronted/src/components/chart/richTextEditor.vue
View File

@@ -67,15 +67,6 @@ export default {
this.quill.format('image', false)
}
})
this.quill.on('selection-change', function (range, oldRange, source) {
const tooltip = $self.$el.querySelector('.ql-tooltip')
if (tooltip) {
const left = tooltip.style.left
if (left && /\-\d+\.?\d+?px/.test(left)) {
tooltip.style.left = '10px'
}
}
})
this.quill.on('text-change', function (delta, oldDelta, source) {
const length = $self.getHtml().length
if (length > 60000) {

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

@@ -4,7 +4,7 @@
<div class="top-tool-left">
<div class="sub-list-title" v-if="showTitle">{{bottomHeaderTitle}}：<slot name="title"></slot></div>
<div class="sub-list-tabs">
<div v-for="tab in tabs" :key="tab.prop" :class="{'sub-list-tab--active': tab.active || tab.prop == targetTab }" :title='tab.prop' class="sub-list-tab" @click="changeTab(tab.prop)">{{tab.name}}</div>
<div v-for="tab in tabs" :key="tab.prop" :class="{'sub-list-tab--active': tab.active || tab.prop == targetTab }" :title='tab.name' class="sub-list-tab" @click="changeTab(tab.prop)">{{tab.name}}</div>
</div>
</div>
<div class="top-tool-right" v-if="!customTool">

8
nezha-fronted/src/components/common/bottomBox/tabs/recordRuleEvalLog.vue
View File

@@ -15,7 +15,7 @@
>
<template v-slot:title><span :title="obj.name">{{obj.name}}</span></template>
<template v-slot>
<alertRuleEvalLogTable
<recordRuleEvalLogTable
ref="dataTable"
:orderByFa="'id'"
v-my-loading="tools.loading"
@@ -30,7 +30,7 @@
@edit="edit"
@orderBy="tableDataSort"
@reload="getTableData"
@selectionChange="selectionChange"></alertRuleEvalLogTable>
@selectionChange="selectionChange"></recordRuleEvalLogTable>
</template>
<template v-slot:pagination>
<Pagination ref="Pagination" :pageObj="pageObj" :tableId="tableId" @pageNo='pageNo' @pageSize='pageSize'></Pagination>
@@ -42,7 +42,7 @@
import dataListMixin from '@/components/common/mixin/dataList'
import subDataListMixin from '@/components/common/mixin/subDataList'
import nzBottomDataList from '@/components/common/bottomBox/nzBottomDataList'
import alertRuleEvalLogTable from '@/components/common/table/alert/alertRuleEvalLogTable'
import recordRuleEvalLogTable from '@/components/common/table/settings/recordRuleEvalLogTable'
import detailViewRightMixin from '@/components/common/mixin/detailViewRightMixin'
export default {
@@ -50,7 +50,7 @@ export default {
mixins: [dataListMixin, subDataListMixin, detailViewRightMixin],
components: {
nzBottomDataList,
alertRuleEvalLogTable
recordRuleEvalLogTable
},
props: {
obj: Object,

7
nezha-fronted/src/components/common/bottomBox/tabs/terminalLogCMDTab.vue
View File

@@ -1,7 +1,7 @@
<template>
<nz-bottom-data-list
:showPagination="false"
:showTitle='showTitle'
:tableId="tableId"
:obj='obj'
:layout="[]"
:tabs="tabs"
@@ -51,10 +51,11 @@ export default {
calcTime () {
return function (time) {
if (this.obj.startTime) {
const startTime = new Date(this.obj.startTime).getTime()
console.log(this.utcTimeToTimezoneStr(this.obj.startTime))
const startTime = this.momentStrToTimestamp(this.utcTimeToTimezoneStr(this.obj.startTime))
if (startTime) {
const thisTime = startTime + time
return this.dateFormat(thisTime)
return this.momentTz(thisTime)
}
}
return '-'

1
nezha-fronted/src/components/common/bottomBox/tabs/terminalLogMonitorTab.vue
View File

@@ -6,7 +6,6 @@
:tabs="tabs"
:targetTab="targetTab"
@changeTab="changeTab"
:tableId="tableId"
:title="'Session ID'"
>
<template v-slot:title><span :title="obj.uuid.substring(0, 8).toUpperCase()">{{obj.uuid.substring(0, 8).toUpperCase()}}</span></template>

1
nezha-fronted/src/components/common/bottomBox/tabs/terminalLogRecordTab.vue
View File

@@ -2,7 +2,6 @@
<nz-bottom-data-list
:showTitle='showTitle'
:obj='obj'
:tableId="tableId"
:layout="[]"
:tabs="tabs"
:targetTab="targetTab"

24
nezha-fronted/src/components/common/bottomBox/tabs/vsysBottomTab.vue
View File

@@ -28,7 +28,7 @@
:terminaLogTab="true"
@del="del"
@edit="edit"
@orderBy="tableDataSort"
@tableDataSort="tableDataSort"
@reload="getTableData"
@selectionChange="selectionChange"></assetVsysTable>
</template>
@@ -65,7 +65,9 @@ export default {
searchLabelList: []
},
searchLabel: {},
tableData: []
tableData: [],
orderBy: { order: 'ascending', prop: 'id' }
}
},
methods: {
@@ -75,7 +77,7 @@ export default {
this.$get(this.url, this.searchLabel).then(response => {
this.tools.loading = false
if (response.code === 200) {
this.tableData = response.data.list
this.tableData = this.filterShowData(response.data.list, this.orderBy)
if (!this.scrollbarWrap && this.$refs.dataTable && this.$refs.dataTable.$refs.dataTable) {
this.$nextTick(() => {
this.scrollbarWrap = this.$refs.dataTable.$refs.dataTable.bodyWrapper
@@ -84,6 +86,22 @@ export default {
}
}
})
},
// 数据排序
tableDataSort (item) {
this.orderBy = item
this.filterShowData(this.tableData, item)
},
filterShowData (source, ord) {
let orderBy = null
orderBy = ord
if (orderBy.order === 'ascending') {
source = source.sort(this.$tableSet.asce(orderBy.prop))
}
if (orderBy.order === 'descending') {
source = source.sort(this.$tableSet.desc(orderBy.prop))
}
return source
}
}
}

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

@@ -6,7 +6,7 @@
</button>
</div>
<button v-if="this.type === 'btn'" class="table-operation-item delete-button" :id="id" @click="batchDelete" :title="$t('overall.delete')"><i class="nz-icon nz-icon-delete"></i></button>
<div v-if="this.type === 'link'" :id="id" @click="batchDelete" :title="$t('overall.delete')">
<div v-if="this.type === 'link'" :id="id" @click="batchDelete">
<span><i class="nz-icon nz-icon-delete" ></i>{{title}}</span>
</div>
<el-dialog

939
nezha-fronted/src/components/common/honeycomb/hexagonFigureSvg.vue
View File

@@ -1,939 +0,0 @@
<template>
<div ref="box" class="box-hexagon" v-clickoutside="{obj:{},func:hexagonSvgClearScale}" v-if="boxhexagonShow">
<div :id="hexagonSvgID">
</div>
<div class="mask" v-if="maskShow">
</div>
</div>
</template>
<script>
import { SVG } from '@svgdotjs/svg.js'
import '@svgdotjs/svg.panzoom.js'
import { getHexagon, setHexagon, delHexagon } from '../js/common'
function PolylineOver () {
this.stroke({ color: '#909090' })
}
function PolylineOut () {
this.stroke({ color: '#DADADA' })
}
function hexagonPoint (x, y, edge) { // 根据左上角坐标点生成六边的六个点的坐标 通过 svg画出
return new Promise(resolve => {
const MathSqrt3 = Math.sqrt(3)
const x1 = x
const y1 = y + edge / 2
const x2 = x + MathSqrt3 * edge / 2
const y2 = y
const x3 = x + MathSqrt3 * edge
const y3 = y + edge / 2
const x4 = x + MathSqrt3 * edge
const y4 = y + edge / 2 + edge
const x5 = x + MathSqrt3 * edge / 2
const y5 = y + edge * 2
const x6 = x
const y6 = y + edge / 2 + edge
const arr = [{ x: x1, y: y1 }, { x: x2, y: y2 }, { x: x3, y: y3 }, { x: x4, y: y4 }, { x: x5, y: y5 }, { x: x6, y: y6 }]
let svgStrPoint = ''
arr.forEach((item) => {
svgStrPoint += item.x + ',' + item.y + ' '
})
const center = [x + MathSqrt3 * edge / 2, y + edge]
resolve({
point: arr,
svgStrPoint,
center
})
})
}
// eslint-disable-next-line no-unused-vars
function midpoint (point1, point2) { // 计算中点
return {
x: (point1.x + point2.x) / 2,
y: (point1.y + point2.y) / 2
}
}
function borderMove (left, top, borderSize, type, svgPolyline) { // left,top, 坐标 borderSize 长度,type 外层边框线从哪走到那
const point = [null, null]
const MathSqrt3 = Math.sqrt(3)
const arr = svgPolyline.array()
switch (type) {
case 1: // 从左到右的斜上方运动
point[0] = left + MathSqrt3 * borderSize / 2
point[1] = top - borderSize / 2
break
case 2: // 从左到右的斜下方运动
point[0] = left + MathSqrt3 * borderSize / 2
point[1] = top + borderSize / 2
break
case 3: // 从上到下的正下方运动
point[0] = left
point[1] = top + borderSize
break
case 4: // 从右到左的斜下方运动
point[0] = left - MathSqrt3 * borderSize / 2
point[1] = top + borderSize / 2
break
case 5: // 从右到左的斜上方运动
point[0] = left - MathSqrt3 * borderSize / 2
point[1] = top - borderSize / 2
break
case 6: // 从右到左的斜上方运动
point[0] = left
point[1] = top - borderSize
break
}
arr.push(point)
svgPolyline.plot(arr)
return point
}
export default {
name: 'hexagonFigureSvg',
props: {
hexData: {}, // 数据
hexagonSvgID: { // 在同一个页面创建多个实例时 需要通过id区分
type: String,
required: true
},
col: {}, // 列数
colorFrom: { // 通过什么决定颜色
type: String,
default: ''
},
infoSet: { // 设置六边形内部内容 参数 group 对应六边形所在的组。allHexagonRect吧所有文本框放入，方便控制显示隐藏。data 六边形的相关数 data.center 中心点。that 子组件实例
type: Function
},
colorSet: { // 设置方块对应颜色 参数 item 当前item的数据
type: Function,
default: () => {
return { color: '#99D7C2', hoverColor: '#B2ECD9' }
}
},
infoShow: { // 设置六边形内部内容 放大显示时的样式 参数 allHexagonRect
type: Function
},
infoHide: { // 设置六边形内部内容 缩小显示时的样式 参数 allHexagonRect
type: Function
},
hexagonEdgeProp: { // 边框长度
type: Number,
default: 90
},
magnifyRate: { // 放大倍率
type: Number,
default: 1
},
isClickRate: { // 是否支持点击放大
type: Boolean,
default: true
},
showTooltip: {
type: Boolean,
default: false
},
isPanning: { // 是否支持移动
type: Boolean,
default: true
},
isPinchZoom: { // 是否支持手指缩放
type: Boolean,
default: false
},
isWheelZoom: { // 是否支持手指缩放
type: Boolean,
default: false
},
zoomFactor: { // 鼠标滚轮放大倍数
type: Number,
default: 0.5
},
zoomMin: { // 最小倍数
type: Number,
default: 0.2
},
zoomMax: { // 最小倍数
type: Number,
default: 5
},
from: {
type: String,
default: 'asset'
}
},
watch: {
hexData: {
immediate: false,
deep: true,
handler (n) {
this.init()
}
},
col: { // 列数
immediate: false,
deep: true,
handler () {
this.init()
}
},
hexagonEdgeProp: {
immediate: false,
deep: true,
handler (n) {
}
}
},
data () {
return {
allHexagon: [],
allGroup: [],
// col:5,
row: 5,
boxPadLeft: 360,
boxPadTop: 180,
hexagonData: [],
textAll: [],
hexSize: '',
MathSqrt3: Math.sqrt(3),
hexagonTextPos: {
top: 0,
left: 0,
show: false,
data: null
},
boxhexagonShow: false,
pan: false, // 是否移动
defaultColor: { color: '#99D7C2', hoverColor: '#B2ECD9' },
viewBox: null,
isShowHover: true, // 是否显示hover块
timer: null, // 定时器用来处理单击双击的冲突
firstInit: true, // 优化刚加载时的多次点击造成放大缩小功能的不正常
defaultRate: 0.33, // 默认倍率 最小0.2
defaultBoxWidth: 2288,
hexagonEdge: JSON.stringify(this.hexagonEdgeProp),
fontSize: 14,
maskShow: true,
windowRate: 1,
scaleFlag: true
}
},
computed: {
interspace () {
return (this.hexagonEdge * this.MathSqrt3 / 5) * 0.5
}
},
created () {
},
mounted () {
// this.init()
window.addEventListener('visibilitychange', this.reload)
},
methods: {
init () { // 创建svg实例
this.boxhexagonShow = false
this.maskShow = true
this.hexagonEdge = this.hexagonEdgeProp
this.clearData().then(() => {
this.boxhexagonShow = true
setTimeout(() => {
this.hexagonData = JSON.parse(JSON.stringify(this.hexData))
const box = `#${this.hexagonSvgID}`
if (!document.getElementById(this.hexagonSvgID)) {
return
}
const hexagonSvg = SVG().addTo(box).size('100%', '100%')
.panZoom({
zoomMin: this.zoomMin,
zoomMax: this.zoomMax,
zoomFactor: this.zoomFactor,
pinchZoom: this.isPinchZoom,
wheelZoom: this.isWheelZoom,
panning: this.isPanning
})
.attr('id', 'SvgHex' + this.hexagonSvgID)
.attr('class', this.hexagonSvgID)
.attr('viewBox', `0 0 ${this.$refs.box.offsetWidth} ${this.$refs.box.offsetHeight}`) // svg实例
hexagonSvg.on('click', this.hexagonSvgClearScale)
hexagonSvg.on('panStart', this.hexagonSvgPanStart)
hexagonSvg.on('mousemove', this.hexagonMove)
hexagonSvg.on('panEnd', this.hexagonSvgPanEnd)
this.getLayout()
const Rate = (this.$refs.box.offsetWidth / this.defaultBoxWidth)
// Rate = (Rate > 0.2 ? Rate : 0.2)
this.windowRate = Rate
this.hexagonEdge = (this.hexagonEdge / this.defaultRate) * Rate
this.fontSize = 14
const fontSize = ((this.fontSize / this.defaultRate) * Rate)
this.fontSize = fontSize < 8 ? 8 : fontSize
setHexagon(this.hexagonSvgID, {
hexagonSvg: hexagonSvg,
svgPolyline: null,
allHexagonRect: [],
allHexagonText: [],
hover: null
})
this.getPadding().then(() => {
getHexagon(this.hexagonSvgID).svgPolyline = getHexagon(this.hexagonSvgID).hexagonSvg.polyline().fill('none').stroke({
color: '#DADADA',
width: 3,
linecap: 'round',
linejoin: 'round'
})
this.getDataPoint()
})// 获取到上方和左方的距离;
setTimeout(() => {
this.firstInit = false
}, 500)
})
}).catch((res) => {
// console.info(res)
})
},
getLayout () {
this.boxWidth = this.$refs.box.offsetWidth
this.boxHeight = this.$refs.box.offsetHeight
return new Promise(resolve => {
let radius = 0
let col = 0
let row = 0
for (let i = 1; i <= this.hexagonData.length; i++) {
const cols = Math.ceil(this.hexagonData.length / i)
const hexaRadiusY = Math.ceil((this.boxHeight * 2) / (3 * i + 1))
let hexaRadiusX = ''
if (i === 1) {
hexaRadiusX = Math.ceil(this.boxWidth / (Math.sqrt(3) * cols))
} else {
hexaRadiusX = Math.ceil(this.boxWidth / (Math.sqrt(3) * cols + Math.sqrt(3) / 2))
}
const rateMax = hexaRadiusX > hexaRadiusY ? hexaRadiusY : hexaRadiusX
if (rateMax > radius) {
radius = rateMax
col = cols
row = i
}
}
if (this.hexagonData.length) {
while (col * row >= this.hexagonData.length) { // 避免出现空白
row--
}
}
row++
if (col === 1 || row === 1) { // 行 或 列有一个为1时 需要调换位置 显示才会好看
const temp = col
col = row
row = temp
}
resolve({ col, row, radius: radius })
})
},
reload () {
if (!document.hidden) {
this.init()
}
},
getPadding () { // 确定到上方和下方的距离 保持居中
return new Promise(resolve => {
const hexagonWidth = this.MathSqrt3 * this.hexagonEdge + this.interspace
const hexagonHeight = this.hexagonEdge * 2 + this.interspace
let row = parseInt((this.hexagonData.length) / (this.col * 2 - 1)) * 2// 行数是总数除2倍列数-1的整数部分 加上根据余数的判断
const dolNum = (this.hexagonData.length) % (this.col * 2 - 1)
if (dolNum > 0 && dolNum <= this.col) { // 余数的判断
row += 1
} else if (dolNum > 0 && dolNum > this.col) {
row += 2
}
this.row = row
if (this.hexagonData.length - 1 <= this.col) {
// boxPadLeft:200, boxPadTop:75,
this.boxPadLeft = (this.$refs.box.offsetWidth - this.hexagonData.length * hexagonWidth) / 2
this.boxPadTop = (this.$refs.box.offsetHeight - hexagonHeight) / 2 // 只有一行是 到上方距离应该是两倍边长
} else {
this.boxPadLeft = (this.$refs.box.offsetWidth - this.col * hexagonWidth) / 2
this.boxPadTop = (this.$refs.box.offsetHeight - (hexagonHeight + (this.row - 1) * hexagonHeight * 3 / 4)) / 2 // 大于一行时 为一行的行高 + 3/2的行高
}
resolve()
})
},
getDataPoint () { // 确定所有坐标点的位置
const col = this.col// 确定列数
const row = this.row// 确定列数
const paddingTop = this.boxPadTop // 到上方的距离
const paddingLeft = this.boxPadLeft // 整体到左侧的距离
let arrIndex = 0
this.hexSize = this.MathSqrt3 * this.hexagonEdge / 2
for (let i = 0; i < row; i++) { // 确定 所有 坐标点
if (arrIndex > this.hexagonData.length - 1) {
break
}
for (let j = 0; j < col; j++) {
if (arrIndex > this.hexagonData.length - 1) {
break
}
if (i === 0) {
this.hexagonData[arrIndex].left = j * (this.hexSize * 2 + this.interspace) + paddingLeft
this.hexagonData[arrIndex].top = i * (this.hexSize * 2) + paddingTop
this.hexagonData[arrIndex].sub = i + '-' + j
} else if (i % 2 === 0) {
// if(i===2&&( j===1 || j==2)){
// this.hexagonData[arrIndex].left=j*(this.hexSize*2 + this.interspace)+ paddingLeft;
// this.hexagonData[arrIndex].top=i*(this.hexSize*2 + this.interspace/2 - this.hexSize*2*1/8)+ paddingTop;
// }else{
// continue;
// }
this.hexagonData[arrIndex].left = j * (this.hexSize * 2 + this.interspace) + paddingLeft
this.hexagonData[arrIndex].top = i * (this.hexSize * 2 + this.interspace / 2 * this.MathSqrt3 - this.hexSize * 2 / 8) + paddingTop
this.hexagonData[arrIndex].sub = i + '-' + j
} else {
if (j === col - 1) {
break
}
// if(i!==3){
// this.hexagonData[arrIndex].left=j*(this.hexSize*2 + this.interspace ) + this.hexSize*2/2 + this.interspace/2+ paddingLeft;
// this.hexagonData[arrIndex].top=i*(this.hexSize*2 + this.interspace/2 - this.hexSize*2*1/8) + paddingTop;
// } else if(i==3&&(j===1)){
// this.hexagonData[arrIndex].left=j*(this.hexSize*2 + this.interspace ) + this.hexSize*2/2 + this.interspace/2+ paddingLeft;
// this.hexagonData[arrIndex].top=i*(this.hexSize*2 + this.interspace/2 - this.hexSize*2*1/8) + paddingTop;
// }else{
// continue;
// }
this.hexagonData[arrIndex].left = j * (this.hexSize * 2 + this.interspace) + this.hexSize * 2 / 2 + this.interspace / 2 + paddingLeft
this.hexagonData[arrIndex].top = i * (this.hexSize * 2 + this.interspace / 2 * this.MathSqrt3 - this.hexSize * 2 / 8) + paddingTop
this.hexagonData[arrIndex].sub = i + '-' + j
}
arrIndex++
}
}
this.renderSomeHexagonAll()
},
renderSomeHexagonAll () { // 遍历所有数据 绘画六边形 之后画边框
const arr = []
this.hexagonData.forEach(item => {
this.renderHexagon(item)
arr.push(this.renderHexagon.bind(this, item))
})
Promise.all(arr).then(() => {
if (getHexagon(this.hexagonSvgID) && getHexagon(this.hexagonSvgID).hexagonSvg) {
this.borderHex()
getHexagon(this.hexagonSvgID).hexagonSvg.animate(300).zoom(this.defaultRate)
const hoverRect = getHexagon(this.hexagonSvgID).hexagonSvg.group().addClass('hoverRect')
hoverRect.rect()
hoverRect.text('a')
hoverRect.hide()
getHexagon(this.hexagonSvgID).hover = hoverRect
setTimeout(() => {
if (getHexagon(this.hexagonSvgID) && getHexagon(this.hexagonSvgID).hexagonSvg) {
this.viewBox = getHexagon(this.hexagonSvgID).hexagonSvg.attr('viewBox')
}
this.maskShow = false
}, 300)
}
})
},
renderHexagon (item) { // 绘画六边形
return new Promise(resolve => {
hexagonPoint(item.left, item.top, this.hexagonEdge).then(data => {
const color = this.colorSet ? this.colorSet(item) : this.defaultColor
const group = getHexagon(this.hexagonSvgID).hexagonSvg.group()
const polygon = group.polygon(data.svgStrPoint).fill(color.color)
polygon.data({
...data,
...item,
...color
})
group.on('mouseenter', this.hexagonOver.bind(this, group))
group.on('mouseleave', this.hexagonOut.bind(this, group))
group.on('click', this.changeScale.bind(this, polygon.data('center'), item, data, group))
this.allHexagon.push(polygon)
this.allGroup.push(group)
// 向六边形内 添加文本 本质是根据六边形的中心点确定各个文本位置
if (this.infoSet) {
this.infoSet(group, getHexagon(this.hexagonSvgID).allHexagonRect, getHexagon(this.hexagonSvgID).allHexagonText, data, item, this.fontSize, this)
}
resolve()
})
})
},
hexagonOver (that, e) { // 移入六边形
const color = that.first().data('hoverColor')
that.first().timeline().unschedule(that.first().animate())
that.timeline().unschedule(that.first().animate())
that.first().animate(100).stroke({ width: 3, color: '#909090' }).fill(color)
that.animate(100).transform({ scale: 1.1 })
that.parent().find('polyline').stroke({ color: '#909090' })
const hover = that.parent().find('.hoverRect')
if (this.isShowHover && hover && this.from && !this.showTooltip) { // 不显示气泡 显示基本信息
const center = that.first().data('center')
let str = this.from === 'asset' ? that.first().data('host') : that.first().data('module')
str += ''
hover.show()
hover.get(1).attr(
{
x: center[0] - (str.length * 20 + 30) / 2,
y: center[1] - this.hexagonEdge - 76
}
).fill({ color: '#fff', weight: 400 }).text(str).font({ size: 36 })
const textPaddingWidth = ((str.length * 20 + 30) - hover.get(1).bbox()[0].width) / 2
hover.get(1).attr(
{
x: center[0] - (str.length * 20 + 30) / 2 + textPaddingWidth,
y: center[1] - this.hexagonEdge - 76
}
)
hover.get(0).attr(
{
x: center[0] - (str.length * 20 + 30) / 2,
y: center[1] - this.hexagonEdge - 80
}
).fill({ color: 'rgba(0,0,0,0.3)' }).size((str.length * 20 + 30), 72).attr({ rx: '10', ry: '10' })
}
if (this.isShowHover && this.showTooltip) { // 显示气泡
this.$emit('changeAsset', that.first().data('id'), e)
}
},
hexagonMove (e) { // 六边形内移动
if (this.showTooltip) { // 显示气泡
this.$emit('assetMove', e)
}
// this.$emit('assetMove',e)
},
hexagonOut (that) { // 移出六边形
const color = that.first().data('color')
that.first().timeline().unschedule(that.first().animate())
that.timeline().unschedule(that.first().animate())
that.first().animate(100).stroke({ width: 0, color: '#909090' }).fill(color)
that.animate(100).transform({ scale: 1 })
that.parent().find('polyline').stroke({ color: '#DADADA' })
const hover = that.parent().find('.hoverRect')
if (hover && !this.showTooltip) { // 不显示气泡 显示基本信息
hover.hide()
}
if (this.showTooltip) { // 显示气泡
this.$emit('closeAsset')
}
},
changeScale (center, item1, data, group, e) {
window.event ? window.event.cancelBubble = true : e.stopPropagation()
if (this.scaleFlag) {
this.hexagonSvgScale(center, item1, data, group, e)
} else {
this.hexagonSvgClearScale(e)
}
},
hexagonSvgScale (center, item1, data, group, e) {
window.event ? window.event.cancelBubble = true : e.stopPropagation()
this.$emit('closeAsset')
if (this.timer) {
clearTimeout(this.timer)
this.timer = null
}
this.group = group
// this.group.on('dblclick',this.hexagonSvgClearScale);
if (!this.pan && this.isClickRate) {
getHexagon(this.hexagonSvgID).hexagonSvg.animate(300).zoom(this.magnifyRate, { x: center[0], y: center[1] })
if (this.infoShow) {
this.infoShow(getHexagon(this.hexagonSvgID).allHexagonRect, getHexagon(this.hexagonSvgID).allHexagonText)
}
this.isShowHover = false
this.scaleFlag = false
}
const hover = getHexagon(this.hexagonSvgID).hexagonSvg.find('.hoverRect')
if (hover) {
hover.hide()
}
},
hexagonSvgClearScale (e) {
// window.event? window.event.cancelBubble = true:e.stopPropagation();
if (this.firstInit) { return }
if (this.group) {
// this.group.off('dblclick',this.hexagonSvgClearScale);
this.group = null
}
if (!this.pan && this.isClickRate) {
getHexagon(this.hexagonSvgID).hexagonSvg.animate(300).zoom(this.defaultRate).attr('viewBox', this.viewBox)
this.scaleFlag = true
if (this.infoHide) {
this.infoHide(getHexagon(this.hexagonSvgID).allHexagonRect, getHexagon(this.hexagonSvgID).allHexagonText)
}
this.timer = setTimeout(() => {
this.isShowHover = true
}, 100)
window.getSelection().empty()// 取消选中文字
}
},
hexColorToRgb (color) {
const reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/
// 把颜色值变成小写
if (reg.test(color)) {
// 如果只有三位的值，需变成六位，如：#fff => #ffffff
if (color.length === 4) {
let colorNew = '#'
for (let i = 1; i < 4; i += 1) {
colorNew += color.slice(i, i + 1).concat(color.slice(i, i + 1))
}
color = colorNew
}
// 处理六位的颜色值，转为RGB
const colorChange = []
for (let i = 1; i < 7; i += 2) {
colorChange.push(parseInt('0x' + color.slice(i, i + 2)))
}
return colorChange.join(',')
} else {
return color
}
},
hexagonSvgPanStart (ev) { // 实例移动开始 解绑点击函数
ev.preventDefault()
setTimeout(() => { // 设置延时 解决移动后的缩放问题
this.pan = true
}, 100)
},
hexagonSvgPanEnd (ev) { // 实例移动结束 重新绑定点击函数
ev.preventDefault()
setTimeout(() => { // 设置延时 解决移动后的缩放问题
this.pan = false
}, 100)
// if(this.isShowHover&&getHexagon(this.hexagonSvgID).hexagonSvg){ // 记录移动位置 对双击事件有一定影响 暂时关闭 后续优化
// this.viewBox=getHexagon(this.hexagonSvgID).hexagonSvg.attr('viewBox');
// }
},
borderHex () { // 外层边框 数组点
const length = this.allHexagon.length
if (length == 0) { // 为0 调出
return
}
const k = { x: -this.interspace, y: -(this.interspace * 2) * this.MathSqrt3 / 6 }// 边框对起点的偏移量
const item = this.allHexagon[0].data('point')[0]
const endItemSub = this.allHexagon[length - 1].data('sub').split('-')
const borderCol = endItemSub[1]
const borderRow = endItemSub[0]
let borderPoint = [item.x + k.x, item.y + k.y]
let borderSize = this.hexagonEdge * 1.2
getHexagon(this.hexagonSvgID).svgPolyline.plot([borderPoint])
// 先从左到右划线 应该是 col的长度
let borderColTop = 0
if (borderRow == 0) {
borderColTop = borderCol
} else {
borderColTop = this.col - 1
}
for (let i = 0; i <= borderColTop * 2; i++) {
if (i === 1) {
borderSize = this.hexagonEdge * 1.1
}
if (i % 2 === 0) {
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 1, getHexagon(this.hexagonSvgID).svgPolyline)
} else {
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 2, getHexagon(this.hexagonSvgID).svgPolyline)
}
}
borderSize = this.hexagonEdge * 1.2
// 从上到下 应该是row的长度 分情况
let borderRowRight = 0// 右边循环次数
// 情况1 borderCol<=this.col && row==0时
if ((borderCol <= this.col - 1) && borderRow == 0) {
borderRowRight = 3
for (let i = 0; i < borderRowRight - 1; i++) {
if (i === 1) {
// borderPoint = borderMove(borderPoint[0],borderPoint[1],borderSize,2,,getHexagon(this.hexagonSvgID).svgPolylinetrue);
borderSize = this.hexagonEdge * 1.2
}
if (i === 2) {
// borderPoint = borderMove(borderPoint[0],borderPoint[1],borderSize,2,,getHexagon(this.hexagonSvgID).svgPolylinetrue);
borderSize = this.hexagonEdge * 1.1
}
if (i % 4 === 0) {
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 2, getHexagon(this.hexagonSvgID).svgPolyline)
} else if (i % 4 === 1) {
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 3, getHexagon(this.hexagonSvgID).svgPolyline)
} else if (i % 4 === 2) {
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 4, getHexagon(this.hexagonSvgID).svgPolyline)
} else if (i % 4 === 3) {
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 3, getHexagon(this.hexagonSvgID).svgPolyline)
}
}
}
// 情况2 border==this.col&& row>0时 且row 为奇数事
if (borderCol == this.col - 2 && borderRow > 0 && borderRow % 2 == 1) {
borderRowRight = 2 * (Number(borderRow) + 1)
for (let i = 0; i < borderRowRight; i++) {
if (i % 4 === 0) {
borderSize = this.hexagonEdge * 1.1
if (i == 0) {
borderSize = this.hexagonEdge * 1.2
}
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 2, getHexagon(this.hexagonSvgID).svgPolyline)
} else if (i % 4 === 1) {
borderSize = this.hexagonEdge * 1.2
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 3, getHexagon(this.hexagonSvgID).svgPolyline)
} else if (i % 4 === 2) {
borderSize = this.hexagonEdge * 1.1
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 4, getHexagon(this.hexagonSvgID).svgPolyline)
} else if (i % 4 === 3) {
borderSize = this.hexagonEdge * 1.03
if (i === borderRowRight - 1) {
borderSize = this.hexagonEdge * 1.1
}
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 3, getHexagon(this.hexagonSvgID).svgPolyline)
}
}
}
// 情况3 borderCol==this.col && row>0 且 row 为偶数事
if (borderCol == this.col - 1 && borderRow > 0 && borderRow % 2 == 0) {
borderRowRight = 2 * (Number(borderRow) + 1) + 1
for (let i = 0; i < borderRowRight - 1; i++) {
if (i % 4 === 0) {
borderSize = this.hexagonEdge * 1.1
if (i == 0) {
borderSize = this.hexagonEdge * 1.2
}
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 2, getHexagon(this.hexagonSvgID).svgPolyline)
} else if (i % 4 === 1) {
borderSize = this.hexagonEdge * 1.2
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 3, getHexagon(this.hexagonSvgID).svgPolyline)
} else if (i % 4 === 2) {
borderSize = this.hexagonEdge * 1.1
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 4, getHexagon(this.hexagonSvgID).svgPolyline)
} else if (i % 4 === 3) {
borderSize = this.hexagonEdge * 1.03
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 3, getHexagon(this.hexagonSvgID).svgPolyline)
}
}
}
// 情况4 border<this.col&& row>0时 且row 为奇数事
if (borderCol < this.col - 2 && borderRow > 0 && borderRow % 2 == 1) {
borderRowRight = 2 * (Number(borderRow - 1) + 1)
for (let i = 0; i < borderRowRight; i++) {
if (i % 4 === 0) {
borderSize = this.hexagonEdge * 1.1
if (i == 0) {
borderSize = this.hexagonEdge * 1.2
}
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 2, getHexagon(this.hexagonSvgID).svgPolyline)
} else if (i % 4 === 1) {
borderSize = this.hexagonEdge * 1.2
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 3, getHexagon(this.hexagonSvgID).svgPolyline)
} else if (i % 4 === 2) {
borderSize = this.hexagonEdge * 1.1
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 4, getHexagon(this.hexagonSvgID).svgPolyline)
} else if (i % 4 === 3) {
borderSize = this.hexagonEdge * 1.03
if (i === borderRowRight - 1) {
borderSize = this.hexagonEdge * 1.1
}
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 3, getHexagon(this.hexagonSvgID).svgPolyline)
}
}// 向下移动
borderSize = this.hexagonEdge * 1.2
for (let i = 0; i < (this.col - borderCol - 1) * 2 - 1; i++) { // 向左移动
if (i === 1) {
borderSize = this.hexagonEdge * 1.1
}
if (i == (this.col - borderCol - 1) * 2 - 2) {
borderSize = this.hexagonEdge
}
if (i % 2 === 0) {
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 4, getHexagon(this.hexagonSvgID).svgPolyline)
} else {
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 5, getHexagon(this.hexagonSvgID).svgPolyline)
}
}
borderSize = this.hexagonEdge * 1.1
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 3, getHexagon(this.hexagonSvgID).svgPolyline)
}
// 情况5 borderCol<this.col && row>0 且 row 为偶数事
if (borderCol < this.col - 1 && borderRow > 0 && borderRow % 2 == 0) {
borderRowRight = 2 * (Number(borderRow - 1) + 1) + 1
for (let i = 0; i < borderRowRight - 1; i++) {
if (i % 4 === 0) {
borderSize = this.hexagonEdge * 1.1
if (i == 0) {
borderSize = this.hexagonEdge * 1.2
}
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 2, getHexagon(this.hexagonSvgID).svgPolyline)
} else if (i % 4 === 1) {
borderSize = this.hexagonEdge * 1.2
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 3, getHexagon(this.hexagonSvgID).svgPolyline)
} else if (i % 4 === 2) {
borderSize = this.hexagonEdge * 1.1
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 4, getHexagon(this.hexagonSvgID).svgPolyline)
} else if (i % 4 === 3) {
borderSize = this.hexagonEdge * 1.03
if (i === borderRowRight - 2) {
borderSize = this.hexagonEdge * 1.15
}
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 3, getHexagon(this.hexagonSvgID).svgPolyline)
}
}
borderSize = this.hexagonEdge * 1.2
for (let i = 0; i < (this.col - borderCol - 1) * 2 - 1; i++) { // 向左移动
if (i == 1) {
borderSize = this.hexagonEdge * 1.1
}
if (i == (this.col - borderCol - 1) * 2 - 2) {
borderSize = this.hexagonEdge * 1
}
if (((Number(borderCol) + 2) == this.col) && (i == 0)) {
borderSize = this.hexagonEdge * 1.1
}
if (i % 2 === 0) {
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 4, getHexagon(this.hexagonSvgID).svgPolyline)
} else {
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 5, getHexagon(this.hexagonSvgID).svgPolyline)
}
}
borderSize = this.hexagonEdge * 1.1
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 3, getHexagon(this.hexagonSvgID).svgPolyline)
}
// 从右到左 就是结束时的列数
borderSize = this.hexagonEdge * 1.2
for (let i = 0; i <= borderCol * 2 + 1; i++) {
if (i === 1) {
// borderPoint = borderMove(borderPoint[0],borderPoint[1],borderSize,2,,getHexagon(this.hexagonSvgID).svgPolylinetrue);
borderSize = this.hexagonEdge * 1.1
}
if (i == borderCol * 2 + 1) {
borderSize = this.hexagonEdge * 1.2
}
if (i % 2 === 0) {
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 4, getHexagon(this.hexagonSvgID).svgPolyline)
} else {
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 5, getHexagon(this.hexagonSvgID).svgPolyline)
}
}
// 从下向上的移动
// 分兩種情況
borderSize = this.hexagonEdge * 1.2
if (borderRow % 2 == 1) {
for (let i = 0; i <= borderRow * 2; i++) {
if (i % 4 === 0) {
borderSize = this.hexagonEdge * 1.1
if (i !== 0) {
borderSize = this.hexagonEdge * 1.03
}
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 6, getHexagon(this.hexagonSvgID).svgPolyline)
} else if (i % 4 === 1) {
borderSize = this.hexagonEdge * 1.1
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 5, getHexagon(this.hexagonSvgID).svgPolyline)
} else if (i % 4 === 2) {
borderSize = this.hexagonEdge * 1.2
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 6, getHexagon(this.hexagonSvgID).svgPolyline)
} else if (i % 4 === 3) {
borderSize = this.hexagonEdge * 1.1
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 1, getHexagon(this.hexagonSvgID).svgPolyline)
}
}
}
if (borderRow % 2 == 0) {
for (let i = 0; i <= borderRow * 2; i++) {
if (i % 4 === 0) {
borderSize = this.hexagonEdge * 1.2
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 6, getHexagon(this.hexagonSvgID).svgPolyline)
} else if (i % 4 === 1) {
borderSize = this.hexagonEdge * 1.1
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 1, getHexagon(this.hexagonSvgID).svgPolyline)
} else if (i % 4 === 2) {
borderSize = this.hexagonEdge * 1.03
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 6, getHexagon(this.hexagonSvgID).svgPolyline)
} else if (i % 4 === 3) {
borderSize = this.hexagonEdge * 1.1
borderPoint = borderMove(borderPoint[0], borderPoint[1], borderSize, 5, getHexagon(this.hexagonSvgID).svgPolyline)
}
}
}
getHexagon(this.hexagonSvgID).svgPolyline.on('mouseover', PolylineOver)
getHexagon(this.hexagonSvgID).svgPolyline.on('mouseout', PolylineOut)
},
clearData () { // 清除数据 以及解绑事件 防止内存崩溃
if (getHexagon(this.hexagonSvgID) && getHexagon(this.hexagonSvgID).hexagonSvg) {
this.allHexagon.forEach((item) => {
item.off('mouseover', this.hexagonOver)
item.off('mouseout', this.hexagonOut)
item.off('click', this.changeScale)
// item.off('dblclick',this.hexagonSvgClearScale);
item.clear()
})
this.allHexagon = []
this.hexagonData = []
getHexagon(this.hexagonSvgID).hexagonSvg.off('click', this.hexagonSvgClearScale)
getHexagon(this.hexagonSvgID).hexagonSvg.off('mouseover', this.hexagonMove)
getHexagon(this.hexagonSvgID).hexagonSvg.off('panStart', this.hexagonSvgPanStart)
getHexagon(this.hexagonSvgID).hexagonSvg.off('panEnd', this.hexagonSvgPanEnd)
getHexagon(this.hexagonSvgID).hexagonSvg = null // Svg的实例
getHexagon(this.hexagonSvgID).svgPolyline = null// Svg hexagon的边框
delHexagon(this.hexagonSvgID)
}
const dom = document.getElementById(this.hexagonSvgID)
const child = document.getElementById('SvgHex' + this.hexagonSvgID)
if (dom && child) {
dom.removeChild(child)
}
return new Promise((resolve, reject) => {
resolve()
})
}
},
beforeDestroy () {
this.clearData()
if (getHexagon(this.hexagonSvgID)) {
getHexagon(this.hexagonSvgID).allHexagonRect = null// 文本框
getHexagon(this.hexagonSvgID).allHexagonText = null// 文本内容
}
window.removeEventListener('visibilitychange', this.reload)
}
}
</script>
<style scoped>
.box-hexagon, #hexagonSvg {
width: 100%;
height: 100%;
position: relative;
min-width: 200px;
min-height: 200px;
}
.hexagon-text {
position: absolute;
z-index: 1;
font-size: 10px;
}
.stop {
-webkit-animation-play-state: paused;
-moz-animation-play-state: paused;
animation-play-state: paused;
}
.mask{
position: absolute;
height: 100%;
width: 100%;
opacity: 0;
z-index: 20;
top:0;
left: 0;
}
</style>
<style>
#SvgHex {
transition: transform .25s linear;
transform-origin: 0 0;
}
#SvgHex.hexagonSvgBox {
transition: .25s linear;
}
</style>

61
nezha-fronted/src/components/common/js/constants.js
View File

@@ -251,6 +251,30 @@ export const chart = {
value: 'stackArea',
label: i18n.t('dashboard.panel.chartForm.typeVal.stackArea.label')
},
{
value: 'area',
label: i18n.t('dashboard.panel.chartForm.typeVal.stackArea.label')
},
{
value: 'point',
label: i18n.t('dashboard.panel.chartForm.typeVal.point.label')
},
{
value: 'gauge',
label: i18n.t('dashboard.panel.chartForm.typeVal.gauge.label')
},
{
value: 'sankey',
label: i18n.t('dashboard.panel.chartForm.typeVal.sankey.label')
},
{
value: 'hexagon',
label: i18n.t('dashboard.panel.chartForm.typeVal.hexagonFigure.label')
},
{
value: 'stat',
label: i18n.t('dashboard.panel.chartForm.typeVal.singleStat.label')
},
{
value: 'bar',
label: i18n.t('dashboard.panel.chartForm.typeVal.bar.label')
@@ -283,6 +307,7 @@ export const chart = {
value: 'group',
label: i18n.t('dashboard.panel.chartForm.group')
},
{
value: 'logs',
label: i18n.t('overall.logs')
@@ -290,6 +315,42 @@ export const chart = {
{
value: 'diagram',
label: i18n.t('dashboard.panel.chartForm.typeVal.diagram.label')
},
{
value: 'treemap',
label: i18n.t('dashboard.panel.chartForm.typeVal.treemap.label')
},
{
value: 'pie',
label: i18n.t('dashboard.panel.chartForm.typeVal.pie.label')
},
{
value: 'bubble',
label: i18n.t('dashboard.panel.chartForm.typeVal.bubble.label')
},
{
value: 'rank',
label: i18n.t('dashboard.panel.chartForm.typeVal.rank.label')
},
{
value: 'log',
label: i18n.t('dashboard.panel.chartForm.typeVal.log.label')
},
{
value: 'table',
label: i18n.t('dashboard.panel.chartForm.typeVal.table.label')
},
{
value: 'map',
label: i18n.t('dashboard.panel.chartForm.typeVal.map.label')
},
{
value: 'topology',
label: i18n.t('dashboard.panel.chartForm.typeVal.topology.label')
},
{
value: 'clock',
label: i18n.t('dashboard.panel.chartForm.typeVal.clock.label')
}
]
}

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

@@ -392,15 +392,9 @@ export default {
element.click()
},
copyValue () {
const domUrl = document.createElement('input')
domUrl.value = this.fileContent
domUrl.id = 'creatDom'
document.body.appendChild(domUrl)
domUrl.select() // 选择对象
document.execCommand('Copy') // 执行浏览器复制命令
const creatDom = document.getElementById('creatDom')
creatDom.parentNode.removeChild(creatDom)
this.$message.success(this.$t('overall.copySuccess'))
this.$copyText(this.fileContent).then(() => {
this.$message.success({ message: this.$t('overall.copySuccess') })
})
},
initEvent () {
bus.$on('profile-dialog', () => {

3
nezha-fronted/src/components/common/mixin/dataList.js
View File

@@ -1321,6 +1321,9 @@ export default {
} else if (this.$refs.dataDetail) {
tableTitle = this.$refs.dataDetail.tableTitle
}
if (!tableTitle || !this.tableId) {
return
}
let localStorageTableTitle = localStorage.getItem('nz-tableTitle-' + localStorage.getItem('nz-username') + '-' + this.tableId)
localStorageTableTitle = localStorageTableTitle ? JSON.parse(localStorageTableTitle) : tableTitle
if (tableTitle) {

1
nezha-fronted/src/components/common/mixin/exportHtml.js
View File

@@ -1,5 +1,4 @@
import bus from '@/libs/bus'
import { Loading } from 'element-ui'
export default {
data () {
return {

4
nezha-fronted/src/components/common/mixin/routerPathParams.js
View File

@@ -70,6 +70,7 @@ export default {
clientState: this.$refs[detailType].bottomBox.object.clientState || '',
protocol: this.$refs[detailType].bottomBox.object.protocol || '',
uuid: this.$refs[detailType].bottomBox.object.uuid || '',
startTime: this.$refs[detailType].bottomBox.object.startTime || '',
model: {
tsgAppliance: this.$refs[detailType].bottomBox.object.model ? this.$refs[detailType].bottomBox.object.model.tsgAppliance : ''
}
@@ -84,6 +85,7 @@ export default {
clientState: this.$refs[detailType].detailViewRightObj.clientState || '',
protocol: this.$refs[detailType].detailViewRightObj.protocol || '',
uuid: this.$refs[detailType].detailViewRightObj.uuid || '',
startTime: this.$refs[detailType].detailViewRightObj.startTime || '',
model: {
tsgAppliance: this.$refs[detailType].detailViewRightObj.model ? this.$refs[detailType].detailViewRightObj.model.tsgAppliance : ''
}
@@ -102,6 +104,7 @@ export default {
clientState: this.bottomBox.object.clientState || '',
protocol: this.bottomBox.object.protocol || '',
uuid: this.bottomBox.object.uuid || '',
startTime: this.bottomBox.object.startTime || '',
model: {
tsgAppliance: this.bottomBox.object.model ? this.bottomBox.object.model.tsgAppliance : ''
}
@@ -117,6 +120,7 @@ export default {
clientState: this.detailViewRightObj.clientState || '',
protocol: this.detailViewRightObj.protocol || '',
uuid: this.detailViewRightObj.uuid || '',
startTime: this.detailViewRightObj.startTime || '',
model: {
tsgAppliance: this.detailViewRightObj.model ? this.detailViewRightObj.model.tsgAppliance : ''
}

10
nezha-fronted/src/components/common/mixin/system/systemMixin.js
View File

@@ -119,12 +119,18 @@ export default {
terminal_timeout: 30,
terminal_telnet_user_tip: 'ogin:',
terminal_telnet_pin_tip: 'assword:',
terminal_record_local_retention: 365
terminal_record_local_retention: 365,
terminal_storage_type: '',
terminal_storage_s3_endpoint: '',
terminal_storage_s3_bucket: '',
terminal_storage_s3_access_key: '',
terminal_storage_s3_secret_access_key: ''
},
terminalCopy: null,
terminalRules: {
terminal_timeout: [{ validator: positiveInteger, trigger: 'blur' }],
terminal_record_local_retention: [{ required: true, message: this.$t('validate.required'), trigger: 'blur' }, { validator: positiveInteger, trigger: 'blur' }]
terminal_record_local_retention: [{ required: true, message: this.$t('validate.required'), trigger: 'blur' }, { validator: positiveInteger, trigger: 'blur' }],
terminal_storage_type: [{ required: true, message: this.$t('validate.required'), trigger: 'blur' }]
},
ldap: {
ldap_address: '',

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

@@ -33,7 +33,7 @@
<div class="choose-box-content" :title="item.checked.map(value=> labelValue[item.name].find(labelObj=>labelObj.value === value).label).join(' + ')">
{{item.checked.map(value=> labelValue[item.name].find(labelObj=>labelObj.value === value).label).join(' + ')}}
</div>
<i class="nz-icon nz-icon-arrow-down6"/>
<i class="nz-icon nz-icon-arrow-down6" style="cursor:pointer"/>
</div>
</div>
</el-popover>

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

@@ -133,7 +133,7 @@
:use-chart-unit="false"
class="pickTime margin-r-10">
</pick-time>
<button v-has="'project_edit'" class="top-tool-btn margin-r-10" type="button" @click="editTopology" :title="$t('overall.edit')">
<button v-has="'project_edit'" class="top-tool-btn margin-r-10" type="button" @click="editTopology(false)" :title="$t('overall.edit')">
<i class="nz-icon nz-icon-edit"></i>
</button>
<button class="top-tool-btn" type="button" @click="changeScreen" :title="topoScreen? $t('dashboard.screen.exit') : $t('dashboard.screen')">
@@ -661,6 +661,8 @@ export default {
methods: {
init () {
// canvasOptions.on = this.onMessage
clearTimeout(this.timer3)
this.timer3 = null
this.reload()
},
@@ -1982,7 +1984,7 @@ export default {
}
},
editTopology (val) {
editTopology (isPreview) {
this.editTopologyFlag = true
this.showNoData = false
this.topoScreenState = JSON.parse(JSON.stringify(this.topoScreen))
@@ -2027,6 +2029,13 @@ export default {
item.animatePlay = false
item.fontColor = item.data.fontColor || '#222222'
}
if (isPreview) {
const scale = getTopology(this.topologyIndex).store.data.scale
item.x = item.x / scale
item.y = item.y / scale
item.width = item.width / scale
item.height = item.height / scale
}
getTopology(this.topologyIndex)._setValue(item)
})
getTopology(this.topologyIndex).render(true)
@@ -2212,7 +2221,7 @@ export default {
},
previewExit () { // 继续编辑
this.isPreview = false
this.editTopology()
this.editTopology(true)
},
// 联动 project
@@ -2407,7 +2416,6 @@ export default {
window.removeEventListener('click', this.contextmenuNone)
},
destroyed () {
}
}
</script>

10
nezha-fronted/src/components/common/project/topologyMixin.js
View File

@@ -104,7 +104,15 @@ export default {
if (data.type === 0 || data.type === 1) {
data.lineWidth = data.data.lineWidth
}
getTopology(this.topologyIndex).setValue(data)
const obj = this.$loadsh.cloneDeep(data)
delete obj.x
delete obj.y
delete obj.center
delete obj.ex
delete obj.ey
delete obj.width
delete obj.height
getTopology(this.topologyIndex).setValue(obj)
},
pensActive (pens) {
this.props = {

6
nezha-fronted/src/components/common/rightBox/administration/modelBox.vue
View File

@@ -21,7 +21,7 @@
</el-form-item>
<!-- type -->
<el-form-item :label='$t("overall.type")' prop="typeId">
<el-select value-key="id" allow-create class="right-box__select" popper-class="right-box-select-top prevent-clickoutside" :filterable="true" v-model="editModel.typeId" placeholder="" size="small" id="module-box-input-project">
<el-select :disabled='editModel.id !== ""' value-key="id" allow-create class="right-box__select" popper-class="right-box-select-top prevent-clickoutside" :filterable="true" v-model="editModel.typeId" placeholder="" size="small" id="module-box-input-project">
<el-option v-for="(item, index) in typeDataList" :key="index" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
@@ -73,6 +73,7 @@
import selectWalk from '../../popBox/selectWalk'
import editRigthBox from '../../mixin/editRigthBox'
import { sysObjectIdInput } from '@/components/common/js/validate'
import bus from '@/libs/bus'
export default {
name: 'modelBox',
@@ -184,6 +185,7 @@ export default {
if (typeof this.editModel.brandId === 'string') { // 判断是否是新增的
this.$post(this.brandUrl, { name: this.editModel.brandId }).then(res => {
if (res.code === 200) { // 新增成功
bus.$emit('refreshBrand')
this.getBrandList().then(res2 => { // 新增成功后，重新调用getBrandList，刷新brandList
const newBrand = this.brandList.find(b => b.name === this.editModel.brandId) // 取出刚新增的brand对象
if (newBrand) {
@@ -225,7 +227,7 @@ export default {
},
/* 获取chart列表数据 */
ChartTemplateList () {
this.$get('visual/panel/chart', { pageSize: -1, varType: 1, panelId: 0, groupId: 0 }).then(res => {
this.$get('visual/panel/chart', { pageSize: -1, varType: 1, panelId: 0, groupId: 0, returnChildren: 0 }).then(res => {
this.chartlList = res.data.list
})
},

45
nezha-fronted/src/components/common/rightBox/asset/assetBox.vue
View File

@@ -218,7 +218,12 @@
</template>
<!-- TELNET -->
<template v-if="editAsset.type && editAsset.type.authProtocol === assetConstants.authProtocolData.telnet">
<div class="form__sub-title">TELNET</div>
<div class="form__sub-title">TELNET
<div>
<el-switch v-model="editAsset.showTelnet" :active-value="true" :inactive-value="false" size="small"></el-switch>
</div>
</div>
<div v-if="editAsset.showTelnet">
<el-form-item :label="$t('profile.username')" prop="authUsername">
<el-input maxlength="64" show-word-limit v-model="editAsset.authUsername" size="small"/>
</el-form-item>
@@ -234,11 +239,16 @@
<el-form-item :label="$t('asset.port')" prop="authProtocolPort">
<el-input v-model="editAsset.authProtocolPort" size="small"/>
</el-form-item>
</div>
</template>
<!-- SNMP -->
<template v-if="editAsset.type && editAsset.type.snmpEnable === 1">
<div class="form__sub-title">SNMP</div>
<el-form-item :label="$t('asset.snmpCredential')" prop="snmpCredentialId">
<div class="form__sub-title">SNMP
<div>
<el-switch v-model="editAsset.showSnmp" :active-value="true" :inactive-value="false" size="small"></el-switch>
</div>
</div>
<el-form-item :label="$t('asset.snmpCredential')" prop="snmpCredentialId" v-if="editAsset.showSnmp">
<el-select v-model="editAsset.snmpCredentialId" class="right-box__select" :placeholder="$t('el.select.placeholder')" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="id">
<el-option v-for="snmp in options.snmpCredentialOptions" :key="snmp.id" :label="snmp.name" :value="snmp.id"></el-option>
</el-select>
@@ -450,6 +460,16 @@ export default {
} else {
editAsset.showSSH = false
}
if (!editAsset.authType && this.editAsset.authUsername) {
editAsset.showTelnet = true
} else if (!editAsset.authType && !this.editAsset.authUsername) {
editAsset.showTelnet = false
}
if (editAsset.type.snmpEnable === 1 && editAsset.snmpCredentialId) {
editAsset.showSnmp = true
} else {
editAsset.showSnmp = false
}
this.editAsset = editAsset
this.editAsset.brandAndModel = [this.editAsset.brand.id, this.editAsset.model.id]
this.editAsset.stateId = n.state ? n.state.id : 2
@@ -677,6 +697,7 @@ export default {
this.editAsset.snmpCredentialId = ''
this.editAsset.authProtocolPort = ''
this.editAsset.pid = ''
this.$refs.form.clearValidate()
this.getModelData()
},
addLabel ([groupId, metaId]) {
@@ -733,12 +754,28 @@ export default {
if (params.purchaseDate) {
params.purchaseDate = bus.timeFormate(new Date(params.purchaseDate), 'YYYY-MM-DD')
}
if (!params.showSSH) {
// 判断是 ssh 还是 telnet
if (params.type.authProtocol === assetConstants.authProtocolData.telnet && !params.showTelnet) { // telnet
params.authType = ''
params.authUsername = ''
params.authPriKey = ''
params.authPin = ''
}
if (params.type.authProtocol === assetConstants.authProtocolData.ssh && !params.showSSH) { // ssh
params.authType = ''
params.authUsername = ''
params.authPriKey = ''
params.authPin = ''
}
if (!params.showSSH && !params.showTelnet) {
params.authType = ''
params.authUsername = ''
params.authPriKey = ''
params.authPin = ''
}
if (!params.showSnmp) {
params.snmpCredentialId = ''
}
if (params.type.vm !== 1) {
params.parent = {}
params.pid = '-1'

9
nezha-fronted/src/components/common/rightBox/chart/chartRightBox.vue
View File

@@ -164,12 +164,6 @@ export default {
fromEndpoint: {
type: Boolean,
default: false
},
variables: {
type: Array,
default: () => {
return []
}
}
},
mixins: [rz, editRigthBox],
@@ -183,6 +177,9 @@ export default {
computed: {
chartLastPosition () {
return this.$store.getters.getChartLastPosition
},
variables () {
return this.$store.state.panel.variablesArr
}
},
data () {

81
nezha-fronted/src/components/common/rightBox/chartTempBox.vue
View File

@@ -27,17 +27,35 @@
</el-form-item>
<!--chartTemp list-->
<el-form-item :label="$t('overall.chartTemplate')" prop="pid">
<el-select id="chart-box-group"
<!-- <el-select id="chart-box-group"-->
<!-- v-model="v"-->
<!-- filterable-->
<!-- class="right-box__select" clearable-->
<!-- placeholder=""-->
<!-- popper-class="prevent-clickoutside right-box-select-top"-->
<!-- size="small"-->
<!-- value-key="chartType" >-->
<!-- <el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in chartTempArr">-->
<!-- <span class="panel-dropdown-label-txt" >{{item.name}}</span>-->
<!-- </el-option>-->
<!-- </el-select>-->
<v-selectpage
:data="chartTempArr"
:tb-columns="ChartSearchShowFields"
:params="{
varType: 2, panelId: 0,
returnChildren:0,groupId:0,
}"
:multiple="false"
:language="language"
title="ChartSearch"
key-field="id"
show-field="name"
:width="626"
v-model="editChartTemp.pid"
class="right-box__select" clearable
placeholder=""
popper-class="prevent-clickoutside right-box-select-top"
size="small"
value-key="chartType" >
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in chartTempArr">
<span class="panel-dropdown-label-txt" >{{item.name}}</span>
</el-option>
</el-select>
class="form-control"
:result-format="resultFormat"
></v-selectpage>
</el-form-item>
<!-- 选择资产，穿梭框 -->
@@ -106,6 +124,30 @@ export default {
{ name: 'Endpoint', id: 2 }
],
chartTempArr: [],
ChartSearchShowFields: [ // ChartSearch 下拉搜索表头
{ title: 'ID', data: 'id' },
{
title: this.$t('overall.name'),
data: function (row) {
if (row.name.length > 15) {
return row.name.substring(0, 12) + '...'
}
return row.name
},
key: 'name'
},
{ title: this.$t('overall.type'), data: 'type', key: 'type' },
{
title: this.$t('overall.remark'),
data: function (row) {
if (row.remark && row.remark.length > 15) {
return row.remark.substring(0, 12) + '...'
}
return row.remark
},
key: 'remark'
}
],
tableData: [],
transfer: {
tableData: [],
@@ -196,7 +238,8 @@ export default {
return false
}
return true
}
},
language () { return this.$store.getters.getLanguage }
},
methods: {
pageNoChange (val) {
@@ -236,9 +279,11 @@ export default {
this.editChartTemp.varIds = this.$refs.transfer.selectedData.map(item => item.id)
}
this.$refs.userForm.validate((valid) => {
const params = this.$loadsh.cloneDeep(this.editChartTemp)
params.pid = Number(params.pid)
if (valid) {
if (this.editChartTemp.id) {
this.$put(this.url, this.editChartTemp).then(res => {
if (params.id) {
this.$put(this.url, params).then(res => {
this.prevent_opt.save = false
if (res.code === 200) {
this.$message({ duration: 2000, type: 'success', message: this.$t('tip.saveSuccess') })
@@ -249,7 +294,7 @@ export default {
}
})
} else {
this.$post(this.url, this.editChartTemp).then(res => {
this.$post(this.url, params).then(res => {
this.prevent_opt.save = false
if (res.code === 200) {
this.$message({ duration: 2000, type: 'success', message: this.$t('tip.saveSuccess') })
@@ -290,6 +335,14 @@ export default {
}
})
},
resultFormat (resp) {
if (resp && resp.data) {
const assetData = {}
assetData.list = resp.data.list
assetData.totalRow = resp.data.total
return assetData
}
},
getTableData () {
if (this.editChartTemp.varType === 1) {
this.getAssetData()

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

@@ -90,8 +90,8 @@ export default {
{ validator: noSpecialChar, trigger: 'blur' }
],
lnglat: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' },
{ validator: latlng, trigger: 'blur' }
{ required: true, message: this.$t('validate.required'), trigger: 'change' },
{ validator: latlng, trigger: 'change' }
]
},
areaData: [],

12
nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue
View File

@@ -1439,15 +1439,9 @@ export default {
},
copyValue () {
const domUrl = document.createElement('input')
domUrl.value = this.configsCopyValue
domUrl.id = 'creatDom'
document.body.appendChild(domUrl)
domUrl.select() // 选择对象
document.execCommand('Copy') // 执行浏览器复制命令
const creatDom = document.getElementById('creatDom')
creatDom.parentNode.removeChild(creatDom)
this.$message.success(this.$t('overall.copySuccess'))
this.$copyText(this.configsCopyValue).then(() => {
this.$message.success({ message: this.$t('overall.copySuccess') })
})
},
syntaxHighlight (json) {
if (typeof json != 'string') {

12
nezha-fronted/src/components/common/rightBox/moduleBox.vue
View File

@@ -1423,15 +1423,9 @@ export default {
},
copyValue () {
const domUrl = document.createElement('input')
domUrl.value = this.configsCopyValue
domUrl.id = 'creatDom'
document.body.appendChild(domUrl)
domUrl.select() // 选择对象
document.execCommand('Copy') // 执行浏览器复制命令
const creatDom = document.getElementById('creatDom')
creatDom.parentNode.removeChild(creatDom)
this.$message.success(this.$t('overall.copySuccess'))
this.$copyText(this.configsCopyValue).then(() => {
this.$message.success({ message: this.$t('overall.copySuccess') })
})
},
copyLogsValue (index) {
const domUrl = document.createElement('input')

14
nezha-fronted/src/components/common/rightBox/panelBox.vue
View File

@@ -306,9 +306,15 @@
</el-checkbox-group>
</el-form-item>
<el-form-item :label="$t('dashboard.panel.receivers')" class="item-receivers" prop="param.report.receivers">
<el-select v-model="editPanel.param.report.receivers" clearable multiple placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="chartType">
<el-option v-for="item in userData" :key="item.id" :label="item.name" :value="item.id">
<span class="panel-dropdown-label-txt" >{{item.name}}</span>
<el-select
class="right-box__select"
v-model="editPanel.param.report.receivers" clearable multiple placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="chartType">
<el-option
style="width: 620px"
v-for="item in userData" :key="item.id"
:label="item.name" :value="item.id">
<span class="user-name" :title="item.name">{{item.name}}</span>
<span class="user-username" :title="item.username">@{{item.username}}</span>
</el-option>
</el-select>
</el-form-item>
@@ -438,7 +444,7 @@ export default {
queryVariableList: [
{ name: 'label_names()', description: this.$t('dashboard.panel.label_names()') },
{ name: 'label_values(label)', description: this.$t('dashboard.panel.label_values(label)') },
{ name: 'label_values(metric, label)', description: this.$t('dashboard.label_values(metric, label)') },
{ name: 'label_values(metric, label)', description: this.$t('dashboard.panel.label_values(metric, label)') },
{ name: 'metrics(metric)', description: this.$t('dashboard.panel.metrics(metric)') },
{ name: 'query_result(query)', description: this.$t('dashboard.panel.query_result(query)') }
]

27
nezha-fronted/src/components/common/table/alert/alertRuleEvalLogTable.vue
View File

@@ -11,12 +11,12 @@
@selection-change="selectionChange"
@row-dblclick="(row)=>{queryMessage(row)}"
>
<el-table-column
<!-- <el-table-column
:resizable="false"
align="center"
type="selection"
width="55">
</el-table-column>
</el-table-column> -->
<el-table-column
v-for="(item, index) in customTableTitle"
v-if="item.show"
@@ -86,25 +86,26 @@ export default {
return {
tableTitle: [
{
label: this.$t('overall.state'),
prop: 'state',
show: true,
minWidth: 100
}, {
label: this.$t('alert.alertRuleMessage'),
prop: 'msg',
show: true,
minWidth: 100
}, {
label: this.$t('overall.startTime'),
prop: 'stts',
show: true,
minWidth: 300
minWidth: 120
}, {
label: this.$t('config.terminallog.duration'),
prop: 'duration',
show: true,
minWidth: 120
},
{
label: this.$t('overall.state'),
prop: 'state',
show: true,
minWidth: 120
}, {
label: this.$t('alert.alertRuleMessage'),
prop: 'msg',
show: true,
minWidth: 120
}
]
}

7
nezha-fronted/src/components/common/table/asset/assetNetworkTable.vue
View File

@@ -146,10 +146,3 @@ export default {
}
}
</script>
<style scoped>
.process-name{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
</style>

43
nezha-fronted/src/components/common/table/asset/assetProcessTable.vue
View File

@@ -179,46 +179,3 @@ export default {
}
}
</script>
<style scoped>
.el-popover__reference{
display: flex;
align-items: center;
}
.bar {
width: 3px;
height: 14px;
border-radius: 0;
margin-right: 0px;
line-height: 100%;
}
.process-name{
height: 100%;
margin-left: 6px;
line-height: 24px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
#container {
width: 120px;
min-width: 120px;
height: 18px;
margin-right: 20px;
}
.percentage{
flex-grow: 1;
word-wrap: break-word;
}
>>>.el-progress-bar__outer{
border-radius: 2px;
background-color: #e6eaed;
}
>>>.el-progress-bar__inner{
border-radius: 0;
}
/deep/ .active-icon {
margin-left: 5px;
}
</style>
<style>
</style>

29
nezha-fronted/src/components/common/table/asset/assetVsysTable.vue
View File

@@ -22,6 +22,7 @@
:resizable="true"
:sort-orders="['ascending', 'descending']"
:sortable="item.sortable"
:width="`${item.width}`"
:show-overflow-tooltip="item.prop === 'description'"
class="data-column"
>
@@ -59,7 +60,7 @@
</template>
<template v-else-if="item.prop === 'vsysResult'">
<div :title="scope.row[item.prop] && scope.row[item.prop].msg ? scope.row[item.prop].msg : '-'">
<copy :copyData='scope.row[item.prop] && scope.row[item.prop].msg ? scope.row[item.prop].msg : ""' :showInfo='scope.row[item.prop]'>
<copy :copyData='scope.row[item.prop] && scope.row[item.prop].msg ? scope.row[item.prop].msg : ""' :showInfo='scope.row[item.prop] && scope.row[item.prop].msg'>
<template slot="copy-text">
{{scope.row[item.prop] && scope.row[item.prop].msg ? scope.row[item.prop].msg : '-'}}
</template>
@@ -103,13 +104,15 @@ export default {
label: this.$t('asset.vsysId'),
prop: 'vsysId',
show: true,
minWidth: 120
minWidth: 120,
sortable: 'custom'
},
{
label: this.$t('overall.state'),
prop: 'state',
show: true,
minWidth: 120
minWidth: 120,
sortable: 'custom'
}, {
label: this.$t('project.module.configs'),
prop: 'vsysInfo',
@@ -124,7 +127,8 @@ export default {
label: this.$t('overall.time'),
prop: 'uts',
show: true,
minWidth: 120
minWidth: 120,
sortable: 'custom'
}
]
}
@@ -152,14 +156,19 @@ export default {
}
// this.$set(this.tableData,index,item);// 调用父组件
},
copyValue (txt) {
const str = `{
"deviceTag": "${txt.deviceTag || ''}",
"params": "${txt.params || ''}"
}`
this.$copyText(str).then(() => {
copyValue (item) {
const str = {
deviceTag: item.deviceTag || '',
params: item.params || ''
}
this.$copyText(JSON.stringify(str)).then(() => {
this.$message.success({ message: this.$t('overall.copySuccess') })
})
},
// 数据排序
tableDataSort (item) {
const orderBy = { order: item.order, prop: item.prop }
this.$emit('tableDataSort', orderBy)
}
}
}

75
nezha-fronted/src/components/common/table/settings/backupsTable.vue
View File

@@ -50,26 +50,30 @@
</button>
</div>
<div slot-scope="scope" v-else class="table-operation-items">
<button class="table-operation-button" @click="Restore(scope.row)" v-if="scope.row" :title="$t('backup.RestoreNow')">
<i class="nz-icon-shujubeifenhuifu nz-icon"></i>
</button>
<div v-if="scope.row" @click="tableOperation(scope.row)">
<div slot-scope="scope" class="table-operation-items" v-else>
<button class="table-operation-item" :title="$t('overall.download')" v-has="'backup_download'" @click="downloadBackup(scope.row)"><i class="nz-icon nz-icon-download"></i></button>
<el-dropdown size="medium" v-has="['backup_restore','backup_del']" trigger="click" @command="tableOperation">
<div class="table-operation-item table-operation-item--more" :title="$t('overall.moreOperations')">
<i class="nz-icon nz-icon-more3"></i>
</div>
<el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top">
<el-dropdown-item v-has="'backup_restore'" :command="['restore', scope.row]" disabled><i class="nz-icon-shujubeifenhuifu nz-icon"></i><span>{{$t('backup.RestoreNow')}}</span></el-dropdown-item>
<el-dropdown-item v-has="'backup_del'" :command="['delete', scope.row]">
<delete-button
ref="deleteButton"
:forceDeleteShow="false"
id="backup-delete"
:from="'backup'"
:type="'btn'"
:type="'link'"
:title="$t('overall.delete')"
:api="'/sys/backup'"
:single="true"
:delete-objs="singleDelete"
@before="delFlag=true"
></delete-button>
</div>
<!-- <button class="table-operation-edit" @click="del(scope.row)" v-if="scope.row" :title="$t('overall.delete')">
<i class="nz-icon nz-icon-delete" style="font-size='12px'"></i>
</button> -->
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
</el-table-column>
<template slot="empty">
@@ -87,7 +91,7 @@
<script>
import { post, put } from '@/http'
import lodash from 'lodash'
import axios from 'axios'
import bus from '@/libs/bus'
import deleteButton from '@/components/common/deleteButton'
@@ -157,15 +161,6 @@ export default {
}, 400)
}
},
// del (row) {
// this.$delete('/sys/backup?filename=' + row.fileName).then(res => {
// if (res.code == 200) {
// this.$emit('getTableData', 'recent')
// } else {
// this.$message.error(res.msg)
// }
// })
// },
changeDate (item) {
const time = this.utcTimeToTimezoneStr(item)
const time1 = this.timeFormate(time)
@@ -187,7 +182,9 @@ export default {
edit () {
this.$emit('edit', this.tableData[0])
},
tableOperation (row) {
tableOperation ([command, row]) {
switch (command) {
case 'delete': {
this.$set(row, 'name', row.fileName)
if (this.singleDelete.length === 0) {
this.singleDelete.push(row)
@@ -195,9 +192,43 @@ export default {
this.singleDelete = []
this.singleDelete.push(row)
}
break
}
case 'restore': {
this.Restore(row)
break
}
default:
break
}
},
downloadBackup (backup) {
this.$emit('loading', true)
axios.get('/sys/backup/download?filename=' + backup.fileName, { responseType: 'blob' }).then(data => {
let fileName = new Date().getTime() + '.txt'
const disposition = data.headers['content-disposition']
if (disposition) {
fileName = disposition.split(';')[1].split('filename=')[1]
}
// 由于ie不支持download属性，故需要做兼容判断
if (navigator.appVersion.toString().indexOf('.NET') > 0) {
// ie独有的msSaveBlob属性，data.data为Blob文件流
window.navigator.msSaveBlob(data.data, fileName)
} else {
// 以下流程即为文章开始的下载流程
const url = window.URL.createObjectURL(data.data)
const link = document.createElement('a')
link.style.display = 'none'
link.href = url
link.download = fileName
document.body.appendChild(link)
link.click()
window.URL.revokeObjectURL(link.href)
}
this.$emit('loading', false)
})
}
},
watch: {
}
}

44
nezha-fronted/src/components/common/table/settings/chartTmplTable.vue
View File

@@ -114,6 +114,7 @@ export default {
data () {
return {
chartTypeList: chartConstant.type,
qsArr: [],
tableTitle: [
{
label: 'ID',
@@ -185,17 +186,56 @@ export default {
case 'logs':
str += 'nz-icon-logs'
break
case 'log':
str += 'nz-icon-logs'
break
case 'bubble':
str += 'nz-icon-bubble'
break
case 'area':
str += 'nz-icon-stack-area'
break
case 'point':
str += 'nz-icon-bubble'
break
case 'stat':
str += 'nz-icon-single-value'
break
case 'hexagon':
str += 'nz-icon-duobianxing'
break
case 'gauge':
str += 'nz-icon-menu-dashboard'
break
case 'treemap':
str += 'nz-icon-Firewall'
break
case 'sankey':
str += 'nz-icon-sankey'
break
case 'rank':
str += 'nz-icon-rank'
break
case 'diagram':
str += 'nz-icon-diagram'
break
case 'map':
str += 'nz-icon-map'
break
case 'clock':
str += 'nz-icon-clock'
break
case 'topology':
str += 'nz-icon-projectTopology'
break
default :
str += 'nz-icon-table1'
// str += 'nz-icon-table1'
break
}
return str
},
findTypeLabel (row) {
const typeItem = this.chartTypeList.find(title => title.value === row.type)
const typeItem = this.chartTypeList.find(title => title.value == row.type)
return typeItem ? this.$t(typeItem.label) : '-'
}
}

21
nezha-fronted/src/components/common/table/settings/endpointTable.vue
View File

@@ -312,15 +312,18 @@ export default {
methods: {
copyValue (item) {
const str = item
const domUrl = document.createElement('input')
domUrl.value = JSON.stringify(str)
domUrl.id = 'creatDom'
document.body.appendChild(domUrl)
domUrl.select() // 选择对象
document.execCommand('Copy') // 执行浏览器复制命令
const creatDom = document.getElementById('creatDom')
creatDom.parentNode.removeChild(creatDom)
this.$message.success(this.$t('overall.copySuccess'))
// const domUrl = document.createElement('input')
// domUrl.value = JSON.stringify(str)
// domUrl.id = 'creatDom'
// document.body.appendChild(domUrl)
// domUrl.select() // 选择对象
// document.execCommand('Copy') // 执行浏览器复制命令
// const creatDom = document.getElementById('creatDom')
// creatDom.parentNode.removeChild(creatDom)
// this.$message.success(this.$t('overall.copySuccess'))
this.$copyText(JSON.stringify(str)).then(() => {
this.$message.success({ message: this.$t('overall.copySuccess') })
})
},
suspendedStr (status) { // 10进制转为2进制 分别给对应的状态
if (!status || status === 1 || status == 0) { return '' }

187
nezha-fronted/src/components/common/table/settings/recordRuleEvalLogTable.vue Normal file
View File

@@ -0,0 +1,187 @@
<template>
<el-table
id="recordRuleEvalLogTable"
ref="dataTable"
:data="tableData"
:height="height"
tooltip-effect="light"
border
@header-dragend="dragend"
@sort-change="tableDataSort"
@selection-change="selectionChange"
@row-dblclick="(row)=>{queryMessage(row)}"
>
<!-- <el-table-column
:resizable="false"
align="center"
type="selection"
width="55">
</el-table-column> -->
<el-table-column
v-for="(item, index) in customTableTitle"
v-if="item.show"
:key="`col-${index}`"
:fixed="item.fixed"
:label="item.label"
:min-width="`${item.minWidth}`"
:prop="item.prop"
:resizable="true"
:sort-orders="['ascending', 'descending']"
:sortable="item.sortable"
:width="`${item.width}`"
:show-overflow-tooltip="item.prop === 'description'"
class="data-column"
>
<template slot="header">
<span class="data-column__span">{{item.label}}</span>
<div class="col-resize-area"></div>
</template>
<template slot-scope="scope" :column="item">
<template v-if="item.prop === 'state'">
<div>
<div :class="{'active-icon green-bg':scope.row.state == 200,'active-icon red-bg':scope.row.state != 200}" style="position: relative">
</div>
<span>{{scope.row.state == 200?'Ok':'Error'}}</span>
</div>
</template>
<template v-else-if="item.prop === 'duration'">
<el-tooltip :disabled="!scope.row.etts" effect="light" placement="right">
<div slot="content">
{{$t('overall.endTime')}}<br/>
{{utcTimeToTimezoneStr(scope.row.etts)}}
</div>
<span>{{getDuration(scope.row)}}</span>
</el-tooltip>
</template>
<template v-else-if="item.prop === 'stts'">
{{utcTimeToTimezoneStr(scope.row[item.prop])}}
</template>
<span v-else-if="scope.row[item.prop]">{{scope.row[item.prop]}}</span>
<template v-else>-</template>
</template>
</el-table-column>
<template slot="empty">
<div v-if="!loading" class="table-no-data">
<svg class="icon" aria-hidden="true">
<use xlink:href="#nz-icon-no-data-list"></use>
</svg>
<div class="table-no-data__title">No results found</div>
</div>
<div v-else>&nbsp;</div>
</template>
</el-table>
</template>
<script>
import table from '@/components/common/mixin/table'
import { calcDurationByStringTimeMs } from '@/components/common/js/tools'
export default {
name: 'recordRuleEvalLogTable',
mixins: [table],
props: {
loading: Boolean,
nowTime: {}
},
data () {
return {
tableTitle: [
{
label: this.$t('overall.startTime'),
prop: 'stts',
show: true,
minWidth: 120
}, {
label: this.$t('config.terminallog.duration'),
prop: 'duration',
show: true,
minWidth: 120
}, {
label: this.$t('overall.state'),
prop: 'state',
show: true,
minWidth: 120
}, {
label: this.$t('alert.alertRuleMessage'),
prop: 'msg',
show: true,
minWidth: 120
}
]
}
},
computed: {
},
methods: {
getDuration (record) {
if (record.etts) {
return calcDurationByStringTimeMs(record.stts, record.etts)
}
return calcDurationByStringTimeMs(record.stts, this.utcTimeToTimezoneStr(this.nowTime))
}
}
}
</script>
<style scoped>
.colorEF7458{
color: #EF7458;
}
.color23BF9A{
color: #23BF9A;
}
/deep/ .active-icon {
margin-left: 5px;
}
</style>
<style>
.severity .P1{
background: #F5846A;
border-radius: 2px;
font-size: 12px;
color: #FFFFFF;
padding: 2px 6px;
}
.severity .P2{
background: #F7A54A;
border-radius: 2px;
font-size: 12px;
color: #FFFFFF;
padding: 2px 6px;
}
.severity .P3{
background: #F1C13D;
border-radius: 2px;
font-size: 12px;
color: #FFFFFF;
padding: 2px 6px;
}
.schedEnableTitle{
padding: 20px 15px;
margin-right: 0;
left: 1995px !important;
background: #FFFFFF;
border: 1px solid rgba(119,131,145,0.60);
box-shadow: 0 6px 16px 0 rgba(0,0,0,0.08);
border-radius: 3px;
}
.schedEnableTitle .nz-icon-a-rilizhou, .schedEnableTitle .nz-icon-dingshishijian{
font-size: 14px;
color: #666666;
margin-right: 12px;
}
.schedEnableTitle .week-item{
width: 32px;
height: 22px;
line-height: 22px;
opacity: 0.9;
background: #F6F6FA;
border-radius: 2px;
display: inline-block;
font-size: 12px;
color: #666666;
letter-spacing: 0;
font-weight: 400;
padding-left: 3px;
margin-right: 12px;
margin-bottom: 6px;
}
</style>

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

@@ -26,7 +26,7 @@
</el-tooltip>
<!-- <div class="time-no-data">{{ showTime.text }}</div> -->
</div>
<div class="calendar-popover-text">
<div class="calendar-popover-text" style="cursor:pointer">
<i class="el-icon-arrow-down"></i>
</div>
</div>

10
nezha-fronted/src/components/page/config/backups.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="system backup">
<div class="system backup" v-my-loading.dark="loading">
<div class="system-config-form system-config-backup">
<div class="system-title">{{ $t("backup.configurations") }}</div>
<nz-data-list
@@ -39,6 +39,7 @@
key="backups2"
:table-data2="tableData2"
@getTableData="getTableData"
@loading="load"
>
</backups-table>
</template>
@@ -95,7 +96,8 @@ export default {
// }
],
rightBoxshow: false,
isRefresh: ''
isRefresh: '',
loading: false
}
},
provide () {
@@ -184,6 +186,9 @@ export default {
}
this.rightBoxshow = true
},
load (flag) {
this.loading = flag
},
closeRightBox (refresh) {
if (refresh) {
this.getTableData('backup')
@@ -192,7 +197,6 @@ export default {
}
},
watch: {},
beforeDestroy () {
bus.$off('backupNow', this.getTableData)
}

1
nezha-fronted/src/components/page/config/ipam.vue
View File

@@ -97,6 +97,7 @@ export default {
data () {
return {
url: 'ipam/subnet',
detailType: 'list',
blankObject: { // 空白对象
id: '',
name: '',

9
nezha-fronted/src/components/page/config/mibBrowser.vue
View File

@@ -581,12 +581,3 @@ export default {
}
}
</script>
<style scoped>
.document-copy-text{
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
</style>

11
nezha-fronted/src/components/page/config/model.vue
View File

@@ -79,6 +79,7 @@
</div>
</template>
<script>
import bus from '@/libs/bus'
import deleteButton from '@/components/common/deleteButton'
import modelBox from '@/components/common/rightBox/administration/modelBox'
import nzDataList from '@/components/common/table/nzDataList'
@@ -129,6 +130,11 @@ export default {
}
}
},
mounted () {
bus.$on('refreshBrand', () => {
this.$refs.dataList.$refs.searchInput.getBrandData()
})
},
methods: {
chartBySync (row) {
this.$store.dispatch('dispatchHomeLoading', true)
@@ -143,6 +149,11 @@ export default {
})
}
},
beforeDestroy () {
bus.$off('refreshBrand', () => {
this.$refs.dataList.$refs.searchInput.getBrandData()
})
},
created () {
},

8
nezha-fronted/src/components/page/config/monitor.vue
View File

@@ -31,6 +31,7 @@
<vue-tags-input
v-model="tag"
:maxlength="32"
:class="monitor.interface_name.length !== 0 ? 'interface-name' : ''"
:placeholder="$t('overall.add.interface_name')"
:tags="monitor.interface_name"
@tags-changed="newTags=> monitor.interface_name = newTags"
@@ -63,7 +64,7 @@
<el-input v-model="monitor.metrics_storage_s3_access_key" id="monitor-metrics_storage_s3_access_key">
</el-input>
</el-form-item>
<el-form-item :label="$t('config.terminallog.key')" prop="metrics_storage_s3_secret_access_key" :rules=" [ { required: monitor.metrics_storage_type == 2, message: this.$t('validate.required'), trigger: 'blur' }]" class="monitorLastEle">
<el-form-item :label="$t('config.terminallog.key')" prop="metrics_storage_s3_secret_access_key" :rules=" [ { required: monitor.metrics_storage_type == 2, message: this.$t('validate.required'), trigger: 'blur' }]" class="monitorLastElement">
<el-input v-model="monitor.metrics_storage_s3_secret_access_key" id="monitor-metrics_storage_s3_secret_access_key" type="password">
</el-input>
</el-form-item>
@@ -99,7 +100,7 @@
<el-input v-model="monitor.logs_storage_s3_access_key" id="monitor-logs_storage_s3_access_key">
</el-input>
</el-form-item>
<el-form-item :label="$t('config.terminallog.key')" prop="logs_storage_s3_secret_access_key" :rules=" [ { required: monitor.logs_storage_type == 2, message: this.$t('validate.required'), trigger: 'blur' }]" class="monitorLastEle">
<el-form-item :label="$t('config.terminallog.key')" prop="logs_storage_s3_secret_access_key" :rules=" [ { required: monitor.logs_storage_type == 2, message: this.$t('validate.required'), trigger: 'blur' }]" class="monitorLastElement">
<el-input v-model="monitor.logs_storage_s3_secret_access_key" id="monitor-logs_storage_s3_secret_access_key" type="password">
</el-input>
</el-form-item>
@@ -185,7 +186,4 @@ export default {
}
</script>
<style scoped>
.vue-tags-input{
max-width: unset;
}
</style>

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

@@ -384,15 +384,9 @@ export default {
element.click()
},
copyValue () {
const domUrl = document.createElement('input')
domUrl.value = this.fileContent
domUrl.id = 'creatDom'
document.body.appendChild(domUrl)
domUrl.select() // 选择对象
document.execCommand('Copy') // 执行浏览器复制命令
const creatDom = document.getElementById('creatDom')
creatDom.parentNode.removeChild(creatDom)
this.$message.success(this.$t('overall.copySuccess'))
this.$copyText(this.fileContent).then(() => {
this.$message.success({ message: this.$t('overall.copySuccess') })
})
},
fileClosed () {
this.personalCenter()

1
nezha-fronted/src/components/page/config/recordRule.vue
View File

@@ -118,6 +118,7 @@ export default {
return {
url: 'record/rule',
tableId: 'recordRuleTable',
detailType: 'list',
searchMsg: { // 给搜索框子组件传递的信息
searchLabelList: [
{

16
nezha-fronted/src/components/page/config/template/chartTemp.vue
View File

@@ -263,6 +263,22 @@ export default {
})
}
},
copy (u, copyParams) {
const copyName = this.$loadsh.get(copyParams, 'copyName', '-copy')
this.object = { ...u, name: u.name + copyName, id: '' }
if (this.object.name.length > 64) {
const length = this.object.name.length - 64
this.object.name = u.name.substring(0, u.name.length - length) + '-copy'
}
if (this.object.type !== 'group') {
this.object.elements = this.object.elements.map(item => {
item.id = ''
return item
})
}
this.rightBox.show = true
},
chartBySync (row) {
this.$store.dispatch('dispatchHomeLoading', true)
this.$post('visual/panel/chart/syncTmpl', { pid: row.id }).then(res => {

36
nezha-fronted/src/components/page/config/terminal.vue
View File

@@ -19,6 +19,32 @@
<template slot="append"><span >{{$t('config.system.basic.day')}}</span></template>
</el-input>
</el-form-item>
<el-form-item :label="$t('config.system.monitor.metrics_storage_type')" prop="terminal_storage_type">
<el-select v-model="terminal.terminal_storage_type" popper-class="right-box-select-top right-public-box-dropdown-top">
<el-option :label="$t('config.system.monitor.local')" value="1"></el-option>
<el-option :label="$t('config.system.monitor.s3')" value="2"></el-option>
</el-select>
</el-form-item>
<transition name="el-zoom-in-top">
<div v-show="terminal.terminal_storage_type == 2">
<el-form-item :label="$t('asset.endpoint')" prop="terminal_storage_s3_endpoint" :rules=" [ { required: terminal.terminal_storage_type == 2, message: this.$t('validate.required'), trigger: 'blur' }]">
<el-input v-model="terminal.terminal_storage_s3_endpoint" id="terminal-terminal_storage_s3_endpoint">
</el-input>
</el-form-item>
<el-form-item :label="$t('config.system.monitor.metrics_storage_s3_bucket')" prop="terminal_storage_s3_bucket" :rules=" [ { required: terminal.terminal_storage_type == 2, message: this.$t('validate.required'), trigger: 'blur' }]">
<el-input v-model="terminal.terminal_storage_s3_bucket" id="terminal-terminal_storage_s3_bucket">
</el-input>
</el-form-item>
<el-form-item :label="$t('config.system.monitor.metrics_storage_s3_access_key')" prop="terminal_storage_s3_access_key" :rules=" [ { required: terminal.terminal_storage_type == 2, message: this.$t('validate.required'), trigger: 'blur' }]">
<el-input v-model="terminal.terminal_storage_s3_access_key" id="terminal-terminal_storage_s3_access_key">
</el-input>
</el-form-item>
<el-form-item :label="$t('config.terminallog.key')" prop="terminal_storage_s3_secret_access_key" :rules=" [ { required: terminal.terminal_storage_type == 2, message: this.$t('validate.required'), trigger: 'blur' }]" class="monitorLastElement">
<el-input v-model="terminal.terminal_storage_s3_secret_access_key" id="terminal-terminal_storage_s3_secret_access_key" type="password">
</el-input>
</el-form-item>
</div>
</transition>
<el-form-item>
<button v-has="'system_terminal_edit'" :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.save')}}</button>
</el-form-item>
@@ -42,12 +68,18 @@ export default {
terminal_timeout: 30,
terminal_telnet_user_tip: 'ogin:',
terminal_telnet_pin_tip: 'assword:',
terminal_record_local_retention: 365
terminal_record_local_retention: 365,
terminal_storage_type: '',
terminal_storage_s3_endpoint: '',
terminal_storage_s3_bucket: '',
terminal_storage_s3_access_key: '',
terminal_storage_s3_secret_access_key: ''
},
terminalCopy: null,
terminalRules: {
terminal_timeout: [{ validator: positiveInteger, trigger: 'blur' }],
terminal_record_local_retention: [{ required: true, message: this.$t('validate.required'), trigger: 'blur' }, { validator: positiveInteger, trigger: 'blur' }]
terminal_record_local_retention: [{ required: true, message: this.$t('validate.required'), trigger: 'blur' }, { validator: positiveInteger, trigger: 'blur' }],
terminal_storage_type: [{ required: true, message: this.$t('validate.required'), trigger: 'blur' }]
}
}
},

2
nezha-fronted/src/components/page/dashboard/explore/exploreItem.vue
View File

@@ -4253,6 +4253,7 @@ export default {
}
if (!this.showMetrics) {
params.limit = this.$refs.logDetail ? this.$refs.logDetail.getLimit() : 100
params.direction = this.$refs.logDetail ? this.$refs.logDetail.getDescending() : 'backward'
}
this.$store.dispatch('dispatchHomeLoading', true)
this.$get('/visual/explore/snapshot', params, 'blob').then(res => {
@@ -4287,7 +4288,6 @@ export default {
document.body.removeChild(link) // 下载完成移除元素
window.URL.revokeObjectURL(href) // 释放blob对象
}
this.$refs.topTool.closeDialog()
}, () => {
this.$message.error('123')
})

21
nezha-fronted/src/components/page/dashboard/explore/exploreItemHtml.vue
View File

@@ -28,12 +28,13 @@
<el-collapse-item class="el-collapse-item__height" name="2" title="Table">
<div slot="title" class="explore-table-title">
{{$t('dashboard.panel.chartForm.typeVal.table.label')}}
<!-- <i-->
<!-- class="nz-icon-gear nz-icon"-->
<!-- style="position: absolute;right: 10px;top: 8px"-->
<!-- @click.stop="tools.showCustomTableTitle = true"-->
<!-- :title="$t('overall.selectColumns')"-->
<!-- ></i>-->
<i
class="nz-icon-gear nz-icon"
style="position: absolute;right: 10px;top: 8px"
@click.stop="tools.showCustomTableTitle = true"
:title="$t('overall.selectColumns')"
>
</i>
<!-- 自定义table列 -->
<transition name="el-zoom-in-top">
<element-set
@@ -51,7 +52,8 @@
</div>
<!-- 自定义table列 -->
<div class="nz-table-list explore-table">
<el-table ref="exploreTable"
<el-table
ref="exploreTable"
v-my-loading="tools.loading"
class="metric-table"
:data="tableData"
@@ -85,8 +87,7 @@
</template>
</el-table>
</div>
<pagination ref="Pagination" :page-obj="pageObj" @pageNo='pageNo'
@pageSize='pageSize'></pagination>
<pagination ref="Pagination" :page-obj="pageObj" @pageNo='pageNo' @pageSize='pageSize'></pagination>
</el-collapse-item>
</template>
<!--log-->
@@ -97,7 +98,7 @@
</div>
</el-collapse-item>
<el-collapse-item v-if="showTab.indexOf('2') > -1" name="2" title="Logs">
<log-tab ref="logDetail" :timeRange="filterTime" :log-data="logData" :explore-log-table="logTabNoData" :explore-item="true" :tab-index="tabIndex" @limitChange="queryLogData" v-my-loading="chartLoading"></log-tab>
<log-tab ref="logDetail" :timeRange="filterTime" :log-data="logData" :explore-log-table="logTabNoData" :explore-item="true" :tab-index="0" v-my-loading="chartLoading"></log-tab>
</el-collapse-item>
</template>
</el-collapse>

44
nezha-fronted/src/components/page/dashboard/explore/logTab.vue
View File

@@ -14,6 +14,7 @@
<span class="operation-label">{{$t('dashboard.explore.descending')}}</span>
<el-switch
v-model="operations.descending"
:disabled="Boolean(dataJson)"
>
</el-switch>
</div>
@@ -26,7 +27,7 @@
</div>
<div class="log-operation">
<span class="operation-label">{{$t('overall.limit')}}:</span>
<el-select v-model="limit" size="small" style="width: 100px;" popper-class="right-box-select-top right-public-box-dropdown-top">
<el-select v-model="limit" :disabled="Boolean(dataJson)" size="small" style="width: 100px;" popper-class="right-box-select-top right-public-box-dropdown-top">
<el-option v-for="option in limitOptions" :key="option" :value="option"></el-option>
</el-select>
</div>
@@ -34,7 +35,7 @@
<span class="operation-label">Result:</span>
<span class="operation-length">{{tableData.length}}</span>
</div>
<div class="log-operation log-operation--right" v-if=" dataJson && dataJson.type">
<div class="log-operation log-operation--right" v-if="!dataJson">
<button class="top-tool-btn" style="cursor: pointer;z-index: 2;" type="button" @click="exportLog" :title="$t('overall.download')"><i class="nz-icon nz-icon-download"></i></button>
</div>
</div>
@@ -181,7 +182,14 @@ export default {
timeFormatData: [],
tableChartData: [],
myChart: null,
noData: false
noData: false,
filterData: []
}
},
created () {
if (this.dataJson) {
this.limit = this.dataJson.limit || 100
this.operations.descending = this.dataJson.direction === 'backward'
}
},
methods: {
@@ -190,6 +198,9 @@ export default {
levels: [0, 1, 2, 3, 4, 5, 6],
descending: true
}
if (this.dataJson) {
this.operations.descending = this.dataJson.direction === 'backward'
}
},
exportLog () {
this.$emit('exportLog', { limit: this.limit, ...this.operations })
@@ -228,6 +239,20 @@ export default {
},
loadChart () {
const vm = this
const selectObj = {}
const sele = []
this.filterData.forEach(item => {
if (sele.indexOf(item.level) == -1) {
sele.push(item.level)
}
})
this.tableChartData.forEach(item => {
if (sele.indexOf(item.name) !== -1) {
selectObj[item.name] = true
} else {
selectObj[item.name] = false
}
})
const dom = document.getElementById(`logChart${this.tabIndex}`)
if (!dom) {
return
@@ -255,9 +280,10 @@ export default {
},
grid: {
top: 20,
left: 30,
left: 20,
right: 10,
bottom: 80
bottom: 80,
containLabel: true
},
legend: {
bottom: 20,
@@ -270,6 +296,7 @@ export default {
padding: [0, 0, 0, 6],
color: this.theme == 'light' ? '#666666' : '#BEBEBE'
},
selected: selectObj,
inactiveColor: this.theme == 'light' ? '#BEBEBE' : '#666666' // 字体颜色
},
series,
@@ -395,6 +422,7 @@ export default {
})
return hit
})
this.filterData = filterLevelData
// 复制一份升序的数据用于后面处理
const copyData = [...data]
// 升降序
@@ -468,6 +496,9 @@ export default {
getLimit () {
return this.limit
},
getDescending () {
return this.operations.descending ? 'backward' : 'forward'
},
resizeChart () {
setTimeout(() => {
this.myChart.resize()
@@ -571,9 +602,6 @@ export default {
this.tableData = tableData
this.tableChartData = tableChartData
}
},
limit (n) {
this.$emit('limitChange', n)
}
},
destroyed () {

1049
nezha-fronted/src/components/page/dashboard/overview/overview.vue
View File

File diff suppressed because it is too large Load Diff

1568
nezha-fronted/src/components/page/dashboard/overview/overview2.vue
View File

File diff suppressed because it is too large Load Diff

1
nezha-fronted/src/components/page/dashboard/panel.vue
View File

@@ -127,7 +127,6 @@
:from="fromRoute.panel"
:panel-data="panelData"
:show-panel="showPanel"
:variables="variables"
@close="closeChartBox"
@reload="panelReload"
@reloadOnlyPanel="panelReloadOnlyPanel"

1
nezha-fronted/src/components/page/tool/ping.vue
View File

@@ -165,6 +165,7 @@ export default {
},
data () {
return {
tableId: 'ping',
// 防止用户重复点击
flag: true,
loading: false,

1
nezha-fronted/src/components/page/tool/trace.vue
View File

@@ -158,6 +158,7 @@ export default {
},
data () {
return {
tableId: 'trace',
// 防止用户重复点击
flag: true,
loading: false,

24
nezha-fronted/src/entrance/exportHtml/exportHtml.html
View File

File diff suppressed because one or more lines are too long

6
nezha-fronted/src/entrance/exportHtml/exportHtml.js
View File

@@ -2,7 +2,7 @@
// import 'element-ui/lib/theme-chalk/index.css'
// import 'xterm/dist/xterm.css'
import '@/assets/css/main.scss'
// import '@/assets/css/font/iconfont.js'
import '@/assets/css/font/iconfont.js'
import ElementUI from 'element-ui'
import i18n from '@/components/common/i18n'
@@ -21,12 +21,14 @@ import { clickoutside, bottomBoxWindow, stringTimeParseToUnix, unixTimeParseToSt
import * as tools from '@/components/common/js/tools.js'
import * as constants from '@/components/common/js/constants.js'
import elementSet from '@/components/common/elementSet' // 自定义表头组件
import chartList from '@/components/chart/chartList.vue' // 全局引入 chartList 组件 防止 chart-group爆粗
import pickTime from '@/components/common/pickTime'
import nzDataList from '@/components/common/table/nzDataList'
import mainMixin from '@/components/common/mixin/mainMixinFun'
import Pagination from '@/components/common/pagination'
Vue.component('element-set', elementSet) // 公用设置表头
Vue.component('pick-time', pickTime)
Vue.component('nzDataList', nzDataList)
Vue.component('chartList', chartList)

2
nezha-fronted/src/entrance/exportHtml/i18nData.js
View File

File diff suppressed because one or more lines are too long

8
nezha-fronted/src/router/index.js
View File

@@ -31,10 +31,10 @@ export default new Router({
path: '/explore',
component: resolve => require(['@/components/page/dashboard/explore/explore'], resolve)
},
{
path: '/overview',
component: resolve => require(['@/components/page/dashboard/overview/overview'], resolve)
},
// {
// path: '/overview',
// component: resolve => require(['@/components/page/dashboard/overview/overview'], resolve)
// },
{
path: '/project',
component: resolve => require(['@/components/page/monitor/project/index'], resolve)