Add asignación de planes y estado de suscripción
This commit is contained in:
16
mvp/b2c/src/app/admin/planes/actions.ts
Normal file
16
mvp/b2c/src/app/admin/planes/actions.ts
Normal file
@@ -0,0 +1,16 @@
|
||||
'use server';
|
||||
|
||||
import { revalidatePath } from 'next/cache';
|
||||
import { requireAdmin } from '@/lib/auth/current-user';
|
||||
import { assignPlan, setSubscriptionStatus } from '@/db/admin-queries';
|
||||
import { tenants } from '@/db/schema';
|
||||
|
||||
export async function asignarPlan(formData: FormData) {
|
||||
await requireAdmin();
|
||||
const tenantId = String(formData.get('tenantId'));
|
||||
const planId = String(formData.get('planId'));
|
||||
const status = String(formData.get('status')) as (typeof tenants.subscriptionStatus.enumValues)[number];
|
||||
await assignPlan(tenantId, planId);
|
||||
await setSubscriptionStatus(tenantId, status);
|
||||
revalidatePath('/admin/planes');
|
||||
}
|
||||
61
mvp/b2c/src/app/admin/planes/page.tsx
Normal file
61
mvp/b2c/src/app/admin/planes/page.tsx
Normal file
@@ -0,0 +1,61 @@
|
||||
import { listPlans, listTenants } from '@/db/admin-queries';
|
||||
import { asignarPlan } from './actions';
|
||||
import { formatEuros } from '@/lib/funnel';
|
||||
|
||||
export const dynamic = 'force-dynamic';
|
||||
|
||||
const ESTADOS = ['trial', 'activo', 'cancelado', 'vencido'] as const;
|
||||
|
||||
export default async function PlanesPage() {
|
||||
const [plans, tenants] = await Promise.all([listPlans(), listTenants()]);
|
||||
const nombrePlan = new Map(plans.map((p) => [p.id, p.nombre]));
|
||||
return (
|
||||
<div className="flex flex-col gap-8">
|
||||
<h1 className="text-2xl font-black tracking-tight text-black">Planes</h1>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||
{plans.map((p) => (
|
||||
<div key={p.id} className="bg-white border border-gray-200 rounded-xl p-5">
|
||||
<div className="flex items-baseline justify-between">
|
||||
<h2 className="font-bold text-black">{p.nombre}</h2>
|
||||
<span className="text-lg font-black text-black">{formatEuros(p.precioMensual)}/mes</span>
|
||||
</div>
|
||||
<ul className="mt-3 flex flex-col gap-1 text-xs text-gray-500">
|
||||
{p.features.map((f) => <li key={f}>· {f}</li>)}
|
||||
</ul>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
<div className="bg-white border border-gray-200 rounded-xl overflow-hidden">
|
||||
<table className="w-full text-sm">
|
||||
<thead><tr className="border-b border-gray-200 text-left text-xs uppercase tracking-wide text-gray-400">
|
||||
<th className="px-4 py-3">Reformista</th><th className="px-4 py-3">Plan actual</th>
|
||||
<th className="px-4 py-3">Estado</th><th className="px-4 py-3">Asignar</th>
|
||||
</tr></thead>
|
||||
<tbody>
|
||||
{tenants.map((t) => (
|
||||
<tr key={t.id} className="border-b border-gray-100 last:border-0">
|
||||
<td className="px-4 py-3 font-medium text-black">{t.nombreEmpresa}</td>
|
||||
<td className="px-4 py-3 text-gray-600">{t.planId ? nombrePlan.get(t.planId) ?? '—' : '—'}</td>
|
||||
<td className="px-4 py-3 text-gray-600">{t.subscriptionStatus}</td>
|
||||
<td className="px-4 py-3">
|
||||
<form action={asignarPlan} className="flex items-center gap-2">
|
||||
<input type="hidden" name="tenantId" value={t.id} />
|
||||
<select name="planId" defaultValue={t.planId ?? plans[0]?.id} className="border border-gray-300 rounded-md px-2 py-1 text-xs">
|
||||
{plans.map((p) => <option key={p.id} value={p.id}>{p.nombre}</option>)}
|
||||
</select>
|
||||
<select name="status" defaultValue={t.subscriptionStatus} className="border border-gray-300 rounded-md px-2 py-1 text-xs">
|
||||
{ESTADOS.map((e) => <option key={e} value={e}>{e}</option>)}
|
||||
</select>
|
||||
<button type="submit" className="bg-black text-white rounded-md px-3 py-1 text-xs font-semibold">Guardar</button>
|
||||
</form>
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user