Refactor project and contract forms for improved UI and functionality
- Updated NewProjectPage to use PageContainer and PageHeader for better layout. - Enhanced ProjectListPage to display project data in a responsive table format. - Refactored ContractForm to use Card components and improved loading state handling. - Refactored ProjectForm to use Card components, added loading state, and improved form structure and styling.
This commit is contained in:
@@ -2,6 +2,9 @@
|
||||
|
||||
import { useState } from "react";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { Card, CardHeader, CardContent } from "@/components/ui/Card";
|
||||
import Button from "@/components/ui/Button";
|
||||
import { Input } from "@/components/ui/Input";
|
||||
|
||||
export default function ContractForm() {
|
||||
const [form, setForm] = useState({
|
||||
@@ -14,6 +17,7 @@ export default function ContractForm() {
|
||||
finish_date: "",
|
||||
});
|
||||
|
||||
const [loading, setLoading] = useState(false);
|
||||
const router = useRouter();
|
||||
|
||||
function handleChange(e) {
|
||||
@@ -22,53 +26,192 @@ export default function ContractForm() {
|
||||
|
||||
async function handleSubmit(e) {
|
||||
e.preventDefault();
|
||||
setLoading(true);
|
||||
|
||||
console.log("Submitting form:", form);
|
||||
try {
|
||||
console.log("Submitting form:", form);
|
||||
|
||||
const res = await fetch("/api/contracts", {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify(form),
|
||||
});
|
||||
const res = await fetch("/api/contracts", {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify(form),
|
||||
});
|
||||
|
||||
if (res.ok) {
|
||||
router.push("/projects"); // or /contracts if you plan a listing
|
||||
} else {
|
||||
alert(
|
||||
"Wystąpił błąd podczas dodawania umowy. Sprawdź dane i spróbuj ponownie."
|
||||
);
|
||||
if (res.ok) {
|
||||
const contract = await res.json();
|
||||
router.push(`/contracts/${contract.contract_id}`);
|
||||
} else {
|
||||
alert(
|
||||
"Failed to create contract. Please check the data and try again."
|
||||
);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error creating contract:", error);
|
||||
alert("Failed to create contract. Please try again.");
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<form onSubmit={handleSubmit} className="space-y-4">
|
||||
{[
|
||||
["contract_number", "Numer Umowy"],
|
||||
["contract_name", "Nazwa Umowy"],
|
||||
["customer_contract_number", "Numer Umowy (Klienta)"],
|
||||
["customer", "Zleceniodawca"],
|
||||
["investor", "Inwestor"],
|
||||
["date_signed", "Data zawarcia"],
|
||||
["finish_date", "Data zakończenia"],
|
||||
].map(([name, label]) => (
|
||||
<div key={name}>
|
||||
<label className="block font-medium">{label}</label>
|
||||
<input
|
||||
type={name.includes("date") ? "date" : "text"}
|
||||
name={name}
|
||||
value={form[name] || ""}
|
||||
onChange={handleChange}
|
||||
className="border p-2 w-full"
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<h2 className="text-xl font-semibold text-gray-900">
|
||||
Contract Details
|
||||
</h2>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<form onSubmit={handleSubmit} className="space-y-6">
|
||||
{/* Basic Information Section */}
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Contract Number <span className="text-red-500">*</span>
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="contract_number"
|
||||
value={form.contract_number || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter contract number"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<button
|
||||
type="submit"
|
||||
className="bg-blue-600 text-white px-4 py-2 rounded"
|
||||
>
|
||||
Dodaj umowę
|
||||
</button>
|
||||
</form>
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Contract Name
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="contract_name"
|
||||
value={form.contract_name || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter contract name"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Customer Contract Number
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="customer_contract_number"
|
||||
value={form.customer_contract_number || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter customer contract number"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Customer
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="customer"
|
||||
value={form.customer || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter customer name"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Investor
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="investor"
|
||||
value={form.investor || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter investor name"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Date Signed
|
||||
</label>
|
||||
<Input
|
||||
type="date"
|
||||
name="date_signed"
|
||||
value={form.date_signed || ""}
|
||||
onChange={handleChange}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="md:col-span-2">
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Finish Date
|
||||
</label>
|
||||
<Input
|
||||
type="date"
|
||||
name="finish_date"
|
||||
value={form.finish_date || ""}
|
||||
onChange={handleChange}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Form Actions */}
|
||||
<div className="border-t pt-6 flex items-center justify-end gap-4">
|
||||
<Button
|
||||
type="button"
|
||||
variant="outline"
|
||||
onClick={() => router.back()}
|
||||
disabled={loading}
|
||||
>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button type="submit" variant="primary" disabled={loading}>
|
||||
{loading ? (
|
||||
<>
|
||||
<svg
|
||||
className="animate-spin -ml-1 mr-3 h-4 w-4 text-white"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<circle
|
||||
className="opacity-25"
|
||||
cx="12"
|
||||
cy="12"
|
||||
r="10"
|
||||
stroke="currentColor"
|
||||
strokeWidth="4"
|
||||
></circle>
|
||||
<path
|
||||
className="opacity-75"
|
||||
fill="currentColor"
|
||||
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
||||
></path>
|
||||
</svg>
|
||||
Creating...
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<svg
|
||||
className="w-4 h-4 mr-2"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth={2}
|
||||
d="M12 4v16m8-8H4"
|
||||
/>
|
||||
</svg>
|
||||
Create Contract
|
||||
</>
|
||||
)}
|
||||
</Button>
|
||||
</div>
|
||||
</form>
|
||||
</CardContent>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -2,6 +2,9 @@
|
||||
|
||||
import { useState, useEffect } from "react";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { Card, CardHeader, CardContent } from "@/components/ui/Card";
|
||||
import Button from "@/components/ui/Button";
|
||||
import { Input } from "@/components/ui/Input";
|
||||
|
||||
export default function ProjectForm({ initialData = null }) {
|
||||
const [form, setForm] = useState({
|
||||
@@ -15,7 +18,8 @@ export default function ProjectForm({ initialData = null }) {
|
||||
investment_number: "",
|
||||
finish_date: "",
|
||||
wp: "",
|
||||
contact: "", notes: "",
|
||||
contact: "",
|
||||
notes: "",
|
||||
coordinates: "",
|
||||
project_type: initialData?.project_type || "design",
|
||||
// project_status is not included in the form for creation or editing
|
||||
@@ -23,6 +27,7 @@ export default function ProjectForm({ initialData = null }) {
|
||||
});
|
||||
|
||||
const [contracts, setContracts] = useState([]);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const router = useRouter();
|
||||
const isEdit = !!initialData;
|
||||
|
||||
@@ -38,94 +43,340 @@ export default function ProjectForm({ initialData = null }) {
|
||||
|
||||
async function handleSubmit(e) {
|
||||
e.preventDefault();
|
||||
setLoading(true);
|
||||
|
||||
const res = await fetch(
|
||||
isEdit ? `/api/projects/${initialData.project_id}` : "/api/projects",
|
||||
{
|
||||
method: isEdit ? "PUT" : "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify(form),
|
||||
try {
|
||||
const res = await fetch(
|
||||
isEdit ? `/api/projects/${initialData.project_id}` : "/api/projects",
|
||||
{
|
||||
method: isEdit ? "PUT" : "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify(form),
|
||||
}
|
||||
);
|
||||
|
||||
if (res.ok) {
|
||||
const project = await res.json();
|
||||
if (isEdit) {
|
||||
router.push(`/projects/${project.project_id}`);
|
||||
} else {
|
||||
router.push("/projects");
|
||||
}
|
||||
} else {
|
||||
alert("Failed to save project.");
|
||||
}
|
||||
);
|
||||
|
||||
if (res.ok) {
|
||||
router.push("/projects");
|
||||
} else {
|
||||
} catch (error) {
|
||||
console.error("Error saving project:", error);
|
||||
alert("Failed to save project.");
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<form onSubmit={handleSubmit} className="space-y-4">
|
||||
{/* Contract Dropdown */}
|
||||
<div>
|
||||
<label className="block font-medium">Umowa</label>
|
||||
<select
|
||||
name="contract_id"
|
||||
value={form.contract_id || ""}
|
||||
onChange={handleChange}
|
||||
className="border p-2 w-full"
|
||||
required
|
||||
>
|
||||
<option value="">Wybierz umowę</option>
|
||||
{contracts.map((contract) => (
|
||||
<option key={contract.contract_id} value={contract.contract_id}>
|
||||
{contract.contract_number} – {contract.contract_name}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<h2 className="text-xl font-semibold text-gray-900">
|
||||
{isEdit ? "Edit Project Details" : "Project Details"}
|
||||
</h2>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<form onSubmit={handleSubmit} className="space-y-6">
|
||||
{/* Contract and Project Type Section */}
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Contract <span className="text-red-500">*</span>
|
||||
</label>
|
||||
<select
|
||||
name="contract_id"
|
||||
value={form.contract_id || ""}
|
||||
onChange={handleChange}
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500"
|
||||
required
|
||||
>
|
||||
<option value="">Select Contract</option>
|
||||
{contracts.map((contract) => (
|
||||
<option
|
||||
key={contract.contract_id}
|
||||
value={contract.contract_id}
|
||||
>
|
||||
{contract.contract_number} – {contract.contract_name}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
{/* Project Type Dropdown */}
|
||||
<div>
|
||||
<label className="block font-medium">Typ projektu</label>
|
||||
<select
|
||||
name="project_type"
|
||||
value={form.project_type}
|
||||
onChange={handleChange}
|
||||
className="border p-2 w-full"
|
||||
required
|
||||
>
|
||||
<option value="design">Projektowanie</option>
|
||||
<option value="construction">Realizacja</option>
|
||||
<option value="design+construction">
|
||||
Projektowanie + Realizacja
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Project Type <span className="text-red-500">*</span>
|
||||
</label>
|
||||
<select
|
||||
name="project_type"
|
||||
value={form.project_type}
|
||||
onChange={handleChange}
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500"
|
||||
required
|
||||
>
|
||||
<option value="design">Design (Projektowanie)</option>
|
||||
<option value="construction">Construction (Realizacja)</option>
|
||||
<option value="design+construction">
|
||||
Design + Construction (Projektowanie + Realizacja)
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Other fields */} {[
|
||||
["project_name", "Nazwa projektu"],
|
||||
["address", "Lokalizacja"],
|
||||
["plot", "Działka"],
|
||||
["district", "Obręb ewidencyjny"],
|
||||
["unit", "Jednostka ewidencyjna"],
|
||||
["city", "Miejscowość"],
|
||||
["investment_number", "Numer inwestycjny"],
|
||||
["finish_date", "Termin realizacji"],
|
||||
["wp", "WP"], ["contact", "Dane kontaktowe"],
|
||||
["coordinates", "Coordinates"],
|
||||
["notes", "Notatki"],
|
||||
].map(([name, label]) => (
|
||||
<div key={name}>
|
||||
<label className="block font-medium">{label}</label>
|
||||
<input
|
||||
type={name === "finish_date" ? "date" : "text"}
|
||||
name={name}
|
||||
value={form[name] || ""}
|
||||
onChange={handleChange}
|
||||
className="border p-2 w-full"
|
||||
placeholder={name === "coordinates" ? "e.g., 49.622958,20.629562" : ""}
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
{/* Basic Information Section */}
|
||||
<div className="border-t pt-6">
|
||||
<h3 className="text-lg font-medium text-gray-900 mb-4">
|
||||
Basic Information
|
||||
</h3>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div className="md:col-span-2">
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Project Name <span className="text-red-500">*</span>
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="project_name"
|
||||
value={form.project_name || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter project name"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<button
|
||||
type="submit"
|
||||
className="bg-blue-600 text-white px-4 py-2 rounded"
|
||||
>
|
||||
{isEdit ? "Update" : "Create"} Project
|
||||
</button>
|
||||
</form>
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
City
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="city"
|
||||
value={form.city || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter city"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Address
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="address"
|
||||
value={form.address || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter address"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Plot
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="plot"
|
||||
value={form.plot || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter plot number"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
District
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="district"
|
||||
value={form.district || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter district"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Unit
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="unit"
|
||||
value={form.unit || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter unit"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Finish Date
|
||||
</label>
|
||||
<Input
|
||||
type="date"
|
||||
name="finish_date"
|
||||
value={form.finish_date || ""}
|
||||
onChange={handleChange}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Additional Information Section */}
|
||||
<div className="border-t pt-6">
|
||||
<h3 className="text-lg font-medium text-gray-900 mb-4">
|
||||
Additional Information
|
||||
</h3>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Investment Number
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="investment_number"
|
||||
value={form.investment_number || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter investment number"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
WP
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="wp"
|
||||
value={form.wp || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter WP"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="md:col-span-2">
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Contact Information
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="contact"
|
||||
value={form.contact || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="Enter contact details"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="md:col-span-2">
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Coordinates
|
||||
</label>
|
||||
<Input
|
||||
type="text"
|
||||
name="coordinates"
|
||||
value={form.coordinates || ""}
|
||||
onChange={handleChange}
|
||||
placeholder="e.g., 49.622958,20.629562"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="md:col-span-2">
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Notes
|
||||
</label>
|
||||
<textarea
|
||||
name="notes"
|
||||
value={form.notes || ""}
|
||||
onChange={handleChange}
|
||||
rows={4}
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500"
|
||||
placeholder="Enter any additional notes"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Form Actions */}
|
||||
<div className="border-t pt-6 flex items-center justify-end gap-4">
|
||||
<Button
|
||||
type="button"
|
||||
variant="outline"
|
||||
onClick={() => router.back()}
|
||||
disabled={loading}
|
||||
>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button type="submit" variant="primary" disabled={loading}>
|
||||
{loading ? (
|
||||
<>
|
||||
<svg
|
||||
className="animate-spin -ml-1 mr-3 h-4 w-4 text-white"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<circle
|
||||
className="opacity-25"
|
||||
cx="12"
|
||||
cy="12"
|
||||
r="10"
|
||||
stroke="currentColor"
|
||||
strokeWidth="4"
|
||||
></circle>
|
||||
<path
|
||||
className="opacity-75"
|
||||
fill="currentColor"
|
||||
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
||||
></path>
|
||||
</svg>
|
||||
{isEdit ? "Updating..." : "Creating..."}
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
{isEdit ? (
|
||||
<>
|
||||
<svg
|
||||
className="w-4 h-4 mr-2"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth={2}
|
||||
d="M5 13l4 4L19 7"
|
||||
/>
|
||||
</svg>
|
||||
Update Project
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<svg
|
||||
className="w-4 h-4 mr-2"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth={2}
|
||||
d="M12 4v16m8-8H4"
|
||||
/>
|
||||
</svg>
|
||||
Create Project
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</Button>
|
||||
</div>
|
||||
</form>
|
||||
</CardContent>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user