hrSituation.jsx 20 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459
  1. import React from 'react';
  2. import { Input, InputNumber, Button, Form, Icon, Spin, message } from 'antd';
  3. import './person.less';
  4. import './hrSituation.less'
  5. import ajax from 'jquery/src/ajax/xhr.js'
  6. import $ from 'jquery/src/ajax';
  7. const PersonFrom = Form.create()(React.createClass({
  8. getData() {
  9. this.props.spinState(true);
  10. $.ajax({
  11. method: "get",
  12. dataType: "json",
  13. url: globalConfig.context + "/api/user/humanResource",
  14. success: function (data) {
  15. if (data.data) {
  16. this.setState({
  17. aboveFifty: data.data.aboveFifty,
  18. belowThirty: data.data.belowThirty,
  19. college: data.data.college,
  20. doctor: data.data.doctor,
  21. firmAbroad: data.data.firmAbroad,
  22. firmCore: data.data.firmCore,
  23. firmForeign: data.data.firmForeign,
  24. firmInService: data.data.firmInService,
  25. firmPartTime: data.data.firmPartTime,
  26. firmTemporary: data.data.firmTemporary,
  27. firmTotal: data.data.firmTotal,
  28. fortyoneToFifty: data.data.fortyoneToFifty,
  29. intermediateTitle: data.data.intermediateTitle,
  30. juniorTitle: data.data.juniorTitle,
  31. master: data.data.master,
  32. seniorMechanic: data.data.seniorMechanic,
  33. seniorTitle: data.data.seniorTitle,
  34. techAbroad: data.data.techAbroad,
  35. techCore: data.data.techCore,
  36. techForeign: data.data.techForeign,
  37. techInService: data.data.techInService,
  38. techPartTime: data.data.techPartTime,
  39. techTemporary: data.data.techTemporary,
  40. techTotal: data.data.techTotal,
  41. thirtyoneToThirtyfour: data.data.thirtyoneToThirtyfour,
  42. undergraduate: data.data.undergraduate
  43. });
  44. }
  45. }.bind(this),
  46. }).always(function () {
  47. this.props.spinState(false);
  48. }.bind(this));
  49. },
  50. getInitialState() {
  51. return {
  52. loading: false,
  53. };
  54. },
  55. handleSubmit(e) {
  56. e.preventDefault();
  57. this.props.form.validateFields((err, values) => {
  58. debugger
  59. if (values.firmTotal < values.firmInService + values.firmPartTime + values.firmTemporary) {
  60. message.warning("总体情况的在职人员数、兼职人员数、临时聘用人员数相加小于等于企业职工总数!");
  61. return;
  62. };
  63. if (values.firmTotal < values.techTotal) {
  64. message.warning("科技人员数小于等于企业职工总数!");
  65. return;
  66. };
  67. if (values.firmInService < values.techInService || values.firmPartTime < values.techPartTime || values.firmTemporary < values.techTemporary ||
  68. values.firmForeign < values.techForeign || values.firmAbroad < values.techAbroad || values.firmCore < values.techCore) {
  69. message.warning("科技人员各项人数小于等于企业职工各项人数!");
  70. return;
  71. };
  72. if (values.firmTotal < values.doctor + values.master + values.undergraduate + values.college) {
  73. message.warning("全体人员结构中学历一栏人数总和小于等于职工人数!");
  74. return;
  75. };
  76. if (values.firmTotal < values.belowThirty + values.thirtyoneToThirtyfour + values.fortyoneToFifty + values.aboveFifty) {
  77. message.warning("全体人员结构中年龄一栏人数总和小于等于职工人数!");
  78. return;
  79. };
  80. if (!err) {
  81. this.props.spinState(true);
  82. $.ajax({
  83. method: "POST",
  84. dataType: "json",
  85. crossDomain: false,
  86. url: globalConfig.context + "/api/user/SaveHumanResource",
  87. data: {
  88. aboveFifty: values.aboveFifty,
  89. belowThirty: values.belowThirty,
  90. college: values.college,
  91. doctor: values.doctor,
  92. firmAbroad: values.firmAbroad,
  93. firmCore: values.firmCore,
  94. firmForeign: values.firmForeign,
  95. firmInService: values.firmInService,
  96. firmPartTime: values.firmPartTime,
  97. firmTemporary: values.firmTemporary,
  98. firmTotal: values.firmTotal,
  99. fortyoneToFifty: values.fortyoneToFifty,
  100. intermediateTitle: values.intermediateTitle,
  101. juniorTitle: values.juniorTitle,
  102. master: values.master,
  103. seniorMechanic: values.seniorMechanic,
  104. seniorTitle: values.seniorTitle,
  105. techAbroad: values.techAbroad,
  106. techCore: values.techCore,
  107. techForeign: values.techForeign,
  108. techInService: values.techInService,
  109. techPartTime: values.techPartTime,
  110. techTemporary: values.techTemporary,
  111. techTotal: values.techTotal,
  112. thirtyoneToThirtyfour: values.thirtyoneToThirtyfour,
  113. undergraduate: values.undergraduate,
  114. }
  115. }).done(function (data) {
  116. if (!data.error.length) {
  117. message.success('保存成功!');
  118. } else {
  119. message.warning(data.error[0].message);
  120. }
  121. }.bind(this)).always(function () {
  122. this.props.spinState(false);
  123. }.bind(this));
  124. }
  125. });
  126. },
  127. componentWillMount() {
  128. this.getData();
  129. },
  130. render() {
  131. const { getFieldDecorator } = this.props.form;
  132. const formItemLayout = {
  133. labelCol: { span: 8 },
  134. wrapperCol: { span: 16 },
  135. };
  136. const FormItem = Form.Item;
  137. return (
  138. <Form onSubmit={this.handleSubmit} className="hrSituation-form">
  139. <p className="hrSituation-title">总体情况</p>
  140. <div className="clearfix">
  141. <span className="hrSituation-span">总数(人)</span>
  142. <FormItem className="half-item"
  143. {...formItemLayout}
  144. label="企业职工"
  145. >
  146. {getFieldDecorator('firmTotal', {
  147. initialValue: this.state.firmTotal || null
  148. })(
  149. <InputNumber />
  150. )}
  151. </FormItem>
  152. <FormItem className="half-item"
  153. style={{ marginRight: "50%" }}
  154. {...formItemLayout}
  155. label="科技人员"
  156. >
  157. {getFieldDecorator('techTotal', {
  158. initialValue: this.state.techTotal || null
  159. })(
  160. <InputNumber />
  161. )}
  162. </FormItem>
  163. <span className="hrSituation-span">在职人员(人)</span>
  164. <FormItem className="half-item"
  165. {...formItemLayout}
  166. label="企业职工"
  167. >
  168. {getFieldDecorator('firmInService', {
  169. initialValue: this.state.firmInService || null
  170. })(
  171. <InputNumber />
  172. )}
  173. </FormItem>
  174. <FormItem className="half-item"
  175. {...formItemLayout}
  176. label="科技人员"
  177. >
  178. {getFieldDecorator('techInService', {
  179. initialValue: this.state.techInService || null
  180. })(
  181. <InputNumber />
  182. )}
  183. </FormItem>
  184. <span className="hrSituation-span">兼职人员(人)</span>
  185. <FormItem className="half-item"
  186. {...formItemLayout}
  187. label="企业职工"
  188. >
  189. {getFieldDecorator('firmPartTime', {
  190. initialValue: this.state.firmPartTime || null
  191. })(
  192. <InputNumber />
  193. )}
  194. </FormItem>
  195. <FormItem className="half-item"
  196. {...formItemLayout}
  197. label="科技人员"
  198. >
  199. {getFieldDecorator('techPartTime', {
  200. initialValue: this.state.techPartTime || null
  201. })(
  202. <InputNumber />
  203. )}
  204. </FormItem>
  205. <span className="hrSituation-span">临时聘用人员(人)</span>
  206. <FormItem className="half-item"
  207. {...formItemLayout}
  208. label="企业职工"
  209. >
  210. {getFieldDecorator('firmTemporary', {
  211. initialValue: this.state.firmTemporary || null
  212. })(
  213. <InputNumber />
  214. )}
  215. </FormItem>
  216. <FormItem className="half-item"
  217. {...formItemLayout}
  218. label="科技人员"
  219. >
  220. {getFieldDecorator('techTemporary', {
  221. initialValue: this.state.techTemporary || null
  222. })(
  223. <InputNumber />
  224. )}
  225. </FormItem>
  226. <span className="hrSituation-span">外籍人员(人)</span>
  227. <FormItem className="half-item"
  228. {...formItemLayout}
  229. label="企业职工"
  230. >
  231. {getFieldDecorator('firmForeign', {
  232. initialValue: this.state.firmForeign || null
  233. })(
  234. <InputNumber />
  235. )}
  236. </FormItem>
  237. <FormItem className="half-item"
  238. {...formItemLayout}
  239. label="科技人员"
  240. >
  241. {getFieldDecorator('techForeign', {
  242. initialValue: this.state.techForeign || null
  243. })(
  244. <InputNumber />
  245. )}
  246. </FormItem>
  247. <span className="hrSituation-span">留学归国人员(人)</span>
  248. <FormItem className="half-item"
  249. {...formItemLayout}
  250. label="企业职工"
  251. >
  252. {getFieldDecorator('firmAbroad', {
  253. initialValue: this.state.firmAbroad || null
  254. })(
  255. <InputNumber />
  256. )}
  257. </FormItem>
  258. <FormItem className="half-item"
  259. {...formItemLayout}
  260. label="科技人员"
  261. >
  262. {getFieldDecorator('techAbroad', {
  263. initialValue: this.state.techAbroad || null
  264. })(
  265. <InputNumber />
  266. )}
  267. </FormItem>
  268. <span className="hrSituation-span">干人计划人员(人)</span>
  269. <FormItem className="half-item"
  270. {...formItemLayout}
  271. label="企业职工"
  272. >
  273. {getFieldDecorator('firmCore', {
  274. initialValue: this.state.firmCore || null
  275. })(
  276. <InputNumber />
  277. )}
  278. </FormItem>
  279. <FormItem className="half-item"
  280. {...formItemLayout}
  281. label="科技人员"
  282. >
  283. {getFieldDecorator('techCore', {
  284. initialValue: this.state.techCore || null
  285. })(
  286. <InputNumber />
  287. )}
  288. </FormItem>
  289. </div>
  290. <p className="hrSituation-title">全体人员结构</p>
  291. <div className="clearfix">
  292. <span className="hrSituation-span">学历人数</span>
  293. <FormItem className="half-item"
  294. {...formItemLayout}
  295. label="博士"
  296. >
  297. {getFieldDecorator('doctor', {
  298. initialValue: this.state.doctor || null
  299. })(
  300. <InputNumber />
  301. )}
  302. </FormItem>
  303. <FormItem className="half-item"
  304. {...formItemLayout}
  305. label="硕士"
  306. >
  307. {getFieldDecorator('master', {
  308. initialValue: this.state.master || null
  309. })(
  310. <InputNumber />
  311. )}
  312. </FormItem>
  313. <FormItem className="half-item"
  314. {...formItemLayout}
  315. label="本科"
  316. >
  317. {getFieldDecorator('undergraduate', {
  318. initialValue: this.state.undergraduate || null
  319. })(
  320. <InputNumber />
  321. )}
  322. </FormItem>
  323. <FormItem className="half-item"
  324. {...formItemLayout}
  325. label="大专及以下"
  326. >
  327. {getFieldDecorator('college', {
  328. initialValue: this.state.college || null
  329. })(
  330. <InputNumber />
  331. )}
  332. </FormItem>
  333. </div>
  334. <div className="clearfix">
  335. <span className="hrSituation-span">职称人数</span>
  336. <FormItem className="half-item"
  337. {...formItemLayout}
  338. label="高级职称"
  339. >
  340. {getFieldDecorator('seniorTitle', {
  341. initialValue: this.state.seniorTitle || null
  342. })(
  343. <InputNumber />
  344. )}
  345. </FormItem>
  346. <FormItem className="half-item"
  347. {...formItemLayout}
  348. label="中级职称"
  349. >
  350. {getFieldDecorator('intermediateTitle', {
  351. initialValue: this.state.intermediateTitle || null
  352. })(
  353. <InputNumber />
  354. )}
  355. </FormItem>
  356. <FormItem className="half-item"
  357. {...formItemLayout}
  358. label="初级职称"
  359. >
  360. {getFieldDecorator('juniorTitle', {
  361. initialValue: this.state.juniorTitle || null
  362. })(
  363. <InputNumber />
  364. )}
  365. </FormItem>
  366. <FormItem className="half-item"
  367. {...formItemLayout}
  368. label="高级技工"
  369. >
  370. {getFieldDecorator('seniorMechanic', {
  371. initialValue: this.state.seniorMechanic || null
  372. })(
  373. <InputNumber />
  374. )}
  375. </FormItem>
  376. </div>
  377. <div className="clearfix">
  378. <span className="hrSituation-span">年龄人数</span>
  379. <FormItem className="half-item"
  380. {...formItemLayout}
  381. label="30及以下"
  382. >
  383. {getFieldDecorator('belowThirty', {
  384. initialValue: this.state.belowThirty || null
  385. })(
  386. <InputNumber />
  387. )}
  388. </FormItem>
  389. <FormItem className="half-item"
  390. {...formItemLayout}
  391. label="31-34"
  392. >
  393. {getFieldDecorator('thirtyoneToThirtyfour', {
  394. initialValue: this.state.thirtyoneToThirtyfour || null
  395. })(
  396. <InputNumber />
  397. )}
  398. </FormItem>
  399. <FormItem className="half-item"
  400. {...formItemLayout}
  401. label="41-50"
  402. >
  403. {getFieldDecorator('fortyoneToFifty', {
  404. initialValue: this.state.fortyoneToFifty || null
  405. })(
  406. <InputNumber />
  407. )}
  408. </FormItem>
  409. <FormItem className="half-item"
  410. {...formItemLayout}
  411. label="50以上"
  412. >
  413. {getFieldDecorator('aboveFifty', {
  414. initialValue: this.state.aboveFifty || null
  415. })(
  416. <InputNumber />
  417. )}
  418. </FormItem>
  419. </div>
  420. <div style={{ marginLeft: "40px" }}>
  421. <span style={{ color: "red" }}>提示</span>
  422. <p>1、总体情况的在职人员数、兼职人员数、临时聘用人员数相加小于等于企业职工总数。</p>
  423. <p>2、科技人员数小于等于企业职工总数。</p>
  424. <p>3、科技人员各项人数小于等于企业职工各项人数。</p>
  425. <p>4、全体人员结构中学历一栏人数总和小于等于职工人数。</p>
  426. <p>5、全体人员结构中年龄一栏人数总和小于等于职工人数。</p>
  427. <Button style={{ marginTop: "20px" }} className="set-submit" type="primary" htmlType="submit">保存</Button>
  428. </div>
  429. </Form >
  430. );
  431. },
  432. }));
  433. const Person = React.createClass({
  434. getInitialState() {
  435. return {
  436. loading: false
  437. };
  438. },
  439. spinChange(e) {
  440. this.setState({
  441. loading: e
  442. });
  443. },
  444. render() {
  445. return (
  446. <Spin spinning={this.state.loading} className='spin-box'>
  447. <div className="set-person">
  448. <div className="acc-detail">
  449. <PersonFrom spinState={this.spinChange} />
  450. </div>
  451. </div>
  452. </Spin>
  453. )
  454. }
  455. });
  456. export default Person;