fix:修改右滑弹窗显示问题 以及termail创建不成功的问题

This commit is contained in:
zhangyu
2021-05-11 19:17:46 +08:00
parent ce123e31f9
commit e44a7bcc5d
8 changed files with 178 additions and 61 deletions

View File

@@ -678,7 +678,7 @@ export default {
}
if (!param.query) delete param.query
// 根据panelId获得panel下的所有图表
this.$get('visual/panel/chart?panelId=' + params.panelId + '&groupId=0').then(response => {
this.$get('visual/panel/chart?panelId=' + params.panelId + '&groupId=0' + '&pageSize=-1').then(response => {
if (response.code === 200) {
response.data.list.forEach((item, index) => {
item.isLoaded = false

View File

@@ -16,32 +16,32 @@
<div class="sub-list" style='position: relative;'>
<!--el-drawer 打开后会对第一个未隐藏的元素聚焦 所以添加一隐藏的input 防止聚焦-->
<input style='width: 0;height: 0;opacity: 0;display: inherit;' />
<el-menu @select="handleSelect" mode="horizontal" style='position: absolute;left:0px;top:0px;border-top: 1px solid #DCDFE6;' class="horizontal">
<!-- <el-menu @select="handleSelect" mode="horizontal" style='position: absolute;left:0px;top:0px;border-top: 1px solid #DCDFE6;' class="horizontal">
<el-submenu index="1" popper-class="horizontal" style="width:40px;">
<template slot="title" ><i class="nz-icon nz-icon-728bianjiqi_zitidaxiao" style="position: absolute;left: 10px;top: 4px;"></i></template>
<!--<el-submenu index="1-1">-->
<!--<template slot="title">文字大小</template>-->
&lt;!&ndash;<el-submenu index="1-1">&ndash;&gt;
&lt;!&ndash;<template slot="title">文字大小</template>&ndash;&gt;
<el-menu-item @click="changeFontSize(12)" :class="{fontSet:true,menuActive:fontSize==12, smallFont:true}" index="1-1">A</el-menu-item>
<el-menu-item @click="changeFontSize(15)" :class="{fontSet:true,menuActive:fontSize==15, middleFont:true}" index="1-2">A</el-menu-item>
<el-menu-item @click="changeFontSize(20)" :class="{fontSet:true,menuActive:fontSize==20, bigFont:true}" index="1-3">A</el-menu-item>
<!--<el-menu-item class="fontSet" index="1-4"></el-menu-item>-->
<!--</el-submenu>-->
<!--<el-submenu index="1-2" >-->
<!--<template slot="title">字体</template>-->
<!--<el-menu-item index="1-2-1">Monosapace</el-menu-item>-->
<!--<el-menu-item index="1-2-2">Courier New</el-menu-item>-->
<!--</el-submenu>-->
&lt;!&ndash;<el-menu-item class="fontSet" index="1-4"></el-menu-item>&ndash;&gt;
&lt;!&ndash;</el-submenu>&ndash;&gt;
&lt;!&ndash;<el-submenu index="1-2" >&ndash;&gt;
&lt;!&ndash;<template slot="title">字体</template>&ndash;&gt;
&lt;!&ndash;<el-menu-item index="1-2-1">Monosapace</el-menu-item>&ndash;&gt;
&lt;!&ndash;<el-menu-item index="1-2-2">Courier New</el-menu-item>&ndash;&gt;
&lt;!&ndash;</el-submenu>&ndash;&gt;
</el-submenu>
<!-- <el-submenu index="2" style="width:50px;" popper-class="horizontal">-->
<!-- <template slot="title" ><i class="nz-icon nz-icon-upload console-title-icon" style="position: absolute;left: 10px;top: 4px;"></i></template>-->
<!-- <el-menu-item @click="showUploadBox" index="2-1">-->
<!-- <div>{{$t('webshell.upload')}}</div>-->
<!-- </el-menu-item>-->
<!-- <el-menu-item @click="showDownloadBox" index="2-2">-->
<!-- <div>{{$t('webshell.download')}}</div>-->
<!-- </el-menu-item>-->
<!-- </el-submenu>-->
</el-menu>
&lt;!&ndash; <el-submenu index="2" style="width:50px;" popper-class="horizontal">&ndash;&gt;
&lt;!&ndash; <template slot="title" ><i class="nz-icon nz-icon-upload console-title-icon" style="position: absolute;left: 10px;top: 4px;"></i></template>&ndash;&gt;
&lt;!&ndash; <el-menu-item @click="showUploadBox" index="2-1">&ndash;&gt;
&lt;!&ndash; <div>{{$t('webshell.upload')}}</div>&ndash;&gt;
&lt;!&ndash; </el-menu-item>&ndash;&gt;
&lt;!&ndash; <el-menu-item @click="showDownloadBox" index="2-2">&ndash;&gt;
&lt;!&ndash; <div>{{$t('webshell.download')}}</div>&ndash;&gt;
&lt;!&ndash; </el-menu-item>&ndash;&gt;
&lt;!&ndash; </el-submenu>&ndash;&gt;
</el-menu>-->
<el-tabs :before-leave="beforeLeave"
@tab-click="handleClick"
@@ -234,7 +234,7 @@
<el-form-item :label='$t("webshell.host")' prop="host">
<el-input v-model="customConnect.host" size="small"/>
</el-form-item>
<el-form-item :label='$t("webshell.port")' prop="host">
<el-form-item :label='$t("webshell.port")' prop="port">
<el-input v-model="customConnect.port" size="small"/>
</el-form-item>
<el-form-item :label='$t("webshell.authUsername")' prop="authUsername">
@@ -858,11 +858,12 @@ export default {
if (this.assetShow) {
this.$refs.assetConnect.validate((valid) => {
if (valid) {
// this.show(id, host, accountId, port)
const asset = this.assetData.find(item => item.id == this.assetContent.assetId)
this.$get('asset/asset/' + this.assetContent.assetId).then(res => {
const asset = res.data
this.addConsole(asset.id, asset.manageIp, '', '', 'asset')
this.assetShow = false
this.prevent_opt.save = false
})
} else {
this.prevent_opt.save = false
}
@@ -905,7 +906,7 @@ export default {
this.assetContent.assetId = ''
this.customConnect = {
host: '',
port: '',
port: 22,
authType: 1,
authUsername: '',
authPin: '',

View File

@@ -205,7 +205,10 @@ const cn = {
panelId: 'ID'
},
createChartTitle: '新增图表',
createChartTempTitle: '新增图表模板',
createChartByTemp: '通过模板添加图表',
editChartTitle: '编辑图表',
editChartTempTitle: '编辑图表模板', // "编辑图表""
chartForm: {
chartId: 'ID',
chartName: '图表名称',
@@ -1322,7 +1325,8 @@ const cn = {
unitError: '请选择对应的目录',
imgError: '请上传图片',
folder: '目录',
selMod: '请个所有节点绑定module'
selMod: '请个所有节点绑定module',
none: '无'
},
update: '更新'
},

View File

@@ -215,8 +215,11 @@ const en = {
panelId: 'ID' // ID
},
// 图表-侧滑框
createChartTitle: 'New chart template', // "新增图表"
editChartTitle: 'Edit', // "编辑图表"
createChartTitle: 'New chart', // "新增图表"
createChartTempTitle: 'New chart template', // "新增图表"
createChartByTemp: 'New chart by template',
editChartTitle: 'Edit chart', // "编辑图表""
editChartTempTitle: 'Edit chart template', // "编辑图表""
chartForm: {
chartId: 'ID',
chartName: 'Chart Name',
@@ -1344,7 +1347,8 @@ const en = {
unitError: 'Please select the folder',
imgError: 'Please upload pictures',
folder: 'Folder',
selMod: 'Please bind module for all nodes'
selMod: 'Please bind module for all nodes',
none: 'None'
},
update: '更新'
},

View File

@@ -35,11 +35,11 @@
<!--metric-->
<div class="right-box-sub-title" style="margin-bottom: 10px">
<span>{{$t('alert.config.expr')}}</span>
<span @click="addExpression" class="float-right" style="height: 19px;display: inline-block;line-height: 1;">
<span class="create-square-box">
<i style="font-size: 17px; cursor: pointer;" class="nz-icon nz-icon-create-square"></i>
</span>
</span>
<!-- <span @click="addExpression" class="float-right" style="height: 19px;display: inline-block;line-height: 1;">-->
<!-- <span class="create-square-box">-->
<!-- <i style="font-size: 17px; cursor: pointer;" class="nz-icon nz-icon-create-square"></i>-->
<!-- </span>-->
<!-- </span>-->
</div>
<el-row :key="index" class="element-item form-row-item" style=""
v-for="(item,index) in selection.pen.data.expressArr">
@@ -146,8 +146,9 @@
</div>
<!--value mapping-->
<el-row class="form-row-title">
{{$t('dashboard.panel.chartForm.thresholds')}} <span
style="font-size: 12px;color: #666666;letter-spacing: 0;font-weight: 400;margin-left: 10px">0:Ok > >2:Critical</span>
{{$t('dashboard.panel.chartForm.thresholds')}}
<span v-if="selection.pen.data.valueMappingSort !=='desc'" style="font-size: 12px;color: #666666;letter-spacing: 0;font-weight: 400;margin-left: 10px">0:Ok > >{{selection.pen.data.valueMapping.length}}:Critical</span>
<span v-if="selection.pen.data.valueMappingSort ==='desc'" style="font-size: 12px;color: #666666;letter-spacing: 0;font-weight: 400;margin-left: 10px">{{selection.pen.data.valueMapping.length}}:Critical > >0:Ok</span>
</el-row>
<div style="width: 100%;margin-top: 10px">
<div class="thresholds-box">
@@ -232,13 +233,13 @@
<i class="nz-icon nz-icon-plus"></i>
</div>
<!--link-->
<el-row class="form-row-title">
{{$t('project.topology.link')}}
</el-row>
<el-form-item :label="'URL'" class="full-form-item" prop="type">
<el-input v-model="selection.pen.data.url" class="input" size="small"></el-input>
</el-form-item>
<!-- &lt;!&ndash;link&ndash;&gt;-->
<!-- <el-row class="form-row-title">-->
<!-- {{$t('project.topology.link')}}-->
<!-- </el-row>-->
<!-- <el-form-item :label="'URL'" class="full-form-item" prop="type">-->
<!-- <el-input v-model="selection.pen.data.url" class="input" size="small"></el-input>-->
<!-- </el-form-item>-->
</el-form>
</el-tab-pane>
@@ -253,7 +254,91 @@
<!--样式-->
<el-collapse-item :title="'Style'" name="4" v-if="selection.pen">
<div class="flex flex-warp">
<div class="props-pen-item">
<div class="props-pen-item" v-if="selection.pen&&!selection.pen.type">
<div>X</div>
<div class="p10 pl0">
<el-input-number
@focus="inputFocus"
@blur="inputBlur"
:precision="2"
controls-position="right"
size="small"
name="x"
class="input"
v-model.number="selection.pen.rect.x"
:readonly="readonly"
required
@change="onChange()"
>
<template slot="append">px</template>
</el-input-number>
</div>
</div>
<div class="props-pen-item" v-if="selection.pen&&!selection.pen.type">
<div>Y</div>
<div class="p10 pl0">
<el-input-number
@focus="inputFocus"
@blur="inputBlur"
:precision="2"
controls-position="right"
size="small"
name="x"
class="input"
v-model.number="selection.pen.rect.y"
:readonly="readonly"
required
@change="onChange()">
<template slot="append">px</template>
</el-input-number>
</div>
</div>
<div class="props-pen-item" v-if="selection.pen&&!selection.pen.type">
<div>{{$t('project.topology.width')}}</div>
<div class="p10 pl0">
<el-input-number
@focus="inputFocus"
@blur="inputBlur"
:precision="2"
controls-position="right"
size="small"
name="x"
class="input"
v-model.number="selection.pen.rect.width"
:readonly="readonly"
required
@change="onChange()"
:min="0">
<template slot="append">px</template>
</el-input-number>
</div>
</div>
<div class="props-pen-item" v-if="selection.pen&&!selection.pen.type">
<div>{{$t('project.topology.height')}}</div>
<div class="p10 pl0">
<el-input-number
@focus="inputFocus"
@blur="inputBlur"
:precision="2"
controls-position="right"
size="small"
name="x"
class="input"
v-model.number="selection.pen.rect.height"
:readonly="readonly"
required
@change="onChange()"
:min="0">
<template slot="append">px</template>
</el-input-number>
</div>
</div>
<div class="props-pen-item" v-if="selection.pen&&!selection.pen.type">
<div>{{$t('project.topology.circularBead')}}0 - 1</div>
<div class="p10 pl0">
<el-input-number
@@ -274,7 +359,7 @@
</div>
</div>
<div class="props-pen-item">
<div class="props-pen-item" v-if="selection.pen&&!selection.pen.type">
<div>{{$t('project.topology.rotate')}}°</div>
<div class="p10 pl0">
<el-input-number
@@ -534,13 +619,13 @@
<div class="project-content node-content">
<div class="project-content-title">{{$t('project.topology.animation')}}
<span class="float-right" style="margin-right: 10px">
<el-switch
v-model="selection.pen.data.animatePlay"
:active-value="true"
:inactive-value="false"
active-color="#ee9d3f"
@change="()=>{onAnimate()}">
</el-switch>
<!-- <el-switch-->
<!-- v-model="selection.pen.data.animatePlay"-->
<!-- :active-value="true"-->
<!-- :inactive-value="false"-->
<!-- active-color="#ee9d3f"-->
<!-- @change="()=>{onAnimate()}">-->
<!-- </el-switch>-->
</span>
</div>
<div class="project-content-box" style="width: 100%">
@@ -551,7 +636,7 @@
<el-select
v-model="selection.pen.animateType"
size="small"
@change="(val)=>{changeAnimatePlay(val,'node')}"
>
<el-option v-for="(item,index) in nodeAnimateOptions" :value="item.id" :key="index"
:label="item.name"></el-option>
@@ -563,7 +648,8 @@
<label>{{$t('project.topology.animationType')}}</label>
<div class="full pr10">
<el-select v-model="selection.pen.animateType" size="small"
@change="onAnimate">
@change="(val)=>{changeAnimatePlay(val,'line')}"
>
<el-option v-for="(item,index) in lineAnimateOptions" :value="item.id" :key="index"
:label="item.name"></el-option>
</el-select>
@@ -1045,7 +1131,8 @@ export default {
{ id: 1, name: this.$t('project.topology.flow') },
{ id: 'beads', name: this.$t('project.topology.beads') },
{ id: 'dot', name: this.$t('project.topology.dot') },
{ id: 'comet', name: this.$t('project.topology.comet') }
{ id: 'comet', name: this.$t('project.topology.comet') },
{ id: 'custom', name: this.$t('project.topology.none') }
],
nodeAnimateOptions: [
{
@@ -1071,6 +1158,10 @@ export default {
{
id: 'fade',
name: this.$t('project.topology.fade')
},
{
id: '',
name: this.$t('project.topology.none')
}
],
predefineColors: [
@@ -1388,6 +1479,22 @@ export default {
this.drowdown = 0
this.onChange()
},
changeAnimatePlay (val, type) {
if (type === 'node') {
if (val === 'custom') {
this.selection.pen.data.animatePlay = false
} else {
this.selection.pen.data.animatePlay = true
}
} else if (type === 'line') {
if (val === 'custom') {
this.selection.pen.data.animatePlay = false
} else {
this.selection.pen.data.animatePlay = true
}
}
this.onChange()
},
onAnimate (val) {
// this.selection.pen.animateStart=this.selection.pen.animateStart?Date.now():0;
// this.selection.pen.data.animatePlay=this.selection.pen.animatePlay;

View File

@@ -1,7 +1,7 @@
<template>
<div v-clickoutside="{obj: editChartTemp, func: esc}" class="right-box right-box-asset">
<div class="right-box__header">
<div class="header__title">{{editChartTemp.id ? $t('config.user.editChartTemp') : $t('config.user.createUser')}}</div>
<div class="header__title">{{editChartTemp.id ? $t('dashboard.panel.createChartByTemp') :$t('dashboard.panel.createChartByTemp')}}</div>
<div class="header__operation">
<span v-cancel="{obj: editChartTemp, func: esc}"><i class="nz-icon nz-icon-close"></i></span>
</div>

View File

@@ -10,7 +10,7 @@
<!-- end--顶部按钮-->
<!-- begin--标题-->
<div class="right-box-title">{{$t("project.endpoint.editEndpoint") + " ID" + editEndpoint.id}}</div>
<div class="right-box-title">{{$t("project.endpoint.editEndpoint") }}</div>
<!-- end--标题-->
<!-- begin--表单-->

View File

@@ -150,7 +150,8 @@
</transition>
<div class="right-box__header">
<div class="header__title">{{editChart.id ? $t("dashboard.panel.editChartTitle") : $t("dashboard.panel.createChartTitle")}}</div>
<div class="header__title" v-if="from !== 'temp'">{{editChart.id ? $t("dashboard.panel.editChartTitle") : $t("dashboard.panel.createChartTitle")}}</div>
<div class="header__title" v-if="from === 'temp'">{{editChart.id ? $t("dashboard.panel.editChartTempTitle") : $t("dashboard.panel.createChartTempTitle")}}</div>
<div class="header__operation">
<span v-cancel="{obj: editChart, func: clickOutside}"><i class="nz-icon nz-icon-close"></i></span>
</div>