feat: add media_detail

This commit is contained in:
2026-06-06 20:59:05 +03:30
parent ef054280bb
commit 2f976bade1
2 changed files with 45 additions and 2 deletions
+22 -1
View File
@@ -41,6 +41,9 @@ interface Media {
is_premium?: boolean; is_premium?: boolean;
external_url?: string | null; external_url?: string | null;
image_id?: number | null; image_id?: number | null;
image?: unknown;
detail_image_id?: number | null;
detail_image?: unknown;
} }
// Compact multi-select rendered as toggle chips. // Compact multi-select rendered as toggle chips.
@@ -101,6 +104,8 @@ export default function MediaPage() {
const [externalUrl, setExternalUrl] = useState(""); const [externalUrl, setExternalUrl] = useState("");
const [imageId, setImageId] = useState<number | null>(null); const [imageId, setImageId] = useState<number | null>(null);
const [imageFile, setImageFile] = useState<File | null>(null); const [imageFile, setImageFile] = useState<File | null>(null);
const [detailImageId, setDetailImageId] = useState<number | null>(null);
const [detailImageFile, setDetailImageFile] = useState<File | null>(null);
const [deleting, setDeleting] = useState<Media | null>(null); const [deleting, setDeleting] = useState<Media | null>(null);
const [removing, setRemoving] = useState(false); const [removing, setRemoving] = useState(false);
@@ -118,6 +123,8 @@ export default function MediaPage() {
setExternalUrl(""); setExternalUrl("");
setImageId(null); setImageId(null);
setImageFile(null); setImageFile(null);
setDetailImageId(null);
setDetailImageFile(null);
} }
function openCreate() { function openCreate() {
@@ -142,6 +149,8 @@ export default function MediaPage() {
setExternalUrl(row.external_url ?? ""); setExternalUrl(row.external_url ?? "");
setImageId(row.image_id ?? null); setImageId(row.image_id ?? null);
setImageFile(null); setImageFile(null);
setDetailImageId(row.detail_image_id ?? null);
setDetailImageFile(null);
setOpen(true); setOpen(true);
} }
@@ -166,6 +175,8 @@ export default function MediaPage() {
external_url: externalUrl, external_url: externalUrl,
image_id: imageId, image_id: imageId,
image: imageFile, image: imageFile,
detail_image_id: detailImageId,
detail_image: detailImageFile,
}); });
if (editing) { if (editing) {
// File-bearing update: POST /media/:id (multipart, file optional) // File-bearing update: POST /media/:id (multipart, file optional)
@@ -335,7 +346,7 @@ export default function MediaPage() {
/> />
</Field> </Field>
<Field label="تصویر شاخص" hint="انتخاب از کتابخانه یا بارگذاری تصویر جدید"> <Field label="تصویر لیست" hint="در فهرست نمایش داده می‌شود">
<ImagePicker <ImagePicker
imageId={imageId} imageId={imageId}
onPickId={setImageId} onPickId={setImageId}
@@ -345,6 +356,16 @@ export default function MediaPage() {
/> />
</Field> </Field>
<Field label="تصویر جزئیات" hint="در صفحه جزئیات نمایش داده می‌شود">
<ImagePicker
imageId={detailImageId}
onPickId={setDetailImageId}
file={detailImageFile}
onPickFile={setDetailImageFile}
existingUrl={editing ? pickUrl(editing, ["detail_image"]) : null}
/>
</Field>
<Field label="دسته‌بندی‌ها"> <Field label="دسته‌بندی‌ها">
<ChipMultiSelect <ChipMultiSelect
options={categories} options={categories}
+23 -1
View File
@@ -26,6 +26,8 @@ interface Playlist {
description?: string; description?: string;
image_id?: number | null; image_id?: number | null;
image?: unknown; image?: unknown;
detail_image_id?: number | null;
detail_image?: unknown;
} }
interface MusicCategory { interface MusicCategory {
@@ -49,6 +51,8 @@ export default function MusicPlaylistsPage() {
const [subcategoryIds, setSubcategoryIds] = useState<number[]>([]); const [subcategoryIds, setSubcategoryIds] = useState<number[]>([]);
const [imageId, setImageId] = useState<number | null>(null); const [imageId, setImageId] = useState<number | null>(null);
const [imageFile, setImageFile] = useState<File | null>(null); const [imageFile, setImageFile] = useState<File | null>(null);
const [detailImageId, setDetailImageId] = useState<number | null>(null);
const [detailImageFile, setDetailImageFile] = useState<File | null>(null);
const [deleting, setDeleting] = useState<Playlist | null>(null); const [deleting, setDeleting] = useState<Playlist | null>(null);
const [removing, setRemoving] = useState(false); const [removing, setRemoving] = useState(false);
@@ -65,6 +69,8 @@ export default function MusicPlaylistsPage() {
setSubcategoryIds([]); setSubcategoryIds([]);
setImageId(null); setImageId(null);
setImageFile(null); setImageFile(null);
setDetailImageId(null);
setDetailImageFile(null);
setOpen(true); setOpen(true);
} }
function openEdit(row: Playlist) { function openEdit(row: Playlist) {
@@ -75,6 +81,8 @@ export default function MusicPlaylistsPage() {
setSubcategoryIds([]); setSubcategoryIds([]);
setImageId(row.image_id ?? null); setImageId(row.image_id ?? null);
setImageFile(null); setImageFile(null);
setDetailImageId(row.detail_image_id ?? null);
setDetailImageFile(null);
setOpen(true); setOpen(true);
} }
@@ -91,6 +99,8 @@ export default function MusicPlaylistsPage() {
description, description,
image_id: imageId, image_id: imageId,
image: imageFile, image: imageFile,
detail_image_id: detailImageId,
detail_image: detailImageFile,
}), }),
}); });
toast.success("پلی‌لیست ویرایش شد."); toast.success("پلی‌لیست ویرایش شد.");
@@ -105,6 +115,8 @@ export default function MusicPlaylistsPage() {
subcategory_ids: subcategoryIds, subcategory_ids: subcategoryIds,
image_id: imageId, image_id: imageId,
image: imageFile, image: imageFile,
detail_image_id: detailImageId,
detail_image: detailImageFile,
}), }),
}); });
toast.success("پلی‌لیست افزوده شد."); toast.success("پلی‌لیست افزوده شد.");
@@ -225,7 +237,7 @@ export default function MusicPlaylistsPage() {
/> />
</Field> </Field>
<Field label="تصویر"> <Field label="تصویر لیست">
<ImagePicker <ImagePicker
imageId={imageId} imageId={imageId}
onPickId={setImageId} onPickId={setImageId}
@@ -235,6 +247,16 @@ export default function MusicPlaylistsPage() {
/> />
</Field> </Field>
<Field label="تصویر جزئیات">
<ImagePicker
imageId={detailImageId}
onPickId={setDetailImageId}
file={detailImageFile}
onPickFile={setDetailImageFile}
existingUrl={editing ? pickUrl(editing, ["detail_image"]) : null}
/>
</Field>
{!editing && ( {!editing && (
<> <>
<Field label="دسته‌بندی‌ها"> <Field label="دسته‌بندی‌ها">