matthieu
74116506db
- SidebarTimer widget with play/stop button - TimeEntryBlock with drag-to-move and resize - TimeEntryDrawer for create/edit entries - TimeEntryContextMenu for copy/paste/delete - TimeTrackingCalendar grid with week/day view - Time tracking page with filters and navigation - Sidebar link and timer integration in layout - TaskCard play button connected to timer store Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
34 lines
1.0 KiB
Vue
34 lines
1.0 KiB
Vue
<template>
|
|
<div class="flex items-center gap-2">
|
|
<button
|
|
class="flex items-center justify-center rounded-full transition-colors"
|
|
:class="timerStore.isRunning
|
|
? 'bg-red-500 hover:bg-red-600 text-white'
|
|
: 'bg-green-500 hover:bg-green-600 text-white'"
|
|
style="width: 32px; height: 32px;"
|
|
:title="timerStore.isRunning ? 'Arrêter le timer' : 'Démarrer un timer'"
|
|
@click="timerStore.isRunning ? timerStore.stop() : timerStore.start()"
|
|
>
|
|
<Icon
|
|
:name="timerStore.isRunning ? 'mdi:stop' : 'mdi:play'"
|
|
size="18"
|
|
/>
|
|
</button>
|
|
<span
|
|
v-if="!collapsed"
|
|
class="font-mono text-sm font-bold"
|
|
:class="timerStore.isRunning ? 'text-white' : 'text-neutral-400'"
|
|
>
|
|
{{ timerStore.elapsedFormatted }}
|
|
</span>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
defineProps<{
|
|
collapsed: boolean
|
|
}>()
|
|
|
|
const timerStore = useTimerStore()
|
|
</script>
|