|
|
import React, {Component} from 'react';
|
|
|
import {Link} from "react-router-dom";
|
|
|
import axios from 'axios';
|
|
|
import { Input ,Icon,Button,Pagination,DatePicker,Breadcrumb} from 'antd';
|
|
|
import { handleDateString,markdownToHTML,bytesToSize,getImageUrl} from 'educoder';
|
|
|
import NEITaskDetailsModel from './NEITaskDetailsModel';
|
|
|
import moment from 'moment';
|
|
|
import '../packageconcnet.css';
|
|
|
import './pds.css'
|
|
|
import gouxuan from './img/gouxuan.png'
|
|
|
import weigouxuan from './img/weigouxuan.png'
|
|
|
const { Search } = Input;
|
|
|
// let categorylist=[
|
|
|
// {name:"全部",value:undefined},
|
|
|
// {name:"前端开发",value:"front"},
|
|
|
// {name:"后端开发",value:"backend"},
|
|
|
// {name:"移动开发",value:"mobile"},
|
|
|
// {name:"数据库",value:"database"},
|
|
|
// {name:"云计算和大数据",value:"cloud_compute_and_big_data"},
|
|
|
// {name:"人工智能",value:"ai"},
|
|
|
// {name:"其他",value:"other"},
|
|
|
// ]
|
|
|
//
|
|
|
// function setcategorylist(val){
|
|
|
// let vals=""
|
|
|
// categorylist.some((item,key)=> {
|
|
|
// if (item.value === val) {
|
|
|
// vals=item.name
|
|
|
// return true
|
|
|
// }
|
|
|
// }
|
|
|
// )
|
|
|
//
|
|
|
// return vals
|
|
|
// }
|
|
|
|
|
|
class PackageIndexNEITaskDetails extends Component {
|
|
|
constructor(props) {
|
|
|
super(props)
|
|
|
this.contentMdRef = React.createRef();
|
|
|
this.state = {
|
|
|
data:undefined,
|
|
|
modalCancel: false,
|
|
|
overtype:false,
|
|
|
setbiddingmantype:false,
|
|
|
datalist:[]
|
|
|
}
|
|
|
}
|
|
|
|
|
|
componentDidMount() {
|
|
|
this.getdatas()
|
|
|
window.document.title = '众包创新'
|
|
|
}
|
|
|
|
|
|
getdatas=()=>{
|
|
|
let url =`/project_packages/${this.props.match.params.id}.json`;
|
|
|
axios.get(url).then((response) => {
|
|
|
this.setState({
|
|
|
data:response.data
|
|
|
})
|
|
|
}).catch((error) => {
|
|
|
console.log(error);
|
|
|
|
|
|
})
|
|
|
}
|
|
|
|
|
|
setbiddingman=()=>{
|
|
|
this.setState({
|
|
|
setbiddingmantype:true
|
|
|
})
|
|
|
}
|
|
|
|
|
|
notsetbiddingman=()=>{
|
|
|
let {data} =this.state;
|
|
|
let gouxuans2=data.bidding_users
|
|
|
for (var i=0;i<gouxuans2.length;i++){
|
|
|
if(gouxuans2[i].bool === true){
|
|
|
gouxuans2[i].bool=false;
|
|
|
}
|
|
|
}
|
|
|
this.setState({
|
|
|
setbiddingmantype:false,
|
|
|
datalist:[]
|
|
|
})
|
|
|
}
|
|
|
modalCancel=()=>{
|
|
|
this.setState({
|
|
|
modalCancel:false
|
|
|
})
|
|
|
}
|
|
|
|
|
|
setbiddingusers=()=>{
|
|
|
let{datalist}=this.state;
|
|
|
if(datalist.length>0){
|
|
|
this.setState({
|
|
|
applytype:true,
|
|
|
applyvalue:`选择的${datalist.length}个竞标者将被设定为“中标”`,
|
|
|
applybottom:"是否确认执行？",
|
|
|
applycancel:this.setApplycancel,
|
|
|
applyconfirm:this.setApplysumbit
|
|
|
})
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
setApplysumbit=()=>{
|
|
|
this.setState({
|
|
|
applytype:false,
|
|
|
})
|
|
|
let{datalist}=this.state;
|
|
|
let newlist=[];
|
|
|
datalist.map((item,key)=>{
|
|
|
newlist.push(item.id)
|
|
|
})
|
|
|
|
|
|
|
|
|
let url=`/project_packages/${this.props.match.params.id}/bidding_users/win.json`;
|
|
|
axios.post(url,{
|
|
|
user_ids:newlist
|
|
|
}).then((response) => {
|
|
|
if(response.data.status===0){
|
|
|
this.props.showSnackbar("提交成功");
|
|
|
this.setState({
|
|
|
setbiddingmantype:false
|
|
|
})
|
|
|
this.getdatas()
|
|
|
}else if(response.data.status===-1){
|
|
|
this.props.showSnackbar(response.data.message);
|
|
|
}
|
|
|
}).catch((error) => {
|
|
|
console.log(error)
|
|
|
})
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
Clickteacher2=(e)=>{
|
|
|
let {data} =this.state;
|
|
|
let newlist=[]
|
|
|
let gouxuans2=data.bidding_users
|
|
|
for (var i=0;i<gouxuans2.length;i++){
|
|
|
if(gouxuans2[i].id === e){
|
|
|
// console.log("51");
|
|
|
// console.log(e);
|
|
|
if(gouxuans2[i].bool === true){
|
|
|
gouxuans2[i].bool=false;
|
|
|
}else{
|
|
|
gouxuans2[i].bool=true;
|
|
|
newlist.push(gouxuans2[i])
|
|
|
}
|
|
|
}else{
|
|
|
if(gouxuans2[i].bool === true){
|
|
|
newlist.push(gouxuans2[i])
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
console.log(newlist);
|
|
|
this.setState({
|
|
|
datalist:newlist,
|
|
|
})
|
|
|
|
|
|
}
|
|
|
setover=()=>{
|
|
|
this.setState({
|
|
|
overtype:true
|
|
|
})
|
|
|
}
|
|
|
|
|
|
setout=()=>{
|
|
|
this.setState({
|
|
|
overtype:false
|
|
|
})
|
|
|
}
|
|
|
|
|
|
deletePackages=()=>{
|
|
|
this.setState({
|
|
|
applytype:true,
|
|
|
applyvalue:"是否确认删除?",
|
|
|
applycancel:this.setApplycancel,
|
|
|
applyconfirm:this.setApplydelect
|
|
|
})
|
|
|
}
|
|
|
|
|
|
setApplydelect=()=>{
|
|
|
this.setState({
|
|
|
applytype:false,
|
|
|
})
|
|
|
let url=`/project_packages/${this.props.match.params.id}.json`;
|
|
|
axios.delete(url ).then((response) => {
|
|
|
// const status = response.data.status
|
|
|
// console.log(response)
|
|
|
this.props.showSnackbar('删除成功');
|
|
|
}).catch((error) => {
|
|
|
console.log(error)
|
|
|
})
|
|
|
}
|
|
|
|
|
|
setBiddingApply=()=>{
|
|
|
this.setState({
|
|
|
applytype:true,
|
|
|
applyvalue:"是否确认报名?",
|
|
|
applycancel:this.setApplycancel,
|
|
|
applyconfirm:this.setApplyconfirm
|
|
|
})
|
|
|
}
|
|
|
|
|
|
setApplycancel=()=>{
|
|
|
this.setState({
|
|
|
applytype:false,
|
|
|
})
|
|
|
}
|
|
|
|
|
|
setApplyconfirm=()=>{
|
|
|
this.setState({
|
|
|
applytype:false,
|
|
|
})
|
|
|
let url=`/project_packages/${this.props.match.params.id}/bidding_users.json`;
|
|
|
axios.post(url).then((response) => {
|
|
|
if(response.data.status===0){
|
|
|
this.props.showSnackbar("报名成功");
|
|
|
this.getdatas()
|
|
|
}else if(response.data.status===-1){
|
|
|
this.props.showSnackbar(response.data.message);
|
|
|
}
|
|
|
}).catch((error) => {
|
|
|
console.log(error)
|
|
|
})
|
|
|
|
|
|
}
|
|
|
goback = () => {
|
|
|
// window.history.go(-1)
|
|
|
// window.location.href="/crowdsourcing";
|
|
|
this.props.history.goBack()
|
|
|
}
|
|
|
|
|
|
render() {
|
|
|
let {overtype,data}=this.state;
|
|
|
// console.log(data&&data.creator.login)
|
|
|
console.log(data)
|
|
|
return (
|
|
|
data===undefined?"":<div>
|
|
|
<div className="clearfix">
|
|
|
<NEITaskDetailsModel
|
|
|
applytype={this.state.applytype}
|
|
|
applyvalue={this.state.applyvalue}
|
|
|
applybottom={this.state.applybottom}
|
|
|
applycancel={this.state.applycancel}
|
|
|
applyconfirm={this.state.applyconfirm}
|
|
|
/>
|
|
|
<div className={"educontent mt20 mb50"}>
|
|
|
|
|
|
<Breadcrumb separator={'>'} className={"fl"}>
|
|
|
{/*<Breadcrumb.Item>{this.props.current_user.username}</Breadcrumb.Item>*/}
|
|
|
<Breadcrumb.Item>
|
|
|
<a href="/crowdsourcing">众包创新</a>
|
|
|
</Breadcrumb.Item>
|
|
|
<Breadcrumb.Item><span className={"tabelcli"} title={data&&data.title}>{data&&data.title}</span></Breadcrumb.Item>
|
|
|
|
|
|
</Breadcrumb>
|
|
|
<a className="color-grey-6 fr font-15 mr20" onClick={this.goback}>返回</a>
|
|
|
<div className="mb20">
|
|
|
|
|
|
<p className="clearfix ">
|
|
|
|
|
|
<div className={"stud-class-set coursenavbox edu-back-white mt20"}>
|
|
|
<div className={"ant-row contentbox mdInForm "}>
|
|
|
|
|
|
<div className="educontent project-packages-list relative">
|
|
|
{data&&data.status==="pending"?<div>
|
|
|
<div className="publicpart orangeBlack "></div>
|
|
|
<span className="smalltrangle"></span>
|
|
|
<span className="publicword publicwords"> 未申请 </span>
|
|
|
</div>:data&&data.status==="applying"?<div>
|
|
|
<div className="publicpart orangeGreen"></div>
|
|
|
<span className="smalltrangle"></span>
|
|
|
<span className="publicword publicwords"> 待发布 </span>
|
|
|
</div>:""}
|
|
|
|
|
|
<div className="project-package-item project-package-items height185">
|
|
|
<div className="item-image">
|
|
|
<div className="fl edu-back-white ">
|
|
|
<a href={`/users/${data&&data.creator.login}`}>
|
|
|
<img alt="头像" className="radius mt10 ml5" height="70" id="nh_user_logo" name="avatar_image"
|
|
|
src={`/images/${data&&data.creator.image_url}`}
|
|
|
width="70"/>
|
|
|
</a>
|
|
|
<div className=" edu-back-white pagemancenter mt10 ">
|
|
|
{data&&data.creator.name}
|
|
|
</div>
|
|
|
|
|
|
{data&&data.creator.login===this.props.current_user&&this.props.current_user.login?"":<div className=" edu-back-white ml5 mt10 "
|
|
|
onMouseOver={this.setover}
|
|
|
onMouseOut={this.setout}
|
|
|
>
|
|
|
{overtype===false?<a className="ContacttheTA fl" target="_blank" href={`/users/${data&&data.creator.login}/message_detail?user_id=${data&&data.creator.id}`}> <img alt="头像" class="mr5" src={require('./newsone.png')} />联系TA</a>:
|
|
|
<a className="ContacttheTAs fl" target="_blank" href={`/users/${data&&data.creator.login}/message_detail?user_id=${data&&data.creator.id}`}> <img alt="头像" className="mr5"
|
|
|
src={require('./newstwo.png')}/>联系TA</a>}
|
|
|
</div>}
|
|
|
</div>
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div className=" item-body">
|
|
|
|
|
|
<div className=" item-head mbf10">
|
|
|
|
|
|
<div className=" item-head-title ">
|
|
|
<span className={"fl mt3 font-18 font-bd color-dark maxwidth700 "}
|
|
|
title={data&&data.title}
|
|
|
>{data&&data.title}
|
|
|
</span>
|
|
|
</div>
|
|
|
|
|
|
<div className=" item-head-price mtf7">
|
|
|
{data&&data.min_price===null?"":<span>￥<span className={"font-24"}>{data&&data.min_price}</span></span>}
|
|
|
{data&&data.max_price===null||data&&data.min_price===null?"":<span>~</span>}
|
|
|
{data&&data.max_price===null?"":<span>￥<span className={"font-24"}>{data&&data.max_price}</span></span>}
|
|
|
{data&&data.min_price===null&&data&&data.max_price===null?<span>可议价</span>:""}
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div className="item-category">
|
|
|
<div className="item-category-item">{data&&data.category_name}</div>
|
|
|
</div>
|
|
|
|
|
|
<div className=" item-other">
|
|
|
<div>
|
|
|
{data&&data.published_at===null?<span className="item-group-text">
|
|
|
更新时间：{moment(data&&data.updated_at).format("YYYY-MM-DD HH:mm")}
|
|
|
</span>:<span className="item-group-text">
|
|
|
发布时间：{moment(data&&data.published_at).format("YYYY-MM-DD HH:mm")}
|
|
|
</span>}
|
|
|
</div>
|
|
|
<div className=" item-group item-other-deadline ml40">
|
|
|
<span className="item-group-text">竞标截止时间：{moment(data&&data.deadline_at).format("YYYY-MM-DD HH:mm")}</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
{/*详情*/}
|
|
|
<div className={"stud-class-set padding26 coursenavbox edu-back-white mt20"}>
|
|
|
<div>
|
|
|
<div className={"longboxs"}>
|
|
|
需求详情：
|
|
|
|
|
|
{data&&data.status==="pending"&&data&&data.operation.can_select_bidding_user===true?<div className="fr">
|
|
|
<a className="task-btn-nebules fr" href={`/crowdsourcing/${this.props.match.params.id}/edit`}>编辑</a>
|
|
|
<a className="task-btn-nebules fr" onClick={this.deletePackages}>删除</a>
|
|
|
</div>:""}
|
|
|
|
|
|
</div>
|
|
|
<div className={"padding020"}>
|
|
|
<div className={"markdown-body"} dangerouslySetInnerHTML={{__html: markdownToHTML(data&&data.content).replace(/▁/g,"▁▁▁")}}></div>
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
{data&&data.attachments.length>0?<div>
|
|
|
<div className={"longboxs "}>
|
|
|
需求文件：
|
|
|
</div>
|
|
|
{data&&data.attachments.map((item,key)=>{
|
|
|
return(
|
|
|
<div className={"newForm newFormbox mt10 "}>
|
|
|
<i className="color-green iconfont icon-fujian mr5 fl font-14 mt3"></i>
|
|
|
<a className="upload_filename color-grey readonly hidden fl mtf3 mr10 ml5" href={item.url}>{item.title} {bytesToSize(item.filesize)}</a>
|
|
|
</div>
|
|
|
)})}
|
|
|
</div>:""}
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
{/*发布者和竞选者状态show*/}
|
|
|
{this.state.setbiddingmantype===false&&data&&data.published_at!=null?<div className={"stud-class-set coursenavbox edu-back-white mt20"}>
|
|
|
{/*下面是头像*/}
|
|
|
<div className={"stud-class-set pd26 coursenavbox edu-back-white"}>
|
|
|
<div className={"relativef"}>
|
|
|
<div className={"longboxs mb0"}>
|
|
|
报名列表({data&&data.bidding_users.length})
|
|
|
</div>
|
|
|
<div className="packageabsolute">
|
|
|
{data&&data.operation.can_bidding===true?<Button type="primary" className="defalutSubmitbtn fl ml20 defalutSubmitbtns" onClick={this.setBiddingApply}>竞标报名</Button>:""}
|
|
|
{data&&data.operation.can_select_bidding_user===true?<Button type="primary" className="defalutSubmitbtn fl ml20 defalutSubmitbtns" onClick={this.setbiddingman}>选择中标者</Button>:""}
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<div className={"ysllogin_register_contentss edu-back-white "} style={{borderTop: '1px solid rgb(234, 234, 234)'}}>
|
|
|
<div className="ysllogin_sections">
|
|
|
<div className="ysldivhome2s">
|
|
|
<div style={{height: "20px"}}> </div>
|
|
|
|
|
|
{data&&data.bidding_users.map((item,key)=>{
|
|
|
return(
|
|
|
<div className="ysldivhomediv1s homehove" key={key}>
|
|
|
{item.status==="bidding_won"?<img src={gouxuan} className="yslgouxuanimg"/>:""}
|
|
|
<a href={`/users/${item.login}`}><img className="div1imgs" src={getImageUrl("images/"+item.image_url)}/></a>
|
|
|
<div className="textall mt10" title={item.name}> <p className="ptext">{item.name}</p></div>
|
|
|
{this.props.current_user&&this.props.current_user.login!=item.login?<a className="ContacttheTAs fl none" target="_blank" href={`/users/${item.login}/message_detail?user_id=${item.id}`}>
|
|
|
<img alt="头像" className="mr5" src={require('./newstwo.png')}/>联系TA
|
|
|
</a>:""}
|
|
|
</div>
|
|
|
)
|
|
|
})}
|
|
|
|
|
|
{data&&data.bidding_users.length===0?<div className="edu-back-white" style={{width: '1200px'}}>
|
|
|
<div className="edu-tab-con-box clearfix edu-txt-center">
|
|
|
<img className="edu-nodata-img mb20" src="https://www.educoder.net/images/educoder/nodata.png" />
|
|
|
<p className="edu-nodata-p mb20">暂无人员竞标~</p></div>
|
|
|
</div>:""}
|
|
|
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>:""}
|
|
|
|
|
|
|
|
|
{this.state.setbiddingmantype===true?<div className={"stud-class-set coursenavbox edu-back-white mt20"}>
|
|
|
{/*发布人选择状态*/}
|
|
|
{/*下面是头像*/}
|
|
|
<div className={"stud-class-set pd26 coursenavbox edu-back-white"}>
|
|
|
<div className={"relativef"}>
|
|
|
<div className={"longboxs mb0"}>
|
|
|
报名列表({data&&data.bidding_users.length})
|
|
|
</div>
|
|
|
|
|
|
<div className="packageabsolute">
|
|
|
<div className=" fl mt10 mr20">
|
|
|
已选 <span className={"color-orange06"}>({this.state.datalist.length})</span>
|
|
|
</div>
|
|
|
<a className="defalutCancelbtns fl" onClick={this.notsetbiddingman}>取消</ a>
|
|
|
<Button type="primary" className="defalutSubmitbtn fl ml20 defalutSubmitbtns" onClick={this.setbiddingusers}>确定</Button>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div className={"ysllogin_register_contentss edu-back-white "} style={{borderTop: '1px solid rgb(234, 234, 234)'}}>
|
|
|
<div className="ysllogin_sections">
|
|
|
<div className="ysldivhome2s">
|
|
|
<div style={{height: "20px"}}> </div>
|
|
|
{data&&data.bidding_users.map((item,key)=>{
|
|
|
return(
|
|
|
<div className="ysldivhomediv1s" onClick={()=>this.Clickteacher2(item.id)} key={key}>
|
|
|
{item.bool===true?<img src={gouxuan} className="yslgouxuanimg"/>:<img src={weigouxuan} className="yslgouxuanimg"/>}
|
|
|
<a href={`/users/${item.login}`} target="_blank"><img className="div1imgs" src={getImageUrl("images/"+item.image_url)}/></a>
|
|
|
<span className={item.bool===true?"textall mt10 color-blue":"textall mt10"} title={item.name}> <p className="ptext">{item.name}</p></span>
|
|
|
</div>
|
|
|
)
|
|
|
})}
|
|
|
|
|
|
{data&&data.bidding_users.length===0?<div className="edu-back-white" style={{width: '1200px'}}>
|
|
|
<div className="edu-tab-con-box clearfix edu-txt-center">
|
|
|
<img className="edu-nodata-img mb20" src="https://www.educoder.net/images/educoder/nodata.png" />
|
|
|
<p className="edu-nodata-p mb20">暂无人员竞标~</p></div>
|
|
|
</div>:""}
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>:""}
|
|
|
|
|
|
</p>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
)
|
|
|
}
|
|
|
}
|
|
|
|
|
|
export default PackageIndexNEITaskDetails;
|
|
|
|
|
|
|
|
|
|
