TIMOR-TELECOM/revenue-fe
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update field agent to optional on Provider

Browse Source
This commit is contained in:
Wikzyy
2025-04-10 11:09:33 +07:00
parent ebd11d082e
commit 07dfcf6074
2 changed files with 145 additions and 102 deletions
Download Patch File Download Diff File Expand all files Collapse all files

122
src/pages/master/provider/blocks/EditDialog.tsx
View File

@ -51,7 +51,17 @@ const EditDialog = () => {
show: false,
message: ''
});
const initialState = {
const initialState: {
name: string;
description: string;
type: string;
status: string;
transaction_type: string;
agent: string;
updated_by: string;
updated_at: string;
} = {
name: '',
description: '',
type: '',
@ -61,6 +71,7 @@ const EditDialog = () => {
updated_by: '',
updated_at: ''
};
const [formField, setFormField] = useState(initialState);
const [transactions, setTransactions] = useState<TransactionProps[]>([]);
const [customers, setCustomers] = useState<CustomerProps[]>([]);
@ -257,7 +268,7 @@ const EditDialog = () => {
<SelectValue placeholder="Select Type" />
</SelectTrigger>
<SelectContent>
<SelectItem value="h2h">H2H</SelectItem>
<SelectItem value="h2h">Host to Host</SelectItem>
<SelectItem value="agent">Agent</SelectItem>
</SelectContent>
</Select>
@ -309,56 +320,67 @@ const EditDialog = () => {
</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">
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"
style={{ color: 'inherit' }}
>
{customers.find((customer) => customer.id === formField.agent)
?.fullname || 'Select Agent'}
</button>
</PopoverTrigger>
<PopoverContent className="w-[400px] p-0">
<Command>
<CommandInput placeholder="Search Agent..." />
<CommandList
className="max-h-[300px] overflow-y-auto"
style={{ touchAction: 'pan-y' }}
onWheel={(e) => {
e.currentTarget.scrollTop += e.deltaY;
}}
{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">
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"
style={{ color: 'inherit' }}
>
<CommandEmpty>No Agent found.</CommandEmpty>
<CommandGroup>
{customers.map((customer) => (
<CommandItem
key={customer.id}
value={customer.username}
onSelect={() => {
setFormField({
...formField,
agent: customer.id
});
setOpen(false);
}}
>
{customer.fullname}
</CommandItem>
))}
</CommandGroup>
</CommandList>
</Command>
</PopoverContent>
</Popover>
{customers.find((customer) => customer.id === formField.agent)
?.username || 'Select Agent'}
</button>
</PopoverTrigger>
<PopoverContent className="w-[400px] p-0">
<Command>
<CommandInput placeholder="Search Agent..." />
<CommandList
className="max-h-[300px] overflow-y-auto"
style={{ touchAction: 'pan-y' }}
onWheel={(e) => {
e.currentTarget.scrollTop += e.deltaY;
}}
>
<CommandEmpty>No Agent found.</CommandEmpty>
<CommandGroup>
{customers.map((customer) => (
<CommandItem
key={customer.id}
value={customer.username}
onSelect={() => {
setFormField({
...formField,
agent: customer.id
});
setOpen(false);
}}
>
{customer.username}
</CommandItem>
))}
</CommandGroup>
</CommandList>
</Command>
</PopoverContent>
</Popover>
</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">
Agent Name<span className="text-red-500">*</span>
</label>
<Input type="text" placeholder="Type Agent Only" readOnly />
</div>
</div>
)}
<div className="flex justify-end">
<Button variant="default">Save Changes</Button>