This commit is contained in:
Chengliang 2022-07-27 14:54:59 +08:00
parent 5977ad0d08
commit 9263c27fd3
5 changed files with 273 additions and 61 deletions

View File

@ -1,6 +1,22 @@
import { WeaTools } from 'ecCom'
//选择导入字段
export const getImportFields = (params) => {
return WeaTools.callApi(`/api/bs/hrmorganization/commonimport/getImportFields`, 'GET', params);
}
//导入文件提交
export const saveImport = (params) => {
return WeaTools.callApi(`/api/bs/hrmorganization/commonimport/saveImport`, 'POST', params);
}
//获取导入表单
export const getImportForm = (params) => {
return WeaTools.callApi(`/api/hrm/import/resource/getImportForm`, 'GET', params);
return WeaTools.callApi(`/api/bs/hrmorganization/commonimport/getImportForm`, 'GET', params);
}
//获取导入结果
export const getImportResult = (params) => {
return WeaTools.callApi(`/api/bs/hrmorganization/commonimport/getImportResult`, 'GET', params);
}

View File

@ -9,6 +9,7 @@ import {
import {
WeaTop,
WeaAlertPage,
WeaBrowser
} from 'ecCom'
import {
Spin,

View File

@ -4,7 +4,9 @@ import {
WeaTransfer,
WeaNewScroll,
WeaSelect,
WeaUpload
WeaUpload,
WeaDialog,
WeaInput
} from 'ecCom'
import {
Spin,
@ -13,6 +15,8 @@ import {
Steps,
Row,
Col,
Progress,
Icon
} from 'antd'
import {
inject,
@ -27,6 +31,8 @@ import {
i18n
} from '../../public/i18n';
import { addContentPath } from '../../util/index.js'
import { toJS } from 'mobx';
const WeaTable = WeaTableNew.WeaTable;
@inject("newImport")
@ -34,7 +40,12 @@ import { addContentPath } from '../../util/index.js'
export default class StepDialog extends React.Component {
constructor(props) {
super(props);
this.state = {
data: [],
selectedKeys: []
}
}
getCircle() {
let style = {
@ -155,6 +166,7 @@ export default class StepDialog extends React.Component {
category='string'
limitType='xls,xlsx'
maxFilesNumber={1}
viewAttr={3}
datas={filelist}
{...field.otherParams}
onChange={
@ -166,9 +178,11 @@ export default class StepDialog extends React.Component {
</WeaUpload>
</div>
<div style={{ float: 'left', paddingLeft: 10 }}>
{filelist.length == 0 ? <p>{i18n.label.noFileSelected()}</p> : filelist.map(file => <p>{file.filename}</p>)}
{filelist.length == 0 ? <p style={{marginLeft:10}}>{i18n.label.noFileSelected()}</p> : filelist.map(file => <p>{file.filename}</p>)}
</div>
</div>)
}else {
dom = <WeaInput ecId={`${this && this.props && this.props.ecId || ''}_WeaInput@rg6f3p`} hasBorder={true} viewAttr={1} value={field.value}/>
}
return dom;
}
@ -186,7 +200,6 @@ export default class StepDialog extends React.Component {
newImport
} = this.props;
const {
getTemplateUrl,
importParams
} = newImport;
let p;
@ -198,20 +211,35 @@ export default class StepDialog extends React.Component {
return p;
}
reRenderColumns(c) {
c.forEach(item => {
if (item.dataIndex == 'operatedetail') {
item.render = function (text, record) {
return <span style={{ color: '#FF0000' }}>{text}</span>
}
}
});
}
render = () => {
const {
newImport
} = this.props, {
data, selectedKeys, current
data, selectedKeys, current, pvisable, percent, failnum, succnum, importResultTip, importResultStore, importStatus, loading, date
} = newImport;
return (
<div>
{
current == 0 && <WeaTransfer
data={data}
selectedKeys={selectedKeys}
onChange={(keys, datas) => newImport.setSelectedKeys(keys)}
data={toJS(data)}
selectedKeys={toJS(selectedKeys)}
onChange={(keys, datas) => {
newImport.setSelectedKeys(keys);
newImport.setSelectData(datas);
}}
/>
}
{
@ -220,10 +248,38 @@ export default class StepDialog extends React.Component {
</WeaNewScroll>
}
{
current == 2 && <div>获取导入结果</div>
}
current == 2 && <div>
{
importStatus == 'over' && <div className="hrm-import-result-icon" style={{ paddingTop: failnum == 0 ? 100 : 15 }}>
<div style={{ width: 30, height: 30, borderRadius: 25, padding: 8, display: 'inline-block', backgroundColor: succnum > 0 ? '#54D3A2' : '#FF0000' }}>
<Icon ecId={`${this && this.props && this.props.ecId || ''}_Icon@2fblod`} type={succnum > 0 ? 'check' : 'cross'} style={{ color: '#fff' }} />
</div><span style={{ paddingLeft: 5 }}>{importResultTip}</span>
</div>
}
{
failnum > 0 &&
<WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@h7l6fo`}
comsWeaTableStore={importResultStore}
bordered
needScroll={true}
scroll={{ y: 330 }}
getColumns={c => this.reRenderColumns(c)}
/>
}
<WeaDialog
title="导入进度"
onCancel={() => newImport.pvisable = false}
visible={pvisable}
style={{ width: 300, height: 50 }}
>
<div style={{ "padding": "15px" }}>
<Progress percent={percent} strokeWidth={7} />
</div>
</WeaDialog>
</div>
}
</div>
)
}
}

View File

@ -49,7 +49,7 @@ export default class StepDialog extends React.Component {
}
newImport.current = current;
current === 1 && newImport.getImportForm();
current === steps.length - 1 && newImport.getImportResult();
current === steps.length - 1 && newImport.startImport();
}
render() {

View File

@ -1,6 +1,7 @@
import {
observable,
action
action,
computed
} from 'mobx';
import {
WeaForm
@ -30,9 +31,12 @@ const {
TableStore
} = WeaTableNew;
const confirm = Modal.confirm;
// import {
// i18n
// } from '../public/i18n';
import {
i18n
} from '../public/i18n';
import {
findIndex
} from 'lodash';
export class newImportStore {
@ -93,26 +97,33 @@ export class newImportStore {
@observable importType = '';
@observable current = 0;
@observable buttonTitle = '';
@observable pvisable = false;
/********************* stepContent *********************/
data = [
{ id: 1, name: '杨文元' },
{ id: 2, name: '李妍' },
{ id: 3, name: '刘长庚' },
{ id: 4, name: '孟玲' },
{ id: 5, name: '张建华' },
];
selectedKeys = [1, 2];
@observable data = [];
@observable selectedKeys = [];
selectData = [];
@observable condition = [];
@observable importParams = {}; //重复验证字段
@observable operateType = 'add'; //导入类型
@observable filelist = []; //文件信息
@observable excelfile = []; //文件id
@observable excelfile = ''; //文件id
@observable templetName = "导入模板";
getTemplateUrl
@observable percent = 0;
@observable failnum = 0; //失败数量
@observable succnum = 0; //成功数量
@observable importResultTip = ''; //导入结果提示
@observable importResultStore = new TableStore();
@observable importStatus = 'importing'; //导入状态
@observable loading = true;
@observable date = '';
@observable keyField = 'workcode';
@observable otherParams; //表单其它参数
@observable pId = '';//导入记录
interval
@action setParam = (k, v) => {
const p = toJS(this.importParams);
@ -123,17 +134,43 @@ export class newImportStore {
}
@action("获取导入字段") getImportField() {
this.loading = true;
const params = {
importType:this.importType
}
API.getImportFields(params).then(res => {
if(res.code == 200) {
this.data = res.data.data;
this.selectedKeys = res.data.selectedKeys;
res.data.data && this.selectedKeys.forEach(id => {
const index = findIndex(res.data.data, { id });
this.selectData.push(res.data.data[index])
})
this.loading = false;
}else {
message.warning(res.msg);
}
},error => {
message.warning(error.msg);
})
}
@action("获取导入表单") getImportForm() {
let columns = [];
this.selectData.forEach(item => {
columns.push(item.name)
})
const params = {
importType: this.importType,
columns:columns
}
API.getImportForm(params).then(data => {
if (data.status == '1') {
this.condition = data.condition;
if (data.condition != null && Array.isArray(data.condition) && data.condition.length > 0) {
API.getImportForm(params).then(res => {
if (res.code == 200) {
this.condition = res.data.condition;
if (res.data.condition != null && Array.isArray(res.data.condition) && res.data.condition.length > 0) {
this.condition[0].items.map(item => {
if (item.conditionType === 'SELECT' && item.domkey[0] === 'importType') {
item.options.map(op => {
@ -142,28 +179,130 @@ export class newImportStore {
})
}
item.domkey[0].indexOf('keyField') > -1 && this.setParam(item.domkey[0], item.value);
})
}
} else {
// message.warning(data.message);
message.warning(res.msg);
}
}, error => {
message.warning(error.message);
message.warning(error.msg);
})
}
@action("获取导入结果") getImportResult() {
@action("开始导入") startImport() {
if(this.filelist.length == 0) {
message.error("请上传需要导入的文件!")
this.current = this.current - 1;
return;
}
this.pvisable = true;
//导入文件提交
let params = {
...this.importParams,
keyField:this.keyField,
importType:this.importType,
operateType:this.operateType,
excelfile:this.excelfile
}
if (this.otherParams != null) {
Object.assign(params, {
otherParams: JSON.stringify(this.otherParams)
})
}
this.doImport(params)
this.interval = setInterval(() => this.getImportProcess(), 200);
}
@action("文件提交") doImport(params) {
API.saveImport(params).then(res => {
if(res.code == 200) {
this.pId = res.data.pId;
}else {
clearInterval(this.interval);
this.pvisable = false;
message.error("文件导入失败")
}
})
}
// @computed get pId() {
// return this.percent = 100;
// }
@action("获取导入进度") getImportProcess() {
if(this.pId != '') {
clearInterval(this.interval);
this.percent = 100;
const _this = this;
setTimeout(function(){
_this.pvisable = false;
_this.getImportResult();
},1000)
}else {
//调用导入进度api
let max = 95;
let min = this.percent;
if(this.percent < max) {
this.percent = Math.floor(Math.random() * (max - min)) + min;
}
}
}
@action("获取导入结果") getImportResult() {
let params = {
pId:this.pId
}
API.getImportResult(params).then((res) => {
if (res.code == 200) {
this.failnum = res.data.failnum;
this.succnum = res.data.succnum;
this.importStatus = res.data.importStatus;
if (this.failnum > 0) {
let info = i18n.label.importResourceResultInfo();
info = info.replace('{rownum}', this.succnum + this.failnum).replace('{succnum}', this.succnum);
this.importResultTip = info;
this.importResultStore.getDatas(res.data.datas, 1);
} else {
let info = i18n.label.importResourceResultInfo1();
info = info.replace('{rownum}', this.succnum);
this.importResultTip = info;
}
} else {
message.warning(res.msg);
}
}, error => {
message.warning(error.msg);
})
}
setSelectedKeys(keys) {
this.selectedKeys = keys;
this.date = new Date();
}
setSelectData(value){
this.selectData = value;
}
@action("初始化弹框内容") init() {
this.filelist = [];
this.excelfile = [];
this.excelfile = '';
this.visible = false;
this.percent = 0;
this.failnum = 0;
this.succnum = 0;
this.importResultTip = '';
this.importResultStore = new TableStore();
this.importStatus = 'importing';
this.data = [];
this.selectData = [];
this.selectedKeys = [];
this.condition = [];
this.keyField = 'workcode';
this.pId = '';
}