|
@@ -1,12 +1,24 @@
|
|
import React from 'react';
|
|
import React from 'react';
|
|
-import { Icon, message, Row, Col, Radio, Checkbox, Input, InputNumber, Button, Table, Spin } from 'antd';
|
|
|
|
|
|
+import { Carousel, Pagination, Icon, message, Row, Col, Radio, Checkbox, Input, InputNumber, Button, Table, Spin } from 'antd';
|
|
import '../portal.less';
|
|
import '../portal.less';
|
|
|
|
+
|
|
|
|
+import logoImg from '../../../../image/logo.png';
|
|
|
|
+import searchImg from '../../../../image/search.png';
|
|
|
|
+
|
|
|
|
+import demand_sup from '../../../../image/demand_sup.png';
|
|
|
|
+import demand_ico_5 from '../../../../image/demand_ico_5.png';
|
|
|
|
+import demand_ico_3 from '../../../../image/demand_ico_3.png';
|
|
|
|
+import demand_ico_2 from '../../../../image/demand_ico_2.png';
|
|
|
|
+import demand_ico_1 from '../../../../image/demand_ico_1.png';
|
|
|
|
+import uncertify from '../../../../image/demand_ico_6.png';
|
|
|
|
+import certify from '../../../../image/demand_ico_6_atv.png';
|
|
|
|
+
|
|
|
|
+
|
|
import { IndustryObject, getIndustryCategory } from '../../DicIndustryList';
|
|
import { IndustryObject, getIndustryCategory } from '../../DicIndustryList';
|
|
import { demandTypeList } from '../../dataDic';
|
|
import { demandTypeList } from '../../dataDic';
|
|
import { getDemandType } from '../../tools';
|
|
import { getDemandType } from '../../tools';
|
|
import ajax from 'jquery/src/ajax/xhr.js'
|
|
import ajax from 'jquery/src/ajax/xhr.js'
|
|
import $ from 'jquery/src/ajax';
|
|
import $ from 'jquery/src/ajax';
|
|
-import DemandDesc from './demandDesc';
|
|
|
|
|
|
|
|
const Content = React.createClass({
|
|
const Content = React.createClass({
|
|
loadData(pageNo) {
|
|
loadData(pageNo) {
|
|
@@ -69,6 +81,7 @@ const Content = React.createClass({
|
|
keyword: thisdata.keyword,
|
|
keyword: thisdata.keyword,
|
|
dataCategory: thisdata.dataCategory,
|
|
dataCategory: thisdata.dataCategory,
|
|
name: thisdata.name,
|
|
name: thisdata.name,
|
|
|
|
+ level: thisdata.level,
|
|
industryCategory: [thisdata.industryCategoryA, thisdata.industryCategoryB],
|
|
industryCategory: [thisdata.industryCategoryA, thisdata.industryCategoryB],
|
|
industryCategoryA: thisdata.industryCategoryA,
|
|
industryCategoryA: thisdata.industryCategoryA,
|
|
industryCategoryB: thisdata.industryCategoryB,
|
|
industryCategoryB: thisdata.industryCategoryB,
|
|
@@ -100,75 +113,14 @@ const Content = React.createClass({
|
|
getInitialState() {
|
|
getInitialState() {
|
|
return {
|
|
return {
|
|
loading: false,
|
|
loading: false,
|
|
- showDesc:false,
|
|
|
|
|
|
+ showDesc: false,
|
|
industryRadioB: [],
|
|
industryRadioB: [],
|
|
budgetCost: 999,
|
|
budgetCost: 999,
|
|
pagination: {
|
|
pagination: {
|
|
- defaultCurrent: 1,
|
|
|
|
- defaultPageSize: 10,
|
|
|
|
- showQuickJumper: true,
|
|
|
|
- pageSize: 10,
|
|
|
|
- onChange: function (page) {
|
|
|
|
- this.loadData(page);
|
|
|
|
- }.bind(this),
|
|
|
|
- showTotal: function (total) {
|
|
|
|
- return '共' + total + '条数据';
|
|
|
|
- }
|
|
|
|
|
|
+ pageNo: 1,
|
|
|
|
+ pageSize: 15,
|
|
|
|
+ total: 0
|
|
},
|
|
},
|
|
- columns: [
|
|
|
|
- {
|
|
|
|
- title: '编号',
|
|
|
|
- dataIndex: 'serialNumber',
|
|
|
|
- key: 'serialNumber',
|
|
|
|
- }, {
|
|
|
|
- title: '名称',
|
|
|
|
- dataIndex: 'name',
|
|
|
|
- key: 'name',
|
|
|
|
- }, {
|
|
|
|
- title: '关键字',
|
|
|
|
- dataIndex: 'keyword',
|
|
|
|
- key: 'keyword',
|
|
|
|
- }, {
|
|
|
|
- title: '数据类别',
|
|
|
|
- dataIndex: 'dataCategory',
|
|
|
|
- key: 'dataCategory',
|
|
|
|
- render: text => {
|
|
|
|
- switch (text) {
|
|
|
|
- case "0":
|
|
|
|
- return <span>个人需求</span>;
|
|
|
|
- case "1":
|
|
|
|
- return <span>单位需求</span>;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }, {
|
|
|
|
- title: '需求类型',
|
|
|
|
- dataIndex: 'demandType',
|
|
|
|
- key: 'demandType',
|
|
|
|
- render: text => { return getDemandType(text); }
|
|
|
|
- }, {
|
|
|
|
- title: '行业分类',
|
|
|
|
- dataIndex: 'industryCategory',
|
|
|
|
- key: 'industryCategory',
|
|
|
|
- render: text => { return getIndustryCategory(text[0], text[1]); }
|
|
|
|
- }, {
|
|
|
|
- title: '雇主名称',
|
|
|
|
- dataIndex: 'employerName',
|
|
|
|
- key: 'employerName',
|
|
|
|
- }, {
|
|
|
|
- title: '预算价格',
|
|
|
|
- dataIndex: 'budgetCost',
|
|
|
|
- key: 'budgetCost',
|
|
|
|
- }, {
|
|
|
|
- title: '问题说明',
|
|
|
|
- dataIndex: 'problemDes',
|
|
|
|
- key: 'problemDes',
|
|
|
|
- width: 400
|
|
|
|
- }, {
|
|
|
|
- title: '发布时间',
|
|
|
|
- dataIndex: 'releaseDateFormattedDate',
|
|
|
|
- key: 'releaseDateFormattedDate',
|
|
|
|
- }
|
|
|
|
- ],
|
|
|
|
dataSource: []
|
|
dataSource: []
|
|
};
|
|
};
|
|
},
|
|
},
|
|
@@ -220,10 +172,7 @@ const Content = React.createClass({
|
|
this.setState({ industryRadioB: theArr });
|
|
this.setState({ industryRadioB: theArr });
|
|
},
|
|
},
|
|
tableRowClick(record, index) {
|
|
tableRowClick(record, index) {
|
|
- this.state.RowData = record;
|
|
|
|
- this.setState({
|
|
|
|
- showDesc: true
|
|
|
|
- });
|
|
|
|
|
|
+ window.open(globalConfig.context + '/portal/detail/demandDetail.html?id=' + record.id + '&type=' + record.dataCategory);
|
|
},
|
|
},
|
|
closeDesc(e) {
|
|
closeDesc(e) {
|
|
this.setState({
|
|
this.setState({
|
|
@@ -231,94 +180,150 @@ const Content = React.createClass({
|
|
});
|
|
});
|
|
},
|
|
},
|
|
render() {
|
|
render() {
|
|
|
|
+ const { pageNo, pageSize, total } = this.state.pagination;
|
|
|
|
+ const _me = this;
|
|
return (
|
|
return (
|
|
- <div className="portal-content">
|
|
|
|
- <Row className="search-criteria">
|
|
|
|
- <Col className="search-title" span={2}>
|
|
|
|
- <span>行业分类</span>
|
|
|
|
- </Col>
|
|
|
|
- <Col className="search-select" span={22}>
|
|
|
|
- <Radio.Group defaultValue={999} onChange={this.industryChange}>
|
|
|
|
- {this.state.industryRadioA}
|
|
|
|
- </Radio.Group>
|
|
|
|
- </Col>
|
|
|
|
- </Row>
|
|
|
|
- {this.state.industryRadioB.length > 1 ? <Row className="search-criteria">
|
|
|
|
- <Col className="search-title" span={2}>
|
|
|
|
- <span>行业子分类</span>
|
|
|
|
- </Col>
|
|
|
|
- <Col className="search-select" span={22}>
|
|
|
|
- <Radio.Group defaultValue={999} onChange={(e) => { this.state.fieldB = e.target.value; this.loadData() }}>
|
|
|
|
- {this.state.industryRadioB}
|
|
|
|
- </Radio.Group>
|
|
|
|
- </Col>
|
|
|
|
- </Row> : <div></div>}
|
|
|
|
- <Row className="search-criteria">
|
|
|
|
- <Col className="search-title" span={2}>
|
|
|
|
- <span>预算价格</span>
|
|
|
|
- </Col>
|
|
|
|
- <Col className="search-select" span={12}>
|
|
|
|
- <Radio.Group value={this.state.budgetCost}
|
|
|
|
- onChange={(e) => {
|
|
|
|
|
|
+ <div className="portal-body">
|
|
|
|
+ <div className="portal-nav clearfix">
|
|
|
|
+ <div className="nav-logoBox">
|
|
|
|
+ <img src={logoImg} alt="" />
|
|
|
|
+ </div>
|
|
|
|
+ <ul className="nav-list clearfix">
|
|
|
|
+ <li className={this.props.searchType == 'achievement' ? 'active' : ''}><a href={"/portal/search/achievement.html"}>科技成果</a></li>
|
|
|
|
+ <li className={this.props.searchType == 'demand' ? 'active' : ''}><a href={"/portal/search/demand.html"}>科技需求</a></li>
|
|
|
|
+ </ul>
|
|
|
|
+ <div className="nav-search">
|
|
|
|
+ <Input onChange={(e) => { this.state.keyword = e.target.value; }} />
|
|
|
|
+ <Button onClick={() => { this.loadData() }}>
|
|
|
|
+ <img src={searchImg} alt="" />
|
|
|
|
+ </Button>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <Carousel autoplay className="portal-carousel">
|
|
|
|
+ <div className="slide-box"><img src={slideImg} alt="" /></div>
|
|
|
|
+ <div className="slide-box"><img src={slideImg} alt="" /></div>
|
|
|
|
+ <div className="slide-box"><img src={slideImg} alt="" /></div>
|
|
|
|
+ <div className="slide-box"><img src={slideImg} alt="" /></div>
|
|
|
|
+ </Carousel>
|
|
|
|
+ <div className="portal-content">
|
|
|
|
+ <Row className="search-criteria">
|
|
|
|
+ <Col className="search-title" span={2}>
|
|
|
|
+ <span>行业分类</span>
|
|
|
|
+ </Col>
|
|
|
|
+ <Col className="search-select" span={22}>
|
|
|
|
+ <Radio.Group defaultValue={999} onChange={this.industryChange}>
|
|
|
|
+ {this.state.industryRadioA}
|
|
|
|
+ </Radio.Group>
|
|
|
|
+ </Col>
|
|
|
|
+ </Row>
|
|
|
|
+ {this.state.industryRadioB.length > 1 ? <Row className="search-criteria">
|
|
|
|
+ <Col className="search-title" span={2}>
|
|
|
|
+ <span>行业子分类</span>
|
|
|
|
+ </Col>
|
|
|
|
+ <Col className="search-select" span={22}>
|
|
|
|
+ <Radio.Group defaultValue={999} onChange={(e) => { this.state.fieldB = e.target.value; this.loadData() }}>
|
|
|
|
+ {this.state.industryRadioB}
|
|
|
|
+ </Radio.Group>
|
|
|
|
+ </Col>
|
|
|
|
+ </Row> : <div></div>}
|
|
|
|
+ <Row className="search-criteria">
|
|
|
|
+ <Col className="search-title" span={2}>
|
|
|
|
+ <span>预算价格</span>
|
|
|
|
+ </Col>
|
|
|
|
+ <Col className="search-select" span={12}>
|
|
|
|
+ <Radio.Group value={this.state.budgetCost}
|
|
|
|
+ onChange={(e) => {
|
|
|
|
+ this.setState({
|
|
|
|
+ budgetCost: e.target.value
|
|
|
|
+ });
|
|
|
|
+ this.state.budgetCost = e.target.value;
|
|
|
|
+ this.loadData();
|
|
|
|
+ }}>
|
|
|
|
+ <Radio.Button value={999}>不限</Radio.Button>
|
|
|
|
+ <Radio.Button value={1}>1-10万元</Radio.Button>
|
|
|
|
+ <Radio.Button value={2}>10-50万元</Radio.Button>
|
|
|
|
+ <Radio.Button value={3}>50-100万元</Radio.Button>
|
|
|
|
+ <Radio.Button value={4}>100-500万元</Radio.Button>
|
|
|
|
+ <Radio.Button value={5}>500-1000万元</Radio.Button>
|
|
|
|
+ </Radio.Group>
|
|
|
|
+ </Col>
|
|
|
|
+ <Col span={10}>
|
|
|
|
+ <Checkbox checked={!this.state.budgetCost} onChange={(e) => { if (e.target.checked) { this.setState({ budgetCost: null }) } }}>自定义金额</Checkbox>
|
|
|
|
+ <InputNumber style={{ width: 80 }} disabled={Boolean(this.state.budgetCost)} onChange={(e) => { this.state.budgetCostLower = e.target.value; }} />
|
|
|
|
+ <span> 到 </span>
|
|
|
|
+ <InputNumber style={{ width: 80 }} disabled={Boolean(this.state.budgetCost)} onChange={(e) => { this.state.budgetCostUpper = e.target.value; }} />
|
|
|
|
+ <span> 万元</span>
|
|
|
|
+ <Button style={{ marginLeft: '20px' }} disabled={Boolean(this.state.budgetCost)} onClick={this.loadData}>确定</Button>
|
|
|
|
+ </Col>
|
|
|
|
+ </Row>
|
|
|
|
+ <Row className="search-criteria">
|
|
|
|
+ <Col className="search-title" span={2}>
|
|
|
|
+ <span>技术类型</span>
|
|
|
|
+ </Col>
|
|
|
|
+ <Col className="search-select" span={22}>
|
|
|
|
+ <Radio.Group defaultValue={999} onChange={(e) => {
|
|
this.setState({
|
|
this.setState({
|
|
- budgetCost: e.target.value
|
|
|
|
|
|
+ demandType: e.target.value
|
|
});
|
|
});
|
|
- this.state.budgetCost = e.target.value;
|
|
|
|
|
|
+ this.state.demandType = e.target.value;
|
|
this.loadData();
|
|
this.loadData();
|
|
}}>
|
|
}}>
|
|
- <Radio.Button value={999}>不限</Radio.Button>
|
|
|
|
- <Radio.Button value={1}>1-10万元</Radio.Button>
|
|
|
|
- <Radio.Button value={2}>10-50万元</Radio.Button>
|
|
|
|
- <Radio.Button value={3}>50-100万元</Radio.Button>
|
|
|
|
- <Radio.Button value={4}>100-500万元</Radio.Button>
|
|
|
|
- <Radio.Button value={5}>500-1000万元</Radio.Button>
|
|
|
|
- </Radio.Group>
|
|
|
|
- </Col>
|
|
|
|
- <Col span={10}>
|
|
|
|
- <Checkbox checked={!this.state.budgetCost} onChange={(e) => { if (e.target.checked) { this.setState({ budgetCost: null }) } }}>自定义金额</Checkbox>
|
|
|
|
- <InputNumber style={{ width: 80 }} disabled={Boolean(this.state.budgetCost)} onChange={(e) => { this.state.budgetCostLower = e.target.value; }} />
|
|
|
|
- <span> 到 </span>
|
|
|
|
- <InputNumber style={{ width: 80 }} disabled={Boolean(this.state.budgetCost)} onChange={(e) => { this.state.budgetCostUpper = e.target.value; }} />
|
|
|
|
- <span> 万元</span>
|
|
|
|
- <Button style={{ marginLeft: '20px' }} disabled={Boolean(this.state.budgetCost)} onClick={this.loadData}>确定</Button>
|
|
|
|
- </Col>
|
|
|
|
- </Row>
|
|
|
|
- <Row className="search-criteria">
|
|
|
|
- <Col className="search-title" span={2}>
|
|
|
|
- <span>技术类型</span>
|
|
|
|
- </Col>
|
|
|
|
- <Col className="search-select" span={22}>
|
|
|
|
- <Radio.Group defaultValue={999} onChange={(e) => {
|
|
|
|
- this.setState({
|
|
|
|
- demandType: e.target.value
|
|
|
|
- });
|
|
|
|
- this.state.demandType = e.target.value;
|
|
|
|
- this.loadData();
|
|
|
|
- }}>
|
|
|
|
- {this.state.demandTypeRadio}
|
|
|
|
- </Radio.Group>
|
|
|
|
- </Col>
|
|
|
|
- </Row>
|
|
|
|
- <Row className="search-criteria" style={{ paddingBottom: '10px' }}>
|
|
|
|
- <Col className="search-title" span={2}>
|
|
|
|
- <span>关键字</span>
|
|
|
|
- </Col>
|
|
|
|
- <Col className="search-select" span={22}>
|
|
|
|
- <Input style={{ width: 120 }} onChange={(e) => { this.state.keyword = e.target.value; }} />
|
|
|
|
- <Button style={{ marginLeft: '20px' }} onClick={() => { this.loadData() }}>确定</Button>
|
|
|
|
- </Col>
|
|
|
|
- </Row>
|
|
|
|
- <Spin spinning={this.state.loading}>
|
|
|
|
- <Table columns={this.state.columns}
|
|
|
|
- dataSource={this.state.dataSource}
|
|
|
|
- pagination={this.state.pagination}
|
|
|
|
- onRowClick={this.tableRowClick} />
|
|
|
|
- </Spin>
|
|
|
|
- <DemandDesc
|
|
|
|
- data={this.state.RowData}
|
|
|
|
- showDesc={this.state.showDesc}
|
|
|
|
- closeDesc={this.closeDesc} />
|
|
|
|
- </div >
|
|
|
|
|
|
+ {this.state.demandTypeRadio}
|
|
|
|
+ </Radio.Group>
|
|
|
|
+ </Col>
|
|
|
|
+ </Row>
|
|
|
|
+ <Spin spinning={this.state.loading} style={{ marginBottom: '40px' }}>
|
|
|
|
+ <div className='detail_interest_sub'>
|
|
|
|
+ {this.state.dataSource.map((item) => {
|
|
|
|
+ return <li key={item.id}>
|
|
|
|
+ <div className="interest_list_title">
|
|
|
|
+ <img src={demand_sup} alt="" />
|
|
|
|
+ <span>{item.name}</span>
|
|
|
|
+ <div className="interest_list_confirm">
|
|
|
|
+ <span>{item.level ? '身份已验证' : '身份未验证'}</span>
|
|
|
|
+ <img src={item.level ? certify : uncertify} alt="" />
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <div className="detial_sub">
|
|
|
|
+ <span className="detial_sub_icon">
|
|
|
|
+ <img src={demand_ico_5} alt="需求" />
|
|
|
|
+ </span>
|
|
|
|
+ <span className="detial_sub_title">需求: </span>
|
|
|
|
+ <span className="detial_sub_text">{item.problemDes}</span>
|
|
|
|
+ </div>
|
|
|
|
+ <div className="detial_sub">
|
|
|
|
+ <span className="detial_sub_icon">
|
|
|
|
+ <img src={demand_ico_3} alt="预算" />
|
|
|
|
+ </span>
|
|
|
|
+ <span className="detial_sub_title">预算: </span>
|
|
|
|
+ <span className="money_text">{item.budgetCost ? item.budgetCost + ' 元' : '价格面议'}</span>
|
|
|
|
+ </div>
|
|
|
|
+ <div className="detial_sub">
|
|
|
|
+ <span className="detial_sub_icon">
|
|
|
|
+ <img src={demand_ico_2} alt="类型" />
|
|
|
|
+ </span>
|
|
|
|
+ <span className="detial_sub_title">类型: </span>
|
|
|
|
+ <span className="detial_sub_text">{getDemandType(item.demandType)}</span>
|
|
|
|
+ </div>
|
|
|
|
+ <div className="detial_sub">
|
|
|
|
+ <span className="detial_sub_icon">
|
|
|
|
+ <img src={demand_ico_1} alt="行业" />
|
|
|
|
+ </span>
|
|
|
|
+ <span className="detial_sub_title">行业: </span>
|
|
|
|
+ <span className="detial_sub_text">{getIndustryCategory(item.industryCategoryA, item.industryCategoryB)}</span>
|
|
|
|
+ </div>
|
|
|
|
+ </li>
|
|
|
|
+ })}
|
|
|
|
+ </div>
|
|
|
|
+ <Pagination style={{ float: 'right' }}
|
|
|
|
+ onChange={(e) => { this.loadData(e); }}
|
|
|
|
+ total={total}
|
|
|
|
+ showTotal={() => { return '共' + total + '条数据' }}
|
|
|
|
+ current={pageNo}
|
|
|
|
+ pageSize={pageSize} />
|
|
|
|
+ </Spin>
|
|
|
|
+ </div >
|
|
|
|
+ </div>
|
|
)
|
|
)
|
|
}
|
|
}
|
|
});
|
|
});
|