feat: add tags
This commit is contained in:
@@ -20,9 +20,21 @@ import {
|
||||
import { EditIcon, PlusIcon, TrashIcon } from "@/components/icons";
|
||||
import { toFa } from "@/lib/utils";
|
||||
|
||||
interface SurveyTag {
|
||||
id: number;
|
||||
name: string;
|
||||
}
|
||||
|
||||
interface SurveyOption {
|
||||
id?: number;
|
||||
label?: string;
|
||||
tags?: SurveyTag[];
|
||||
}
|
||||
|
||||
// Form-side option: tags edited as a comma-separated string.
|
||||
interface OptionDraft {
|
||||
label: string;
|
||||
tags: string;
|
||||
}
|
||||
|
||||
interface SurveyQuestion {
|
||||
@@ -54,7 +66,9 @@ export default function SurveysPage() {
|
||||
const [type, setType] = useState("single");
|
||||
const [order, setOrder] = useState("0");
|
||||
const [isActive, setIsActive] = useState(true);
|
||||
const [options, setOptions] = useState<string[]>([""]);
|
||||
const [options, setOptions] = useState<OptionDraft[]>([
|
||||
{ label: "", tags: "" },
|
||||
]);
|
||||
|
||||
const [deleting, setDeleting] = useState<SurveyQuestion | null>(null);
|
||||
const [removing, setRemoving] = useState(false);
|
||||
@@ -66,7 +80,7 @@ export default function SurveysPage() {
|
||||
setType("single");
|
||||
setOrder("0");
|
||||
setIsActive(true);
|
||||
setOptions([""]);
|
||||
setOptions([{ label: "", tags: "" }]);
|
||||
setOpen(true);
|
||||
}
|
||||
|
||||
@@ -79,17 +93,22 @@ export default function SurveysPage() {
|
||||
setIsActive(row.is_active ?? true);
|
||||
setOptions(
|
||||
row.options && row.options.length
|
||||
? row.options.map((o) => o.label ?? "")
|
||||
: [""],
|
||||
? row.options.map((o) => ({
|
||||
label: o.label ?? "",
|
||||
tags: (o.tags ?? []).map((t) => t.name).join("، "),
|
||||
}))
|
||||
: [{ label: "", tags: "" }],
|
||||
);
|
||||
setOpen(true);
|
||||
}
|
||||
|
||||
function setOptionAt(index: number, value: string) {
|
||||
setOptions((prev) => prev.map((o, i) => (i === index ? value : o)));
|
||||
function setOptionAt(index: number, patch: Partial<OptionDraft>) {
|
||||
setOptions((prev) =>
|
||||
prev.map((o, i) => (i === index ? { ...o, ...patch } : o)),
|
||||
);
|
||||
}
|
||||
function addOption() {
|
||||
setOptions((prev) => [...prev, ""]);
|
||||
setOptions((prev) => [...prev, { label: "", tags: "" }]);
|
||||
}
|
||||
function removeOption(index: number) {
|
||||
setOptions((prev) =>
|
||||
@@ -108,9 +127,15 @@ export default function SurveysPage() {
|
||||
order: Number(order),
|
||||
is_active: isActive,
|
||||
options: options
|
||||
.map((label) => label.trim())
|
||||
.filter((label) => label !== "")
|
||||
.map((label) => ({ label })),
|
||||
.map((o) => ({ label: o.label.trim(), tagsRaw: o.tags }))
|
||||
.filter((o) => o.label !== "")
|
||||
.map((o) => ({
|
||||
label: o.label,
|
||||
tags: o.tagsRaw
|
||||
.split(/[,،]/)
|
||||
.map((t) => t.trim())
|
||||
.filter((t) => t !== ""),
|
||||
})),
|
||||
};
|
||||
if (editing) {
|
||||
await apiFetch(`/survey-questions/${editing.id}`, {
|
||||
@@ -283,12 +308,22 @@ export default function SurveysPage() {
|
||||
</Button>
|
||||
</div>
|
||||
{options.map((opt, i) => (
|
||||
<div key={i} className="flex items-center gap-2">
|
||||
<div
|
||||
key={i}
|
||||
className="flex items-start gap-2 rounded-lg border border-border p-2"
|
||||
>
|
||||
<div className="flex flex-1 flex-col gap-2">
|
||||
<Input
|
||||
value={opt}
|
||||
onChange={(e) => setOptionAt(i, e.target.value)}
|
||||
value={opt.label}
|
||||
onChange={(e) => setOptionAt(i, { label: e.target.value })}
|
||||
placeholder={`گزینه ${toFa(i + 1)}`}
|
||||
/>
|
||||
<Input
|
||||
value={opt.tags}
|
||||
onChange={(e) => setOptionAt(i, { tags: e.target.value })}
|
||||
placeholder="برچسبها (با کاما جدا کنید) — برای پیشنهاد محتوا"
|
||||
/>
|
||||
</div>
|
||||
<Button
|
||||
type="button"
|
||||
variant="ghost"
|
||||
|
||||
Reference in New Issue
Block a user