修改表格操作栏样式

components/apolloTable/component/index.less

@@ -18,10 +18,16 @@
         //min-height: 600px;
         &.scroll {
             flex: 1;
+            display: flex;
+            flex-direction: column;
+        }
+        .tableOperateContainer {
+            height: 58px;
+            overflow: hidden;
         }
 
         .tableC {
-            padding: 0 16px;
+            flex: 1;
         }
         .rowClassName {
             border: 1px solid black;

components/apolloTable/component/index.tsx

@@ -57,6 +57,7 @@ class AirTable extends React.Component<CommonProps, CommonState> {
     render() {
         const { columns, dataSource } = this.state;
         const {
+            className,
             rowStyle,
             rowClassName,
             distanceToLoad,
@@ -89,38 +90,50 @@ class AirTable extends React.Component<CommonProps, CommonState> {
             });
         return (
             <Provider value={{ locale: this.getContext() }}>
-                <div className={onScroll ? classNames(styles.container, styles.scroll) : styles.container}>
+                <div
+                    className={
+                        onScroll
+                            ? classNames(styles.container, styles.scroll, className)
+                            : classNames(styles.container, className)
+                    }
+                >
                     {operateConfig && <OperateConfig columns={columns} operateConfig={operateConfig} />}
                     <div
                         className={onScroll ? classNames(styles.tableContainer, styles.scroll) : styles.tableContainer}
                     >
-                        {tableOperateConfig && <TableOperateConfig operateConfig={tableOperateConfig} />}
-                        <Table
-                            columns={columns}
-                            dataSource={dataSource}
-                            onScroll={this.onScroll}
-                            rowStyle={rowStyle}
-                            rowClassName={rowClassName}
-                            distanceToLoad={distanceToLoad}
-                            emitChangeCell={emitChangeCell}
-                            bordered={bordered}
-                            width={width}
-                            height={height}
-                            sortConfig={sortConfig}
-                            paginationConfig={paginationConfig}
-                            showIndex={showIndex}
-                            showExpand={showExpand}
-                            emptyPlaceholder={emptyPlaceholder}
-                            cellEditable={cellEditable}
-                            rowHeight={rowHeight}
-                            headerHeight={headerHeight}
-                            columnWidth={columnWidth}
-                            loading={loading}
-                            rowSelection={rowSelection}
-                            noDataPlaceholder={noDataPlaceholder}
-                            contentMenu={contentMenu}
-                            loadComp={loadComp}
-                        />
+                        {tableOperateConfig && (
+                            <div className={styles.tableOperateContainer}>
+                                <TableOperateConfig operateConfig={tableOperateConfig} />
+                            </div>
+                        )}
+                        <div className={styles.tableC}>
+                            <Table
+                                columns={columns}
+                                dataSource={dataSource}
+                                onScroll={this.onScroll}
+                                rowStyle={rowStyle}
+                                rowClassName={rowClassName}
+                                distanceToLoad={distanceToLoad}
+                                emitChangeCell={emitChangeCell}
+                                bordered={bordered}
+                                width={width}
+                                height={height}
+                                sortConfig={sortConfig}
+                                paginationConfig={paginationConfig}
+                                showIndex={showIndex}
+                                showExpand={showExpand}
+                                emptyPlaceholder={emptyPlaceholder}
+                                cellEditable={cellEditable}
+                                rowHeight={rowHeight}
+                                headerHeight={headerHeight}
+                                columnWidth={columnWidth}
+                                loading={loading}
+                                rowSelection={rowSelection}
+                                noDataPlaceholder={noDataPlaceholder}
+                                contentMenu={contentMenu}
+                                loadComp={loadComp}
+                            />
+                        </div>
                     </div>
                     {paginationConfig && <Pagination {...paginationConfig} />}
                 </div>

components/apolloTable/component/interface.tsx

@@ -86,6 +86,7 @@ export interface CommonProps extends TableProps {
     tableOperateConfig?: OperateConfigProps;
     paginationConfig?: any;
     locale?: any;
+    className?: string;
 }
 
 export interface CommonState extends TableState {}