achievement.jsx 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397
  1. import React from 'react';
  2. import { Icon, message, Row, Col, Radio, Checkbox, Input, InputNumber, Button, Table, Spin } from 'antd';
  3. import '../portal.less';
  4. import { IndustryObject, getIndustryCategory } from '../../DicIndustryList';
  5. import { achievementCategoryList, transferModeList, maturityList } from '../../dataDic';
  6. import { getAchievementCategory } from '../../tools';
  7. import ajax from 'jquery/src/ajax/xhr.js'
  8. import $ from 'jquery/src/ajax';
  9. import AchievementDesc from './achievementDesc';
  10. const Content = React.createClass({
  11. loadData(pageNo) {
  12. this.setState({
  13. loading: true
  14. });
  15. switch (this.state.transferPrice) {
  16. case 1:
  17. this.state.transferPriceLower = 1;
  18. this.state.transferPriceUpper = 10;
  19. break;
  20. case 2:
  21. this.state.transferPriceLower = 10;
  22. this.state.transferPriceUpper = 50;
  23. break;
  24. case 3:
  25. this.state.transferPriceLower = 50;
  26. this.state.transferPriceUpper = 100;
  27. break;
  28. case 4:
  29. this.state.transferPriceLower = 100;
  30. this.state.transferPriceUpper = 500;
  31. break;
  32. case 5:
  33. this.state.transferPriceLower = 500;
  34. this.state.transferPriceUpper = 1000;
  35. break;
  36. case 6:
  37. this.state.bargainingMode = 1;
  38. break;
  39. case 999:
  40. this.state.transferPriceLower = null;
  41. this.state.transferPriceUpper = null;
  42. break;
  43. }
  44. $.ajax({
  45. method: "get",
  46. dataType: "json",
  47. url: globalConfig.context + "/portal/search/achievementList",
  48. data: {
  49. pageNo: pageNo || 1,
  50. pageSize: this.state.pagination.pageSize,
  51. category: this.state.category == 999 ? null : this.state.category, //技术类型
  52. keyword: this.state.keyword,
  53. maturity: this.state.maturity == 999 ? null : this.state.maturity, //成熟度
  54. transferPriceLower: this.state.transferPriceLower, //交易金额下限
  55. transferPriceUpper: this.state.transferPriceUpper, //交易金额上限
  56. bargainingMode: this.state.bargainingMode,
  57. transferMode: this.state.transferMode == 999 ? null : this.state.transferMode, //交易方式
  58. fieldA: this.state.fieldA, //技术领域(行业类别A)
  59. fieldB: this.state.fieldB == 999 ? null : this.state.fieldB, //技术领域(行业类别B)
  60. },
  61. success: function (data) {
  62. let theArr = [];
  63. if (!data.data && !data.data.list) {
  64. if (data.error && data.error.length) {
  65. message.warning(data.error[0].message);
  66. };
  67. } else {
  68. for (let i = 0; i < data.data.list.length; i++) {
  69. let thisdata = data.data.list[i];
  70. theArr.push({
  71. key: i,
  72. id: thisdata.id,
  73. serialNumber: thisdata.serialNumber,
  74. keyword: thisdata.keyword,
  75. name: thisdata.name,
  76. dataCategory: thisdata.dataCategory,
  77. category: thisdata.category,
  78. ownerName: thisdata.username || thisdata.unitName,
  79. username: thisdata.username,
  80. unitName: thisdata.unitName,
  81. releaseDate: thisdata.releaseDate,
  82. ownerType: thisdata.ownerType,
  83. field: [thisdata.fieldA, thisdata.fieldB],
  84. transferPrice: thisdata.transferPrice,
  85. maturity: thisdata.maturity,
  86. transferMode: thisdata.transferMode,
  87. releaseDateFormattedDate: thisdata.releaseDateFormattedDate
  88. });
  89. };
  90. };
  91. this.state.pagination.defaultCurrent = data.data.pageNo;
  92. this.state.pagination.total = data.data.totalCount;
  93. this.setState({
  94. dataSource: theArr,
  95. pagination: this.state.pagination
  96. });
  97. }.bind(this),
  98. }).done(function (data) {
  99. if (data.error && data.error.length) {
  100. message.warning(data.error[0].message);
  101. };
  102. this.setState({
  103. loading: false
  104. });
  105. this.state.bargainingMode = 0;
  106. }.bind(this));
  107. },
  108. getInitialState() {
  109. return {
  110. loading: false,
  111. showDesc:false,
  112. industryRadioB: [],
  113. transferPrice: 999,
  114. pagination: {
  115. defaultCurrent: 1,
  116. defaultPageSize: 10,
  117. showQuickJumper: true,
  118. pageSize: 10,
  119. onChange: function (page) {
  120. this.loadData(page);
  121. }.bind(this),
  122. showTotal: function (total) {
  123. return '共' + total + '条数据';
  124. }
  125. },
  126. columns: [
  127. {
  128. title: '编号',
  129. dataIndex: 'serialNumber',
  130. key: 'serialNumber',
  131. }, {
  132. title: '名称',
  133. dataIndex: 'name',
  134. key: 'name',
  135. }, {
  136. title: '关键字',
  137. dataIndex: 'keyword',
  138. key: 'keyword',
  139. }, {
  140. title: '成果类型',
  141. dataIndex: 'dataCategory',
  142. key: 'dataCategory',
  143. render: text => {
  144. switch (text) {
  145. case "0":
  146. return <span>成果</span>;
  147. case "1":
  148. return <span>技术</span>;
  149. case "2":
  150. return <span>项目</span>;
  151. }
  152. }
  153. }, {
  154. title: '类型',
  155. dataIndex: 'category',
  156. key: 'category',
  157. render: text => { return getAchievementCategory(text); }
  158. }, {
  159. title: '行业分类',
  160. dataIndex: 'field',
  161. key: 'field',
  162. render: text => { return getIndustryCategory(text[0], text[1]) }
  163. }, {
  164. title: '所有人名称',
  165. dataIndex: 'ownerName',
  166. key: 'ownerName',
  167. }, {
  168. title: '所有人类型',
  169. dataIndex: 'ownerType',
  170. key: 'ownerType',
  171. render: text => {
  172. switch (text) {
  173. case "0":
  174. return <span>个人</span>;
  175. case "1":
  176. return <span>组织</span>
  177. }
  178. }
  179. }, {
  180. title: '发布时间',
  181. dataIndex: 'releaseDateFormattedDate',
  182. key: 'releaseDateFormattedDate',
  183. }
  184. ],
  185. dataSource: []
  186. };
  187. },
  188. componentWillMount() {
  189. let theArr = [];
  190. let theCategoryArr = [], theTransferModeArr = [], theMaturityArr = [];
  191. //行业分类单选项
  192. theArr.push(
  193. <Radio.Button key={999} value={999}>不限</Radio.Button>
  194. );
  195. IndustryObject.map(function (item) {
  196. theArr.push(
  197. <Radio.Button key={item.value} value={item.value}>{item.label}</Radio.Button>
  198. );
  199. });
  200. //技术类型单选项目
  201. theCategoryArr.push(
  202. <Radio.Button key={999} value={999}>不限</Radio.Button>
  203. );
  204. achievementCategoryList.map(function (item) {
  205. theCategoryArr.push(
  206. <Radio.Button key={item.value} value={item.value}>{item.key}</Radio.Button>
  207. );
  208. });
  209. //交易方式单选项目
  210. theTransferModeArr.push(
  211. <Radio.Button key={999} value={999}>不限</Radio.Button>
  212. );
  213. transferModeList.map(function (item) {
  214. theTransferModeArr.push(
  215. <Radio.Button key={item.value} value={item.value}>{item.key}</Radio.Button>
  216. );
  217. });
  218. //成熟度单选项目
  219. theMaturityArr.push(
  220. <Radio.Button key={999} value={999}>不限</Radio.Button>
  221. );
  222. maturityList.map(function (item) {
  223. theMaturityArr.push(
  224. <Radio.Button key={item.value} value={item.value}>{item.key}</Radio.Button>
  225. );
  226. });
  227. this.state.industryRadioA = theArr;
  228. this.state.categoryRadio = theCategoryArr;
  229. this.state.transferModeRadio = theTransferModeArr;
  230. this.state.maturityRadio = theMaturityArr;
  231. this.loadData();
  232. },
  233. industryChange(e) {
  234. let theArr = [];
  235. if (e.target.value !== 999) {
  236. theArr.push(
  237. <Radio.Button key={999} value={999}>不限</Radio.Button>
  238. );
  239. IndustryObject.map(function (item1) {
  240. if (item1.value == e.target.value) {
  241. item1.children.map(function (item2) {
  242. theArr.push(
  243. <Radio.Button key={item2.value} value={item2.value}>{item2.label}</Radio.Button>
  244. );
  245. });
  246. }
  247. });
  248. this.state.fieldA = e.target.value;
  249. } else {
  250. this.state.fieldA = null;
  251. };
  252. this.loadData();
  253. this.setState({ industryRadioB: theArr });
  254. },
  255. tableRowClick(record, index) {
  256. this.state.RowData = record;
  257. this.setState({
  258. showDesc: true
  259. });
  260. },
  261. closeDesc(e) {
  262. this.setState({
  263. showDesc: e
  264. });
  265. },
  266. render() {
  267. return (
  268. <div className="portal-content">
  269. <Row className="search-criteria">
  270. <Col className="search-title" span={2}>
  271. <span>行业分类</span>
  272. </Col>
  273. <Col className="search-select" span={22}>
  274. <Radio.Group defaultValue={999} onChange={this.industryChange}>
  275. {this.state.industryRadioA}
  276. </Radio.Group>
  277. </Col>
  278. </Row>
  279. {this.state.industryRadioB.length > 1 ? <Row className="search-criteria">
  280. <Col className="search-title" span={2}>
  281. <span>行业子分类</span>
  282. </Col>
  283. <Col className="search-select" span={22}>
  284. <Radio.Group defaultValue={999} onChange={(e) => { this.state.fieldB = e.target.value; this.loadData() }}>
  285. {this.state.industryRadioB}
  286. </Radio.Group>
  287. </Col>
  288. </Row> : <div></div>}
  289. <Row className="search-criteria">
  290. <Col className="search-title" span={2}>
  291. <span>交易价格</span>
  292. </Col>
  293. <Col className="search-select" span={13}>
  294. <Radio.Group value={this.state.transferPrice}
  295. onChange={(e) => {
  296. this.setState({
  297. transferPrice: e.target.value
  298. });
  299. this.state.transferPrice = e.target.value;
  300. this.loadData();
  301. }}>
  302. <Radio.Button value={999}>不限</Radio.Button>
  303. <Radio.Button value={1}>1-10万元</Radio.Button>
  304. <Radio.Button value={2}>10-50万元</Radio.Button>
  305. <Radio.Button value={3}>50-100万元</Radio.Button>
  306. <Radio.Button value={4}>100-500万元</Radio.Button>
  307. <Radio.Button value={5}>500-1000万元</Radio.Button>
  308. <Radio.Button value={6}>面议</Radio.Button>
  309. </Radio.Group>
  310. </Col>
  311. <Col span={9}>
  312. <Checkbox checked={!this.state.transferPrice} onChange={(e) => { if (e.target.checked) { this.setState({ transferPrice: null }) } }}>自定义金额</Checkbox>
  313. <InputNumber style={{ width: 80 }}
  314. disabled={Boolean(this.state.transferPrice)}
  315. onChange={(e) => { this.state.transferPriceLower = e; }} />
  316. <span> 到 </span>
  317. <InputNumber style={{ width: 80 }}
  318. disabled={Boolean(this.state.transferPrice)}
  319. onChange={(e) => { this.state.transferPriceUpper = e; }} />
  320. <span> 万元</span>
  321. <Button style={{ marginLeft: '20px' }} disabled={Boolean(this.state.transferPrice)} onClick={() => { this.loadData() }}>确定</Button>
  322. </Col>
  323. </Row>
  324. <Row className="search-criteria">
  325. <Col className="search-title" span={2}>
  326. <span>技术类型</span>
  327. </Col>
  328. <Col className="search-select" span={22}>
  329. <Radio.Group defaultValue={999} onChange={(e) => {
  330. this.setState({
  331. category: e.target.value
  332. });
  333. this.state.category = e.target.value;
  334. this.loadData();
  335. }}>
  336. {this.state.categoryRadio}
  337. </Radio.Group>
  338. </Col>
  339. </Row>
  340. <Row className="search-criteria">
  341. <Col className="search-title" span={2}>
  342. <span>交易方式</span>
  343. </Col>
  344. <Col className="search-select" span={22}>
  345. <Radio.Group defaultValue={999} onChange={(e) => {
  346. this.setState({
  347. transferMode: e.target.value
  348. });
  349. this.state.transferMode = e.target.value
  350. this.loadData();
  351. }}>
  352. {this.state.transferModeRadio}
  353. </Radio.Group>
  354. </Col>
  355. </Row>
  356. <Row className="search-criteria">
  357. <Col className="search-title" span={2}>
  358. <span>成熟度</span>
  359. </Col>
  360. <Col className="search-select" span={22}>
  361. <Radio.Group defaultValue={999} onChange={(e) => {
  362. this.setState({
  363. maturity: e.target.value
  364. });
  365. this.state.maturity = e.target.value
  366. this.loadData();
  367. }}>
  368. {this.state.maturityRadio}
  369. </Radio.Group>
  370. </Col>
  371. </Row>
  372. <Row className="search-criteria" style={{ paddingBottom: '10px' }}>
  373. <Col className="search-title" span={2}>
  374. <span>关键字</span>
  375. </Col>
  376. <Col className="search-select" span={22}>
  377. <Input style={{ width: 120 }} onChange={(e) => { this.state.keyword = e.target.value; }} />
  378. <Button style={{ marginLeft: '20px' }} onClick={() => { this.loadData() }}>确定</Button>
  379. </Col>
  380. </Row>
  381. <Spin spinning={this.state.loading}>
  382. <Table columns={this.state.columns}
  383. dataSource={this.state.dataSource}
  384. pagination={this.state.pagination}
  385. onRowClick={this.tableRowClick} />
  386. </Spin>
  387. <AchievementDesc
  388. data={this.state.RowData}
  389. showDesc={this.state.showDesc}
  390. closeDesc={this.closeDesc} />
  391. </div >
  392. )
  393. }
  394. });
  395. export default Content;