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

fix：promql 表达式输入框 宽度调整

Browse Source
This commit is contained in:
zhangyu
2022-06-02 10:26:32 +08:00
parent a566919a24
commit c4ed46e956
9 changed files with 72 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
nezha-fronted/src/assets/css/components/common/rightBox/alertRuleBox.scss
View File

@@ -60,7 +60,7 @@
width: 100%;
}
.query-row .metric-selector-input-box {
width: calc(100% - 120px);
width: calc(100% - 120px) !important;
}
.el-input-number--small {

7
nezha-fronted/src/assets/css/components/page/dashboard/chartBox.scss
View File

@@ -137,9 +137,14 @@
z-index: 10;
}
/* metric input */
.right-box {
.el-form{
.metric-selector-input-box {
width: calc(100% - 160px) !important;
width: calc(100% - 120px);
.input-box {
margin: 0 !important;
}
}
}
}

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

@@ -33,7 +33,6 @@ export default {
assetAdd.addEventListener('click', this.saveNext)
},
saveNext () {
console.log(this.assetId)
this.$router.push({
path: this.messageParams.route,
query: this.messageParams.params

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

@@ -75,9 +75,23 @@ export default {
showText: {
type: Boolean,
default: true
},
isTopo: {
type: Boolean,
default: false
}
},
watch: {
valueArr: {
handler (n) {
if (this.isTopo) {
this.keyName = this.valueArr[0].name
this.colors = this.valueArr[0].value || randomcolor() + 'FF'
}
},
deep: true
}
},
watch: {},
data () {
return {
colors: '#ffffff',

29
nezha-fronted/src/components/common/project/L5/CanvasProps.vue
View File

@@ -106,7 +106,7 @@
<el-col :span="4" class="thresholds-cell">
<span v-if="item.level!==0">
<div style="display: inline-block">
<nezhaColor
<nezhaColor :isTopo="true"
:color-val="item.color"
:presetColors="predefineColors" :single="false"
:value-arr="[{name:'fill',value:item.color.fill,key:'bac'},{name:'line',value:item.color.line,key:'line'},{name:'text',value:item.color.text,key:'text'}]" @colorChange="(val,key)=>{colorChangeTable(item,val,key)}"/>
@@ -224,6 +224,7 @@
:from-father-data="true"
:metricOptionsParent="metricOptions"
:id="index"
:pqid="'vm'"
:key="index"
:ref="'promql-'+index"
:expression-list="selection.pen.data.expressAllArr"
@@ -401,7 +402,7 @@
<div class="props-pen-item" v-if="selection.pen&&!selection.pen.type&&!selection.pen.iconFamily">
<div>{{ $t('project.topology.bac') }}</div>
<div class="p10 pl0">
<nezhaColor :value-arr="[{name:'fillStyle',value:selection.pen.fillStyle}]"
<nezhaColor :isTopo="true" :value-arr="[{name:'fillStyle',value:selection.pen.fillStyle}]"
@colorChange="colorChange"/>
</div>
</div>
@@ -409,7 +410,7 @@
<div class="props-pen-item" v-if="selection.pen&&!selection.pen.type&&selection.pen.iconFamily">
<div>{{ $t('project.topology.iconColor') }}</div>
<div class="p10 pl0">
<nezhaColor :value-arr="[{name:'iconColor',value:selection.pen.iconColor}]"
<nezhaColor :isTopo="true" :value-arr="[{name:'iconColor',value:selection.pen.iconColor}]"
@colorChange="colorChange"/>
</div>
</div>
@@ -430,7 +431,7 @@
<!--el-input__inner-->
</el-select>
<div class="gradient-to-color">
<nezhaColor :value-arr="[{name:'gradientColor',value:selection.pen.data.gradientColor}]"
<nezhaColor :isTopo="true" :value-arr="[{name:'gradientColor',value:selection.pen.data.gradientColor}]"
@colorChange="colorChange"/>
</div>
</div>
@@ -636,14 +637,14 @@
<div class="props-pen-item">
<div>{{ $t('project.topology.lineColor') }}</div>
<div class="p10 pl0">
<nezhaColor :value-arr="[{name:'strokeStyle',value:selection.pen.strokeStyle}]"
<nezhaColor :isTopo="true" :value-arr="[{name:'strokeStyle',value:selection.pen.strokeStyle}]"
@colorChange="colorChange"/>
</div>
</div>
<div class="props-pen-item" v-if="selection.pen&&selection.pen.type">
<div>{{ $t('project.topology.arrowColor') }}</div>
<div class="p10 pl0">
<nezhaColor :value-arr="[{name:'toArrowColor',value:selection.pen.toArrowColor}]"
<nezhaColor :isTopo="true" :value-arr="[{name:'toArrowColor',value:selection.pen.toArrowColor}]"
@colorChange="colorChange"/>
</div>
</div>
@@ -678,7 +679,7 @@
<div class="props-pen-item">
<div>{{ $t('project.topology.fontColor') }}</div>
<div class="p10 pl0">
<nezhaColor :value-arr="[{name:'fontColor',value:selection.pen.fontColor}]"
<nezhaColor :isTopo="true" :value-arr="[{name:'fontColor',value:selection.pen.fontColor}]"
@colorChange="colorChange"/>
</div>
</div>
@@ -862,7 +863,7 @@
<!-- <div class="project-content-item half">-->
<!-- <label>{{$t('project.topology.fontColor')}}</label>-->
<!-- <div class="full pr10 h32">-->
<!-- <nezhaColor :value-arr="[{name:'fontColor',value:topologyData.data.fontColor}]" @colorChange="(val,key)=>{-->
<!-- <nezhaColor :isTopo=true :value-arr="[{name:'fontColor',value:topologyData.data.fontColor}]" @colorChange="(val,key)=>{-->
<!-- changeTopologyOpt(val,key,true)-->
<!-- }"/>-->
<!-- </div>-->
@@ -909,7 +910,7 @@
<div class="project-content-item half">
<label>{{ $t('project.topology.bac') }}</label>
<div class="full pr10 h32">
<nezhaColor :value-arr="[{name:'bkColor',value:topologyData.data.bkColor}]" @colorChange="(val,key)=>{
<nezhaColor :isTopo="true" :value-arr="[{name:'bkColor',value:topologyData.data.bkColor}]" @colorChange="(val,key)=>{
changeTopologyOpt(val,key,true)
}"/>
</div>
@@ -1423,7 +1424,7 @@ export default {
// immediate:false,
// },
selection: {
handler () {
handler (n) {
// this.loading = false
if (this.selection.pen && this.selection.pen.data && (!this.selection.pen.data.expressAllArr || this.selection.pen.data.expressAllArr.length === 0)) {
this.selection.pen.data.expressAllArr = ['']
@@ -1433,6 +1434,14 @@ export default {
deep: true,
immediate: true
},
'selection.pen.data': {
handler (n) {
// this.loading = false
if (this.selection.pen && JSON.stringify(this.selection.pen.type)) {
this.$emit('change', this.selection.pen)
}
}
},
fromDiagram: {
handler () {
if (this.selection.pen && this.selection.pen.data) {

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

@@ -1201,6 +1201,9 @@ export default {
}
if (!Array.isArray(data) && data) { // 判断不是数组 提前个data配置好节点属性
if (data.type === 0 && !data.data.moduleId) {
if (!data.fillStyle) {
data.fillStyle = '#FFFFFF00'
}
data.data = {
...data.data,
moduleId: '',
@@ -1208,8 +1211,8 @@ export default {
show: false,
error: false,
animatePlay: false,
fillStyle: data.fillStyle,
strokeStyle: data.strokeStyle,
fillStyle: data.fillStyle || '#ffffff',
strokeStyle: data.strokeStyle || '#ffffff',
gradientColor: '#bae7ff',
gradientType: 0,
lineWidth: this.nodeDefaultWidth(data.name),

1
nezha-fronted/src/components/common/searchInput.vue
View File

@@ -930,7 +930,6 @@ export default {
} else if (val.type === 'project') {
objectInfo.projectIds = val.valnum
} else if (val.label === 'assetState') {
console.log(val)
objectInfo.state = val.valnum
} else if (val.label === 'assetType') {
objectInfo.typeIds = val.valnum

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

@@ -235,7 +235,7 @@
v-if="plugins.indexOf('metric-input') > -1"
>
<div
:id="'editor'+index"
:id="pqid + 'editor'+index"
v-if="type !== 'log'"
class="not-fixed-height no-resize no-close"
>
@@ -435,6 +435,9 @@ export default {
},
props: {
index: { type: Number },
pqid: {
type: String, default: ''
},
expressionList: {},
plugins: { type: Array },
styleType: Number,
@@ -654,7 +657,7 @@ export default {
const view = new EditorView({
state: EditorViewstate,
// parent: document.getElementById('editor')
parent: document.getElementById('editor' + self.index)
parent: document.getElementById(this.pqid + 'editor' + self.index)
})
self.newView = view
} else {
@@ -663,7 +666,6 @@ export default {
// const to = self.codeMirrorValue.length
const to = self.oldcCodeLength
const from = self.oldcCodeLength
// console.log(from, to)
self.newView.dispatch(
self.newView.state.update({
effects: dynamicConfigCompartment.reconfigure(dynamicConfig),
@@ -1096,6 +1098,14 @@ export default {
handler (n, o) {
// console.log(n, n[this.index])
this.codeMirrorValue[this.index] = n[this.index]
setTimeout(() => {
const text = this.newView.state.doc.toString()
this.newView.dispatch(
this.newView.state.update({
changes: { from: 0, to: text.length, insert: this.codeMirrorValue[this.index] }
})
)
}, 200)
}
},

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

@@ -106,10 +106,13 @@
<template v-slot:before>
<div>
<el-dropdown-item>
<delete-button :type="'link'" :title="$t('overall.batchDel')" id="account-list-batch-delete" v-has="'monitor_endpoint_delete'" :api="url" :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true"></delete-button>
<div id="batch-add" v-has="'monitor_endpoint_add'" @click="batchAdd"><i class="nz-icon nz-icon-batchadd"></i>{{$t('overall.batchAdd')}}</div>
</el-dropdown-item>
<el-dropdown-item>
<div id="batch-add" v-has="'monitor_endpoint_add'" @click="batchAdd"><i class="nz-icon nz-icon-batchadd"></i>{{$t('overall.batchAdd')}}</div>
<div id="asset-batch-asset" v-has="'asset_edit'" @click="batchEdit"><i class="nz-icon nz-icon-batch-edit"></i>{{$t('overall.batchEdit')}}</div>
</el-dropdown-item>
<el-dropdown-item>
<delete-button :type="'link'" :title="$t('overall.batchDel')" id="account-list-batch-delete" v-has="'monitor_endpoint_delete'" :api="url" :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true"></delete-button>
</el-dropdown-item>
</div>
</template>
@@ -365,7 +368,8 @@ export default {
editShow: false,
show: false,
batchModify: false,
batchAdd: false
batchAdd: false,
batchShow: false
},
titleSearch: {},
titleSearchList: {
@@ -795,6 +799,9 @@ export default {
batchAdd () {
this.rightBox.batchAdd = true
},
batchEdit () {
this.rightBox.batchShow = true
},
rollbackImport () {
this.$delete('monitor/endpoint/cancelImport' + '?seq=' + this.importResult.seq).then(response => {
if (response.code == 200) {