瀏覽代碼

人事管理开发05-07

mentoswzq 5 年之前
父節點
當前提交
4d7f224887

+ 8 - 0
js/component/manageCenter/statistics/content.jsx

@@ -46,6 +46,14 @@ class Content extends Component {
               });
             });
             break;
+          case "bonusList":
+            require.ensure([], () => {
+              const BonusList = require("./personnel/bonusList").default;
+              this.setState({
+                component: <BonusList ApiUrl={""} />,
+              });
+            });
+            break;
           default:
             require.ensure([], () => {
               let Module = require("../module").default;

+ 280 - 0
js/component/manageCenter/statistics/personnel/bonusList.jsx

@@ -0,0 +1,280 @@
+import React from "react";
+import $ from "jquery/src/ajax";
+import { Spin, Button, Tabs, Table, message, Modal, Input, Form } from "antd";
+import "@/manageCenter/financialManage/distribute/public.less";
+import { splitUrl } from "@/tools";
+const FormItem = Form.Item;
+
+const BonusList = React.createClass({
+  getInitialState() {
+    return {
+      columns: [
+        {
+          title: "职位名称",
+          dataIndex: "jobsName",
+          key: "jobsName",
+        },
+        {
+          title: "级别",
+          dataIndex: "lvlName",
+          key: "lvlName",
+        },
+        {
+          title: "研究生津贴",
+          dataIndex: "allowance",
+          key: "allowance",
+        },
+        {
+          title: "在职奖励",
+          dataIndex: "aliveRewards",
+          key: "aliveRewards",
+        },
+        {
+          title: "奖励",
+          dataIndex: "rewards",
+          key: "rewards",
+        },
+        {
+          title: "二级奖励",
+          dataIndex: "twoRewards",
+          key: "twoRewards",
+        },
+        {
+          title: "三级奖励",
+          dataIndex: "threeRewards",
+          key: "threeRewards",
+        },
+        {
+          title: "操作",
+          dataIndex: "caozuo",
+          key: "caozuo",
+          render: (text, record) => {
+              return <Button type="primary" onClick={e => {this.editMoney(record)}}>修改金额</Button>
+          }
+        }
+      ],
+      pagination: {
+        defaultCurrent: 1,
+        defaultPageSize: 10,
+        showQuickJumper: true,
+        pageSize: 10,
+        onChange: function (page) {
+          this.loadData(page);
+        }.bind(this),
+        showTotal: function (total) {
+          return "共" + total + "条数据";
+        },
+      },
+    };
+  },
+  componentWillMount() {
+    this.loadData()
+  },
+  loadData(pageNo) {
+    this.state.data = [];
+    this.setState({
+      loading: true,
+    });
+    $.ajax({
+      method: "get",
+      dataType: "json",
+      crossDomain: false,
+      url: globalConfig.context + "/api/admin/personnel/selectLvlList",
+      data: {
+        pageNo: pageNo || 1,
+        pageSize: this.state.pagination.pageSize,
+      },
+      success: function (data) {
+        let theArr = [];
+        if (!data.data) {
+          if (data.error && data.error.length) {
+            message.warning(data.error[0].message);
+          }
+        } else {
+          for (let i = 0; i < data.data.length; i++) {
+            let thisdata = data.data[i];
+            thisdata.key = thisdata.id;
+            theArr.push(thisdata);
+          }
+        }
+        this.state.pagination.current = data.data.pageNo;
+        this.state.pagination.total = data.data.totalCount;
+        if (data.data && data.data.list && !data.data.list.length) {
+          this.state.pagination.current = 0;
+          this.state.pagination.total = 0;
+        }
+        this.setState({
+          dataSource: theArr,
+          pagination: this.state.pagination,
+        });
+      }.bind(this),
+    }).always(
+      function () {
+        this.setState({
+          loading: false,
+        });
+      }.bind(this)
+    );
+  },
+  moneyOk() {
+    this.setState({
+      loading: true,
+    });
+    $.ajax({
+      method: "post",
+      dataType: "json",
+      crossDomain: false,
+      url: globalConfig.context + "/api/admin/personnel/updateLvl",
+      data: {
+        id: this.state.id,
+        jobs: this.state.jobs,
+        lvl: this.state.lvl,
+        aliveRewards: this.state.aliveRewards,
+        rewards: this.state.rewards,
+        twoRewards: this.state.twoRewards,
+        threeRewards: this.state.threeRewards,
+      },
+      success: function (data) {
+        if (!data.data) {
+          if (data.error && data.error.length) {
+            message.warning(data.error[0].message);
+          }
+        } else {
+            this.loadData()
+          this.setState({
+              visible: false
+          })
+        }
+      }.bind(this),
+    }).always(
+      function () {
+        this.setState({
+          loading: false,
+        });
+      }.bind(this)
+    );
+  },
+  editMoney(record) {
+    this.setState({
+      visible: true,
+      id: record.id,
+      jobs: record.jobs,
+      lvl: record.lvl,
+      aliveRewards: record.aliveRewards,
+      rewards: record.rewards,
+      twoRewards: record.twoRewards,
+      threeRewards: record.threeRewards,
+    });
+  },
+  render() {
+    return (
+      <div className="user-content">
+        <Table
+          bordered
+          columns={this.state.columns}
+          onRowClick={this.tableRowClick}
+          dataSource={this.state.dataSource}
+          scroll={{ x: "max-content", y: 0 }}
+          pagination={false}
+          size="small"
+        />
+        <Modal
+          visible={this.state.visible}
+          footer={null}
+          width={600}
+          onCancel={() => {
+            this.loadData();
+            this.setState({
+              visible: false,
+            });
+          }}
+        >
+          <Spin spinning={this.state.loading}>
+            <div>
+                <h3 style={{ textAlign: "center", marginBottom: 10 }}>奖励修改</h3>
+              <div className="clearfix" style={{ marginBottom: 10 }}>
+                <FormItem
+                  className="half-item"
+                  labelCol={{ span: 6 }}
+                  wrapperCol={{ span: 30 }}
+                  label="在职奖励"
+                >
+                  <Input
+                    placeholder="请输入金额"
+                    value={this.state.aliveRewards}
+                    style={{ width: 200 }}
+                    onChange={(e) => {
+                      this.setState({ aliveRewards: e.target.value });
+                    }}
+                  />
+                </FormItem>
+                <FormItem
+                  className="half-item"
+                  labelCol={{ span: 6 }}
+                  wrapperCol={{ span: 30 }}
+                  label="奖励"
+                >
+                  <Input
+                    placeholder="请输入金额"
+                    value={this.state.rewards}
+                    style={{ width: 200 }}
+                    onChange={(e) => {
+                      this.setState({ rewards: e.target.value });
+                    }}
+                  />
+                </FormItem>
+              </div>
+              <div className="clearfix" style={{ marginBottom: 10 }}>
+                <FormItem
+                  className="half-item"
+                  labelCol={{ span: 6 }}
+                  wrapperCol={{ span: 30 }}
+                  label="二级奖励"
+                >
+                  <Input
+                    placeholder="请输入金额"
+                    value={this.state.twoRewards}
+                    style={{ width: 200 }}
+                    onChange={(e) => {
+                      this.setState({ twoRewards: e.target.value });
+                    }}
+                  />
+                </FormItem>
+                <FormItem
+                  className="half-item"
+                  labelCol={{ span: 6 }}
+                  wrapperCol={{ span: 30 }}
+                  label="三级奖励"
+                >
+                  <Input
+                    placeholder="请输入金额"
+                    value={this.state.threeRewards}
+                    style={{ width: 200 }}
+                    onChange={(e) => {
+                      this.setState({ threeRewards: e.target.value });
+                    }}
+                  />
+                </FormItem>
+              </div>
+            </div>
+            <Button
+              type="primary"
+              shape="round"
+              size="large"
+              style={{
+                position: "relative",
+                left: "50%",
+                transform: "translateX(-50%)",
+              }}
+              onClick={this.moneyOk}
+            >
+              保存
+            </Button>
+          </Spin>
+        </Modal>
+      </div>
+    );
+  },
+});
+
+export default BonusList;

+ 660 - 29
js/component/manageCenter/statistics/personnel/personnelAll.jsx

@@ -45,12 +45,12 @@ const PersonnelAll = React.createClass({
         pageNo: pageNo || 1,
         pageSize: this.state.pagination.pageSize,
         name: this.state.nameSearch,
-        status: this.state.nameSearch,
-        company: this.state.nameSearch,
-        sex: this.state.nameSearch,
-        marriage: this.state.nameSearch,
-        politicalOutlook: this.state.nameSearch,
-        birthdayMonth: this.state.nameSearch,
+        status: this.state.statusSearch,
+        company: this.state.departmenttList,
+        sex: this.state.sexSearch,
+        marriage: this.state.marriageSearch,
+        politicalOutlook: this.state.politicalOutlookSearch,
+        birthdayMonth: this.state.birthdayMonthSearch,
         promotionStart: this.state.promotionTime[0],
         promotionEnd: this.state.promotionTime[1],
         entryStart: this.state.entryTime[0],
@@ -97,6 +97,7 @@ const PersonnelAll = React.createClass({
   },
   getInitialState() {
     return {
+      editWelfareData: {},
       contractList: [],
       quitList: [],
       chooseList: [],
@@ -348,6 +349,123 @@ const PersonnelAll = React.createClass({
       ],
       dataSource: [],
       resVisible: false,
+      welfareColumns: [
+        {
+          title: "福利类型",
+          dataIndex: "type",
+          key: "type",
+          render: (text) => {
+            if (text == 0) {
+              return "社保";
+            } else if (text == 1) {
+              return "公积金";
+            } else if (text == 2) {
+              return "雇主险";
+            }
+          },
+        },
+        {
+          title: "购买状态",
+          dataIndex: "status",
+          key: "status",
+          render: (text) => {
+            if (text == 0) {
+              return "未购买";
+            } else if (text == 1) {
+              return "已购买";
+            } else if (text == 2) {
+              return "已停止";
+            }
+          },
+        },
+        {
+          title: "购买时间",
+          dataIndex: "startTimes",
+          key: "startTimes",
+        },
+        {
+          title: "停缴时间",
+          dataIndex: "endTimes",
+          key: "endTimes",
+        },
+        {
+          title: "公司名称",
+          dataIndex: "depName",
+          key: "depName",
+        },
+        {
+          title: "备注信息",
+          dataIndex: "welfareRemarks",
+          key: "welfareRemarks",
+        },
+      ],
+      welfareColumnsEdit: [
+        {
+          title: "福利类型",
+          dataIndex: "type",
+          key: "type",
+          render: (text) => {
+            if (text == 0) {
+              return "社保";
+            } else if (text == 1) {
+              return "公积金";
+            } else if (text == 2) {
+              return "雇主险";
+            }
+          },
+        },
+        {
+          title: "购买状态",
+          dataIndex: "status",
+          key: "status",
+          render: (text) => {
+            if (text == 0) {
+              return "未购买";
+            } else if (text == 1) {
+              return "已购买";
+            } else if (text == 2) {
+              return "已停止";
+            }
+          },
+        },
+        {
+          title: "购买时间",
+          dataIndex: "startTimes",
+          key: "startTimes",
+        },
+        {
+          title: "停缴时间",
+          dataIndex: "endTimes",
+          key: "endTimes",
+        },
+        {
+          title: "公司名称",
+          dataIndex: "depName",
+          key: "depName",
+        },
+        {
+          title: "备注信息",
+          dataIndex: "welfareRemarks",
+          key: "welfareRemarks",
+        },
+        {
+          title: "操作",
+          dataIndex: "caozuo",
+          key: "caozuo",
+          render: (text, record) => {
+            return (
+              <Button
+                type="primary"
+                onClick={(e) => {
+                  this.welfareTable(record);
+                }}
+              >
+                修改
+              </Button>
+            );
+          },
+        },
+      ],
       table: [
         {
           key: "员工编号",
@@ -426,20 +544,6 @@ const PersonnelAll = React.createClass({
       ],
     };
   },
-  /* 分派 */
-  evaluate(record, nub) {
-    this.state.assignData = record;
-    this.setState(
-      {
-        nub,
-      },
-      () => {
-        this.setState({
-          assignVisible: true,
-        });
-      }
-    );
-  },
 
   componentWillMount() {
     let areaArr = getProvinceList();
@@ -492,6 +596,131 @@ const PersonnelAll = React.createClass({
       }.bind(this),
     });
   },
+
+  welfareTable(record) {
+    this.setState({
+      editWelfareVisible: true,
+    });
+    if (record) {
+      this.setState({
+        editWelfareData: record,
+      });
+    } else {
+      let editWelfareData = {
+        status: undefined,
+        id: undefined,
+        depId: [],
+        pdId: this.state.ModalData.id,
+        type: undefined,
+        welfareRemarks: undefined,
+        endTimes: undefined,
+        startTimes: undefined,
+      };
+      this.setState({
+        editWelfareData
+      });
+    }
+  },
+  editWelfareDataOk() {
+    this.setState({
+      loading: true,
+    });
+    $.ajax({
+      method: "post",
+      dataType: "json",
+      crossDomain: false,
+      url: globalConfig.context + "/api/admin/personnel/updateWelfare",
+      data: {
+        startTimes:
+          this.state.editWelfareData.status == 1
+            ? this.state.editWelfareData.startTimes
+            : "",
+        endTimes:
+          this.state.editWelfareData.status == 2
+            ? this.state.editWelfareData.endTimes
+            : "",
+        pdId: this.state.editWelfareData.pdId,
+        welfareRemarks: this.state.editWelfareData.status == 0 ? this.state
+          .editWelfareData.welfareRemarks : "",
+        type: this.state.editWelfareData.type,
+        id: this.state.editWelfareData.id,
+        status: this.state.editWelfareData.status,
+        depId: this.state.editWelfareData.depId,
+      },
+      success: function (data) {
+        let theArr = [];
+        if (data.error && data.error.length) {
+          message.warning(data.error[0].message);
+        } else {
+          message.success("修改成功!");
+          this.loadData();
+          this.tableRowClick(this.state.ModalData);
+          this.setState({
+            editWelfareVisible: false,
+          });
+        }
+      }.bind(this),
+    }).always(
+      function () {
+        this.setState({
+          loading: false,
+        });
+      }.bind(this)
+    );
+  },
+
+  getWelfareData() {
+    this.setState({
+      loading: true,
+    });
+    $.ajax({
+      method: "post",
+      dataType: "json",
+      crossDomain: false,
+      url: globalConfig.context + "/api/admin/personnel/add",
+      data: {
+        name: this.state.name,
+        doorId: this.state.doorId,
+        sex: this.state.sex,
+        nation: this.state.nation,
+        residenceProvince: this.state.residence[0],
+        residenceCity: this.state.residence[1],
+        residenceArea: this.state.residence[2],
+        residenceAddress: this.state.residenceAddress,
+        nativePlaceProvince: this.state.nativePlace[0],
+        nativePlaceCity: this.state.nativePlace[1],
+        nowProvince: this.state.now[0],
+        nowCity: this.state.now[1],
+        nowArea: this.state.now[2],
+        nowAddress: this.state.nowAddress,
+        idCard: this.state.idCard,
+        certificationAuthority: this.state.certificationAuthority,
+        marriage: this.state.marriage,
+        politicalOutlook: this.state.politicalOutlook,
+        son: this.state.son,
+        girl: this.state.girl,
+        birthdays: this.state.birthdays,
+        marriage: this.state.marriage,
+      },
+      success: function (data) {
+        let theArr = [];
+        if (data.error && data.error.length) {
+          message.warning(data.error[0].message);
+        } else {
+          message.success("添加成功!");
+          this.loadData();
+          this.addPeoCancel();
+        }
+      }.bind(this),
+    }).always(
+      function () {
+        this.setState({
+          loading: false,
+        });
+      }.bind(this)
+    );
+  },
+
   changeList(arr) {
     const newArr = [];
     this.state.columns.forEach((item) => {
@@ -888,7 +1117,9 @@ const PersonnelAll = React.createClass({
     } else if (this.state.chooseVisible) {
       return this.addChoose;
     } else if (this.state.quitVisible) {
-      return this.addQuit
+      return this.addQuit;
+    } else if (this.state.welfareVisible) {
+      return this.addWelfare;
     }
   },
   addRuzhi(e, i) {
@@ -980,6 +1211,24 @@ const PersonnelAll = React.createClass({
       quitList: this.state.quitList,
     });
   },
+  addWelfare(e, i) {
+    this.setState({
+      addPicModal: false,
+    });
+    if (
+      this.state.ModalData.welfareAnnexUrl &&
+      this.state.ModalData.welfareAnnexUrl.length > 0
+    ) {
+      this.state.ModalData.welfareAnnexUrl += "," + e;
+      this.state.ModalData.welfareAnnexName += "," + i;
+    } else {
+      this.state.ModalData.welfareAnnexUrl = e;
+      this.state.ModalData.welfareAnnexName = i;
+    }
+    this.setState({
+      ModalData: this.state.ModalData,
+    });
+  },
   reset() {
     this.state.nameSearch = undefined;
     this.state.statusSearch = undefined;
@@ -1122,6 +1371,24 @@ const PersonnelAll = React.createClass({
       quitList: this.state.quitList,
     });
   },
+  welfareRemove(e) {
+    let url = e.file.response.data;
+    let arr = this.state.ModalData.welfareAnnexUrl.split(",");
+    let arrName = this.state.ModalData.welfareAnnexName.split(",");
+    let num = "";
+    arr.forEach((item, index) => {
+      if (item == url) {
+        arr.splice(index, 1);
+        num = index;
+      }
+    });
+    arrName.splice(num, 1);
+    this.state.ModalData.welfareAnnexUrl = arr.join(",");
+    this.state.ModalData.welfareAnnexName = arrName.join(",");
+    this.setState({
+      ModalData: this.state.ModalData,
+    });
+  },
   getList() {
     this.setState({
       loading: true,
@@ -1211,7 +1478,7 @@ const PersonnelAll = React.createClass({
       crossDomain: false,
       url: globalConfig.context + "/api/admin/personnel/updateEntry",
       data: {
-        id: this.state.id,
+        id: this.state.ModalData.id,
         school: this.state.school,
         education: this.state.education,
         major: this.state.major,
@@ -1263,6 +1530,12 @@ const PersonnelAll = React.createClass({
       quitVisible: false,
     });
   },
+  welfareCancel() {
+    this.tableRowClick(this.state.ModalData);
+    this.setState({
+      welfareVisible: false,
+    });
+  },
   upgradeModal(flag, index) {
     this.setState({
       upgradeVisible: true,
@@ -1333,6 +1606,11 @@ const PersonnelAll = React.createClass({
       quitList: flag ? obj : this.state.ModalData.quitList[index],
     });
   },
+  welfareModal() {
+    this.setState({
+      welfareVisible: true,
+    });
+  },
   editUpgrade() {
     console.log(this.state.promotionList);
     this.setState({
@@ -1480,6 +1758,39 @@ const PersonnelAll = React.createClass({
       }.bind(this)
     );
   },
+  editWelfare() {
+    this.setState({
+      loading: true,
+    });
+    $.ajax({
+      method: "post",
+      dataType: "json",
+      crossDomain: false,
+      url: globalConfig.context + "/api/admin/personnel/updateWelfare",
+      data: {
+        pdId: this.state.ModalData.id,
+        annexUrl: this.state.ModalData.welfareAnnexUrl,
+        annexName: this.state.ModalData.welfareAnnexName,
+        remarks: this.state.ModalData.welfareRemarks,
+      },
+      success: function (data) {
+        let theArr = [];
+        if (data.error && data.error.length) {
+          message.warning(data.error[0].message);
+        } else {
+          this.loadData();
+          this.welfareCancel();
+          message.success("修改成功");
+        }
+      }.bind(this),
+    }).always(
+      function () {
+        this.setState({
+          loading: false,
+        });
+      }.bind(this)
+    );
+  },
   render() {
     const rowSelection = {
       selectedRowKeys: this.state.selectedRowKeys,
@@ -1637,7 +1948,7 @@ const PersonnelAll = React.createClass({
                 onChange={(e) => {
                   this.setState({ educationSearch: e });
                 }}
-                style={{ width: 120, marginRight: 370 }}
+                style={{ width: 120, }}
                 value={this.state.educationSearch}
               >
                 <Option value="0">高中/中专</Option>
@@ -1646,6 +1957,7 @@ const PersonnelAll = React.createClass({
                 <Option value="3">研究生</Option>
                 <Option value="5">博士</Option>
               </Select>
+              <br />
               <span style={{}}>转正日期:</span>
               <RangePicker
                 style={{ marginRight: 10 }}
@@ -1741,7 +2053,7 @@ const PersonnelAll = React.createClass({
             </Button>
           </TabPane>
         </Tabs>
-        <div className="patent-table">
+        <div className="patent-table" style={{ marginTop: 10 }}>
           <Spin spinning={this.state.loading}>
             <Table
               bordered
@@ -1882,7 +2194,6 @@ const PersonnelAll = React.createClass({
                   style={{ width: "200px" }}
                   onChange={(e, pre) => {
                     this.setState({ residence: e });
-                    console.log(e, pre);
                   }}
                 />
                 {/* <span style={{ color: "red", marginLeft: "15px" }}>*</span> */}
@@ -1917,7 +2228,6 @@ const PersonnelAll = React.createClass({
                   style={{ width: "200px" }}
                   onChange={(e, pre) => {
                     this.setState({ now: e });
-                    console.log(e, pre);
                   }}
                 />
                 {/* <span style={{ color: "red", marginLeft: "15px" }}>*</span> */}
@@ -1948,7 +2258,6 @@ const PersonnelAll = React.createClass({
                   style={{ width: "200px" }}
                   onChange={(e, pre) => {
                     this.setState({ nativePlace: e });
-                    console.log(e, pre);
                   }}
                 />
                 {/* <span style={{ color: "red", marginLeft: "15px" }}>*</span> */}
@@ -2595,7 +2904,7 @@ const PersonnelAll = React.createClass({
                   <Option value="1">专科/高职</Option>
                   <Option value="2">本科</Option>
                   <Option value="3">研究生</Option>
-                  <Option value="4">博士</Option>
+                  <Option value="5">博士</Option>
                 </Select>
               </FormItem>
             </div>
@@ -3279,7 +3588,11 @@ const PersonnelAll = React.createClass({
               this.state.ModalData.quitList.map((item, index) => {
                 return (
                   <div
-                    style={{ width: "100%", borderBottom: "1px dashed #ccc", position: "relative" }}
+                    style={{
+                      width: "100%",
+                      borderBottom: "1px dashed #ccc",
+                      position: "relative",
+                    }}
                   >
                     <Button
                       style={{
@@ -3333,6 +3646,46 @@ const PersonnelAll = React.createClass({
                 暂无奖惩情况
               </div>
             )}
+            <div className="title-peo">
+              <span>福利情况</span>
+              <Button
+                type="primary"
+                onClick={(e) => {
+                  this.welfareModal();
+                }}
+                style={{ position: "absolute", right: 0, height: 30 }}
+              >
+                修改福利信息
+              </Button>
+            </div>
+            <Table
+              columns={this.state.welfareColumns}
+              dataSource={this.state.ModalData.welfareList}
+              pagination={false}
+              bordered
+              size="small"
+              scroll={{ x: "max-content", y: 0 }}
+            />
+            <div className="clearfix" style={{ marginTop: 20 }}>
+              <FormItem
+                className="half-item"
+                labelCol={{ span: 6 }}
+                wrapperCol={{ span: 30 }}
+                label="备注"
+              >
+                {this.state.ModalData.welfareRemarks}
+              </FormItem>
+            </div>
+            <div
+              className="clearfix"
+              style={{ paddingLeft: 70, marginBottom: 50 }}
+            >
+              <div style={{ marginBottom: 10 }}>附件:</div>
+              <PicModal
+                remarks={this.picToArr(this.state.ModalData.welfareAnnexName)}
+                picUrl={this.picToArr(this.state.ModalData.welfareAnnexUrl)}
+              />
+            </div>
           </Spin>
         </Modal>
         <Modal
@@ -3876,6 +4229,284 @@ const PersonnelAll = React.createClass({
             />
           </Spin>
         </Modal>
+        <Modal
+          visible={this.state.welfareVisible}
+          footer={null}
+          width={800}
+          onCancel={() => {
+            this.loadData();
+            this.welfareCancel();
+          }}
+        >
+          <Spin spinning={this.state.loading}>
+            <h3
+              style={{
+                textAlign: "center",
+                paddingBottom: 10,
+                marginBottom: 10,
+              }}
+            >
+              福利信息
+            </h3>
+            <Button
+              type="primary"
+              onClick={(e) => {
+                this.welfareTable();
+              }}
+            >
+              新建信息
+            </Button>
+            <div>
+              <div className="clearfix" style={{ marginBottom: 10 }}>
+                <Table
+                  columns={this.state.welfareColumnsEdit}
+                  type="textarea"
+                  dataSource={this.state.ModalData.welfareList}
+                  pagination={false}
+                  bordered
+                  size="small"
+                  scroll={{ x: "max-content", y: 0 }}
+                />
+              </div>
+              <div className="clearfix">
+                <FormItem
+                  className="half-item"
+                  labelCol={{ span: 6 }}
+                  wrapperCol={{ span: 30 }}
+                  label="备注"
+                >
+                  <Input
+                    placeholder="请输入备注"
+                    style={{ width: 200 }}
+                    value={this.state.ModalData.welfareRemarks}
+                    onChange={(e) => {
+                      this.state.ModalData.welfareRemarks = e.target.value;
+                      this.setState({
+                        ModalData: this.state.ModalData,
+                      });
+                    }}
+                  />
+                </FormItem>
+              </div>
+              <div
+                className="clearfix"
+                style={{ paddingLeft: 70, marginBottom: 10 }}
+              >
+                <div style={{ marginBottom: 10 }}>附件:</div>
+                <PicModal
+                  remarks={this.picToArr(this.state.ModalData.welfareAnnexName)}
+                  picUrl={this.picToArr(this.state.ModalData.welfareAnnexUrl)}
+                  remove={this.welfareRemove}
+                />
+                <Button onClick={this.addPic}>添加附件</Button>
+              </div>
+            </div>
+
+            <Button
+              type="primary"
+              shape="round"
+              size="large"
+              style={{
+                position: "relative",
+                left: "50%",
+                transform: "translateX(-50%)",
+              }}
+              onClick={this.editWelfare}
+            >
+              保存
+            </Button>
+            <AddPicModal
+              cancel={this.addPicModalCancel}
+              add={this.add()}
+              visible={this.state.addPicModal}
+            />
+          </Spin>
+        </Modal>
+        <Modal
+          visible={this.state.editWelfareVisible}
+          footer={null}
+          width={800}
+          onCancel={() => {
+            this.setState({
+              editWelfareVisible: false,
+            });
+          }}
+        >
+          <Spin spinning={this.state.loading}>
+            <div>
+              <div className="clearfix">
+                <FormItem
+                  className="half-item"
+                  labelCol={{ span: 6 }}
+                  wrapperCol={{ span: 30 }}
+                  label="福利类型"
+                >
+                  <Select
+                    placeholder="请选择类型"
+                    value={this.state.editWelfareData.type}
+                    onChange={(e) => {
+                      this.state.editWelfareData.type = e;
+                      this.setState({
+                        editWelfareData: this.state.editWelfareData,
+                      });
+                    }}
+                    style={{ width: 120, marginRight: 10 }}
+                  >
+                    <Option value={0}>社保</Option>
+                    <Option value={1}>公积金</Option>
+                    <Option value={2}>雇主险</Option>
+                  </Select>
+                </FormItem>
+                <FormItem
+                  className="half-item"
+                  labelCol={{ span: 6 }}
+                  wrapperCol={{ span: 30 }}
+                  label="福利状态"
+                >
+                  <Select
+                    placeholder="请选择状态"
+                    onChange={(e) => {
+                      this.state.editWelfareData.status = e;
+                      this.setState({
+                        editWelfareData: this.state.editWelfareData,
+                      });
+                    }}
+                    style={{ width: 120, marginRight: 10 }}
+                    value={this.state.editWelfareData.status}
+                  >
+                    <Option value={0}>未购买</Option>
+                    <Option value={1}>已购买</Option>
+                    <Option value={2}>已停止</Option>
+                  </Select>
+                </FormItem>
+              </div>
+              <div className="clearfix">
+                <FormItem
+                  className="half-item"
+                  labelCol={{ span: 6 }}
+                  wrapperCol={{ span: 30 }}
+                  style={{
+                    display:
+                      this.state.editWelfareData.status == 1 ? "block" : "none",
+                  }}
+                  label="购买时间"
+                >
+                  <DatePicker
+                    value={
+                      this.state.editWelfareData.startTimes
+                        ? moment(this.state.editWelfareData.startTimes)
+                        : null
+                    }
+                    style={{ width: 200 }}
+                    onChange={(e, t) => {
+                      this.state.editWelfareData.startTimes = t;
+                      this.setState({
+                        editWelfareData: this.state.editWelfareData,
+                      });
+                    }}
+                  />
+                </FormItem>
+                <FormItem
+                  className="half-item"
+                  labelCol={{ span: 6 }}
+                  wrapperCol={{ span: 30 }}
+                  style={{
+                    display:
+                      this.state.editWelfareData.status == 2 ? "block" : "none",
+                  }}
+                  label="停缴时间"
+                >
+                  <DatePicker
+                    value={
+                      this.state.editWelfareData.endTimes
+                        ? moment(this.state.editWelfareData.endTimes)
+                        : null
+                    }
+                    style={{ width: 200 }}
+                    onChange={(e, t) => {
+                      this.state.editWelfareData.endTimes = t;
+                      this.setState({
+                        editWelfareData: this.state.editWelfareData,
+                      });
+                    }}
+                  />
+                </FormItem>
+              </div>
+              <div className="clearfix">
+                <FormItem
+                  className="half-item"
+                  labelCol={{ span: 6 }}
+                  wrapperCol={{ span: 30 }}
+                  style={{
+                    display:
+                      this.state.editWelfareData.status == 1 ? "block" : "none",
+                  }}
+                  label="参保公司"
+                >
+                  <Select
+                    placeholder="选择公司"
+                    style={{ width: 200, marginRight: 10 }}
+                    value={
+                      this.state.editWelfareData.depId
+                        ? this.state.editWelfareData.depId
+                        : undefined
+                    }
+                    onChange={(e) => {
+                      this.state.editWelfareData.depId = e;
+                      this.setState({
+                        editWelfareData: this.state.editWelfareData,
+                      });
+                    }}
+                  >
+                    {departmentArr.map(function (item) {
+                      return (
+                        <Select.Option key={item.id}>{item.name}</Select.Option>
+                      );
+                    })}
+                  </Select>
+                </FormItem>
+              </div>
+              <div className="clearfix">
+                <FormItem
+                  className="half-item"
+                  labelCol={{ span: 6 }}
+                  wrapperCol={{ span: 30 }}
+                  style={{
+                    display:
+                      this.state.editWelfareData.status == 0 ? "block" : "none",
+                  }}
+                  label="未购买备注"
+                >
+                  <Input
+                    placeholder="请输入备注信息"
+                    style={{ width: 200 }}
+                    value={this.state.editWelfareData.welfareRemarks}
+                    onChange={(e) => {
+                      this.state.editWelfareData.welfareRemarks =
+                        e.target.value;
+                      this.setState({
+                        editWelfareData: this.state.editWelfareData,
+                      });
+                    }}
+                  />
+                </FormItem>
+              </div>
+            </div>
+            <Button
+              type="primary"
+              shape="round"
+              size="large"
+              style={{
+                position: "relative",
+                left: "50%",
+                transform: "translateX(-50%)",
+              }}
+              onClick={this.editWelfareDataOk}
+            >
+              保存
+            </Button>
+          </Spin>
+        </Modal>
       </div>
     );
   },