import { observable, action } from 'mobx'; import * as mobx from 'mobx' import * as Api from '../apis/report'; import { WeaForm } from 'comsMobx'; import { WeaTableNew } from 'comsMobx' import { WeaTools } from 'ecCom'; import { message, } from 'antd'; import { i18n } from '../public/i18n'; import {addContentPath} from '../util/index.js' const toJS = mobx.toJS; const { TableStore } = WeaTableNew; export class HrmChangeReport { @observable params = {}; @observable condition = []; @observable conditionOfAdSearch = []; @observable singleSearchCondition = ''; @observable countDatas = []; @observable option1 = {}; @observable option2 = {}; @observable option3 = {}; //For pie chart @observable pathname = ''; @observable deadline = ''; @observable linkName = '更多'; @observable title = ''; chartTitle1 = i18n.label.ranking; chartTitle2 = i18n.label.ranking; chartTitle3 = i18n.label.newTypeOfContract; //For pie chart @observable dialogTitle = i18n.label.specificInformation; @observable isLeftEchartsShow = false; @observable isRightEchartsShow = false; @observable isPieChartsShow = false; @observable visible1 = false; @observable visible2 = false; @observable tableStore = new TableStore(); @observable searchCondition = ''; @observable ids = []; @observable idsForPie = []; @observable yAxisData = []; @observable nameSet = []; @observable linkList = ''; @observable form = new WeaForm(); @observable dpId = ''; @observable strokeColor = '#6FBCEA'; @observable dataKey = ''; @observable yearmonth = ''; @observable contractTypeId = ''; @observable isNeedWeaTab = false; @observable isNeedPieChart = false; @observable tabKey = '0'; @observable tabDatas = []; @observable winWidth = ''; @observable gridData = {}; @observable isApiOneFinished = false; @observable isApiTwoFinished = false; @observable isColIdUnusual = false; @observable loading = true; @observable authorized = false; @action getRight = () => { this.loading = true; Api.getRight().then(rs => { const { hasRight } = rs; if (hasRight) { this.authorized = true; } this.loading = false; }).catch(error => { message.error(error); }); } @action getSearchCondition(idf) { let params; if (idf == 'radioGroup') params = { cmd: this.getCmdForLoadWeaRadioGroup() }; if (idf == 'adSearch') params = { cmd: this.getCmdForLoadAdSearch() }; if (this.dpId && this.pathname !== 'transfer') params.departmentid = this.dpId; if (this.dpId && this.pathname == 'transfer' && this.tabKey == '0') params.departmentIdIn = this.dpId; if (this.dpId && this.pathname == 'transfer' && this.tabKey == '1') params.departmentIdOut = this.dpId; Api.getSfChangeSearchCondition(params, this.getIdfForSelectInterface()).then((data) => { if (!data) { message.warning(i18n.message.dataNone()); return false; } this.setApiOneFinishedStatus(true); //WeaRadioGroup's conditions if (idf == 'radioGroup' && data.searchCondition) { this.condition = data.searchCondition; } //Advanced search's conditions if (idf == 'adSearch' && data.searchCondition) { this.conditionOfAdSearch = data.searchCondition; this.form.initFormFields(data.searchCondition); const {id, name} = this.deptDatas; if (this.dpId && this.pathname !== 'transfer') { this.form.updateFields({ departmentid: { value: id, valueSpan:name, valueObj:[this.deptDatas] } }); } if (this.dpId && this.pathname == 'transfer' && this.tabKey == '0') this.form.updateFields({ departmentIdIn: { value: id, valueSpan:name, valueObj:[this.deptDatas] } }); if (this.dpId && this.pathname == 'transfer' && this.tabKey == '1') this.form.updateFields({ departmentIdOut: { value: id, valueSpan:name, valueObj:[this.deptDatas] } }); } }); } getEchartsRelatedData() { let cmd = this.getCmdForLoadPageContent(); let p = { cmd: cmd, ...this.params }; Api.getSfChangeSearchResult(p, this.getIdfForSelectInterface()).then((data) => { if (!data) { message.warning(i18n.message.dataNone()); return false; } const { status } = data; if (status == "-1") { this.authorized = false; } this.setApiTwoFinishedStatus(true); if (data.countDatas) { this.setCountDatas(data.countDatas); } if (data.linkList) { this.linkList = data.linkList; } //Filter yAxis data of left chart if (data.optionX && data.optionX.yAxis && data.optionX.yAxis.data) { let datas = data.optionX.yAxis.data; data.optionX.yAxis.triggerEvent = true; this.setIds(this.getIds(datas), 'bar'); this.setyAxisData(this.getNewYAxisData(datas), 'bar'); data.optionX.yAxis.data = this.yAxisData; } //Determine the left chart is show or not if (data.optionX && data.optionX.series && data.optionX.xAxis && data.optionX.yAxis && data.optionX.series[0].data && data.optionX.series[0].data.length > 0) { data.optionX.grid = this.getGrid(); data.optionX.xAxis.splitLine = { show: false }; data.optionX.yAxis.axisPointer = this.getAxisPointer(); data.optionX.yAxis.axisLabel = this.getAxisLabel(); data.optionX.tooltip = {}; this.setGridData(this.getGrid()); this.setLeftEchartsShowStatus(true); this.setOption(data.optionX, '1'); } else { this.setLeftEchartsShowStatus(false); } //Determine the right chart is show or not if (data.optionY && data.optionY.series && data.optionY.xAxis && data.optionY.yAxis && data.optionY.series[0].data && data.optionY.series[0].data.length > 0) { data.optionY.series[0].label = {}; data.optionY.grid = this.getGrid(); data.optionY.xAxis.axisPointer = this.getAxisPointer(); data.optionY.yAxis.splitLine = { show: false }; data.optionY.tooltip = {}; this.setRightEchartsShowStatus(true); this.setOption(data.optionY, '2'); } else { this.setRightEchartsShowStatus(false); } //Determine the pie chart is show or not if (data.optionZ && data.optionZ.series && data.optionZ.series[0].data && data.optionZ.series[0].type == 'pie') { let datas = data.optionZ.series[0].data; let arr = []; for (let i = 0; i < datas.length; i++) { arr.push(datas[i].name); } this.setIds(this.getIds(arr), 'pie'); this.setyAxisData(this.getNewYAxisData(arr), 'pie'); for (let i = 0; i < datas.length; i++) { data.optionZ.series[0].data[i].label = this.getLabel(); data.optionZ.series[0].data[i].name = this.nameSet[i]; data.optionZ.legend.data[i] = this.nameSet[i]; } } if (data.optionZ && data.optionZ.series && data.optionZ.series[0].data && data.optionZ.series[0].data.length > 0) { this.setPieChartShowStatus(true); this.setOption(data.optionZ, '3'); } else { this.setPieChartShowStatus(false); } //The following is related to title and something else if (data.title && data.title.foottitle) { this.setDeadLine(data.title.foottitle); } if (data.title && data.title.btn) { this.setLinkName(data.title.btn); } if (data.title && data.title.leftTitle) { this.setChartTitle(data.title.leftTitle, '1'); } if (data.title && data.title.rightTitle) { this.setChartTitle(data.title.rightTitle, '2'); } if (data.title && data.title.footLeftTitle) { this.setChartTitle(data.title.footLeftTitle, '3'); } }) } getTableInfo(idy, needTbStore) { let p; let cmd = this.getCmdForLoadTable(idy); let adSearchParams = this.form.getFormParams(); //Params of advanced search //Just click bar chart(left) if (this.dpId && this.isEmptyObject(adSearchParams) && this.pathname !== 'transfer') { p = { cmd: cmd, ...this.params, departmentid: this.dpId }; } if (this.dpId && this.isEmptyObject(adSearchParams) && this.pathname == 'transfer' && this.tabKey == '0') { p = { cmd: cmd, ...this.params, departmentIdIn: this.dpId }; } if (this.dpId && this.isEmptyObject(adSearchParams) && this.pathname == 'transfer' && this.tabKey == '1') { p = { cmd: cmd, ...this.params, departmentIdOut: this.dpId }; } //Just click bar chart(right) if (this.yearmonth && this.isEmptyObject(adSearchParams)) { p = { cmd: cmd, ...this.params, yearmonth: this.yearmonth }; } //Click pie chart if (this.contractTypeId && this.isEmptyObject(adSearchParams)) { p = { cmd: cmd, ...this.params, contracttypeid: this.contractTypeId }; } //Click bar chart, then set search params(left & right & pie) if (!this.isEmptyObject(adSearchParams)) { p = { cmd: cmd, ...this.params, ...adSearchParams } } //Just click more or num(more and num is a link) if (!this.dpId && !this.yearmonth && !this.contractTypeId && this.isEmptyObject(adSearchParams) && !this.singleSearchCondition) { p = { cmd: cmd, ...this.params }; } //Click more, then set search params if (this.singleSearchCondition) { p = { cmd: cmd, ...this.params, keyword: this.singleSearchCondition }; } //Set progress's color this.setStrokeColor(this.getColor()); Api.getSfChangeSearchResult(p, this.getIdfForSelectInterface()).then((data) => { if (!data) { message.warning(i18n.message.dataNone()); return false; } if (data.sessionkey) { this.setSessionKey(data.sessionkey); if (needTbStore) { this.tableStore = new TableStore(); this.tableStore.getDatas(data.sessionkey, 1); } else { this.exportExcel(); } } }) } exportExcel() { if (!this.dataKey) { return false; } Api.exportExcel(this.dataKey).then(data => { if (data.url) { window.location.href = addContentPath(data.url); } }) } exportAll = () => { Api.getSfChangeSearchResult({ cmd: this.getCmdForLoadTable('bar'), ...this.params, departmentid: '' },(this.pathname === 'contract')? 'contract': 'staff').then(datas => { const { sessionkey } = datas; Api.exportExcel(sessionkey).then(data => { if (data.url) { window.location.href = addContentPath(data.url) ; } }) }) } //Click WeaRadioGroup to get data setParamsThenGetData(params) { if (this.verify(params)) { this.params = params; this.getEchartsRelatedData(); } } verify(params) { if (params.dateselect && params.dateselect == '6' && !params.year) { return false; } if (params.startDateSelect && params.startDateSelect == '6' && !params.startYear) { return false; } if (params.endDateSelect && params.endDateSelect == '6' && !params.endYear) { return false; } if (params.company && params.company == '1' && !this.isSubCompanyIdExistent(params)) { return false; } if (params.company && params.company == '2' && !this.isDepartmentIdExistent(params)) { return false; } if (params.area1 && params.area1 == '1' && (!params.joblevel || !params.joblevelto)) { return false; } if (params.area2 && params.area2 == '1' && (!params.currjoblevel || !params.currjoblevelto)) { return false; } return true; } isSubCompanyIdExistent(params) { if ((this.pathname !== 'transfer' && !params.subcompanyid) || (this.pathname == 'transfer' && ((this.tabKey == '0' && !params.subcompanyIdIn) || (this.tabKey == '1' && !params.subcompanyIdOut)))) { return false; } return true; } isDepartmentIdExistent(params) { if ((this.pathname !== 'transfer' && !params.departmentid) || (this.pathname == 'transfer' && ((this.tabKey == '0' && !params.departmentIdIn) || (this.tabKey == '1' && !params.departmentIdOut)))) { return false; } return true; } //Open or close dialog setVisible(arg, bool, params) { const param = params && params.id; this.deptDatas = params; //Click more if (arg == '1') this.visible1 = bool; if (arg == '1' && bool) { //Open this.getTableInfo('more', true); // this.setDialogtitle(this.chartTitle1.split('(')[0]); this.setDialogtitle(typeof(this.chartTitle1) == 'function' ? `${this.chartTitle1()}(top 5)` : this.chartTitle1); } if (arg == '1' && !bool) this.setSingleShConditionReset(); //Close //Click bar chart if (arg == '2' || arg == '3' || arg == '4' || arg == '5') this.visible2 = bool; if (arg == '2' && bool) this.setDpId(param); if (arg == '3' && bool) this.setYearAndMonth(param); if (arg == '4' && bool) this.setContractTypeId(param); if ((arg == '2' || arg == '3' || arg == '4' || arg == '5') && bool) { //Open this.getTableInfo('bar', true); this.getSearchCondition('adSearch'); this.setDialogtitle(i18n.label.specificInformation()); } if ((arg == '2' || arg == '3' || arg == '4' || arg == '5') && !bool) { //Close this.form = new WeaForm(); if (this.dpId) this.dpIdReset(); if (this.yearmonth) this.yearmonthReset(); if (this.contractTypeId) this.contractTypeIdReset(); } if (!bool) this.tableStore = new TableStore(); } tabClick(key) { this.tabKey = key; this.apiFinishedStatusReset(); this.getSearchCondition('radioGroup'); this.getEchartsRelatedData(); } getSwitchCondition() { let p; if (this.pathname == 'transfer' || this.pathname == 'loss' || this.pathname == 'contract') { p = this.pathname + '_' + this.tabKey; } else { p = this.pathname; } return p; } //Get id from yAxis data getIds(datas) { let arr = []; if (!(datas instanceof Array)) { return false; } for (let i = 0; i < datas.length; i++) { let id = datas[i].substring(datas[i].indexOf('{') + 1, datas[i].indexOf('}')).split(':')[1]; arr.push(id); } return arr; } //Get new yAxis data without id, the new yAxis data will show on the page. getNewYAxisData(datas) { let arr = []; if (!(datas instanceof Array)) { return false; } for (let i = 0; i < datas.length; i++) { let data = datas[i].split('{')[0].replace(/\s+/g, ""); arr.push(data); } return arr; } isEmptyObject(obj) { for (let key in obj) { return false; } return true; } //Set pathname, and estimate if the current page need WeaTab or PieChart. //Last, set tab name when the current page has WeaTab. setPathName(pathname) { this.pathname = pathname; if (pathname == 'transfer' || pathname == 'loss' || pathname == 'contract') { this.setCurPageIfNeedWeaTab(true); } else { this.setCurPageIfNeedWeaTab(false); } if (pathname == 'contract') { this.setCurPageIfNeedPieChart(true); } else { this.setCurPageIfNeedPieChart(false); } if (pathname == 'transfer') { const tabDatas = [{ key: '0', title: i18n.label.intoStatistics() }, { key: '1', title: i18n.label.outOfStatistics() }, ] this.setTabDatas(tabDatas); } if (pathname == 'loss') { const tabDatas = [{ key: '0', title: i18n.label.lossStatistics() }, { key: '1', title: i18n.label.turnoverStatistics() }, { key: '2', title: i18n.label.dismissalStatistics() }, { key: '3', title: i18n.label.retirementStatistics() }, ] this.setTabDatas(tabDatas); } if (pathname == 'contract') { const tabDatas = [{ key: '0', title: i18n.label.newSignStatistics() }, { key: '1', title: i18n.label.expiryStatistics() }, ] this.setTabDatas(tabDatas); } } getIdfForSelectInterface() { if (this.pathname !== 'contract') { return 'staff'; } return 'contract'; } getLabel() { return ({ normal: { formatter: [ '{title|{b}}{abg|}', ' {rate|{d}%}', ].join('\n'), rich: { title: { color: '#666', align: 'center', }, abg: { width: '100%', align: 'right', height: 25, }, rate: { fontFamily: 'Times New Roman', } } } }) } getAxisPointer() { return ({ formatter: function(params) { return params.value; } }) } getAxisLabel() { var that = this; return ({ formatter: function(value) { let len = that.getByteLen(value); if (len > 12) { return that.getCutStr(value, 12) + '...'; } else { return value; } } }) } getCutStr(value, len) { let arr = value.split(''); let cutArr = []; let count = 0; for (let i = 0; i < arr.length; i++) { if (this.checkIsChinese(arr[i]) && count < len) { cutArr.push(arr[i]); count += 2; } if (!this.checkIsChinese(arr[i]) && count < len) { cutArr.push(arr[i]); count += 1; } } return cutArr.join(''); } checkIsChinese(val) {   let reg = new RegExp("[\\u4E00-\\u9FFF]+", "g");   if (reg.test(val)) return true } getGrid() { return ({ bottom: '3%', left: '3%', right: '4%', containLabel: true, }) } getByteLen(val) { var len = 0; for (var i = 0; i < val.length; i++) { var a = val.charAt(i); if (a.match(/[^\x00-\xff]/ig) != null) { len += 2; } else { len += 1; } } return len; } getCurWindowWidth() { let that = this; if (window.innerWidth) { this.setWinWidth(window.innerWidth); } else if ((document.body) && (document.body.clientWidth)) { this.setWinWidth(document.body.clientWidth); } window.onresize = function() { if (window.innerWidth) { that.setWinWidth(window.innerWidth); } else if ((document.body) && (document.body.clientWidth)) { that.setWinWidth(document.body.clientWidth); } } } pathToTitle() { switch (this.pathname) { case 'add': this.setTitle(i18n.label.newSituation()); break; case 'confirmation': this.setTitle(i18n.label.correction()); break; case 'transfer': this.setTitle(i18n.label.mobility()); break; case 'renew': this.setTitle(i18n.label.renewTheSituation()); break; case 'rehire': this.setTitle(i18n.label.returnOnTheSituation()); break; case 'loss': this.setTitle(i18n.label.lossOfPersonnel()); break; case 'contract': this.setTitle(i18n.label.contractSituation()); break; default: this.setTitle(i18n.module.resourceChange()); } } //Set cmd of querying string parameters getCmdForLoadPageContent() { let p = this.getSwitchCondition(); switch (p) { case 'add': return 'addRp'; case 'confirmation': return 'hireRp'; case 'transfer_0': return 'transferIn'; case 'transfer_1': return 'transferOut'; case 'renew': return 'extendRp'; case 'rehire': return 'rehireRp'; case 'loss_0': return 'lossRp'; case 'loss_1': return 'dismissRp'; case 'loss_2': return 'reFireRp'; case 'loss_3': return 'retireRp'; case 'contract_0': return 'contractNewRp'; case 'contract_1': return 'contractExpRp'; } } getCmdForLoadWeaRadioGroup() { let p = this.getSwitchCondition(); switch (p) { case 'add': return 'addRpBase'; case 'confirmation': return 'hireRpBase'; case 'transfer_0': return 'transferIn'; case 'transfer_1': return 'transferOut'; case 'renew': return 'extendRpBase'; case 'rehire': return 'rehireRpBase'; case 'loss_0': return 'lossRpBase'; case 'loss_1': return 'dismissRpBase'; case 'loss_2': return 'reFireRpBase'; case 'loss_3': return 'retireRpBase'; case 'contract_0': return 'contractNewBase'; case 'contract_1': return 'contractExpBase'; } } getCmdForLoadAdSearch() { switch (this.pathname) { case 'add': return 'addRpAdvance'; case 'confirmation': return 'hireRpAdvance'; case 'transfer': return 'transferRpAdvance'; case 'renew': return 'extendRpAdvance'; case 'rehire': return 'rehireRpAdvance'; case 'loss': return 'lossRpAdvance'; case 'contract': return 'contractRpAdvance'; } } getCmdForLoadTable(idy) { let p = this.getSwitchCondition(); switch (p + '_' + idy) { case 'add_bar': return 'addRpDetail'; case 'add_more': return 'addRpMore'; case 'confirmation_bar': return 'hireRpDetail'; case 'confirmation_more': return 'hireRpMore'; case 'transfer_0_bar': return 'transferRpDetail'; case 'transfer_1_bar': return 'transferRpDetail'; case 'transfer_0_more': return 'transferInRpMore'; case 'transfer_1_more': return 'transferOutRpMore'; case 'renew_bar': return 'extendRpDetail'; case 'renew_more': return 'extendRpMore'; case 'rehire_bar': return 'rehireRpDetail'; case 'rehire_more': return 'rehireRpMore'; case 'loss_0_bar': return 'lossRpDetail'; case 'loss_1_bar': return 'dismissRpDetail'; case 'loss_2_bar': return 'reFireRpDetail'; case 'loss_3_bar': return 'retireRpDetail'; case 'loss_0_more': return 'lossRpMore'; case 'loss_1_more': return 'dismissRpMore'; case 'loss_2_more': return 'reFireRpMore'; case 'loss_3_more': return 'retireRpMore'; case 'contract_0_bar': return 'contractRpDetail'; case 'contract_1_bar': return 'contractRpDetail'; case 'contract_0_more': return 'contractRpMore'; case 'contract_1_more': return 'contractRpMore'; } } getColor() { switch (this.pathname) { case 'contract': return '#FF6702'; default: return '#6FBCEA'; } } setOption(option, arg) { if (arg == '1') this.option1 = option; if (arg == '2') this.option2 = option; if (arg == '3') this.option3 = option; } setChartTitle(chartTitle, arg) { if (arg == '1') this.chartTitle1 = chartTitle; if (arg == '2') this.chartTitle2 = chartTitle; if (arg == '3') this.chartTitle3 = chartTitle; } setIds(ids, idf) { if (idf == 'bar') this.ids = ids; if (idf == 'pie') this.idsForPie = ids; } setyAxisData(data, idf) { if (idf == 'bar') this.yAxisData = data; if (idf == 'pie') this.nameSet = data; } setCurPageIfNeedPieChart(bool) { this.isNeedPieChart = bool; } setCountDatas(countDatas) { this.countDatas = countDatas; } setTitle(title) { this.title = title; } setDeadLine(deadline) { this.deadline = deadline; } setLinkName(linkName) { this.linkName = linkName; } setLeftEchartsShowStatus(bool) { this.isLeftEchartsShow = bool; } setRightEchartsShowStatus(bool) { this.isRightEchartsShow = bool; } setPieChartShowStatus(bool) { this.isPieChartsShow = bool; } setDialogtitle(dialogTitle) { this.dialogTitle = dialogTitle; } setDpId(dpId) { this.dpId = dpId; } setStrokeColor(color) { this.strokeColor = color; } setSingleSearchCondition(val) { this.singleSearchCondition = val; } setSingleShConditionReset() { this.singleSearchCondition = ''; } getDialogTitle() { return this.dialogTitle; } setSessionKey(sessionkey) { this.dataKey = sessionkey; } setYearAndMonth(yearmonth) { this.yearmonth = yearmonth; } setContractTypeId(contractTypeId) { this.contractTypeId = contractTypeId; } setCurPageIfNeedWeaTab(bool) { this.isNeedWeaTab = bool; } setTabDatas(tabDatas) { this.tabDatas = tabDatas; } setWinWidth(winWidth) { this.winWidth = winWidth; } setApiOneFinishedStatus(bool) { this.isApiOneFinished = bool; } setApiTwoFinishedStatus(bool) { this.isApiTwoFinished = bool; } setGridData(gridData) { this.gridData = gridData; } setColIdUnusualStatus() { if (this.pathname == 'transfer') { this.isColIdUnusual = true; } else { this.isColIdUnusual = false; } } dpIdReset() { this.dpId = ''; } yearmonthReset() { this.yearmonth = ''; } contractTypeIdReset() { this.contractTypeId = ''; } optionReset() { this.option1 = {}; this.option2 = {}; this.option3 = {}; } conditionReset() { this.condition = []; } paramReset() { this.params = {}; } tabkeyReset() { this.tabKey = '0'; } apiFinishedStatusReset() { this.isApiOneFinished = false; this.isApiTwoFinished = false; } }