|
@@ -3,7 +3,8 @@
|
|
|
class="tabs_item 小手指"
|
|
|
v-if="modal"
|
|
|
:style="displayLocation">
|
|
|
- <ul>
|
|
|
+ <slot v-if="slots"/>
|
|
|
+ <ul v-else>
|
|
|
<li v-for="(item,index) in props.config" @click="handlingClickEvents(item.click)">
|
|
|
{{ item.name }}
|
|
|
</li>
|
|
@@ -27,6 +28,10 @@ const props = defineProps({
|
|
|
mousePosition: {
|
|
|
type: Object,
|
|
|
default: {}
|
|
|
+ },
|
|
|
+ closeManually: {
|
|
|
+ type: Boolean,
|
|
|
+ default: false
|
|
|
}
|
|
|
})
|
|
|
|
|
@@ -35,7 +40,9 @@ const modal = ref(false)
|
|
|
const modalRef = ref(null)
|
|
|
|
|
|
onClickOutside(modalRef, () => {
|
|
|
- modal.value = false
|
|
|
+ if (!props.closeManually) {
|
|
|
+ modal.value = false
|
|
|
+ }
|
|
|
})
|
|
|
|
|
|
let displayLocation = $ref({
|
|
@@ -77,6 +84,21 @@ const calculateTheLocation = (x, y) => {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+const close = () => {
|
|
|
+ modal.value = false
|
|
|
+}
|
|
|
+
|
|
|
+defineExpose({
|
|
|
+ close
|
|
|
+})
|
|
|
+
|
|
|
+let slots = $ref(false)
|
|
|
+onMounted(() => {
|
|
|
+ if (!!useSlots().default) {
|
|
|
+ slots = true
|
|
|
+ }
|
|
|
+})
|
|
|
+
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
@@ -85,7 +107,7 @@ const calculateTheLocation = (x, y) => {
|
|
|
text-align: center;
|
|
|
margin: 5px;
|
|
|
padding: 5px;
|
|
|
- z-index: 99999;
|
|
|
+ z-index: 100;
|
|
|
background-color: white;
|
|
|
box-shadow: 2px 2px 3px 0 rgb(4 4 4);
|
|
|
border-radius: 5px;
|