forked from mengyxu/noob-components
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
47 lines
1.0 KiB
47 lines
1.0 KiB
6 months ago
|
<template>
|
||
|
|
<el-tooltip
|
||
|
|
v-if="props.tooltip"
|
||
|
|
:content="props.tooltip"
|
||
|
|
:disabled="props.disabled"
|
||
|
|
:show-after="0"
|
||
|
|
:hide-after="0"
|
||
|
|
:popper-options="{ modifiers: [{ name: 'eventListeners', enabled: false }] }"
|
||
|
|
popper-class="non-interactive-tooltip"
|
||
|
|
>
|
||
|
|
<NoobButton :disabled="props.disabled" v-bind="buttonProps">
|
||
|
|
<slot />
|
||
|
|
</NoobButton>
|
||
|
|
</el-tooltip>
|
||
|
|
<NoobButton v-else :disabled="props.disabled" v-bind="buttonProps">
|
||
|
|
<slot />
|
||
|
|
</NoobButton>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup lang="ts">
|
||
|
|
import { useAttrs } from "vue";
|
||
|
|
import { ElTooltip } from "element-plus";
|
||
|
|
import { computed } from "vue";
|
||
|
|
import { NoobButton } from "noob-mengyxu";
|
||
|
|
|
||
|
|
defineOptions({ inheritAttrs: false });
|
||
|
|
|
||
|
|
interface Props {
|
||
|
|
tooltip?: string;
|
||
|
|
disabled: boolean;
|
||
|
|
}
|
||
|
|
|
||
|
|
const props = defineProps<Props>();
|
||
|
|
const attrs = useAttrs();
|
||
|
|
|
||
|
|
const buttonProps = computed(() => {
|
||
|
|
const { class: _, ...rest } = attrs;
|
||
|
|
return rest;
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
.non-interactive-tooltip {
|
||
|
|
pointer-events: none !important;
|
||
|
|
}
|
||
|
|
</style>
|