liting2017 7 years ago
parent
commit
8c6d879fd1

+ 24 - 0
js/component/manageCenter/customer/content.jsx

@@ -72,6 +72,30 @@ class Content extends Component {
                 });
       	    });
       	    break;
+      	    case 'visitStatistics':
+            require.ensure([], () => {
+                const VisitStatistics = require('./statistics/visitStatistics').default;
+                this.setState({
+                    component:<VisitStatistics />,	                                      
+                });
+      	    });
+      	    break;
+      	    case 'statusStatistics':
+            require.ensure([], () => {
+                const StatusStatistics = require('./statistics/statusStatistics').default;
+                this.setState({
+                    component:<StatusStatistics />,	                                      
+                });
+      	    });
+      	    break;
+      	    case 'followStatistics':
+            require.ensure([], () => {
+                const FollowStatistics = require('./statistics/followStatistics').default;
+                this.setState({
+                    component:<FollowStatistics />,	                                      
+                });
+      	    });
+      	    break;
         };
         window.location.hash = key;
     }

+ 1 - 3
js/component/manageCenter/customer/customerService/serviceQuery.jsx

@@ -1,10 +1,8 @@
 import React from 'react';
-import { Radio,Icon, Popconfirm,Button, AutoComplete ,Input,Select,Spin,Table, Switch, message, DatePicker, Modal,Form ,Row,Col,TimePicker} from 'antd';
+import {Button ,Input,Select,Spin,Table, Switch, message, DatePicker, Modal,Form ,Row,Col,TimePicker} from 'antd';
 import ajax from 'jquery/src/ajax/xhr.js';
 import $ from 'jquery/src/ajax';
 import moment from 'moment';
-const Option = AutoComplete.Option;
-const OptGroup = AutoComplete.OptGroup;
 import './myClient.less';
 import { areaSelect} from '../../../NewDicProvinceList';
 const { Column, ColumnGroup } = Table;

+ 14 - 2
js/component/manageCenter/customer/leftTab.jsx

@@ -13,7 +13,8 @@ const LeftTab = React.createClass({
             keyList: [
                 { key: 'sub1', value: ['myClient','companyCustomer'] },
                 { key: 'sub2', value: ['individualCustomer','queryCustomer'] },
-                { key: 'sub3', value: ['myBusiness', 'serviceQuery'] },               
+                { key: 'sub3', value: ['myBusiness', 'serviceQuery'] },
+                { key: 'sub4', value: ['visitStatistics', 'statusStatistics','followStatistics'] },
             ]
         };
     },
@@ -68,7 +69,18 @@ const LeftTab = React.createClass({
 		                <Menu.Item key="serviceQuery">
 		                    业务查询
 		                </Menu.Item>	               		           
-		        </SubMenu>   
+		        </SubMenu>
+		        <SubMenu key="sub4" title={<span>统计分析</span>}>		            
+		                <Menu.Item key="visitStatistics">
+		                    客户拜访统计
+		                </Menu.Item>               
+		                <Menu.Item key="statusStatistics">
+		                    业务客户状态统计
+		                </Menu.Item>
+		                <Menu.Item key="followStatistics">
+		                    业务跟进进度统计
+		                </Menu.Item>
+		        </SubMenu>
             </Menu>
         );
     },

+ 188 - 0
js/component/manageCenter/customer/statistics/followStatistics.jsx

@@ -0,0 +1,188 @@
+import React from 'react';
+import ajax from 'jquery/src/ajax/xhr.js';
+import $ from 'jquery/src/ajax';
+import "./statistics.less"
+import { Button, Select, Table ,Spin, message,Tabs, DatePicker } from 'antd';
+const TabPane = Tabs.TabPane;
+import moment from 'moment';
+import {intentionalService} from '../../../dataDic.js';
+
+const FollowStatistics = React.createClass({
+	loadData(pageNo, nub) {
+        this.state.data = [];
+        this.setState({
+            loading: true
+        });
+        let urls='';
+		switch(nub){
+			case "1":urls="/api/admin/achievement/delete";break;//日
+			case "2":urls="/api/admin/achievement/delete2";break;//周
+			case "3":urls="/api/admin/achievement/delete3";break;//月
+			case "4":urls="/api/admin/achievement/delete4";break;//季
+			case "5":urls="/api/admin/achievement/delete5";break;//年
+		}
+        $.ajax({
+            method: "get",
+            dataType: "json",
+            crossDomain: false,
+            url: globalConfig.context + urls?urls:"/api/admin/achievement/delete",
+            data: {
+                pageNo: pageNo || 1,
+                pageSize: this.state.pagination.pageSize,
+                releaseDateStartDate: this.state.releaseDate[0],
+                releaseDateEndDate: this.state.releaseDate[1],   
+            },
+            success: function (data) {
+                let theArr = [];
+                if (!data.data || !data.data.list) {
+                    if (data.error && data.error.length) {
+                        message.warning(data.error[0].message);
+                    };
+                } else {
+                    for (let i = 0; i < data.data.list.length; i++) {
+                        let thisdata = data.data.list[i];
+                        theArr.push({
+                            key: i,
+                            id: thisdata.id,
+                            serialNumber: thisdata.serialNumber,
+                            
+                        });
+                    };
+                    this.state.pagination.current = data.data.pageNo;
+                    this.state.pagination.total = data.data.totalCount;
+                };
+                this.setState({
+                    dataSource: theArr,
+                    pagination: this.state.pagination
+                });
+            }.bind(this),
+        }).always(function () {
+            this.setState({
+                loading: false
+            });
+        }.bind(this));
+    },
+	getInitialState(){
+		return{
+			releaseDate:[],
+			loading:false,
+			pagination: {
+                defaultCurrent: 1,
+                defaultPageSize: 10,
+                showQuickJumper: true,
+                pageSize: 10,
+                onChange: function (page) {
+                    this.loadData(page,this.satet.callnub);
+                }.bind(this),
+                showTotal: function (total) {
+                    return '共' + total + '条数据';
+                }
+            },
+            columns: [
+                {
+                    title: '营销员',
+                    dataIndex: 'serialNumber',
+                    key: 'serialNumber',
+                }, {
+                    title: '部门',
+                    dataIndex: 'name',
+                    key: 'name',
+                }, {
+                    title: '已发项目介绍资料',
+                    dataIndex: 'keyword',
+                    key: 'keyword',
+                }, {
+                    title: '已约面谈',
+                    dataIndex: 'category',
+                    key: 'category',
+                }, {
+                    title: '已发合同计划书',
+                    dataIndex: 'theName',
+                    key: 'theName',
+                },{
+                    title: '已报价',
+                    dataIndex: 'keyword1',
+                    key: 'keyword1',
+                }, {
+                    title: '已发合同',
+                    dataIndex: 'category2',
+                    key: 'category2',    
+                }, {
+                    title: '已签合同',
+                    dataIndex: 'theName3',
+                    key: 'theName3',
+                }, {
+                    title: '面谈中',
+                    dataIndex: 'category4',
+                    key: 'category4',    
+                }, {
+                    title: '已面签',
+                    dataIndex: 'theName4',
+                    key: 'theName4',
+                }
+            ]
+		}
+	},
+	callback(e){
+		this.setState({
+			callnub:e
+		})
+		this.loadData(1,e)
+	},
+	search() {
+        this.loadData(1,this.state.callnub)
+    },
+    reset() {
+        this.state.releaseDate = [];
+        this.loadData(1,this.state.callnub);
+    },
+    componentWillMount(){
+    	this.loadData();
+    },
+	render(){
+		const { RangePicker } = DatePicker;
+		return <div className="visitContant">
+					<div className="visitTitle">
+						<span className="titleTime">起止时间</span>
+						<RangePicker
+                            value={[this.state.releaseDate[0] ? moment(this.state.releaseDate[0]) : null,
+                            this.state.releaseDate[1] ? moment(this.state.releaseDate[1]) : null]}
+                            onChange={(data, dataString) => { this.setState({ releaseDate: dataString }); }} />
+                        <span style={{marginRight:'15px',marginLeft:'15px'}}>业务类型:</span>
+                        <Select placeholder="服务意向" value={this.state.businessIdS} onChange={(e) => {
+								        this.setState({businessIdS:e})}} style={{width:'150px'}}>
+	                      {
+	                        intentionalService.map(function (item) {
+	                            return <Select.Option key={item.value} >{item.key}</Select.Option>
+	                        })
+	                      }
+                        </Select>    
+                        <Button  onClick={this.search} className="blue" style={{background:'red',color:'#ffffff',border:'none'}}>统计</Button>
+                        <Button  onClick={this.reset} className="green" style={{background:'green',color:'#ffffff',border:'none'}}>重置</Button>
+                        
+						<div className="clearfix" style={{marginTop:'30px',marginLeft:'20px'}}>
+						    <Tabs onChange={this.callback} type="card">
+								 <TabPane tab="本日新增业务意向" key="1"></TabPane>
+							     <TabPane tab="本周新增业务意向" key="2"></TabPane>
+							     <TabPane tab="本月新增业务意向" key="3"></TabPane>
+							     <TabPane tab="本季新增业务意向" key="4"></TabPane>
+							     <TabPane tab="本年新增业务意向" key="5"></TabPane>
+						    </Tabs>
+						</div>
+						<div className="clearfix">
+							<div className="maintitle">业务跟进进度情况统计表</div>
+							<div className="patent-table">
+			                    <Spin spinning={this.state.loading}>
+			                        <Table columns={this.state.columns}
+			                            dataSource={this.state.dataSource}
+			                            pagination={this.state.pagination}
+			                            onRowClick={this.tableRowClick} />
+			                    </Spin>
+			                </div>
+						</div>
+					
+					</div>
+		      </div>
+	}	
+});
+export default FollowStatistics;

+ 21 - 0
js/component/manageCenter/customer/statistics/statistics.less

@@ -0,0 +1,21 @@
+.visitContant {
+    background: #fff;
+    padding: 20px;
+    .blue{
+        width: 100px;
+        margin-left: 15px;
+        margin-right: 15px;
+    };
+    .green{
+        display: inline-block;
+        width: 100px;   
+        color:'#ffffff';
+       
+    };
+    .titleTime{margin-left: 20px;margin-right: 15px;};
+    .ant-tabs.ant-tabs-card > .ant-tabs-bar .ant-tabs-tab{padding: 8px 40px 8px;margin-right: 20px;font-size: 18px;};
+    .maintitle{width: 100%;font-size: 20px;text-align: center;margin-top: 20px;padding-bottom: 20px;}
+    .ant-table-thead > tr > th{background: none;}
+    .ant-tabs-bar{padding-bottom: 14px;}
+    .ant-tabs-nav-container{overflow:inherit;}
+}

+ 180 - 0
js/component/manageCenter/customer/statistics/statusStatistics.jsx

@@ -0,0 +1,180 @@
+import React from 'react';
+import ajax from 'jquery/src/ajax/xhr.js';
+import $ from 'jquery/src/ajax';
+import "./statistics.less"
+import { Button, Select, Table ,Spin, message,Tabs, DatePicker } from 'antd';
+const TabPane = Tabs.TabPane;
+import moment from 'moment';
+import {intentionalService} from '../../../dataDic.js';
+
+const StatusStatistics=React.createClass({
+	loadData(pageNo, nub) {
+        this.state.data = [];
+        this.setState({
+            loading: true
+        });
+        let urls='';
+		switch(nub){
+			case "1":urls="/api/admin/achievement/delete";break;//日
+			case "2":urls="/api/admin/achievement/delete2";break;//周
+			case "3":urls="/api/admin/achievement/delete3";break;//月
+			case "4":urls="/api/admin/achievement/delete4";break;//季
+			case "5":urls="/api/admin/achievement/delete5";break;//年
+		}
+        $.ajax({
+            method: "get",
+            dataType: "json",
+            crossDomain: false,
+            url: globalConfig.context + urls?urls:"/api/admin/achievement/delete",
+            data: {
+                pageNo: pageNo || 1,
+                pageSize: this.state.pagination.pageSize,
+                releaseDateStartDate: this.state.releaseDate[0],
+                releaseDateEndDate: this.state.releaseDate[1],   
+            },
+            success: function (data) {
+                let theArr = [];
+                if (!data.data || !data.data.list) {
+                    if (data.error && data.error.length) {
+                        message.warning(data.error[0].message);
+                    };
+                } else {
+                    for (let i = 0; i < data.data.list.length; i++) {
+                        let thisdata = data.data.list[i];
+                        theArr.push({
+                            key: i,
+                            id: thisdata.id,
+                            serialNumber: thisdata.serialNumber,
+                            
+                        });
+                    };
+                    this.state.pagination.current = data.data.pageNo;
+                    this.state.pagination.total = data.data.totalCount;
+                };
+                this.setState({
+                    dataSource: theArr,
+                    pagination: this.state.pagination
+                });
+            }.bind(this),
+        }).always(function () {
+            this.setState({
+                loading: false
+            });
+        }.bind(this));
+    },
+	getInitialState(){
+		return{
+			releaseDate:[],
+			loading:false,
+			pagination: {
+                defaultCurrent: 1,
+                defaultPageSize: 10,
+                showQuickJumper: true,
+                pageSize: 10,
+                onChange: function (page) {
+                    this.loadData(page,this.satet.callnub);
+                }.bind(this),
+                showTotal: function (total) {
+                    return '共' + total + '条数据';
+                }
+            },
+            columns: [
+                {
+                    title: '营销员',
+                    dataIndex: 'serialNumber',
+                    key: 'serialNumber',
+                }, {
+                    title: '部门',
+                    dataIndex: 'name',
+                    key: 'name',
+                }, {
+                    title: '新客户数',
+                    dataIndex: 'keyword',
+                    key: 'keyword',
+                }, {
+                    title: '意向客户数',
+                    dataIndex: 'category',
+                    key: 'category',
+                }, {
+                    title: '重点客户数',
+                    dataIndex: 'theName',
+                    key: 'theName',
+                },{
+                    title: '面谈客户数',
+                    dataIndex: 'keyword1',
+                    key: 'keyword1',
+                }, {
+                    title: '签单客户数',
+                    dataIndex: 'category2',
+                    key: 'category2',    
+                }, {
+                    title: '被拒绝客户数',
+                    dataIndex: 'theName3',
+                    key: 'theName3',
+                }
+            ]
+		}
+	},
+	callback(e){
+		this.setState({
+			callnub:e
+		})
+		this.loadData(1,e)
+	},
+	search() {
+        this.loadData(1,this.state.callnub)
+    },
+    reset() {
+        this.state.releaseDate = [];
+        this.loadData(1,this.state.callnub);
+    },
+    componentWillMount(){
+    	this.loadData();
+    },
+	render(){
+		const { RangePicker } = DatePicker;
+		return <div className="visitContant">
+					<div className="visitTitle">
+						<span className="titleTime">起止时间</span>
+						<RangePicker
+                            value={[this.state.releaseDate[0] ? moment(this.state.releaseDate[0]) : null,
+                            this.state.releaseDate[1] ? moment(this.state.releaseDate[1]) : null]}
+                            onChange={(data, dataString) => { this.setState({ releaseDate: dataString }); }} />
+                        <span style={{marginRight:'15px',marginLeft:'15px'}}>业务类型:</span>
+                        <Select placeholder="服务意向" value={this.state.businessIdS} onChange={(e) => {
+								        this.setState({businessIdS:e})}} style={{width:'150px'}}>
+	                      {
+	                        intentionalService.map(function (item) {
+	                            return <Select.Option key={item.value} >{item.key}</Select.Option>
+	                        })
+	                      }
+                        </Select>    
+                        <Button  onClick={this.search} className="blue" style={{background:'red',color:'#ffffff',border:'none'}}>统计</Button>
+                        <Button  onClick={this.reset} className="green" style={{background:'green',color:'#ffffff',border:'none'}}>重置</Button>
+                        
+						<div className="clearfix" style={{marginTop:'30px',marginLeft:'20px'}}>
+						    <Tabs onChange={this.callback} type="card">
+								 <TabPane tab="本日新增业务意向" key="1"></TabPane>
+							     <TabPane tab="本周新增业务意向" key="2"></TabPane>
+							     <TabPane tab="本月新增业务意向" key="3"></TabPane>
+							     <TabPane tab="本季新增业务意向" key="4"></TabPane>
+							     <TabPane tab="本年新增业务意向" key="5"></TabPane>
+						    </Tabs>
+						</div>
+						<div className="clearfix">
+							<div className="maintitle">业务客户状态情况统计表</div>
+							<div className="patent-table">
+			                    <Spin spinning={this.state.loading}>
+			                        <Table columns={this.state.columns}
+			                            dataSource={this.state.dataSource}
+			                            pagination={this.state.pagination}
+			                            onRowClick={this.tableRowClick} />
+			                    </Spin>
+			                </div>
+						</div>
+					
+					</div>
+		      </div>
+	}
+});
+export default StatusStatistics;

+ 180 - 0
js/component/manageCenter/customer/statistics/visitStatistics.jsx

@@ -0,0 +1,180 @@
+import React from 'react';
+import ajax from 'jquery/src/ajax/xhr.js';
+import $ from 'jquery/src/ajax';
+import "./statistics.less";
+import { Button, Table ,Spin, message,Tabs, DatePicker, } from 'antd';
+const TabPane = Tabs.TabPane;
+import moment from 'moment';
+
+const VisitStatistics=React.createClass({
+	loadData(pageNo, nub) {
+        this.state.data = [];
+        this.setState({
+            loading: true
+        });
+        let urls='';
+		switch(nub){
+			case "1":urls="/api/admin/achievement/delete";break;//日
+			case "2":urls="/api/admin/achievement/delete2";break;//周
+			case "3":urls="/api/admin/achievement/delete3";break;//月
+			case "4":urls="/api/admin/achievement/delete4";break;//季
+			case "5":urls="/api/admin/achievement/delete5";break;//年
+		}
+        $.ajax({
+            method: "get",
+            dataType: "json",
+            crossDomain: false,
+            url: globalConfig.context + urls?urls:"/api/admin/achievement/delete",
+            data: {
+                pageNo: pageNo || 1,
+                pageSize: this.state.pagination.pageSize,
+                releaseDateStartDate: this.state.releaseDate[0],
+                releaseDateEndDate: this.state.releaseDate[1],   
+            },
+            success: function (data) {
+                let theArr = [];
+                if (!data.data || !data.data.list) {
+                    if (data.error && data.error.length) {
+                        message.warning(data.error[0].message);
+                    };
+                } else {
+                    for (let i = 0; i < data.data.list.length; i++) {
+                        let thisdata = data.data.list[i];
+                        theArr.push({
+                            key: i,
+                            id: thisdata.id,
+                            serialNumber: thisdata.serialNumber,
+                            
+                        });
+                    };
+                    this.state.pagination.current = data.data.pageNo;
+                    this.state.pagination.total = data.data.totalCount;
+                };
+                this.setState({
+                    dataSource: theArr,
+                    pagination: this.state.pagination
+                });
+            }.bind(this),
+        }).always(function () {
+            this.setState({
+                loading: false
+            });
+        }.bind(this));
+    },
+	getInitialState(){
+		return{
+			releaseDate:[],
+			loading:false,
+			pagination: {
+                defaultCurrent: 1,
+                defaultPageSize: 10,
+                showQuickJumper: true,
+                pageSize: 10,
+                onChange: function (page) {
+                    this.loadData(page,this.satet.callnub);
+                }.bind(this),
+                showTotal: function (total) {
+                    return '共' + total + '条数据';
+                }
+            },
+            columns: [
+                {
+                    title: '营销员',
+                    dataIndex: 'serialNumber',
+                    key: 'serialNumber',
+                }, {
+                    title: '部门',
+                    dataIndex: 'name',
+                    key: 'name',
+                }, {
+                    title: '拜访次数',
+                    dataIndex: 'keyword',
+                    key: 'keyword',
+                }, {
+                    title: '拜访客户数',
+                    dataIndex: 'category',
+                    key: 'category',
+                    render: text => { return getAchievementCategory(text); }
+                }, {
+                    title: '电话量',
+                    dataIndex: 'theName',
+                    key: 'theName',
+                },{
+                    title: '外拜量',
+                    dataIndex: 'keyword1',
+                    key: 'keyword1',
+                }, {
+                    title: 'QQ量',
+                    dataIndex: 'category2',
+                    key: 'category2',
+                    render: text => { return getAchievementCategory(text); }
+                }, {
+                    title: '邮件量',
+                    dataIndex: 'theName3',
+                    key: 'theName3',
+                }, {
+                    title: '书信量',
+                    dataIndex: 'theName4',
+                    key: 'theName4',
+                },  {
+                    title: '微信量',
+                    dataIndex: 'theName5',
+                    key: 'theName5',
+                },
+            ]
+		}
+	},
+	callback(e){
+		this.setState({
+			callnub:e
+		})
+		this.loadData(1,e)
+	},
+	search() {
+        this.loadData(1,this.state.callnub)
+    },
+    reset() {
+        this.state.releaseDate = [];
+        this.loadData(1,this.state.callnub);
+    },
+    componentWillMount(){
+    	this.loadData();
+    },
+	render(){
+		const { RangePicker } = DatePicker;
+		return <div className="visitContant">
+					<div className="visitTitle">
+						<span className="titleTime">起止时间</span>
+						<RangePicker
+                            value={[this.state.releaseDate[0] ? moment(this.state.releaseDate[0]) : null,
+                            this.state.releaseDate[1] ? moment(this.state.releaseDate[1]) : null]}
+                            onChange={(data, dataString) => { this.setState({ releaseDate: dataString }); }} />
+                            <Button  onClick={this.search} className="blue" style={{background:'red',color:'#ffffff',border:'none'}}>统计</Button>
+                            <Button  onClick={this.reset} className="green" style={{background:'green',color:'#ffffff',border:'none'}}>重置</Button>   
+						<div className="clearfix" style={{marginTop:'30px',marginLeft:'20px'}}>
+						    <Tabs onChange={this.callback} type="card">
+								 <TabPane tab="本日客户拜访统计" key="1"></TabPane>
+							     <TabPane tab="本周客户拜访统计" key="2"></TabPane>
+							     <TabPane tab="本月客户拜访统计" key="3"></TabPane>
+							     <TabPane tab="本季客户拜访统计" key="4"></TabPane>
+							     <TabPane tab="本年客户拜访统计" key="5"></TabPane>
+						    </Tabs>
+						</div>
+						<div className="clearfix">
+							<div className="maintitle">客户拜访情况统计表</div>
+							<div className="patent-table">
+			                    <Spin spinning={this.state.loading}>
+			                        <Table columns={this.state.columns}
+			                            dataSource={this.state.dataSource}
+			                            pagination={this.state.pagination}
+			                            onRowClick={this.tableRowClick} />
+			                    </Spin>
+			                </div>
+						</div>
+					
+					</div>
+		      </div>
+	}
+})
+
+export default VisitStatistics;