detailedList.jsx 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332
  1. import React,{ Component } from 'react';
  2. import {
  3. Modal,
  4. Tooltip,
  5. } from "antd";
  6. import './index.less';
  7. import TabelContent from "../../../../common/tabelContent";
  8. import {
  9. getLiquidationStatus,
  10. getNewOrderStatus,
  11. getProjectName
  12. } from "../../../../tools";
  13. class DetailedList extends Component{
  14. constructor(props) {
  15. super(props);
  16. this.state= {
  17. columns: [
  18. {
  19. title: "编号",
  20. dataIndex: "key",
  21. key: "key",
  22. width: 120,
  23. },
  24. {
  25. title: "催收省份",
  26. dataIndex: "provinceName",
  27. key: "provinceName",
  28. width: 320,
  29. },
  30. {
  31. title: "催款人",
  32. dataIndex: "aName",
  33. key: "aName",
  34. width: 220,
  35. },
  36. {
  37. title: "签单额(万元)",
  38. dataIndex: "totalAmount",
  39. key: "totalAmount",
  40. className: 'projectTable',
  41. width: 150,
  42. onCellClick: (record, event) => {
  43. event.stopPropagation();
  44. this.setState({
  45. visible1: true,
  46. aid: record.aid
  47. })
  48. },
  49. },
  50. {
  51. title: "应收款(万元)",
  52. dataIndex: "money",
  53. key: "money",
  54. className: 'projectTable',
  55. width: 150,
  56. onCellClick: (record, event) => {
  57. event.stopPropagation();
  58. this.setState({
  59. visible1: true,
  60. aid: record.aid
  61. })
  62. },
  63. },
  64. ],
  65. columns1: [
  66. {
  67. title: "序号",
  68. dataIndex: "key",
  69. key: "key"
  70. },
  71. {
  72. title: "合同编号",
  73. dataIndex: "contractNo",
  74. key: "contractNo"
  75. },
  76. {
  77. title: "订单编号",
  78. dataIndex: "orderNo",
  79. key: "orderNo"
  80. },
  81. {
  82. title: "客户名称",
  83. dataIndex: "userName",
  84. key: "userName",
  85. render: text => {
  86. return (
  87. <Tooltip title={text}>
  88. <div style={{
  89. maxWidth:'150px',
  90. overflow:'hidden',
  91. textOverflow: "ellipsis",
  92. whiteSpace:'nowrap',
  93. }}>{text}</div>
  94. </Tooltip>
  95. )
  96. }
  97. },
  98. {
  99. title: "订单负责人",
  100. dataIndex: "salesmanName",
  101. key: "salesmanName"
  102. },
  103. {
  104. title: "订单部门",
  105. dataIndex: "depName",
  106. key: "depName"
  107. },
  108. {
  109. title: "订单状态",
  110. dataIndex: "orderStatus",
  111. key: "orderStatus",
  112. render: text => {
  113. return getNewOrderStatus(text);
  114. }
  115. },
  116. {
  117. title: "项目状态",
  118. dataIndex: "projectStatus",
  119. key: "projectStatus",
  120. render: text => {
  121. return getProjectName(text);
  122. }
  123. },
  124. {
  125. title: "签单金额(万元)",
  126. dataIndex: "totalAmount",
  127. key: "totalAmount"
  128. },
  129. {
  130. title: "已收款(万元)",
  131. dataIndex: "settlementAmount",
  132. key: "settlementAmount"
  133. },
  134. {
  135. title: "未收款(万元)",
  136. dataIndex: "uncollectedAmount",
  137. key: "uncollectedAmount"
  138. },
  139. {
  140. title: "结算状态",
  141. dataIndex: "liquidationStatus",
  142. key: "liquidationStatus",
  143. render: text => {
  144. return getLiquidationStatus(text);
  145. }
  146. },
  147. {
  148. title: "催收科目",
  149. dataIndex: "dunSubject",
  150. key: "dunSubject"
  151. },
  152. {
  153. title: "应收款(万元)",
  154. dataIndex: "accountsReceivable",
  155. key: "accountsReceivable"
  156. },
  157. {
  158. title: "催款状态",
  159. dataIndex: "dunStatus",
  160. key: "dunStatus"
  161. },
  162. {
  163. title: "催款启动日期",
  164. dataIndex: "startDate",
  165. key: "startDate"
  166. },
  167. {
  168. title: "签单时间",
  169. dataIndex: "signDate",
  170. key: "signDate"
  171. }
  172. ],
  173. searchList:[
  174. {
  175. type:'departmentSelect',
  176. dataKey:'depId',
  177. placeholder:'请选择部门'
  178. },
  179. {
  180. type:'text',
  181. placeholder:'请输入催款人',
  182. dataKey:'aName',
  183. },
  184. {
  185. type:'select',
  186. dataKey:'sort',
  187. placeholder:'请选择排序',
  188. selectList:[
  189. {
  190. value:'0',
  191. label:'按总金额排序'
  192. },
  193. {
  194. value:'1',
  195. label:'按数量排序'
  196. },
  197. ]
  198. },
  199. {
  200. type:'times',
  201. title:'催收时间',
  202. dataKey:['startDate','endDate'],
  203. },
  204. ],
  205. searchList1:[
  206. {
  207. type:'text',
  208. dataKey:'name',
  209. placeholder:'请输入客户名称',
  210. },
  211. {
  212. type:'text',
  213. dataKey:'adminName',
  214. placeholder:'请输入营销员名称'
  215. },
  216. {
  217. type:'text',
  218. dataKey:'orderNo',
  219. placeholder:'请输入订单编号'
  220. },
  221. {
  222. type:'text',
  223. dataKey:'contractNo',
  224. placeholder:'请输入合同编号'
  225. },
  226. {
  227. type:'departmentSelect',
  228. dataKey:'depId',
  229. placeholder:'请选择订单部门'
  230. },
  231. {
  232. type:'times',
  233. title:'下单时间',
  234. dataKey:['starTime','endTime'],
  235. },
  236. ],
  237. searchConfig:{},
  238. }
  239. }
  240. render() {
  241. return (
  242. <div>
  243. <Modal
  244. maskClosable={false}
  245. visible={this.props.visible}
  246. onOk={this.props.onCancel}
  247. onCancel={this.props.onCancel}
  248. width='1200px'
  249. title={this.props.recordInfor.provinceName + '签单统计表'}
  250. footer=''
  251. className="admin-desc-content">
  252. <div className="user-content">
  253. <TabelContent
  254. scroll={{ x: 0, y: 200}}
  255. searchList={this.state.searchList}
  256. columns={this.state.columns}
  257. searchConfig={this.props.searchConfig}
  258. searchOperation={(value)=>{
  259. for(let i of Object.keys(value)){
  260. if(i === 'sort' || i === 'pageNo' || i === 'pageSize'){
  261. delete value[i]
  262. }
  263. }
  264. this.setState({searchConfig:value})}
  265. }
  266. tabelApi={'/api/admin/newOrderDun/selectOrderDun'}
  267. exportApi={'/api/admin/newOrderDun/selectOrderDunExprot'}
  268. query={{
  269. province:this.props.recordInfor.province,
  270. }}
  271. dataProcessing={(data)=>{
  272. let theArr = [];
  273. for (let i = 0; i < data.data.length; i++) {
  274. let thisdata = data.data[i];
  275. thisdata.key=i + 1;
  276. theArr.push(thisdata);
  277. }
  278. return theArr;
  279. }}
  280. />
  281. </div>
  282. {this.state.visible1 && <Modal
  283. maskClosable={false}
  284. visible={this.state.visible1}
  285. onOk={()=>{
  286. this.setState({
  287. visible1:false
  288. })
  289. }}
  290. onCancel={()=>{
  291. this.setState({
  292. visible1:false
  293. })
  294. }}
  295. width='1600px'
  296. title='欠款催收列表'
  297. footer=''
  298. className="admin-desc-content">
  299. <div className="user-content">
  300. <TabelContent
  301. searchList={this.state.searchList1}
  302. columns={this.state.columns1}
  303. tabelApi={'/api/admin/newOrder/dunOrderNewList'}
  304. searchConfig={this.state.searchConfig}
  305. query={{
  306. specially:1,
  307. newStatus:1,
  308. aid:this.state.aid
  309. }}
  310. dataProcessing={(data)=>{
  311. let theArr = [];
  312. for (let i = 0; i < data.data.list.length; i++) {
  313. let thisdata = data.data.list[i];
  314. thisdata.key=(data.data.pageNo - 1) * data.data.pageSize + i + 1;
  315. theArr.push(thisdata);
  316. }
  317. return theArr;
  318. }}
  319. />
  320. </div>
  321. </Modal>}
  322. </Modal>
  323. </div>
  324. )
  325. }
  326. }
  327. export default DetailedList;