feat: 實作 Multi-tenancy 多租戶架構 (stancl/tenancy)
- 安裝並設定 stancl/tenancy 套件 - 分離 Central / Tenant migrations - 建立 Tenant Model 與資料遷移指令 - 建立房東後台 CRUD (Landlord Dashboard) - 新增租戶管理頁面 (列表、新增、編輯、詳情) - 新增域名管理功能 - 更新部署手冊
This commit is contained in:
107
resources/js/Pages/Landlord/Tenant/Edit.tsx
Normal file
107
resources/js/Pages/Landlord/Tenant/Edit.tsx
Normal file
@@ -0,0 +1,107 @@
|
||||
import LandlordLayout from "@/Layouts/LandlordLayout";
|
||||
import { useForm, Link } from "@inertiajs/react";
|
||||
import { FormEvent } from "react";
|
||||
|
||||
interface Tenant {
|
||||
id: string;
|
||||
name: string;
|
||||
email: string | null;
|
||||
is_active: boolean;
|
||||
}
|
||||
|
||||
interface Props {
|
||||
tenant: Tenant;
|
||||
}
|
||||
|
||||
export default function TenantEdit({ tenant }: Props) {
|
||||
const { data, setData, put, processing, errors } = useForm({
|
||||
name: tenant.name,
|
||||
email: tenant.email || "",
|
||||
is_active: tenant.is_active,
|
||||
});
|
||||
|
||||
const handleSubmit = (e: FormEvent) => {
|
||||
e.preventDefault();
|
||||
put(route("landlord.tenants.update", tenant.id));
|
||||
};
|
||||
|
||||
return (
|
||||
<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>
|
||||
</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
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
value={tenant.id}
|
||||
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>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-slate-700 mb-2">
|
||||
租戶名稱 <span className="text-red-500">*</span>
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
value={data.name}
|
||||
onChange={(e) => setData("name", e.target.value)}
|
||||
className="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-main focus:border-primary-main"
|
||||
/>
|
||||
{errors.name && <p className="mt-1 text-sm text-red-500">{errors.name}</p>}
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-slate-700 mb-2">
|
||||
聯絡信箱
|
||||
</label>
|
||||
<input
|
||||
type="email"
|
||||
value={data.email}
|
||||
onChange={(e) => setData("email", e.target.value)}
|
||||
className="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary-main focus:border-primary-main"
|
||||
/>
|
||||
{errors.email && <p className="mt-1 text-sm text-red-500">{errors.email}</p>}
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="flex items-center gap-2">
|
||||
<input
|
||||
type="checkbox"
|
||||
checked={data.is_active}
|
||||
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>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-4 pt-4 border-t">
|
||||
<button
|
||||
type="submit"
|
||||
disabled={processing}
|
||||
className="bg-primary-main hover:bg-primary-dark text-white px-6 py-2 rounded-lg disabled:opacity-50 transition-colors"
|
||||
>
|
||||
{processing ? "儲存中..." : "儲存變更"}
|
||||
</button>
|
||||
<Link
|
||||
href="/landlord/tenants"
|
||||
className="text-slate-600 hover:text-slate-900"
|
||||
>
|
||||
取消
|
||||
</Link>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</LandlordLayout>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user