Browse Source

修复columns宽度

main
dark 6 months ago
parent
commit
d9c35f52fa
  1. 2
      src/locales/lang/pages/videos/list/zh-CN.ts
  2. 99
      src/pages/videos/list/index.tsx

2
src/locales/lang/pages/videos/list/zh-CN.ts

@ -44,7 +44,7 @@ export default {
douban_score: '豆瓣评分', douban_score: '豆瓣评分',
douban_id: '豆瓣ID', douban_id: '豆瓣ID',
imdb_score: 'imdb评分', imdb_score: 'imdb评分',
imdb_id: 'imdb的id',
imdb_id: 'imdbId',
content: '内容', content: '内容',
created_at: '创建时间', created_at: '创建时间',
updated_at: '更新时间' updated_at: '更新时间'

99
src/pages/videos/list/index.tsx

@ -8,13 +8,11 @@ import {
saveOrUpdateVideoAtom, videosAtom, videoSearchAtom, videoTypes saveOrUpdateVideoAtom, videosAtom, videoSearchAtom, videoTypes
} from '@/store/videos/video.ts' } from '@/store/videos/video.ts'
import { useEffect, useMemo, useState } from 'react' import { useEffect, useMemo, useState } from 'react'
import Switch from '@/components/switch'
import Action from '@/components/action/Action.tsx' import Action from '@/components/action/Action.tsx'
import { import {
BetaSchemaForm, BetaSchemaForm,
ProColumns, ProColumns,
ProFormColumnsType, ProFormColumnsType,
ProFormDatePicker,
ProFormUploadButton, ProFormUploadButton,
ProTable ProTable
} from '@ant-design/pro-components' } from '@ant-design/pro-components'
@ -57,22 +55,20 @@ const Video = () => {
{ {
'title': t(`${i18nPrefix}.columns.title`, 'Title'), 'title': t(`${i18nPrefix}.columns.title`, 'Title'),
'dataIndex': 'title', 'dataIndex': 'title',
onHeaderCell: () => {
return {
width: 200,
}
width: 200,
fieldProps: {
style: { width: '100%' }
}, },
colProps: { colProps: {
span: 8 span: 8
}
},
}, },
{ {
'title': t(`${i18nPrefix}.columns.title_sub`, 'TitleSub'), 'title': t(`${i18nPrefix}.columns.title_sub`, 'TitleSub'),
'dataIndex': 'title_sub', 'dataIndex': 'title_sub',
onHeaderCell: () => {
return {
width: 200,
}
width: 200,
fieldProps: {
style: { width: '100%' }
}, },
colProps: { colProps: {
span: 16 span: 16
@ -82,8 +78,10 @@ const Video = () => {
'title': t(`${i18nPrefix}.columns.type_id`, 'TypeId'), 'title': t(`${i18nPrefix}.columns.type_id`, 'TypeId'),
'dataIndex': 'type_id', 'dataIndex': 'type_id',
valueType: 'select', valueType: 'select',
width: 100,
fieldProps: { fieldProps: {
options: videoTypes, options: videoTypes,
style: { width: '100%' }
}, },
render: (_dom, record) => { render: (_dom, record) => {
return t(`${i18nPrefix}.type_id.${record.type_id}`) return t(`${i18nPrefix}.type_id.${record.type_id}`)
@ -106,6 +104,10 @@ const Video = () => {
{ {
'title': t(`${i18nPrefix}.columns.year`, 'Year'), 'title': t(`${i18nPrefix}.columns.year`, 'Year'),
'dataIndex': 'year', 'dataIndex': 'year',
width: 100,
fieldProps: {
style: { width: '100%' }
},
valueType: 'dateYear', valueType: 'dateYear',
colProps: { colProps: {
span: 4 span: 4
@ -125,6 +127,10 @@ const Video = () => {
{ {
'title': t(`${i18nPrefix}.columns.category_id`, 'CategoryId'), 'title': t(`${i18nPrefix}.columns.category_id`, 'CategoryId'),
'dataIndex': 'class_name', 'dataIndex': 'class_name',
width: 100,
fieldProps: {
style: { width: '100%' }
},
colProps: { colProps: {
span: 12 span: 12
@ -133,6 +139,7 @@ const Video = () => {
{ {
'title': t(`${i18nPrefix}.columns.douban_id`, 'DouBanId'), 'title': t(`${i18nPrefix}.columns.douban_id`, 'DouBanId'),
'dataIndex': 'douban_id', 'dataIndex': 'douban_id',
hideInTable: true,
colProps: { colProps: {
span: 6 span: 6
}, },
@ -140,6 +147,7 @@ const Video = () => {
{ {
'title': t(`${i18nPrefix}.columns.imdb_id`, 'ImdbId'), 'title': t(`${i18nPrefix}.columns.imdb_id`, 'ImdbId'),
'dataIndex': 'imdb_id', 'dataIndex': 'imdb_id',
hideInTable: true,
colProps: { colProps: {
span: 6 span: 6
}, },
@ -147,6 +155,7 @@ const Video = () => {
{ {
'title': t(`${i18nPrefix}.columns.rt_id`, 'RtId'), 'title': t(`${i18nPrefix}.columns.rt_id`, 'RtId'),
'dataIndex': 'rt_id', 'dataIndex': 'rt_id',
hideInTable: true,
colProps: { colProps: {
span: 6 span: 6
}, },
@ -154,6 +163,7 @@ const Video = () => {
{ {
'title': t(`${i18nPrefix}.columns.mal_id`, 'MalId'), 'title': t(`${i18nPrefix}.columns.mal_id`, 'MalId'),
'dataIndex': 'mal_id', 'dataIndex': 'mal_id',
hideInTable: true,
colProps: { colProps: {
span: 6 span: 6
}, },
@ -187,29 +197,37 @@ const Video = () => {
'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%' }
}, },
}, },
{ {
'title': t(`${i18nPrefix}.columns.director`, 'Director'), 'title': t(`${i18nPrefix}.columns.director`, 'Director'),
'dataIndex': 'director'
'dataIndex': 'director',
width: 200,
fieldProps: {
style: { width: '100%' }
},
}, },
{ {
'title': t(`${i18nPrefix}.columns.writer`, 'Writer'), 'title': t(`${i18nPrefix}.columns.writer`, 'Writer'),
'dataIndex': 'writer'
'dataIndex': 'writer',
width: 200,
fieldProps: {
style: { width: '100%' }
},
}, },
{ {
'title': t(`${i18nPrefix}.columns.content`, 'Content'), 'title': t(`${i18nPrefix}.columns.content`, 'Content'),
'dataIndex': 'content', 'dataIndex': 'content',
valueType: 'textarea', valueType: 'textarea',
ellipsis: true, ellipsis: true,
onHeaderCell: () => ({
width: 200,
}),
width: 200,
fieldProps: {
style: { width: '100%' }
},
}, },
// { // {
// 'title': t(`${i18nPrefix}.columns.remarks`, 'Remarks'), // 'title': t(`${i18nPrefix}.columns.remarks`, 'Remarks'),
@ -222,10 +240,9 @@ const Video = () => {
'dataIndex': 'tag', 'dataIndex': 'tag',
valueType: 'textarea', valueType: 'textarea',
ellipsis: true, ellipsis: true,
onHeaderCell: () => {
return {
width: 200,
}
width: 200,
fieldProps: {
style: { width: '100%' }
}, },
renderFormItem: (schema, config) => { renderFormItem: (schema, config) => {
return <TagPro loading={isCategoryFetching} return <TagPro loading={isCategoryFetching}
@ -236,10 +253,9 @@ const Video = () => {
'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%' }
}, },
renderFormItem: (schema, config) => { renderFormItem: (schema, config) => {
return <TagPro loading={isCategoryFetching} return <TagPro loading={isCategoryFetching}
@ -250,10 +266,9 @@ const Video = () => {
'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%' }
}, },
renderFormItem: (schema, config) => { renderFormItem: (schema, config) => {
return <TagPro loading={isCategoryFetching} return <TagPro loading={isCategoryFetching}
@ -285,14 +300,7 @@ const Video = () => {
formItemProps: { hidden: true }, formItemProps: { hidden: true },
hideInTable: true, hideInTable: true,
}, },
{
'title': t(`${i18nPrefix}.columns.douban_id`, 'DoubanId'),
'dataIndex': 'douban_id',
hideInSearch: true,
hideInSetting: true,
formItemProps: { hidden: true },
hideInTable: true,
},
{ {
'title': t(`${i18nPrefix}.columns.imdb_score`, 'ImdbScore'), 'title': t(`${i18nPrefix}.columns.imdb_score`, 'ImdbScore'),
'dataIndex': 'imdb_score', 'dataIndex': 'imdb_score',
@ -301,14 +309,7 @@ const Video = () => {
formItemProps: { hidden: true }, formItemProps: { hidden: true },
hideInTable: true, hideInTable: true,
}, },
{
'title': t(`${i18nPrefix}.columns.imdb_id`, 'ImdbId'),
'dataIndex': 'imdb_id',
hideInSearch: true,
hideInSetting: true,
formItemProps: { hidden: true },
hideInTable: true,
},
{ {
title: t(`${i18nPrefix}.columns.option`, '操作'), title: t(`${i18nPrefix}.columns.option`, '操作'),
@ -375,7 +376,7 @@ const Video = () => {
] ]
}} }}
scroll={{ scroll={{
x: 3500,
x: 2500, y: 'calc(100vh - 290px)'
}} }}
loading={isLoading || isFetching} loading={isLoading || isFetching}
dataSource={data?.rows ?? []} dataSource={data?.rows ?? []}

Loading…
Cancel
Save