21 changed files with 1071 additions and 120 deletions
@ -0,0 +1,27 @@ |
|||
'use strict'; |
|||
|
|||
// 查询业绩汇总表-->关联sale表
|
|||
async function getSalePerformance(ctx, next) { |
|||
const { type } = ctx.params; |
|||
const models = ctx.fs.dc.models; |
|||
let rslt = null; |
|||
try { |
|||
rslt = await models.sale.findAll({ |
|||
order: [['id', 'DESC']], |
|||
include:[{ |
|||
model:models.salePerformance |
|||
}] |
|||
// where: { type: type }
|
|||
}) |
|||
ctx.status = 200 |
|||
ctx.body = rslt |
|||
} catch (error) { |
|||
ctx.fs.logger.error(`path:${ctx.path},error:${error}`) |
|||
ctx.status = 400; |
|||
ctx.body = { name: 'FindAllError', message: '获取失败' } |
|||
} |
|||
} |
|||
|
|||
module.exports = { |
|||
getSalePerformance, |
|||
} |
|||
@ -0,0 +1,50 @@ |
|||
/* eslint-disable*/ |
|||
'use strict'; |
|||
|
|||
module.exports = dc => { |
|||
const DataTypes = dc.ORM; |
|||
const sequelize = dc.orm; |
|||
const sale = sequelize.define("sale", { |
|||
id: { |
|||
type: DataTypes.INTEGER, |
|||
allowNull: false, |
|||
primaryKey: true, |
|||
field: "id", |
|||
autoIncrement: true, |
|||
}, |
|||
department: { |
|||
type: DataTypes.STRING, |
|||
allowNull: true, |
|||
field: "department", |
|||
}, |
|||
business: { |
|||
type: DataTypes.STRING, |
|||
allowNull: true, |
|||
field: "business", |
|||
}, |
|||
sale: { |
|||
type: DataTypes.STRING, |
|||
allowNull: true, |
|||
field: "sale", |
|||
}, |
|||
hiredate: { |
|||
type: DataTypes.DATE, |
|||
allowNull: false, |
|||
field: "hiredate", |
|||
}, |
|||
regularDate: { |
|||
type: DataTypes.DATE, |
|||
allowNull: false, |
|||
field: "regular_date", |
|||
}, |
|||
pepId: { |
|||
type: DataTypes.INTEGER, |
|||
allowNull: true, |
|||
field: "pep_id", |
|||
} |
|||
}, { |
|||
tableName: "sale", |
|||
}); |
|||
dc.models.sale = sale; |
|||
return sale; |
|||
}; |
|||
@ -0,0 +1,63 @@ |
|||
/* eslint-disable*/ |
|||
'use strict'; |
|||
|
|||
module.exports = dc => { |
|||
const DataTypes = dc.ORM; |
|||
const sequelize = dc.orm; |
|||
const salePerformance = sequelize.define("salePerformance", { |
|||
id: { |
|||
type: DataTypes.INTEGER, |
|||
allowNull: false, |
|||
primaryKey: true, |
|||
field: "id", |
|||
autoIncrement: true, |
|||
}, |
|||
amount: { |
|||
type: DataTypes.STRING, |
|||
allowNull: false, |
|||
field: "amount", |
|||
}, |
|||
actualPerformance: { |
|||
type: DataTypes.STRING, |
|||
allowNull: false, |
|||
field: "actual_performance", |
|||
}, |
|||
assessmentPerformance: { |
|||
type: DataTypes.STRING, |
|||
allowNull: false, |
|||
field: "assessment_performance", |
|||
}, |
|||
saleName : { |
|||
type: DataTypes.STRING, |
|||
allowNull: false, |
|||
field: "sale_name", |
|||
}, |
|||
month: { |
|||
type: DataTypes.INTEGER, |
|||
allowNull: false, |
|||
field: "month", |
|||
}, |
|||
year: { |
|||
type: DataTypes.INTEGER, |
|||
allowNull: false, |
|||
field: "year", |
|||
}, |
|||
saleId: { |
|||
type: DataTypes.INTEGER, |
|||
allowNull: false, |
|||
field: "sale_id", |
|||
}, |
|||
task: { |
|||
type: DataTypes.INTEGER, |
|||
allowNull: false, |
|||
field: "task", |
|||
} |
|||
}, { |
|||
tableName: "sale_performance", |
|||
}); |
|||
const { sale } = dc.models; |
|||
sale.hasMany(salePerformance, { foreighKey: 'saleName', targetKey: "sale" }) |
|||
|
|||
dc.models.salePerformance = salePerformance; |
|||
return salePerformance; |
|||
}; |
|||
@ -0,0 +1,8 @@ |
|||
'use strict'; |
|||
|
|||
const report = require('../../controllers/salePerformance'); |
|||
|
|||
module.exports = function (app, router, opts) { |
|||
app.fs.api.logAttr['GET/salePerformance'] = { content: '业绩汇总表', visible: false }; |
|||
router.get('/salePerformance', report.getSalePerformance); |
|||
}; |
|||
@ -0,0 +1,16 @@ |
|||
'use strict'; |
|||
|
|||
import { ApiTable, basicAction } from '$utils' |
|||
|
|||
export function getPerformanceSummary() {//查询
|
|||
return (dispatch) => basicAction({ |
|||
type: "get", |
|||
dispatch: dispatch, |
|||
actionType: "GET_PERFORMANCE_SUMMARY", |
|||
url: `${ApiTable.getPerformanceSummary}`, |
|||
msg: { option: "查询业绩汇总表" }, |
|||
reducer: { name: "performanceSummaryList", params: { noClear: true } }, |
|||
}); |
|||
} |
|||
|
|||
|
|||
@ -0,0 +1,225 @@ |
|||
'use strict'; |
|||
import React, { useState, useEffect } from 'react'; |
|||
import { connect } from 'react-redux'; |
|||
import moment from 'moment'; |
|||
import { Modal, Form, Button, Notification } from '@douyinfe/semi-ui'; |
|||
import { IconUpload } from '@douyinfe/semi-icons'; |
|||
import XLSX from 'xlsx'; |
|||
import { performanceSummaryKeys } from '../../constants/index'; |
|||
//下载模板和上传文件读取 |
|||
const ImportPerformanceSummaryModal = props => { |
|||
const { dispatch, actions, onCancel } = props; |
|||
const { businessManagement } = actions |
|||
const [msg, setMsg] = useState(''); |
|||
const [loading, setLoading] = useState(''); |
|||
const [postData, setPostData] = useState([]); |
|||
//初始化 |
|||
useEffect(() => { |
|||
}, []); |
|||
|
|||
const confirm = () => { |
|||
if (postData.length) { |
|||
setLoading(true) |
|||
dispatch(businessManagement.importAchieveDetails(postData)).then(res => { |
|||
if (res.success) { |
|||
onCancel() |
|||
} |
|||
setLoading(false) |
|||
}) |
|||
} else { |
|||
Notification.warning({ content: '没有数据可以提交，请上传数据文件', duration: 2 }) |
|||
} |
|||
} |
|||
|
|||
const dldCsvMb = () => { |
|||
//表头 |
|||
let head = []; |
|||
Object.keys(performanceSummaryKeys).map(key => { |
|||
head.push(performanceSummaryKeys[key]); |
|||
}) |
|||
head = head.join(',') + "\n"; |
|||
//数据 |
|||
//let data = 1 + ',' + 2 + ',' + 3 + ',' + 4 + ',' + 5 |
|||
let templateCsv = "data:text/csv;charset=utf-8,\ufeff" + head; |
|||
//创建一个a标签 |
|||
let link = document.createElement("a"); |
|||
//为a标签设置属性 |
|||
link.setAttribute("href", templateCsv); |
|||
link.setAttribute("download", "业绩汇总表导入模板.csv"); |
|||
//点击a标签 |
|||
link.click(); |
|||
} |
|||
const download = () => { |
|||
dldCsvMb(); |
|||
} |
|||
|
|||
const fileLimit = '.csv'; |
|||
|
|||
const getFileBlob = (url) => { |
|||
return new Promise((resolve, reject) => { |
|||
let request = new XMLHttpRequest() |
|||
request.open("GET", url, true) |
|||
request.responseType = "blob" |
|||
request.onreadystatechange = e => { |
|||
if (request.readyState == 4) { |
|||
if (request.status == 200) { |
|||
if (window.FileReader) { |
|||
let reader = new FileReader(); |
|||
reader.readAsBinaryString(request.response); |
|||
reader.onload = event => { |
|||
try { |
|||
const { result } = event.target; |
|||
// 以二进制流方式读取得到整份excel表格对象 |
|||
const workbook = XLSX.read(result, { |
|||
type: "binary", |
|||
cellDates: true,//设为true，将天数的时间戳转为时间格式 |
|||
codepage: 936//解决了乱码问题 |
|||
}); |
|||
let data = []; // 存储获取到的数据 |
|||
// 遍历每张工作表进行读取（这里默认只读取第一张表） |
|||
for (const sheet in workbook.Sheets) { |
|||
if (workbook.Sheets.hasOwnProperty(sheet)) { |
|||
data = data.concat(XLSX.utils.sheet_to_json(workbook.Sheets[sheet])); |
|||
} |
|||
} |
|||
resolve(data);//导出数据 |
|||
} catch (e) { |
|||
reject("失败"); |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
request.send(); |
|||
}) |
|||
} |
|||
|
|||
|
|||
// const judgeNull = (value) => { |
|||
// return value ? String(value).trim().replace(/\s*/g, "") : null; |
|||
// } |
|||
|
|||
// const judgeNullTime = (v) => { |
|||
// //注意的点：xlsx将excel中的时间内容解析后，会小一天 |
|||
// //如2020/8/1，xlsx会解析成 Fri Jul 31 2020 23:59:17 GMT+0800 小了43秒 |
|||
// let a = new Date(v); |
|||
// a.setTime(a.getTime() + 43 * 1000); |
|||
// return v ? a : null; |
|||
// } |
|||
|
|||
const judgeTimeValid = (time) => { |
|||
let valid = true; |
|||
if (!time) { |
|||
return valid;//可以不填 |
|||
} |
|||
const ymd = /^((19|20)[0-9]{2})[\/\-]((0[1-9])|(1[0-2]))[\/\-]((0[1-9])|((1|2)[0-9])|(3[0-1]))$/;//年月日 |
|||
if (time instanceof Date) { |
|||
let timeStr = moment(time).format('YYYY/MM/DD'); |
|||
if (!ymd.test(timeStr)) { |
|||
valid = false; |
|||
} |
|||
} else { |
|||
valid = false; |
|||
} |
|||
return valid; |
|||
} |
|||
|
|||
return ( |
|||
<Modal |
|||
title="导入" visible={true} |
|||
onOk={confirm} width={620} |
|||
confirmLoading={loading} |
|||
onCancel={() => { |
|||
setMsg('') |
|||
setLoading(false) |
|||
setPostData([]) |
|||
onCancel() |
|||
}} |
|||
> |
|||
<div style={{ borderBottom: '1px solid #DCDEE0', margin: '0px -24px' }}></div> |
|||
<Form> |
|||
<Form.Upload |
|||
label={'业绩明细表'} labelPosition='left' |
|||
action={'/'} accept={fileLimit} |
|||
maxSize={200} limit={1} |
|||
onRemove={(currentFile, fileList, fileItem) => { |
|||
setMsg(''); |
|||
setPostData([]); |
|||
}} |
|||
customRequest={(data) => { |
|||
const { file, onSuccess, onError } = data |
|||
getFileBlob(file.url).then(res => { |
|||
|
|||
const error = (msg) => { |
|||
setMsg(msg) |
|||
onError({ message: msg }) |
|||
} |
|||
if (res.length > 1000) { |
|||
error('一次性上传数据行数应小于1000行，请分批上传') |
|||
return |
|||
} |
|||
if (!res.length) { |
|||
error('请填写至少一行数据') |
|||
return |
|||
} |
|||
let postData = []; |
|||
let zzsPattern = /^[+]{0,1}(\d+)$/;//正整数 |
|||
for (let i = 0; i < res.length; i++) { |
|||
let d = res[i]; |
|||
let obj = {}; |
|||
Object.keys(performanceSummaryKeys).map(key => { |
|||
obj[key] = d[performanceSummaryKeys[key]] || null; |
|||
//} |
|||
}) |
|||
let tValid = judgeTimeValid(obj.recConDate); |
|||
// if (!tValid) { |
|||
// error(`第${i + 2}行【收到合同日期】错误，请填写yyyy/mm/dd格式`) |
|||
// return |
|||
// } |
|||
|
|||
// if (obj.isApproval && ['是', '否'].indexOf(obj.isApproval) == -1) { |
|||
// error(`第${i + 2}行【价格是否特批】错误，请填写是或否`) |
|||
// return |
|||
// } |
|||
// //复购次数 正整数 |
|||
// if (obj.repurchaseCount && !zzsPattern.test(obj.repurchaseCount)) { |
|||
// error(`第${i + 2}行【复购次数】填写错误，需要为非负整数`) |
|||
// return |
|||
// } |
|||
|
|||
// if (obj.reproducible && ['是', '否'].indexOf(obj.reproducible) == -1) { |
|||
// error(`第${i + 2}行【是否可复制的业务路径】错误，请填写是或否`) |
|||
// return |
|||
// } |
|||
postData.push(obj); |
|||
} |
|||
setPostData(postData) |
|||
console.log(postData,'======================='); |
|||
let msg = '文件解析完成，点击确定按钮上传保存！' |
|||
setMsg(msg) |
|||
onSuccess({ message: msg }) |
|||
}) |
|||
}}> |
|||
<Button icon={<IconUpload />} theme="light"> |
|||
请选择文件 |
|||
</Button> |
|||
</Form.Upload> |
|||
<span>{msg}</span> |
|||
<div style={{ color: '#ccc' }}>最大不超过200M，导入文件需与 |
|||
<span onClick={() => download()} style={{ cursor: 'pointer', color: '#0066FF' }}>导入模板</span> |
|||
一致</div> |
|||
</Form> |
|||
</Modal > |
|||
) |
|||
} |
|||
|
|||
function mapStateToProps(state) { |
|||
const { auth, global } = state; |
|||
return { |
|||
user: auth.user, |
|||
actions: global.actions, |
|||
} |
|||
} |
|||
|
|||
export default connect(mapStateToProps)(ImportPerformanceSummaryModal); |
|||
@ -0,0 +1,487 @@ |
|||
import React, { useEffect, useState } from 'react'; |
|||
import { connect } from 'react-redux'; |
|||
import moment from 'moment' |
|||
import { Table, } from '@douyinfe/semi-ui'; |
|||
import '../../style.less'; |
|||
import ImportPerformanceSummaryModal from './importPerformanceSummaryModal' |
|||
import FileSaver from 'file-saver' |
|||
|
|||
const AchievementDetails = (props) => { |
|||
const { dispatch, actions, performanceSummaryList } = props |
|||
const [importModalV, setImportModalV] = useState(false); |
|||
useEffect(() => { |
|||
dispatch(actions.businessManagement.getPerformanceSummary()); |
|||
}, []); |
|||
let colums = [{ num: '1月', name: 'one' }, { num: '2月', name: 'two' }, { num: '3月', name: 'three' }, { num: '4月', name: 'four' }, { num: '5月', name: 'five' }, { num: '6月', name: 'six' }, { num: '7月', name: 'seven' }, { num: '8月', name: 'eight' }, { num: '9月', name: 'nine' }, { num: '10月', name: 'ten' }, { num: '11月', name: 'eleven' }, { num: '12月', name: 'twelve' }] |
|||
const columnsList = () => { |
|||
colums.forEach(e => { |
|||
columns.push({ |
|||
title: e.num, |
|||
children: [ |
|||
{ |
|||
title: '合同金额', |
|||
dataIndex: e.name + '[amount]', |
|||
width: 130, |
|||
render: (text, record, index) => text |
|||
}, |
|||
{ |
|||
title: '实际业绩', |
|||
dataIndex: e.name + '[actualPerformance]', |
|||
width: 130, |
|||
render: (text, record, index) => text |
|||
}, |
|||
{ |
|||
title: '考核业绩', |
|||
dataIndex: e.name + '[assessmentPerformance]', |
|||
width: 130, |
|||
render: (text, record, index) => text |
|||
}, |
|||
{ |
|||
title: '销售任务', |
|||
dataIndex: e.name + '[task]', |
|||
width: 130, |
|||
render: (text, record, index) => text |
|||
}, |
|||
{ |
|||
title: '完成率%', |
|||
dataIndex: e.name + '[completion]', |
|||
width: 130, |
|||
render: (text, record, index) => { |
|||
let assessmentPerformance = record[e.name] ? record[e.name].assessmentPerformance : 0 |
|||
let task = record[e.name] ? record[e.name].task : 0 |
|||
return assessmentPerformance == 0 || task == 0 ? 0 : assessmentPerformance / task |
|||
} |
|||
} |
|||
] |
|||
} |
|||
) |
|||
}) |
|||
} |
|||
let columns = [ |
|||
{ |
|||
title: '部门', |
|||
dataIndex: 'department', |
|||
width: 130, |
|||
// render: (text, record, index) => index + 1 |
|||
}, |
|||
{ |
|||
title: '销售人员', |
|||
dataIndex: 'sale', |
|||
width: 130, |
|||
// render: (text, record, index) => index + 1 |
|||
}, |
|||
{ |
|||
title: '业务线', |
|||
dataIndex: 'business', |
|||
width: 130, |
|||
// render: (text, record, index) => index + 1 |
|||
}, |
|||
{ |
|||
title: '入职日期', |
|||
dataIndex: 'hiredate', |
|||
width: 130, |
|||
render: (text, record, index) => moment(text).format('YYYY-MM-DD') |
|||
}, |
|||
{ |
|||
title: '转正日期', |
|||
dataIndex: 'regularDate', |
|||
width: 130, |
|||
render: (text, record, index) => moment(text).format('YYYY-MM-DD') |
|||
}, |
|||
{ |
|||
title: '工龄', |
|||
dataIndex: 'workingYears', |
|||
width: 130, |
|||
render: (text, record, index) => { |
|||
let days = moment().diff(moment(record.hiredate).format('YYYY-MM-DD'), 'days') |
|||
let day = days / 365 |
|||
return day.toFixed(1) |
|||
} |
|||
}, |
|||
] |
|||
columnsList() |
|||
let arr = performanceSummaryList.map(e => { |
|||
e.salePerformances.forEach(i => { |
|||
if (i.month == 1) { |
|||
e.one = i |
|||
} |
|||
if (i.month == 2) { |
|||
e.two = i |
|||
} |
|||
if (i.month == 3) { |
|||
e.three = i |
|||
} |
|||
if (i.month == 4) { |
|||
e.four = i |
|||
} |
|||
if (i.month == 5) { |
|||
e.five = i |
|||
} |
|||
if (i.month == 6) { |
|||
e.six = i |
|||
} |
|||
if (i.month == 7) { |
|||
e.seven = i |
|||
} |
|||
if (i.month == 8) { |
|||
e.eight = i |
|||
} |
|||
if (i.month == 9) { |
|||
e.nine = i |
|||
} |
|||
if (i.month == 10) { |
|||
e.ten = i |
|||
} |
|||
if (i.month == 11) { |
|||
e.eleven = i |
|||
} |
|||
if (i.month == 12) { |
|||
e.twelve = i |
|||
} |
|||
}) |
|||
return e |
|||
}) |
|||
const exportDetail = () => { |
|||
let tableStyle = "text-align: center;font-size:21px" |
|||
let exportTable = ` |
|||
<tr> |
|||
<th rowspan='2'><div style="${tableStyle}">部门</div></th> |
|||
<th rowspan='2'><div style="${tableStyle}">销售人员</div></th> |
|||
<th rowspan='2'><div style="${tableStyle}">业务线</div></th> |
|||
<th rowspan='2'><div style="${tableStyle}">入职日期</div></th> |
|||
<th rowspan='2'><div style="${tableStyle}">转正日期</div></th> |
|||
<th rowspan='2'><div style="${tableStyle}">工龄</div></th> |
|||
<th colspan="5"><div style="${tableStyle}">1月</div></th> |
|||
<th colspan="5"><div style="${tableStyle}">2月</div></th> |
|||
<th colspan="5"><div style="${tableStyle}">3月</div></th> |
|||
<th colspan="2"><div style="${tableStyle}">一季度</div></th> |
|||
<th colspan="5"><div style="${tableStyle}">4月</div></th> |
|||
<th colspan="5"><div style="${tableStyle}">5月</div></th> |
|||
<th colspan="5"><div style="${tableStyle}">6月</div></th> |
|||
<th colspan="2"><div style="${tableStyle}">二季度</div></th> |
|||
<th colspan="5"><div style="${tableStyle}">7月</div></th> |
|||
<th colspan="5"><div style="${tableStyle}">8月</div></th> |
|||
<th colspan="5"><div style="${tableStyle}">9月</div></th> |
|||
<th colspan="2"><div style="${tableStyle}">三季度</div></th> |
|||
<th colspan="5"><div style="${tableStyle}">10月</div></th> |
|||
<th colspan="5"><div style="${tableStyle}">11月</div></th> |
|||
<th colspan="5"><div style="${tableStyle}">12月</div></th> |
|||
<th colspan="2"><div style="${tableStyle}">四季度</div></th> |
|||
<th colspan="3"><div style="${tableStyle}">四季度</div></th> |
|||
<th rowspan='2'><div style="${tableStyle}">扣除转法务业绩金额</div></th> |
|||
<th rowspan='2'><div style="${tableStyle}">2022年最终业绩合计</div></th> |
|||
</tr> |
|||
<tr> |
|||
<th><div style="${tableStyle}">合同金额</div></th> |
|||
<th><div style="${tableStyle}">实际业绩</div></th> |
|||
<th><div style="${tableStyle}">考核业绩</div></th> |
|||
<th><div style="${tableStyle}">销售任务</div></th> |
|||
<th><div style="${tableStyle}">完成率</div></th> |
|||
<th><div style="${tableStyle}">合同金额</div></th> |
|||
<th><div style="${tableStyle}">实际业绩</div></th> |
|||
<th><div style="${tableStyle}">考核业绩</div></th> |
|||
<th><div style="${tableStyle}">销售任务</div></th> |
|||
<th><div style="${tableStyle}">完成率</div></th> |
|||
<th><div style="${tableStyle}">合同金额</div></th> |
|||
<th><div style="${tableStyle}">实际业绩</div></th> |
|||
<th><div style="${tableStyle}">考核业绩</div></th> |
|||
<th><div style="${tableStyle}">销售任务</div></th> |
|||
<th><div style="${tableStyle}">完成率</div></th> |
|||
<th><div style="${tableStyle}">销售任务</div></th> |
|||
<th><div style="${tableStyle}">完成率</div></th> |
|||
<th><div style="${tableStyle}">合同金额</div></th> |
|||
<th><div style="${tableStyle}">实际业绩</div></th> |
|||
<th><div style="${tableStyle}">考核业绩</div></th> |
|||
<th><div style="${tableStyle}">销售任务</div></th> |
|||
<th><div style="${tableStyle}">完成率</div></th> |
|||
<th><div style="${tableStyle}">合同金额</div></th> |
|||
<th><div style="${tableStyle}">实际业绩</div></th> |
|||
<th><div style="${tableStyle}">考核业绩</div></th> |
|||
<th><div style="${tableStyle}">销售任务</div></th> |
|||
<th><div style="${tableStyle}">完成率</div></th> |
|||
<th><div style="${tableStyle}">合同金额</div></th> |
|||
<th><div style="${tableStyle}">实际业绩</div></th> |
|||
<th><div style="${tableStyle}">考核业绩</div></th> |
|||
<th><div style="${tableStyle}">销售任务</div></th> |
|||
<th><div style="${tableStyle}">完成率</div></th> |
|||
<th><div style="${tableStyle}">销售任务</div></th> |
|||
<th><div style="${tableStyle}">完成率</div></th> |
|||
<th><div style="${tableStyle}">合同金额</div></th> |
|||
<th><div style="${tableStyle}">实际业绩</div></th> |
|||
<th><div style="${tableStyle}">考核业绩</div></th> |
|||
<th><div style="${tableStyle}">销售任务</div></th> |
|||
<th><div style="${tableStyle}">完成率</div></th> |
|||
<th><div style="${tableStyle}">合同金额</div></th> |
|||
<th><div style="${tableStyle}">实际业绩</div></th> |
|||
<th><div style="${tableStyle}">考核业绩</div></th> |
|||
<th><div style="${tableStyle}">销售任务</div></th> |
|||
<th><div style="${tableStyle}">完成率</div></th> |
|||
<th><div style="${tableStyle}">合同金额</div></th> |
|||
<th><div style="${tableStyle}">实际业绩</div></th> |
|||
<th><div style="${tableStyle}">考核业绩</div></th> |
|||
<th><div style="${tableStyle}">销售任务</div></th> |
|||
<th><div style="${tableStyle}">完成率</div></th> |
|||
<th><div style="${tableStyle}">销售任务</div></th> |
|||
<th><div style="${tableStyle}">完成率</div></th> |
|||
<th><div style="${tableStyle}">合同金额</div></th> |
|||
<th><div style="${tableStyle}">实际业绩</div></th> |
|||
<th><div style="${tableStyle}">考核业绩</div></th> |
|||
<th><div style="${tableStyle}">销售任务</div></th> |
|||
<th><div style="${tableStyle}">完成率</div></th> |
|||
<th><div style="${tableStyle}">合同金额</div></th> |
|||
<th><div style="${tableStyle}">实际业绩</div></th> |
|||
<th><div style="${tableStyle}">考核业绩</div></th> |
|||
<th><div style="${tableStyle}">销售任务</div></th> |
|||
<th><div style="${tableStyle}">完成率</div></th> |
|||
<th><div style="${tableStyle}">合同金额</div></th> |
|||
<th><div style="${tableStyle}">实际业绩</div></th> |
|||
<th><div style="${tableStyle}">考核业绩</div></th> |
|||
<th><div style="${tableStyle}">销售任务</div></th> |
|||
<th><div style="${tableStyle}">完成率</div></th> |
|||
<th><div style="${tableStyle}">销售任务</div></th> |
|||
<th><div style="${tableStyle}">完成率</div></th> |
|||
<th><div style="${tableStyle}">合同金额合计</div></th> |
|||
<th><div style="${tableStyle}">实际业绩合计</div></th> |
|||
<th><div style="${tableStyle}">考核业绩合计</div></th> |
|||
</tr> |
|||
`; |
|||
//无数据 |
|||
if (JSON.stringify(arr) == '[]') { |
|||
message.warning('暂无导出的数据') |
|||
} else { |
|||
let allList = arr.map(item => { |
|||
const oneAssessmentPerformance = item.one && item.one.assessmentPerformance; |
|||
const oneTask = item.one && item.one.task; |
|||
const oneCompletion = oneAssessmentPerformance && oneTask && oneAssessmentPerformance / oneTask; |
|||
const twoAssessmentPerformance = item.two && item.two.assessmentPerformance; |
|||
const twoTask = item.two && item.two.task; |
|||
const twoCompletion = twoAssessmentPerformance && twoTask && twoAssessmentPerformance / twoTask; |
|||
const threeAssessmentPerformance = item.three && item.three.assessmentPerformance; |
|||
const threeTask = item.three && item.three.task; |
|||
const threeCompletion = threeAssessmentPerformance && threeTask && threeAssessmentPerformance / threeTask; |
|||
const fourAssessmentPerformance = item.four && item.four.assessmentPerformance; |
|||
const fourTask = item.four && item.four.task; |
|||
const fourCompletion = fourAssessmentPerformance && fourTask && fourAssessmentPerformance / fourTask; |
|||
const fiveAssessmentPerformance = item.five && item.five.assessmentPerformance; |
|||
const fiveTask = item.five && item.five.task; |
|||
const fiveCompletion = fiveAssessmentPerformance && fiveTask && fiveAssessmentPerformance / fiveTask; |
|||
const sixAssessmentPerformance = item.six && item.six.assessmentPerformance; |
|||
const sixTask = item.six && item.six.task; |
|||
const sixCompletion = sixAssessmentPerformance && sixTask && sixAssessmentPerformance / sixTask; |
|||
const sevenAssessmentPerformance = item.seven && item.seven.assessmentPerformance; |
|||
const sevenTask = item.seven && item.seven.task; |
|||
const sevenCompletion = sevenAssessmentPerformance && sevenTask && sevenAssessmentPerformance / sevenTask; |
|||
const eightAssessmentPerformance = item.eight && item.eight.assessmentPerformance; |
|||
const eightTask = item.eight && item.eight.task; |
|||
const eightCompletion = eightAssessmentPerformance && eightTask && eightAssessmentPerformance / eightTask; |
|||
const nineAssessmentPerformance = item.nine && item.nine.assessmentPerformance; |
|||
const nineTask = item.nine && item.nine.task; |
|||
const nineCompletion = nineAssessmentPerformance && nineTask && nineAssessmentPerformance / nineTask; |
|||
const tenAssessmentPerformance = item.ten && item.ten.assessmentPerformance; |
|||
const tenTask = item.ten && item.ten.task; |
|||
const tenCompletion = tenAssessmentPerformance && tenTask && tenAssessmentPerformance / tenTask; |
|||
const elevenAssessmentPerformance = item.eleven && item.eleven.assessmentPerformance; |
|||
const elevenTask = item.eleven && item.eleven.task; |
|||
const elevenCompletion = elevenAssessmentPerformance && elevenTask && elevenAssessmentPerformance / elevenTask; |
|||
const twelveAssessmentPerformance = item.twelve && item.twelve.assessmentPerformance; |
|||
const twelveTask = item.twelve && item.twelve.task; |
|||
const twelveCompletion = twelveAssessmentPerformance && twelveTask && twelveAssessmentPerformance / twelveTask; |
|||
|
|||
let days = moment().diff(moment(item.hiredate).format('YYYY-MM-DD'), 'days') |
|||
let day = days / 365 |
|||
const workingYears = day.toFixed(1) |
|||
return Object.assign({}, item, { |
|||
oneCompletion: oneCompletion, |
|||
twoCompletion: twoCompletion, |
|||
threeCompletion: threeCompletion, |
|||
oneQuarterTaskNnu: Number(oneTask ? oneTask : 0) + Number(twoTask ? twoTask : 0) + Number(threeTask ? threeTask : 0), |
|||
oneQuarterTask: (oneAssessmentPerformance || twoAssessmentPerformance || threeAssessmentPerformance) && (oneTask || twoTask || threeTask) && (oneAssessmentPerformance || 0 + twoAssessmentPerformance || 0 + threeAssessmentPerformance || 0) / (oneTask || 0 + twoTask || 0 + threeTask || 0), |
|||
fourCompletion: fourCompletion, |
|||
fiveCompletion: fiveCompletion, |
|||
sixCompletion: sixCompletion, |
|||
twoQuarterTaskNnu: Number(fourTask ? fourTask : 0) + Number(fiveTask ? fiveTask : 0) + Number(sixTask ? sixTask : 0), |
|||
twoQuarterTask: (fourAssessmentPerformance || fiveAssessmentPerformance || sixAssessmentPerformance) && (fourTask || fiveTask || sixTask) && (fourAssessmentPerformance || 0 + fiveAssessmentPerformance || 0 + sixAssessmentPerformance || 0) / (fourTask || 0 + fiveTask || 0 + sixTask || 0), |
|||
sevenCompletion: sevenCompletion, |
|||
eightCompletion: eightCompletion, |
|||
nineCompletion: nineCompletion, |
|||
threeQuarterTaskNnu: Number(sevenTask ? sevenTask : 0) + Number(eightTask ? eightTask : 0) + Number(nineTask ? nineTask : 0), |
|||
threeQuarterTask: (sevenAssessmentPerformance || eightAssessmentPerformance || nineAssessmentPerformance) && (sevenTask || eightTask || nineTask) && (sevenAssessmentPerformance || 0 + eightAssessmentPerformance || 0 + nineAssessmentPerformance || 0) / (sevenTask || 0 + eightTask || 0 + nineTask || 0), |
|||
tenCompletion: tenCompletion, |
|||
elevenCompletion: elevenCompletion, |
|||
twelveCompletion: twelveCompletion, |
|||
fourQuarterTaskNnu: Number(tenTask ? tenTask : 0) + Number(elevenTask ? elevenTask : 0) + Number(twelveTask ? twelveTask : 0), |
|||
fourQuarterTask: (tenAssessmentPerformance || elevenAssessmentPerformance || twelveAssessmentPerformance) && (tenTask || elevenTask || twelveTask) && (tenAssessmentPerformance || 0 + elevenAssessmentPerformance || 0 + twelveAssessmentPerformance || 0) / (tenTask || 0 + elevenTask || 0 + twelveTask || 0), |
|||
workingYears: workingYears, |
|||
allAmount: Number(item.one ? item.one.amount : 0) + Number(item.two ? item.two.amount : 0) + Number(item.three ? item.three.amount : 0) + Number(item.four ? item.four.amount : 0) + Number(item.five ? item.five.amount : 0) + Number(item.six ? item.six.amount : 0) + Number(item.seven ? item.seven.amount : 0) + Number(item.eight ? item.eight.amount : 0) + Number(item.nine ? item.nine.amount : 0) + Number(item.ten ? item.ten.amount : 0) + Number(item.eleven ? item.eleven.amount : 0) + Number(item.twelve ? item.twelve.amount : 0), |
|||
|
|||
allactualPerformance: Number(item.one ? item.one.actualPerformance : 0) + Number(item.two ? item.two.actualPerformance : 0) + Number(item.three ? item.three.actualPerformance : 0) + Number(item.four ? item.four.actualPerformance : 0) + Number(item.five ? item.five.actualPerformance : 0) + Number(item.six ? item.six.actualPerformance : 0) + Number(item.seven ? item.seven.actualPerformance : 0) + Number(item.eight ? item.eight.actualPerformance : 0) + Number(item.nine ? item.nine.actualPerformance : 0) + Number(item.ten ? item.ten.actualPerformance : 0) + Number(item.eleven ? item.eleven.actualPerformance : 0) + Number(item.twelve ? item.twelve.actualPerformance : 0), |
|||
|
|||
allassessmentPerformance: Number(item.one ? item.one.assessmentPerformance : 0) + Number(item.two ? item.two.assessmentPerformance : 0) + Number(item.three ? item.three.assessmentPerformance : 0) + Number(item.four ? item.four.assessmentPerformance : 0) + Number(item.five ? item.five.assessmentPerformance : 0) + Number(item.six ? item.six.assessmentPerformance : 0) + Number(item.seven ? item.seven.assessmentPerformance : 0) + Number(item.eight ? item.eight.assessmentPerformance : 0) + Number(item.nine ? item.nine.assessmentPerformance : 0) + Number(item.ten ? item.ten.assessmentPerformance : 0) + Number(item.eleven ? item.eleven.assessmentPerformance : 0) + Number(item.twelve ? item.twelve.assessmentPerformance : 0), |
|||
}) |
|||
}) |
|||
for (let d of allList) { |
|||
exportTable += ` |
|||
<tr> |
|||
<td><div style="${tableStyle}">${d['department']}</div></td> |
|||
<td><div style="${tableStyle}">${d['sale']}</div></td> |
|||
<td><div style="${tableStyle}">${d['business']}</div></td> |
|||
<td><div style="${tableStyle}">${d['hiredate']}</div></td> |
|||
<td><div style="${tableStyle}">${d['regularDate']}</div></td> |
|||
<td><div style="${tableStyle}">${d['workingYears']}</div></td> |
|||
|
|||
<td><div style="${tableStyle}">${d.one ? d.one.amount : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.one ? d.one.actualPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.one ? d.one.assessmentPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.one ? d.one.task : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.oneCompletion ? d.oneCompletion : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.two ? d.two.amount : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.two ? d.two.actualPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.two ? d.two.assessmentPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.two ? d.two.task : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.twoCompletion ? d.twoCompletion : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.three ? d.three.amount : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.three ? d.three.actualPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.three ? d.three.assessmentPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.three ? d.three.task : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.threeCompletion ? d.threeCompletion : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.oneQuarterTaskNnu == 0 ? '' : d.oneQuarterTaskNnu}</div></td> |
|||
<td><div style="${tableStyle}">${d.oneQuarterTask ? d.oneQuarterTask : ''}</div></td> |
|||
|
|||
<td><div style="${tableStyle}">${d.four ? d.four.amount : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.four ? d.four.actualPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.four ? d.four.assessmentPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.four ? d.four.task : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.fourCompletion ? d.fourCompletion : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.five ? d.five.amount : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.five ? d.five.actualPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.five ? d.five.assessmentPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.five ? d.five.task : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.fiveCompletion ? d.fiveCompletion : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.six ? d.six.amount : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.six ? d.six.actualPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.six ? d.six.assessmentPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.six ? d.six.task : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.sixCompletion ? d.sixCompletion : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.twoQuarterTaskNnu == 0 ? '' : d.twoQuarterTaskNnu}</div></td> |
|||
<td><div style="${tableStyle}">${d.twoQuarterTask ? d.twoQuarterTask : ''}</div></td> |
|||
|
|||
<td><div style="${tableStyle}">${d.seven ? d.seven.amount : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.seven ? d.seven.actualPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.seven ? d.seven.assessmentPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.seven ? d.seven.task : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.sevenCompletion ? d.sevenCompletion : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.eight ? d.eight.amount : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.eight ? d.eight.actualPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.eight ? d.eight.assessmentPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.eight ? d.eight.task : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.eightCompletion ? d.eightCompletion : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.nine ? d.nine.amount : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.nine ? d.nine.actualPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.nine ? d.nine.assessmentPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.nine ? d.nine.task : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.nineCompletion ? d.nineCompletion : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.threeQuarterTaskNnu == 0 ? '' : d.threeQuarterTaskNnu}</div></td> |
|||
<td><div style="${tableStyle}">${d.threeQuarterTask ? d.threeQuarterTask : ''}</div></td> |
|||
|
|||
<td><div style="${tableStyle}">${d.ten ? d.ten.amount : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.ten ? d.ten.actualPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.ten ? d.ten.assessmentPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.ten ? d.ten.task : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.tenCompletion ? d.tenCompletion : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.eleven ? d.eleven.amount : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.eleven ? d.eleven.actualPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.eleven ? d.eleven.assessmentPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.eleven ? d.eleven.task : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.elevenCompletion ? d.elevenCompletion : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.twelve ? d.twelve.amount : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.twelve ? d.twelve.actualPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.twelve ? d.twelve.assessmentPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.twelve ? d.twelve.task : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.twelveCompletion ? d.twelveCompletion : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.fourQuarterTaskNnu == 0 ? '' : d.fourQuarterTaskNnu}</div></td> |
|||
<td><div style="${tableStyle}">${d.fourQuarterTask ? d.fourQuarterTask : ''}</div></td> |
|||
|
|||
<td><div style="${tableStyle}">${d.allAmount ? d.allAmount : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.allactualPerformance ? d.allactualPerformance : ''}</div></td> |
|||
<td><div style="${tableStyle}">${d.allassessmentPerformance ? d.allassessmentPerformance : ''}</div></td> |
|||
|
|||
<td><div style="${tableStyle}"></div></td> |
|||
<td><div style="${tableStyle}"></div></td> |
|||
|
|||
|
|||
</tr> |
|||
` |
|||
} |
|||
exportTable = `\uFEFF |
|||
<table style='text-alagin:center' border="1"> |
|||
<tr> |
|||
<th colspan="30"><div style="${tableStyle}">储备项目明细表</div></th> |
|||
</tr> |
|||
${exportTable} |
|||
</table> |
|||
`; |
|||
let tempStrs = new Blob([exportTable], { type: 'text/xls' }) |
|||
FileSaver.saveAs(tempStrs, `储备中项目明细${moment().format('YYYY-MM-DD')}.xls`) |
|||
} |
|||
} |
|||
|
|||
return ( |
|||
<> |
|||
<div style={{ padding: '0px 12px' }}> |
|||
<div style={{ display: 'flex' }}> |
|||
<div style={{ color: 'rgba(0,0,0,0.45)', fontSize: 14 }}>业务管理</div> |
|||
<div style={{ color: 'rgba(0,0,0,0.45)', fontSize: 14, margin: '0px 8px' }}>/</div> |
|||
<div style={{ color: 'rgba(0,0,0,0.45)', fontSize: 14 }}>业绩报表</div> |
|||
<div style={{ color: '#033C9A', fontSize: 14, margin: '0px 8px' }}>/</div> |
|||
<div style={{ color: '#033C9A', fontSize: 14 }}>业绩汇总表</div> |
|||
</div> |
|||
<div style={{ background: '#FFFFFF', boxShadow: '0px 0px 12px 2px rgba(220,222,224,0.2)', borderRadius: 2, padding: '20px ', marginTop: 9 }}> |
|||
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}> |
|||
<div style={{ display: 'flex', alignItems: 'baseline' }}> |
|||
<div style={{ width: 0, height: 20, borderLeft: '3px solid #0F7EFB', borderTop: '3px solid transparent', borderBottom: '3px solid transparent' }}></div> |
|||
<div style={{ fontFamily: "YouSheBiaoTiHei", fontSize: 24, color: '#033C9A', marginLeft: 8 }}>业绩汇总表</div> |
|||
<div style={{ marginLeft: 6, fontSize: 12, color: '#969799', fontFamily: "DINExp", }}>PERFORMANCE SUMMARY</div> |
|||
</div> |
|||
</div> |
|||
<div style={{ margin: '18px 0px' }}> |
|||
<div style={{ display: 'flex', margin: '16px 0px', justifyContent: 'space-between' }}> |
|||
<div style={{ display: 'flex' }}> |
|||
<div style={{ padding: '6px 20px', background: '#0F7EFB', color: '#FFFFFF', fontSize: 14, cursor: "pointer" }} |
|||
onClick={() => { setImportModalV(true); }}> |
|||
导入 |
|||
</div> |
|||
<div style={{ padding: '6px 20px', background: '#00BA85', color: '#FFFFFF', fontSize: 14, cursor: "pointer", marginLeft: 18 }} |
|||
onClick={() => { |
|||
exportDetail() |
|||
}}> |
|||
导出全部 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div className='summaryList'> |
|||
<Table columns={columns} dataSource={arr} /> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
{ |
|||
importModalV ? <ImportPerformanceSummaryModal |
|||
onCancel={() => { |
|||
setImportModalV(false); |
|||
}} /> : '' |
|||
} |
|||
</div> |
|||
</> |
|||
) |
|||
} |
|||
|
|||
|
|||
function mapStateToProps(state) { |
|||
const { auth, global, performanceSummaryList } = state; |
|||
return { |
|||
user: auth.user, |
|||
actions: global.actions, |
|||
performanceSummaryList: performanceSummaryList.data || [] |
|||
}; |
|||
} |
|||
|
|||
export default connect(mapStateToProps)(AchievementDetails); |
|||
Loading…
Reference in new issue