52 lines
1.7 KiB
Vue
52 lines
1.7 KiB
Vue
|
|
<script setup lang="ts">
|
||
|
|
const emit = defineEmits<{ submit: [payload: { type: string; body: string }] }>()
|
||
|
|
|
||
|
|
const type = ref('phone_call')
|
||
|
|
const body = ref('')
|
||
|
|
const submitting = ref(false)
|
||
|
|
|
||
|
|
const types = [
|
||
|
|
{ value: 'phone_call', label: 'Telefonat' },
|
||
|
|
{ value: 'consultation', label: 'Beratungsgespräch' },
|
||
|
|
{ value: 'recommendation', label: 'Empfehlung' },
|
||
|
|
{ value: 'instruction', label: 'Anweisung' },
|
||
|
|
{ value: 'remark', label: 'Bemerkung' },
|
||
|
|
{ value: 'other', label: 'Sonstiges' },
|
||
|
|
]
|
||
|
|
|
||
|
|
const submit = async () => {
|
||
|
|
if (!body.value.trim()) return
|
||
|
|
submitting.value = true
|
||
|
|
emit('submit', { type: type.value, body: body.value })
|
||
|
|
body.value = ''
|
||
|
|
submitting.value = false
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<form @submit.prevent="submit" class="border border-gray-200 bg-white p-4 space-y-3">
|
||
|
|
<div class="flex gap-3 items-start">
|
||
|
|
<div class="shrink-0">
|
||
|
|
<label class="block text-xs font-medium text-gray-600 mb-1">Typ</label>
|
||
|
|
<select v-model="type" class="border border-gray-300 px-2 py-1.5 text-sm">
|
||
|
|
<option v-for="t in types" :key="t.value" :value="t.value">{{ t.label }}</option>
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
<div class="flex-1">
|
||
|
|
<label class="block text-xs font-medium text-gray-600 mb-1">Eintrag</label>
|
||
|
|
<textarea
|
||
|
|
v-model="body"
|
||
|
|
rows="3"
|
||
|
|
placeholder="Notiz eingeben…"
|
||
|
|
class="w-full border border-gray-300 px-3 py-2 text-sm resize-y"
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="flex justify-end">
|
||
|
|
<button type="submit" :disabled="submitting || !body.trim()" class="bg-blue-600 text-white px-4 py-1.5 text-sm hover:bg-blue-700 disabled:opacity-50">
|
||
|
|
Eintrag speichern
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
</form>
|
||
|
|
</template>
|