| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607 | import React from 'react';import {Select, Spin, Input, Table, Button, DatePicker, Tabs} from 'antd';import ajax from 'jquery/src/ajax/xhr.js';import $ from 'jquery/src/ajax';import './report.less';import { post } from '../../../dataDic.js';import {ChooseList} from "../../order/orderNew/chooseList";const { TabPane } = Tabs;const PersonalReport = React.createClass({	loadData(totalArr) {		if(this.state.selTime){			var newTime=this.state.selTime;			var timeArr=newTime.split('-');			var txtTime=timeArr[0]+'年'+timeArr[1]+'月'+timeArr[2]+'日';			this.setState({				timeState:true,				txtTime:txtTime,			})		}		let total=totalArr;		this.setState({			loading: true		});		$.ajax({			method: "get",			dataType: "json",			crossDomain: false,			url: globalConfig.context + "/api/admin/report/sales/department",			data: {				date:this.state.selTime?(this.state.selTime+' '+'00:00:00'):'',			},			success: function(data) {				let thedata = data.data;				let theArr = [];				if(!thedata) {					if(data.error && data.error.length) {						message.warning(data.error[0].message);					};					thedata = {};				} else {					thedata.map(function(item, index) {						let nub=index+1;						theArr.push({							key: index,							theNumber:false,							nub:nub,							id: item.id,							departmentName:item.departmentName,//部门							managerName:item.managerName,//负责人							memberCount:item.memberCount, //部门人数							enrollTime:item.enrollTime,// 入职时间							dailyOrderCount:item.values.daily.orderCount,//日签单业绩							dailyOrderAmount:item.values.daily.orderAmount,//日签单业绩							weeklyOrderCount:item.values.weekly.orderCount,//周签单业绩							weeklyOrderAmount:item.values.weekly.orderAmount,//周签单业绩							monthlyOrderCount:item.values.monthly.orderCount,//月签单业绩							monthlyOrderAmount:item.values.monthly.orderAmount,//月签单业绩							quarterlyOrderCount:item.values.quarterly.orderCount,//季签单业绩							quarterlyOrderAmount:item.values.quarterly.orderAmount,//季签单业绩							annuallyOrderCount:item.values.annually.orderCount,//年签单业绩							annuallyOrderAmount:item.values.annually.orderAmount,//年签单业绩						})					})				}				if(theArr.length){					theArr.push(						{							key:9999999,							theNumber:true,							departmentName:'合计',							dailyOrderCount:total.dailyTotalCount,//日签单业绩							dailyOrderAmount:total.dailyTotalAmount,//日签单业绩							weeklyOrderCount:total.weeklyTotalCount,//周签单业绩							weeklyOrderAmount:total.weeklyTotalAmount,//周签单业绩							monthlyOrderCount:total.monthlyTotalCount,//月签单业绩							monthlyOrderAmount:total.monthlyTotalAmount,//月签单业绩							quarterlyOrderCount:total.quarterlyTotalCount,//季签单业绩							quarterlyOrderAmount:total.quarterlyTotalAmount,//季签单业绩							annuallyOrderCount:total.annuallyTotalCount,//年签单业绩							annuallyOrderAmount:total.annuallyTotalAmount,//年签单业绩						}					)				}				this.setState({					dataSource: theArr,				})			}.bind(this),		}).always(function() {			this.setState({				loading: false			});		}.bind(this));	},	totalData() {		this.setState({			loading: true		});		$.ajax({			method: "get",			dataType: "json",			crossDomain: false,			url: globalConfig.context + "/api/admin/report/sales/total",			data: {				date:this.state.selTime?(this.state.selTime+' '+'00:00:00'):'',			},			success: function(data) {				let thedata = data.data;				let theArr = [];				if(!thedata) {					if(data.error && data.error.length) {						message.warning(data.error[0].message);					};					thedata = {};				} 				this.loadData(thedata)			}.bind(this),		}).always(function() {			this.setState({				loading: false			});		}.bind(this));	},	//时间选择    selTime(value,index){    	this.setState({    		Dtime:value,    		selTime:index    	})    },	getInitialState() {		return {			selectedRowKeys: [],			selectedRows: [],			loading: false,			visible: false,			showDesc: false,			timeState:false,			Dtime:undefined,			selTime:'',			columns: [			{				title: '序号',				dataIndex: 'nub',				width:50,				key: 'nub',				fixed:true,				render:(text,record)=>{				     if(!record.theNumber){				     	return text				     }else{				     	return {				     		children: text,      						props: {      							colSpan:0      						},				     	}				     					     }				     				}			},			{				title: '部门',				dataIndex: 'departmentName',				key: 'departmentName',				width:100,				fixed:true,				render:(text,record)=>{				     if(!record.theNumber){				     	return text&&text.length>6?<span title={text}>{text.substr(0,6)+'…'}</span>:text				     }else{				     	return {				     		children: text,      						props: {      							colSpan:4      						},				     	}				     					     }				     				}			},{				title: '负责人',				width:100,				fixed:true,				dataIndex: 'managerName',				key: 'managerName',				render:(text,record)=>{				     if(!record.theNumber){				     	return text				     }else{				     	return {				     		children: text,      						props: {      							colSpan:0      						},				     	}				     					     }				     				}			}, 			{				title: '部门人数',				width:100,				fixed:true,				dataIndex: 'memberCount',				key: 'memberCount',				render:(text,record)=>{				     if(!record.theNumber){				     	return text				     }else{				     	return {				     		children: text,      						props: {      							colSpan:0      						},				     	}				     					     }				     				}			},{				title: '当日业绩',				children: [					{						title: '单量',						dataIndex: 'dailyOrderCount',						width:70,						key: 'dailyOrderCount',						sorter: (a, b) => a.dailyOrderCount - b.dailyOrderCount,					},{						title: '金额',						dataIndex: 'dailyOrderAmount',						width:70,						key: 'dailyOrderAmount',						sorter: (a, b) => a.dailyOrderAmount - b.dailyOrderAmount,					}				],			},			{				title: '当日人均业绩',				children: [					{						title: '人均有效',						dataIndex: 'num6611',						key: 'num6611',						width:100,						sorter: (a, b) => a.num66 - b.num66,					},{						title: '人均单量',						dataIndex: 'age262',						key: 'age262',						width:100,						sorter: (a, b) => a.age - b.age,					},{						title: '人均金额',						dataIndex: 'age26',						width:100,						key: 'age26',						sorter: (a, b) => a.age - b.age,					}				],			},			{				title: '当日客户营销',				children: [					{						title: '客户总量',						dataIndex: 'anum66',						key: 'anum66',						width:100,						sorter: (a, b) => a.num66 - b.num66,					},{						title: '新增营销',						dataIndex: 'aage266',						key: 'aage266',						width:100,						sorter: (a, b) => a.age - b.age,					},					{						title: '营销回访',						dataIndex: 'age266p',						key: 'age266p',						width:100,						sorter: (a, b) => a.age - b.age,					}				],			},			{				title: '当日客户有效',				children: [					{						title: '有效总量',						width:100,						dataIndex: 'num',						key: 'num',						sorter: (a, b) => a.num - b.num,					},{						title: '新增有效',						width:100,						dataIndex: 'age2',						key: 'age2',						sorter: (a, b) => a.age - b.age,					},{						title: '有效回访',						width:100,						dataIndex: 'age3',						key: 'age3',						sorter: (a, b) => a.age - b.age,					}				],			}, {				title: '当日客户拜访',				children: [					{						title: '拜访总量',						width:100,						dataIndex: 'age11',						key: 'age11',						sorter: (a, b) => a.age - b.age,					},{						title: '电话',						width:70,						dataIndex: 'age22',						key: 'age22',						sorter: (a, b) => a.age - b.age,					},{						title: '外拜',						width:70,						dataIndex: 'age33',						key: 'age33',						sorter: (a, b) => a.age - b.age,					},{						title: '邮件',						width:70,						dataIndex: 'age44',						key: 'age44',						sorter: (a, b) => a.age - b.age,					},{						title: '微信',						width:70,						dataIndex: 'age55',						key: 'age55',						sorter: (a, b) => a.age - b.age,					}				],			},			{				title: '本周业绩',				children: [					{						title: '数量',						width:70,						dataIndex: 'weeklyOrderCount',						key: 'weeklyOrderCount',						sorter: (a, b) => a.weeklyOrderCount - b.weeklyOrderCount,					},{						title: '金额',						width:70,						dataIndex: 'weeklyOrderAmount',						key: 'weeklyOrderAmount',						sorter: (a, b) => a.weeklyOrderAmount - b.weeklyOrderAmount,					}				],			},{				title: '本月业绩',				children: [					{						title: '数量',						width:70,						dataIndex: 'monthlyOrderCount',						key: 'monthlyOrderCount',						sorter: (a, b) => a.monthlyOrderCount - b.monthlyOrderCount,					},{						title: '金额',						width:70,						dataIndex: 'monthlyOrderAmount',						key: 'monthlyOrderAmount',						sorter: (a, b) => a.monthlyOrderAmount - b.monthlyOrderAmount,					}				],			},{				title: '本季业绩',				children: [					{						title: '数量',						width:70,						dataIndex: 'quarterlyOrderCount',						key: 'quarterlyOrderCount',						sorter: (a, b) => a.quarterlyOrderCount - b.quarterlyOrderCount,					},{						title: '金额',						width:70,						dataIndex: 'quarterlyOrderAmount',						key: 'quarterlyOrderAmount',						sorter: (a, b) => a.quarterlyOrderAmount - b.quarterlyOrderAmount,					}				],			},{				title: '本年业绩',				children: [					{						title: '数量',						width:70,						dataIndex: 'annuallyOrderCount',						key: 'annuallyOrderCount',						sorter: (a, b) => a.annuallyOrderCount - b.annuallyOrderCount,					},{						title: '金额',						width:70,						dataIndex: 'annuallyOrderAmount',						key: 'annuallyOrderAmount',						sorter: (a, b) => a.annuallyOrderAmount - b.annuallyOrderAmount,					}				],			},			{				title: '本周人均',				children: [					{						title: '有效',						width:70,						dataIndex: 'annuallyOrderCounty',						key: 'annuallyOrderCounty',						sorter: (a, b) => a.annuallyOrderCount1 - b.annuallyOrderCount1,					},{						title: '单量',						width:70,						dataIndex: 'annuallyOrderAmountt',						key: 'annuallyOrderAmountt',						sorter: (a, b) => a.annuallyOrderAmount1 - b.annuallyOrderAmount1,					},					{						title: '金额',						width:70,						dataIndex: 'annuallyOrderAmount1',						key: 'annuallyOrderAmount1',						sorter: (a, b) => a.annuallyOrderAmount1 - b.annuallyOrderAmount1,					}				],			},{				title: '本月人均',				children: [					{						title: '有效',						width:70,						dataIndex: 'annuallyOrderCountv',						key: 'annuallyOrderCountv',						sorter: (a, b) => a.annuallyOrderCount1 - b.annuallyOrderCount1,					},{						title: '单量',						width:70,						dataIndex: 'annuallyOrderAmountv',						key: 'annuallyOrderAmountv',						sorter: (a, b) => a.annuallyOrderAmount1 - b.annuallyOrderAmount1,					},					{						title: '金额',						width:70,						dataIndex: 'annuallyOrderAmount1v',						key: 'annuallyOrderAmount1v',						sorter: (a, b) => a.annuallyOrderAmount1 - b.annuallyOrderAmount1,					}				],			},{				title: '本季人均',				children: [					{						title: '有效',						width:70,						dataIndex: 'annuallyOrderCountc',						key: 'annuallyOrderCountc',						sorter: (a, b) => a.annuallyOrderCount1 - b.annuallyOrderCount1,					},{						title: '单量',						width:70,						dataIndex: 'annuallyOrderAmountb',						key: 'annuallyOrderAmountb',						sorter: (a, b) => a.annuallyOrderAmount1 - b.annuallyOrderAmount1,					},					{						title: '金额',						width:70,						dataIndex: 'annuallyOrderAmounta',						key: 'annuallyOrderAmounta',						sorter: (a, b) => a.annuallyOrderAmount1 - b.annuallyOrderAmount1,					}				],			},{				title: '本年人均',				children: [					{						title: '有效',						width:70,						dataIndex: 'annuallyOrderCount2',						key: 'annuallyOrderCount2',						sorter: (a, b) => a.annuallyOrderCount1 - b.annuallyOrderCount1,					},{						title: '单量',						width:70,						dataIndex: 'annuallyOrderAmount3',						key: 'annuallyOrderAmount3',						sorter: (a, b) => a.annuallyOrderAmoun1t - b.annuallyOrderAmoun1t,					},					{						title: '金额',						width:70,						dataIndex: 'annuallyOrderAmount4',						key: 'annuallyOrderAmount4',						sorter: (a, b) => a.annuallyOrderAmount1 - b.annuallyOrderAmount1,					}				],			}			],			dataSource: [],		};	},	search() {		this.totalData()	},	reset() {		this.state.Dtime = undefined;		this.state.selTime='';		this.state.timeState=false;		this.totalData()	},	changeList(arr) {		const newArr = [];		this.state.columns.forEach(item => {			arr.forEach(val => {				if (val === item.title) {					newArr.push(item);				}			});		});		this.setState({			changeList: newArr		});	},	componentWillMount() {		this.totalData();		let times=new Date();		let nowTime=times.getFullYear()+'年'+(times.getMonth()+1)+'月'+times.getDate()+'日';		this.setState({			Nowtime:nowTime		})	},	render() {		let departmentArr = this.state.departmentArr || [];		return(			<div className='set-content'>				<p style={{fontSize:'20px',marginBottom:'10px'}}>部门业绩统计报表</p>				<Tabs					defaultActiveKey="1"					onChange={this.callback}					className="test">					<TabPane tab="搜索" key="1">						<div className="clearfix">							<span style={{fontSize:'16px'}}>选择日期 : </span>							<DatePicker onChange={this.selTime} value={this.state.Dtime}/>							<Button type="primary" onClick={this.search} style={{marginLeft:'10px',marginRight:'10px'}}>搜索</Button>							<Button onClick={this.reset}>重置</Button>						</div>					</TabPane>					<TabPane tab="更改表格显示数据" key="2">						<div style={{ marginLeft: 10 }}>							<ChooseList								columns={this.state.columns}								changeFn={this.changeList}								changeList={this.state.changeList}								top={55}								margin={11}							/>						</div>					</TabPane>				</Tabs>				<div className="surfaceTitle">					<span className="nowtime">{this.state.timeState?this.state.txtTime:this.state.Nowtime}</span>					<span>部门营销业绩统计表</span>					<span>(每日17:00统计当天数据)</span>				</div>				<div className="patent-table">					<div className="scroll">	                    <Spin spinning={this.state.loading}>	                        <Table columns={								this.state.changeList									? this.state.changeList									: this.state.columns							}	                            dataSource={this.state.dataSource}	                            scroll={{ x: 3200,y:500}}	                            bordered								pagination={false}								size="small"	                            />	                    </Spin>	                </div>	            </div>			</div>		)	}});export default PersonalReport;
 |