applyAdd.jsx 9.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242
  1. import React from 'react';
  2. import { Button, Input, Select, message, Modal, Checkbox, Radio } from 'antd';
  3. import { companySearch } from '../../../tools.js';
  4. import ajax from 'jquery/src/ajax/xhr.js';
  5. import $ from 'jquery/src/ajax';
  6. const ApplyAdd = React.createClass({
  7. getInitialState() {
  8. return {
  9. visible: false,
  10. loading: false
  11. };
  12. },
  13. getContactsList(theUid) {
  14. $.ajax({
  15. method: "get",
  16. dataType: "json",
  17. crossDomain: false,
  18. url: globalConfig.context + "/api/admin/getContacts",
  19. data: { "uid": theUid },
  20. success: function (data) {
  21. let theOption = [];
  22. if (data.error.length || !data.data) {
  23. return;
  24. };
  25. for (let item in data.data) {
  26. let theData = data.data[item];
  27. theOption.push(
  28. <Select.Option value={item} key={item}>{theData}</Select.Option>
  29. );
  30. };
  31. this.setState({
  32. contactsOption: theOption
  33. });
  34. }.bind(this),
  35. });
  36. },
  37. getDepartmentList(id) {
  38. $.ajax({
  39. method: "get",
  40. dataType: "json",
  41. crossDomain: false,
  42. url: globalConfig.context + "/api/admin/techproject/getDepartment",
  43. data: { "uid": id || this.props.data.uid },
  44. success: function (data) {
  45. let theOption = [];
  46. if (!data.data) {
  47. if (data.error && data.error.length) {
  48. message.warning(data.error[0].message);
  49. };
  50. return;
  51. };
  52. for (let item in data.data) {
  53. let theData = data.data[item];
  54. theOption.push(
  55. <Select.Option value={item} key={item}>{theData}</Select.Option>
  56. );
  57. };
  58. this.setState({
  59. departmentOption: theOption,
  60. });
  61. }.bind(this),
  62. });
  63. },
  64. componentWillReceiveProps(nextProps) {
  65. this.state.visible = nextProps.showAdd
  66. },
  67. showModal() {
  68. this.setState({
  69. visible: true,
  70. });
  71. },
  72. handleOk() {
  73. this.setState({
  74. loading: true
  75. });
  76. if (!this.state.uid) {
  77. message.warning('请选择公司!');
  78. this.setState({
  79. loading: false
  80. });
  81. return;
  82. }
  83. if (!this.state.contacts) {
  84. message.warning('请选择一个联系人!');
  85. this.setState({
  86. loading: false
  87. });
  88. return;
  89. };
  90. $.ajax({
  91. method: "POST",
  92. dataType: "json",
  93. crossDomain: false,
  94. url: globalConfig.context + "/api/admin/techproject/applyTechProject",
  95. data: {
  96. uid: this.state.uid,
  97. contacts: this.state.contacts,
  98. department: this.state.department,
  99. dispatchInfo: this.state.dispatchInfo,
  100. projectName: this.state.projectName,
  101. projectCatagory: this.state.projectCatagory,
  102. techField: this.state.techField,
  103. projectDes: this.state.projectDes,
  104. projectMode: this.state.projectMode,
  105. projectApproval: this.state.projectApproval,
  106. subsidy: this.state.subsidy,
  107. consultant: this.state.consultant,
  108. }
  109. }).done(function (data) {
  110. if (!data.error.length) {
  111. message.success('保存成功!');
  112. this.setState({
  113. visible: false
  114. });
  115. this.props.closeAdd(false);
  116. } else {
  117. message.warning(data.error[0].message);
  118. this.setState({
  119. loading: false
  120. });
  121. }
  122. }.bind(this));
  123. },
  124. handleCancel(e) {
  125. this.setState({
  126. visible: false,
  127. });
  128. this.props.closeAdd(false);
  129. },
  130. spinChange(e) {
  131. this.setState({
  132. loading: e
  133. });
  134. },
  135. subsidyCheck(e) {
  136. if (e.target.value == 1) {
  137. this.state.subsidy = 1;
  138. } else if (e.target.value == 2) {
  139. this.state.projectMode = 1;
  140. };
  141. this.setState({
  142. moneyType: e.target.value
  143. });
  144. },
  145. render() {
  146. return (
  147. <div className="cognizance-add">
  148. <Modal title="新科技项目申请" visible={this.state.visible}
  149. onOk={this.handleOk} onCancel={this.handleCancel}
  150. width='800px'
  151. footer={[
  152. <Button key="submit" type="primary" loading={this.state.loading} onClick={this.handleOk}>
  153. 确认
  154. </Button>,
  155. <Button key="back" onClick={this.handleCancel}>
  156. 取消
  157. </Button>,
  158. ]}
  159. >
  160. <div className="clearfix" style={{ marginBottom: '10px' }}>
  161. <div className="half-item">
  162. <span className="item-title">选择公司: </span>
  163. <Select
  164. placeholder="请选择公司"
  165. style={{ width: 260 }}
  166. showSearch
  167. filterOption={companySearch}
  168. onSelect={(e, n) => { this.state.uid = e; this.getContactsList(e); this.getDepartmentList(e); }}>
  169. {this.props.companyAddOption}
  170. </Select>
  171. </div>
  172. <div className="half-item">
  173. <span className="item-title">选择联系人: </span>
  174. <Select placeholder="请选择联系人" style={{ width: 200 }}
  175. onSelect={(e, n) => { this.state.contacts = e }}>
  176. {this.state.contactsOption}
  177. </Select>
  178. </div>
  179. </div>
  180. <div className="clearfix">
  181. <div className="half-item">
  182. <span className="item-title">申报科技部门: </span>
  183. <Select
  184. placeholder="请填写申报部门"
  185. style={{ width: 260 }}
  186. onChange={(e) => { this.state.department = e; }}>
  187. {this.state.departmentOption}
  188. </Select>
  189. </div>
  190. </div>
  191. <div className="clearfix">
  192. <div>
  193. <span className="item-title">派单信息: </span>
  194. </div>
  195. <Input type="textarea" rows={6} onChange={(e) => { this.state.dispatchInfo = e.target.value; }} />
  196. </div>
  197. <div className="clearfix">
  198. <div className="half-item">
  199. <span className="item-title">项目名称: </span>
  200. <Input style={{ width: 200 }} onChange={(e) => { this.state.projectName = e.target.value; }} />
  201. </div>
  202. </div>
  203. <div className="clearfix">
  204. <div className="half-item">
  205. <span className="item-title">项目类型: </span>
  206. <Input style={{ width: 200 }} onChange={(e) => { this.state.projectCatagory = e.target.value; }} />
  207. </div>
  208. </div>
  209. <div className="clearfix">
  210. <div className="half-item">
  211. <span className="item-title">技术领域: </span>
  212. <Input style={{ width: 200 }} onChange={(e) => { this.state.techField = e.target.value; }} />
  213. </div>
  214. </div>
  215. <div className="clearfix">
  216. <div>
  217. <span className="item-title">项目介绍: </span>
  218. </div>
  219. <Input type="textarea" rows={6} onChange={(e) => { this.state.projectDes = e.target.value; }} />
  220. </div>
  221. <div className="clearfix">
  222. <div className="half-item">
  223. <span className="item-title">立项/后补助: </span>
  224. <Radio.Group onChange={this.subsidyCheck}>
  225. <Radio value={1}>立项</Radio>
  226. <Radio value={2}>后补助</Radio>
  227. </Radio.Group>
  228. </div>
  229. <div className="half-item">
  230. <span className="item-title">金额: </span>
  231. <Input style={{ width: 200 }} onChange={(e) => { this.state.projectApproval = e.target.value; }} />
  232. <span>万元</span>
  233. </div>
  234. </div>
  235. </Modal>
  236. </div>
  237. );
  238. }
  239. });
  240. export default ApplyAdd;