驱采列表加tooltip
This commit is contained in:
parent
9ec7f73ff2
commit
e6b1b0c63d
@ -19,9 +19,16 @@
|
||||
<span v-else-if="row == 1 || col == 1">
|
||||
{{ row == 1 ? col - 1 : row - 1 }}</span
|
||||
>
|
||||
<span v-else>
|
||||
<div v-else @mouseover="onMouseOver" @mouseleave="showTooltip = false">
|
||||
{{ map.get(`${row - 1}-${col - 1}`) }}
|
||||
</span>
|
||||
<q-tooltip
|
||||
anchor="bottom middle"
|
||||
self="bottom middle"
|
||||
v-if="showTooltip"
|
||||
>
|
||||
{{ map.get(`${row - 1}-${col - 1}`) }}
|
||||
</q-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<template v-slot:titleButton>
|
||||
@ -163,6 +170,13 @@ function updateMap() {
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
const showTooltip = ref(false);
|
||||
function onMouseOver(e: MouseEvent) {
|
||||
if ((e.target as HTMLElement).clientHeight > 30) {
|
||||
showTooltip.value = true;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
@ -19,9 +19,16 @@
|
||||
<span v-else-if="row == 1 || col == 1">
|
||||
{{ row == 1 ? col - 1 : row - 1 }}</span
|
||||
>
|
||||
<span v-else>
|
||||
<div v-else @mouseover="onMouseOver" @mouseleave="showTooltip = false">
|
||||
{{ map.get(`${row - 1}-${col - 1}`) }}
|
||||
</span>
|
||||
<q-tooltip
|
||||
anchor="bottom middle"
|
||||
self="bottom middle"
|
||||
v-if="showTooltip"
|
||||
>
|
||||
{{ map.get(`${row - 1}-${col - 1}`) }}
|
||||
</q-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<template v-slot:titleButton>
|
||||
@ -159,6 +166,13 @@ function updateMap() {
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
const showTooltip = ref(false);
|
||||
function onMouseOver(e: MouseEvent) {
|
||||
if ((e.target as HTMLElement).clientHeight > 30) {
|
||||
showTooltip.value = true;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
Loading…
Reference in New Issue
Block a user