考勤导入

2022-04-25 14:32:51 +08:00 · 2022-04-25 14:32:51 +08:00 · 3ab51289d8
parent 3fbfa85d34
commit 3ab51289d8
5 changed files with 206 additions and 20 deletions
--- a/pc4mobx/hrmSalary/apis/attendance.js
+++ b/pc4mobx/hrmSalary/apis/attendance.js
@ -169,4 +169,45 @@ export const saveAttendanceFieldSettingAsDefault = params => {
        }, 
        body: JSON.stringify(params)
    }).then(res => res.json())
-}
+}
+
+
+// 考勤导入模板下载
+export const downloadTemplate = (salaryYearMonth, salarySobId) => {
+    // /api/bs/hrmsalary/attendQuote/downloadTemplate
+    fetch('/api/bs/hrmsalary/attendQuote/downloadTemplate?salaryYearMonth=' + salaryYearMonth + "&salarySobId=" + salarySobId).then(res => res.blob().then(blob => {
+        var filename=`考勤导入模板.xlsx`
+        var a = document.createElement('a');
+        var url = window.URL.createObjectURL(blob); 
+        a.href = url;
+        a.download = filename;
+        a.click();
+        window.URL.revokeObjectURL(url);
+    }))
+}
+
+// 考勤导入预览
+export const previewAttendQuote = (params) => {
+    return fetch('/api/bs/hrmsalary/attendQuote/preview', {
+        method: 'POST',
+        mode: 'cors',
+        headers: {
+            'Content-Type': 'application/json'
+        }, 
+        body: JSON.stringify(params)
+    }).then(res => res.json())
+}
+
+// 考勤数据导入
+export const importAttendQuoteData = (params) => {
+    return fetch('/api/bs/hrmsalary/attendQuote/importAttendQuoteData', {
+        method: 'POST',
+        mode: 'cors',
+        headers: {
+            'Content-Type': 'application/json'
+        }, 
+        body: JSON.stringify(params)
+    }).then(res => res.json())
+}
+
+
--- a/pc4mobx/hrmSalary/components/importModal/modalStep1.js
+++ b/pc4mobx/hrmSalary/components/importModal/modalStep1.js
@ -80,7 +80,14 @@ export default class ModalStep1 extends React.Component {
                        </div>

                        <div style={{ lineHeight: "30px" }}>
-                            <p>1. 第一步，请选择导出的Excel文件或 <a href={this.props.templateLink}>点击这里下载模板</a>；
+                            <p>1. 第一步，请选择导出的Excel文件或 
+                                {
+                                    (typeof this.props.templateLink) == "string" ? 
+                                    <a href={this.props.templateLink}>点击这里下载模板</a>
+                                    :
+                                    <a onClick={() => {this.props.templateLink()}}>点击这里下载模板</a>
+                                }
+                                
                                {this.props.headerSetCompoent && this.props.headerSetCompoent }
                            </p>
                            <p>2. 第二步，请一定要确定Excel文档中的格式是模板中的格式，没有被修改掉；</p>
--- a/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/index.js
+++ b/pc4mobx/hrmSalary/pages/dataAcquisition/attendance/index.js
@ -3,7 +3,7 @@ import { inject, observer } from 'mobx-react';
 import { toJS } from 'mobx';
 import { WeaTableNew } from "comsMobx"

-import { Button, Table, DatePicker, Row, Col, Menu, Dropdown, Switch } from 'antd';
+import { Button, Table, DatePicker, Row, Col, Menu, Dropdown, Switch, Select, message } from 'antd';

 import { WeaInputSearch, WeaSlideModal, WeaHelpfulTip, WeaCheckbox, WeaDatePicker, WeaTop, WeaTab, WeaRightMenu, WeaRangePicker, WeaSelect, WeaTable } from 'ecCom';
 import moment from 'moment'
@ -25,6 +25,7 @@ import TipLabel from '../../../components/TipLabel'
 import ItemMangeFormModal from './itemMangeFormModal'

 const { RangePicker } = DatePicker;
+const { Option } = Select


@inject('attendanceStore')
@ -45,7 +46,10 @@ export default class Attendance extends React.Component {
    this.state = {
      value: "",
      selectedKey: "0",
-      modalParam: {},
+      modalParam: {
+        salarySobId: "",
+        salaryYearMonth: moment(new Date()).format("YYYY-MM"), // 薪资所属月
+      },
      modalVisiable: false,
      selectItemVisible: false,
      refereAttendFormVisible: false,
@ -54,15 +58,21 @@ export default class Attendance extends React.Component {
      itemMangeValue: {},
      fieldName: "",
      fieldSettingSearchValue: "",
-      fieldCurrent: 1
+      fieldCurrent: 1,
+      inited: false
    }
    this.fieldSearch = {}
    this.listSearch = {}
  }

  componentWillMount() {
-    const { attendanceStore: { doInit }} = this.props;
+    const { attendanceStore: { doInit, getLedgerList }} = this.props;
    doInit()
+    getLedgerList().then(() => {
+      this.setState({
+        inited: true
+      })
+    })
  }

  onShowSlide() {
@ -102,11 +112,46 @@ export default class Attendance extends React.Component {
    getAttendanceList(this.listSearch)
  }

+  // 下载导入模板链接点击
+  handleTemplateLinkClick() {
+    const { attendanceStore: { downloadTemplate }} = this.props;
+    const { modalParam: {salarySobId, salaryYearMonth}} = this.state;
+    if(!salaryYearMonth || salaryYearMonth == "") {
+      message.warning("薪资所属月不能为空")
+      return 
+    }
+
+    if(!salarySobId || salarySobId == "") {
+      message.warning("薪资账套不能为空")
+      return
+    }
+    downloadTemplate(salaryYearMonth, salarySobId)
+  }
+
+  // 导入预览
+  handlePreviewImport(params) {
+    const { attendanceStore: {previewAttendQuote}} = this.props;
+    previewAttendQuote(params)
+  }
+
+  // 考勤导入
+  handleImport(params) {
+    const { attendanceStore: { importAttendQuoteData }} = this.props;
+    importAttendQuoteData(params)
+  }
+
+  // 导入完成
+  handleFinish() {
+    this.setState({modalVisiable: false})
+  }
+
  render() {
    const { attendanceStore } = this.props;
+    const { modalParam } = this.state;
    const { loading, hasRight, form, condition, tableStore, showSearchAd, getTableDatas, doSearch, setShowSearchAd } = attendanceStore;
    const { step, setStep, setSlideVisiable, slideVisiable, doBatchDelete, attendTableStore, fieldSettingAttendList, fieldSettingCustomList, setFieldSettingAttendList, setFieldSettingCustomList, searchFieldSettingList } = attendanceStore;
-    const { getAttendanceFieldSettingList, saveAttendanceFieldSetting, fieldDataSource, fieldTableStore, fieldPageInfo, attendanceDataSource, attendanceColumns, attendancePageInfo} = attendanceStore
+    const { getAttendanceFieldSettingList, saveAttendanceFieldSetting, fieldDataSource, fieldTableStore, fieldPageInfo, attendanceDataSource, attendanceColumns, attendancePageInfo, importLedgerList, 
+      previewAttendQuoteColumns, previewAttendQuoteDataSource} = attendanceStore
    const selectedRowKeys = toJS(tableStore.selectedRowKeys) || []; // tableStore 右侧选中数组
    
    if (!hasRight && !loading) { // 无权限处理
@ -159,7 +204,7 @@ export default class Attendance extends React.Component {
    const renderSearchOperationItem = () => {
      return <div>
        <Button type="primary" style={{ marginRight: '10px' }} onClick={() => { this.setState({ refereAttendFormVisible: true }) }}>引用</Button>
-        <Button type="default" onClick={() => { this.setState({ modalVisiable: true, step: 0 }) }}>导入</Button>
+        <Button type="default" onClick={() => { this.setState({ modalVisiable: true}); setStep(0) }}>导入</Button>
      </div>
     
    }
@ -193,22 +238,45 @@ export default class Attendance extends React.Component {
                <span className="formLabel" style={{ lineHeight: "30px", marginRight: "10px" }}>薪资所属月：</span>
                <WeaDatePicker
                    format="yyyy-MM"
+                    value={this.state.modalParam.salaryYearMonth}
+                    onChange={(value) => {
+                      this.setState({modalParam: {...modalParam, salaryYearMonth: value}})
+                    }}
                />
            </Col>
            <Col span={12}>
                <span className="formLabel" style={{ lineHeight: "30px", marginRight: "10px" }}>薪资账套：</span>
-                <WeaSelect
-                    showSearch // 设置select可搜索
-                    style={{ width: 200, display: "inline-block" }}
-                />
+                {
+                  this.state.inited && 
+                  <Select 
+                        defaultValue={this.state.modalParam.salarySobId} value={this.state.modalParam.salarySobId} style={{ width: "200px" }} onChange={(value) => {
+                          this.setState({modalParam: {...modalParam, salarySobId: value}})
+                        }}>
+                        {importLedgerList.map(item => (
+                            <Option value={item.id} key={item.id}>{item.content}</Option>
+                        ))}
+                  </Select>
+                }
            </Col>
            <Col span={12}>
                <span className="formLabel" style={{ lineHeight: "30px", marginRight: "10px" }}>薪资周期：</span>
-                2022-03-01 ~ 2022-03-31
+                {
+                  moment(this.state.modalParam.salaryYearMonth + "-01").startOf("month").format("YYYY-MM-DD")
+                }
+                 ~ 
+                {
+                  moment(this.state.modalParam.salaryYearMonth + "-01").endOf("month").format("YYYY-MM-DD")
+                }
            </Col>
            <Col span={12}>
                <span className="formLabel" style={{ lineHeight: "30px", marginRight: "10px" }}>考勤周期：</span>
-                2022-03-01 ~ 2022-03-31
+                {
+                  moment(this.state.modalParam.salaryYearMonth + "-01").startOf("month").format("YYYY-MM-DD")
+                }
+                 ~ 
+                {
+                  moment(this.state.modalParam.salaryYearMonth + "-01").endOf("month").format("YYYY-MM-DD")
+                }
            </Col>
        </Row>
    
@ -467,16 +535,16 @@ export default class Attendance extends React.Component {

        <ImportModal 
          params={this.state.modalParam}
-          columns={columns}
+          columns={previewAttendQuoteColumns}
          step={step}
          setStep={setStep}
-          slideDataSource={dataSource}
+          slideDataSource={previewAttendQuoteDataSource}
          importResult={{}}
-          onFinish={() => {}}
-          previewImport={(params) => {}}
-          importFile={(params) => {}}
+          onFinish={() => {this.handleFinish()}}
+          previewImport={(params) => {this.handlePreviewImport(params)}}
+          importFile={(params) => {this.handleImport(params)}}
          headerSetCompoent={renderHeaderSetCompoent()}
-          templateLink={"/api/bs/hrmsalary/addUpDeduction/downloadTemplate"}
+          templateLink={() => {this.handleTemplateLinkClick()}}
          renderFormComponent={() => renderFormComponent()} 
          visiable={this.state.modalVisiable} 
          onCancel={() => { this.setState({modalVisiable: false})}} 
--- a/pc4mobx/hrmSalary/pages/salaryFile/index.js
+++ b/pc4mobx/hrmSalary/pages/salaryFile/index.js
@ -163,6 +163,7 @@ export default class SalaryFile extends React.Component {
    const { salaryFileStore } = this.props;
    const { loading, hasRight, form, condition, tableStore, showSearchAd, getTableDatas, doSearch, setShowSearchAd } = salaryFileStore;
    const { importType, previewColumns, previewDataSource, dataSource, currentId, editAgentVisible, setEditAgentVisible, pageInfo } = salaryFileStore;
+    
    const { selectedTab, step, selectedRowKeys } = this.state;
    if (!hasRight && !loading) { // 无权限处理
      return renderNoright();
--- a/pc4mobx/hrmSalary/stores/attendanceStore.js
+++ b/pc4mobx/hrmSalary/stores/attendanceStore.js
@ -35,6 +35,12 @@ export class AttendanceStore {
  @observable attendancePageInfo = {};
  @observable attendanceColumns = [];

+  // 导入
+  @observable importLedgerList = []; // 表单-账套列表
+  @observable previewAttendQuoteList = []; // 导入-预览列表
+  @observable previewAttendQuoteColumns = []; // 导入预览-列表对应列
+  @observable previewAttendQuoteDataSource = []; // 导入预览-列表
+
  @action
  searchFieldSettingList = (value) => {
    if(value != "") {
@ -311,6 +317,69 @@ export class AttendanceStore {
      }
    })
  }
+
+  // 导入表单-账套列表
+  @action
+  getLedgerList = () => {
+    return new Promise((resolve, reject) => {
+      API.getLedgerList({}).then(res => {
+        if(res.status) {
+          this.importLedgerList = res.data
+          resolve(this.importLedgerList)
+        } else {
+          message.error(res.errormsg || "获取失败")
+          reject()
+        }
+      })
+    })
+    
+  } 
+
+  // 下载导入模板
+  @action
+  downloadTemplate = (salaryYearMonth, salarySobId) => {
+    API.downloadTemplate(salaryYearMonth, salarySobId)
+  } 
+
+  // 导入预览
+  @action
+  previewAttendQuote = (params) => {
+    API.previewAttendQuote(params).then(res => {
+      if(res.status) {
+        this.previewAttendQuoteList = res.data
+        this.previewAttendQuoteColumns = res.data.headers.map((item, index) => {
+          let column = {}
+          column.title = item; 
+          column.dataIndex = "" + index;
+          column.key = index + ""
+          return column
+        })
+
+        this.previewAttendQuoteDataSource = res.data.list.map((item) => {
+          let data = {}
+          item.map((i, index) => {
+            data[index + ''] = i
+          })
+          return data
+        })
+
+      } else {
+        message.error(res.errormsg || "获取失败");
+      }
+    })
+  }
+
+  // 考勤导入
+  @action
+  importAttendQuoteData = (params) => {
+    API.importAttendQuoteData(params).then(res => {
+      if(res.status) {
+        
+      } else {
+        message.error(res.errormsg || "导入失败")
+      }
+    })
+  }
  

 }