详情页 完成页

project_pack
杨树明 5 years ago
parent 64f74caaf0
commit 0ec82ec5b0

@ -0,0 +1,46 @@
import moment from "moment";
// 处理整点 半点
// 取传入时间往后的第一个半点
export function handleDateString(dateString) {
if (!dateString) return dateString;
const ar = dateString.split(':')
if (ar[1] == '00' || ar[1] == '30') {
return dateString
}
const miniute = parseInt(ar[1]);
if (miniute < 30 || miniute == 60) {
return [ar[0], '30'].join(':')
}
if (miniute < 60) {
// 加一个小时
const tempStr = [ar[0], '00'].join(':');
const format = "YYYY-MM-DD HH:mm";
const _moment = moment(tempStr, format)
_moment.add(1, 'hours')
return _moment.format(format)
}
return dateString
}
// 给moment对象取下一个半点或整点
export function getNextHalfHourOfMoment(moment) {
if (!moment) {
return moment
}
const minutes = moment.minutes()
if (minutes < 30) {
moment.minutes(30)
} else if (minutes < 60) {
moment.minutes(0).add(1, 'hours')
}
return moment
}
export function formatDuring(mss){
var days = parseInt(mss / (1000 * 60 * 60 * 24));
var hours = parseInt((mss % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = parseInt((mss % (1000 * 60 * 60)) / (1000 * 60));
return days + "天" + hours + "小时" + minutes + "分";
}

@ -13,6 +13,8 @@ export { updatePageParams as updatePageParams } from './RouterUti
export { bytesToSize as bytesToSize } from './UnitUtil'; export { bytesToSize as bytesToSize } from './UnitUtil';
export { handleDateString, getNextHalfHourOfMoment,formatDuring } from './DateUtil'
export { isDev as isDev } from './Env' export { isDev as isDev } from './Env'
export { toStore as toStore, fromStore as fromStore } from './Store' export { toStore as toStore, fromStore as fromStore } from './Store'

@ -92,7 +92,10 @@ class PackageConcent extends Component {
<div className=" item-head mbf10"> <div className=" item-head mbf10">
<div className=" item-head-title"> <div className=" item-head-title">
<a className={"fl mt3 font-20 font-bd color-dark maxwidth580 "}>xxxxxx</a> <a className={"fl mt3 font-20 font-bd color-dark maxwidth700 "}
title={"做电视购物产品流程做电视购物产品流程做电视购物产品流程做电视购物产品流程做电视购物产品流程产品流程产品流程产品流程做电"}
>做电视购物产品流程做电视购物产品流程做电视购物产品流程做电视购物产品流程做电视购
物产品流程产品流程产品流程产品流程做电</a>
</div> </div>
<div className=" item-head-blank"></div> <div className=" item-head-blank"></div>

@ -0,0 +1,258 @@
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} from 'educoder';
import locale from 'antd/lib/date-picker/locale/zh_CN';
import MDEditors from '../MDEditors';
import PhoneModel from '../PackageIndexNewandEdit/PhoneModel';
import '../packageconcnet.css';
const { Search } = Input;
class PackageIndexNEITaskDetails extends Component {
constructor(props) {
super(props)
this.contentMdRef = React.createRef();
this.state = {
modalCancel:false
}
}
componentDidMount() {
}
setclick=()=>{
const mdContnet = this.contentMdRef.current.getValue().trim();
console.log(mdContnet)
}
onChangeTimePicker = (value, dateString) => {
this.setState({
TimePickervalue: dateString
})
}
setPublication=()=>{
this.props.setPublicationfun()
}
modalCancel=()=>{
this.setState({
modalCancel:false
})
}
editmodels=()=>{
this.setState({
modalCancel:true
})
}
render() {
let {modalCancel}=this.state;
return (
<div>
<div className="clearfix">
<div className={"educontent mt20 mb50"}>
<Breadcrumb separator={'>'}>
<Breadcrumb.Item>Home</Breadcrumb.Item>
<Breadcrumb.Item>
<a href="">Application Center</a>
</Breadcrumb.Item>
<Breadcrumb.Item>An Application</Breadcrumb.Item>
</Breadcrumb>
<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">
<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 className="project-package-item project-package-items">
<div className="item-image">
<img />
</div>
<div className=" item-body">
<div className=" item-head mbf10">
<div className=" item-head-title ">
<a className={"fl mt3 font-18 font-bd color-dark maxwidth700 "}
title={"做电视购物产品流程做电视购物产品流程做电视购物产品流程做电视购物产品流程做电视购物产品流程产品流程产品流程产品流程做电"}
>做电视购物产品流程做电视购物产品流程做电视购物产品流程做电视购物产品流程做电视购
物产品流程产品流程产品流程产品流程做电
</a>
</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>
</div>
</div>
<div className=" item-category">
<div className=" item-category-item">人工智能</div>
</div>
<div className=" item-other">
<div>
<span className=" item-group-text">发布时间2019-03-05 1223</span>
</div>
<div className=" item-group item-other-deadline ml40">
<span className=" item-group-text">竞标截止时间2019-09-12 2400</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div className={"stud-class-set padding30 coursenavbox edu-back-white mt20"}>
<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>
</div>
<p className="clearfix mb20 shaiContent">
<span className="shaiTitle fl mt5 ml10">竞标截止</span>
<DatePicker
showToday={false}
showTime
locale={locale}
style={{"width": "260px"}}
format="YYYY-MM-DD HH:mm:ss"
placeholder="请选择任务的竞标截止日期"
className={"fafas"}
onChange={this.onChangeTimePicker}
/>
</p>
<p className="clearfix mb20 shaiContent">
<span className="shaiTitle fl mt5 ml10">支付费用</span>
<Input
className={"fafas"}
style={{"width": "260px"}}
format="YYYY-MM-DD HH:mm:ss"
placeholder="支付多少费用(最低)"
onChange={this.onChangeTimePicker}
suffix={
<span >¥</span>
}
/>
<span className={"ml10 mr10"}></span>
<Input
className={"fafas"}
style={{"width": "260px"}}
format="YYYY-MM-DD HH:mm:ss"
placeholder="支付多少费用(最高)"
onChange={this.onChangeTimePicker}
suffix={
<span>¥</span>
}
/>
</p>
<div className="ant-form-item-label mb10">
<label htmlFor="coursesNew_description" className="ant-form-item-required font-16" >联系方式</label>
</div>
<p className="clearfix mb20 shaiContent">
<span className="shaiTitle fl mt5 ml38">姓名</span>
<Input
className={"fafafas"}
style={{"width": "260px"}}
format="YYYY-MM-DD HH:mm:ss"
placeholder="请输入姓名"
onChange={this.onChangeTimePicker}
/>
</p>
<p className="clearfix mb20 shaiContent">
<span className="shaiTitle fl mt5 ml25">手机号</span>
<Input
className={"fafafas fl"}
style={{"width": "260px"}}
format="YYYY-MM-DD HH:mm"
showTime={{ format: 'HH:mm' }}
placeholder="请输入手机号"
disabled={true}
onChange={this.onChangeTimePicker}
/>
<a className="fl ml20">
<i className="iconfont icon-bianjidaibeijing font-26 color-blue" onClick={()=>this.editmodels()}></i>
</a>
</p>
<p className="clearfix mb20 shaiContent">
<span className="shaiTitle mt5 fl">
<span className="shaiTitle fl mt5 ml25">
{/*未注册才显示!*/}
手机号</span>
<Input
className={"fafafas fl"}
style={{"width": "260px"}}
format="YYYY-MM-DD HH:mm"
showTime={{ format: 'HH:mm' }}
placeholder="请输入手机号码"
onChange={this.onChangeTimePicker}
/>
</span>
<span className="shaiTitle mt5 ml17 fl">
<span>
<Search
style={{ width: 300 }}
className="fafas"
placeholder="请输入验证码"
enterButton={<span>获取验证码</span>}
/>
</span>
<span>
{/*<Button type="primary" className="defalutSubmitbtn ml10 defalutSubmitbtnmodels">重新发送()</Button>*/}
</span>
</span>
</p>
</div>
</div>
</p>
<div className="clearfix mt30 mb30">
<Button type="primary" className="defalutSubmitbtn fl mr20 defalutSubmitbtns" onClick={this.setPublication}>申请发布</Button>
<a className="defalutCancelbtns fl">保存</ a>
</div>
</div>
</div>
</div>
</div>
)
}
}
export default PackageIndexNEITaskDetails;

@ -1,7 +1,6 @@
import React, {Component} from 'react'; import React, {Component} from 'react';
import {Link} from "react-router-dom"; import {Link} from "react-router-dom";
import { Steps, Divider } from 'antd'; import { Steps, Divider } from 'antd';
import 'antd/dist/antd.css';
const { Step } = Steps; const { Step } = Steps;
class PackageIndexNEIBanner extends Component { class PackageIndexNEIBanner extends Component {

@ -2,8 +2,10 @@ import React, {Component} from 'react';
import {Link} from "react-router-dom"; import {Link} from "react-router-dom";
import axios from 'axios'; import axios from 'axios';
import { Input ,Icon,Button,Pagination,DatePicker} from 'antd'; import { Input ,Icon,Button,Pagination,DatePicker} from 'antd';
import { handleDateString} from 'educoder';
import locale from 'antd/lib/date-picker/locale/zh_CN'; import locale from 'antd/lib/date-picker/locale/zh_CN';
import MDEditors from '../MDEditors'; import MDEditors from '../MDEditors';
import PhoneModel from './PhoneModel';
import '../packageconcnet.css'; import '../packageconcnet.css';
const { Search } = Input; const { Search } = Input;
@ -12,7 +14,7 @@ class PackageIndexNEIBannerConcent extends Component {
super(props) super(props)
this.contentMdRef = React.createRef(); this.contentMdRef = React.createRef();
this.state = { this.state = {
modalCancel:false
} }
} }
@ -32,9 +34,31 @@ class PackageIndexNEIBannerConcent extends Component {
}) })
} }
setPublication=()=>{
this.props.setPublicationfun()
}
modalCancel=()=>{
this.setState({
modalCancel:false
})
}
editmodels=()=>{
this.setState({
modalCancel:true
})
}
render() { render() {
let {modalCancel}=this.state;
return ( return (
<div className="mb20"> <div className="mb20">
<PhoneModel
modalsType={modalCancel}
modalCancel={this.modalCancel}
/>
<p className="clearfix "> <p className="clearfix ">
<div className={"stud-class-set pd30a0 coursenavbox edu-back-white"}> <div className={"stud-class-set pd30a0 coursenavbox edu-back-white"}>
@ -93,17 +117,13 @@ class PackageIndexNEIBannerConcent extends Component {
id="_file" id="_file"
multiple="multiple" name="attachments[dummy][file]" multiple="multiple" name="attachments[dummy][file]"
onChange={() => { onChange={() => {
debugger; // debugger;
window.addInputFiles(window.$('.file_selector')[0]) window.addInputFiles(window.$('.file_selector')[0])
}} }}
style={{'display': 'none'}} type="file"> style={{'display': 'none'}} type="file">
</input> </input>
</span> </span>
</form> </form>
</div> </div>
</div> </div>
@ -146,7 +166,7 @@ class PackageIndexNEIBannerConcent extends Component {
onChange={this.onChangeTimePicker} onChange={this.onChangeTimePicker}
suffix={ suffix={
<span >¥</span> <span>¥</span>
} }
/> />
</p> </p>
@ -168,21 +188,56 @@ class PackageIndexNEIBannerConcent extends Component {
<Input <Input
className={"fafafas fl"} className={"fafafas fl"}
style={{"width": "260px"}} style={{"width": "260px"}}
format="YYYY-MM-DD HH:mm:ss" format="YYYY-MM-DD HH:mm"
showTime={{ format: 'HH:mm' }}
placeholder="请输入手机号" placeholder="请输入手机号"
disabled={true} disabled={true}
onChange={this.onChangeTimePicker} onChange={this.onChangeTimePicker}
/> />
<a className="fl ml20"> <a className="fl ml20">
<i className="iconfont icon-bianjidaibeijing font-26 color-blue"></i> <i className="iconfont icon-bianjidaibeijing font-26 color-blue" onClick={()=>this.editmodels()}></i>
</a> </a>
</p> </p>
<p className="clearfix mb20 shaiContent">
<span className="shaiTitle mt5 fl">
<span className="shaiTitle fl mt5 ml25">
{/*未注册才显示!*/}
手机号</span>
<Input
className={"fafafas fl"}
style={{"width": "260px"}}
format="YYYY-MM-DD HH:mm"
showTime={{ format: 'HH:mm' }}
placeholder="请输入手机号码"
onChange={this.onChangeTimePicker}
/>
</span>
<span className="shaiTitle mt5 ml17 fl">
<span>
<Search
style={{ width: 300 }}
className="fafas"
placeholder="请输入验证码"
enterButton={<span>获取验证码</span>}
/>
</span>
<span>
{/*<Button type="primary" className="defalutSubmitbtn ml10 defalutSubmitbtnmodels">重新发送()</Button>*/}
</span>
</span>
</p>
</div> </div>
</div> </div>
</p> </p>
<div className="clearfix mt30 mb30"> <div className="clearfix mt30 mb30">
<Button type="primary" className="defalutSubmitbtn fl mr20 defalutSubmitbtns">申请发布</Button> <Button type="primary" className="defalutSubmitbtn fl mr20 defalutSubmitbtns" onClick={this.setPublication}>申请发布</Button>
<a className="defalutCancelbtns fl">保存</ a> <a className="defalutCancelbtns fl">保存</ a>
</div> </div>
</div> </div>

@ -0,0 +1,50 @@
import React, {Component} from 'react';
import {Link} from "react-router-dom";
import { Icon ,Button} from 'antd';
class PackageIndexNEISubmit extends Component {
constructor(props) {
super(props)
this.state = {
current:0
}
}
componentDidMount() {
}
setageload=(sum)=>{
if(sum===undefined){
window.location.href="/project_packages/new"
}else{
// this.props.history.push("/project_packages/"+sum)
window.location.href="/project_packages/"+sum
}
}
render() {
return (
<div className="mb20">
<p className="clearfix ">
<div className={"stud-class-set padding200 coursenavbox edu-back-white"}>
<div className={"mb20"}><Icon type="check-circle" theme="filled" className={"fontcircle color-green"}/></div>
<div className={"sumbtongs mb5"}>恭喜!</div>
<div className={"sumbtongs mb5"}>提交成功</div>
<div className={"terraces mb5"}>平台正在审核您的申请审核结果将以平台消息的形式通知您</div>
<div className="clearfix mt30 mb30 padding251">
<a className="defalutCancelbtns fl" onClick={()=>this.setageload(1)}>查看发布需求</ a>
<Button type="primary" className="defalutSubmitbtn fl ml40 defalutSubmitbtns" onClick={()=>this.setageload()}>继续发布</Button>
</div>
</div>
</p>
</div>
)
}
}
export default PackageIndexNEISubmit;

@ -3,34 +3,51 @@ import {BrowserRouter as Router,Route,Switch} from 'react-router-dom';
//业务组件 //业务组件
import PackageIndexNEIBanner from "./PackageIndexNEIBanner"; import PackageIndexNEIBanner from "./PackageIndexNEIBanner";
//业务组件
import PackageIndexNEIBannerConcent from "./PackageIndexNEIBannerConcent" import PackageIndexNEIBannerConcent from "./PackageIndexNEIBannerConcent"
import PackageIndexNEISubmit from './PackageIndexNEISubmit'
import '../packageconcnet.css'; import '../packageconcnet.css';
class PackageIndexNewandEditIndex extends Component{ class PackageIndexNewandEditIndex extends Component{
constructor(props) { constructor(props) {
super(props) super(props)
this.state = {
setPublication:false
}
} }
componentDidMount(){ componentDidMount(){
console.log(this.props) console.log(this.props)
} }
setPublicationfun=()=>{
this.setState({
setPublication:true
})
}
render() { render() {
let {setPublication}=this.state;
return ( return (
<div> <div>
<div className="clearfix"> <div className="clearfix">
<div className={"educontent mt20 mb50"}> {setPublication===false?<div className={"educontent mt20 mb50"}>
<p className="clearfix mt20 mb20"> <p className="clearfix mt20 mb20">
<span className="fl font-24 color-grey-3">新建</span> <span className="fl font-24 color-grey-3">新建</span>
</p> </p>
<PackageIndexNEIBanner/> <PackageIndexNEIBanner {...this.props} />
<PackageIndexNEIBannerConcent/> <PackageIndexNEIBannerConcent
{...this.props}
setPublicationfun={this.setPublicationfun}
/>
</div> </div>:
<div className={"educontent mt30 mb50"}>
<PackageIndexNEISubmit
{...this.props}
/>
</div>}
</div> </div>
</div> </div>
) )

@ -0,0 +1,60 @@
import React, { Component } from 'react';
import { Spin, Icon , Modal,Input,Button} from 'antd';
class PhoneModel extends Component {
constructor(props) {
super(props);
this.state = {
funmodalsType:false,
istype:false
}
}
render() {
const antIcons = <Icon type="loading" style={{ fontSize: 24 }} spin />
return(
<Modal
keyboard={false}
title="修改手机号"
visible={this.props.modalsType===undefined?false:this.props.modalsType}
closable={false}
footer={null}
destroyOnClose={true}
centered={true}
width="530px"
>
<div className="task-popup-content">
<p className="task-popup-text-center font-16 mb20">
<span className="shaiTitle mt5">手机号码<span>
<Input
style={{ width: 337 }}
placeholder="请输入手机号码" />
</span></span>
</p>
<p className="task-popup-text-center font-16 mt5">
<span className="shaiTitle mt5 ml17">
验证码
<span>
<Input
style={{ width: 200 }}
placeholder="请输入验证码" />
</span>
<span>
<Button type="primary" className="defalutSubmitbtn ml10 defalutSubmitbtnmodels">获取验证码</Button>
{/*<Button type="primary" className="defalutSubmitbtn ml10 defalutSubmitbtnmodels">重新发送()</Button>*/}
</span>
</span>
</p>
<div className="clearfix mt30 edu-txt-center">
<a className="task-btn mr30 color_white" onClick={this.props.modalCancel}>取消</a>
<a className="task-btn task-btn-orange " onClick={this.props.modalSave}>确定</a>
</div>
</div>
</Modal>
)
}
}
export default PhoneModel;

@ -21,6 +21,11 @@ const PackageIndexNewandEdit = Loadable({
loading: Loading, loading: Loading,
}) })
const PackageIndexNEITaskDetails = Loadable({
loader: () => import('./PackageIndexNEITaskDetails/PackageIndexNEITaskDetails'),
loading: Loading,
})
class ProjectPackageIndex extends Component { class ProjectPackageIndex extends Component {
constructor(props) { constructor(props) {
super(props) super(props)
@ -34,6 +39,7 @@ class ProjectPackageIndex extends Component {
{/*众包首页*/} {/*众包首页*/}
<Route path="/project_packages/:id/edit" {...this.props} component={PackageIndexNewandEdit}></Route> <Route path="/project_packages/:id/edit" {...this.props} component={PackageIndexNewandEdit}></Route>
<Route path="/project_packages/new" {...this.props} component={PackageIndexNewandEdit}></Route> <Route path="/project_packages/new" {...this.props} component={PackageIndexNewandEdit}></Route>
<Route path="/project_packages/:id" {...this.props} component={PackageIndexNEITaskDetails}></Route>
<Route path="/project_packages" {...this.props} component={PackageIndex}></Route> <Route path="/project_packages" {...this.props} component={PackageIndex}></Route>
</Switch> </Switch>

@ -27,8 +27,8 @@
color:#8F8F8F !important; color:#8F8F8F !important;
} }
.maxwidth580{ .maxwidth700{
max-width: 580px; max-width: 700px;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
@ -78,7 +78,12 @@
.fafas .ant-input:focus{ .fafas .ant-input:focus{
background-color: #fff!important; background-color: #fff!important;
} }
.fafas .ant-input-group-addon .ant-btn{
width:140px !important;
font-size: 14px;
height: 40px;
background:rgba(76,172,255,1);
}
.upload_filename{ .upload_filename{
line-height: 32px; line-height: 32px;
@ -112,7 +117,7 @@
.defalutCancelbtns{ .defalutCancelbtns{
display: block; display: block;
border: 1px solid #4CACFF !important; border: 1px solid #4CACFF !important;
background-color: #fafafa; background-color: #fff;
color: #4CACFF !important; color: #4CACFF !important;
width:130px; width:130px;
height:40px; height:40px;
@ -124,4 +129,74 @@
.defalutSubmitbtns{ .defalutSubmitbtns{
background-color: #4CACFF; background-color: #4CACFF;
height:40px; height:40px;
}
.defalutSubmitbtnmodels{
width:127px;
height:30px;
background-color: #4CACFF;
}
.ant-steps-item-process .ant-steps-item-icon{
background-color: #4CACFF !important;
}
.ant-steps-item-process .ant-steps-item-icon{
background-color: #4CACFF !important;
}
.padding200{
padding: 115px 200px 215px 200px;
}
.fontcircle{
font-size: 80px;
display: inherit;
}
.sumbtongs{
font-size: 24px;
display: inherit;
text-align: center;
}
.terraces{
font-size: 16px;
display: inherit;
text-align: center;
color:#999;
}
.padding251{
padding: 0px 251px;
}
.ant-modal-title{
text-align: center;
}
.ml17{
margin-left: 17px;
}
.project-package-items{
display: -webkit-flex;
display: flex;
flex-direction: row;
margin:0px !important;
padding: 20px;
background: white;
margin-bottom:0px !important;
box-shadow: none !important;
}
.mtf7{
margin-top:-7px;
}
.publicpart.orangeGreen {
border-left: 80px solid #29BD8B;
}
.publicwords{
left: 3px;
top: 18px;
} }

@ -264,8 +264,8 @@ class NewHeader extends Component {
console.log(match.path) // console.log(match.path)
console.log(match.path.startsWith("/ec_courses")) // console.log(match.path.startsWith("/ec_courses"))
return ( return (
<div className="newHeader" id="nHeader"> <div className="newHeader" id="nHeader">
<div className="educontent clearfix"> <div className="educontent clearfix">

Loading…
Cancel
Save