applyPaymentModal.js 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340
  1. import React,{Component} from 'react';
  2. import {Button, Form, Input, message, Modal, Radio, Spin, InputNumber} from "antd";
  3. import propType from 'prop-types';
  4. import $ from "jquery";
  5. const layout = {
  6. labelCol: {
  7. span: 8,
  8. },
  9. wrapperCol: {
  10. span: 16,
  11. },
  12. };
  13. const formItemLayout = {
  14. labelCol: { span: 8 },
  15. wrapperCol: { span: 14 },
  16. };
  17. class ApplyPaymentModal extends Component{
  18. // static propTypes = {
  19. // visible: PropTypes.bool.isRequired,
  20. // changeVisible: PropTypes.func.isRequired,
  21. // }
  22. //
  23. // static defaultProps = {
  24. // visible: false,
  25. // changeVisible: ()=>{},
  26. // }
  27. constructor(props) {
  28. super(props);
  29. this.state={
  30. loading: false,
  31. paymentStatus: 0,
  32. totalPrice: -1,
  33. }
  34. }
  35. //申请付款
  36. handleSubmit(e){
  37. e.preventDefault();
  38. this.props.form.validateFieldsAndScroll((err, values) => {
  39. if (err) {
  40. return;
  41. }
  42. this.setState({
  43. loading: true
  44. })
  45. values.tid = this.props.tid;
  46. if(this.props.previewPayInfor.nodeId){ //催款
  47. values.nodeId = this.props.previewPayInfor.nodeId;
  48. values.chooseType = 1; //支付选择 0第三方 1催款 2官费
  49. values.tpcId = this.props.previewPayInfor.cid; //第三方机构id
  50. }else{
  51. values.chooseType = 0 //支付选择 0第三方 1催款 2官费
  52. values.tpcId = this.props.previewPayInfor.id; //第三方机构id
  53. }
  54. if(this.props.type === 2){
  55. values.chooseType = 2; //支付类型 0第三方 1催款 2官费
  56. }
  57. values.companyName = values.companyName.split('-')[0];
  58. $.ajax({
  59. method: 'POST',
  60. dataType: 'json',
  61. crossDomain: false,
  62. url: globalConfig.context + '/api/admin/company/addOrderPayment',
  63. data: values,
  64. }).done(
  65. function (data) {
  66. this.setState({
  67. loading: false,
  68. })
  69. if (!data.error.length) {
  70. this.props.changeVisible();
  71. this.props.onRefresh();
  72. message.success('申请成功!')
  73. } else {
  74. message.warning(data.error[0].message)
  75. }
  76. }.bind(this)
  77. )
  78. })
  79. }
  80. render() {
  81. const { getFieldDecorator,setFieldsValue } = this.props.form;
  82. const { previewPayInfor } = this.props;
  83. if(!previewPayInfor){
  84. return;
  85. }
  86. return(
  87. <Modal
  88. maskClosable={false}
  89. footer={null}
  90. visible={this.props.visible}
  91. onCancel={() => {
  92. this.props.changeVisible();
  93. }}
  94. >
  95. <Spin spinning={this.state.loading}>
  96. <div>
  97. <div>
  98. {
  99. this.props.type === 2 ? "支付供应商官费" : "支付供应商费用"
  100. }
  101. </div>
  102. <Form
  103. {...layout}
  104. name="basic"
  105. initialValues={{
  106. remember: true,
  107. }}
  108. onSubmit={(e)=>{
  109. this.handleSubmit(e)
  110. }}
  111. >
  112. <Form.Item
  113. {...formItemLayout}
  114. style={{
  115. display:'flex'
  116. }}
  117. label="付款单位/个人:"
  118. >
  119. {getFieldDecorator('companyName', {
  120. initialValue: previewPayInfor.companyName,
  121. rules: [{
  122. required: false,
  123. message: '请输入付款单位/个人!',
  124. }],
  125. })(
  126. <Input
  127. style={{ width: '200px' }}
  128. placeholder="请输入付款单位/个人"
  129. />
  130. )}
  131. </Form.Item>
  132. {/* 0正常 1专利 2软著 3审计 */}
  133. {this.props.projectType === 1 && this.props.patentType === 1 ?<Form.Item
  134. {...formItemLayout}
  135. style={{
  136. display:'flex'
  137. }}
  138. label="支付状态:"
  139. >
  140. {getFieldDecorator('paymentStatus', {
  141. constructor: this.state.paymentStatus,
  142. rules: [{ required: false, message: '请选择支付状态!' }],
  143. })(
  144. <Radio.Group onChange={(e)=>{
  145. this.setState({
  146. paymentStatus: e.target.value
  147. })
  148. if(e.target.value === 1){
  149. setFieldsValue({
  150. quantity:parseInt(previewPayInfor.quantity),
  151. applicationAmount:(previewPayInfor.partyAmount ?
  152. parseFloat(previewPayInfor.totalAmount) - parseFloat(previewPayInfor.partyAmount) :
  153. parseFloat(previewPayInfor.totalAmount))/2
  154. });
  155. } else if(e.target.value === 2){
  156. setFieldsValue({
  157. quantity:parseInt(previewPayInfor.quantity),
  158. applicationAmount:(previewPayInfor.partyAmount ?
  159. parseFloat(previewPayInfor.totalAmount) - parseFloat(previewPayInfor.partyAmount) :
  160. parseFloat(previewPayInfor.totalAmount))
  161. });
  162. }
  163. }}>
  164. <Radio value={0}>自定义</Radio>
  165. <Radio value={1}>半款</Radio>
  166. <Radio value={2}>全款</Radio>
  167. </Radio.Group>
  168. )}
  169. </Form.Item> : <div/>}
  170. {this.props.type !== 2 ? <Form.Item
  171. {...formItemLayout}
  172. style={{
  173. display:'flex'
  174. }}
  175. label="单价(万元):"
  176. >
  177. {/*可以查看单价 正常 审计 专利买卖
  178. 软著 专利申请 打星号 */}
  179. {
  180. this.props.projectType === 2 || (this.props.projectType === 1 && this.props.patentType === 0)?
  181. '***' :
  182. getFieldDecorator('unitPrice', {
  183. initialValue:previewPayInfor.unitPrice,
  184. rules: [{ required: true, message: '请输入单价!' }],
  185. })(
  186. <Input disabled={true} style={{ width: '200px' }} placeholder="请输入单价" type={'number'}/>
  187. )
  188. }
  189. </Form.Item> : <div/>}
  190. {
  191. this.props.type === 2 ?
  192. <Form.Item
  193. {...formItemLayout}
  194. style={{
  195. display:'flex'
  196. }}
  197. label="官费(万元):"
  198. >
  199. <div>***</div>
  200. </Form.Item> : <div/>
  201. }
  202. {/* 0正常 1专利 2软著 3审计 */}
  203. {
  204. this.props.projectType === 1 || this.props.projectType === 2?
  205. <Form.Item
  206. {...formItemLayout}
  207. style={{
  208. display:'flex'
  209. }}
  210. label="数量(个):"
  211. >
  212. {previewPayInfor.quantity}
  213. </Form.Item>:
  214. <Form.Item
  215. {...formItemLayout}
  216. style={{
  217. display:'flex'
  218. }}
  219. label="数量(个):"
  220. >
  221. {getFieldDecorator('quantity', {
  222. initialValue: parseInt(previewPayInfor.quantity),
  223. rules: [{ required: false, message: '请输入數量!' }],
  224. })(
  225. <InputNumber min={0} onChange={(e)=>{
  226. //软著 专利申请不需要计算,因为单价未知
  227. if(!(this.props.projectType === 2 || (this.props.projectType === 1 && this.props.patentType === 0))){
  228. let num = previewPayInfor.unitPrice * e;
  229. this.setState({
  230. totalPrice: num
  231. })
  232. }
  233. }} disabled={previewPayInfor.quantity <= 1 || this.props.projectType === 3} style={{ width: '200px' }} placeholder="请输入數量" type={'number'}/>
  234. )}
  235. </Form.Item>
  236. }
  237. <Form.Item
  238. {...formItemLayout}
  239. style={{
  240. display:'flex'
  241. }}
  242. label="总价(万元):"
  243. >
  244. <div>{this.state.totalPrice > -1 ? this.state.totalPrice : previewPayInfor.totalAmount}</div>
  245. {/*{getFieldDecorator('totalPrice', {*/}
  246. {/* rules: [{ required: false, message: '请输入总价!' }],*/}
  247. {/*})(*/}
  248. {/* <Input disabled={true} style={{ width: '200px' }} placeholder="请输入总价" type={'number'}/>*/}
  249. {/*)}*/}
  250. </Form.Item>
  251. {/*<Form.Item*/}
  252. {/* {...formItemLayout}*/}
  253. {/* style={{*/}
  254. {/* display:'flex'*/}
  255. {/* }}*/}
  256. {/* label="已付(万元):"*/}
  257. {/*>*/}
  258. {/* {getFieldDecorator('totalPrice', {*/}
  259. {/* initialValue: previewPayInfor.partyAmount ? parseFloat(previewPayInfor.partyAmount) : 0,*/}
  260. {/* rules: [{ required: false, message: '请输入已付金额!' }],*/}
  261. {/* })(*/}
  262. {/* <Input disabled={true} style={{ width: '200px' }} placeholder="请输入已付金额" type={'number'}/>*/}
  263. {/* )}*/}
  264. {/*</Form.Item>*/}
  265. {
  266. this.props.projectType === 1 || this.props.projectType === 2 || this.props.type === 2?
  267. <Form.Item
  268. {...formItemLayout}
  269. style={{
  270. display:'flex'
  271. }}
  272. label="本次申请支付数量:"
  273. >
  274. {getFieldDecorator('quantity', {
  275. initialValue: 1,
  276. rules: [{ required: false, message: '请输入本次申请支付数量!' }],
  277. })(
  278. <Input disabled={previewPayInfor.quantity <= 1 || this.state.paymentStatus !== 0} style={{ width: '200px' }} placeholder="请输入本次申请支付数量" type={'number'}/>
  279. )}
  280. </Form.Item> : <div/>}
  281. <Form.Item
  282. {...formItemLayout}
  283. style={{
  284. display:'flex'
  285. }}
  286. label="本次申请支付金额(万元):"
  287. >
  288. {getFieldDecorator('applicationAmount', {
  289. initialValue:this.state.paymentStatus === 1 ? (previewPayInfor.partyAmount ?
  290. parseFloat(previewPayInfor.totalAmount) - parseFloat(previewPayInfor.partyAmount) :
  291. parseFloat(previewPayInfor.totalAmount)) / 2 : previewPayInfor.partyAmount ?
  292. parseFloat(previewPayInfor.totalAmount) - parseFloat(previewPayInfor.partyAmount) :
  293. parseFloat(previewPayInfor.totalAmount)
  294. ,
  295. rules: [{ required: true, message: '请输入本次申请支付金额!' }],
  296. })(
  297. <Input disabled={this.state.paymentStatus !== 0} style={{ width: '200px' }} placeholder="请输入本次申请支付金额" type={'number'}/>
  298. )}
  299. </Form.Item>
  300. <Form.Item
  301. {...formItemLayout}
  302. style={{
  303. display:'flex'
  304. }}
  305. label="备注:"
  306. >
  307. {getFieldDecorator('remarks', {
  308. rules: [{ required: true, message: '请输入备注!' }],
  309. })(
  310. <Input style={{ width: '200px' }} placeholder="请输入备注" type={'textarea'}/>
  311. )}
  312. </Form.Item>
  313. <Form.Item>
  314. <div style={{
  315. display: 'flex',
  316. justifyContent: 'center',
  317. }}>
  318. <Button type="primary" htmlType="submit" style={{width:'60%',height:'40px'}}>
  319. {this.props.type === 2 ? "确定申请付官费" : "确定申请支付"}
  320. </Button>
  321. </div>
  322. </Form.Item>
  323. </Form>
  324. </div>
  325. </Spin>
  326. </Modal>
  327. )
  328. }
  329. }
  330. const WrappedNormalLoginForm = Form.create()(ApplyPaymentModal);
  331. export default WrappedNormalLoginForm