custom/钱智

pc4mobx/hrmSalary/pages/dataAcquisition/attendance/index.js

@@ -7,7 +7,9 @@
 import React, { Component } from "react";
 import { inject, observer } from "mobx-react";
 import { Button, DatePicker } from "antd";
-import { WeaFormItem, WeaInputSearch, WeaLocaleProvider, WeaNewScroll, WeaReqTop } from "ecCom";
+import { WeaInputSearch, WeaLocaleProvider, WeaNewScroll, WeaReqTop } from "ecCom";
+import { postFetch } from "../../../util/request";
+import CustomSelect from "../../../components/CustomSelect";
 import AttendanceDataComp from "./components/attendanceDataComp";
 import FieldMangComp from "./components/fieldMangComp";
 import LogDialog from "../../../components/logViewModal";
@@ -23,11 +25,17 @@ class Index extends Component {
   constructor(props) {
     super(props);
     this.state = {
-      fieldName: "", selectedKey: "DATA", salaryMonth: [],
+      fieldName: "", selectedKey: "DATA", salaryMonth: [], taxAgentIds: "", options: [],
       logDialogVisible: false, filterConditions: "[]"
     };
   }
 
+  componentDidMount() {
+    postFetch("/api/bs/hrmsalary/taxAgent/listAuth", { filterType: "QUERY_DATA" }).then(({ status, data }) => {
+      if (status) this.setState({ options: _.map(data, k => ({ key: k.id + "", showname: k.name })) });
+    });
+  }
+
   /*
    * Author: 黎永顺
    * Description: 考勤数据删选条件
@@ -35,27 +43,43 @@ class Index extends Component {
    * Date: 2023/2/24
    */
   getAttendanceDataScreen = () => {
-    const { salaryMonth } = this.state;
+    const { salaryMonth, taxAgentIds, options } = this.state;
     const [value1 = "", value2 = ""] = salaryMonth;
-    return <WeaFormItem label="薪资所属月" labelCol={{ span: 2 }} wrapperCol={{ span: 22 }}>
-      <MonthPicker
-        value={value1} format="YYYY-MM"
-        disabledDate={(current) => {
-          return current && value2 && current.getTime() > new Date(value2).getTime();
-        }}
-        onChange={(val) => this.handleChangeSalaryMonth([val ? moment(val).format("YYYY-MM") : "", value2])}
-      />
-      <span className="to">至</span>
-      <MonthPicker
-        value={value2} format="YYYY-MM"
-        disabledDate={(current) => {
-          return current && value1 && current.getTime() < new Date(value1).getTime();
-        }}
-        onChange={(val) => this.handleChangeSalaryMonth([value1, val ? moment(val).format("YYYY-MM") : ""])}
-      />
-    </WeaFormItem>;
+    return <div className="query-row">
+      <div className="query-row-item">
+        <span className="title">{getLabel(111, "薪资所属月")}:</span>
+        <div className="query-row-item-content">
+          <MonthPicker
+            value={value1} format="YYYY-MM"
+            disabledDate={(current) => {
+              return current && value2 && current.getTime() > new Date(value2).getTime();
+            }}
+            onChange={(val) => this.handleChangeSalaryMonth([val ? moment(val).format("YYYY-MM") : "", value2])}
+          />
+          <span className="to">至</span>
+          <MonthPicker
+            value={value2} format="YYYY-MM"
+            disabledDate={(current) => {
+              return current && value1 && current.getTime() < new Date(value1).getTime();
+            }}
+            onChange={(val) => this.handleChangeSalaryMonth([value1, val ? moment(val).format("YYYY-MM") : ""])}
+          />
+        </div>
+      </div>
+      <div className="query-row-item">
+        <span className="title">{getLabel(111, "个税扣缴义务人")}:</span>
+        <CustomSelect value={taxAgentIds} options={options}
+                      onChange={(val) => this.setState({ taxAgentIds: val }, () => this.attendanceTableRef.getAttendanceList({
+                        salaryYearMonth: _.compact(this.state.salaryMonth),
+                        taxAgentIds: this.state.taxAgentIds ? this.state.taxAgentIds.split(",") : []
+                      }))}/>
+      </div>
+    </div>;
   };
-  handleChangeSalaryMonth = (salaryMonth) => this.setState({ salaryMonth }, () => this.attendanceTableRef.getAttendanceList({ salaryYearMonth: _.compact(this.state.salaryMonth) }));
+  handleChangeSalaryMonth = (salaryMonth) => this.setState({ salaryMonth }, () => this.attendanceTableRef.getAttendanceList({
+    salaryYearMonth: _.compact(this.state.salaryMonth),
+    taxAgentIds: this.state.taxAgentIds ? this.state.taxAgentIds.split(",") : []
+  }));
   handleAddAttendFileds = () => this.fieldMangRef.handleTriggerAttendFileds();
   handleImportAttendanceData = () => this.attendanceTableRef.handleImportAttendanceData({ visible: true, params: {} });
   handleQuoteAttendanceData = () => {
@@ -137,4 +161,4 @@ class Index extends Component {
   }
 }
 
-export default Index;
+export default Index;

pc4mobx/hrmSalary/pages/dataAcquisition/attendance/index.less

@@ -3,19 +3,38 @@
   display: flex;
   flex-direction: column;
 
-  .wea-form-item {
-    height: 46px;
-    line-height: 46px;
-    background: #FFF;
-    margin: 8px 16px 0 16px;
+  .wea-new-top-req-content {
+    .query-row {
+      background: #FFF;
+      margin: 8px 16px 0 16px;
+      display: flex;
+      align-items: center;
 
-    .wea-form-item-label {
-      line-height: 46px !important;
-      padding-left: 8px !important;
-    }
+      & > div.query-row-item {
+        display: flex;
+        align-items: center;
+        height: 46px;
+        padding: 0 8px;
 
-    .to {
-      padding: 0 10px
+        .title {
+          margin-right: 8px;
+        }
+
+        .query-row-item-content {
+          display: flex;
+          align-items: center;
+
+          .to {
+            padding: 0 10px
+          }
+        }
+
+        .customMuiSelect {
+          min-width: 200px;
+          display: flex;
+          align-items: center;
+        }
+      }
     }
   }
 
@@ -98,5 +117,4 @@
     height: 30px;
     border-radius: 0;
   }
-}
-
+}