From 3affb156b9ad46d557de3a40c118c7b7fe7b70b3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=BB=8E=E6=B0=B8=E9=A1=BA?= <971387674@qq.com>
Date: Mon, 20 Feb 2023 09:41:36 +0800
Subject: [PATCH] =?UTF-8?q?=E6=95=B0=E6=8D=AE=E9=87=87=E9=9B=86=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E9=87=8D=E6=9E=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../pages/dataAcquisition/cumDeduct/index.js  | 90 +++++++++++++++----
 .../pages/dataAcquisition/dataTables.js       | 38 ++++++--
 .../pages/dataAcquisition/index.less          | 35 ++++++--
 .../hrmSalary/pages/dataAcquisition/layout.js | 48 +++++++++-
 4 files changed, 179 insertions(+), 32 deletions(-)

diff --git a/pc4mobx/hrmSalary/pages/dataAcquisition/cumDeduct/index.js b/pc4mobx/hrmSalary/pages/dataAcquisition/cumDeduct/index.js
index a442c1f9..1c7be755 100644
--- a/pc4mobx/hrmSalary/pages/dataAcquisition/cumDeduct/index.js
+++ b/pc4mobx/hrmSalary/pages/dataAcquisition/cumDeduct/index.js
@@ -1,11 +1,11 @@
 import React, { Component } from "react";
 import { inject, observer } from "mobx-react";
 import { WeaDatePicker, WeaFormItem, WeaHelpfulTip, WeaSearchGroup, WeaSelect } from "ecCom";
-import { Button, Dropdown, Menu } from "antd";
+import { Button, Dropdown, Menu, message } from "antd";
+import { autoAddAll } from "../../../apis/cumDeduct";
 import DataTables from "../dataTables";
 import Layout from "../layout";
 import moment from "moment";
-import "../index.less";
 
 @inject("taxAgentStore")
 @observer
@@ -15,11 +15,68 @@ class Index extends Component {
     this.state = {
       declareMonth: moment(new Date()).format("YYYY-MM"),
       taxAgentId: "",
-      innerWidth: window.innerWidth
+      innerWidth: window.innerWidth,
+      addAllLoading: false,
+      slidePayload: {
+        visible: false,
+        title: "",
+        children: null,
+        id: ""
+      }
     };
+    this.tableRef = null;
   }
 
+  /*
+   * Author: 黎永顺
+   * Description:一键累计
+   * Params:
+   * Date: 2023/2/17
+   */
+  autoAddAll = () => {
+    const { monthValue: declareMonth } = this.state;
+    this.setState({ addAllLoading: true });
+    autoAddAll({ yearMonth: declareMonth }).then(({ status, data, errormsg }) => {
+      this.setState({ addAllLoading: false });
+      if (status) {
+        message.success(data || "操作成功");
+        this.tableRef.getTableDate();
+      } else {
+        message.error(errormsg || "操作失败");
+      }
+    }).catch(() => this.setState({ addAllLoading: false }));
+  };
+
   handleResize = (innerWidth) => this.setState({ innerWidth });
+  /*
+   * Author: 黎永顺
+   * Description:新增数据采集-累计专项附加扣除
+   * Params:
+   * Date: 2023/2/20
+   */
+  handleAddData = () => {
+    const { slidePayload } = this.state;
+    this.setState({
+      slidePayload: {
+        ...slidePayload,
+        visible: true,
+        title: "新建",
+        chidren: <h1>3433333</h1>
+      }
+    });
+  };
+  handleCloseSlide = () => {
+    const { slidePayload } = this.state;
+    this.setState({
+      slidePayload: {
+        ...slidePayload,
+        visible: false,
+        title: "",
+        chidren: null,
+        id: ""
+      }
+    });
+  };
   /*
    * Author: 黎永顺
    * Description: 筛选组件
@@ -52,7 +109,7 @@ class Index extends Component {
                            col={innerWidth < 900 ? 1 : 2}/>;
   };
   screenChange = ({ key, value }) => {
-    console.log(key, value);
+    this.setState({ [key]: value }, () => this.tableRef.getTableDate());
   };
   /*
    * Author: 黎永顺
@@ -61,10 +118,11 @@ class Index extends Component {
    * Date: 2023/2/17
    */
   getTopBtns = () => {
+    const { addAllLoading } = this.state;
     return [
-      <Button type="primary"> 导入 </Button>,
-      <Button type="ghost"> 新建 </Button>,
-      <Button type="ghost"> 一键累计 </Button>,
+      <Button type="primary">导入</Button>,
+      <Button type="ghost" onClick={this.handleAddData}>新建</Button>,
+      <Button type="ghost" loading={addAllLoading} onClick={this.autoAddAll}>一键累计</Button>,
       <Dropdown
         overlay={
           <Menu className="dropdownMenuWrapper" onClick={this.handleMenuClick}>
@@ -84,17 +142,19 @@ class Index extends Component {
   };
 
   render() {
-    const { declareMonth, taxAgentId } = this.state;
-    const tablePayload = {
-      declareMonth: [declareMonth],
-      taxAgentId
-    };
+    const { taxAgentStore: { showOperateBtn } } = this.props;
+    const { declareMonth, taxAgentId, slidePayload } = this.state;
+    const tablePayload = { declareMonth: [declareMonth], taxAgentId };
     return (
       <Layout title="累计专项附加扣除" btns={this.getTopBtns()} leftComp={this.getScreen()}
-              onResizeWindowInnerWidth={this.handleResize}>
+              onResizeWindowInnerWidth={this.handleResize} slidePayload={...slidePayload}
+              onClose={this.handleCloseSlide}
+      >
         <DataTables
+          ref={dom => this.tableRef = dom}
           url="/api/bs/hrmsalary/addUpDeduction/list"
           payload={tablePayload}
+          showOperateBtn={showOperateBtn}
         />
       </Layout>
     );
@@ -106,13 +166,13 @@ export default Index;
 const DataCollectionDatePicker = (props) => {
   const { value, label, onChange, format = "YYYY-MM", key } = props;
   return <WeaFormItem label={label} labelCol={{ span: 8 }} wrapperCol={{ span: 16 }}>
-    <WeaDatePicker value={value} onChange={() => onChange({ key, value })} format={format}/>
+    <WeaDatePicker value={value} onChange={(val) => onChange({ key, value: val })} format={format}/>
     <WeaHelpfulTip title="提示：默认显示本年截至当前月所有员工申报的累计专项附加及其他扣除额" width={200}/>
   </WeaFormItem>;
 };
 const DataCollectionSelect = (props) => {
   const { value, label, onChange, options, key } = props;
   return <WeaFormItem label={label} labelCol={{ span: 10 }} wrapperCol={{ span: 14 }}>
-    <WeaSelect value={value} onChange={() => onChange({ key, value })} options={options}/>
+    <WeaSelect value={value} onChange={(val) => onChange({ key, value: val })} options={options}/>
   </WeaFormItem>;
 };
diff --git a/pc4mobx/hrmSalary/pages/dataAcquisition/dataTables.js b/pc4mobx/hrmSalary/pages/dataAcquisition/dataTables.js
index 674f8399..c6f8b5c5 100644
--- a/pc4mobx/hrmSalary/pages/dataAcquisition/dataTables.js
+++ b/pc4mobx/hrmSalary/pages/dataAcquisition/dataTables.js
@@ -5,13 +5,10 @@
  * Date: 2023/2/17
  */
 import React, { Component } from "react";
-import { inject, observer } from "mobx-react";
 import UnifiedTable from "../../components/UnifiedTable";
 import { getTableDate } from "../../apis/cumDeduct";
 import { Menu, Popover } from "antd";
 
-@inject("taxAgentStore")
-@observer
 class DataTables extends Component {
   constructor(props) {
     super(props);
@@ -35,7 +32,7 @@ class DataTables extends Component {
   getTableDate = () => {
     const { loading, pageInfo } = this.state;
     const { url, payload } = this.props;
-    const module = { url, ...payload };
+    const module = { ...pageInfo, url, ...payload };
     this.setState({ loading: { ...loading, query: true } });
     getTableDate(module).then(({ status, data }) => {
       this.setState({ loading: { ...loading, query: false } });
@@ -51,11 +48,36 @@ class DataTables extends Component {
   };
 
   render() {
-    const { columns, dataSource, loading } = this.state;
-    const { taxAgentStore: { showOperateBtn } } = this.props;
+    const { columns, dataSource, loading, selectedRowKeys, pageInfo } = this.state;
+    const { showOperateBtn } = this.props;
+    const rowSelection = {
+      selectedRowKeys,
+      onChange: (selectedRowKeys) => this.setState({ selectedRowKeys })
+    };
+    const pagination = {
+      ...pageInfo,
+      showTotal: (total) => `共 ${total} 条`,
+      pageSizeOptions: ["10", "20", "50", "100"],
+      showSizeChanger: true,
+      showQuickJumper: true,
+      onShowSizeChange: (current, pageSize) => {
+        this.setState({
+          pageInfo: { ...pageInfo, current, pageSize }
+        }, () => {
+          this.getTableDate();
+        });
+      },
+      onChange: (current) => {
+        this.setState({
+          pageInfo: { ...pageInfo, current }
+        }, () => {
+          this.getTableDate();
+        });
+      }
+    };
     return <UnifiedTable
       rowKey="id"
-      // rowSelection={rowSelection}
+      rowSelection={rowSelection}
       columns={_.map(columns, item => {
         const { dataIndex } = item;
         if (dataIndex === "username") {
@@ -103,7 +125,7 @@ class DataTables extends Component {
         }
       })}
       dataSource={dataSource}
-      // pagination={pagination}
+      pagination={pagination}
       loading={loading.query}
     />;
   }
diff --git a/pc4mobx/hrmSalary/pages/dataAcquisition/index.less b/pc4mobx/hrmSalary/pages/dataAcquisition/index.less
index 23d27e5f..467167f8 100644
--- a/pc4mobx/hrmSalary/pages/dataAcquisition/index.less
+++ b/pc4mobx/hrmSalary/pages/dataAcquisition/index.less
@@ -59,12 +59,33 @@
 
 }
 
-//下拉框菜单样式
-.dropdownMenuWrapper {
-  .ant-menu-item {
-    border-right: none;
-    padding: 0 16px;
-    height: 30px;
-    line-height: 30px;
+.slideOuterWrapper {
+  .wea-slide-modal-title {
+    height: initial;
+    line-height: initial;
+    text-align: left;
+  }
+
+  .rodal-close {
+    z-index: 99;
+    top: 10px !important;
+  }
+
+}
+
+@media (min-width: 1260px) {
+  .slideOuterWrapper {
+    .reqTopWrapper .wea-new-top-req-title > div:first-child > div {
+      max-width: 100% !important;
+    }
   }
 }
+
+@media screen and (min-width: 1060px) and (max-width: 1260px) {
+  .slideOuterWrapper {
+    .reqTopWrapper .wea-new-top-req-title > div:first-child > div {
+      max-width: calc(100% - 96px) !important;
+    }
+  }
+}
+
diff --git a/pc4mobx/hrmSalary/pages/dataAcquisition/layout.js b/pc4mobx/hrmSalary/pages/dataAcquisition/layout.js
index a5eca7ad..0a335857 100644
--- a/pc4mobx/hrmSalary/pages/dataAcquisition/layout.js
+++ b/pc4mobx/hrmSalary/pages/dataAcquisition/layout.js
@@ -6,7 +6,8 @@
  */
 import React, { Component } from "react";
 import { inject, observer } from "mobx-react";
-import { WeaNewScroll, WeaTab, WeaTop } from "ecCom";
+import { WeaNewScroll, WeaSlideModal, WeaTab, WeaTop } from "ecCom";
+import SlideModalTitle from "../../components/slideModalTitle";
 import "./index.less";
 
 @inject("taxAgentStore")
@@ -36,7 +37,11 @@ class Layout extends Component {
 
   render() {
     const { showSearchAd } = this.state;
-    const { title, btns, leftComp, children, taxAgentStore: { showOperateBtn } } = this.props;
+    const {
+      title, btns, leftComp, children, taxAgentStore: { showOperateBtn },
+      slidePayload, onClose
+    } = this.props;
+    const { visible, title: subtitle, children: slideChildren, id } = slidePayload;
     return (
       <div className="layoutWrapper">
         <WeaTop title={title} buttons={showOperateBtn ? btns : []}
@@ -52,6 +57,45 @@ class Layout extends Component {
         />
         <div className="dataContent">
           <WeaNewScroll height="100%">{children}</WeaNewScroll>
+          {/* 新增-编辑-详情弹框 */}
+          <WeaSlideModal
+            className="slideOuterWrapper"
+            visible={visible}
+            top={0}
+            measureT="%"
+            width={800}
+            measureX="px"
+            height={100}
+            measureY="%"
+            direction="right"
+            title={
+              <SlideModalTitle
+                subtitle={subtitle}
+                loading={false}
+                onSave={() => {
+                  // const { baseInfo } = this.addItemRef.state;
+                  // const bool = _.every(_.pick(baseInfo, ["declareMonth", "taxAgentId", "employeeId"]), v => !_.isEmpty(v));
+                  // if (!bool && _.isEmpty(editId)) {
+                  //   Modal.warning({
+                  //     title: "信息确认",
+                  //     content: "必要信息不完整，红色*为必填项！"
+                  //   });
+                  //   return;
+                  // }
+                  // const payload = {
+                  //   ..._.pick(baseInfo, ["declareMonth", "taxAgentId", "employeeId", "taxAgentName"]),
+                  //   ...addForm.getFormParams()
+                  // };
+                  // this.handleSaveDeduction(payload);
+                }}
+                editable={true}
+                showOperateBtn={showOperateBtn}
+                customOperate={[]}
+              />
+            }
+            content={slideChildren}
+            onClose={onClose}
+          />
         </div>
       </div>
     );