legalgonews/legalgo-FE-reactrouter
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: enhance layout and button functionality in subscriptions page

Browse Source
This commit is contained in:
Ardeman 2025-03-04 09:53:13 +08:00
parent 6d8e352ffc
commit dc794a29d3
1 changed files with 87 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

159
app/pages/dashboard-subscriptions/index.tsx
View File

@ -52,44 +52,50 @@ export const SubscriptionsPage = () => {
return (
<div className="relative">
<TitleDashboard title="Subscription" />
<Button
className="float-right mt-7 h-10 w-[160px] rounded-md"
onClick={switchView}
>
{SubscribtionOpen ? 'Subscriptions' : 'Save'}
</Button>
{SubscribtionOpen && (
<>
<div className="mb-8 flex items-center gap-5 rounded-lg bg-gray-50 text-[#363636]">
<div className="w-[400px]">
<Field>
<Label className="mb-2 block text-sm font-medium">
Cari User
</Label>
<div className="relative">
<Input
type="text"
placeholder="Cari Nama"
className="w-full rounded-lg bg-white p-2 pr-10 pl-4 shadow focus:ring-1 focus:ring-[#2E2F7C] focus:outline-none"
/>
<div className="absolute inset-y-0 right-0 flex items-center pr-3">
<SearchIcon className="h-5 w-5" />
<div className="mb-8 flex items-end justify-between">
<div className="flex items-center gap-5 rounded-lg bg-gray-50 text-[#363636]">
<div className="w-[400px]">
<Field>
<Label className="mb-2 block text-sm font-medium">
Cari User
</Label>
<div className="relative">
<Input
type="text"
placeholder="Cari Nama"
className="w-full rounded-lg bg-white p-2 pr-10 pl-4 shadow focus:ring-1 focus:ring-[#2E2F7C] focus:outline-none"
/>
<div className="absolute inset-y-0 right-0 flex items-center pr-3">
<SearchIcon className="h-5 w-5" />
</div>
</div>
</div>
</Field>
</Field>
</div>
<div className="w-[235px]">
<Field>
<Label className="mb-2 block text-sm font-medium">
Status
</Label>
<Select className="w-full rounded-lg bg-white p-2 shadow focus:ring-1 focus:ring-[#2E2F7C] focus:outline-none">
<option>Pilih Status</option>
<option>Aktif</option>
<option>Nonaktif</option>
</Select>
</Field>
</div>
</div>
<div className="w-[235px]">
<Field>
<Label className="mb-2 block text-sm font-medium">Status</Label>
<Select className="w-full rounded-lg bg-white p-2 shadow focus:ring-1 focus:ring-[#2E2F7C] focus:outline-none">
<option>Pilih Status</option>
<option>Aktif</option>
<option>Nonaktif</option>
</Select>
</Field>
</div>
<Button
className="rounded-md"
size="lg"
onClick={switchView}
>
Subscription Settings
</Button>
</div>
<UiTable
@ -108,48 +114,57 @@ export const SubscriptionsPage = () => {
{!SubscribtionOpen && (
<>
<div className="mb-8 flex items-end gap-5 rounded-lg bg-gray-50 text-[#363636]">
<div className="w-[300px]">
<Field>
<Label className="mb-2 block text-sm font-medium">
Subscription Name
</Label>
<div className="relative">
<Input
type="text"
placeholder="Subscription Name"
className="w-full rounded-lg bg-white p-2 pr-10 pl-4 shadow focus:ring-1 focus:ring-[#2E2F7C] focus:outline-none"
/>
</div>
</Field>
</div>
<div className="w-[300px]">
<Field>
<Label className="mb-2 block text-sm font-medium">
Subscription Price
</Label>
<div className="relative">
<Input
type="text"
placeholder="Subscription Price"
className="w-full rounded-lg bg-white p-2 pr-10 pl-4 shadow focus:ring-1 focus:ring-[#2E2F7C] focus:outline-none"
/>
</div>
</Field>
</div>
<div className="mb-8 flex items-end justify-between">
<div className="flex items-end gap-5 rounded-lg bg-gray-50 text-[#363636]">
<div className="w-[300px]">
<Field>
<Label className="mb-2 block text-sm font-medium">
Subscription Name
</Label>
<div className="relative">
<Input
type="text"
placeholder="Subscription Name"
className="w-full rounded-lg bg-white p-2 pr-10 pl-4 shadow focus:ring-1 focus:ring-[#2E2F7C] focus:outline-none"
/>
</div>
</Field>
</div>
<div className="w-[300px]">
<Field>
<Label className="mb-2 block text-sm font-medium">
Subscription Price
</Label>
<div className="relative">
<Input
type="text"
placeholder="Subscription Price"
className="w-full rounded-lg bg-white p-2 pr-10 pl-4 shadow focus:ring-1 focus:ring-[#2E2F7C] focus:outline-none"
/>
</div>
</Field>
</div>
<div className="w-[300px]">
<Field>
<Label className="mb-2 block text-sm font-medium">
Subscription Length (Days)
</Label>
<Input
type="text"
placeholder="Subscription Length (Days)"
className="w-full rounded-lg bg-white p-2 shadow focus:ring-1 focus:ring-[#2E2F7C] focus:outline-none"
></Input>
</Field>
<div className="w-[300px]">
<Field>
<Label className="mb-2 block text-sm font-medium">
Subscription Length (Days)
</Label>
<Input
type="text"
placeholder="Subscription Length (Days)"
className="w-full rounded-lg bg-white p-2 shadow focus:ring-1 focus:ring-[#2E2F7C] focus:outline-none"
></Input>
</Field>
</div>
</div>
<Button
className="rounded-md"
size="lg"
onClick={switchView}
>
Save
</Button>
</div>
<UiTable