From 6d5258daa5da2e5a1f9a864cc28811dfb732af9d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=BB=8E=E6=B0=B8=E9=A1=BA?= <971387674@qq.com> Date: Tue, 7 Mar 2023 14:47:47 +0800 Subject: [PATCH] =?UTF-8?q?=E6=95=B0=E6=8D=AE=E9=87=87=E9=9B=86-=E8=80=83?= =?UTF-8?q?=E5=8B=A4=E5=BC=95=E7=94=A8=E9=A1=B5=E9=9D=A2=E9=87=8D=E6=9E=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- pc4mobx/hrmSalary/apis/attendance.js | 4 +- .../components/selectItemsModal/index.js | 2 +- .../selectItemsModal/selectItemsWrapper.js | 81 +++++++- .../dataAcquisition/attendance/columns.js | 42 +++++ .../components/attendanceDataComp.js | 178 ++++++------------ .../components/attendanceDataViewSlide.js | 143 ++++++++++++++ .../components/attendanceRefrenceDataModal.js | 114 +++++++++++ .../attendance/components/index.less | 34 ++++ .../pages/dataAcquisition/attendance/index.js | 7 +- pc4mobx/hrmSalary/stores/attendanceStore.js | 1 + 10 files changed, 482 insertions(+), 124 deletions(-) create mode 100644 pc4mobx/hrmSalary/pages/dataAcquisition/attendance/components/attendanceDataViewSlide.js create mode 100644 pc4mobx/hrmSalary/pages/dataAcquisition/attendance/components/attendanceRefrenceDataModal.js diff --git a/pc4mobx/hrmSalary/apis/attendance.js b/pc4mobx/hrmSalary/apis/attendance.js index f528ce12..d4a2b304 100644 --- a/pc4mobx/hrmSalary/apis/attendance.js +++ b/pc4mobx/hrmSalary/apis/attendance.js @@ -273,14 +273,14 @@ export const importAttendQuoteData = (params) => { }; // 查看考勤详情 -export const viewAttendQuote = (ids) => { +export const viewAttendQuote = (params) => { return fetch("/api/bs/hrmsalary/attendQuote/view", { method: "POST", mode: "cors", headers: { "Content-Type": "application/json", }, - body: JSON.stringify(ids), + body: JSON.stringify(params), }).then((res) => res.json()); }; diff --git a/pc4mobx/hrmSalary/components/selectItemsModal/index.js b/pc4mobx/hrmSalary/components/selectItemsModal/index.js index 6bb7919d..7b8ca17a 100644 --- a/pc4mobx/hrmSalary/components/selectItemsModal/index.js +++ b/pc4mobx/hrmSalary/components/selectItemsModal/index.js @@ -27,7 +27,7 @@ export default class SelectItemModal extends React.Component { render() { const { searchValue } = this.state; - const { title, onSearchItemSet, onShowOnlyChecked, comp: children, ...extra } = this.props; + const { title, onSearchItemSet, onShowOnlyChecked, children, ...extra } = this.props; const btns = []; const moreBtn = { datas: [ diff --git a/pc4mobx/hrmSalary/components/selectItemsModal/selectItemsWrapper.js b/pc4mobx/hrmSalary/components/selectItemsModal/selectItemsWrapper.js index 7a3ed519..25c7e550 100644 --- a/pc4mobx/hrmSalary/components/selectItemsModal/selectItemsWrapper.js +++ b/pc4mobx/hrmSalary/components/selectItemsModal/selectItemsWrapper.js @@ -8,6 +8,81 @@ import React, { Component } from "react"; import { WeaCheckbox, WeaSearchGroup } from "ecCom"; class SelectItemsWrapper extends Component { + constructor(props) { + super(props); + this.state = { + list: [], + filterList: [] + }; + } + + componentDidMount() { + this.setState({ + list: this.props.dataSource + }); + } + + handleSearchItemSet = (val) => { + const { dataSource } = this.props; + this.setState({ + filterList: _.map(dataSource, item => { + return { + ...item, + items: _.filter(item.items || [], child => child.name.indexOf(val) !== -1) + }; + }) + }); + }; + handleShowOnlyChecked = (checked) => { + const { dataSource } = this.props; + const { list } = this.state; + if (!!Number(checked)) { + this.setState({ + list: _.map(list, item => { + return { + ...item, + items: _.filter(item.items || [], child => !!child.checked) + }; + }) + }); + } else { + this.setState({ list: dataSource }); + } + }; + handleSelectGroupAll = (groupId, checked) => { + const { list, filterList } = this.state; + const key = !_.isEmpty(filterList) ? "filterList" : "list"; + this.setState({ + [key]: _.map(!_.isEmpty(filterList) ? filterList : list, item => { + if (groupId === item.groupId) { + return { + ...item, + items: _.map(item.items || [], child => { + return { ...child, checked: !!Number(checked) }; + }) + }; + } + return { ...item }; + }) + }); + }; + handleSelectItem = (id, checked) => { + const { list, filterList } = this.state; + const key = !_.isEmpty(filterList) ? "filterList" : "list"; + this.setState({ + [key]: _.map(!_.isEmpty(filterList) ? filterList : list, item => { + return { + ...item, + items: _.map(item.items || [], child => { + if (id === child.id) { + return { ...child, checked: !!Number(checked) }; + } + return { ...child }; + }) + }; + }) + }); + }; renderTitle = (item) => { const { onSelectGroupAll } = this.props; const { groupName, groupId } = item; @@ -18,11 +93,13 @@ class SelectItemsWrapper extends Component { }; render() { - const { dataSource, onSelectItem } = this.props; + const { list, filterList } = this.state; + const { onSelectItem } = this.props; + console.log("filterList", filterList); return ( { - _.map(dataSource, item => { + _.map(!_.isEmpty(filterList) ? filterList : list, item => { const { items } = item; return
diff --git a/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/columns.js b/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/columns.js index 41094e98..dc082d76 100644 --- a/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/columns.js +++ b/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/columns.js @@ -141,6 +141,7 @@ export const conditions = [ showname: "文本" } ], + rules: "required|string", viewAttr: 3 }, { @@ -167,5 +168,46 @@ export const conditions = [ defaultshow: true } ]; +export const reFrenceConditions = [ + { + items: [ + { + colSpan: 1, + conditionType: "MONTHPICKER", + domkey: ["salaryYearMonth"], + fieldcol: 18, + rules: "required|string", + label: "薪资所属月", + labelcol: 6, + value: "", + viewAttr: 3 + }, + { + colSpan: 1, + conditionType: "SELECT", + domkey: ["salarySobId"], + fieldcol: 18, + isQuickSearch: false, + label: "薪资账套", + labelcol: 6, + valueList:[], + options: [], + rules: "required|string", + viewAttr: 3 + }, + { + colSpan: 1, + conditionType: "INPUT", + domkey: ["description"], + fieldcol: 18, + label: "备注", + labelcol: 6, + value: "", + viewAttr: 2 + } + ], + defaultshow: true + } +]; diff --git a/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/components/attendanceDataComp.js b/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/components/attendanceDataComp.js index 0a7b6c4d..8e2dbd78 100644 --- a/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/components/attendanceDataComp.js +++ b/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/components/attendanceDataComp.js @@ -22,6 +22,8 @@ import ImportFormOptions from "./importFormOptions"; import SelectItemModal from "../../../../components/selectItemsModal"; import moment from "moment"; import SelectItemsWrapper from "../../../../components/selectItemsModal/selectItemsWrapper"; +import AttendanceRefrenceDataModal from "./attendanceRefrenceDataModal"; +import AttendanceDataViewSlide from "./attendanceDataViewSlide"; class AttendanceDataComp extends Component { constructor(props) { @@ -33,7 +35,6 @@ class AttendanceDataComp extends Component { }, dataSource: [], columns: [], - fieldSetList: [], pageInfo: { current: 1, pageSize: 10, @@ -47,7 +48,9 @@ class AttendanceDataComp extends Component { salaryYearMonth: moment().format("YYYY-MM"), salarySobList: [], salarySobId: "", salaryCycle: "", attendCycle: "" }, - fieldSetPayload: { visible: false, title: "", data: [] } + fieldSetPayload: { visible: false, title: "", children: null }, + attendanceReferencePayload: { visible: false, title: "" }, + attendanceViewPayload: { visible: false, attendQuoteId: "", salaryYearMonth: "" } }; } @@ -136,6 +139,16 @@ class AttendanceDataComp extends Component { } }); }; + handleViewAttendanceData = ({ id, salaryCycle }) => { + const { attendanceViewPayload } = this.state; + this.setState({ + attendanceViewPayload: { + ...attendanceViewPayload, + visible: true, attendQuoteId: id, + salaryYearMonth: salaryCycle + } + }); + }; handleImportAttendanceData = (importData) => { const { importFormPayload } = this.state; const { salaryYearMonth, salarySobId } = importFormPayload; @@ -208,10 +221,15 @@ class AttendanceDataComp extends Component { this.setState({ loading: { ...loading, headset: false } }); if (status) { this.setState({ - fieldSetList: data, fieldSetPayload: { ...fieldSetPayload, - visible: true, title: "导入字段设置", data + visible: true, title: "导入字段设置", + children: this.setItemRef = dom} + dataSource={data} + onSelectGroupAll={this.handleSelectGroupAll} + onSelectItem={this.handleSelectItem} + /> } }); } @@ -222,121 +240,35 @@ class AttendanceDataComp extends Component { this.setState({ fieldSetPayload: { ...fieldSetPayload, - visible: false, title: "", data: [] + visible: false, title: "", children: null } }); }; - handleSearchItemSet = (val) => { - const { fieldSetPayload, fieldSetList } = this.state; - this.setState({ - fieldSetList: _.map(_.cloneDeep(fieldSetList), item => { - return { - ...item, - items: _.filter(item.items || [], child => { - return child.name.indexOf(val) !== -1; - }) - }; - }), - fieldSetPayload: { - ...fieldSetPayload, - data: _.map(_.cloneDeep(fieldSetList), item => { - return { - ...item, - items: _.filter(item.items || [], child => { - return child.name.indexOf(val) !== -1; - }) - }; - }) - } - }); + handleSearchItemSet = (val) => this.setItemRef.handleSearchItemSet(val); + handleShowOnlyChecked = (checked) => this.setItemRef.handleShowOnlyChecked(checked); + handleSelectGroupAll = (groupId, checked) => this.setItemRef.handleSelectGroupAll(groupId, checked); + handleSelectItem = (id, checked) => this.setItemRef.handleSelectItem(id, checked); + /* + * Author: 黎永顺 + * Description: 考勤数据引用 + * Params: + * Date: 2023/3/7 + */ + handleQuoteAttendanceData = (payload) => { + const { attendanceReferencePayload } = this.state; + this.setState({ attendanceReferencePayload: { ...attendanceReferencePayload, ...payload } }); }; - handleShowOnlyChecked = (checked) => { - const { fieldSetPayload, fieldSetList } = this.state; - if (!!Number(checked)) { - this.setState({ - fieldSetPayload: { - ...fieldSetPayload, - data: _.map(_.cloneDeep(fieldSetList), item => { - return { - ...item, - items: _.filter(item.items || [], child => !!child.checked) - }; - }) - } - }); - } else { - this.setState({ - fieldSetPayload: { - ...fieldSetPayload, - data: _.cloneDeep(fieldSetList) - } - }); - } - }; - handleSelectGroupAll = (groupId, checked) => { - const { fieldSetPayload, fieldSetList } = this.state; - this.setState({ - fieldSetList: _.map(_.cloneDeep(fieldSetList), item => { - if (groupId === item.groupId) { - return { - ...item, - items: _.map(item.items || [], child => { - return { ...child, checked: !!Number(checked) }; - }) - }; - } - return { ...item }; - }), - fieldSetPayload: { - ...fieldSetPayload, - data: _.map(_.cloneDeep(fieldSetList), item => { - if (groupId === item.groupId) { - return { - ...item, - items: _.map(item.items || [], child => { - return { ...child, checked: !!Number(checked) }; - }) - }; - } - return { ...item }; - }) - } - }); - }; - handleSelectItem = (id, checked) => { - const { fieldSetPayload, fieldSetList } = this.state; - this.setState({ - fieldSetList: _.map(_.cloneDeep(fieldSetList), item => { - return { - ...item, - items: _.map(item.items || [], child => { - if (id === child.id) { - return { ...child, checked: !!Number(checked) }; - } - return { ...child }; - }) - }; - }), - fieldSetPayload: { - ...fieldSetPayload, - data: _.map(_.cloneDeep(fieldSetList), item => { - return { - ...item, - items: _.map(item.items || [], child => { - if (id === child.id) { - return { ...child, checked: !!Number(checked) }; - } - return { ...child }; - }) - }; - }) - } + handleCloseQuoteModal = (isRefresh) => { + const { attendanceReferencePayload } = this.state; + this.setState({ attendanceReferencePayload: { ...attendanceReferencePayload, visible: false } }, () => { + isRefresh && this.getAttendanceList(); }); }; render() { const { - dataSource, columns, pageInfo, loading, importData, importFormPayload, fieldSetPayload + dataSource, columns, pageInfo, loading, importData, importFormPayload, fieldSetPayload, + attendanceReferencePayload, attendanceViewPayload } = this.state; const { showOperateBtn, salaryYearMonth } = this.props; const pagination = { @@ -368,7 +300,7 @@ class AttendanceDataComp extends Component { render: (_, record) => { return (
- 查看 + this.handleViewAttendanceData(record)}>查看 {showOperateBtn && this.handleDeleteAttendanceData(record)}>删除 } @@ -395,17 +327,27 @@ class AttendanceDataComp extends Component { /> {/* 表头设置 */} - } onCancel={this.handleCloseSettings} onSearchItemSet={this.handleSearchItemSet} onShowOnlyChecked={this.handleShowOnlyChecked} /> + {/* 考勤数据引用 */} + + {/* 考勤数据查看 */} + this.setState({ + attendanceViewPayload: { + ...attendanceViewPayload, + visible: false, + attendQuoteId: "" + } + })} + /> ); } diff --git a/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/components/attendanceDataViewSlide.js b/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/components/attendanceDataViewSlide.js new file mode 100644 index 00000000..b692e31e --- /dev/null +++ b/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/components/attendanceDataViewSlide.js @@ -0,0 +1,143 @@ +/* + * Author: 黎永顺 + * name: 考勤引用数据查看 + * Description: + * Date: 2023/3/7 + */ +import React, { Component } from "react"; +import { WeaFormItem, WeaInput, WeaInputSearch, WeaSlideModal } from "ecCom"; +import { Button } from "antd"; +import SlideModalTitle from "../../../../components/slideModalTitle"; +import { viewAttendQuote } from "../../../../apis/attendance"; +import UnifiedTable from "../../../../components/UnifiedTable"; +import "./index.less"; + +class AttendanceDataViewSlide extends Component { + constructor(props) { + super(props); + this.state = { + loading: { + query: false + }, + keyword: "", + dataSource: [], + columns: [], + pageInfo: { + current: 1, pageSize: 10, total: 0 + } + }; + } + + componentWillReceiveProps(nextProps, nextContext) { + if (nextProps.visible !== this.props.visible && nextProps.visible) this.viewAttendQuote({}, nextProps); + } + + viewAttendQuote = (extraPayload = {}, props) => { + const { loading, pageInfo, keyword } = this.state; + const { attendQuoteId } = props; + this.setState({ loading: { ...loading, query: true } }); + viewAttendQuote({ ...pageInfo, attendQuoteId, keyword, ...extraPayload }).then(({ status, data }) => { + this.setState({ loading: { ...loading, query: false } }); + if (status) { + const { columns, list: dataSource, pageNum: current, pageSize, total } = data.pageInfo; + this.setState({ + pageInfo: { ...pageInfo, current, pageSize, total }, + dataSource, + columns + }); + } + }).catch(() => this.setState({ loading: { ...loading, query: false } })); + }; + renderCustomOperate = () => { + const { keyword } = this.state; + const { showOperateBtn } = this.props; + return ([ +
+ {showOperateBtn && } + this.setState({ keyword })} + onSearch={() => this.viewAttendQuote({ current: 1 }, this.props)} + /> +
+ ]); + }; + handleExportAttendQuote = () => { + if (!this.handleDebounce) { + this.handleDebounce = _.debounce(() => { + const { attendQuoteId } = this.props; + const url = `${window.location.origin}/api/bs/hrmsalary/attendQuote/export?attendQuoteId=${attendQuoteId}`; + window.open(url, "_self"); + this.handleDebounce = null; + }, 500); + } + this.handleDebounce(); + }; + + render() { + const { showOperateBtn, salaryYearMonth, ...extra } = this.props; + const { columns, dataSource, loading, pageInfo } = this.state; + 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.viewAttendQuote({}, this.props)); + }, + onChange: (current) => { + this.setState({ + pageInfo: { ...pageInfo, current } + }, () => this.viewAttendQuote({}, this.props)); + } + }; + return ( + + } + content={ +
+ + + + ({ + ...item, + render: (text) => { + return {text} ; + } + }))} + dataSource={dataSource} + pagination={pagination} + loading={loading.query} + xWidth={columns.length * 120} + /> +
+ } + /> + ); + } +} + +export default AttendanceDataViewSlide; diff --git a/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/components/attendanceRefrenceDataModal.js b/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/components/attendanceRefrenceDataModal.js new file mode 100644 index 00000000..3b96d14b --- /dev/null +++ b/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/components/attendanceRefrenceDataModal.js @@ -0,0 +1,114 @@ +/* + * Author: 黎永顺 + * name: 考勤数据引用 + * Description: + * Date: 2023/3/1 + */ +import React, { Component } from "react"; +import { inject, observer } from "mobx-react"; +import { WeaDialog } from "ecCom"; +import { Button, message } from "antd"; +import { reFrenceConditions } from "../columns"; +import { getSearchs } from "../../../../util"; +import { checkOperation, getLedgerList, syncAttendanceRefer } from "../../../../apis/attendance"; +import "./index.less"; + +@inject("attendanceStore") +@observer +class AttendanceRefrenceDataModal extends Component { + constructor(props) { + super(props); + this.state = { + loading: false, + condition: [] + }; + } + + componentDidMount() { + this.getLedgerList(); + } + + componentWillReceiveProps(nextProps, nextContext) { + if (nextProps.visible !== this.props.visible && nextProps.visible) this.handleResetForm(); + } + + getLedgerList = () => { + const { attendanceStore: { refenceform } } = this.props; + getLedgerList().then(({ status, data }) => { + if (status) { + this.setState({ + condition: _.map(reFrenceConditions, (item) => { + const { items } = item; + return { + ...item, + items: _.map(items, child => { + const { domkey } = child; + if (domkey[0] === "salarySobId") { + return { ...child, options: _.map(data, it => ({ key: it.id, showname: it.content })) }; + } + return { ...child }; + }) + }; + }) + }, () => refenceform.initFormFields(this.state.condition)); + } + }); + }; + /* + * Author: 黎永顺 + * Description: 同步考勤数据 + * Params: + * Date: 2023/3/1 + */ + handleSubmitFields = () => { + const { attendanceStore: { refenceform }, onCancel } = this.props; + refenceform.validateForm().then(f => { + if (f.isValid) { + const payload = refenceform.getFormParams(); + const checkPayload = { salaryYearMonthStr: payload.salaryYearMonth, salarySobId: payload.salarySobId }; + this.setState({ loading: true }); + checkOperation(checkPayload).then(({ status, errormsg: errormessage }) => { + if (status) { + syncAttendanceRefer(payload).then(({ status, errormsg }) => { + this.setState({ loading: false }); + if (status) { + message.success("同步成功"); + onCancel(true); + } else { + message.error(errormsg || "同步失败"); + } + }).catch(() => this.setState({ loading: false })); + } else { + this.setState({ loading: false }); + message.error(errormessage); + } + }).catch(() => this.setState({ loading: false })); + } else { + f.showErrors(); + } + }); + }; + handleResetForm = () => { + const { attendanceStore: { refenceform } } = this.props; + refenceform.resetForm(); + }; + + render() { + const { condition, loading } = this.state; + const { attendanceStore: { refenceform } } = this.props; + const buttons = [ + + ]; + return ( + + {getSearchs(refenceform, condition, 1)} + + ); + } +} + +export default AttendanceRefrenceDataModal; diff --git a/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/components/index.less b/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/components/index.less index d5773f1b..6e340057 100644 --- a/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/components/index.less +++ b/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/components/index.less @@ -3,6 +3,10 @@ width: 100%; } + .wea-date-picker { + width: 100%; + } + .wea-select { display: inline-block; position: relative; @@ -17,3 +21,33 @@ .attendanceFormWrapper { padding: 0; } + +.attendanceSlideWrapper { + .wea-slide-modal-title { + height: initial; + line-height: initial; + text-align: left; + } + + .rodal-close { + z-index: 99; + top: 10px !important; + } + +} + +@media (min-width: 1260px) { + .attendanceSlideWrapper { + .reqTopWrapper .wea-new-top-req-title > div:first-child > div { + max-width: 100% !important; + } + } +} + +@media screen and (min-width: 1060px) and (max-width: 1260px) { + .attendanceSlideWrapper { + .reqTopWrapper .wea-new-top-req-title > div:first-child > div { + max-width: calc(100% - 96px) !important; + } + } +} diff --git a/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/index.js b/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/index.js index 60d168b9..4e5d734f 100644 --- a/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/index.js +++ b/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/index.js @@ -62,6 +62,11 @@ class Index extends Component { columns: [], slideDataSource: [], importResult: [] }); } + handleQuoteAttendanceData= ()=>{ + this.attendanceTableRef.handleQuoteAttendanceData({ + visible: true, title: "引用考勤数据" + }); + } render() { const { selectedKey, salaryMonth, fieldName } = this.state; @@ -71,7 +76,7 @@ class Index extends Component { { title: "字段管理", viewcondition: "FIELD" } ]; const buttons = selectedKey === "DATA" ? [ - , + , ] : []; return ( diff --git a/pc4mobx/hrmSalary/stores/attendanceStore.js b/pc4mobx/hrmSalary/stores/attendanceStore.js index 8bc06c0e..3f3d2912 100644 --- a/pc4mobx/hrmSalary/stores/attendanceStore.js +++ b/pc4mobx/hrmSalary/stores/attendanceStore.js @@ -4,4 +4,5 @@ import { WeaForm } from "comsMobx"; export class AttendanceStore { @observable form = new WeaForm(); + @observable refenceform = new WeaForm(); }