project_pack
杨树明 5 years ago
parent 75152931a0
commit cc513c0749

Binary file not shown.

After

Width:  |  Height:  |  Size: 501 KiB

@ -2,5 +2,5 @@ export function bytesToSize(bytes) {
var sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
if (bytes == 0) return '0 Byte';
var i = parseInt(Math.floor(Math.log(bytes) / Math.log(1024)));
return Math.round(bytes / Math.pow(1024, i), 2) + ' ' + sizes[i];
return parseFloat(bytes / Math.pow(1024, i), 2).toFixed(1) + ' ' + sizes[i];
}

@ -40,7 +40,7 @@ window.__useKindEditor = false;
var proxy = "http://localhost:3000"
// proxy = "http://testbdweb.trustie.net"
// proxy = "http://testbdweb.educoder.net"
proxy = 'http://192.168.2.63:3001'
// proxy = 'http://192.168.2.63:3001'
// proxy='https://www.educoder.net'
const requestMap={};
// 在这里使用requestMap控制避免用户通过双击等操作发出重复的请求

@ -16,7 +16,7 @@ class PackageBanner extends Component {
render() {
return (
<div className="courseHead" style={{height: '300px'}}></div>
<div className="project_packagesHead" style={{height: '300px'}}></div>
)
}
}

@ -197,7 +197,7 @@ class PackageConcent extends Component {
{project_packages&&project_packages.map((item,key)=>{
return(
<div className="educontent project-packages-list">
<div className="educontent project-packages-list" key={key}>
<div className="project-package-item">
@ -257,6 +257,11 @@ class PackageConcent extends Component {
</div>
)
})}
{project_packages&&project_packages.length===0?<div className="edu-back-white">
<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 className={"mt40"}>
<Pagination className="edu-txt-center" hideOnSinglePage={true} pageSize={20} current={page} total={data&&data.count} />

@ -0,0 +1,41 @@
import React, { Component } from 'react';
import { Spin, Icon , Modal,Input,Button} from 'antd';
class NEITaskDetailsModel extends Component {
constructor(props) {
super(props);
this.state = {
}
}
render() {
return(
<Modal
keyboard={false}
title="提示"
visible={this.props.applytype===undefined?false:this.props.applytype}
closable={false}
footer={null}
destroyOnClose={true}
centered={true}
width="530px"
>
<div className="task-popup-content">
<p className="task-popup-text-center font-16 mb20">
<div>{this.props.applyvalue}</div>
<div>{this.props.applybottom}</div>
</p>
<div className="clearfix mt30 edu-txt-center">
<a className="task-btn mr30 color_white" onClick={this.props.applycancel}>取消</a>
<a className="task-btn task-btn-orange " onClick={this.props.applyconfirm}>确定</a>
</div>
</div>
</Modal>
)
}
}
export default NEITaskDetailsModel;

@ -2,148 +2,155 @@ 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} from 'educoder';
import locale from 'antd/lib/date-picker/locale/zh_CN';
import MDEditors from '../MDEditors';
import PhoneModel from '../PackageIndexNewandEdit/PhoneModel';
import { handleDateString,markdownToHTML,bytesToSize} 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,
gouxuans1: [{id: 1, name: "前端开发", bool: false, url: ""}, {id: 2, name: "后端开发", bool: false, url: ""}, {
id: 3,
name: "移动开发",
bool: false,
url: ""
}, {id: 4, name: "数据库", bool: false, url: ""}, {id: 5, name: "云计算和大数据", bool: false, url: ""}, {
id: 6,
name: "运维与测试",
bool: false,
url: ""
}, {id: 7, name: "人工智能", bool: false, url: ""}, {id: 8, name: "其他", bool: false, url: ""}, {
id: 9,
name: "人工智能9",
bool: false,
url: ""
}, {id: 10, name: "其他10", bool: false, url: ""}, {id: 1, name: "其他10", bool: false, url: ""}],
gouxuans2: [{id: 1, name: "前端开发", bool: false, url: "https://www.educoder.net/images/avatars/User/1"}, {
id: 2,
name: "后端开发",
bool: false,
url: "https://www.educoder.net/images/avatars/User/1"
}, {id: 3, name: "移动开发", bool: false, url: "https://www.educoder.net/images/avatars/User/1"}, {
id: 4,
name: "数据库",
bool: false,
url: "https://www.educoder.net/images/avatars/User/1"
}, {id: 5, name: "云计算和大数据", bool: false, url: "https://www.educoder.net/images/avatars/User/1"}, {
id: 6,
name: "运维与测试",
bool: false,
url: "https://www.educoder.net/images/avatars/User/1"
}, {id: 7, name: "人工智能", bool: false, url: "https://www.educoder.net/images/avatars/User/1"}, {
id: 8,
name: "其他",
bool: false,
url: "https://www.educoder.net/images/avatars/User/1"
}, {id: 9, name: "人工智能9", bool: false, url: "https://www.educoder.net/images/avatars/User/1"}, {
id: 10,
name: "其他10",
bool: false,
url: "https://www.educoder.net/images/avatars/User/1"
}, {id: 11, name: "其他10", bool: false, url: "https://www.educoder.net/images/avatars/User/1"}, {
id:12,
name: "前端开发",
bool: false,
url: "https://www.educoder.net/images/avatars/User/1"
}, {id: 13, name: "后端开发", bool: false, url: "https://www.educoder.net/images/avatars/User/1"}, {
id: 14,
name: "移动开发",
bool: false,
url: "https://www.educoder.net/images/avatars/User/1"
}, {id: 15, name: "数据库", bool: false, url: "https://www.educoder.net/images/avatars/User/1"}, {
id: 16,
name: "云计算和大数据",
bool: false,
url: "https://www.educoder.net/images/avatars/User/1"
}, {id: 17, name: "运维与测试", bool: false, url: "https://www.educoder.net/images/avatars/User/1"}, {
id: 18,
name: "人工智能",
bool: false,
url: "https://www.educoder.net/images/avatars/User/1"
}, {id: 19, name: "其他", bool: false, url: "https://www.educoder.net/images/avatars/User/1"}, {
id: 20,
name: "人工智能9",
bool: false,
url: "https://www.educoder.net/images/avatars/User/1"
}, {id: 21, name: "其他10", bool: false, url: "https://www.educoder.net/images/avatars/User/1"}, {
id: 22,
name: "其他10",
bool: false,
url: "https://www.educoder.net/images/avatars/User/1"},],
setbiddingmantype:false,
datalist:[]
}
}
;
componentDidMount() {
let url =`/api/v1/project_packages/${this.props.match.params.id}.json`;
axios.get(url).then((response) => {
this.setState({
data:response.data
})
}).catch((error) => {
console.log(error);
}
})
setclick=()=>{
const mdContnet = this.contentMdRef.current.getValue().trim();
console.log(mdContnet)
}
onChangeTimePicker = (value, dateString) => {
setbiddingman=()=>{
this.setState({
TimePickervalue: dateString
setbiddingmantype:true
})
}
setPublication=()=>{
this.props.setPublicationfun()
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
})
}
editmodels=()=>{
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({
modalCancel:true
applytype:false,
})
let{datalist}=this.state;
let newlist=[];
datalist.map((item,key)=>{
newlist.push(item.id)
})
let url=`/api/v1/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("提交成功");
}
}).catch((error) => {
console.log(error)
})
}
Clickteacher2=(e)=>{
let {gouxuans2} =this.state;
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);
// 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(gouxuans2);
console.log(newlist);
this.setState({
gouxuans3:gouxuans2,
datalist:newlist,
})
}
@ -158,23 +165,88 @@ class PackageIndexNEITaskDetails extends Component {
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=`/api/v1/project_packages/${this.props.match.params.id}/bidding_users.json`;
axios.post(url).then((response) => {
if(response.data.status===0){
this.props.showSnackbar(response.data.message);
}
}).catch((error) => {
console.log(error)
})
}
goback = () => {
window.history.go(-1)
}
render() {
let {overtype}=this.state;
// console.log(overtype)
let {gouxuans2}=this.state;
let {overtype,data}=this.state;
console.log(data)
console.log(this.props)
return (
<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={'>'}>
<Breadcrumb.Item>admin</Breadcrumb.Item>
<Breadcrumb separator={'>'} className={"fl"}>
<Breadcrumb.Item>{this.props.current_user.login}</Breadcrumb.Item>
<Breadcrumb.Item>
<a href="/project_packages">任务大厅</a>
</Breadcrumb.Item>
<Breadcrumb.Item>详情</Breadcrumb.Item>
</Breadcrumb>
</Breadcrumb>
<a className="color-grey-6 fr font-15 mr20" onClick={this.goback}>返回</a>
<div className="mb20">
<p className="clearfix ">
@ -183,37 +255,34 @@ class PackageIndexNEITaskDetails extends Component {
<div className={"ant-row contentbox mdInForm "}>
<div className="educontent project-packages-list">
<div>
{data&&data.status==="pending"?<div>
<div className="publicpart orangeBlack "></div>
<span className="smalltrangle"></span>
<span className="publicword publicwords"> 未申请 </span>
</div>
{/*<div>*/}
{/*<div className="publicpart orangeGreen"></div>*/}
{/*<span className="smalltrangle"></span>*/}
{/*<span className="publicword publicwords"> 待发布 </span>*/}
{/*</div>*/}
</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 ">
<img alt="头像" className="radius mt10 ml5" height="70" id="nh_user_logo" name="avatar_image"
src={"https://www.educoder.net/images/avatars/User/1"}
src={data&&data.creator.avatar_url}
width="70"/>
<div className=" edu-back-white ml28 mt10 ">
张三
{data&&data.creator.name}
</div>
<div className=" edu-back-white ml5 mt10 "
{this.props.current_user.login!=data&&data.creator.login?<div className=" edu-back-white ml5 mt10 "
onMouseOver={this.setover}
onMouseOut={this.setout}
>
{overtype===false?<a className="ContacttheTA fl"> <img alt="头像" class="mr5" src={require('./newsone.png')} />联系TA</a>:
<a className="ContacttheTAs fl"> <img alt="头像" className="mr5"
{overtype===false?<a className="ContacttheTA fl" href={`/users/${this.props.current_user.login}/private_messages`}> <img alt="头像" class="mr5" src={require('./newsone.png')} />联系TA</a>:
<a className="ContacttheTAs fl" href={`/users/${this.props.current_user.login}/private_messages`}> <img alt="头像" className="mr5"
src={require('./newstwo.png')}/>联系TA</a>}
</div>
</div>:""}
</div>
@ -224,29 +293,28 @@ class PackageIndexNEITaskDetails extends Component {
<div className=" item-head mbf10">
<div className=" item-head-title ">
<a className={"fl mt3 font-18 font-bd color-dark maxwidth700 "}
title={"做电视购物产品流程做电视购物产品流程做电视购物产品流程做电视购物产品流程做电视购物产品流程产品流程产品流程产品流程做电"}
>做电视购物产品流程做电视购物产品流程做电视购物产品流程做电视购物产品流程做电视购
物产品流程产品流程产品流程产品流程做电
</a>
<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">
<span><span className={"font-24"}>8000.00</span></span>~<span><span className={"font-24"}>8000.00</span></span>
<span><span className={"font-24"}>{data&&data.min_price}</span></span>~<span><span className={"font-24"}>{data&&data.max_price}</span></span>
</div>
</div>
<div className="item-category">
<div className=" item-category-item">人工智能</div>
<div className="item-category-item">{setcategorylist(data&&data.category)}</div>
</div>
<div className=" item-other">
<div>
<span className=" item-group-text">发布时间2019-03-05 1223</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">竞标截止时间2019-09-12 2400</span>
<span className="item-group-text">竞标截止时间{moment(data&&data.deadline_at).format("YYYY-MM-DD HH:mm")}</span>
</div>
</div>
@ -263,40 +331,37 @@ class PackageIndexNEITaskDetails extends Component {
<div>
<div className={"longboxs"}>
需求详情
<a className="task-btn-nebules fr">编辑</a>
<a className="task-btn-nebules fr">删除</a>
{data&&data.status==="pending"&&data&&data.operation.can_select_bidding_user===true?<div className="fr">
<a className="task-btn-nebules fr" href={`/project_packages/${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 className={"markdown-body"} dangerouslySetInnerHTML={{__html: markdownToHTML(item.ques_title).replace(/▁/g,"▁▁▁")}}></div>*/}
</div>
<div>
{data&&data.attachments.length>0?<div>
<div className={"longboxs"}>
需求文件
</div>
<div className={"newForm newFormbox mt10 "}>
<i className="color-green iconfont icon-fujian mr5 fl"></i>
<a className="upload_filename color-grey readonly hidden fl mtf3 mr10 ml5"> 每天电视上都有好多产品在电视上卖有美白减肥 &nbsp; &nbsp;12.62KB </a>
</div>
{data&&data.attachments.map((item,key)=>{
return(
<div className={"newForm newFormbox mt10 "}>
<i className="color-green iconfont icon-fujian mr5 fl"></i>
<a className="upload_filename color-grey readonly hidden fl mtf3 mr10 ml5"> 每天电视上都有好多产品在电视上卖有美白减肥 &nbsp; &nbsp;12.62KB </a>
</div>
<i className="color-green iconfont icon-fujian mr5 fl font-14 mt4"></i>
<a className="upload_filename color-grey readonly hidden fl mtf3 mr10 ml5" href={item.url}>{item.title} &nbsp; &nbsp;{bytesToSize(item.filesize)}</a>
</div>
)})}
</div>:""}
</div>
{/*发布者和竞选者状态show*/}
<div className={"stud-class-set coursenavbox edu-back-white mt20"}>
{this.state.setbiddingmantype===false?<div className={"stud-class-set coursenavbox edu-back-white mt20"}>
{/*下面是头像*/}
<div className={"stud-class-set pd30a0 coursenavbox edu-back-white"}>
<div className={"relativef"}>
@ -304,8 +369,10 @@ class PackageIndexNEITaskDetails extends Component {
报名列表(12)
</div>
<div className="packageabsolute">
<Button type="primary" className="defalutSubmitbtn fl ml20 defalutSubmitbtns" onClick={this.setPublication}>竞标报名</Button>
<Button type="primary" className="defalutSubmitbtn fl ml20 defalutSubmitbtns" onClick={this.setPublication}>选择中标者</Button>
{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>:""}
<Button type="primary" className="defalutSubmitbtn fl ml20 defalutSubmitbtns" onClick={this.setbiddingman}>选择中标者</Button>
</div>
</div>
</div>
@ -314,26 +381,23 @@ class PackageIndexNEITaskDetails extends Component {
<div className="ysllogin_section">
<div className="ysldivhome2">
<div style={{height: "20px"}}> </div>
{gouxuans2&&gouxuans2.map((item,key)=>{
{data&&data.bidding_users.map((item,key)=>{
return(
<div className="ysldivhomediv1 homehove">
<img className="div1img" src={item.url}/>
<img className="div1img" src={item.avatar_url}/>
<div className="textall mt10" title={item.name}> <p className="ptext">{item.name}</p></div>
<a className="ContacttheTAs fl none">
{this.props.current_user.login!=item.login?<a className="ContacttheTAs fl none" href={`/users/${item.login}/private_messages`}>
<img alt="头像" className="mr5" src={require('./newstwo.png')}/>联系TA
</a>
</a>:""}
</div>
)
})}
</div>
</div>
</div>
</div>
</div>:<div className={"stud-class-set coursenavbox edu-back-white mt20"}>
{/*发布人选择状态*/}
<div className={"stud-class-set coursenavbox edu-back-white mt20"}>
{/*下面是头像*/}
<div className={"stud-class-set pd30a0 coursenavbox edu-back-white"}>
<div className={"relativef"}>
@ -343,10 +407,10 @@ class PackageIndexNEITaskDetails extends Component {
<div className="packageabsolute">
<div className=" fl mt10 mr20">
已选 <span className={"color-orange06"}>(5)</span>
已选 <span className={"color-orange06"}>({this.state.datalist.length})</span>
</div>
<a className="defalutCancelbtns fl">取消</ a>
<Button type="primary" className="defalutSubmitbtn fl ml20 defalutSubmitbtns" onClick={this.setPublication}>确定</Button>
<a className="defalutCancelbtns fl" onClick={this.notsetbiddingman}>取消</ a>
<Button type="primary" className="defalutSubmitbtn fl ml20 defalutSubmitbtns" onClick={this.setbiddingusers}>确定</Button>
</div>
</div>
</div>
@ -354,11 +418,11 @@ class PackageIndexNEITaskDetails extends Component {
<div className="ysllogin_section">
<div className="ysldivhome2">
<div style={{height: "20px"}}> </div>
{gouxuans2&&gouxuans2.map((item,key)=>{
{data&&data.bidding_users.map((item,key)=>{
return(
<div className="ysldivhomediv1" onClick={()=>this.Clickteacher2(item.id)}>
{item.bool===true?<img src={gouxuan} className="yslgouxuanimg"/>:<img src={weigouxuan} className="yslgouxuanimg"/>}
<img className="div1img" src={item.url}/>
<img className="div1img" src={item.avatar_url}/>
<span className={item.bool===true?"textall mt10 color-blue":"textall mt10"} title={item.name}> <p className="ptext">{item.name}</p></span>
</div>
)
@ -366,7 +430,7 @@ class PackageIndexNEITaskDetails extends Component {
</div>
</div>
</div>
</div>
</div>}
</p>
@ -381,3 +445,53 @@ class PackageIndexNEITaskDetails extends Component {
}
export default PackageIndexNEITaskDetails;
// let data ={
// id:1,
// title:"卡巴的审批服务",
// content:"年品牌将案件的步伐我就能发就爱看你的是否",
// category:"ai",
// status:"published",
// published_at:"2019-07-09T01:49:19Z",
// deadline_at:"2019-07-09T01:49:19Z",
// min_price:"1000.00",
// max_price:"2000.00",
// contact_name:"张三", //自己或者管理员才返回
// contact_phone:"13111111111", //自己或者管理员才返回
// creator:{
// id:1,
// login:"xxx",
// name:"xxx",
// avatar_url:"/axxx"
// },
// attachments:[
// {
// id: 206525,
// title: "412420b57ed8c141963d4c548bde551f",
// filesize: 18523,
// description: null,
// url: "/api/attachments/206525"
// }
// ],
// bidding_users: [
// {
// id: 1,
// login: "xxx",
// name: "xxx",
// avatar_url: "/axxx",
// status: "pendding"
// }
// ],
// operation:{
// can_bidding: false,
// can_select_bidding_user: false,
// can_edit: false,
// can_delete: false,
// }
// }
//
// this.setState({
// data:data
// })

@ -8,7 +8,7 @@
.ysllogin_register_contents{
display: flex;
margin-top: 20px;
justify-content: center;
/*justify-content: center;*/
background: #fff;
}

@ -1,8 +1,8 @@
import React, {Component} from 'react';
import {Link} from "react-router-dom";
import axios from 'axios';
import { Input ,Icon,Button,Pagination,DatePicker} from 'antd';
import { handleDateString,getUrl} from 'educoder';
import { Input , Spin, Icon ,Button,Pagination,DatePicker} from 'antd';
import { handleDateString,getUrl,bytesToSize} from 'educoder';
import locale from 'antd/lib/date-picker/locale/zh_CN';
import MDEditors from '../MDEditors';
import PhoneModel from './PhoneModel';
@ -20,6 +20,15 @@ if (!window.postUpMsg) {
});
}
function checkPhone(phone){
if(!(/^1[3456789]\d{9}$/.test(phone))){
// alert("手机号码有误,请重填");
return false;
}
}
class PackageIndexNEIBannerConcent extends Component {
constructor(props) {
super(props)
@ -28,7 +37,7 @@ class PackageIndexNEIBannerConcent extends Component {
modalCancel:false,
getverificationcodes:true,
seconds:35,
springtype:false,
category:undefined,
title:undefined,
content:undefined,
@ -40,11 +49,42 @@ class PackageIndexNEIBannerConcent extends Component {
contact_phone:undefined,
code:undefined,
publish:false,
attachments:[
{
id: 206525,
title: "412420b57ed8c141963d4c548bde551f",
filesize: 18523,
description: null,
url: "/api/attachments/206525"
}
]
}
}
componentDidMount() {
if(this.props.match.params.id!=undefined){
let url=`/api/v1/project_packages/${this.props.match.params.id}.json`
axios.get((url)).then((response) => {
console.log(response)
let data=response.data
this.setState({
category:data.category,
title:data.title,
content:data.content,
deadline_at:moment(data.deadline_at),
min_price:data.min_price,
max_price:data.max_price,
contact_name:data.contact_name,
contact_phone:data.contact_phone,
attachments:data.attachments,
})
}).catch((error) => {
console.log(error);
})
}
// this.contentMdRef.current.setValue("测试赋值")
}
@ -135,7 +175,121 @@ class PackageIndexNEIBannerConcent extends Component {
publish:type
})
let types=type;
let {category,title,attachment_ids,deadline_at,min_price,max_price,contact_name,contact_phone,code}=this.state;
let {category,title,attachment_ids,deadline_at,min_price,max_price,contact_name,contact_phone,code,modalCancel}=this.state;
if(category===undefined||category===null||category===""){
this.setState({
categorytypes:true
})
this.scrollToAnchor("publishtimestart");
return
}
if(title===undefined||title===null||title===""){
this.setState({
titletypes:true
})
this.scrollToAnchor("publishtimestart");
return
}
if(content===undefined||content===null||content===""){
this.setState({
contenttypes:true
})
this.scrollToAnchor("publishtimestart");
return
}
if(deadline_at===undefined||deadline_at===null||deadline_at===""){
this.setState({
deadline_attypes:true
})
this.scrollToAnchor("publishtime");
return
}
if(moment(deadline_at)<moment(new Date())){
this.setState({
deadline_attypexy:true
})
return
}
if(parseInt(min_price)===undefined||parseInt(min_price)===null||parseInt(min_price)===""){
this.setState({
min_pricetype:true
})
return
}
if(parseInt(max_price)===undefined||parseInt(max_price)===null||parseInt(max_price)===""){
this.setState({
min_pricetype:true
})
return
}
if(parseInt(min_price)<=0||parseInt(max_price)<=0){
this.setState({
smallstype:true
})
return
}
if(parseInt(max_price)<parseInt(min_price)){
this.setState({
minmaxtype:true
})
return
}
if(contact_name===undefined||contact_name===""||contact_name===null){
this.setState({
contact_nametype:true
})
return
}
if(modalCancel===false){
if(this.props.current_user.phone===undefined||this.props.current_user.phone===null||this.props.current_user.phone===""){
this.setState({
current_userphonetype:true
})
return
}
}
if(modalCancel===true){
if(contact_phone===undefined||contact_phone===null||contact_phone===""){
this.setState({
contact_phonetype:true
})
return
}
if(checkPhone(contact_phone)===false){
this.setState({
contact_phonetypes:true
})
return
}
if(code===undefined||code===""||code===null){
this.setState({
codeypes:true
})
return
}
}
this.setState({
springtype:true
})
if(this.props.match.params.id===undefined){
const url = `/api/v1/project_packages.json`;
axios.post(url, {
@ -144,8 +298,56 @@ class PackageIndexNEIBannerConcent extends Component {
content: content,
attachment_ids: attachment_ids,
deadline_at:deadline_at._i,
min_price:min_price,
max_price:max_price,
min_price:parseInt(min_price),
max_price:parseInt(max_price),
contact_name: contact_name,
contact_phone: contact_phone,
code:code,
publish:types
}
).then((response) => {
if(response.data.status===0){
if(type===true){
this.props.setPublicationfun(response.data.id)
}else{
window.location.href="/project_packages/"+response.data.id
}
this.setState({
springtype:false
})
}else if(response.data.status===-1){
if(response.data.message==="无效的验证码"){
this.setState({
codeypesno:true,
springtype:false
})
}
}
this.setState({
springtype:false
})
}).catch((error) => {
console.log(error)
this.setState({
springtype:false
})
})
}else{
// edit
const url = `/api/v1/project_packages/${this.props.match.params.id}.json`;
axios.put(url, {
category: category,
title: title,
content: content,
attachment_ids: attachment_ids,
deadline_at:deadline_at._i,
min_price:parseInt(min_price),
max_price:parseInt(max_price),
contact_name: contact_name,
contact_phone: contact_phone,
code:code,
@ -153,13 +355,27 @@ class PackageIndexNEIBannerConcent extends Component {
}
).then((response) => {
if(response.data.status===0){
if(type===true){
this.props.setPublicationfun(response.data.id)
}else{
window.location.href="/project_packages/"+response.data.id
}
}else if(response.data.status===-1){
if(response.data.message==="无效的验证码"){
this.setState({
codeypesno:true
})
}
}
}).catch((error) => {
console.log(error)
})
}
}
@ -221,8 +437,18 @@ class PackageIndexNEIBannerConcent extends Component {
})
}
//跳转道描点的地方
scrollToAnchor = (anchorName) => {
if (anchorName) {
// 找到锚点
let anchorElement = document.getElementById(anchorName);
// 如果对应id的锚点存在就跳转到锚点
if(anchorElement) { anchorElement.scrollIntoView(); }
}
}
render() {
let {modalCancel,seconds,getverificationcodes,attachments_url,
let {modalCancel,seconds,getverificationcodes,attachments,
category,title}=this.state;
let categorylist=[
{name:"前端开发",value:"front"},
@ -233,16 +459,17 @@ class PackageIndexNEIBannerConcent extends Component {
{name:"人工智能",value:"ai"},
{name:"其他",value:"other"},
]
console.log(this.props)
return (
<div className="mb20">
<div className="mb20 touchSelect">
{/*<PhoneModel*/}
{/*modalsType={modalCancel}*/}
{/*modalCancel={this.modalCancel}*/}
{/*/>*/}
<p className="clearfix ">
<Spin size="large" spinning={this.state.springtype} >
<p className="clearfix" id={"publishtimestart"}>
<div className={"stud-class-set pd30a0 coursenavbox edu-back-white"}>
<div className={"stud-class-set pd30a0 coursenavbox edu-back-white pb20"}>
<div className={"ant-row contentbox mdInForm "}>
<div className="ant-form-item-label mb10">
<label htmlFor="coursesNew_description" className="ant-form-item-required font-16">请选择需求类型</label>
@ -257,7 +484,7 @@ class PackageIndexNEIBannerConcent extends Component {
})}
</div>
</p>
<div className={"color-red"}>请选择类型</div>
{this.state.categorytypes===true?<div className={"color-red"}>请选择类型</div>:""}
<div className="ant-form-item-label mb10">
<label htmlFor="coursesNew_description" className="ant-form-item-required font-16" >需求标题和详情</label>
@ -265,11 +492,11 @@ class PackageIndexNEIBannerConcent extends Component {
<Input placeholder="请输入需求标题示例美食类APP开发最大限制60个字符" maxLength="60" className="input-100-40s mt5 fafafas"
value={title} onInput={this.settitlefun}/>
<div className={"color-red mt10"}>不能为空</div>
{this.state.titletypes===true?<div className={"color-red mt10"}>不能为空</div>:""}
<MDEditors ref={this.contentMdRef} placeholder="请填写清晰完整的需求内容" mdID={'courseContentMD'} refreshTimeout={1500}
watch={false} className="courseMessageMD" initValue={this.state.content}></MDEditors>
{/* 请求status 422 */}
<div className={"color-red"}>不能为空</div>
{this.state.contenttypes===true?<div className={"color-red"}>不能为空</div>:""}
<div className="df uploadBtn">
<a href="javascript:void(0);" className="fl" onClick={() => window.$('#_file').click()}
data-tip-down="请选择文件上传">
@ -278,7 +505,14 @@ class PackageIndexNEIBannerConcent extends Component {
</a>
<span style={{ fontSize: "14px"}}>(最多可添加 <span className={"color-orange06"}>5</span> / <span className={"color-orange06"}>10MB</span>)</span>
</div>
<form className="newForm newFormbox mt10 mb20">
{attachments&&attachments.map((item,key)=>{
return(
<div className={"newForm newFormbox mt10 "}>
<i className="color-green iconfont icon-fujian mr5 fl font-14 mt4"></i>
<a className="upload_filename color-grey readonly hidden fl mtf3 mr10 ml5" href={item.url}>{item.title} &nbsp; &nbsp;{bytesToSize(item.filesize)}</a>
</div>
)})}
<form className="newForm newFormbox mt10 ">
<span id={`attachments_fields`} className="attachments_fields"
xmlns="http://www.w3.org/1999/html">
</span>
@ -306,12 +540,10 @@ class PackageIndexNEIBannerConcent extends Component {
</form>
</div>
</div>
<div className={"stud-class-set padding30 coursenavbox edu-back-white"} style={{borderTop: '1px solid #EAEAEA'}}>
<div className={"stud-class-set padding30 coursenavbox edu-back-white"} style={{borderTop: '1px solid #EAEAEA'}} id={"publishtime"}>
<div className={"ant-row contentbox mdInForm "}>
<div className="ant-form-item-label mb10">
<label htmlFor="coursesNew_description" className="ant-form-item-required font-16">工期与预算</label>
@ -330,9 +562,9 @@ class PackageIndexNEIBannerConcent extends Component {
onChange={this.onChangeTimePicker}
/>
<div className={"color-red ml100"}>不能为空</div>
{this.state.deadline_attypes===true?<div className={"color-red ml100"}>不能为空</div>:""}
<div className={"color-red ml100"}>不能早于当前时间</div>
{this.state.deadline_attypexy===true?<div className={"color-red ml100"}>不能早于当前时间</div>:""}
</p>
<p className="clearfix mb20 shaiContent">
<span className="shaiTitle fl mt5 ml10">支付费用</span>
@ -358,9 +590,9 @@ class PackageIndexNEIBannerConcent extends Component {
<span>¥</span>
}
/>
<div className={"color-red ml100"}>不能为空</div>
<div className={"color-red ml100"}>不能小于零</div>
<div className={"color-red ml100"}>最高费用不能小于最低费用</div>
{this.state.min_pricetype===true?<div className={"color-red ml100"}>不能为空</div>:""}
{this.state.smallstype===true?<div className={"color-red ml100"}>不能小于零</div>:""}
{this.state.minmaxtype===true?<div className={"color-red ml100"}>最高费用不能小于最低费用</div>:""}
</p>
<div className="ant-form-item-label mb10">
<label htmlFor="coursesNew_description" className="ant-form-item-required font-16" >联系方式</label>
@ -374,14 +606,14 @@ class PackageIndexNEIBannerConcent extends Component {
placeholder="请输入姓名"
onInput={this.onChangeContact_name}
/>
<div className={"color-red ml100"}>不能为空</div>
{this.state.contact_nametype===true?<div className={"color-red ml100"}>不能为空</div>:""}
</p>
{modalCancel===false?<p className="clearfix mb20 shaiContent">
<span className="shaiTitle fl mt5 ml25">手机号</span>
<Input
className={"fafafas fl"}
style={{"width": "260px"}}
value={this.props.phone}
value={this.props.current_user.phone}
placeholder="请输入手机号"
disabled={true}
/>
@ -389,7 +621,7 @@ class PackageIndexNEIBannerConcent extends Component {
<i className="iconfont icon-bianjidaibeijing font-26 color-blue" onClick={()=>this.editmodels()}></i>
</a>
</p>:""}
{this.state.current_userphonetype===true?<div className={"color-red ml100"}>不能为空</div>:""}
{modalCancel===true?<p className="clearfix mb20 shaiContent">
<span className="shaiTitle mt5 fl">
<span className="shaiTitle fl mt5 ml25">
@ -403,8 +635,8 @@ class PackageIndexNEIBannerConcent extends Component {
placeholder="请输入手机号码"
onInput={this.onChangeContact_phone}
/>
<div className={"color-red ml100"}>不能为空</div>
<div className={"color-red ml100"}>请输入正确的手机号</div>
{this.state.contact_phonetype===true?<div className={"color-red ml100"}>不能为空</div>:""}
{this.state.contact_phonetypes===true?<div className={"color-red ml100"}>请输入正确的手机号</div>:""}
</span>
<span className="shaiTitle mt5 ml17 fl">
@ -419,8 +651,8 @@ class PackageIndexNEIBannerConcent extends Component {
onSearch={()=>this.getverificationcode()}
onInput={this.onChangeCode}
/>
<div className={"color-red"}>验证码不能为空</div>
<div className={"color-red"}>验证码不正确</div>
{this.state.codeypes===true?<div className={"color-red"}>验证码不能为空</div>:""}
{this.state.codeypesno===true?<div className={"color-red"}>验证码不正确</div>:""}
</span>
<span>
{/*<Button type="primary" className="defalutSubmitbtn ml10 defalutSubmitbtnmodels">重新发送()</Button>*/}
@ -440,7 +672,9 @@ class PackageIndexNEIBannerConcent extends Component {
<Button type="primary" className="defalutSubmitbtn fl mr20 defalutSubmitbtns" onClick={()=>this.setPublication(true)}>申请发布</Button>
<a className="defalutCancelbtns fl" onClick={()=>this.setPublication(false)}>保存</ a>
</div>
</Spin>
</div>
)
}
}

@ -18,7 +18,7 @@ class PackageIndexNewandEditIndex extends Component{
}
componentDidMount(){
console.log(this.props)
}
setPublicationfun=(ids)=>{
this.setState({
@ -34,7 +34,8 @@ class PackageIndexNewandEditIndex extends Component{
{setPublication===false?<div className={"educontent mt20 mb50"}>
<p className="clearfix mt20 mb20">
<span className="fl font-24 color-grey-3">新建</span>
<span className="fl font-24 color-grey-3">
{this.props.match.params.id!=undefined?"编辑":"新建"}</span>
</p>
<PackageIndexNEIBanner {...this.props} />

@ -32,7 +32,7 @@ class ProjectPackageIndex extends Component {
}
render() {
console.log(this.props)
return (
<div className="newMain clearfix">

@ -85,15 +85,15 @@
background:rgba(76,172,255,1);
}
.upload_filename{
.newFormbox .upload_filename{
line-height: 32px;
}
.attachment span{
.newFormbox .attachment span{
line-height: 23px;
}
.attachment .remove-upload{
.newFormbox .attachment .remove-upload{
line-height: 28px;
}
@ -101,9 +101,10 @@
padding: 30px 30px 0 30px;
}
.attachment .icon-fujian{
font-size: 12px !important;
.newFormbox .attachment .icon-fujian{
font-size: 14px !important;
line-height: 14px;
margin-top: 9px;
}
.newFormbox{
@ -280,7 +281,7 @@
position: relative;
}
.homehove:hover span{
.homehove:hover .ptext{
color: #4CACFF!important;
}
@ -296,3 +297,6 @@
position: absolute;
bottom: -4px;
}
.touchSelect .ant-spin-dot-spin{
margin-top: 30% !important;
}

@ -464,7 +464,8 @@ li.li-width7{width: 7%;text-align: left}
.top-black-trangle{display: block;border-width: 8px;position: absolute;top: -16px;right: 4px;border-style: dashed solid dashed dashed;border-color: transparent transparent rgba(5,16,26,0.6) transparent;font-size: 0;line-height: 0;}
.right-black-trangle{display: block;border-width: 8px;position: absolute;top: 10px;right: -16px;border-style: dashed solid dashed dashed;border-color: transparent transparent transparent rgba(5,16,26,0.6);font-size: 0;line-height: 0;}
.activity-nav.active{color: #4CACFF!important;}
.project_packagesHead{width: 100%;margin-bottom:40px;background-size: 100% 100%;background-image: url("/images/educoder/project_packagesHead.png");height: 240px;
justify-content: center;align-items: center;display: -webkit-flex;}
.courseNewNum{display: block;background: #FF6800;border-radius:30px;padding:0px 2px;color: #fff!important;font-size: 11px;
height: 16px;line-height: 15px;min-width: 12px;text-align: center;margin-top: 17px;}

Loading…
Cancel
Save