Commit 2ec9b0ad by zhaochengxiang

定义行高

parent 3f2087eb
...@@ -397,6 +397,10 @@ svg { ...@@ -397,6 +397,10 @@ svg {
} }
.rdg-row { .rdg-row {
&:hover {
background-color: #fafafa;
}
.rdg-cell { .rdg-cell {
box-shadow: none !important; box-shadow: none !important;
color: #363636 !important; color: #363636 !important;
......
...@@ -592,6 +592,7 @@ const ModelTable = (props) => { ...@@ -592,6 +592,7 @@ const ModelTable = (props) => {
checkable checkable
columns={columns} columns={columns}
rows={modelId?(subData||[]):(data||[])} rows={modelId?(subData||[]):(data||[])}
rowHeight={modelId?39: 51}
rowExpandable={(row) => { rowExpandable={(row) => {
return row?.alreadyCheckedOut; return row?.alreadyCheckedOut;
}} }}
......
...@@ -6,6 +6,7 @@ import type { RowRendererProps, DataGridHandle, CheckboxFormatterProps } from 'r ...@@ -6,6 +6,7 @@ import type { RowRendererProps, DataGridHandle, CheckboxFormatterProps } from 'r
import classNames from 'classnames'; import classNames from 'classnames';
import { Checkbox, Empty } from 'antd'; import { Checkbox, Empty } from 'antd';
import type { CheckboxChangeEvent } from 'antd/es/checkbox'; import type { CheckboxChangeEvent } from 'antd/es/checkbox';
import { DownOutlined, UpOutlined } from '@ant-design/icons';
import { nanoid } from 'nanoid'; import { nanoid } from 'nanoid';
import { downNode, upNode } from './test-table-helper'; import { downNode, upNode } from './test-table-helper';
...@@ -45,6 +46,8 @@ interface Props<Row> { ...@@ -45,6 +46,8 @@ interface Props<Row> {
loadMoreRows?: (length: number) => Promise<Row[]> | undefined loadMoreRows?: (length: number) => Promise<Row[]> | undefined
selectedRows?: Array<any> selectedRows?: Array<any>
onSelectedRowsChange?: (selectedRows: Array<any>) => void onSelectedRowsChange?: (selectedRows: Array<any>) => void
rowHeight?: number
expandedRowHeight?: number
} }
const CheckboxFormatter = forwardRef<HTMLInputElement, CheckboxFormatterProps>( const CheckboxFormatter = forwardRef<HTMLInputElement, CheckboxFormatterProps>(
...@@ -97,7 +100,7 @@ export function getExpandingCol<Row extends RowData, SR>({ colSpan, expand, expa ...@@ -97,7 +100,7 @@ export function getExpandingCol<Row extends RowData, SR>({ colSpan, expand, expa
}); });
}} }}
> >
{row.__expanded__ ? '\u25BC' : '\u25B6'} {row.__expanded__ ? <UpOutlined /> : <DownOutlined />}
</div> </div>
); );
} }
...@@ -113,7 +116,7 @@ function FC<Row extends RowData, SR, K extends React.Key = React.Key>(props: Dat ...@@ -113,7 +116,7 @@ function FC<Row extends RowData, SR, K extends React.Key = React.Key>(props: Dat
getComparator, getComparator,
loadMoreRows, loadMoreRows,
onSelectedRowsChange, onSelectedRowsChange,
contextMenu, columns, rows, checkable, selectedRows, ...rest } = props contextMenu, columns, rows, checkable, selectedRows, rowHeight = 45, expandedRowHeight = 1000, ...rest } = props
const rowKeyGetter = (row: Row): K => { const rowKeyGetter = (row: Row): K => {
return row.id as K; return row.id as K;
...@@ -143,6 +146,7 @@ function FC<Row extends RowData, SR, K extends React.Key = React.Key>(props: Dat ...@@ -143,6 +146,7 @@ function FC<Row extends RowData, SR, K extends React.Key = React.Key>(props: Dat
// 已排序行 // 已排序行
const [sortColumns, setSortColumns] = useState<readonly SortColumn[]>([]); // 排序列图标状态 const [sortColumns, setSortColumns] = useState<readonly SortColumn[]>([]); // 排序列图标状态
const [_rows, _setRows] = useState<readonly Row[]>([]) const [_rows, _setRows] = useState<readonly Row[]>([])
useEffect(() => { useEffect(() => {
const newRows = [...rows]; const newRows = [...rows];
...@@ -192,7 +196,7 @@ function FC<Row extends RowData, SR, K extends React.Key = React.Key>(props: Dat ...@@ -192,7 +196,7 @@ function FC<Row extends RowData, SR, K extends React.Key = React.Key>(props: Dat
return cols return cols
} else if (checkable) { } else if (checkable) {
const cols: readonly Column<Row, SR>[] = [ const cols: readonly Column<Row, SR>[] = [
{ ...SelectColumn, frozen: false }, { ...SelectColumn, key: 'select', frozen: false },
...columns, ...columns,
] ]
return cols return cols
...@@ -201,7 +205,6 @@ function FC<Row extends RowData, SR, K extends React.Key = React.Key>(props: Dat ...@@ -201,7 +205,6 @@ function FC<Row extends RowData, SR, K extends React.Key = React.Key>(props: Dat
return columns return columns
}, [columns, expandRow, _rows, checkable, checkAll, setCheckAll]) }, [columns, expandRow, _rows, checkable, checkAll, setCheckAll])
// 取得选中 // 取得选中
const getSelected = useCallback(() => { const getSelected = useCallback(() => {
const selected = _rows.filter((item) => item.__selected__ === true).map(item => item.id) const selected = _rows.filter((item) => item.__selected__ === true).map(item => item.id)
...@@ -252,7 +255,7 @@ function FC<Row extends RowData, SR, K extends React.Key = React.Key>(props: Dat ...@@ -252,7 +255,7 @@ function FC<Row extends RowData, SR, K extends React.Key = React.Key>(props: Dat
onRowsChange={onRowsChange} onRowsChange={onRowsChange}
// headerRowHeight={45} // headerRowHeight={45}
rowHeight={(args) => (args.type === 'ROW' && args.row.__type__ === RowType.Detail ? 300 : 45)} rowHeight={(args) => (args.type === 'ROW' && args.row.__type__ === RowType.Detail ? expandedRowHeight : rowHeight)}
// defaultColumnOptions={{ // defaultColumnOptions={{
// sortable: true, // sortable: true,
...@@ -263,7 +266,7 @@ function FC<Row extends RowData, SR, K extends React.Key = React.Key>(props: Dat ...@@ -263,7 +266,7 @@ function FC<Row extends RowData, SR, K extends React.Key = React.Key>(props: Dat
sortColumns={sortColumns} sortColumns={sortColumns}
onSortColumnsChange={setSortColumns} onSortColumnsChange={setSortColumns}
selectedRows={new Set(selectedRows||[])} selectedRows={_selectedRows}
onSelectedRowsChange={(values: Set<any>) => { onSelectedRowsChange={(values: Set<any>) => {
console.log('values', values); console.log('values', values);
onSelectedRowsChange && onSelectedRowsChange(Array.from(values)); onSelectedRowsChange && onSelectedRowsChange(Array.from(values));
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment