feat: enhance layout and button functionality in subscriptions page

This commit is contained in:
Ardeman 2025-03-04 09:53:13 +08:00
parent 6d8e352ffc
commit dc794a29d3

View File

@ -52,16 +52,11 @@ export const SubscriptionsPage = () => {
return ( return (
<div className="relative"> <div className="relative">
<TitleDashboard title="Subscription" /> <TitleDashboard title="Subscription" />
<Button
className="float-right mt-7 h-10 w-[160px] rounded-md"
onClick={switchView}
>
{SubscribtionOpen ? 'Subscriptions' : 'Save'}
</Button>
{SubscribtionOpen && ( {SubscribtionOpen && (
<> <>
<div className="mb-8 flex items-center gap-5 rounded-lg bg-gray-50 text-[#363636]"> <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]"> <div className="w-[400px]">
<Field> <Field>
<Label className="mb-2 block text-sm font-medium"> <Label className="mb-2 block text-sm font-medium">
@ -82,7 +77,9 @@ export const SubscriptionsPage = () => {
<div className="w-[235px]"> <div className="w-[235px]">
<Field> <Field>
<Label className="mb-2 block text-sm font-medium">Status</Label> <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"> <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>Pilih Status</option>
<option>Aktif</option> <option>Aktif</option>
@ -92,6 +89,15 @@ export const SubscriptionsPage = () => {
</div> </div>
</div> </div>
<Button
className="rounded-md"
size="lg"
onClick={switchView}
>
Subscription Settings
</Button>
</div>
<UiTable <UiTable
data={SUBSCRIPTIONS} data={SUBSCRIPTIONS}
columns={colTableSubscription} columns={colTableSubscription}
@ -108,7 +114,8 @@ export const SubscriptionsPage = () => {
{!SubscribtionOpen && ( {!SubscribtionOpen && (
<> <>
<div className="mb-8 flex items-end gap-5 rounded-lg bg-gray-50 text-[#363636]"> <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]"> <div className="w-[300px]">
<Field> <Field>
<Label className="mb-2 block text-sm font-medium"> <Label className="mb-2 block text-sm font-medium">
@ -151,6 +158,14 @@ export const SubscriptionsPage = () => {
</Field> </Field>
</div> </div>
</div> </div>
<Button
className="rounded-md"
size="lg"
onClick={switchView}
>
Save
</Button>
</div>
<UiTable <UiTable
data={SUBSETTINGS} data={SUBSETTINGS}