followStatistics.jsx 8.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285
  1. import React from 'react';
  2. import ajax from 'jquery/src/ajax/xhr.js';
  3. import $ from 'jquery/src/ajax';
  4. import "./statistics.less";
  5. import { Button, Select, Table, Spin, message, Tabs, DatePicker } from 'antd';
  6. const TabPane = Tabs.TabPane;
  7. import moment from 'moment';
  8. import { intentionalService,newFollow } from '../../../dataDic.js';
  9. const FollowStatistics = React.createClass({
  10. loadData(pageNo, nub) {
  11. this.state.data = [];
  12. this.setState({
  13. loading: true
  14. });
  15. let urls = '';
  16. switch(nub) {
  17. case "1":
  18. urls = "";
  19. break; //日
  20. case "2":
  21. urls = "daySpan";
  22. break; //日
  23. case "3":
  24. urls = "weekSpan";
  25. break; //周
  26. case "4":
  27. urls = "monthSpan";
  28. break; //月
  29. case "5":
  30. urls = "quarterSpan";
  31. break; //季
  32. case "6":
  33. urls = "yearSpan";
  34. break; //年
  35. default:
  36. urls ='';
  37. }
  38. $.ajax({
  39. method: "get",
  40. dataType: "json",
  41. crossDomain: false,
  42. url: globalConfig.context + "/api/admin/customer/businessStatistic",
  43. data: {
  44. pageNo: pageNo || 1,
  45. pageSize: this.state.pagination.pageSize,
  46. startDate: this.state.releaseDate[0],
  47. endDate: this.state.releaseDate[1],
  48. timeSpan:this.state.releaseDate[0]?'':urls,
  49. depId:this.state.depId,
  50. businessGlossoryId:this.state.followSearch,
  51. depNo:this.state.departmentt
  52. },
  53. success: function(data) {
  54. let theArr = [];
  55. if(!data.data || !data.data.list) {
  56. if(data.error && data.error.length) {
  57. message.warning(data.error[0].message);
  58. };
  59. } else {
  60. for(let i = 0; i < data.data.list.length; i++) {
  61. let thisdata = data.data.list[i];
  62. theArr.push({
  63. key: i,
  64. id: thisdata.id,
  65. adminName: thisdata.adminName,
  66. departmentName: thisdata.departmentName,
  67. sendMaterialNo: thisdata.sendMaterialNo,
  68. interviewNo: thisdata.interviewNo,
  69. sendProspectusNo: thisdata.sendProspectusNo,
  70. quoteNo: thisdata.quoteNo,
  71. sendContractNo: thisdata.sendContractNo ,
  72. signContractNo: thisdata.signContractNo,
  73. onVisaNo: thisdata.onVisaNo,
  74. visaNo: thisdata.visaNo,
  75. });
  76. };
  77. this.state.pagination.current = data.data.pageNo;
  78. this.state.pagination.total = data.data.totalCount;
  79. };
  80. if(!data.data.list.length){
  81. this.state.pagination.current=0;
  82. this.state.pagination.total=0;
  83. }
  84. this.setState({
  85. dataSource: theArr,
  86. pagination: this.state.pagination,
  87. });
  88. }.bind(this),
  89. }).always(function() {
  90. this.setState({
  91. loading: false
  92. });
  93. }.bind(this));
  94. },
  95. getInitialState() {
  96. return {
  97. releaseDate: [],
  98. loading: false,
  99. callnub:'1',
  100. pagination: {
  101. defaultCurrent: 1,
  102. defaultPageSize: 10,
  103. showQuickJumper: true,
  104. pageSize: 10,
  105. onChange: function(page) {
  106. this.call(page)
  107. }.bind(this),
  108. showTotal: function(total) {
  109. return '共' + total + '条数据';
  110. }
  111. },
  112. columns: [{
  113. title: '营销员',
  114. dataIndex: 'adminName',
  115. key: 'adminName',
  116. }, {
  117. title: '部门',
  118. dataIndex: 'departmentName',
  119. key: 'departmentName',
  120. }, {
  121. title: '已发项目介绍资料',
  122. dataIndex: 'sendMaterialNo',
  123. key: 'sendMaterialNo',
  124. }, {
  125. title: '已约面谈',
  126. dataIndex: 'interviewNo',
  127. key: 'interviewNo',
  128. }, {
  129. title: '已发合同计划书',
  130. dataIndex: 'sendProspectusNo',
  131. key: 'sendProspectusNo',
  132. }, {
  133. title: '已报价',
  134. dataIndex: 'quoteNo',
  135. key: 'quoteNo',
  136. }, {
  137. title: '已发合同',
  138. dataIndex: 'sendContractNo',
  139. key: 'sendContractNo',
  140. }, {
  141. title: '已签合同',
  142. dataIndex: 'signContractNo',
  143. key: 'signContractNo',
  144. }, {
  145. title: '面谈中',
  146. dataIndex: 'onVisaNo',
  147. key: 'onVisaNo',
  148. }, {
  149. title: '已面签',
  150. dataIndex: 'visaNo',
  151. key: 'visaNo',
  152. }]
  153. }
  154. },
  155. //部门
  156. departmentList() {
  157. this.setState({
  158. loading: true
  159. });
  160. $.ajax({
  161. method: "get",
  162. dataType: "json",
  163. crossDomain: false,
  164. url: globalConfig.context + "/api/admin/organization/selectSuperId",
  165. data: {
  166. },
  167. success: function(data) {
  168. let thedata = data.data;
  169. let theArr=[];
  170. if(!thedata) {
  171. if(data.error && data.error.length) {
  172. message.warning(data.error[0].message);
  173. };
  174. thedata = {};
  175. }else{
  176. thedata.map(function(item,index){
  177. theArr.push({
  178. key:index,
  179. name:item.name,
  180. id:item.id,
  181. depNo:item.depNo
  182. })
  183. })
  184. }
  185. this.setState({
  186. departmentArr:theArr,
  187. })
  188. }.bind(this),
  189. }).always(function() {
  190. this.setState({
  191. loading: false
  192. });
  193. }.bind(this));
  194. },
  195. callback(e) {
  196. this.setState({
  197. callnub: e,
  198. releaseDate:[]
  199. })
  200. this.loadData(1, e)
  201. },
  202. call(a){
  203. this.loadData(a, this.state.callnub)
  204. },
  205. search() {
  206. if(this.state.releaseDate[0]){
  207. this.setState({
  208. callnub:'1'
  209. })
  210. }else{
  211. this.state.releaseDate=[]
  212. }
  213. this.loadData(1, this.state.callnub)
  214. },
  215. reset() {
  216. this.state.departmentt=undefined;
  217. this.state.releaseDate = [];
  218. this.state.followSearch=undefined;
  219. this.loadData(1, this.state.callnub);
  220. },
  221. componentWillMount() {
  222. this.loadData();
  223. this.departmentList()
  224. },
  225. render() {
  226. const { RangePicker } = DatePicker;
  227. let departmentArr = this.state.departmentArr || [];
  228. return <div className="visitContant">
  229. <div className="visitTitle">
  230. <span className="titleTime">起止时间</span>
  231. <RangePicker
  232. value={[this.state.releaseDate[0] ? moment(this.state.releaseDate[0]) : null,
  233. this.state.releaseDate[1] ? moment(this.state.releaseDate[1]) : null]}
  234. onChange={(data, dataString) => { this.setState({ releaseDate: dataString }); }} />
  235. <span style={{marginRight:'15px',marginLeft:'15px'}}>业务类型:</span>
  236. <Select placeholder="业务类型" value={this.state.followSearch} onChange={(e) => {
  237. this.setState({followSearch:e})}} style={{width:'150px'}}>
  238. {
  239. intentionalService.map(function (item) {
  240. return <Select.Option key={item.value} >{item.key}</Select.Option>
  241. })
  242. }
  243. </Select>
  244. <span style={{marginRight:'15px',marginLeft:'15px'}}>部门:</span>
  245. <Select placeholder="选择部门" style={{width:'150px'}}
  246. value={this.state.departmentt}
  247. onChange={(e) => { this.setState({ departmentt: e }) }}>
  248. {
  249. departmentArr.map(function (item) {
  250. return <Select.Option key={item.depNo} >{item.name}</Select.Option>
  251. })
  252. }
  253. </Select>
  254. <Button onClick={this.search} className="blue" style={{background:'red',color:'#ffffff',border:'none'}}>统计</Button>
  255. <Button onClick={this.reset} className="green" style={{background:'green',color:'#ffffff',border:'none'}}>重置</Button>
  256. <div className="clearfix" style={{marginTop:'30px',marginLeft:'20px'}}>
  257. <Tabs onChange={this.callback} type="card" activeKey={this.state.callnub}>
  258. <TabPane tab="所有业务跟进进度" key="1"></TabPane>
  259. <TabPane tab="本日业务跟进进度" key="2"></TabPane>
  260. <TabPane tab="本周业务跟进进度" key="3"></TabPane>
  261. <TabPane tab="本月业务跟进进度" key="4"></TabPane>
  262. <TabPane tab="本季业务跟进进度" key="5"></TabPane>
  263. <TabPane tab="本年业务跟进进度" key="6"></TabPane>
  264. </Tabs>
  265. </div>
  266. <div className="clearfix">
  267. <div className="maintitle">业务跟进进度情况统计表</div>
  268. <div className="patent-table">
  269. <Spin spinning={this.state.loading}>
  270. <Table columns={this.state.columns}
  271. dataSource={this.state.dataSource}
  272. pagination={this.state.pagination}
  273. onRowClick={this.tableRowClick} />
  274. </Spin>
  275. </div>
  276. </div>
  277. </div>
  278. </div>
  279. }
  280. });
  281. export default FollowStatistics;