achievement.jsx 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396
  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. },
  232. industryChange(e) {
  233. let theArr = [];
  234. if (e.target.value !== 999) {
  235. theArr.push(
  236. <Radio.Button key={999} value={999}>不限</Radio.Button>
  237. );
  238. IndustryObject.map(function (item1) {
  239. if (item1.value == e.target.value) {
  240. item1.children.map(function (item2) {
  241. theArr.push(
  242. <Radio.Button key={item2.value} value={item2.value}>{item2.label}</Radio.Button>
  243. );
  244. });
  245. }
  246. });
  247. this.state.fieldA = e.target.value;
  248. } else {
  249. this.state.fieldA = null;
  250. };
  251. this.loadData();
  252. this.setState({ industryRadioB: theArr });
  253. },
  254. tableRowClick(record, index) {
  255. this.state.RowData = record;
  256. this.setState({
  257. showDesc: true
  258. });
  259. },
  260. closeDesc(e) {
  261. this.setState({
  262. showDesc: e
  263. });
  264. },
  265. render() {
  266. return (
  267. <div className="portal-content">
  268. <Row className="search-criteria">
  269. <Col className="search-title" span={2}>
  270. <span>行业分类</span>
  271. </Col>
  272. <Col className="search-select" span={22}>
  273. <Radio.Group defaultValue={999} onChange={this.industryChange}>
  274. {this.state.industryRadioA}
  275. </Radio.Group>
  276. </Col>
  277. </Row>
  278. {this.state.industryRadioB.length > 1 ? <Row className="search-criteria">
  279. <Col className="search-title" span={2}>
  280. <span>行业子分类</span>
  281. </Col>
  282. <Col className="search-select" span={22}>
  283. <Radio.Group defaultValue={999} onChange={(e) => { this.state.fieldB = e.target.value; this.loadData() }}>
  284. {this.state.industryRadioB}
  285. </Radio.Group>
  286. </Col>
  287. </Row> : <div></div>}
  288. <Row className="search-criteria">
  289. <Col className="search-title" span={2}>
  290. <span>交易价格</span>
  291. </Col>
  292. <Col className="search-select" span={13}>
  293. <Radio.Group value={this.state.transferPrice}
  294. onChange={(e) => {
  295. this.setState({
  296. transferPrice: e.target.value
  297. });
  298. this.state.transferPrice = e.target.value;
  299. this.loadData();
  300. }}>
  301. <Radio.Button value={999}>不限</Radio.Button>
  302. <Radio.Button value={1}>1-10万元</Radio.Button>
  303. <Radio.Button value={2}>10-50万元</Radio.Button>
  304. <Radio.Button value={3}>50-100万元</Radio.Button>
  305. <Radio.Button value={4}>100-500万元</Radio.Button>
  306. <Radio.Button value={5}>500-1000万元</Radio.Button>
  307. <Radio.Button value={6}>面议</Radio.Button>
  308. </Radio.Group>
  309. </Col>
  310. <Col span={9}>
  311. <Checkbox checked={!this.state.transferPrice} onChange={(e) => { if (e.target.checked) { this.setState({ transferPrice: null }) } }}>自定义金额</Checkbox>
  312. <InputNumber style={{ width: 80 }}
  313. disabled={Boolean(this.state.transferPrice)}
  314. onChange={(e) => { this.state.transferPriceLower = e; }} />
  315. <span> 到 </span>
  316. <InputNumber style={{ width: 80 }}
  317. disabled={Boolean(this.state.transferPrice)}
  318. onChange={(e) => { this.state.transferPriceUpper = e; }} />
  319. <span> 万元</span>
  320. <Button style={{ marginLeft: '20px' }} disabled={Boolean(this.state.transferPrice)} onClick={() => { this.loadData() }}>确定</Button>
  321. </Col>
  322. </Row>
  323. <Row className="search-criteria">
  324. <Col className="search-title" span={2}>
  325. <span>技术类型</span>
  326. </Col>
  327. <Col className="search-select" span={22}>
  328. <Radio.Group defaultValue={999} onChange={(e) => {
  329. this.setState({
  330. category: e.target.value
  331. });
  332. this.state.category = e.target.value;
  333. this.loadData();
  334. }}>
  335. {this.state.categoryRadio}
  336. </Radio.Group>
  337. </Col>
  338. </Row>
  339. <Row className="search-criteria">
  340. <Col className="search-title" span={2}>
  341. <span>交易方式</span>
  342. </Col>
  343. <Col className="search-select" span={22}>
  344. <Radio.Group defaultValue={999} onChange={(e) => {
  345. this.setState({
  346. transferMode: e.target.value
  347. });
  348. this.state.transferMode = e.target.value
  349. this.loadData();
  350. }}>
  351. {this.state.transferModeRadio}
  352. </Radio.Group>
  353. </Col>
  354. </Row>
  355. <Row className="search-criteria">
  356. <Col className="search-title" span={2}>
  357. <span>成熟度</span>
  358. </Col>
  359. <Col className="search-select" span={22}>
  360. <Radio.Group defaultValue={999} onChange={(e) => {
  361. this.setState({
  362. maturity: e.target.value
  363. });
  364. this.state.maturity = e.target.value
  365. this.loadData();
  366. }}>
  367. {this.state.maturityRadio}
  368. </Radio.Group>
  369. </Col>
  370. </Row>
  371. <Row className="search-criteria" style={{ paddingBottom: '10px' }}>
  372. <Col className="search-title" span={2}>
  373. <span>关键字</span>
  374. </Col>
  375. <Col className="search-select" span={22}>
  376. <Input style={{ width: 120 }} onChange={(e) => { this.state.keyword = e.target.value; }} />
  377. <Button style={{ marginLeft: '20px' }} onClick={() => { this.loadData() }}>确定</Button>
  378. </Col>
  379. </Row>
  380. <Spin spinning={this.state.loading}>
  381. <Table columns={this.state.columns}
  382. dataSource={this.state.dataSource}
  383. pagination={this.state.pagination}
  384. onRowClick={this.tableRowClick} />
  385. </Spin>
  386. <AchievementDesc
  387. data={this.state.RowData}
  388. showDesc={this.state.showDesc}
  389. closeDesc={this.closeDesc} />
  390. </div >
  391. )
  392. }
  393. });
  394. export default Content;