update: add field transaction_type on products and remove on provider
This commit is contained in:
Wikzyy
@ -22,7 +22,7 @@ import {
|
||||
SelectTrigger,
|
||||
SelectValue
|
||||
} from '@/components/ui/select';
|
||||
import { CustomerProps, TransactionProps } from './AddDialog';
|
||||
import { CustomerProps } from './AddDialog';
|
||||
import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
|
||||
import {
|
||||
Command,
|
||||
@ -37,7 +37,6 @@ import { RefreshCw } from 'lucide-react';
|
||||
|
||||
const API_URL_CUSTOMER = apiConfig.service_customer;
|
||||
const API_URL_MASTERDATA = apiConfig.service_master_data;
|
||||
const API_URL_TRANSACTION = apiConfig.service_transaction;
|
||||
|
||||
const EditDialog = () => {
|
||||
const { showEditDialog, handleEditDialog, selectedProvider, provider } =
|
||||
@ -59,8 +58,7 @@ const EditDialog = () => {
|
||||
{ key: 'name', label: 'Name' },
|
||||
{ key: 'description', label: 'Description' },
|
||||
{ key: 'type', label: 'Type' },
|
||||
{ key: 'status', label: 'Status' },
|
||||
{ key: 'transaction_type', label: 'Transaction Type' }
|
||||
{ key: 'status', label: 'Status' }
|
||||
];
|
||||
const newErrors: Record<string, string> = {};
|
||||
let isValid = true;
|
||||
@ -83,7 +81,6 @@ const EditDialog = () => {
|
||||
description: string;
|
||||
type: string;
|
||||
status: string;
|
||||
transaction_type: string;
|
||||
agent: string | null;
|
||||
updated_by: string;
|
||||
updated_at: string;
|
||||
@ -92,14 +89,12 @@ const EditDialog = () => {
|
||||
description: '',
|
||||
type: '',
|
||||
status: '',
|
||||
transaction_type: '',
|
||||
agent: null,
|
||||
updated_by: '',
|
||||
updated_at: ''
|
||||
};
|
||||
|
||||
const [formField, setFormField] = useState(initialState);
|
||||
const [transactions, setTransactions] = useState<TransactionProps[]>([]);
|
||||
const [customers, setCustomers] = useState<CustomerProps[]>([]);
|
||||
const [isSubmitting, setIsSubmitting] = useState(false);
|
||||
|
||||
@ -162,23 +157,6 @@ const EditDialog = () => {
|
||||
}
|
||||
};
|
||||
|
||||
const getTransactionTypeList = async (sorting: any) => {
|
||||
try {
|
||||
const response = await GetData(`${API_URL_TRANSACTION}/transactiontype/list`, {
|
||||
limit: 100,
|
||||
page: 1,
|
||||
with_deleted: false,
|
||||
order_field: sorting[0].id,
|
||||
order_direction: sorting[0].desc == false ? 'ASC' : 'DESC'
|
||||
});
|
||||
|
||||
// console.log('TRANSACTION TYPE: ', response?.data);
|
||||
setTransactions(response?.data.list);
|
||||
} catch (error) {
|
||||
console.error('Error fetching transaction type', error);
|
||||
}
|
||||
};
|
||||
|
||||
const doFetchData = useCallback(async (id: string) => {
|
||||
setIsLoading(true);
|
||||
const minDelay = new Promise((resolve) => setTimeout(resolve, 300));
|
||||
@ -234,9 +212,10 @@ const EditDialog = () => {
|
||||
}, [formattedTime]);
|
||||
|
||||
useEffect(() => {
|
||||
getCustomerList([{ id: 'id', desc: false }]);
|
||||
getTransactionTypeList([{ id: 'name', desc: false }]);
|
||||
}, []);
|
||||
if (showEditDialog) {
|
||||
getCustomerList([{ id: 'id', desc: false }]);
|
||||
}
|
||||
}, [showEditDialog]);
|
||||
|
||||
return (
|
||||
<Dialog open={showEditDialog} onOpenChange={(open) => handleEditDialog(open, null)}>
|
||||
@ -255,12 +234,12 @@ const EditDialog = () => {
|
||||
|
||||
{isLoading ? (
|
||||
<div className="flex flex-col items-center justify-center p-8">
|
||||
<div className="animate-pulse flex space-x-4 w-full">
|
||||
<div className="flex-1 space-y-4 py-1">
|
||||
<div className="h-4 bg-gray-200 rounded w-3/4"></div>
|
||||
<div className="flex w-full space-x-4 animate-pulse">
|
||||
<div className="flex-1 py-1 space-y-4">
|
||||
<div className="w-3/4 h-4 bg-gray-200 rounded"></div>
|
||||
<div className="space-y-2">
|
||||
<div className="h-4 bg-gray-200 rounded"></div>
|
||||
<div className="h-4 bg-gray-200 rounded w-5/6"></div>
|
||||
<div className="w-5/6 h-4 bg-gray-200 rounded"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -268,13 +247,13 @@ const EditDialog = () => {
|
||||
</div>
|
||||
) : (
|
||||
<form onSubmit={handleUpdate}>
|
||||
<div className="card-body grid gap-5">
|
||||
<div className="grid gap-5 card-body">
|
||||
<div className="w-full">
|
||||
<div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
|
||||
<label className="form-label flex items-center gap-1 max-w-56">
|
||||
<label className="flex items-center gap-1 form-label max-w-56">
|
||||
Name<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<div className="grow flex flex-col">
|
||||
<div className="flex flex-col grow">
|
||||
<Input
|
||||
className={`input ${errors.name ? 'border-red-500' : ''}`}
|
||||
type="text"
|
||||
@ -285,7 +264,7 @@ const EditDialog = () => {
|
||||
}}
|
||||
/>
|
||||
{errors.name && (
|
||||
<span className="text-red-500 text-xs mt-1">{errors.name}</span>
|
||||
<span className="mt-1 text-xs text-red-500">{errors.name}</span>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
@ -294,10 +273,10 @@ const EditDialog = () => {
|
||||
{/* Description */}
|
||||
<div className="w-full">
|
||||
<div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
|
||||
<label className="form-label flex items-center gap-1 max-w-56">
|
||||
<label className="flex items-center gap-1 form-label max-w-56">
|
||||
Description<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<div className="grow flex flex-col">
|
||||
<div className="flex flex-col grow">
|
||||
<Input
|
||||
className={`input ${errors.description ? 'border-red-500' : ''}`}
|
||||
type="text"
|
||||
@ -308,7 +287,7 @@ const EditDialog = () => {
|
||||
}}
|
||||
/>
|
||||
{errors.description && (
|
||||
<span className="text-red-500 text-xs mt-1">{errors.description}</span>
|
||||
<span className="mt-1 text-xs text-red-500">{errors.description}</span>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
@ -316,10 +295,10 @@ const EditDialog = () => {
|
||||
|
||||
<div className="w-full">
|
||||
<div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
|
||||
<label className="form-label flex items-center gap-1 max-w-56">
|
||||
<label className="flex items-center gap-1 form-label max-w-56">
|
||||
Type<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<div className="grow flex flex-col">
|
||||
<div className="flex flex-col grow">
|
||||
<Select
|
||||
value={formField.type}
|
||||
onValueChange={(value) => {
|
||||
@ -336,7 +315,7 @@ const EditDialog = () => {
|
||||
</SelectContent>
|
||||
</Select>
|
||||
{errors.type && (
|
||||
<span className="text-red-500 text-xs mt-1">{errors.type}</span>
|
||||
<span className="mt-1 text-xs text-red-500">{errors.type}</span>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
@ -344,10 +323,10 @@ const EditDialog = () => {
|
||||
|
||||
<div className="w-full">
|
||||
<div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
|
||||
<label className="form-label flex items-center gap-1 max-w-56">
|
||||
<label className="flex items-center gap-1 form-label max-w-56">
|
||||
Status<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<div className="grow flex flex-col">
|
||||
<div className="flex flex-col grow">
|
||||
<Select
|
||||
value={formField.status}
|
||||
onValueChange={(value) => {
|
||||
@ -366,42 +345,7 @@ const EditDialog = () => {
|
||||
</SelectContent>
|
||||
</Select>
|
||||
{errors.status && (
|
||||
<span className="text-red-500 text-xs mt-1">{errors.status}</span>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full">
|
||||
<div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
|
||||
<label className="form-label flex items-center gap-1 max-w-56">
|
||||
Transaction Type<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<div className="grow flex flex-col">
|
||||
<Select
|
||||
value={formField.transaction_type}
|
||||
onValueChange={(value) => {
|
||||
setFormField({ ...formField, status: value });
|
||||
setErrors((prev) => ({ ...prev, status: '' }));
|
||||
}}
|
||||
>
|
||||
<SelectTrigger
|
||||
className={`input ${errors.transaction_type ? 'border-red-500' : ''}`}
|
||||
>
|
||||
<SelectValue placeholder="Select Transaction Type" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{transactions.map((transaction) => (
|
||||
<SelectItem key={transaction.id} value={transaction.id}>
|
||||
{transaction.name}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
{errors.transaction_type && (
|
||||
<span className="text-red-500 text-xs mt-1">
|
||||
{errors.transaction_type}
|
||||
</span>
|
||||
<span className="mt-1 text-xs text-red-500">{errors.status}</span>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
@ -410,14 +354,14 @@ const EditDialog = () => {
|
||||
{formField.type === 'agent' ? (
|
||||
<div className="w-full">
|
||||
<div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
|
||||
<label className="form-label flex items-center gap-1 max-w-56">
|
||||
<label className="flex items-center gap-1 form-label max-w-56">
|
||||
Agent Name<span className="text-red-500">*</span>
|
||||
</label>
|
||||
<Popover open={open} onOpenChange={setOpen}>
|
||||
<PopoverTrigger asChild>
|
||||
<button
|
||||
type="button"
|
||||
className="input col-span-5 text-left"
|
||||
className="col-span-5 text-left input"
|
||||
style={{ color: 'inherit' }}
|
||||
>
|
||||
{customers.find((customer) => customer.id === formField.agent)
|
||||
@ -461,7 +405,7 @@ const EditDialog = () => {
|
||||
) : (
|
||||
<div className="w-full">
|
||||
<div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
|
||||
<label className="form-label flex items-center gap-1 max-w-56">
|
||||
<label className="flex items-center gap-1 form-label max-w-56">
|
||||
Agent Name
|
||||
</label>
|
||||
<Input
|
||||
@ -477,7 +421,7 @@ const EditDialog = () => {
|
||||
<div className="flex justify-end">
|
||||
<Button variant="default" type="submit" disabled={isSubmitting}>
|
||||
{isSubmitting ? (
|
||||
<RefreshCw className="animate-spin h-8 w-8 text-white mx-3" />
|
||||
<RefreshCw className="w-8 h-8 mx-3 text-white animate-spin" />
|
||||
) : (
|
||||
'Save Changes'
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user