Some work on customers view #3

This commit is contained in:
2025-11-04 13:51:31 +01:00
parent 3c2d35f458
commit 82e04acc2c
13 changed files with 154 additions and 51 deletions
+2 -2
View File
@@ -86,13 +86,13 @@ const footerNavItems: NavItem[] = [
<Sidebar collapsible="icon" variant="inset">
<SidebarHeader>
<Link :href="dashboard()" class="flex row items-center">
<Link :href="dashboard()" class="flex row items-center mt-6">
<AppLogo />
</Link>
<TooltipProvider>
<Tooltip>
<TooltipTrigger class="w-fit absolute right-3 group-data-[collapsible=icon]:right-5">
<TooltipTrigger class="w-fit absolute top-11 right-3 group-data-[collapsible=icon]:right-5">
<SidebarTrigger class="hidden md:flex text-primary-foreground" />
</TooltipTrigger>
<TooltipContent>
+11 -3
View File
@@ -34,12 +34,12 @@ watch(() => props.customerData as Customer,
isDirty.value = false
isLoading.value = true
console.log("customerData", "Dirty: " + isDirty.value, "loading: " + isLoading.value)
// console.log("customerData", "Dirty: " + isDirty.value, "loading: " + isLoading.value)
}
)
watch(customer, (newValue) => {
console.log(newValue)
// console.log(newValue)
})
const saveChanges = () => {
@@ -101,7 +101,7 @@ const cancelChanges = (event: Event | null) => {
<div class="overflow-y-auto px-6">
<div id="document-header"
<div
class="block sticky top-0 py-4 bg-slate-100 bg-white dark:bg-neutral-800 z-1 flex items-end gap-12">
<div class="grow">
<DialogTitle class="text-xl text-primary-foreground font-bold">Edit profile</DialogTitle>
@@ -110,6 +110,14 @@ const cancelChanges = (event: Event | null) => {
</DialogDescription>
</div>
</div>
<div class="flex-none md:flex gap-12 mt-6 2 p-6 bg-slate-100 dark:bg-neutral-900 rounded-lg">
Customer Form hier
</div>
<div class="px-4 mt-6">
Contacts hier
</div>
</div>
<DialogFooter></DialogFooter>
@@ -84,8 +84,10 @@ watch(invoice,
(newValue, oldValue) => {
if (isLoading.value) {
if (!invoice.value) return;
// Initial load of invoice data
if (invoice.value && !invoice.value.billingData) {
if (!invoice.value.billingData) {
// Set default billing data from customer
invoice.value.billingData = {
companyName: invoice.value.customer?.companyName || "",
@@ -104,7 +106,7 @@ watch(invoice,
}
}
if (invoice.value && invoice.value.customer?.id !== 0) {
if (invoice.value.customer?.id !== 0) {
importCustomer.value = invoice.value.customer as Customer
// console.log("billingData contact", invoice.value?.billingData?.contactFirstName, invoice.value?.billingData?.contactLastName)
@@ -120,7 +122,6 @@ watch(invoice,
}
value.value = fromDate(new Date(invoice.value.invoiceDate), getLocalTimeZone())
}
else {
isDirty.value = true
@@ -133,7 +133,7 @@ const recalculatePositions = () => {
<!-- Preis -->
<TableCell class="w-1/8 text-right tabular-nums">
<NumberInput :modelValue="Number(element.price)"
<NumberInput v-model="element.price"
class="bg-transparent p-1 h-7! dark:bg-transparent hover:bg-background/66 dark:hover:bg-background/66 rounded shadow-none!" />
</TableCell>
@@ -28,7 +28,7 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits)
v-bind="forwarded"
:class="
cn(
'fixed left-1/2 top-1/2 z-50 grid w-full max-w-lg -translate-x-1/2 -translate-y-1/2 gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-bottom-[5%] data-[state=open]:slide-in-from-bottom-[5%] sm:rounded-lg',
'fixed left-1/2 top-1/2 z-50 grid max-w-lg -translate-x-1/2 -translate-y-1/2 gap-8 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-bottom-[5%] data-[state=open]:slide-in-from-bottom-[5%] sm:rounded-lg',
props.class,
)
"
@@ -56,7 +56,7 @@ export default defineComponent({
<template>
<div class="flex items-center gap-2">
<vue-number class="file:text-foreground placeholder:text-muted-foreground dark:bg-input/30 border-input flex h-9 min-w-4 rounded-md bg-input px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive tabular-nums h-6 py-0 px-1 m-0 bg-transparent border-none dark:bg-transparent hover:border-1
<vue-number class="file:text-foreground border-input flex min-w-4 rounded-lg text-base transition-[color,box-shadow] outline-none disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive tabular-nums h-6 py-0 px-1 m-0 bg-transparent border-none dark:bg-transparent hover:border-1
dark:hover:border-1 placeholder:text-muted-foreground/30 shadow-none w-28 text-right" v-model="value"
v-bind="number" />
</div>