fix(推荐断言弹框可以点击空白关闭): 推荐断言弹框可以点击空白关闭
This commit is contained in:
parent
e56e2e19b5
commit
33e0207d84
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<el-row :gutter="10" class="json-path-suggest-button">
|
<el-row :gutter="10" class="json-path-suggest-button">
|
||||||
<el-button size="small" type="primary" @click="$emit('open')">
|
<el-button size="small" type="primary" @click="$emit('open')" @click.stop>
|
||||||
{{openTip}}
|
{{openTip}}
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-button size="small" type="danger" @click="$emit('clear')">
|
<el-button size="small" type="danger" @click="$emit('clear')">
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<ms-drawer class="json-path-picker" :visible="visible" :size="30" @close="close" direction="right">
|
<ms-drawer class="json-path-picker" :visible="visible" :size="30" @close="close" direction="right" v-clickoutside="close">
|
||||||
<template v-slot:header>
|
<template v-slot:header>
|
||||||
<ms-instructions-icon :content="tip"/>
|
<ms-instructions-icon :content="tip"/>
|
||||||
{{tip}}
|
{{tip}}
|
||||||
|
@ -13,9 +13,37 @@ import MsDrawer from "../../../../common/components/MsDrawer";
|
||||||
import MsInstructionsIcon from "../../../../common/components/MsInstructionsIcon";
|
import MsInstructionsIcon from "../../../../common/components/MsInstructionsIcon";
|
||||||
|
|
||||||
let dotReplace = "#DOT_MASK#";
|
let dotReplace = "#DOT_MASK#";
|
||||||
|
|
||||||
|
const clickoutside = {
|
||||||
|
// 初始化指令
|
||||||
|
bind (el, binding, vnode) {
|
||||||
|
function documentHandler (e) {
|
||||||
|
// 这里判断点击的元素是否是本身,是本身,则返回
|
||||||
|
if (el.contains(e.target)) {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
// 判断指令中是否绑定了函数
|
||||||
|
if (binding.expression) {
|
||||||
|
// 如果绑定了函数 则调用那个函数,此处binding.value就是handleClose方法
|
||||||
|
binding.value(e)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 给当前元素绑定个私有变量,方便在unbind中可以解除事件监听
|
||||||
|
el.__vueClickOutside__ = documentHandler
|
||||||
|
document.addEventListener('click', documentHandler)
|
||||||
|
},
|
||||||
|
update () { },
|
||||||
|
unbind (el, binding) {
|
||||||
|
// 解除事件监听
|
||||||
|
document.removeEventListener('click', el.__vueClickOutside__)
|
||||||
|
delete el.__vueClickOutside__
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "MsApiJsonpathSuggest",
|
name: "MsApiJsonpathSuggest",
|
||||||
components: {MsInstructionsIcon, MsDrawer},
|
components: {MsInstructionsIcon, MsDrawer},
|
||||||
|
directives: { clickoutside },
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
visible: false,
|
visible: false,
|
||||||
|
|
|
@ -454,14 +454,18 @@
|
||||||
item.tags = JSON.parse(item.tags);
|
item.tags = JSON.parse(item.tags);
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
if (this.$refs.apiDefinitionTable) {
|
// if (this.$refs.apiDefinitionTable) {
|
||||||
setTimeout(() => {
|
// setTimeout(() => {
|
||||||
this.$refs.apiDefinitionTable.doLayout();
|
// this.$refs.apiDefinitionTable.doLayout();
|
||||||
this.result.loading = false;
|
// this.result.loading = false;
|
||||||
}, 500)
|
// }, 500)
|
||||||
}
|
// }
|
||||||
// nexttick:表格加载完成之后触发。判断是否需要勾选行
|
// nexttick:表格加载完成之后触发。判断是否需要勾选行
|
||||||
this.$nextTick(function(){
|
this.$nextTick(function(){
|
||||||
|
if (this.$refs.apiDefinitionTable) {
|
||||||
|
this.$refs.apiDefinitionTable.doLayout();
|
||||||
|
this.result.loading = false;
|
||||||
|
}
|
||||||
this.checkTableRowIsSelect();
|
this.checkTableRowIsSelect();
|
||||||
})
|
})
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in New Issue