From b8ff5b9b7829f325cf635e2365e0b1f2792fb0e2 Mon Sep 17 00:00:00 2001
From: zhangwenshuai <zhangwenshuai@mttop.cn>
Date: Tue, 11 Aug 2020 14:22:47 +0800
Subject: [PATCH] update first cell

---
 components/apolloTable/component/Cell.less    | 28 +++++++++----------
 components/apolloTable/component/Cell.tsx     | 13 ++++++---
 components/apolloTable/component/Column.less  |  3 +-
 components/apolloTable/component/Column.tsx   |  4 +--
 components/apolloTable/component/Table.tsx    |  3 ++
 components/apolloTable/component/index.tsx    |  2 ++
 .../apolloTable/component/interface.tsx       |  2 ++
 7 files changed, 33 insertions(+), 22 deletions(-)

diff --git a/components/apolloTable/component/Cell.less b/components/apolloTable/component/Cell.less
index 2ca4524..1748d46 100644
--- a/components/apolloTable/component/Cell.less
+++ b/components/apolloTable/component/Cell.less
@@ -7,12 +7,12 @@
         align-items: center;
         white-space: nowrap;
         overflow: hidden;
-        max-width: 66px;
+        //max-width: 66px;
         margin-left: @marginLg;
         .num {
             min-width: 30px;
             max-width: 100px;
-            margin-right: 10px;
+            margin-right: @marginSmX;
             font-size: @textFontGen;
             .icon {
                 width: 22px;
@@ -24,7 +24,7 @@
         .checkbox {
             min-width: 30px;
             max-width: 100px;
-            margin-right: 10px;
+            margin-right: @marginSmX;
             &.hasNum {
                 display: none;
             }
@@ -33,21 +33,19 @@
             }
         }
         .expand {
-            text-align: center;
-            width: 20px;
-            border-radius: 50%;
-            height: 20px;
             display: flex;
-            align-items: center;
-            justify-content: center;
-            margin-right: @marginSm;
+            width: 16px;
+            margin-right: @marginSmX;
             cursor: pointer;
             visibility: hidden;
-            &:hover {
-                background: #d0f0fd;
-            }
+
             .expandIcon {
+                border-radius: 50%;
                 width: 16px;
+                height: 16px;
+                &:hover {
+                    background: #d0f0fd;
+                }
             }
         }
     }
@@ -55,9 +53,9 @@
         background: @tableHoverBgColor;
         .firstArea {
             .checkbox {
-                display: block;
+                display: flex;
                 &.hasNum {
-                    display: block;
+                    display: flex;
                 }
             }
             .num {
diff --git a/components/apolloTable/component/Cell.tsx b/components/apolloTable/component/Cell.tsx
index 7f546e7..be9ebde 100644
--- a/components/apolloTable/component/Cell.tsx
+++ b/components/apolloTable/component/Cell.tsx
@@ -37,6 +37,8 @@ const Cell = (props: CellProps) => {
         onEmitMsg,
         tableId,
         maxPopHeight,
+        renderFirstLeft,
+        position,
     } = props;
     const {
         columnType,
@@ -180,12 +182,12 @@ const Cell = (props: CellProps) => {
         };
         return (
             <div className={s.firstArea}>
-                {rowSelection && columnIndex === 0 && (
+                {rowSelection && (
                     <div className={classNames(s.checkbox, showIndex && s.hasNum, getCheckedIndex() > -1 && s.checked)}>
                         {getCheckbox()}
                     </div>
                 )}
-                {showIndex && columnIndex === 0 && (
+                {showIndex && (
                     <div
                         className={classNames(
                             s.num,
@@ -196,7 +198,7 @@ const Cell = (props: CellProps) => {
                         {getIndex()}
                     </div>
                 )}
-                {showExpand && columnIndex === 0 && (
+                {showExpand && (
                     <div className={s.expand}>
                         <img
                             onClick={showExpand.bind(null, { rowId: record.id, historyGroupId: record.historyGroupId })}
@@ -206,6 +208,9 @@ const Cell = (props: CellProps) => {
                         />
                     </div>
                 )}
+                {
+                    renderFirstLeft&&renderFirstLeft({record})
+                }
             </div>
         );
     };
@@ -390,7 +395,7 @@ const Cell = (props: CellProps) => {
             onMouseEnter={onMouseEnter}
             onMouseLeave={onMouseLeave}
         >
-            {columnIndex === 0 && (rowSelection || showExpand || showIndex) && renderFirst()}
+            {columnIndex === 0 && position!=='right' && renderFirst()}
             <div
                 id={`cellUnit_${tableId}_${record.id}_${columnName}`}
                 className={classNames(
diff --git a/components/apolloTable/component/Column.less b/components/apolloTable/component/Column.less
index 7fa77e3..a545672 100644
--- a/components/apolloTable/component/Column.less
+++ b/components/apolloTable/component/Column.less
@@ -9,7 +9,8 @@
     padding: 0 @paddingLg;
     overflow: hidden;
     .checkbox {
-        margin-right: 10px;
+        width: 30px;
+        margin-right: @marginSmX;
     }
     .colBrief {
         display: flex;
diff --git a/components/apolloTable/component/Column.tsx b/components/apolloTable/component/Column.tsx
index f4eff2b..9ab73c2 100644
--- a/components/apolloTable/component/Column.tsx
+++ b/components/apolloTable/component/Column.tsx
@@ -84,9 +84,9 @@ export default class TableColumn extends PureComponent<ColumnProps> {
         const { sortType }: { sortType: string } = sort || {};
         let marginLeft:any = 0;
         if (columnIndex === 0 && (rowSelection || showIndex)) {
-            marginLeft = '56px';
+            marginLeft = '72px';
             if (!rowSelection) {
-                marginLeft = '82px';
+                marginLeft = '91px';
             }
         }
         return (
diff --git a/components/apolloTable/component/Table.tsx b/components/apolloTable/component/Table.tsx
index ba719ef..048fac9 100644
--- a/components/apolloTable/component/Table.tsx
+++ b/components/apolloTable/component/Table.tsx
@@ -329,6 +329,7 @@ export default class AirTable extends Component<TableProps, TableState> {
             rowStyle,
             onEmitMsg,
             tableId,
+            renderFirstLeft,
         } = this.props;
         if (showColumns.length === 0 || showData.length === 0) {
             return;
@@ -366,6 +367,7 @@ export default class AirTable extends Component<TableProps, TableState> {
             columnConfig,
             columnData,
             cellData,
+            record,
         });
         const cellStyleObj = getMergeStyle({ ...style, ...cellBorderStyle }, cellStyle, {
             columnIndex,
@@ -404,6 +406,7 @@ export default class AirTable extends Component<TableProps, TableState> {
                 onEmitMsg={onEmitMsg}
                 tableId={tableId}
                 maxPopHeight={maxPopHeight}
+                renderFirstLeft={renderFirstLeft}
             />
         );
     };
diff --git a/components/apolloTable/component/index.tsx b/components/apolloTable/component/index.tsx
index cc61da9..774c37a 100644
--- a/components/apolloTable/component/index.tsx
+++ b/components/apolloTable/component/index.tsx
@@ -91,6 +91,7 @@ class AirTable extends React.Component<CommonProps, CommonState> {
             onEmitMsg,
             tableId,
             cachedFeAttr,
+            renderFirstLeft,
         } = this.props;
         const sortConfig = operateConfig
             && operateConfig.menusGroup
@@ -154,6 +155,7 @@ class AirTable extends React.Component<CommonProps, CommonState> {
                                 onDragFixed={onDragFixed}
                                 canSorted={canSorted}
                                 onDragSorted={onDragSorted}
+                                renderFirstLeft={renderFirstLeft}
                             />
                         </div>
                     </div>
diff --git a/components/apolloTable/component/interface.tsx b/components/apolloTable/component/interface.tsx
index 4b76985..f1c4839 100644
--- a/components/apolloTable/component/interface.tsx
+++ b/components/apolloTable/component/interface.tsx
@@ -84,6 +84,7 @@ export interface TableProps extends LoadConfigProps {
     onDragResized?: Function; // 拖拽更改列伸缩回调
     onEmitMsg?: Function; // 是否支持消息协同
     cachedFeAttr?: boolean; // 是否启用前端缓存
+    renderFirstLeft?:Function; // 第一个单元格特殊渲染
 }
 export interface TableState {
     columns: ColumnProps[];
@@ -137,6 +138,7 @@ export interface CellProps {
     onEmitMsg?: Function;
     tableId?: string | number;
     maxPopHeight?: string | number;
+    renderFirstLeft?: Function;
 }
 
 export interface EditCellProps {
-- 
2.21.0