|
@ -1,5 +1,5 @@ |
|
|
import { useTranslation } from '@/i18n.ts' |
|
|
import { useTranslation } from '@/i18n.ts' |
|
|
import { Button, Form, Popconfirm, Image } from 'antd' |
|
|
|
|
|
|
|
|
import { Button, Form, Popconfirm, Image, Tooltip, Badge, Divider, DatePicker, Space } from 'antd' |
|
|
import { useAtom, useAtomValue } from 'jotai' |
|
|
import { useAtom, useAtomValue } from 'jotai' |
|
|
import { useEffect, useMemo, useState } from 'react' |
|
|
import { useEffect, useMemo, useState } from 'react' |
|
|
import Switch from '@/components/switch' |
|
|
import Switch from '@/components/switch' |
|
@ -9,25 +9,42 @@ import ListPageLayout from '@/layout/ListPageLayout.tsx' |
|
|
import { videoTypes } from '@/store/cms/video.ts' |
|
|
import { videoTypes } from '@/store/cms/video.ts' |
|
|
import { |
|
|
import { |
|
|
deleteVideoMagnetAtom, |
|
|
deleteVideoMagnetAtom, |
|
|
saveOrUpdateVideoMagnetAtom, |
|
|
|
|
|
|
|
|
saveOrUpdateVideoMagnetAtom, videoMagnetAtom, |
|
|
videoMagnetsAtom, |
|
|
videoMagnetsAtom, |
|
|
videoMagnetSearchAtom |
|
|
videoMagnetSearchAtom |
|
|
} from '@/store/cms/video_magnet.ts' |
|
|
} from '@/store/cms/video_magnet.ts' |
|
|
|
|
|
import { getValueCount } from '@/utils' |
|
|
|
|
|
import { FilterOutlined } from '@ant-design/icons' |
|
|
|
|
|
import { useSetAtom } from 'jotai/index' |
|
|
|
|
|
import { categoriesAtom, categoryByIdAtom, categoryIdAtom } from '@/store/cms/category.ts' |
|
|
|
|
|
import TagValue from '@/components/tag-value/TagValue.tsx' |
|
|
|
|
|
import dayjs from 'dayjs' |
|
|
|
|
|
import TagPro from '@/components/tag-pro/TagPro.tsx' |
|
|
|
|
|
import { useStyle } from './style' |
|
|
|
|
|
|
|
|
const i18nPrefix = 'cms.videoMagnet' |
|
|
const i18nPrefix = 'cms.videoMagnet' |
|
|
|
|
|
|
|
|
const VideoMagnet = () => { |
|
|
const VideoMagnet = () => { |
|
|
|
|
|
|
|
|
// const { styles } = useStyle()
|
|
|
|
|
|
|
|
|
const { styles, cx } = useStyle() |
|
|
const { t } = useTranslation() |
|
|
const { t } = useTranslation() |
|
|
const [ form ] = Form.useForm() |
|
|
const [ form ] = Form.useForm() |
|
|
|
|
|
const [ filterForm ] = Form.useForm() |
|
|
const { mutate: saveOrUpdate, isPending: isSubmitting, isSuccess } = useAtomValue(saveOrUpdateVideoMagnetAtom) |
|
|
const { mutate: saveOrUpdate, isPending: isSubmitting, isSuccess } = useAtomValue(saveOrUpdateVideoMagnetAtom) |
|
|
const [ search, setSearch ] = useAtom(videoMagnetSearchAtom) |
|
|
const [ search, setSearch ] = useAtom(videoMagnetSearchAtom) |
|
|
|
|
|
const [ currentVideo, setVideo ] = useAtom(videoMagnetAtom) |
|
|
|
|
|
|
|
|
const { data, isFetching, isLoading, refetch } = useAtomValue(videoMagnetsAtom) |
|
|
const { data, isFetching, isLoading, refetch } = useAtomValue(videoMagnetsAtom) |
|
|
const { mutate: deleteVideo, isPending: isDeleting } = useAtomValue(deleteVideoMagnetAtom) |
|
|
const { mutate: deleteVideo, isPending: isDeleting } = useAtomValue(deleteVideoMagnetAtom) |
|
|
|
|
|
const setCategoryId = useSetAtom(categoryIdAtom) |
|
|
|
|
|
const { data: categories, isLoading: isCateLoading } = useAtomValue(categoriesAtom) |
|
|
|
|
|
const { data: category, isLoading: isCategoryFetching } = useAtomValue(categoryByIdAtom) |
|
|
const [ open, setOpen ] = useState(false) |
|
|
const [ open, setOpen ] = useState(false) |
|
|
|
|
|
const [ openFilter, setFilterOpen ] = useState(false) |
|
|
|
|
|
const [ searchKey, setSearchKey ] = useState(search?.title) |
|
|
|
|
|
|
|
|
const columns = useMemo(() => { |
|
|
const columns = useMemo(() => { |
|
|
|
|
|
|
|
|
return [ |
|
|
return [ |
|
|
{ |
|
|
{ |
|
|
title: 'ID', |
|
|
title: 'ID', |
|
@ -37,6 +54,15 @@ const VideoMagnet = () => { |
|
|
formItemProps: { hidden: true } |
|
|
formItemProps: { hidden: true } |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
|
|
|
'title': t(`${i18nPrefix}.columns.collect_id`, 'CollectId'), |
|
|
|
|
|
'dataIndex': 'collect_id', |
|
|
|
|
|
hideInTable: true, |
|
|
|
|
|
hideInSearch: true, |
|
|
|
|
|
hideInSetting: true, |
|
|
|
|
|
formItemProps: { hidden: true }, |
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.title`, 'Title'), |
|
|
'title': t(`${i18nPrefix}.columns.title`, 'Title'), |
|
|
'dataIndex': 'title', |
|
|
'dataIndex': 'title', |
|
|
onHeaderCell: () => { |
|
|
onHeaderCell: () => { |
|
@ -44,6 +70,15 @@ const VideoMagnet = () => { |
|
|
width: 200, |
|
|
width: 200, |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
|
|
|
colProps: { |
|
|
|
|
|
span: 12 |
|
|
|
|
|
}, |
|
|
|
|
|
render: (_text, record) => { |
|
|
|
|
|
//高亮搜索关键字, 从search.title中获取
|
|
|
|
|
|
const title = record.title?.replace?.(new RegExp(`(${search?.title})`, 'ig'), '<span class="ant-pro-table-highlight">$1</span>') |
|
|
|
|
|
|
|
|
|
|
|
return <span dangerouslySetInnerHTML={{ __html: title }}></span> |
|
|
|
|
|
} |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.title_sub`, 'TitleSub'), |
|
|
'title': t(`${i18nPrefix}.columns.title_sub`, 'TitleSub'), |
|
@ -53,25 +88,9 @@ const VideoMagnet = () => { |
|
|
width: 200, |
|
|
width: 200, |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
'title': t(`${i18nPrefix}.columns.source_url`, 'SourceUrl'), |
|
|
|
|
|
'dataIndex': 'source_url', |
|
|
|
|
|
ellipsis: true, |
|
|
|
|
|
copyable: true, |
|
|
|
|
|
onHeaderCell: () => { |
|
|
|
|
|
return { |
|
|
|
|
|
width: 200, |
|
|
|
|
|
} |
|
|
|
|
|
}, |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
'title': t(`${i18nPrefix}.columns.collect_id`, 'CollectId'), |
|
|
|
|
|
'dataIndex': 'collect_id', |
|
|
|
|
|
hideInTable: true, |
|
|
|
|
|
hideInSearch: true, |
|
|
|
|
|
hideInSetting: true, |
|
|
|
|
|
formItemProps: { hidden: true }, |
|
|
|
|
|
|
|
|
colProps: { |
|
|
|
|
|
span: 12 |
|
|
|
|
|
} |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.type_id`, 'TypeId'), |
|
|
'title': t(`${i18nPrefix}.columns.type_id`, 'TypeId'), |
|
@ -80,24 +99,30 @@ const VideoMagnet = () => { |
|
|
fieldProps: { |
|
|
fieldProps: { |
|
|
options: videoTypes, |
|
|
options: videoTypes, |
|
|
}, |
|
|
}, |
|
|
|
|
|
hideInForm: true, |
|
|
render: (_dom, record) => { |
|
|
render: (_dom, record) => { |
|
|
return t(`${i18nPrefix}.type_id.${record.type_id}`) |
|
|
return t(`${i18nPrefix}.type_id.${record.type_id}`) |
|
|
}, |
|
|
}, |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.letter`, 'Letter'), |
|
|
|
|
|
'dataIndex': 'letter' |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
'title': t(`${i18nPrefix}.columns.tag`, 'Tag'), |
|
|
|
|
|
'dataIndex': 'tag', |
|
|
|
|
|
valueType: 'textarea', |
|
|
|
|
|
|
|
|
'title': t(`${i18nPrefix}.columns.source_url`, 'SourceUrl'), |
|
|
|
|
|
'dataIndex': 'source_url', |
|
|
ellipsis: true, |
|
|
ellipsis: true, |
|
|
|
|
|
copyable: true, |
|
|
onHeaderCell: () => { |
|
|
onHeaderCell: () => { |
|
|
return { |
|
|
return { |
|
|
width: 200, |
|
|
width: 200, |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
|
|
|
hideInSearch: true, |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
'title': t(`${i18nPrefix}.columns.letter`, 'Letter'), |
|
|
|
|
|
'dataIndex': 'letter', |
|
|
|
|
|
colProps: { |
|
|
|
|
|
span: 4 |
|
|
|
|
|
}, |
|
|
|
|
|
hideInSearch: true, |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.lock`, 'Lock'), |
|
|
'title': t(`${i18nPrefix}.columns.lock`, 'Lock'), |
|
@ -106,6 +131,10 @@ const VideoMagnet = () => { |
|
|
render: (_dom, record) => { |
|
|
render: (_dom, record) => { |
|
|
return <Switch value={record.lock} size={'small'}/> |
|
|
return <Switch value={record.lock} size={'small'}/> |
|
|
}, |
|
|
}, |
|
|
|
|
|
colProps: { |
|
|
|
|
|
span: 4 |
|
|
|
|
|
}, |
|
|
|
|
|
hideInSearch: true, |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.copyright`, 'Copyright'), |
|
|
'title': t(`${i18nPrefix}.columns.copyright`, 'Copyright'), |
|
@ -114,6 +143,10 @@ const VideoMagnet = () => { |
|
|
render: (_dom, record) => { |
|
|
render: (_dom, record) => { |
|
|
return <Switch value={record.lock} size={'small'}/> |
|
|
return <Switch value={record.lock} size={'small'}/> |
|
|
}, |
|
|
}, |
|
|
|
|
|
colProps: { |
|
|
|
|
|
span: 4 |
|
|
|
|
|
}, |
|
|
|
|
|
hideInSearch: true, |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.is_end`, 'IsEnd'), |
|
|
'title': t(`${i18nPrefix}.columns.is_end`, 'IsEnd'), |
|
@ -122,6 +155,10 @@ const VideoMagnet = () => { |
|
|
render: (_dom, record) => { |
|
|
render: (_dom, record) => { |
|
|
return <Switch value={record.lock} size={'small'}/> |
|
|
return <Switch value={record.lock} size={'small'}/> |
|
|
}, |
|
|
}, |
|
|
|
|
|
colProps: { |
|
|
|
|
|
span: 4 |
|
|
|
|
|
}, |
|
|
|
|
|
hideInSearch: true, |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.status`, 'Status'), |
|
|
'title': t(`${i18nPrefix}.columns.status`, 'Status'), |
|
@ -130,12 +167,30 @@ const VideoMagnet = () => { |
|
|
render: (_dom, record) => { |
|
|
render: (_dom, record) => { |
|
|
return <Switch value={record.lock} size={'small'}/> |
|
|
return <Switch value={record.lock} size={'small'}/> |
|
|
}, |
|
|
}, |
|
|
|
|
|
colProps: { |
|
|
|
|
|
span: 4 |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.category_id`, 'CategoryId'), |
|
|
|
|
|
'dataIndex': 'category_id', |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
'title': t(`${i18nPrefix}.columns.pic_local`, 'PicLocal'), |
|
|
|
|
|
'dataIndex': 'pic_local', |
|
|
|
|
|
hideInSearch: true, |
|
|
|
|
|
hideInSetting: true, |
|
|
|
|
|
formItemProps: { hidden: true }, |
|
|
|
|
|
hideInTable: true, |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
'title': t(`${i18nPrefix}.columns.pic_status`, 'PicStatus'), |
|
|
|
|
|
'dataIndex': 'pic_status', |
|
|
|
|
|
valueType: 'switch', |
|
|
|
|
|
render: (_dom, record) => { |
|
|
|
|
|
return <Switch value={record.lock} size={'small'}/> |
|
|
|
|
|
}, |
|
|
|
|
|
colProps: { |
|
|
|
|
|
span: 4 |
|
|
|
|
|
}, |
|
|
|
|
|
hideInSearch: true, |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.pic`, 'Pic'), |
|
|
'title': t(`${i18nPrefix}.columns.pic`, 'Pic'), |
|
@ -143,104 +198,366 @@ const VideoMagnet = () => { |
|
|
render: (_dom, record) => { |
|
|
render: (_dom, record) => { |
|
|
return <Image src={record.pic} height={40}/> |
|
|
return <Image src={record.pic} height={40}/> |
|
|
}, |
|
|
}, |
|
|
|
|
|
colProps: { |
|
|
|
|
|
span: 20 |
|
|
|
|
|
}, |
|
|
|
|
|
hideInSearch: true, |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.pic_local`, 'PicLocal'), |
|
|
|
|
|
'dataIndex': 'pic_local', |
|
|
|
|
|
hideInSearch: true, |
|
|
|
|
|
hideInSetting: true, |
|
|
|
|
|
formItemProps: { hidden: true }, |
|
|
|
|
|
hideInTable: true, |
|
|
|
|
|
|
|
|
'title': t(`${i18nPrefix}.columns.category_id`, 'CategoryId'), |
|
|
|
|
|
'dataIndex': 'category_id', |
|
|
|
|
|
valueType: 'select', |
|
|
|
|
|
fieldProps: { |
|
|
|
|
|
loading: isCategoryFetching, |
|
|
|
|
|
options: categories?.rows ?? [], |
|
|
|
|
|
fieldNames: { |
|
|
|
|
|
label: 'name', |
|
|
|
|
|
value: 'id' |
|
|
|
|
|
} |
|
|
|
|
|
}, |
|
|
|
|
|
render: (_dom, record) => { |
|
|
|
|
|
return <TagValue |
|
|
|
|
|
tags={categories?.rows.filter(item => item.id === record.category_id).map(item => { |
|
|
|
|
|
return { |
|
|
|
|
|
label: item.name, |
|
|
|
|
|
value: item.id |
|
|
|
|
|
} |
|
|
|
|
|
}) ?? []} |
|
|
|
|
|
wrap={currentVideo?.id === record.id} |
|
|
|
|
|
value={search?.category_id ?? []} |
|
|
|
|
|
onChange={(values) => { |
|
|
|
|
|
setSearch((prev: any) => { |
|
|
|
|
|
return { |
|
|
|
|
|
...prev, |
|
|
|
|
|
category_id: values, |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
setCategoryId(values[0]) |
|
|
|
|
|
setFilterOpen(true) |
|
|
|
|
|
}} |
|
|
|
|
|
/> |
|
|
|
|
|
}, |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.actor`, 'Actor'), |
|
|
'title': t(`${i18nPrefix}.columns.actor`, 'Actor'), |
|
|
'dataIndex': 'actor', |
|
|
'dataIndex': 'actor', |
|
|
ellipsis: true, |
|
|
ellipsis: true, |
|
|
onHeaderCell: () => { |
|
|
|
|
|
return { |
|
|
|
|
|
width: 200, |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
width: 200, |
|
|
|
|
|
fieldProps: { |
|
|
|
|
|
style: { width: '100%' } |
|
|
|
|
|
}, |
|
|
|
|
|
render: (_dom, record) => { |
|
|
|
|
|
return <TagValue |
|
|
|
|
|
tags={record.actor?.split(',') ?? []} |
|
|
|
|
|
wrap={currentVideo?.id === record.id} |
|
|
|
|
|
value={search?.actor ?? []} |
|
|
|
|
|
onChange={(values) => { |
|
|
|
|
|
setSearch((prev: any) => { |
|
|
|
|
|
return { |
|
|
|
|
|
...prev, |
|
|
|
|
|
actor: values, |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
setFilterOpen(true) |
|
|
|
|
|
}} |
|
|
|
|
|
/> |
|
|
}, |
|
|
}, |
|
|
|
|
|
|
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.director`, 'Director'), |
|
|
'title': t(`${i18nPrefix}.columns.director`, 'Director'), |
|
|
'dataIndex': 'director', |
|
|
'dataIndex': 'director', |
|
|
ellipsis: true, |
|
|
|
|
|
onHeaderCell: () => { |
|
|
|
|
|
return { |
|
|
|
|
|
width: 200, |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
width: 200, |
|
|
|
|
|
fieldProps: { |
|
|
|
|
|
style: { width: '100%' } |
|
|
}, |
|
|
}, |
|
|
|
|
|
render: (_dom, record) => { |
|
|
|
|
|
return <TagValue |
|
|
|
|
|
tags={record.director?.split(',') ?? []} |
|
|
|
|
|
wrap={currentVideo?.id === record.id} |
|
|
|
|
|
value={search?.director ?? []} |
|
|
|
|
|
onChange={(values) => { |
|
|
|
|
|
setSearch((prev: any) => { |
|
|
|
|
|
return { |
|
|
|
|
|
...prev, |
|
|
|
|
|
director: values, |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
setFilterOpen(true) |
|
|
|
|
|
}} |
|
|
|
|
|
/> |
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.writer`, 'Writer'), |
|
|
'title': t(`${i18nPrefix}.columns.writer`, 'Writer'), |
|
|
'dataIndex': 'writer', |
|
|
'dataIndex': 'writer', |
|
|
ellipsis: true, |
|
|
|
|
|
onHeaderCell: () => { |
|
|
|
|
|
return { |
|
|
|
|
|
width: 200, |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
width: 200, |
|
|
|
|
|
fieldProps: { |
|
|
|
|
|
style: { width: '100%' } |
|
|
|
|
|
}, |
|
|
|
|
|
render: (_dom, record) => { |
|
|
|
|
|
return <TagValue |
|
|
|
|
|
tags={record.writer?.split(',') ?? []} |
|
|
|
|
|
wrap={currentVideo?.id === record.id} |
|
|
|
|
|
value={search?.writer ?? []} |
|
|
|
|
|
onChange={(values) => { |
|
|
|
|
|
setSearch((prev: any) => { |
|
|
|
|
|
return { |
|
|
|
|
|
...prev, |
|
|
|
|
|
writer: values, |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
setFilterOpen(true) |
|
|
|
|
|
}} |
|
|
|
|
|
/> |
|
|
}, |
|
|
}, |
|
|
|
|
|
|
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.pubdate`, 'Pubdate'), |
|
|
|
|
|
'dataIndex': 'pubdate', |
|
|
|
|
|
valueType: 'dateTime' |
|
|
|
|
|
|
|
|
'title': t(`${i18nPrefix}.columns.remarks`, 'Remarks'), |
|
|
|
|
|
'dataIndex': 'remarks', |
|
|
|
|
|
hideInSearch: true, |
|
|
}, |
|
|
}, |
|
|
|
|
|
/* { |
|
|
|
|
|
'title': t(`${i18nPrefix}.columns.pubdate`, 'Pubdate'), |
|
|
|
|
|
'dataIndex': 'pubdate', |
|
|
|
|
|
valueType: 'dateTime', |
|
|
|
|
|
colProps: { |
|
|
|
|
|
span: 4 |
|
|
|
|
|
} |
|
|
|
|
|
},*/ |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.total`, 'Total'), |
|
|
'title': t(`${i18nPrefix}.columns.total`, 'Total'), |
|
|
'dataIndex': 'total', |
|
|
'dataIndex': 'total', |
|
|
valueType: 'digit' |
|
|
|
|
|
|
|
|
valueType: 'digit', |
|
|
|
|
|
colProps: { |
|
|
|
|
|
span: 4 |
|
|
|
|
|
}, |
|
|
|
|
|
hideInSearch: true, |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.serial`, 'Serial'), |
|
|
'title': t(`${i18nPrefix}.columns.serial`, 'Serial'), |
|
|
'dataIndex': 'serial', |
|
|
'dataIndex': 'serial', |
|
|
|
|
|
colProps: { |
|
|
|
|
|
span: 4 |
|
|
|
|
|
}, |
|
|
|
|
|
hideInSearch: true, |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.duration`, 'Duration'), |
|
|
'title': t(`${i18nPrefix}.columns.duration`, 'Duration'), |
|
|
'dataIndex': 'duration', |
|
|
'dataIndex': 'duration', |
|
|
|
|
|
colProps: { |
|
|
|
|
|
span: 4 |
|
|
|
|
|
}, |
|
|
|
|
|
hideInSearch: true, |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.class`, 'Class'), |
|
|
|
|
|
'dataIndex': 'class', |
|
|
|
|
|
|
|
|
'title': t(`${i18nPrefix}.columns.year`, 'Year'), |
|
|
|
|
|
'dataIndex': 'year', |
|
|
|
|
|
valueType: 'dateYear', |
|
|
|
|
|
fieldProps: { |
|
|
|
|
|
style: { |
|
|
|
|
|
width: '100%' |
|
|
|
|
|
} |
|
|
|
|
|
}, |
|
|
|
|
|
colProps: { |
|
|
|
|
|
span: openFilter ? 12 : 4, |
|
|
|
|
|
}, |
|
|
|
|
|
render: (_dom, record) => { |
|
|
|
|
|
if (record.year === undefined || record.year === null || record.year === 0) { |
|
|
|
|
|
return null |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
return <TagValue |
|
|
|
|
|
tags={[ record.year ]} |
|
|
|
|
|
wrap={currentVideo?.id === record.id} |
|
|
|
|
|
value={search?.year} |
|
|
|
|
|
single={true} |
|
|
|
|
|
onChange={(values) => { |
|
|
|
|
|
setSearch((prev: any) => { |
|
|
|
|
|
return { |
|
|
|
|
|
...prev, |
|
|
|
|
|
year: values[0], |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
setFilterOpen(true) |
|
|
|
|
|
}} |
|
|
|
|
|
/> |
|
|
|
|
|
}, |
|
|
|
|
|
renderFormItem: (_schema, config) => { |
|
|
|
|
|
const props = { ...config } as any |
|
|
|
|
|
delete props.mode |
|
|
|
|
|
const isForm = config.type === 'form' |
|
|
|
|
|
let value = isForm && config.value && config.value > 0 ? dayjs().set('year', config.value) : undefined |
|
|
|
|
|
if (config.value?.$isDayjsObject) { |
|
|
|
|
|
value = config.value as dayjs.Dayjs |
|
|
|
|
|
} |
|
|
|
|
|
return <DatePicker |
|
|
|
|
|
{..._schema.formItemProps} |
|
|
|
|
|
{...props} |
|
|
|
|
|
picker={'year'} |
|
|
|
|
|
value={value} |
|
|
|
|
|
/> |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
'title': t(`${i18nPrefix}.columns.tag`, 'Tag'), |
|
|
|
|
|
'dataIndex': 'tag', |
|
|
|
|
|
valueType: 'textarea', |
|
|
|
|
|
ellipsis: true, |
|
|
|
|
|
renderFormItem: (schema, config) => { |
|
|
|
|
|
return <TagPro loading={isCategoryFetching} |
|
|
|
|
|
tags={category?.extend?.class?.split(',') ?? []} {...config} {...schema.fieldProps} /> |
|
|
|
|
|
}, |
|
|
|
|
|
width: 200, |
|
|
|
|
|
fieldProps: { |
|
|
|
|
|
style: { width: '100%' } |
|
|
|
|
|
}, |
|
|
|
|
|
render: (_dom, record) => { |
|
|
|
|
|
return <TagValue |
|
|
|
|
|
tags={record.tag?.split(',') ?? []} |
|
|
|
|
|
wrap={currentVideo?.id === record.id} |
|
|
|
|
|
value={search?.tag ?? []} |
|
|
|
|
|
onChange={(values) => { |
|
|
|
|
|
setSearch((prev: any) => { |
|
|
|
|
|
return { |
|
|
|
|
|
...prev, |
|
|
|
|
|
tag: values, |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
setFilterOpen(true) |
|
|
|
|
|
}} |
|
|
|
|
|
/> |
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.area`, 'Area'), |
|
|
'title': t(`${i18nPrefix}.columns.area`, 'Area'), |
|
|
'dataIndex': 'area', |
|
|
'dataIndex': 'area', |
|
|
ellipsis: true, |
|
|
ellipsis: true, |
|
|
onHeaderCell: () => { |
|
|
|
|
|
return { |
|
|
|
|
|
width: 200, |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
width: 200, |
|
|
|
|
|
fieldProps: { |
|
|
|
|
|
style: { width: '100%' } |
|
|
|
|
|
}, |
|
|
|
|
|
render: (_dom, record) => { |
|
|
|
|
|
return <TagValue |
|
|
|
|
|
tags={record.area?.split(',') ?? []} |
|
|
|
|
|
wrap={currentVideo?.id === record.id} |
|
|
|
|
|
value={search?.area ?? []} |
|
|
|
|
|
onChange={(values) => { |
|
|
|
|
|
setSearch((prev: any) => { |
|
|
|
|
|
return { |
|
|
|
|
|
...prev, |
|
|
|
|
|
area: values, |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
setFilterOpen(true) |
|
|
|
|
|
}} |
|
|
|
|
|
/> |
|
|
}, |
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
renderFormItem: (schema, config) => { |
|
|
|
|
|
return <TagPro loading={isCategoryFetching} |
|
|
|
|
|
tags={category?.extend?.area?.split(',') ?? []} {...config} {...schema.fieldProps} /> |
|
|
|
|
|
} |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.lang`, 'Lang'), |
|
|
'title': t(`${i18nPrefix}.columns.lang`, 'Lang'), |
|
|
'dataIndex': 'lang', |
|
|
'dataIndex': 'lang', |
|
|
ellipsis: true, |
|
|
ellipsis: true, |
|
|
onHeaderCell: () => { |
|
|
|
|
|
return { |
|
|
|
|
|
width: 200, |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
width: 200, |
|
|
|
|
|
fieldProps: { |
|
|
|
|
|
style: { width: '100%' } |
|
|
}, |
|
|
}, |
|
|
|
|
|
render: (_dom, record) => { |
|
|
|
|
|
return <TagValue |
|
|
|
|
|
tags={record.lang?.split(',') ?? []} |
|
|
|
|
|
wrap={currentVideo?.id === record.id} |
|
|
|
|
|
value={search?.lang ?? []} |
|
|
|
|
|
onChange={(values) => { |
|
|
|
|
|
setSearch((prev: any) => { |
|
|
|
|
|
return { |
|
|
|
|
|
...prev, |
|
|
|
|
|
lang: values, |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
setFilterOpen(true) |
|
|
|
|
|
}} |
|
|
|
|
|
/> |
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
renderFormItem: (schema, config) => { |
|
|
|
|
|
return <TagPro loading={isCategoryFetching} |
|
|
|
|
|
tags={category?.extend?.lang?.split(',') ?? []} {...config} {...schema.fieldProps} /> |
|
|
|
|
|
} |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.version`, 'Version'), |
|
|
'title': t(`${i18nPrefix}.columns.version`, 'Version'), |
|
|
'dataIndex': 'version' |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
'title': t(`${i18nPrefix}.columns.year`, 'Year'), |
|
|
|
|
|
'dataIndex': 'year', |
|
|
|
|
|
valueType: 'dateYear' |
|
|
|
|
|
|
|
|
'dataIndex': 'version', |
|
|
|
|
|
|
|
|
|
|
|
width: 200, |
|
|
|
|
|
fieldProps: { |
|
|
|
|
|
style: { width: '100%' } |
|
|
|
|
|
}, |
|
|
|
|
|
render: (_dom, record) => { |
|
|
|
|
|
return <TagValue |
|
|
|
|
|
tags={record.version?.split(',') ?? []} |
|
|
|
|
|
wrap={currentVideo?.id === record.id} |
|
|
|
|
|
value={search?.version ?? []} |
|
|
|
|
|
onChange={(values) => { |
|
|
|
|
|
setSearch((prev: any) => { |
|
|
|
|
|
return { |
|
|
|
|
|
...prev, |
|
|
|
|
|
version: values, |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
setFilterOpen(true) |
|
|
|
|
|
}} |
|
|
|
|
|
/> |
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
renderFormItem: (schema, config) => { |
|
|
|
|
|
return <TagPro loading={isCategoryFetching} |
|
|
|
|
|
tags={category?.extend?.version?.split(',') ?? []} {...config} {...schema.fieldProps} /> |
|
|
|
|
|
} |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.state`, 'State'), |
|
|
'title': t(`${i18nPrefix}.columns.state`, 'State'), |
|
|
'dataIndex': 'state' |
|
|
|
|
|
|
|
|
'dataIndex': 'state', |
|
|
|
|
|
width: 200, |
|
|
|
|
|
fieldProps: { |
|
|
|
|
|
style: { width: '100%' } |
|
|
|
|
|
}, |
|
|
|
|
|
render: (_dom, record) => { |
|
|
|
|
|
return <TagValue |
|
|
|
|
|
tags={record.state?.split(',') ?? []} |
|
|
|
|
|
wrap={currentVideo?.id === record.id} |
|
|
|
|
|
value={search?.state ?? []} |
|
|
|
|
|
onChange={(values) => { |
|
|
|
|
|
setSearch((prev: any) => { |
|
|
|
|
|
return { |
|
|
|
|
|
...prev, |
|
|
|
|
|
state: values, |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
setFilterOpen(true) |
|
|
|
|
|
}} |
|
|
|
|
|
/> |
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
renderFormItem: (schema, config) => { |
|
|
|
|
|
return <TagPro loading={isCategoryFetching} |
|
|
|
|
|
tags={category?.extend?.state?.split(',') ?? []} {...config} {...schema.fieldProps} /> |
|
|
|
|
|
} |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.douban_score`, 'DoubanScore'), |
|
|
'title': t(`${i18nPrefix}.columns.douban_score`, 'DoubanScore'), |
|
|
'dataIndex': 'douban_score' |
|
|
|
|
|
|
|
|
'dataIndex': 'douban_score', |
|
|
|
|
|
hideInSearch: true, |
|
|
|
|
|
hideInSetting: true, |
|
|
|
|
|
formItemProps: { hidden: true }, |
|
|
|
|
|
hideInTable: true, |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.douban_id`, 'DoubanId'), |
|
|
'title': t(`${i18nPrefix}.columns.douban_id`, 'DoubanId'), |
|
@ -252,7 +569,11 @@ const VideoMagnet = () => { |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.imdb_score`, 'ImdbScore'), |
|
|
'title': t(`${i18nPrefix}.columns.imdb_score`, 'ImdbScore'), |
|
|
'dataIndex': 'imdb_score' |
|
|
|
|
|
|
|
|
'dataIndex': 'imdb_score', |
|
|
|
|
|
hideInSearch: true, |
|
|
|
|
|
hideInSetting: true, |
|
|
|
|
|
formItemProps: { hidden: true }, |
|
|
|
|
|
hideInTable: true, |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
'title': t(`${i18nPrefix}.columns.imdb_id`, 'ImdbId'), |
|
|
'title': t(`${i18nPrefix}.columns.imdb_id`, 'ImdbId'), |
|
@ -270,9 +591,9 @@ const VideoMagnet = () => { |
|
|
onHeaderCell: () => ({ |
|
|
onHeaderCell: () => ({ |
|
|
width: 200, |
|
|
width: 200, |
|
|
}), |
|
|
}), |
|
|
|
|
|
hideInSearch: true, |
|
|
}, |
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
{ |
|
|
{ |
|
|
title: t(`${i18nPrefix}.columns.option`, '操作'), |
|
|
title: t(`${i18nPrefix}.columns.option`, '操作'), |
|
|
key: 'option', |
|
|
key: 'option', |
|
@ -282,6 +603,7 @@ const VideoMagnet = () => { |
|
|
<Action key="edit" |
|
|
<Action key="edit" |
|
|
as={'a'} |
|
|
as={'a'} |
|
|
onClick={() => { |
|
|
onClick={() => { |
|
|
|
|
|
setCategoryId(record.category_id) |
|
|
form.setFieldsValue(record) |
|
|
form.setFieldsValue(record) |
|
|
setOpen(true) |
|
|
setOpen(true) |
|
|
}}>{t('actions.edit')}</Action>, |
|
|
}}>{t('actions.edit')}</Action>, |
|
@ -299,7 +621,14 @@ const VideoMagnet = () => { |
|
|
] |
|
|
] |
|
|
} |
|
|
} |
|
|
] as ProColumns[] |
|
|
] as ProColumns[] |
|
|
}, [ isDeleting ]) |
|
|
|
|
|
|
|
|
}, [ isDeleting, category, isCategoryFetching, categories, isCateLoading, category, currentVideo, search, openFilter ]) |
|
|
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
|
|
|
|
|
|
|
|
setSearchKey(search?.title) |
|
|
|
|
|
filterForm.setFieldsValue(search) |
|
|
|
|
|
|
|
|
|
|
|
}, [ search ]) |
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
useEffect(() => { |
|
|
if (isSuccess) { |
|
|
if (isSuccess) { |
|
@ -308,7 +637,7 @@ const VideoMagnet = () => { |
|
|
}, [ isSuccess ]) |
|
|
}, [ isSuccess ]) |
|
|
|
|
|
|
|
|
return ( |
|
|
return ( |
|
|
<ListPageLayout> |
|
|
|
|
|
|
|
|
<ListPageLayout className={styles.container}> |
|
|
<ProTable |
|
|
<ProTable |
|
|
rowKey="id" |
|
|
rowKey="id" |
|
|
headerTitle={t(`${i18nPrefix}.title`, '磁链视频管理')} |
|
|
headerTitle={t(`${i18nPrefix}.title`, '磁链视频管理')} |
|
@ -321,15 +650,30 @@ const VideoMagnet = () => { |
|
|
key: value |
|
|
key: value |
|
|
})) |
|
|
})) |
|
|
}, |
|
|
}, |
|
|
|
|
|
onChange: (e) => { |
|
|
|
|
|
setSearchKey(e.target?.value) |
|
|
|
|
|
}, |
|
|
|
|
|
value: searchKey, |
|
|
allowClear: true, |
|
|
allowClear: true, |
|
|
placeholder: t(`${i18nPrefix}.placeholder`, '输入磁链视频名称') |
|
|
placeholder: t(`${i18nPrefix}.placeholder`, '输入磁链视频名称') |
|
|
}, |
|
|
}, |
|
|
actions: [ |
|
|
actions: [ |
|
|
|
|
|
<Tooltip key={'filter'} title={t(`${i18nPrefix}.filter.tooltip`, '高级查询')}> |
|
|
|
|
|
<Badge count={getValueCount(search)}> |
|
|
|
|
|
<Button |
|
|
|
|
|
onClick={() => { |
|
|
|
|
|
setFilterOpen(true) |
|
|
|
|
|
}} |
|
|
|
|
|
icon={<FilterOutlined/>} shape={'circle'} size={'small'}/> |
|
|
|
|
|
</Badge> |
|
|
|
|
|
</Tooltip>, |
|
|
|
|
|
<Divider type={'vertical'} key={'divider'}/>, |
|
|
<Button |
|
|
<Button |
|
|
onClick={() => { |
|
|
onClick={() => { |
|
|
form.resetFields() |
|
|
form.resetFields() |
|
|
form.setFieldsValue({ |
|
|
form.setFieldsValue({ |
|
|
id: 0, |
|
|
id: 0, |
|
|
|
|
|
type_id: 1, |
|
|
}) |
|
|
}) |
|
|
setOpen(true) |
|
|
setOpen(true) |
|
|
}} |
|
|
}} |
|
@ -337,8 +681,19 @@ const VideoMagnet = () => { |
|
|
] |
|
|
] |
|
|
}} |
|
|
}} |
|
|
scroll={{ |
|
|
scroll={{ |
|
|
x: 3500, |
|
|
|
|
|
|
|
|
x: 3500, y: 'calc(100vh - 290px)' |
|
|
|
|
|
}} |
|
|
|
|
|
onRow={(record) => { |
|
|
|
|
|
return { |
|
|
|
|
|
className: cx({ |
|
|
|
|
|
'ant-table-row-selected': currentVideo?.id === record.id |
|
|
|
|
|
}), |
|
|
|
|
|
onClick: () => { |
|
|
|
|
|
setVideo(record) |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
}} |
|
|
}} |
|
|
|
|
|
dateFormatter="string" |
|
|
loading={isLoading || isFetching} |
|
|
loading={isLoading || isFetching} |
|
|
dataSource={data?.rows ?? []} |
|
|
dataSource={data?.rows ?? []} |
|
|
columns={columns} |
|
|
columns={columns} |
|
@ -365,14 +720,15 @@ const VideoMagnet = () => { |
|
|
}} |
|
|
}} |
|
|
/> |
|
|
/> |
|
|
<BetaSchemaForm |
|
|
<BetaSchemaForm |
|
|
|
|
|
grid={true} |
|
|
shouldUpdate={false} |
|
|
shouldUpdate={false} |
|
|
width={600} |
|
|
|
|
|
|
|
|
width={1000} |
|
|
form={form} |
|
|
form={form} |
|
|
layout={'vertical'} |
|
|
layout={'vertical'} |
|
|
scrollToFirstError={true} |
|
|
scrollToFirstError={true} |
|
|
title={t(`${i18nPrefix}.title_${form.getFieldValue('id') !== 0 ? 'edit' : 'add'}`, form.getFieldValue('id') !== 0 ? '磁链视频编辑' : '磁链视频添加')} |
|
|
title={t(`${i18nPrefix}.title_${form.getFieldValue('id') !== 0 ? 'edit' : 'add'}`, form.getFieldValue('id') !== 0 ? '磁链视频编辑' : '磁链视频添加')} |
|
|
// colProps={{ span: 24 }}
|
|
|
// colProps={{ span: 24 }}
|
|
|
labelCol={{ span: 6 }} |
|
|
|
|
|
|
|
|
// labelCol={{ span: 6 }}
|
|
|
// wrapperCol={{ span: 14 }}
|
|
|
// wrapperCol={{ span: 14 }}
|
|
|
layoutType={'DrawerForm'} |
|
|
layoutType={'DrawerForm'} |
|
|
open={open} |
|
|
open={open} |
|
@ -389,6 +745,74 @@ const VideoMagnet = () => { |
|
|
|
|
|
|
|
|
}} |
|
|
}} |
|
|
columns={columns as ProFormColumnsType[]}/> |
|
|
columns={columns as ProFormColumnsType[]}/> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<BetaSchemaForm |
|
|
|
|
|
title={t(`${i18nPrefix}.filter.title`, '高级查询')} |
|
|
|
|
|
grid={true} |
|
|
|
|
|
shouldUpdate={false} |
|
|
|
|
|
width={500} |
|
|
|
|
|
name={'filterForm'} |
|
|
|
|
|
form={filterForm} |
|
|
|
|
|
open={openFilter} |
|
|
|
|
|
onOpenChange={open => { |
|
|
|
|
|
setFilterOpen(open) |
|
|
|
|
|
}} |
|
|
|
|
|
layout={'vertical'} |
|
|
|
|
|
scrollToFirstError={true} |
|
|
|
|
|
layoutType={'DrawerForm'} |
|
|
|
|
|
drawerProps={{ |
|
|
|
|
|
maskClosable: false, |
|
|
|
|
|
mask: false, |
|
|
|
|
|
}} |
|
|
|
|
|
submitter={{ |
|
|
|
|
|
searchConfig: { |
|
|
|
|
|
resetText: t(`${i18nPrefix}.filter.reset`, '清空'), |
|
|
|
|
|
submitText: t(`${i18nPrefix}.filter.submit`, '查询'), |
|
|
|
|
|
}, |
|
|
|
|
|
onReset: () => { |
|
|
|
|
|
filterForm.resetFields() |
|
|
|
|
|
}, |
|
|
|
|
|
render: (props,) => { |
|
|
|
|
|
return ( |
|
|
|
|
|
<div style={{ textAlign: 'right' }}> |
|
|
|
|
|
<Space> |
|
|
|
|
|
<Button onClick={() => { |
|
|
|
|
|
props.reset() |
|
|
|
|
|
|
|
|
|
|
|
}}>{props.searchConfig?.resetText}</Button> |
|
|
|
|
|
<Button type="primary" |
|
|
|
|
|
onClick={() => { |
|
|
|
|
|
props.submit() |
|
|
|
|
|
}} |
|
|
|
|
|
>{props.searchConfig?.submitText}</Button> |
|
|
|
|
|
</Space> |
|
|
|
|
|
</div> |
|
|
|
|
|
) |
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
}} |
|
|
|
|
|
onValuesChange={(values) => { |
|
|
|
|
|
if (values.category_id) { |
|
|
|
|
|
setCategoryId(values.category_id) |
|
|
|
|
|
} |
|
|
|
|
|
}} |
|
|
|
|
|
|
|
|
|
|
|
onFinish={async (values) => { |
|
|
|
|
|
// console.log('values', values)
|
|
|
|
|
|
//处理,变成数组
|
|
|
|
|
|
Object.keys(values).forEach(key => { |
|
|
|
|
|
if (typeof values[key] === 'string' && values[key].includes(',')) { |
|
|
|
|
|
values[key] = values[key].split(',') |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
|
|
setSearch(values) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}} |
|
|
|
|
|
columns={columns.filter(item => !item.hideInSearch) as ProFormColumnsType[]}/> |
|
|
|
|
|
|
|
|
</ListPageLayout> |
|
|
</ListPageLayout> |
|
|
) |
|
|
) |
|
|
} |
|
|
} |
|
|