34 lines
978 B
Vue
34 lines
978 B
Vue
<template>
|
|
<div class="flex flex-col items-center py-5 px-3 fixed bottom-14 right-0">
|
|
<div class="self-end mt-2 flex gap-2">
|
|
<button @mousedown.stop @click="handleDelete" class="btn-red py-1.5 px-4">
|
|
<img src="/assets/icons/trashcan.svg" class="w-4 h-4" alt="Delete" />
|
|
</button>
|
|
<button @mousedown.stop @click="handleRotate" class="btn-cyan py-1.5 px-4">Rotate</button>
|
|
<button @mousedown.stop @click="handleMove" class="btn-cyan py-1.5 px-4 min-w-24">Move</button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import type { PlacedMapObject } from '@/application/types'
|
|
|
|
const props = defineProps<{
|
|
placedMapObject: PlacedMapObject
|
|
}>()
|
|
|
|
const emit = defineEmits(['move', 'rotate', 'delete'])
|
|
|
|
const handleMove = () => {
|
|
emit('move', props.placedMapObject.id)
|
|
}
|
|
|
|
const handleRotate = () => {
|
|
emit('rotate', props.placedMapObject.id)
|
|
}
|
|
|
|
const handleDelete = () => {
|
|
emit('delete', props.placedMapObject.id)
|
|
}
|
|
</script>
|