130 lines
4.2 KiB
TypeScript
130 lines
4.2 KiB
TypeScript
|
|
import { MyButtons, MyColumns, MyProTableProps } from '@/common';
|
|||
|
|
import { Apis } from '@/gen/Apis';
|
|||
|
|
import { ProTable } from '@ant-design/pro-components';
|
|||
|
|
import { Space } from 'antd';
|
|||
|
|
import { useEffect, useRef } from 'react';
|
|||
|
|
import AnnouncementCreate from './modals/AnnouncementCreate';
|
|||
|
|
import AnnouncementShow from './modals/AnnouncementShow';
|
|||
|
|
import AnnouncementUpdate from './modals/AnnouncementUpdate';
|
|||
|
|
|
|||
|
|
export default function Index({ ...rest }) {
|
|||
|
|
const actionLooks = useRef<any>();
|
|||
|
|
useEffect(() => {
|
|||
|
|
actionLooks?.current.reloadAndRest();
|
|||
|
|
}, [rest.loadmore]);
|
|||
|
|
|
|||
|
|
return (
|
|||
|
|
<>
|
|||
|
|
<ProTable<Record<any, any>>
|
|||
|
|
{...MyProTableProps.props}
|
|||
|
|
actionRef={actionLooks}
|
|||
|
|
request={async (params, sort) =>
|
|||
|
|
MyProTableProps.request(
|
|||
|
|
{ ...params, asset_projects_id: rest.item?.id },
|
|||
|
|
sort,
|
|||
|
|
Apis.Msg.MsgPropertyAnnouncements.List,
|
|||
|
|
)
|
|||
|
|
}
|
|||
|
|
toolBarRender={(action) => [
|
|||
|
|
<AnnouncementCreate
|
|||
|
|
key="Create"
|
|||
|
|
item={rest.item}
|
|||
|
|
reload={action?.reload}
|
|||
|
|
/>,
|
|||
|
|
]}
|
|||
|
|
search={false}
|
|||
|
|
columns={[
|
|||
|
|
MyColumns.ID(),
|
|||
|
|
|
|||
|
|
{
|
|||
|
|
title: '公告标题',
|
|||
|
|
dataIndex: 'title',
|
|||
|
|
width: 120, // 关键:固定列宽(若父容器过窄,可设 minWidth: 200 优先保证列宽)
|
|||
|
|
render: (text) => (
|
|||
|
|
<div
|
|||
|
|
style={{
|
|||
|
|
width: '100%', // 继承列宽
|
|||
|
|
// height: '60px', // 设置固定高度,约显示3行文本
|
|||
|
|
overflow: 'hidden', // 超出隐藏
|
|||
|
|
textOverflow: 'ellipsis', // 省略号
|
|||
|
|
display: '-webkit-box',
|
|||
|
|
WebkitBoxOrient: 'vertical',
|
|||
|
|
WebkitLineClamp: 1, // 显示3行
|
|||
|
|
}}
|
|||
|
|
>
|
|||
|
|
{text}
|
|||
|
|
</div>
|
|||
|
|
),
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: '公告内容',
|
|||
|
|
dataIndex: 'content',
|
|||
|
|
valueType: 'textarea', // 仅影响表单编辑时的输入类型,不影响表格展示
|
|||
|
|
search: false,
|
|||
|
|
width: 200, // 关键:固定列宽(若父容器过窄,可设 minWidth: 200 优先保证列宽)
|
|||
|
|
render: (text) => (
|
|||
|
|
<div
|
|||
|
|
style={{
|
|||
|
|
width: '100%', // 继承列宽
|
|||
|
|
// height: '60px', // 设置固定高度,约显示3行文本
|
|||
|
|
overflow: 'hidden', // 超出隐藏
|
|||
|
|
textOverflow: 'ellipsis', // 省略号
|
|||
|
|
display: '-webkit-box',
|
|||
|
|
WebkitBoxOrient: 'vertical',
|
|||
|
|
WebkitLineClamp: 2, // 显示3行
|
|||
|
|
}}
|
|||
|
|
>
|
|||
|
|
{text}
|
|||
|
|
</div>
|
|||
|
|
),
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: '发布日期',
|
|||
|
|
dataIndex: 'publish_at',
|
|||
|
|
valueType: 'date',
|
|||
|
|
search: false,
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: '是否发布小程序',
|
|||
|
|
dataIndex: 'is_publish',
|
|||
|
|
render: (text) => (text ? '是' : '否'),
|
|||
|
|
search: false,
|
|||
|
|
},
|
|||
|
|
MyColumns.SoftDelete({
|
|||
|
|
title: '启/禁用',
|
|||
|
|
onRestore: Apis.Msg.MsgPropertyAnnouncements.Restore,
|
|||
|
|
onSoftDelete: Apis.Msg.MsgPropertyAnnouncements.SoftDelete,
|
|||
|
|
search: false,
|
|||
|
|
}),
|
|||
|
|
{
|
|||
|
|
//创建日期
|
|||
|
|
title: '创建日期',
|
|||
|
|
dataIndex: 'created_at',
|
|||
|
|
valueType: 'date',
|
|||
|
|
search: false,
|
|||
|
|
},
|
|||
|
|
MyColumns.Option({
|
|||
|
|
render: (_, item: any, index, action) => (
|
|||
|
|
<Space key={index}>
|
|||
|
|
<AnnouncementShow item={item} />
|
|||
|
|
<AnnouncementUpdate
|
|||
|
|
item={item}
|
|||
|
|
reload={action?.reload}
|
|||
|
|
// title={title}
|
|||
|
|
/>
|
|||
|
|
<MyButtons.Delete
|
|||
|
|
onConfirm={() =>
|
|||
|
|
Apis.Msg.MsgPropertyAnnouncements.Delete({
|
|||
|
|
id: item.id,
|
|||
|
|
}).then(() => action?.reload())
|
|||
|
|
}
|
|||
|
|
/>
|
|||
|
|
</Space>
|
|||
|
|
),
|
|||
|
|
}),
|
|||
|
|
]}
|
|||
|
|
/>
|
|||
|
|
</>
|
|||
|
|
);
|
|||
|
|
}
|