个税对接-人员信息报送详情页

2023-08-14 14:46:19 +08:00 · 2023-08-14 14:46:19 +08:00 · 9cb47f784c
parent cfe1ed7773
commit 9cb47f784c
7 changed files with 361 additions and 23 deletions
--- a/pc4mobx/hrmSalary/pages/employeedeclareDetail/components/baseInfo.js
+++ b/pc4mobx/hrmSalary/pages/employeedeclareDetail/components/baseInfo.js
@ -0,0 +1,29 @@
+/*
+ * Author: 黎永顺
+ * name: 人员信息报送-基础信息
+ * Description:
+ * Date: 2023/8/14
+ */
+import React, { Component } from "react";
+import { WeaLocaleProvider } from "ecCom";
+import { getQueryString } from "../../../util/url";
+
+const { getLabel } = WeaLocaleProvider;
+
+class BaseInfo extends Component {
+  render() {
+    return (
+      <div className="base-info">
+        <div className="left"><span>{getLabel(537996, "个税扣缴义务人")}：{getQueryString("taxName")}</span></div>
+        <div className="right">
+          <div className="header-declare-info">
+            <a href="javascript:void(0);" className="fail">{getLabel(111, "报送失败")}:&nbsp;&nbsp;0</a>
+            <span className="not">{getLabel(111, "未报送")}:&nbsp;&nbsp;0</span>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+export default BaseInfo;
--- a/pc4mobx/hrmSalary/pages/employeedeclareDetail/components/employeeDeclareDetailSchemaEditDialog.js
+++ b/pc4mobx/hrmSalary/pages/employeedeclareDetail/components/employeeDeclareDetailSchemaEditDialog.js
@ -0,0 +1,35 @@
+/*
+ * Author: 黎永顺
+ * name: 报送信息-编辑、新增弹框
+ * Description:
+ * Date: 2023/8/14
+ */
+import React, { Component } from "react";
+import { WeaLocaleProvider, WeaSlideModal } from "ecCom";
+import { Button, Col, Row } from "antd";
+
+const { getLabel } = WeaLocaleProvider;
+
+class EmployeeDeclareDetailSchemaEditDialog extends Component {
+  render() {
+    return (
+      <WeaSlideModal
+        {...this.props}
+        top={0} measureT="%"
+        width={800} measureX="px"
+        height={100} measureY="%"
+        direction="right"
+        title={(<Row className="declareSchemeDialogTitle" type="flex">
+          <Col span={12}>
+            <i className="icon-coms-fa"/>
+            <span className="title">{getLabel(111, "本月新增数据")}</span>
+          </Col>
+          <Col span={12} style={{ textAlign: "right" }}><Button type="primary">保存</Button></Col>
+        </Row>)}
+        content={(<div className="declareSchemeDialog">Content</div>)}
+      />
+    );
+  }
+}
+
+export default EmployeeDeclareDetailSchemaEditDialog;
--- a/pc4mobx/hrmSalary/pages/employeedeclareDetail/constants.js
+++ b/pc4mobx/hrmSalary/pages/employeedeclareDetail/constants.js
@ -25,3 +25,163 @@ export const submitStatus = [
    lanId: 111
  }
 ];
+
+export const advanceConditions = [
+  {
+    items: [
+      {
+        colSpan: 1,
+        conditionType: "INPUT",
+        domkey: ["keyword"],
+        fieldcol: 18,
+        label: "姓名或工号",
+        lanId: 111,
+        labelcol: 6,
+        value: ""
+      },
+      {
+        browserConditionParam: {
+          completeParams: {},
+          conditionDataParams: {},
+          dataParams: {},
+          destDataParams: {},
+          hasAddBtn: false,
+          hasAdvanceSerach: true,
+          idSeparator: ",",
+          isAutoComplete: 1,
+          isDetail: 0,
+          isMultCheckbox: false,
+          isSingle: false,
+          linkUrl: "",
+          pageSize: 10,
+          quickSearchName: "",
+          replaceDatas: [],
+          title: "",
+          type: "57"
+        },
+        colSpan: 1,
+        conditionType: "BROWSER",
+        domkey: ["departmentIds"],
+        fieldcol: 18,
+        label: "部门",
+        lanId: 27511,
+        labelcol: 6
+      },
+      {
+        browserConditionParam: {
+          completeParams: {},
+          conditionDataParams: {},
+          dataParams: {},
+          destDataParams: {},
+          hasAddBtn: false,
+          hasAdvanceSerach: true,
+          idSeparator: ",",
+          isAutoComplete: 1,
+          isDetail: 0,
+          isMultCheckbox: false,
+          isSingle: false,
+          linkUrl: "",
+          pageSize: 10,
+          quickSearchName: "",
+          replaceDatas: [],
+          title: "",
+          type: "278"
+        },
+        colSpan: 1,
+        conditionType: "BROWSER",
+        domkey: ["positionIds"],
+        fieldcol: 18,
+        label: "岗位",
+        lanId: 6086,
+        labelcol: 6
+      },
+      {
+        colSpan: 1,
+        conditionType: "SELECT",
+        domkey: ["employmentStatus"],
+        fieldcol: 18,
+        label: "人员状态",
+        lanId: 382300,
+        labelcol: 6,
+        value: "",
+        options: []
+      },
+      {
+        colSpan: 1,
+        conditionType: "SELECT",
+        domkey: ["employmentType"],
+        fieldcol: 18,
+        label: "任职受雇从业类型",
+        lanId: 111,
+        labelcol: 6,
+        value: "",
+        options: []
+      },
+      {
+        colSpan: 1,
+        conditionType: "RANGEPICKER",
+        domkey: ["fromEmploymentDate", "endEmploymentDate"],
+        fieldcol: 18,
+        label: "任职受雇日期",
+        lanId: 111,
+        labelcol: 6,
+        value: ""
+      },
+      {
+        colSpan: 1,
+        conditionType: "RANGEPICKER",
+        domkey: ["fromDismissDate", "endDismissDate"],
+        fieldcol: 18,
+        label: "离职日期",
+        lanId: 111,
+        labelcol: 6,
+        value: ""
+      },
+      {
+        colSpan: 1,
+        conditionType: "SELECT",
+        domkey: ["disability"],
+        fieldcol: 18,
+        label: "是否残疾",
+        lanId: 111,
+        labelcol: 6,
+        value: "",
+        options: []
+      },
+      {
+        colSpan: 1,
+        conditionType: "SELECT",
+        domkey: ["lonelyOld"],
+        fieldcol: 18,
+        label: "是否孤老",
+        lanId: 111,
+        labelcol: 6,
+        value: "",
+        options: []
+      },
+      {
+        colSpan: 1,
+        conditionType: "SELECT",
+        domkey: ["martyrDependents"],
+        fieldcol: 18,
+        label: "是否是烈属",
+        lanId: 111,
+        labelcol: 6,
+        value: "",
+        options: []
+      },
+      {
+        colSpan: 1,
+        conditionType: "SELECT",
+        domkey: ["deductExpenses"],
+        fieldcol: 18,
+        label: "是否扣除减除费用",
+        lanId: 111,
+        labelcol: 6,
+        value: "",
+        options: []
+      }
+    ],
+    defaultshow: true
+  }
+];
--- a/pc4mobx/hrmSalary/pages/employeedeclareDetail/index.js
+++ b/pc4mobx/hrmSalary/pages/employeedeclareDetail/index.js
@ -6,30 +6,59 @@
 */
 import React, { Component } from "react";
 import { WeaDatePicker, WeaLocaleProvider, WeaSelect, WeaTab, WeaTop } from "ecCom";
-import { submitStatus } from "./constants";
-import { Button, Dropdown, Menu } from "antd";
+import { Button, Dropdown, Menu, Spin } from "antd";
+import BaseInfo from "./components/baseInfo";
+import { advanceConditions, submitStatus } from "./constants";
+import { getSearchs } from "../../util";
 import { inject, observer } from "mobx-react";
+import { toJS } from "mobx";
 import "./index.less";

 const { getLabel } = WeaLocaleProvider;

-@inject("taxAgentStore")
+@inject("taxAgentStore", "employeeDeclareStore")
@observer
 class Index extends Component {
  constructor(props) {
    super(props);
    this.state = {
-      selectedKey: "0"
+      selectedKey: "0",
+      showSearchAd: false,
+      declareStatus: "ALL",
+      taxCycle: new Date()
    };
  }

  componentDidMount() {
+    const { employeeDeclareStore: { advanceForm } } = this.props;
    document.title = getLabel(544289, "人员信息报送");
+    advanceForm.initFormFields(advanceConditions);
+    window.addEventListener("message", this.handleReceive, false);
  }

+  componentWillUnmount() {
+    window.removeEventListener("message", this.handleReceive, false);
+  }
+
+  handleReceive = ({ data }) => {
+    const { type, payload: { id, params } = {} } = data;
+    if (type === "init") {
+      this.postMessageToChild({});
+    } else if (type === "turn") {
+      if (id === "PAGEINFO") {
+        const { pageNum: current, size: pageSize } = params;
+        this.setState({ pageInfo: { ...pageInfo, current, pageSize } });
+      }
+    }
+  };
+  postMessageToChild = (payload) => {
+    const childFrameObj = document.getElementById("atdTable");
+    childFrameObj && childFrameObj.contentWindow.postMessage(JSON.stringify({}), "*");
+  };
+
  render() {
-    const { selectedKey } = this.state;
-    const { taxAgentStore: { showOperateBtn } } = this.props;
+    const { selectedKey, showSearchAd, declareStatus, taxCycle } = this.state;
+    const { taxAgentStore: { showOperateBtn }, employeeDeclareStore: { advanceForm: form } } = this.props;
    const menu = (
      <Menu>
        <Menu.Item key="1">{getLabel(32136, "批量删除")}</Menu.Item>
@ -42,7 +71,8 @@ class Index extends Component {
      <Button type="primary">{getLabel(111, "全部报送")}</Button>,
      <Button type="ghost">{getLabel(111, "获取报送结果")}</Button>,
      <Button type="ghost">{getLabel(111, "刷新数据")}</Button>,
-      <WeaDatePicker format="YYYY-MM" style={{ width: 200 }}/>,
+      <WeaDatePicker arrow type="month" className="pickerDateCustom flex a-center" value={taxCycle}
+                     onChange={val => console.log(val)}/>,
      <Dropdown overlay={menu}>
        <Button type="ghost" icon="ellipsis" className="moreBtn"/>
      </Dropdown>
@ -58,27 +88,45 @@ class Index extends Component {
        icon={<i className="icon-coms-fa"/>} className="declareWrapper"
        buttons={showOperateBtn ? buttons : []}
      >
-        <div style={{ height: "100%", background: "#f6f6f6" }}>
-          <div className="base-info">
-            <div className="left"><span>{getLabel(537996, "个税扣缴义务人")}：</span></div>
-            <div className="right">
-              <div className="header-declare-info">
-                <a href="javascript:void(0);" className="fail">{getLabel(111, "报送失败")}:&nbsp;&nbsp;0</a>
-                <span className="not">{getLabel(111, "未报送")}:&nbsp;&nbsp;0</span>
-              </div>
-            </div>
-          </div>
-          <div className="listview-com-layout">
+        <div style={{ height: "100%", background: "#f6f6f6" }} className="flex flex-rollback">
+          {/*基础信息*/}
+          <BaseInfo/>
+          {/*列表数据*/}
+          <div className="listview-com-layout flex-1 flex flex-rollback">
            <WeaTab
-              datas={topTab} keyParam="viewcondition"
+              datas={topTab} keyParam="viewcondition" showSearchAd={showSearchAd}
              selectedKey={selectedKey} searchType={["base", "advanced"]}
+              setShowSearchAd={bool => this.setState({ showSearchAd: bool })}
+              advanceHeight={300} searchsAd={getSearchs(form, toJS(advanceConditions), 2)}
              buttons={[
+                <Dropdown.Button
+                  overlay={
+                    <Menu>
+                      <Menu.Item key="1">{getLabel(32935, "导入")}</Menu.Item>
+                    </Menu>
+                  }
+                  type="primary">{getLabel(1421, "新增")}</Dropdown.Button>,
                <WeaSelect
-                  style={{ width: 200 }}
-                  options={_.map(submitStatus, it => ({ ...it, showname: getLabel(it.lanId, it.showname) }))}/>
-              ]}
+                  value={declareStatus}
+                  style={{ width: 150 }}
+                  options={_.map(submitStatus, it => ({ ...it, showname: getLabel(it.lanId, it.showname) }))}
+                  onChange={declareStatus => this.setState({ declareStatus })}
+                />
+              ]} searchsBaseValue={form.getFormParams().keyword}
+              onSearchChange={(v) => form.updateFields({ keyword: v })}
              onChange={key => this.setState({ selectedKey: key })}
+              onAdReset={() => form.resetForm()}
            />
+            <div className="flex-1">
+              <Spin spinning={false}>
+                <iframe
+                  style={{ border: 0, width: "100%", height: "100%" }}
+                  src="http://localhost:7607/#/employeeDeclareTable"
+                  // src="/spa/hrmSalary/hrmSalaryCalculateDetail/index.html#/employeeDeclareTable"
+                  id="atdTable"
+                />
+              </Spin>
+            </div>
          </div>
        </div>
      </WeaTop>
--- a/pc4mobx/hrmSalary/pages/employeedeclareDetail/index.less
+++ b/pc4mobx/hrmSalary/pages/employeedeclareDetail/index.less
@ -49,3 +49,54 @@
    }
  }
 }
+
+.pickerDateCustom {
+  .icon-coms-Browse-box-delete, .icon-coms-Browse-box-Add-to {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border: 1px solid #e5e5e5;
+    background: transparent;
+    cursor: pointer;
+    outline: none;
+    padding: 0 6px;
+    height: 30px;
+    top: auto;
+  }
+
+  .icon-coms-Browse-box-delete:hover, .icon-coms-Browse-box-Add-to:hover {
+    color: #5d9cec;
+  }
+
+}
+
+.ant-calendar-picker-container {
+  right: 0 !important;
+  left: auto !important;
+}
+
+.declareSchemeDialog {
+  height: 100%;
+  padding: 16px;
+  overflow-y: auto;
+}
+
+.flex {
+  display: flex;
+}
+
+.flex-rollback {
+  flex-direction: column;
+}
+
+.flex-1 {
+  flex: 1;
+
+  .ant-spin-nested-loading, .ant-spin-container {
+    height: 99%;
+  }
+}
+
+.a-center {
+  align-items: center;
+}
--- a/pc4mobx/hrmSalary/stores/employeeDeclare.js
+++ b/pc4mobx/hrmSalary/stores/employeeDeclare.js
@ -0,0 +1,13 @@
+import { action, observable } from "mobx";
+import { WeaForm, WeaTableNew } from "comsMobx";
+
+const { TableStore } = WeaTableNew;
+
+export class EmployeeDeclareStore {
+  @observable advanceForm = new WeaForm(); //人员信息报送详情页面，高级搜索form实例
+  @observable tableStore = new TableStore();
+
+  @action("...")
+  Init = () => {
+  };
+}
--- a/pc4mobx/hrmSalary/stores/index.js
+++ b/pc4mobx/hrmSalary/stores/index.js
@ -19,6 +19,7 @@ import { StandingBookStore } from "./StandingBook";
 import { PayrollFilesStore } from "./payrollFiles";
 import { SpecialAddStore } from "./specialAdd";
 import { ExternalPersonManageStore } from "./externalPersonManage";
+import { EmployeeDeclareStore } from "./employeeDeclare";

 module.exports = {
  baseFormStore: new BaseFormStore(),
@ -41,5 +42,6 @@ module.exports = {
  standingBookStore: new StandingBookStore(),
  payrollFilesStore: new PayrollFilesStore(),
  specialAddStore: new SpecialAddStore(),
-  externalPersonManageStore: new ExternalPersonManageStore()
+  externalPersonManageStore: new ExternalPersonManageStore(),
+  employeeDeclareStore: new EmployeeDeclareStore()
 };