This commit is contained in:
David Arranz 2024-08-29 13:30:05 +02:00
parent abc182b575
commit 78684303df
3 changed files with 36 additions and 17 deletions

View File

@ -39,6 +39,8 @@ import { AppendEmptyRowButton } from "./AppendEmptyRowButton";
import { QuoteItemsSortableDataTableToolbar } from "./QuoteItemsSortableDataTableToolbar";
import { QuoteItemsSortableTableRow } from "./QuoteItemsSortableTableRow";
export type RowIdData = { [x: string]: any };
declare module "@tanstack/react-table" {
interface TableMeta<TData extends RowData> {
insertItem: (rowIndex: number, data?: unknown) => void;
@ -46,7 +48,12 @@ declare module "@tanstack/react-table" {
pickCatalogArticle: () => void;
duplicateItems: (rowIndex?: number) => void;
deleteItems: (rowIndex?: number | number[]) => void;
updateItem: (rowIndex: number, rowData: TData, fieldName: string, value: unknown) => void;
updateItem: (
rowIndex: number,
rowData: TData & RowIdData,
fieldName: string,
value: unknown
) => void;
}
}
@ -54,12 +61,17 @@ export interface QuoteItemsSortableProps {
id: UniqueIdentifier;
}
export type QuoteItemsSortableDataTableProps = {
columns: ColumnDef<unknown, unknown>[];
data: Record<"id", string>[];
export type QuoteItemsSortableDataTableProps<
TData extends RowData & RowIdData,
TValue = unknown
> = {
columns: ColumnDef<TData, TValue>[];
data: TData[];
defaultValues: Readonly<{ [x: string]: any }> | undefined;
initialState?: InitialTableState;
actions: Omit<UseFieldArrayReturn<FieldValues, "items">, "fields"> & Record<string, unknown>;
actions: Omit<UseFieldArrayReturn<FieldValues, "items">, "fields"> & {
pickCatalogArticle: () => void;
};
};
const measuringConfig = {
@ -91,13 +103,13 @@ const dropAnimationConfig: DropAnimation = {
},
};
export function QuoteItemsSortableDataTable({
export function QuoteItemsSortableDataTable<TData extends RowData & RowIdData, TValue = unknown>({
columns,
data,
defaultValues,
initialState,
actions,
}: QuoteItemsSortableDataTableProps) {
}: QuoteItemsSortableDataTableProps<TData, TValue>) {
const [rowSelection, setRowSelection] = useState<RowSelectionState>({});
const [activeId, setActiveId] = useState<UniqueIdentifier | null>();
@ -108,13 +120,14 @@ export function QuoteItemsSortableDataTable({
const sorteableRowIds = useMemo(() => data.map((item) => item.id), [data]);
const table = useReactTable({
const table = useReactTable<TData>({
data,
columns,
enableColumnResizing: false,
columnResizeMode: "onChange",
//defaultColumn,
autoResetAll: false, // <-- añadido nuevo
initialState,
state: {
rowSelection,
@ -127,7 +140,7 @@ export function QuoteItemsSortableDataTable({
onRowSelectionChange: setRowSelection,
getCoreRowModel: getCoreRowModel(),
getRowId: (originalRow: unknown) => originalRow?.id,
getRowId: (originalRow) => originalRow?.id,
debugTable: false,
debugHeaders: false,

View File

@ -5,7 +5,7 @@ import { CopyPlusIcon, ScanIcon, Trash2Icon } from "lucide-react";
import { AppendCatalogArticleRowButton } from "./AppendCatalogArticleRowButton";
import { AppendEmptyRowButton } from "./AppendEmptyRowButton";
export const QuoteItemsSortableDataTableToolbar = ({ table }: { table: Table<unknown> }) => {
export const QuoteItemsSortableDataTableToolbar = ({ table }: { table: Table<any> }) => {
const selectedRowsCount = table.getSelectedRowModel().rows.length;
if (selectedRowsCount) {

View File

@ -6,13 +6,17 @@ import {
LoadingOverlay,
SubmitButton,
} from "@/components";
import { calculateQuoteItemTotals, calculateQuoteTotals } from "@/lib/calc";
import { useUnsavedChangesNotifier } from "@/lib/hooks";
import { useUrlId } from "@/lib/hooks/useUrlId";
import { Button, Form, Tabs, TabsContent, TabsList, TabsTrigger } from "@/ui";
import { CurrencyData, IGetQuote_Response_DTO, Language } from "@shared/contexts";
import {
CurrencyData,
IGetQuote_QuoteItem_Response_DTO,
IGetQuote_Response_DTO,
Language,
} from "@shared/contexts";
import { t } from "i18next";
import { useEffect, useMemo, useState } from "react";
import { useMemo, useState } from "react";
import { useForm } from "react-hook-form";
import { useNavigate } from "react-router-dom";
import { toast } from "react-toastify";
@ -20,7 +24,8 @@ import { QuotePricesResume } from "./components";
import { QuoteDetailsCardEditor, QuoteGeneralCardEditor } from "./components/editors";
import { useQuotes } from "./hooks";
type QuoteDataForm = IGetQuote_Response_DTO;
export type QuoteDataForm = IGetQuote_Response_DTO;
export type QuoteDataFormItem = IGetQuote_QuoteItem_Response_DTO;
// eslint-disable-next-line @typescript-eslint/no-unused-vars
export const QuoteEdit = () => {
@ -123,7 +128,7 @@ export const QuoteEdit = () => {
//shouldUnregister: true,
});
const { watch, getValues, setValue, reset, handleSubmit, formState } = form;
const { getValues, reset, handleSubmit, formState } = form;
const { isSubmitting, isDirty } = formState;
useUnsavedChangesNotifier({
@ -152,9 +157,10 @@ export const QuoteEdit = () => {
});
};
useEffect(() => {
/*useEffect(() => {
// eslint-disable-next-line @typescript-eslint/no-unused-vars
const { unsubscribe } = watch((_, { name, type }) => {
console.log("useEffect");
const quote = getValues();
if (name) {
@ -228,7 +234,7 @@ export const QuoteEdit = () => {
}
});
return () => unsubscribe();
}, [watch, getValues, setValue]);
}, [watch, getValues, setValue]);*/
if (isSubmitting || isPending) {
return <LoadingOverlay title='Guardando cotización' />;