泛微薪资核算iframe表格

src/pages/atdTable/components/antdTable.tsx

@@ -103,6 +103,7 @@ const AntdTable: FC<ITableProps> = (props) => {
       if (item.dataIndex === "costCenter") {
         return {
           ...item,
+          ellipsis: true,
           width: 110,
           render: (text: string, r: any) => {
             const { costCenter } = r;
@@ -120,7 +121,7 @@ const AntdTable: FC<ITableProps> = (props) => {
           }
         };
       }
-      return { ...item };
+      return { ...item, ellipsis: true };
     });
     return tmpColumns;
   };
@@ -190,7 +191,7 @@ const AntdTable: FC<ITableProps> = (props) => {
           }}>{!_.isEmpty(costCenter) ? costCenter.name : ""}</a>;
         }
         return <span className={styles.contentSpan}>
-              <span>{text}</span>
+              <span title={text} className={styles.contentTitle}>{text}</span>
           {
             result.lockStatus === "LOCK" ? <LockOutlined title="锁定的项目值"/> : null
           }
@@ -250,7 +251,7 @@ const AntdTable: FC<ITableProps> = (props) => {
           child.ellipsis = true;
           child.render = (text: string) => {
             return <span className={styles.contentSpan}>
-              <span>{text}</span>
+              <span title={text} className={styles.contentTitle}>{text}</span>
               {
                 child.lockStatus === "LOCK" ? <LockOutlined title="锁定的项目值"/> : null
               }

src/pages/atdTable/components/index.less

@@ -29,6 +29,14 @@
     justify-content: space-between;
     align-items: center;
 
+    .contentTitle {
+      flex: 1;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      word-break: keep-all;
+    }
+
     :global {
       span.anticon-lock {
         color: #5d9cec;