mirror of
https://github.com/Radiquum/AniX.git
synced 2025-09-05 22:15:36 +05:00
anix/feat: add year, season, episode duration, episode count, status and age rating filters
This commit is contained in:
parent
819d336540
commit
2a2343fed3
1 changed files with 250 additions and 0 deletions
|
@ -5,9 +5,15 @@ import {
|
||||||
FilterCategoryIdToString,
|
FilterCategoryIdToString,
|
||||||
FilterCountry,
|
FilterCountry,
|
||||||
FilterDefault,
|
FilterDefault,
|
||||||
|
FilterEpisodeCount,
|
||||||
|
FilterEpisodeDuration,
|
||||||
FilterProfileListIdToString,
|
FilterProfileListIdToString,
|
||||||
|
FilterSeasonIdToString,
|
||||||
|
FilterSortToString,
|
||||||
FilterSource,
|
FilterSource,
|
||||||
|
FilterStatusIdToString,
|
||||||
FilterStudio,
|
FilterStudio,
|
||||||
|
FilterYear,
|
||||||
} from "#/api/utils";
|
} from "#/api/utils";
|
||||||
import {
|
import {
|
||||||
Button,
|
Button,
|
||||||
|
@ -224,6 +230,250 @@ export const FiltersModal = ({ isOpen, setIsOpen, filter }: ModalProps) => {
|
||||||
})}
|
})}
|
||||||
</Dropdown>
|
</Dropdown>
|
||||||
</div>
|
</div>
|
||||||
|
<div className="space-y-2">
|
||||||
|
<p>Года</p>
|
||||||
|
<div className="flex items-center gap-2">
|
||||||
|
<p>С</p>
|
||||||
|
<Dropdown
|
||||||
|
label={
|
||||||
|
newFilter.start_year ? newFilter.start_year : "Неважно"
|
||||||
|
}
|
||||||
|
color="blue"
|
||||||
|
className="mr-2 overflow-y-auto max-h-64"
|
||||||
|
>
|
||||||
|
<DropdownItem
|
||||||
|
key={`filter-modal-year-start-none`}
|
||||||
|
onClick={() =>
|
||||||
|
setNewFilter({ ...newFilter, start_year: null })
|
||||||
|
}
|
||||||
|
>
|
||||||
|
Неважно
|
||||||
|
</DropdownItem>
|
||||||
|
{FilterYear.map((value) => {
|
||||||
|
return (
|
||||||
|
<DropdownItem
|
||||||
|
key={`filter-modal-year-start-${value}`}
|
||||||
|
onClick={() =>
|
||||||
|
setNewFilter({
|
||||||
|
...newFilter,
|
||||||
|
start_year: value,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
>
|
||||||
|
{value}
|
||||||
|
</DropdownItem>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</Dropdown>
|
||||||
|
<p>По</p>
|
||||||
|
<Dropdown
|
||||||
|
label={newFilter.end_year ? newFilter.end_year : "Неважно"}
|
||||||
|
color="blue"
|
||||||
|
className="mr-2 overflow-y-auto max-h-64"
|
||||||
|
>
|
||||||
|
<DropdownItem
|
||||||
|
key={`filter-modal-year-end-none`}
|
||||||
|
onClick={() =>
|
||||||
|
setNewFilter({ ...newFilter, end_year: null })
|
||||||
|
}
|
||||||
|
>
|
||||||
|
Неважно
|
||||||
|
</DropdownItem>
|
||||||
|
{FilterYear.map((value) => {
|
||||||
|
return (
|
||||||
|
<DropdownItem
|
||||||
|
key={`filter-modal-year-end-${value}`}
|
||||||
|
onClick={() =>
|
||||||
|
setNewFilter({
|
||||||
|
...newFilter,
|
||||||
|
end_year: value,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
>
|
||||||
|
{value}
|
||||||
|
</DropdownItem>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</Dropdown>
|
||||||
|
<p>Сезон</p>
|
||||||
|
<Dropdown
|
||||||
|
label={
|
||||||
|
newFilter.season ?
|
||||||
|
FilterSeasonIdToString[newFilter.season]
|
||||||
|
: "Неважно"
|
||||||
|
}
|
||||||
|
color="blue"
|
||||||
|
className="mr-2 overflow-y-auto max-h-64"
|
||||||
|
>
|
||||||
|
<DropdownItem
|
||||||
|
key={`filter-modal-year-end-none`}
|
||||||
|
onClick={() => setNewFilter({ ...newFilter, season: null })}
|
||||||
|
>
|
||||||
|
Неважно
|
||||||
|
</DropdownItem>
|
||||||
|
{Object.entries(FilterSeasonIdToString).map(
|
||||||
|
([key, value]) => {
|
||||||
|
return (
|
||||||
|
<DropdownItem
|
||||||
|
key={`filter-modal-season-${value}`}
|
||||||
|
onClick={() =>
|
||||||
|
setNewFilter({
|
||||||
|
...newFilter,
|
||||||
|
season: Number(key),
|
||||||
|
})
|
||||||
|
}
|
||||||
|
>
|
||||||
|
{value}
|
||||||
|
</DropdownItem>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
)}
|
||||||
|
</Dropdown>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="space-y-2">
|
||||||
|
<div className="grid grid-cols-3 gap-4">
|
||||||
|
<div className="space-y-2">
|
||||||
|
<p>Эпизодов</p>
|
||||||
|
<Dropdown
|
||||||
|
label={
|
||||||
|
FilterEpisodeCount.find(
|
||||||
|
(episode) =>
|
||||||
|
episode.episodes_from === newFilter.episodes_from &&
|
||||||
|
episode.episodes_to === newFilter.episodes_to
|
||||||
|
).name
|
||||||
|
}
|
||||||
|
color="blue"
|
||||||
|
className="w-full overflow-y-auto max-h-64"
|
||||||
|
>
|
||||||
|
{FilterEpisodeCount.map((value) => {
|
||||||
|
return (
|
||||||
|
<DropdownItem
|
||||||
|
key={`filter-modal-episode-count-${value.name}`}
|
||||||
|
onClick={() =>
|
||||||
|
setNewFilter({
|
||||||
|
...newFilter,
|
||||||
|
episodes_from: value.episodes_from,
|
||||||
|
episodes_to: value.episodes_to,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
>
|
||||||
|
{value.name}
|
||||||
|
</DropdownItem>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</Dropdown>
|
||||||
|
</div>
|
||||||
|
<div className="space-y-2">
|
||||||
|
<p>Длительность эпизода</p>
|
||||||
|
<Dropdown
|
||||||
|
label={
|
||||||
|
FilterEpisodeDuration.find(
|
||||||
|
(episode) =>
|
||||||
|
episode.episode_duration_from ===
|
||||||
|
newFilter.episode_duration_from &&
|
||||||
|
episode.episode_duration_to ===
|
||||||
|
newFilter.episode_duration_to
|
||||||
|
).name
|
||||||
|
}
|
||||||
|
color="blue"
|
||||||
|
className="w-full overflow-y-auto max-h-64"
|
||||||
|
>
|
||||||
|
{FilterEpisodeDuration.map((value) => {
|
||||||
|
return (
|
||||||
|
<DropdownItem
|
||||||
|
key={`filter-modal-episode-duration-${value.name}`}
|
||||||
|
onClick={() =>
|
||||||
|
setNewFilter({
|
||||||
|
...newFilter,
|
||||||
|
episode_duration_from:
|
||||||
|
value.episode_duration_from,
|
||||||
|
episode_duration_to: value.episode_duration_to,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
>
|
||||||
|
{value.name}
|
||||||
|
</DropdownItem>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</Dropdown>
|
||||||
|
</div>
|
||||||
|
<div className="space-y-2">
|
||||||
|
<p>Статус</p>
|
||||||
|
<Dropdown
|
||||||
|
label={
|
||||||
|
newFilter.status_id ?
|
||||||
|
FilterStatusIdToString[newFilter.status_id]
|
||||||
|
: "Неважно"
|
||||||
|
}
|
||||||
|
color="blue"
|
||||||
|
className="w-full overflow-y-auto max-h-64"
|
||||||
|
>
|
||||||
|
<DropdownItem
|
||||||
|
key={`filter-modal-status-none`}
|
||||||
|
onClick={() =>
|
||||||
|
setNewFilter({ ...newFilter, status_id: null })
|
||||||
|
}
|
||||||
|
>
|
||||||
|
Неважно
|
||||||
|
</DropdownItem>
|
||||||
|
{Object.entries(FilterStatusIdToString).map(
|
||||||
|
([key, value]) => {
|
||||||
|
return (
|
||||||
|
<DropdownItem
|
||||||
|
key={`filter-modal-status-${value}`}
|
||||||
|
onClick={() =>
|
||||||
|
setNewFilter({
|
||||||
|
...newFilter,
|
||||||
|
status_id: Number(key),
|
||||||
|
})
|
||||||
|
}
|
||||||
|
>
|
||||||
|
{value}
|
||||||
|
</DropdownItem>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
)}
|
||||||
|
</Dropdown>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="space-y-2">
|
||||||
|
<p>Возрастное ограничение</p>
|
||||||
|
<Button
|
||||||
|
color={"blue"}
|
||||||
|
className="w-full min-h-10 h-fit"
|
||||||
|
// onClick={() => setIsGenreModalOpen(true)}
|
||||||
|
>
|
||||||
|
{/* {newFilter.genres.length > 0 ?
|
||||||
|
newFilter.genres.join(", ")
|
||||||
|
: "Неважно"} */}
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
<div className="space-y-2">
|
||||||
|
<p>Сортировка</p>
|
||||||
|
<Dropdown
|
||||||
|
label={FilterSortToString[newFilter.sort]}
|
||||||
|
color="blue"
|
||||||
|
className="w-full overflow-y-auto max-h-64"
|
||||||
|
>
|
||||||
|
{Object.entries(FilterSortToString).map(([key, value]) => {
|
||||||
|
return (
|
||||||
|
<DropdownItem
|
||||||
|
key={`filter-modal-sort-${value}`}
|
||||||
|
onClick={() =>
|
||||||
|
setNewFilter({
|
||||||
|
...newFilter,
|
||||||
|
sort: Number(key),
|
||||||
|
})
|
||||||
|
}
|
||||||
|
>
|
||||||
|
{value}
|
||||||
|
</DropdownItem>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</Dropdown>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</ModalBody>
|
</ModalBody>
|
||||||
<ModalFooter></ModalFooter>
|
<ModalFooter></ModalFooter>
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue