mirror of
https://gitee.com/nocobase/nocobase.git
synced 2024-12-05 21:57:45 +08:00
fix(collection-manager): fix table layout
This commit is contained in:
parent
25d2ebf02a
commit
683db5b3ba
@ -24,11 +24,10 @@ import { OverridingCollectionField } from './OverridingCollectionField';
|
||||
import { SyncFieldsAction } from './SyncFieldsAction';
|
||||
import { ViewCollectionField } from './ViewInheritedField';
|
||||
import { collection } from './schemas/collectionFields';
|
||||
const CELL_WIDTH = 200;
|
||||
|
||||
const indentStyle = css`
|
||||
.ant-table {
|
||||
margin-left: -7px !important;
|
||||
margin-left: -16px !important;
|
||||
}
|
||||
`;
|
||||
const rowStyle = css`
|
||||
@ -36,6 +35,25 @@ const rowStyle = css`
|
||||
background-color: white;
|
||||
}
|
||||
`;
|
||||
const tableContainer = css`
|
||||
tr {
|
||||
display: flex;
|
||||
}
|
||||
td,
|
||||
th {
|
||||
flex: 2;
|
||||
width: 0;
|
||||
&:last-child {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
.ant-table-selection-column,
|
||||
.ant-table-row-expand-icon-cell {
|
||||
flex-basis: 50px !important;
|
||||
min-width: 50px;
|
||||
flex: 0;
|
||||
}
|
||||
`;
|
||||
|
||||
const titlePrompt = 'Default title for each record';
|
||||
// 只有下面类型的字段才可以设置为标题字段
|
||||
@ -67,18 +85,15 @@ const CurrentFields = (props) => {
|
||||
{
|
||||
dataIndex: 'name',
|
||||
title: t('Field name'),
|
||||
width: CELL_WIDTH + 20,
|
||||
},
|
||||
{
|
||||
dataIndex: 'interface',
|
||||
title: t('Field interface'),
|
||||
width: CELL_WIDTH,
|
||||
render: (value) => <Tag>{compile(getInterface(value)?.title)}</Tag>,
|
||||
},
|
||||
{
|
||||
dataIndex: 'titleField',
|
||||
title: t('Title field'),
|
||||
width: CELL_WIDTH,
|
||||
render: function Render(_, record) {
|
||||
const handleChange = (checked) => {
|
||||
setLoadingRecord(record);
|
||||
@ -112,7 +127,6 @@ const CurrentFields = (props) => {
|
||||
{
|
||||
dataIndex: 'actions',
|
||||
title: t('Actions'),
|
||||
width: CELL_WIDTH,
|
||||
render: (_, record) => {
|
||||
const deleteProps = {
|
||||
confirm: {
|
||||
@ -177,18 +191,15 @@ const InheritFields = (props) => {
|
||||
{
|
||||
dataIndex: 'name',
|
||||
title: t('Field name'),
|
||||
width: CELL_WIDTH + 20,
|
||||
},
|
||||
{
|
||||
dataIndex: 'interface',
|
||||
title: t('Field interface'),
|
||||
width: CELL_WIDTH,
|
||||
render: (value) => <Tag>{compile(getInterface(value)?.title)}</Tag>,
|
||||
},
|
||||
{
|
||||
dataIndex: 'titleField',
|
||||
title: t('Title field'),
|
||||
width: CELL_WIDTH,
|
||||
render(_, record) {
|
||||
const handleChange = (checked) => {
|
||||
setLoadingRecord(record);
|
||||
@ -222,7 +233,6 @@ const InheritFields = (props) => {
|
||||
{
|
||||
dataIndex: 'actions',
|
||||
title: t('Actions'),
|
||||
width: CELL_WIDTH,
|
||||
render: function Render(_, record) {
|
||||
const overrideProps = {
|
||||
type: 'primary',
|
||||
@ -275,34 +285,27 @@ export const CollectionFields = (props) => {
|
||||
<div
|
||||
className={css`
|
||||
font-weight: 500;
|
||||
white-space: nowrap;
|
||||
width: 100px;
|
||||
`}
|
||||
>
|
||||
{value}
|
||||
</div>
|
||||
),
|
||||
// width: CELL_WIDTH,
|
||||
},
|
||||
{
|
||||
dataIndex: 'name',
|
||||
title: t('Field name'),
|
||||
width: CELL_WIDTH + 20,
|
||||
},
|
||||
{
|
||||
dataIndex: 'interface',
|
||||
title: t('Field interface'),
|
||||
width: CELL_WIDTH,
|
||||
},
|
||||
{
|
||||
dataIndex: 'titleField',
|
||||
title: t('Title field'),
|
||||
width: CELL_WIDTH,
|
||||
},
|
||||
{
|
||||
dataIndex: 'actions',
|
||||
title: t('Actions'),
|
||||
width: CELL_WIDTH,
|
||||
},
|
||||
];
|
||||
|
||||
@ -420,6 +423,7 @@ export const CollectionFields = (props) => {
|
||||
columns={columns}
|
||||
dataSource={dataSource.filter((d) => d.fields.length)}
|
||||
pagination={false}
|
||||
className={tableContainer}
|
||||
expandable={{
|
||||
defaultExpandAllRows: true,
|
||||
expandedRowClassName: () => rowStyle,
|
||||
|
Loading…
Reference in New Issue
Block a user