Fixed a regression, where the position column widths the line item table would get messed up of a section title was the first element

This commit is contained in:
2025-11-19 12:47:22 +01:00
parent 8e4bccf828
commit f264459435
@@ -11,7 +11,7 @@ import { Table, TableCell, TableFooter, TableHead, TableHeader, TableRow, } from
import { Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue, } from "@/components/ui/select"
import { NumberField, NumberFieldContent, NumberFieldDecrement, NumberFieldIncrement, NumberFieldInput, } from '@/components/ui/number-field'
import { Input } from '@/components/ui/input';
import { Loader2, GripVertical, Trash2, Plus, TextSelect } from 'lucide-vue-next';
import { Loader2, GripVertical, Trash2, Plus, TextSelect, BetweenHorizonalEnd } from 'lucide-vue-next';
import Button from '../ui/button/Button.vue';
import { Empty, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, } from '@/components/ui/empty'
import NumberInput from '../ui/number-input/NumberInput.vue';
@@ -105,6 +105,19 @@ const recalculatePositions = () => {
<Table :class="{ 'opacity-100!': !isLoading && items.length >= 1 }"
class="table-fixed transition-opacity opacity-0 duration-300">
<!-- Dummy header so a col spanning title section in first row
doesnt mess up col widths -->
<TableRow class="border-0">
<TableHead class="h-0 w-6 px-0"></TableHead>
<TableHead class="h-0 w-8 px-0 text-center"></TableHead>
<TableHead class="h-0 "></TableHead>
<TableHead class="h-0 w-1/8"></TableHead>
<TableHead class="h-0 w-20 text-center"></TableHead>
<TableHead class="h-0 w-1/8 text-right pr-5"></TableHead>
<TableHead class="h-0 w-1/8 text-right"></TableHead>
<TableHead class="h-0 w-8"></TableHead>
</TableRow>
<draggable v-model="items" tag="tbody" item-key="position" handle=".handle" ghostClass="ghost"
@end="recalculatePositions">
<template #item="{ element }">
@@ -127,7 +140,7 @@ const recalculatePositions = () => {
<TableCell class="w-8 text-right px-1">
<Button variant="ghost" size="sm" @click="deleteItem(element)"
class="has-[>svg]:px-1 text-muted-foreground hover:text-destructive">
<Trash2 :size="18" stroke-width="1.5"/>
<Trash2 :size="18" stroke-width="1.5" />
</Button>
</TableCell>
</TableRow>
@@ -196,8 +209,14 @@ const recalculatePositions = () => {
<TableCell class="w-8 text-right px-1">
<Button variant="ghost" size="sm" @click="deleteItem(element)"
class="has-[>svg]:px-1 text-muted-foreground hover:text-destructive">
<Trash2 :size="18" stroke-width="1.5"/>
<Trash2 stroke-width="1.5" />
</Button>
<!-- <Button variant="ghost" size="sm" @click=""
class="has-[>svg]:px-1 text-muted-foreground">
<BetweenHorizonalEnd stroke-width="1.5"/>
</Button> -->
</TableCell>
</TableRow>