feat: 優化中央後台 UI (用語調整、移除連結) 與實作 RWD 支援
This commit is contained in:
@@ -19,7 +19,7 @@ interface DashboardProps {
|
||||
export default function Dashboard({ totalTenants, activeTenants, recentTenants }: DashboardProps) {
|
||||
const statsCards = [
|
||||
{
|
||||
title: "租戶總數",
|
||||
title: "客戶總數",
|
||||
value: totalTenants,
|
||||
icon: Building2,
|
||||
color: "bg-blue-500",
|
||||
@@ -62,7 +62,7 @@ export default function Dashboard({ totalTenants, activeTenants, recentTenants }
|
||||
{/* Recent Tenants */}
|
||||
<div className="bg-white rounded-xl border border-slate-200 overflow-hidden">
|
||||
<div className="px-6 py-4 border-b border-slate-200 flex items-center justify-between">
|
||||
<h2 className="text-lg font-semibold text-slate-900">最近新增的租戶</h2>
|
||||
<h2 className="text-lg font-semibold text-slate-900">最近新增的客戶</h2>
|
||||
<Link
|
||||
href="/landlord/tenants"
|
||||
className="text-sm text-primary-main hover:underline"
|
||||
@@ -73,7 +73,7 @@ export default function Dashboard({ totalTenants, activeTenants, recentTenants }
|
||||
<div className="divide-y divide-slate-100">
|
||||
{recentTenants.length === 0 ? (
|
||||
<div className="px-6 py-8 text-center text-slate-500">
|
||||
尚無租戶資料
|
||||
尚無客戶資料
|
||||
</div>
|
||||
) : (
|
||||
recentTenants.map((tenant) => (
|
||||
@@ -87,8 +87,8 @@ export default function Dashboard({ totalTenants, activeTenants, recentTenants }
|
||||
<div className="flex items-center gap-3">
|
||||
<span
|
||||
className={`px-2 py-1 rounded-full text-xs font-medium ${tenant.is_active
|
||||
? "bg-green-100 text-green-700"
|
||||
: "bg-slate-100 text-slate-600"
|
||||
? "bg-green-100 text-green-700"
|
||||
: "bg-slate-100 text-slate-600"
|
||||
}`}
|
||||
>
|
||||
{tenant.is_active ? "啟用" : "停用"}
|
||||
|
||||
@@ -16,17 +16,17 @@ export default function TenantCreate() {
|
||||
};
|
||||
|
||||
return (
|
||||
<LandlordLayout title="新增租戶">
|
||||
<LandlordLayout title="新增客戶">
|
||||
<div className="max-w-2xl">
|
||||
<div className="mb-6">
|
||||
<h1 className="text-2xl font-bold text-slate-900">新增租戶</h1>
|
||||
<p className="text-slate-500 mt-1">建立一個新的租戶帳號</p>
|
||||
<h1 className="text-2xl font-bold text-slate-900">新增客戶</h1>
|
||||
<p className="text-slate-500 mt-1">建立一個新的客戶帳號</p>
|
||||
</div>
|
||||
|
||||
<form onSubmit={handleSubmit} className="bg-white rounded-xl border border-slate-200 p-6 space-y-6">
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-slate-700 mb-2">
|
||||
租戶 ID <span className="text-red-500">*</span>
|
||||
客戶 ID <span className="text-red-500">*</span>
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
@@ -41,7 +41,7 @@ export default function TenantCreate() {
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-slate-700 mb-2">
|
||||
租戶名稱 <span className="text-red-500">*</span>
|
||||
客戶名稱 <span className="text-red-500">*</span>
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
@@ -88,7 +88,7 @@ export default function TenantCreate() {
|
||||
disabled={processing}
|
||||
className="bg-primary-main hover:bg-primary-dark text-white px-6 py-2 rounded-lg disabled:opacity-50 transition-colors"
|
||||
>
|
||||
{processing ? "處理中..." : "建立租戶"}
|
||||
{processing ? "處理中..." : "建立客戶"}
|
||||
</button>
|
||||
<Link
|
||||
href="/landlord/tenants"
|
||||
|
||||
@@ -26,17 +26,17 @@ export default function TenantEdit({ tenant }: Props) {
|
||||
};
|
||||
|
||||
return (
|
||||
<LandlordLayout title="編輯租戶">
|
||||
<LandlordLayout title="編輯客戶">
|
||||
<div className="max-w-2xl">
|
||||
<div className="mb-6">
|
||||
<h1 className="text-2xl font-bold text-slate-900">編輯租戶</h1>
|
||||
<p className="text-slate-500 mt-1">修改租戶 {tenant.id} 的資訊</p>
|
||||
<h1 className="text-2xl font-bold text-slate-900">編輯客戶</h1>
|
||||
<p className="text-slate-500 mt-1">修改客戶 {tenant.id} 的資訊</p>
|
||||
</div>
|
||||
|
||||
<form onSubmit={handleSubmit} className="bg-white rounded-xl border border-slate-200 p-6 space-y-6">
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-slate-700 mb-2">
|
||||
租戶 ID
|
||||
客戶 ID
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
@@ -44,12 +44,12 @@ export default function TenantEdit({ tenant }: Props) {
|
||||
disabled
|
||||
className="w-full px-4 py-2 border border-slate-200 rounded-lg bg-slate-50 text-slate-500"
|
||||
/>
|
||||
<p className="mt-1 text-sm text-slate-500">租戶 ID 無法修改</p>
|
||||
<p className="mt-1 text-sm text-slate-500">客戶 ID 無法修改</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-slate-700 mb-2">
|
||||
租戶名稱 <span className="text-red-500">*</span>
|
||||
客戶名稱 <span className="text-red-500">*</span>
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
@@ -81,7 +81,7 @@ export default function TenantEdit({ tenant }: Props) {
|
||||
onChange={(e) => setData("is_active", e.target.checked)}
|
||||
className="w-4 h-4 rounded border-slate-300 text-primary-main focus:ring-primary-main"
|
||||
/>
|
||||
<span className="text-sm font-medium text-slate-700">啟用此租戶</span>
|
||||
<span className="text-sm font-medium text-slate-700">啟用此客戶</span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -37,20 +37,20 @@ export default function TenantIndex({ tenants }: Props) {
|
||||
};
|
||||
|
||||
return (
|
||||
<LandlordLayout title="租戶管理">
|
||||
<LandlordLayout title="客戶管理">
|
||||
<div className="space-y-6">
|
||||
{/* Header */}
|
||||
<div className="flex items-center justify-between">
|
||||
<div>
|
||||
<h1 className="text-2xl font-bold text-slate-900">租戶管理</h1>
|
||||
<p className="text-slate-500 mt-1">管理系統中的所有租戶</p>
|
||||
<h1 className="text-2xl font-bold text-slate-900">客戶管理</h1>
|
||||
<p className="text-slate-500 mt-1">管理系統中的所有客戶</p>
|
||||
</div>
|
||||
<Link
|
||||
href="/landlord/tenants/create"
|
||||
className="bg-primary-main hover:bg-primary-dark text-white px-4 py-2 rounded-lg flex items-center gap-2 transition-colors"
|
||||
>
|
||||
<Plus className="w-4 h-4" />
|
||||
新增租戶
|
||||
新增客戶
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
@@ -83,7 +83,7 @@ export default function TenantIndex({ tenants }: Props) {
|
||||
{tenants.length === 0 ? (
|
||||
<tr>
|
||||
<td colSpan={6} className="px-6 py-12 text-center text-slate-500">
|
||||
尚無租戶資料，請點擊「新增租戶」建立第一個租戶
|
||||
尚無客戶資料，請點擊「新增客戶」建立第一個客戶
|
||||
</td>
|
||||
</tr>
|
||||
) : (
|
||||
@@ -120,8 +120,8 @@ export default function TenantIndex({ tenants }: Props) {
|
||||
<td className="px-6 py-4">
|
||||
<span
|
||||
className={`px-2 py-1 rounded-full text-xs font-medium ${tenant.is_active
|
||||
? "bg-green-100 text-green-700"
|
||||
: "bg-slate-100 text-slate-600"
|
||||
? "bg-green-100 text-green-700"
|
||||
: "bg-slate-100 text-slate-600"
|
||||
}`}
|
||||
>
|
||||
{tenant.is_active ? "啟用" : "停用"}
|
||||
@@ -167,9 +167,9 @@ export default function TenantIndex({ tenants }: Props) {
|
||||
<AlertDialog open={!!deleteTarget} onOpenChange={() => setDeleteTarget(null)}>
|
||||
<AlertDialogContent>
|
||||
<AlertDialogHeader>
|
||||
<AlertDialogTitle>確定要刪除這個租戶嗎？</AlertDialogTitle>
|
||||
<AlertDialogTitle>確定要刪除這個客戶嗎？</AlertDialogTitle>
|
||||
<AlertDialogDescription>
|
||||
刪除租戶將會同時刪除其資料庫和所有資料，此操作無法復原。
|
||||
刪除客戶將會同時刪除其資料庫和所有資料，此操作無法復原。
|
||||
</AlertDialogDescription>
|
||||
</AlertDialogHeader>
|
||||
<AlertDialogFooter>
|
||||
|
||||
@@ -45,7 +45,7 @@ export default function TenantShow({ tenant }: Props) {
|
||||
};
|
||||
|
||||
return (
|
||||
<LandlordLayout title="租戶詳情">
|
||||
<LandlordLayout title="客戶詳情">
|
||||
<div className="max-w-3xl space-y-6">
|
||||
{/* Back Link */}
|
||||
<Link
|
||||
@@ -60,7 +60,7 @@ export default function TenantShow({ tenant }: Props) {
|
||||
<div className="flex items-start justify-between">
|
||||
<div>
|
||||
<h1 className="text-2xl font-bold text-slate-900">{tenant.name}</h1>
|
||||
<p className="text-slate-500 mt-1">租戶 ID: {tenant.id}</p>
|
||||
<p className="text-slate-500 mt-1">客戶 ID: {tenant.id}</p>
|
||||
</div>
|
||||
<Link
|
||||
href={`/landlord/tenants/${tenant.id}/edit`}
|
||||
@@ -79,8 +79,8 @@ export default function TenantShow({ tenant }: Props) {
|
||||
<dd className="mt-1">
|
||||
<span
|
||||
className={`px-2 py-1 rounded-full text-xs font-medium ${tenant.is_active
|
||||
? "bg-green-100 text-green-700"
|
||||
: "bg-slate-100 text-slate-600"
|
||||
? "bg-green-100 text-green-700"
|
||||
: "bg-slate-100 text-slate-600"
|
||||
}`}
|
||||
>
|
||||
{tenant.is_active ? "啟用" : "停用"}
|
||||
|
||||
Reference in New Issue
Block a user