import { Head, useForm, Link } from '@inertiajs/react'; import type { Product, ProductPrice } from '@/types'; import { Category } from '@/types/category'; import { Card, CardContent } from '@/components/ui/card'; import { Button } from '@/components/ui/button'; import { Field, FieldGroup } from "@/components/ui/field" import { Input } from "@/components/ui/input" import { Label } from "@/components/ui/label" import { toast } from 'sonner'; import productRoutes from '@/routes/product'; import React from 'react'; import { SimpleEditor } from '@/components/tiptap-templates/simple/simple-editor'; import { Combobox, ComboboxContent, ComboboxEmpty, ComboboxItem, ComboboxList, ComboboxChips, ComboboxChip, ComboboxChipsInput, ComboboxValue, useComboboxAnchor, } from "@/components/ui/combobox" import { NumericFormat } from 'react-number-format'; export default function ProductEdit({ product, categories }: { product: Product, categories: Category[] }) { const getPrice = (type: string) => { const priceObj = product.prices?.find((p: ProductPrice) => p.price_type === type); return priceObj ? priceObj.price.toString() : ''; }; const initialCategoryIds = product.categories?.map(c => c.id) || []; const { data, setData, patch, processing, errors } = useForm({ name: product.name || '', description: product.description || '', category_ids: initialCategoryIds, prices: { purchase: getPrice('purchase'), distributor: getPrice('distributor'), agent: getPrice('agent'), reseller: getPrice('reseller'), retail: getPrice('retail'), } }); const anchor = useComboboxAnchor() const onSubmit = (e: React.FormEvent) => { e.preventDefault(); patch(productRoutes.update(product.id).url, { onSuccess: (response: any) => { toast.success(response.props.flash.success); }, }); }; const filteredCategories = categories.filter((c) => !data.category_ids.includes(c.id)) return (

Ubah Produk

Nama setData('name', e.target.value)} autoComplete='off' placeholder='Contoh: Gamis Wanita' maxLength={100} /> {errors.name &&

{errors.name}

}

Kategori data.category_ids.includes(c.id))} onValueChange={(selected) => { setData( "category_ids", selected.map((item: Category) => item.id) ) }} > {(values: Category[]) => ( <> {values.map((value) => ( {value.title} ))} )} Data tidak ditemukan. {(item: Category) => ( {item.title} )} {errors.category_ids &&

{errors.category_ids}

} Harga Beli { setData('prices', { ...data.prices, purchase: values.value }) }} placeholder="Rp 0" /> {errors['prices.purchase'] &&

{errors['prices.purchase']}

} Harga Distributor { setData('prices', { ...data.prices, distributor: values.value }) }} placeholder="Rp 0" /> {errors['prices.distributor'] &&

{errors['prices.distributor']}

} Harga Agen { setData('prices', { ...data.prices, agent: values.value }) }} placeholder="Rp 0" /> {errors['prices.agent'] &&

{errors['prices.agent']}

} Harga Reseller { setData('prices', { ...data.prices, reseller: values.value }) }} placeholder="Rp 0" /> {errors['prices.reseller'] &&

{errors['prices.reseller']}

} Harga Retail { setData('prices', { ...data.prices, retail: values.value }) }} placeholder="Rp 0" /> {errors['prices.retail'] &&

{errors['prices.retail']}

}

Deskripsi setData('description', val)} /> {errors.description &&

{errors.description}

}

); } ProductEdit.layout = { breadcrumbs: [ { title: 'Master', }, ], };