fix: chart Diagram bug 修改
This commit is contained in:
@@ -9,7 +9,7 @@
|
|||||||
<div v-if="(editTopologyFlag || isPreview)&&!fromChart" class="edit-topologyLine top-tools" style="padding-left: 20px;width: calc(100% - 20px);display: inline-block">
|
<div v-if="(editTopologyFlag || isPreview)&&!fromChart" class="edit-topologyLine top-tools" style="padding-left: 20px;width: calc(100% - 20px);display: inline-block">
|
||||||
<!--工具栏-->
|
<!--工具栏-->
|
||||||
<span v-if="!isPreview" class="project-topology-tool">
|
<span v-if="!isPreview" class="project-topology-tool">
|
||||||
<el-dropdown trigger="click" size="small" placement="bottom-start" v-has="'topo_icon_list'">
|
<el-dropdown trigger="click" size="small" placement="bottom-start" v-has="'topo_icon_list'" class="no-style-class">
|
||||||
<span class="el-dropdown-title"><i class="iconfont icon-cube"></i> <i
|
<span class="el-dropdown-title"><i class="iconfont icon-cube"></i> <i
|
||||||
class="nz-icon nz-icon-arrow-down"></i></span>
|
class="nz-icon nz-icon-arrow-down"></i></span>
|
||||||
<el-dropdown-menu slot="dropdown" @click="dropdownClick">
|
<el-dropdown-menu slot="dropdown" @click="dropdownClick">
|
||||||
|
|||||||
@@ -4,7 +4,7 @@ import i18n from '../i18n'
|
|||||||
import bus from '@/libs/bus'
|
import bus from '@/libs/bus'
|
||||||
import moment from 'moment-timezone'
|
import moment from 'moment-timezone'
|
||||||
/* 弹窗点击外部后关闭 */
|
/* 弹窗点击外部后关闭 */
|
||||||
const exceptClassName = ['prevent-clickoutside', 'config-dropdown', 'nz-pop', 'el-picker', 'chart-box-dropdown', 'metric-dropdown', 'el-cascader__dropdown', 'no-style-class', 'el-message-box', 'nz-dashboard-dropdown', 'el-autocomplete-suggestion', 'nz-temp-box', 'el-time-panel', 'topology-dialog', 'el-dropdown-menu', 'el-select-dropdown'] // clickoutside排除的class(白名单) no-style-class:没有任何样式的class
|
const exceptClassName = ['prevent-clickoutside', 'config-dropdown', 'nz-pop', 'el-picker', 'chart-box-dropdown', 'metric-dropdown', 'el-cascader__dropdown', 'no-style-class', 'el-message-box', 'nz-dashboard-dropdown', 'el-autocomplete-suggestion', 'nz-temp-box', 'el-time-panel', 'el-dropdown-menu', 'el-select-dropdown'] // clickoutside排除的class(白名单) no-style-class:没有任何样式的class
|
||||||
export const clickoutside = {
|
export const clickoutside = {
|
||||||
// 初始化指令
|
// 初始化指令
|
||||||
bind (el, binding, vnode) {
|
bind (el, binding, vnode) {
|
||||||
|
|||||||
@@ -12,7 +12,7 @@
|
|||||||
<el-form v-model="selection.pen.data" class="pens-data" label-position="top">
|
<el-form v-model="selection.pen.data" class="pens-data" label-position="top">
|
||||||
<!--module-->
|
<!--module-->
|
||||||
<el-form-item label="Module" prop="moduleId" v-if="!selection.pen.type&&!fromDiagram" class="half-form-item">
|
<el-form-item label="Module" prop="moduleId" v-if="!selection.pen.type&&!fromDiagram" class="half-form-item">
|
||||||
<el-select v-model="selection.pen.data.moduleId" :placeholder="$t('el.select.placeholder')" popper-class="asset-dropdown" size="small"
|
<el-select :popper-append-to-body="false" v-model="selection.pen.data.moduleId" :placeholder="$t('el.select.placeholder')" popper-class="asset-dropdown" size="small"
|
||||||
@change="moduleIdChange" >
|
@change="moduleIdChange" >
|
||||||
<el-option
|
<el-option
|
||||||
v-for="item in modules"
|
v-for="item in modules"
|
||||||
@@ -74,7 +74,7 @@
|
|||||||
{{$t('dashboard.panel.chartForm.aggregation')}}
|
{{$t('dashboard.panel.chartForm.aggregation')}}
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col style="width: calc(100% - 120px)">
|
<el-col style="width: calc(100% - 120px)">
|
||||||
<el-select class="right-box-row-with-btn" :placeholder="$t('el.select.placeholder')" popper-class="chart-box-dropdown-small"
|
<el-select :popper-append-to-body="false" class="right-box-row-with-btn" :placeholder="$t('el.select.placeholder')" popper-class="chart-box-dropdown-small"
|
||||||
size="mini"
|
size="mini"
|
||||||
style="width: 100%"
|
style="width: 100%"
|
||||||
v-model="selection.pen.data.aggregation" value-key="chartType">
|
v-model="selection.pen.data.aggregation" value-key="chartType">
|
||||||
@@ -131,7 +131,7 @@
|
|||||||
</el-col>
|
</el-col>
|
||||||
<el-col class="thresholds-cell" :span="8">
|
<el-col class="thresholds-cell" :span="8">
|
||||||
<!--线-->
|
<!--线-->
|
||||||
<el-select
|
<el-select :popper-append-to-body="false"
|
||||||
v-model="item.animateType"
|
v-model="item.animateType"
|
||||||
size="small"
|
size="small"
|
||||||
v-if="selection.pen&&selection.pen.type&&item.level!==0">
|
v-if="selection.pen&&selection.pen.type&&item.level!==0">
|
||||||
@@ -143,7 +143,7 @@
|
|||||||
</el-option>
|
</el-option>
|
||||||
</el-select>
|
</el-select>
|
||||||
<!--点-->
|
<!--点-->
|
||||||
<el-select
|
<el-select :popper-append-to-body="false"
|
||||||
v-model="item.animateType"
|
v-model="item.animateType"
|
||||||
size="small"
|
size="small"
|
||||||
v-if="selection.pen&&!selection.pen.type&&item.level!==0">
|
v-if="selection.pen&&!selection.pen.type&&item.level!==0">
|
||||||
@@ -203,7 +203,7 @@
|
|||||||
</el-cascader>
|
</el-cascader>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item :label="$t('dashboard.panel.chartForm.type')" class="half-form-item" prop="type">
|
<el-form-item :label="$t('dashboard.panel.chartForm.type')" class="half-form-item" prop="type">
|
||||||
<el-select class="right-box-row-with-btn" :placeholder="$t('el.select.placeholder')" popper-class="chart-box-dropdown-small"
|
<el-select :popper-append-to-body="false" class="right-box-row-with-btn" :placeholder="$t('el.select.placeholder')" popper-class="chart-box-dropdown-small"
|
||||||
size="mini"
|
size="mini"
|
||||||
v-model="selection.pen.data.type" value-key="chartType">
|
v-model="selection.pen.data.type" value-key="chartType">
|
||||||
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in chartTypeList">
|
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in chartTypeList">
|
||||||
@@ -418,7 +418,7 @@
|
|||||||
<div class="props-pen-item" v-if="selection.pen&&!selection.pen.type">
|
<div class="props-pen-item" v-if="selection.pen&&!selection.pen.type">
|
||||||
<div>{{$t('project.topology.gradient')}}</div>
|
<div>{{$t('project.topology.gradient')}}</div>
|
||||||
<div class="p10 pl0 gradient-to">
|
<div class="p10 pl0 gradient-to">
|
||||||
<el-select v-model="selection.pen.gradientType" size="small"
|
<el-select :popper-append-to-body="false" v-model="selection.pen.gradientType" size="small"
|
||||||
@change="bkTypeChange" style="width: 60px;border-radius: 4px 0 0 4px;background: #F5F7FA" class="color-before-select" popper-class="color-before-select">
|
@change="bkTypeChange" style="width: 60px;border-radius: 4px 0 0 4px;background: #F5F7FA" class="color-before-select" popper-class="color-before-select">
|
||||||
<div slot="prefix">
|
<div slot="prefix">
|
||||||
<i :class="['nz-icon',bkTypeOption.find(item1=>item1.id==selection.pen.data.gradientType).label,bkTypeOption.find(item1=>item1.id==selection.pen.data.gradientType).fontSize]"></i>
|
<i :class="['nz-icon',bkTypeOption.find(item1=>item1.id==selection.pen.data.gradientType).label,bkTypeOption.find(item1=>item1.id==selection.pen.data.gradientType).fontSize]"></i>
|
||||||
@@ -458,7 +458,7 @@
|
|||||||
<div class="props-pen-item special-select">
|
<div class="props-pen-item special-select">
|
||||||
<div>{{$t('project.topology.lineDash')}}</div>
|
<div>{{$t('project.topology.lineDash')}}</div>
|
||||||
<div class="p10 pl0">
|
<div class="p10 pl0">
|
||||||
<el-select v-model="selection.pen.dash" size="small"
|
<el-select :popper-append-to-body="false" v-model="selection.pen.dash" size="small"
|
||||||
@change="onChange">
|
@change="onChange">
|
||||||
<div slot="prefix">
|
<div slot="prefix">
|
||||||
<div class="icon-item">
|
<div class="icon-item">
|
||||||
@@ -488,7 +488,7 @@
|
|||||||
<div class="props-pen-item special-select" v-if="selection.pen&&selection.pen.type">
|
<div class="props-pen-item special-select" v-if="selection.pen&&selection.pen.type">
|
||||||
<div>{{$t('project.topology.lineType')}}</div>
|
<div>{{$t('project.topology.lineType')}}</div>
|
||||||
<div class="p10 pl0">
|
<div class="p10 pl0">
|
||||||
<el-select v-model="selection.pen.name" size="small"
|
<el-select :popper-append-to-body="false" v-model="selection.pen.name" size="small"
|
||||||
@change="onClickName">
|
@change="onClickName">
|
||||||
<div slot="prefix">
|
<div slot="prefix">
|
||||||
<div class="icon-item">
|
<div class="icon-item">
|
||||||
@@ -518,7 +518,7 @@
|
|||||||
<div class="props-pen-item special-select" v-if="selection.pen&&selection.pen.type">
|
<div class="props-pen-item special-select" v-if="selection.pen&&selection.pen.type">
|
||||||
<div>{{$t('project.topology.fromArrow')}}</div>
|
<div>{{$t('project.topology.fromArrow')}}</div>
|
||||||
<div class="p10 pl0">
|
<div class="p10 pl0">
|
||||||
<el-select v-model="selection.pen.fromArrow" size="small"
|
<el-select :popper-append-to-body="false" v-model="selection.pen.fromArrow" size="small"
|
||||||
@change="onClickFromArrow">
|
@change="onClickFromArrow">
|
||||||
<div slot="prefix">
|
<div slot="prefix">
|
||||||
<div class="icon-item">
|
<div class="icon-item">
|
||||||
@@ -567,7 +567,7 @@
|
|||||||
<div class="props-pen-item special-select" v-if="selection.pen&&selection.pen.type">
|
<div class="props-pen-item special-select" v-if="selection.pen&&selection.pen.type">
|
||||||
<div>{{$t('project.topology.toArrow')}}</div>
|
<div>{{$t('project.topology.toArrow')}}</div>
|
||||||
<div class="p10 pl0">
|
<div class="p10 pl0">
|
||||||
<el-select v-model="selection.pen.toArrow" size="small"
|
<el-select :popper-append-to-body="false" v-model="selection.pen.toArrow" size="small"
|
||||||
@change="onClickToArrow">
|
@change="onClickToArrow">
|
||||||
<div slot="prefix">
|
<div slot="prefix">
|
||||||
<div class="icon-item">
|
<div class="icon-item">
|
||||||
@@ -647,7 +647,7 @@
|
|||||||
<!-- <div class="props-pen-item" v-if="selection.pen&&!selection.pen.type">-->
|
<!-- <div class="props-pen-item" v-if="selection.pen&&!selection.pen.type">-->
|
||||||
<!-- <div>{{$t('project.topology.img')}}</div>-->
|
<!-- <div>{{$t('project.topology.img')}}</div>-->
|
||||||
<!-- <div class="p10 pl0">-->
|
<!-- <div class="p10 pl0">-->
|
||||||
<!-- <el-select>-->
|
<!-- <el-select :popper-append-to-body= 'false'>-->
|
||||||
<!-- <el-option-group-->
|
<!-- <el-option-group-->
|
||||||
<!-- v-for="group in imgArr"-->
|
<!-- v-for="group in imgArr"-->
|
||||||
<!-- :key="group.label"-->
|
<!-- :key="group.label"-->
|
||||||
@@ -683,7 +683,7 @@
|
|||||||
<div class="project-content-item" v-if="!selection.pen.type">
|
<div class="project-content-item" v-if="!selection.pen.type">
|
||||||
<label>{{$t('project.topology.animationType')}}</label>
|
<label>{{$t('project.topology.animationType')}}</label>
|
||||||
<div class="full pr10">
|
<div class="full pr10">
|
||||||
<el-select
|
<el-select :popper-append-to-body="false"
|
||||||
v-model="selection.pen.animateType"
|
v-model="selection.pen.animateType"
|
||||||
size="small"
|
size="small"
|
||||||
@change="(val)=>{changeAnimatePlay(val,'node')}"
|
@change="(val)=>{changeAnimatePlay(val,'node')}"
|
||||||
@@ -697,7 +697,7 @@
|
|||||||
<div class="project-content-item half" v-if="selection.pen.type">
|
<div class="project-content-item half" v-if="selection.pen.type">
|
||||||
<label>{{$t('project.topology.animationType')}}</label>
|
<label>{{$t('project.topology.animationType')}}</label>
|
||||||
<div class="full pr10">
|
<div class="full pr10">
|
||||||
<el-select v-model="selection.pen.animateType" size="small"
|
<el-select :popper-append-to-body="false" v-model="selection.pen.animateType" size="small"
|
||||||
@change="(val)=>{changeAnimatePlay(val,'line')}"
|
@change="(val)=>{changeAnimatePlay(val,'line')}"
|
||||||
>
|
>
|
||||||
<el-option v-for="(item,index) in lineAnimateOptions" :value="item.id" :key="index"
|
<el-option v-for="(item,index) in lineAnimateOptions" :value="item.id" :key="index"
|
||||||
@@ -899,7 +899,7 @@
|
|||||||
<div class="project-content-item half special-select">
|
<div class="project-content-item half special-select">
|
||||||
<label>{{$t('project.topology.defaultStartArrow')}}</label>
|
<label>{{$t('project.topology.defaultStartArrow')}}</label>
|
||||||
<div class="full pr10 h32">
|
<div class="full pr10 h32">
|
||||||
<el-select v-model="topologyData.data.fromArrow" size="small"
|
<el-select :popper-append-to-body='false' v-model="topologyData.data.fromArrow" size="small"
|
||||||
|
|
||||||
@change="changeTopologyOpt(topologyData.data.fromArrow,'fromArrow')">
|
@change="changeTopologyOpt(topologyData.data.fromArrow,'fromArrow')">
|
||||||
<div slot="prefix">
|
<div slot="prefix">
|
||||||
@@ -949,7 +949,7 @@
|
|||||||
<div class="project-content-item half special-select">
|
<div class="project-content-item half special-select">
|
||||||
<label>{{$t('project.topology.defaultEndArrow')}}</label>
|
<label>{{$t('project.topology.defaultEndArrow')}}</label>
|
||||||
<div class="full pr10 h32">
|
<div class="full pr10 h32">
|
||||||
<el-select v-model="topologyData.data.toArrow" size="small"
|
<el-select :popper-append-to-body='false' v-model="topologyData.data.toArrow" size="small"
|
||||||
|
|
||||||
@change="changeTopologyOpt('toArrow')">
|
@change="changeTopologyOpt('toArrow')">
|
||||||
<div slot="prefix">
|
<div slot="prefix">
|
||||||
@@ -1697,7 +1697,7 @@ export default {
|
|||||||
text: '#000000'
|
text: '#000000'
|
||||||
},
|
},
|
||||||
showColor: undefined,
|
showColor: undefined,
|
||||||
animateType: this.selection.pen.type ? 1 : 'upDown',
|
animateType: this.selection.pen.type ? 1 : '',
|
||||||
value: 0,
|
value: 0,
|
||||||
level: 1,
|
level: 1,
|
||||||
showType: 'fill'// bac text border
|
showType: 'fill'// bac text border
|
||||||
@@ -1716,7 +1716,7 @@ export default {
|
|||||||
text: '#000000'
|
text: '#000000'
|
||||||
},
|
},
|
||||||
showColor: undefined,
|
showColor: undefined,
|
||||||
animateType: this.selection.pen.type ? 1 : 'upDown',
|
animateType: this.selection.pen.type ? 1 : '',
|
||||||
value: 0,
|
value: 0,
|
||||||
level: this.selection.pen.data.valueMapping.length,
|
level: this.selection.pen.data.valueMapping.length,
|
||||||
showType: 'fill'// bac text border
|
showType: 'fill'// bac text border
|
||||||
|
|||||||
Reference in New Issue
Block a user