薪资核算详情页面导入失败的bug处理以及表格列固定之后，样式错位的bug解决

pc4mobx/hrmSalary/components/customTable/index.less

@@ -1,4 +1,42 @@
 .antd-wrap {
+  .ant-table-thead > tr > th {
+    border-width: 1px !important;
+  }
+
+  .ant-table-bordered .ant-table-fixed-right {
+    top: 1px !important;
+
+    thead {
+      tr > th {
+        border-top: 1px solid #e2e2e2 !important;
+      }
+    }
+  }
+
+  .ant-table-bordered .ant-table-fixed-left {
+    top: 1px !important;
+    left: 0 !important;
+
+    thead {
+      tr > th {
+        border-top: 1px solid #e2e2e2 !important;
+      }
+
+      tr > th:first-child {
+        border-left: 1px solid #e2e2e2 !important;
+      }
+    }
+
+    tbody {
+      tr > td:first-child {
+        border-left: 1px solid #e2e2e2 !important;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+    }
+  }
+
   .ant-table-tbody {
     tr {
       td {

pc4mobx/hrmSalary/components/importModal/index.js

@@ -20,7 +20,7 @@ export default class ImportModal extends React.Component {
         this.state = {
             fileId: ""
         }
-        
+
         this.props.init && this.props.init()
     }
 
@@ -45,27 +45,27 @@ export default class ImportModal extends React.Component {
         try {
             params && Object.keys(params).forEach((key) => {
                 if(!params[key] || params[key] == "") {
-                    message.warning("请选择税款所属期");
-                    throw new Error("请选择税款所属期")
+                    message.warning("请完善导入选项");
+                    throw new Error("请完善导入选项")
                 }
             })
         } catch(e) {
             flag = false
         }
-        
+
         return flag;
     }
 
     handleStep1Next() {
         if(!this.validateDate()) {
-            return 
+            return
         }
         if(this.state.fileId) {
             this.props.setStep(1)
         } else {
             message.warning("请上传文件")
         }
-        
+
     }
 
     handlePreviewDate() {
@@ -102,7 +102,7 @@ export default class ImportModal extends React.Component {
                 </WeaSteps>
             </div>
             {
-                this.props.step == 0 && (<ModalStep1 
+                this.props.step == 0 && (<ModalStep1
                     isInit={ isInit }
                     templateLink={this.props.templateLink}
                     headerSetCompoent={this.props.headerSetCompoent}
@@ -128,8 +128,8 @@ export default class ImportModal extends React.Component {
                     importResult={toJS(this.props.importResult)}
                     onFinish={() => {this.props.onFinish()}}/>)
             }
-            
+
         </Modal>
         )
     }
-}
+}

pc4mobx/hrmSalary/pages/calculateDetail/salaryDetail.js

@@ -1,143 +1,152 @@
-import React from 'react'
-import { salaryDetailColumns, dataSource } from './columns'
-import { WeaHelpfulTip, WeaSlideModal, WeaTable } from 'ecCom'
-import { Table } from 'antd'
-import WarningModal from './warningModal'
-import "./index.less"
-import EditSalaryDetail from './editSalaryDetail'
-import SlideModalTitle from "../../components/slideModalTitle"
-import ImportModal from '../../components/importModal'
-import { columns } from '../salaryItem/columns'
-import { getQueryString } from '../../util/url'
-import { inject, observer } from 'mobx-react';
-import CustomTable from '../../components/customTable'
-import CustomPaginationTable from '../../components/customPaginationTable'
+import React from "react";
+import { salaryDetailColumns } from "./columns";
+import { WeaHelpfulTip, WeaSlideModal } from "ecCom";
+import WarningModal from "./warningModal";
+import "./index.less";
+import EditSalaryDetail from "./editSalaryDetail";
+import SlideModalTitle from "../../components/slideModalTitle";
+import { getQueryString } from "../../util/url";
+import { inject, observer } from "mobx-react";
+import CustomPaginationTable from "../../components/customPaginationTable";
 
-@inject('calculateStore', 'taxAgentStore')
+@inject("calculateStore", "taxAgentStore")
 @observer
 export default class SalaryDetail extends React.Component {
-    constructor(props) {
-        super(props)
-        this.state ={
-            visible: false,
-            slideVisiable: false,
-            columns: salaryDetailColumns.map(item => {
-                if(item.dataIndex == "cz") {
-                    item.render = () => {
-                        return (
-                            <a onClick={() => {this.setState({slideVisiable: true})}}>编辑</a>
-                        )
-                    }
-                }
-            })
+  constructor(props) {
+    super(props);
+    this.state = {
+      visible: false,
+      slideVisiable: false,
+      columns: salaryDetailColumns.map(item => {
+        if (item.dataIndex == "cz") {
+          item.render = () => {
+            return (
+              <a onClick={() => {
+                this.setState({ slideVisiable: true });
+              }}>编辑</a>
+            );
+          };
         }
-        this.recordId = ""
-        this.id = ""
-        this.pageInfo = {current: 1, pageSize: 10}
-    }
+      })
+    };
+    this.recordId = "";
+    this.id = "";
+    this.pageInfo = { current: 1, pageSize: 10 };
+  }
 
-    componentWillMount() {
-        let id = getQueryString("id")
-        this.id = id;
-        const { calculateStore: { acctResultList, getSalarySobCycle } } = this.props;
-        acctResultList(id)
-        getSalarySobCycle(id)
-    }
+  componentWillMount() {
+    let id = getQueryString("id");
+    this.id = id;
+    const { calculateStore: { acctResultList, getSalarySobCycle } } = this.props;
+    acctResultList(id);
+    getSalarySobCycle(id);
+  }
 
-    headerSetCompoent() {
-        return (
-            <div style={{display: "inline-block"}}>
-                <WeaCheckbox id="test" content="导出现有数据" />
-                <WeaHelpfulTip
-                    width={200}
-                    title="提示：建议先导出现有最新数据，修改后再导入；\n
+  headerSetCompoent() {
+    return (
+      <div style={{ display: "inline-block" }}>
+        <WeaCheckbox id="test" content="导出现有数据"/>
+        <WeaHelpfulTip
+          width={200}
+          title="提示：建议先导出现有最新数据，修改后再导入；\n
                     若只需要导出部分数据，请先筛选列表"
-                    placement="topLeft"
-                />
-            </div>
-        )
-    }
+          placement="topLeft"
+        />
+      </div>
+    );
+  }
 
-    // 获取列表的列
-    getColumns() {
-        const { calculateStore: {acctResultListColumns }} = this.props;
-        let columns = acctResultListColumns ? [...acctResultListColumns] : []
-        columns = columns.filter(item => item.hide == "FALSE").map(item => {
-            let result = {...item}
-            result.title = item.text;
-            result.dataIndex = item.column
-            result.oldWidth = result.width;
-            result.width = "150px";
-            if(result.children) {
-                result.width = (result.children.length * 150) + "px";
-                result.children.map(child => {
-                    child.title = child.text
-                    child.dataIndex = child.column
-                    child.width = "150px";
-                })
-            }
+  // 获取列表的列
+  getColumns() {
+    const { calculateStore: { acctResultListColumns } } = this.props;
+    let columns = acctResultListColumns ? [...acctResultListColumns] : [];
+    columns = columns.filter(item => item.hide == "FALSE").map(item => {
+      let result = { ...item };
+      result.title = item.text;
+      result.dataIndex = item.column;
+      result.oldWidth = result.width;
+      result.width = "150px";
+      if (result.children) {
+        result.width = (result.children.length * 150) + "px";
+        result.children.map(child => {
+          child.title = child.text;
+          child.dataIndex = child.column;
+          child.width = "150px";
+        });
+      }
 
-            if(result.dataIndex === "taxAgentName" || result.dataIndex === "username" || result.dataIndex === "departmentName") {
-                result.fixed = "left"
-            }
+      if (result.dataIndex === "taxAgentName" || result.dataIndex === "username" || result.dataIndex === "departmentName") {
+        result.fixed = "left";
+        result.render = (text) => {
+          return <span title={text}>{text}</span>;
+        };
+      }
 
-            return result;
-        })
-        columns.push({
-            title: '操作',
-            key: "cz",
-            width: '100px',
-            fixed: 'right',
-            render: (text, record) => {
-                return <a onClick={() => {this.handleEdit(record)}}>编辑</a>
-            }
-        })
-        return columns;
-    }
+      return result;
+    });
+    columns.push({
+      title: "操作",
+      key: "cz",
+      width: "100px",
+      fixed: "right",
+      render: (text, record) => {
+        return <a onClick={() => {
+          this.handleEdit(record);
+        }}>编辑</a>;
+      }
+    });
+    return columns;
+  }
 
-    // 编辑时间回调
-    handleEdit(record) {
-        this.recordId = record.id;
-        this.setState({
-            slideVisiable: true
-        })
-    }
+  // 编辑时间回调
+  handleEdit(record) {
+    this.recordId = record.id;
+    this.setState({
+      slideVisiable: true
+    });
+  }
 
-    // 侧边栏保存
-    handleEditSlideSave() {
-        const {calculateStore } = this.props;
-        const { saveAcctResult, acctResultList, acctresultDetail } = calculateStore;
-        this.setState({
-            slideVisiable: false
-        })
-        saveAcctResult(this.recordId).then(() => {
-            acctResultList(this.id)
-        })
-    }
+  // 侧边栏保存
+  handleEditSlideSave() {
+    const { calculateStore } = this.props;
+    const { saveAcctResult, acctResultList, acctresultDetail } = calculateStore;
+    this.setState({
+      slideVisiable: false
+    });
+    saveAcctResult(this.recordId).then(() => {
+      acctResultList(this.id);
+    });
+  }
 
-    // 分页
-    handleDataPageChange(value) {
-        const { calculateStore: {acctResultList}} = this.props;
-        acctResultList(this.id, this.props.employeeName, value, this.pageInfo)
-    }
+  // 分页
+  handleDataPageChange(value) {
+    const { calculateStore: { acctResultList } } = this.props;
+    acctResultList(this.id, this.props.employeeName, value, this.pageInfo);
+  }
 
-    handleShowSizeChange(pageInfo) {
-        const { calculateStore: {acctResultList}} = this.props;
-        acctResultList(this.id, this.props.employeeName, pageInfo.current, pageInfo)
-    }
+  handleShowSizeChange(pageInfo) {
+    const { calculateStore: { acctResultList } } = this.props;
+    acctResultList(this.id, this.props.employeeName, pageInfo.current, pageInfo);
+  }
 
-    render() {
-        const { slideVisiable } = this.state;
-        const { calculateStore, taxAgentStore: { showOperateBtn } } = this.props;
-        const { acctResultListDateSource, acctResultListColumns, baseSalarySobCycle, acctResultListPageInfo, loading } = calculateStore
-        return (
-            <div className="salaryDetail">
-                <div className="salaryBarWrapper">
-                    <span>薪资所属月：{baseSalarySobCycle.salaryMonth}</span>
-                    <WeaHelpfulTip
-                        style={{marginLeft: "10px"}}
-                        width={200}
-                        title={`薪资周期\n
+  render() {
+    const { slideVisiable } = this.state;
+    const { calculateStore, taxAgentStore: { showOperateBtn } } = this.props;
+    const {
+      acctResultListDateSource,
+      acctResultListColumns,
+      baseSalarySobCycle,
+      acctResultListPageInfo,
+      loading
+    } = calculateStore;
+    return (
+      <div className="salaryDetail">
+        <div className="salaryBarWrapper">
+          <span>薪资所属月：{baseSalarySobCycle.salaryMonth}</span>
+          <WeaHelpfulTip
+            style={{ marginLeft: "10px" }}
+            width={200}
+            title={`薪资周期\n
                         ${baseSalarySobCycle.salaryCycle && baseSalarySobCycle.salaryCycle.fromDate}至${baseSalarySobCycle.salaryCycle && baseSalarySobCycle.salaryCycle.endDate}\n
                         税款所属期\n
                         ${baseSalarySobCycle.taxCycle}\n
@@ -145,52 +154,56 @@ export default class SalaryDetail extends React.Component {
                         ${baseSalarySobCycle.attendCycle && baseSalarySobCycle.attendCycle.fromDate}至${baseSalarySobCycle.attendCycle && baseSalarySobCycle.attendCycle.endDate}\n
                         福利台账月份\n
                         引用${baseSalarySobCycle.socialSecurityCycle}的福利台账数据`}
-                        placement="topLeft"
-                    />
-                     <span className="warningspan" onClick={() => {this.setState({visible: true})}}>校验异常：0</span>
-                </div>
-                <div className="tableWrapper">
-                    <CustomPaginationTable
-                        loading={loading}
-                        dataSource={acctResultListDateSource}
-                        columns={this.getColumns()}
-                        total={acctResultListPageInfo.total}
-                        current={acctResultListPageInfo.pageNum}
-                        pageSize={this.pageInfo.pageSize}
-                        onPageChange={(value) => {
-                            this.pageInfo.current = value
-                            this.handleDataPageChange(value)
-                        }}
-                        isWeaTable={false}
-                        scroll={{ x: 1500 }}
-                        onShowSizeChange={(current, pageSize) => {
-                            this.pageInfo = {current, pageSize}
-                            this.handleShowSizeChange(this.pageInfo)
-                        }}
-                    />
-                </div>
-                <WarningModal visible={this.state.visible} onCancel={() => {this.setState({visible: false})}}/>
-                {
-                slideVisiable && <WeaSlideModal visible={slideVisiable}
-                    top={0}
-                    width={60}
-                    height={100}
-                    direction={'right'}
-                    measure={'%'}
-                    title={
-                        <SlideModalTitle
-                        subtitle={"编辑薪资"}
-                        editable={true}
-                        showOperateBtn={showOperateBtn}
-                        onSave={() => this.handleEditSlideSave()}
-                        />
-                    }
-                    content={<EditSalaryDetail id={this.recordId}/>}
-                    onClose={() => this.setState({slideVisiable: false})}
-                    showMask={true}
-                    closeMaskOnClick={() => this.setState({slideVisiable: false})} />
-                }
-            </div>
-        )
-    }
+            placement="topLeft"
+          />
+          <span className="warningspan" onClick={() => {
+            this.setState({ visible: true });
+          }}>校验异常：0</span>
+        </div>
+        <div className="tableWrapper">
+          <CustomPaginationTable
+            loading={loading}
+            dataSource={acctResultListDateSource}
+            columns={this.getColumns()}
+            total={acctResultListPageInfo.total}
+            current={acctResultListPageInfo.pageNum}
+            pageSize={this.pageInfo.pageSize}
+            onPageChange={(value) => {
+              this.pageInfo.current = value;
+              this.handleDataPageChange(value);
+            }}
+            isWeaTable={false}
+            scroll={{ x: 1500 }}
+            onShowSizeChange={(current, pageSize) => {
+              this.pageInfo = { current, pageSize };
+              this.handleShowSizeChange(this.pageInfo);
+            }}
+          />
+        </div>
+        <WarningModal visible={this.state.visible} onCancel={() => {
+          this.setState({ visible: false });
+        }}/>
+        {
+          slideVisiable && <WeaSlideModal visible={slideVisiable}
+                                          top={0}
+                                          width={60}
+                                          height={100}
+                                          direction={"right"}
+                                          measure={"%"}
+                                          title={
+                                            <SlideModalTitle
+                                              subtitle={"编辑薪资"}
+                                              editable={true}
+                                              showOperateBtn={showOperateBtn}
+                                              onSave={() => this.handleEditSlideSave()}
+                                            />
+                                          }
+                                          content={<EditSalaryDetail id={this.recordId}/>}
+                                          onClose={() => this.setState({ slideVisiable: false })}
+                                          showMask={true}
+                                          closeMaskOnClick={() => this.setState({ slideVisiable: false })}/>
+        }
+      </div>
+    );
+  }
 }

pc4mobx/hrmSalary/pages/salaryItem/customSalaryItemSlide.js

@@ -110,7 +110,7 @@ export default class CustomSalaryItemSlide extends React.Component {
               <WeaHelpfulTip
                 style={{ marginLeft: "10px" }}
                 width={200}
-                title="提示：开启后，该薪资项目不可删除或者设为无效"
+                title="提示：开启后，该薪资项目不可删除或设为无效，取值方式会默认置为输入"
                 placement="topLeft"
               />
             </Col>