mandant-crm/frontend/components/history/HistoryForm.vue

52 lines
1.7 KiB
Vue
Raw Normal View History

<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>