Add text editor to invoice dialog

Fixes #42
This commit is contained in:
2025-10-22 16:13:52 +02:00
parent beade697a8
commit a539444485
@@ -30,6 +30,7 @@ import { Calendar } from "@/components/ui/calendar"
import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover" import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover"
import { exportPdf, exportXml } from "@/routes/invoice"; import { exportPdf, exportXml } from "@/routes/invoice";
import { Sheet, SheetContent, SheetDescription, SheetHeader, SheetTitle, SheetTrigger, } from '@/components/ui/sheet' import { Sheet, SheetContent, SheetDescription, SheetHeader, SheetTitle, SheetTrigger, } from '@/components/ui/sheet'
import { GrowingTextarea } from '../ui/growing-textarea';
const props = defineProps<{ const props = defineProps<{
invoiceData: Invoice | null, invoiceData: Invoice | null,
@@ -132,8 +133,6 @@ watch(importCustomer,
(newValue, oldValue) => { (newValue, oldValue) => {
if (!invoice.value) return if (!invoice.value) return
if (!isLoading.value) { if (!isLoading.value) {
if (!invoice.value.billingData) invoice.value.billingData = newBillingData() if (!invoice.value.billingData) invoice.value.billingData = newBillingData()
@@ -151,8 +150,9 @@ watch(importCustomer,
if (!invoice.value.billingData.paymentTerms || !isLoading.value) if (!invoice.value.billingData.paymentTerms || !isLoading.value)
invoice.value.billingData.paymentTerms = newValue.paymentTerms as PaymentTerms invoice.value.billingData.paymentTerms = newValue.paymentTerms as PaymentTerms
if (!isLoading.value) isDirty.value = true invoice.value.customer = newValue
} }
}, },
{ deep: true } { deep: true }
) )
@@ -337,16 +337,16 @@ const updateTotalAmount = () => {
<Eye :strokeWidth="1.666" class="text-current" /> <Eye :strokeWidth="1.666" class="text-current" />
</DropdownMenuItem> </DropdownMenuItem>
<DropdownMenuSeparator /> <DropdownMenuSeparator />
<DropdownMenuItem class="flex justify-between" @click="exportPdf"> <DropdownMenuItem class="flex justify-between" @click="downloadPdf">
<div class="mr-2 flex flex-col"> <div class="mr-2 flex flex-col">
<span>PDF exportieren</span> <span>PDF speichern</span>
<span class="text-xs text-muted-foreground">(ZUGFeRD)</span> <span class="text-xs text-muted-foreground">(ZUGFeRD)</span>
</div> </div>
<FileText :strokeWidth="1.666" class="text-current" /> <FileText :strokeWidth="1.666" class="text-current" />
</DropdownMenuItem> </DropdownMenuItem>
<DropdownMenuItem class="flex justify-between" @click="exportXml"> <DropdownMenuItem class="flex justify-between" @click="downloadXml">
<div class="mr-2 flex flex-col"> <div class="mr-2 flex flex-col">
<span>XML exportieren</span> <span>XML speichern</span>
<span class="text-xs text-muted-foreground">(XRechnung)</span> <span class="text-xs text-muted-foreground">(XRechnung)</span>
</div> </div>
<CodeXml :strokeWidth="1.666" class="text-current" /> <CodeXml :strokeWidth="1.666" class="text-current" />
@@ -562,6 +562,11 @@ const updateTotalAmount = () => {
</div> </div>
</div> </div>
<div id="document-text" class="px-4 mt-6">
<GrowingTextarea v-model="invoice.text" placeholder="Anschreiben"
class="font-light bg-transparent dark:bg-transparent hover:bg-accent dark:hover:bg-accent/30 border-none shadow-none" />
</div>
<LineItemTable :lineItems="invoice.items" @update:lineItems="updateTotalAmount" /> <LineItemTable :lineItems="invoice.items" @update:lineItems="updateTotalAmount" />
</div> </div>
@@ -589,7 +594,7 @@ const updateTotalAmount = () => {
<Button v-if="alert.onCancel" @click="alert.onCancel">{{ alert.cancelText }}</Button> <Button v-if="alert.onCancel" @click="alert.onCancel">{{ alert.cancelText }}</Button>
<Button variant="destructive" v-if="alert.onConfirm" @click="alert.onConfirm">{{ <Button variant="destructive" v-if="alert.onConfirm" @click="alert.onConfirm">{{
alert.confirmText alert.confirmText
}}</Button> }}</Button>
</AlertDialogFooter> </AlertDialogFooter>
</AlertDialogContent> </AlertDialogContent>
</AlertDialog> </AlertDialog>