|
@@ -0,0 +1,376 @@
|
|
|
+import React from 'react';
|
|
|
+import { Icon, message, Row, Col, Select, Radio, Checkbox, Input, InputNumber, Button, Table, Spin, Pagination } from 'antd';
|
|
|
+import '../portal.less';
|
|
|
+import { techFieldList, getTechField } from '../../DicTechFieldList';
|
|
|
+import { provinceList, getProvince } from '../../NewDicProvinceList';
|
|
|
+import { companySearch } from '../../tools';
|
|
|
+import ajax from 'jquery/src/ajax/xhr.js';
|
|
|
+import $ from 'jquery/src/ajax';
|
|
|
+
|
|
|
+
|
|
|
+import avatarImg from '../../../../image/avatarImg.png';
|
|
|
+
|
|
|
+const Content = React.createClass({
|
|
|
+ loadData(pageNo) {
|
|
|
+ this.setState({
|
|
|
+ loading: true
|
|
|
+ });
|
|
|
+ $.ajax({
|
|
|
+ method: "get",
|
|
|
+ dataType: "json",
|
|
|
+ url: globalConfig.context + "/portal/search/subscriberList",
|
|
|
+ data: {
|
|
|
+ "level": this.state.level, //认证状态 (0--未认证,1--认证)
|
|
|
+ "type": this.state.type, //用户类型 (0--个人用户,1--组织用户)
|
|
|
+ "field": this.state.firstField ? ((this.state.firstField || '') + ',' + (this.state.secondField || '') + ',' + (this.state.thirdField || '')) : null,
|
|
|
+ "province": this.state.province,
|
|
|
+ "city": this.state.city,
|
|
|
+ "area": this.state.area,
|
|
|
+ "name": this.state.searchName,
|
|
|
+ "pageNo": pageNo || 1,
|
|
|
+ "pageSize": this.state.pagination.pageSize
|
|
|
+ },
|
|
|
+ success: function (data) {
|
|
|
+ let theArr = [];
|
|
|
+ if (!data.data || !data.data.list) {
|
|
|
+ if (data.error && data.error.length) {
|
|
|
+ message.warning(data.error[0].message);
|
|
|
+ };
|
|
|
+ } else {
|
|
|
+ for (let i = 0; i < data.data.list.length; i++) {
|
|
|
+ let thisdata = data.data.list[i];
|
|
|
+ theArr.push({
|
|
|
+ key: i,
|
|
|
+ uid: thisdata.uid, //用户ID
|
|
|
+ identityId: thisdata.identityId, //认证ID (详情接口传入ID)
|
|
|
+ username: thisdata.username,// 用户名称
|
|
|
+ unitName: thisdata.unitName,
|
|
|
+ personPortraitUrl: thisdata.personPortraitUrl,//用户头像URL
|
|
|
+ logoUrl: thisdata.logoUrl,
|
|
|
+ achievementNum: thisdata.achievementNum, //科技成果数量
|
|
|
+ demandNum: thisdata.demandNum, //科技需求数量
|
|
|
+ province: thisdata.province
|
|
|
+ });
|
|
|
+ };
|
|
|
+ };
|
|
|
+ this.state.pagination.pageNo = data.data.pageNo;
|
|
|
+ this.state.pagination.total = data.data.totalCount;
|
|
|
+ this.setState({
|
|
|
+ dataSource: theArr,
|
|
|
+ pagination: this.state.pagination
|
|
|
+ });
|
|
|
+ }.bind(this),
|
|
|
+ }).done(function (data) {
|
|
|
+ if (data.error && data.error.length) {
|
|
|
+ message.warning(data.error[0].message);
|
|
|
+ };
|
|
|
+ this.setState({
|
|
|
+ loading: false
|
|
|
+ });
|
|
|
+ }.bind(this));
|
|
|
+ },
|
|
|
+ getInitialState() {
|
|
|
+ return {
|
|
|
+ loading: false,
|
|
|
+ type: 0,
|
|
|
+ pagination: {
|
|
|
+ pageNo: 1,
|
|
|
+ pageSize: 15,
|
|
|
+ total: 0
|
|
|
+ },
|
|
|
+ dataSource: []
|
|
|
+ };
|
|
|
+ },
|
|
|
+ componentWillMount() {
|
|
|
+ let theFieldArr = [], theProvinceArr = [];
|
|
|
+ techFieldList.map((item) => {
|
|
|
+ theFieldArr.push(
|
|
|
+ <Select.Option key={item.value}>{item.label}</Select.Option>
|
|
|
+ )
|
|
|
+ });
|
|
|
+ provinceList.map((item) => {
|
|
|
+ theProvinceArr.push(
|
|
|
+ <Select.Option key={item.id}>{item.name}</Select.Option>
|
|
|
+ )
|
|
|
+ });
|
|
|
+ this.state.fieldFirstOption = theFieldArr;
|
|
|
+ this.state.provinceOption = theProvinceArr;
|
|
|
+ this.loadData();
|
|
|
+ },
|
|
|
+ fieldFirstChange(e) {
|
|
|
+ let theArr = [];
|
|
|
+ techFieldList.map((item) => {
|
|
|
+ if (item.value == e) {
|
|
|
+ item.children.map((children) => {
|
|
|
+ theArr.push(
|
|
|
+ <Select.Option key={children.value}>{children.label}</Select.Option>
|
|
|
+ )
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ this.setState({
|
|
|
+ fieldSecondOption: theArr,
|
|
|
+ firstField: e,
|
|
|
+ secondField: undefined,
|
|
|
+ thirdField: undefined
|
|
|
+ })
|
|
|
+ },
|
|
|
+ fieldSecondChange(e) {
|
|
|
+ let theArr = [], _me = this;
|
|
|
+ techFieldList.map((item) => {
|
|
|
+ if (item.value == _me.state.firstField) {
|
|
|
+ item.children.map((children) => {
|
|
|
+ if (children.value == e) {
|
|
|
+ children.children.map((third) => {
|
|
|
+ theArr.push(
|
|
|
+ <Select.Option key={third.value}>{third.label}</Select.Option>
|
|
|
+ )
|
|
|
+ })
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ this.setState({
|
|
|
+ fieldThirdOption: theArr,
|
|
|
+ secondField: e,
|
|
|
+ thirdField: undefined
|
|
|
+ })
|
|
|
+ },
|
|
|
+ provinceChange(e) {
|
|
|
+ let theArr = [];
|
|
|
+ provinceList.map((item) => {
|
|
|
+ if (item.id == e) {
|
|
|
+ item.cityList.map((city) => {
|
|
|
+ theArr.push(
|
|
|
+ <Select.Option key={city.id}>{city.name}</Select.Option>
|
|
|
+ )
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ this.setState({
|
|
|
+ cityOption: theArr,
|
|
|
+ province: e,
|
|
|
+ city: undefined,
|
|
|
+ area: undefined
|
|
|
+ })
|
|
|
+ },
|
|
|
+ cityChange(e) {
|
|
|
+ let theArr = [], _me = this;
|
|
|
+ provinceList.map((item) => {
|
|
|
+ if (item.id == _me.state.province) {
|
|
|
+ item.cityList.map((city) => {
|
|
|
+ if (city.id == e) {
|
|
|
+ city.areaList.map((area) => {
|
|
|
+ theArr.push(
|
|
|
+ <Select.Option key={area.id}>{area.name}</Select.Option>
|
|
|
+ )
|
|
|
+ });
|
|
|
+ };
|
|
|
+ });
|
|
|
+ };
|
|
|
+ });
|
|
|
+ this.setState({
|
|
|
+ areaOption: theArr,
|
|
|
+ city: e,
|
|
|
+ area: undefined
|
|
|
+ })
|
|
|
+ },
|
|
|
+ tableRowClick(record, index) {
|
|
|
+ this.state.RowData = record;
|
|
|
+ },
|
|
|
+ interest(e) {
|
|
|
+ this.setState({
|
|
|
+ loading: true
|
|
|
+ });
|
|
|
+ $.ajax({
|
|
|
+ method: "POST",
|
|
|
+ dataType: "json",
|
|
|
+ url: globalConfig.context + "/api/user/interest/interestUser",
|
|
|
+ data: {
|
|
|
+ toUid: e
|
|
|
+ }
|
|
|
+ }).done(function (data) {
|
|
|
+ if (data.error && data.error.length) {
|
|
|
+ message.warning(data.error[0].message);
|
|
|
+ };
|
|
|
+ this.setState({
|
|
|
+ loading: false
|
|
|
+ });
|
|
|
+ }.bind(this));
|
|
|
+ },
|
|
|
+ cancelInterest(e) {
|
|
|
+ this.setState({
|
|
|
+ loading: true
|
|
|
+ });
|
|
|
+ $.ajax({
|
|
|
+ method: "POST",
|
|
|
+ dataType: "json",
|
|
|
+ url: globalConfig.context + "/api/user/interest/cancelInterest",
|
|
|
+ data: {
|
|
|
+ interestId: e
|
|
|
+ }
|
|
|
+ }).done(function (data) {
|
|
|
+ if (data.error && data.error.length) {
|
|
|
+ message.warning(data.error[0].message);
|
|
|
+ };
|
|
|
+ this.setState({
|
|
|
+ loading: false
|
|
|
+ });
|
|
|
+ }.bind(this));
|
|
|
+ },
|
|
|
+ render() {
|
|
|
+ const { pageNo, pageSize, total } = this.state.pagination;
|
|
|
+ const _me = this;
|
|
|
+ return (
|
|
|
+ <div className="portal-content clearfix" >
|
|
|
+ <Row className="search-criteria">
|
|
|
+ <Col className="search-title" span={2}>
|
|
|
+ <span>行业分类</span>
|
|
|
+ </Col>
|
|
|
+ <Col className="search-select" span={22}>
|
|
|
+ <Select style={{ width: 160, marginRight: '10px', marginBottom: '10px' }}
|
|
|
+ value={this.state.firstField}
|
|
|
+ placeholder="请选择行业一级分类"
|
|
|
+ notFoundContent="未获取到行业分类"
|
|
|
+ showSearch
|
|
|
+ filterOption={companySearch}
|
|
|
+ onChange={this.fieldFirstChange}>
|
|
|
+ {this.state.fieldFirstOption}
|
|
|
+ </Select>
|
|
|
+ <Select style={{ width: 200, marginRight: '10px', marginBottom: '10px' }}
|
|
|
+ value={this.state.secondField}
|
|
|
+ placeholder="请选择行业二级分类"
|
|
|
+ notFoundContent="未获取到行业分类"
|
|
|
+ showSearch
|
|
|
+ filterOption={companySearch}
|
|
|
+ onChange={this.fieldSecondChange}>
|
|
|
+ {this.state.fieldSecondOption}
|
|
|
+ </Select>
|
|
|
+ <Select style={{ width: 240, marginRight: '10px', marginBottom: '10px' }}
|
|
|
+ value={this.state.thirdField}
|
|
|
+ placeholder="请选择行业三级分类"
|
|
|
+ notFoundContent="未获取到行业分类"
|
|
|
+ showSearch
|
|
|
+ filterOption={companySearch}
|
|
|
+ onChange={(e) => { this.setState({ thirdField: e }) }}>
|
|
|
+ {this.state.fieldThirdOption}
|
|
|
+ </Select>
|
|
|
+ <Button type="ghost" style={{ marginLeft: '20px' }}
|
|
|
+ onClick={() => {
|
|
|
+ this.setState({
|
|
|
+ firstField: undefined,
|
|
|
+ secondField: undefined,
|
|
|
+ thirdField: undefined
|
|
|
+ });
|
|
|
+ this.state.firstField = undefined;
|
|
|
+ this.state.secondField = undefined;
|
|
|
+ this.state.thirdField = undefined;
|
|
|
+ this.loadData();
|
|
|
+ }}>不限</Button>
|
|
|
+ </Col>
|
|
|
+ </Row>
|
|
|
+ <Row className="search-criteria">
|
|
|
+ <Col className="search-title" span={2}>
|
|
|
+ <span>地区</span>
|
|
|
+ </Col>
|
|
|
+ <Col className="search-select" span={22}>
|
|
|
+ <Select style={{ width: 100, marginRight: '10px', marginBottom: '10px' }}
|
|
|
+ value={this.state.province}
|
|
|
+ placeholder="请选择省份"
|
|
|
+ notFoundContent="未获取到省份列表"
|
|
|
+ showSearch
|
|
|
+ filterOption={companySearch}
|
|
|
+ onChange={this.provinceChange}>
|
|
|
+ {this.state.provinceOption}
|
|
|
+ </Select>
|
|
|
+ <Select style={{ width: 160, marginRight: '10px', marginBottom: '10px' }}
|
|
|
+ value={this.state.city}
|
|
|
+ placeholder="请选择行业城市"
|
|
|
+ notFoundContent="未获取到城市列表"
|
|
|
+ showSearch
|
|
|
+ filterOption={companySearch}
|
|
|
+ onChange={this.cityChange}>
|
|
|
+ {this.state.cityOption}
|
|
|
+ </Select>
|
|
|
+ <Select style={{ width: 160, marginRight: '10px', marginBottom: '10px' }}
|
|
|
+ value={this.state.area}
|
|
|
+ placeholder="请选择行政区"
|
|
|
+ notFoundContent="未获取到行政区列表"
|
|
|
+ showSearch
|
|
|
+ filterOption={companySearch}
|
|
|
+ onChange={(e) => { this.setState({ area: e }) }}>
|
|
|
+ {this.state.areaOption}
|
|
|
+ </Select>
|
|
|
+ <Button type="ghost" style={{ marginLeft: '20px' }}
|
|
|
+ onClick={() => {
|
|
|
+ this.setState({
|
|
|
+ province: undefined,
|
|
|
+ city: undefined,
|
|
|
+ area: undefined
|
|
|
+ });
|
|
|
+ this.state.province = undefined;
|
|
|
+ this.state.city = undefined;
|
|
|
+ this.state.area = undefined;
|
|
|
+ this.loadData();
|
|
|
+ }}>不限</Button>
|
|
|
+ </Col>
|
|
|
+ </Row>
|
|
|
+ <Row className="search-criteria">
|
|
|
+ <Col className="search-title" span={2}>
|
|
|
+ <span>用户类型</span>
|
|
|
+ </Col>
|
|
|
+ <Col className="search-select" span={6}>
|
|
|
+ <Radio.Group defaultValue={0} onChange={(e) => {
|
|
|
+ this.setState({
|
|
|
+ type: e.target.value
|
|
|
+ });
|
|
|
+ this.state.type = e.target.value;
|
|
|
+ this.loadData();
|
|
|
+ }}>
|
|
|
+ <Radio.Button value={0}>个人</Radio.Button>
|
|
|
+ <Radio.Button value={1}>组织</Radio.Button>
|
|
|
+ </Radio.Group>
|
|
|
+ </Col>
|
|
|
+ </Row>
|
|
|
+ <Row className="search-criteria">
|
|
|
+ <Col className="search-title" span={2}>
|
|
|
+ <span>用户名</span>
|
|
|
+ </Col>
|
|
|
+ <Col className="search-select" span={6}>
|
|
|
+ <Input style={{ width: 200, marginBottom: '10px' }} value={this.state.searchName} onChange={(e) => { this.setState({ searchName: e.target.value }) }} />
|
|
|
+ <Button type="primary" style={{ marginLeft: '20px' }}
|
|
|
+ onClick={() => { this.loadData(); }}>搜索</Button>
|
|
|
+ </Col>
|
|
|
+ </Row>
|
|
|
+ <Spin spinning={this.state.loading}>
|
|
|
+ <ul className="clearfix">
|
|
|
+ {this.state.dataSource.map((item) => {
|
|
|
+ return <li className="user-detail">
|
|
|
+ <div className="logo">
|
|
|
+ <img src={(item.personPortraitUrl || item.logoUrl) ?
|
|
|
+ (globalConfig.avatarHost + "/upload" + (_me.state.type == 0 ? item.personPortraitUrl : item.logoUrl))
|
|
|
+ : avatarImg } alt="头像" />
|
|
|
+ </div>
|
|
|
+ <div className="name" style={{display:'none'}}>
|
|
|
+ {_me.state.type == 0 ? item.username : item.unitName}
|
|
|
+ <a onClick={_me.interest.bind(_me, item.uid)} className="follow"><Icon type="heart-o" />感兴趣</a>
|
|
|
+ </div>
|
|
|
+ <div className="province">{getProvince(item.province)}</div>
|
|
|
+ <div className="text">{'需求:' + item.demandNum + '条'}</div>
|
|
|
+ <div className="text">{'技术成果:' + item.achievementNum + '条'}</div>
|
|
|
+ </li>
|
|
|
+ })}
|
|
|
+ </ul>
|
|
|
+ <Pagination style={{ float: 'right' }}
|
|
|
+ onChange={(e) => { this.loadData(e); }}
|
|
|
+ total={total}
|
|
|
+ showTotal={() => { return '共' + total + '条数据' }}
|
|
|
+ current={pageNo}
|
|
|
+ pageSize={pageSize} />
|
|
|
+ </Spin>
|
|
|
+ </div >
|
|
|
+ )
|
|
|
+ }
|
|
|
+});
|
|
|
+
|
|
|
+export default Content;
|