Skip to content

Commit

Permalink
feat: optimize sidebar icons of home page
Browse files Browse the repository at this point in the history
  • Loading branch information
@ltaoo
ltaoo committed Feb 1, 2024
1 parent 9d4822d commit 1ef6489
Show file tree
Hide file tree
Showing 7 changed files with 81 additions and 43 deletions.
2 changes: 2 additions & 0 deletions .gitignore
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,8 @@ dist-ssr
dist-admin
*.local

mock

# Editor directories and files
.vscode/*
!.vscode/extensions.json
Expand Down
16 changes: 8 additions & 8 deletions src/components/DriveFileCard/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -89,22 +89,22 @@ export const DriveFileCard = (props: {
<Show
when={profile()?.media}
fallback={
<div class="flex">
<div class="mr-4">
<div class="w-[120px] h-[180px]" />
</div>
<div>
<Show when={profile()?.unknown_media}>
<Show when={profile()?.unknown_media}>
<div class="flex">
<div class="mr-4">
<div class="w-[120px] h-[180px]" />
</div>
<div>
<div>{profile()?.unknown_media?.name}</div>
<div class="flex items-center">
<AlertCircle class="w-4 h-4 mr-1 text-red-800" />
<div>{profile()?.unknown_media?.type === MediaTypes.Movie ? "电影" : "电视剧"}</div>
</div>
<div>{profile()?.unknown_media?.episode_text}</div>
<div>没有匹配到详情信息</div>
</Show>
</div>
</div>
</div>
</Show>
}
>
<div class="flex">
Expand Down
82 changes: 55 additions & 27 deletions src/pages/home/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
* @file 管理后台首页(云盘列表)
*/
import { createSignal, For, Show } from "solid-js";
import { Send, FileSearch, RefreshCcw, AlertTriangle } from "lucide-solid";
import { Send, FileSearch, RefreshCcw, AlertTriangle, Loader, Bird } from "lucide-solid";

import { fetchDashboard, fetchMediaRecentlyCreated, refreshDashboard } from "@/services/common";
import { pushMessageToMembers } from "@/services";
Expand Down Expand Up @@ -42,6 +42,7 @@ export const HomeIndexPage: ViewComponent = (props) => {
report_count: 0,
media_request_count: 0,
invalid_season_count: 0,
invalid_movie_count: 0,
invalid_sync_task_count: 0,
updated_at: null,
},
Expand Down Expand Up @@ -208,6 +209,7 @@ export const HomeIndexPage: ViewComponent = (props) => {
<div
onClick={async () => {
refreshIcon.show(2);
mediaListRecentlyCreated.refresh();
const r = await refreshRequest.run();
if (r.error) {
refreshIcon.show(3);
Expand Down Expand Up @@ -297,15 +299,29 @@ export const HomeIndexPage: ViewComponent = (props) => {
<div class="text-lg">待处理问题</div>
</div>
<div class="flex items-center mt-4">
<div
class="w-[240px] cursor-pointer"
onClick={() => {
history.push("root.home_layout.invalid_media_list");
// app.showView(homeInvalidMediaListPage);
}}
>
<div class="text-3xl">{dashboard()?.invalid_season_count}</div>
<div class="text-slate-800">问题影视剧</div>
<div class="w-[240px]">
<span
class="text-3xl cursor-pointer"
onClick={() => {
history.push("root.home_layout.invalid_media_list");
// app.showView(homeInvalidMediaListPage);
}}
>
{dashboard()?.invalid_season_count}
</span>
<div class="text-slate-800">问题电视剧</div>
</div>
<div class="w-[240px]">
<div
class="text-3xl cursor-pointer"
onClick={() => {
history.push("root.home_layout.invalid_media_list");
// app.showView(homeInvalidMediaListPage);
}}
>
{dashboard()?.invalid_movie_count}
</div>
<div class="text-slate-800">问题电影</div>
</div>
<div
class="w-[240px] cursor-pointer"
Expand Down Expand Up @@ -343,24 +359,36 @@ export const HomeIndexPage: ViewComponent = (props) => {
<h1 class="text-2xl">
<div>今日更新</div>
</h1>
<div class="mt-4 p-4 min-h-[198px] rounded-md border bg-white max-w-full overflow-x-auto">
<div class="flex space-x-4">
<For each={mediaResponse().dataSource}>
{(media) => {
const { name, poster_path, text } = media;
return (
<div class="p-2 w-[64px]">
<div class="mr-2">
<LazyImage class="w-[64px] h-[96px]" store={poster.bind(poster_path)} />
</div>
<div>
<div>{name}</div>
<div class="max-w-full mt-2 text-sm overflow-hidden">{text}</div>
<div class="relative mt-4 p-4 min-h-[270px] rounded-md border bg-white max-w-full overflow-x-auto">
<Show when={mediaResponse().loading}>
<div class="absolute inset-0 flex items-center justify-center">
<Loader class="w-12 h-12 text-slate-500 animate animate-spin" />
</div>
</Show>
<div class="flex flex-row space-x-4">
<Show
when={!mediaResponse().empty}
fallback={
<div class="absolute inset-0 flex items-center justify-center">
<Bird class="w-16 h-16 text-slate-500" />
</div>
}
>
<For each={mediaResponse().dataSource}>
{(media) => {
const { name, poster_path, text } = media;
return (
<div class="w-[128px]">
<LazyImage class="w-[128px]" store={poster.bind(poster_path)} />
<div class="max-w-full">
<div class="truncate">{name}</div>
<div class="max-w-full truncate text-sm">{text}</div>
</div>
</div>
</div>
);
}}
</For>
);
}}
</For>
</Show>
</div>
</div>
</div>
Expand Down
11 changes: 7 additions & 4 deletions src/pages/home/layout.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,9 @@ import {
MessageCircle,
AlarmClock,
Folder,
Cherry,
Sparkles,
HeartCrack,
} from "lucide-solid";

import { fetchSettings, notify_test, pushMessageToMembers, updateSettings } from "@/services";
Expand Down Expand Up @@ -251,15 +254,15 @@ export const HomeLayout: ViewComponent = (props) => {
// view: homeMovieListPage,
},
{
text: "解析结果",
icon: <EyeOff class="w-6 h-6" />,
text: "刮削结果",
icon: <Sparkles class="w-6 h-6" />,
// url: "/home/unknown_media/season",
url: "root.home_layout.parse_result_layout.season" as PageKeys,
// view: homeUnknownTVPage,
},
{
text: "待处理影视剧问题",
icon: <Bot class="w-6 h-6" />,
text: "问题影视剧",
icon: <HeartCrack class="w-6 h-6" />,
badge: false,
// url: "/home/invalid_media",
url: "root.home_layout.invalid_media_list" as PageKeys,
Expand Down
6 changes: 4 additions & 2 deletions src/pages/movie/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -330,7 +330,7 @@ export const MovieListPage: ViewComponent = (props) => {
{(movie) => {
const { id, name, overview, poster_path, air_date, vote_average, origin_country, tips, persons } =
movie;
const url = `/home/movie_profile?id=${id}`;
const url = history.buildURLWithPrefix("root.home_layout.movie_profile", { id });
return (
<div class="rounded-md border border-slate-300 bg-white shadow-sm">
<div class="flex">
Expand All @@ -339,7 +339,9 @@ export const MovieListPage: ViewComponent = (props) => {
</div>
<div class="flex-1 w-0 p-4">
<h2 class="text-2xl text-slate-800">
<a href={url}>{name}</a>
<a href={url} target="_blank">
{name}
</a>
</h2>
<div class="mt-2 overflow-hidden text-ellipsis">
<p class="text-slate-700 break-all whitespace-pre-wrap truncate line-clamp-4">
Expand Down
4 changes: 3 additions & 1 deletion src/pages/season/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -513,7 +513,9 @@ export const HomeSeasonListPage: ViewComponent = (props) => {
<div class="flex-1 w-0 p-4">
<div class="flex items-center">
<h2 class="text-2xl text-slate-800">
<a href={url}>{name}</a>
<a href={url} target="_blank">
{name}
</a>
</h2>
</div>
<div class="mt-2 overflow-hidden text-ellipsis">
Expand Down
3 changes: 2 additions & 1 deletion src/services/common.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -95,6 +95,7 @@ export function fetchDashboard() {
report_count: number;
media_request_count: number;
invalid_season_count: number;
invalid_movie_count: number;
invalid_sync_task_count: number;
updated_at: string;
}>("/api/v2/admin/dashboard", {});
Expand All @@ -104,7 +105,7 @@ export function refreshDashboard() {
return request.post("/api/v2/admin/dashboard/refresh", {});
}

export function fetchMediaRecentlyCreated(params: FetchParams) {
export async function fetchMediaRecentlyCreated(params: FetchParams) {
return request.post<
ListResponseWithCursor<{
id: string;
Expand Down

0 comments on commit 1ef6489

Please sign in to comment.