|
|
|
@ -1,8 +1,10 @@
|
|
|
|
|
import "../css/Signinstatistics.css"
|
|
|
|
|
import React from 'react'
|
|
|
|
|
import { Modal , Form, Input, Radio,DatePicker, TimePicker,Select,Button} from 'antd';
|
|
|
|
|
import { Modal , Form, Input, Radio,DatePicker,Select,Button} from 'antd';
|
|
|
|
|
import moment from 'moment';
|
|
|
|
|
import axios from 'axios';
|
|
|
|
|
import TimePicker from "react-datepicker";
|
|
|
|
|
import "react-datepicker/dist/react-datepicker.css";
|
|
|
|
|
function range(start, end) {
|
|
|
|
|
const result = [];
|
|
|
|
|
for (let i = start; i < end; i++) {
|
|
|
|
@ -30,9 +32,26 @@ const CollectionCreateForm = Form.create({ name: 'form_in_modal' })(
|
|
|
|
|
this.state = {
|
|
|
|
|
course_groups:[],
|
|
|
|
|
type:false,
|
|
|
|
|
dateString:null
|
|
|
|
|
dateString:null,
|
|
|
|
|
start_time: "",
|
|
|
|
|
end_time:""
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
handleChangestart_time = (date) => {
|
|
|
|
|
console.log(moment(date).format('HH:mm'))
|
|
|
|
|
this.setState({
|
|
|
|
|
start_time: date
|
|
|
|
|
});
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
handleChangeend_time=(date)=>{
|
|
|
|
|
console.log(moment(date).format('HH:mm'))
|
|
|
|
|
this.setState({
|
|
|
|
|
end_time: date
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
componentDidMount() {
|
|
|
|
|
const coursesId=this.props.match.params.coursesId;
|
|
|
|
|
let newurl=`/courses/${coursesId}/all_course_groups.json`;
|
|
|
|
@ -101,32 +120,32 @@ const CollectionCreateForm = Form.create({ name: 'form_in_modal' })(
|
|
|
|
|
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
getDisabledHours=()=> {
|
|
|
|
|
let hours = []
|
|
|
|
|
if(this.state.dateString===moment().format('YYYY-MM-DD')){
|
|
|
|
|
let time = moment().format('HH:mm')
|
|
|
|
|
let timeArr = time.split(':')
|
|
|
|
|
for (var i = 0; i < parseInt(timeArr[0]); i++) {
|
|
|
|
|
hours.push(i)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return hours
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
getDisabledMinutes=(selectedHour)=>{
|
|
|
|
|
let minutes = []
|
|
|
|
|
if(this.state.dateString===moment().format('YYYY-MM-DD')){
|
|
|
|
|
let time = moment().format('HH:mm')
|
|
|
|
|
let timeArr = time.split(':')
|
|
|
|
|
if (selectedHour == parseInt(timeArr[0])) {
|
|
|
|
|
for(var i = 0; i < parseInt(timeArr[1]); i++) {
|
|
|
|
|
minutes.push(i)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
return minutes
|
|
|
|
|
}
|
|
|
|
|
// getDisabledHours=()=> {
|
|
|
|
|
// let hours = []
|
|
|
|
|
// if(this.state.dateString===moment().format('YYYY-MM-DD')){
|
|
|
|
|
// let time = moment().format('HH:mm')
|
|
|
|
|
// let timeArr = time.split(':')
|
|
|
|
|
// for (var i = 0; i < parseInt(timeArr[0]); i++) {
|
|
|
|
|
// hours.push(i)
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
//
|
|
|
|
|
// return hours
|
|
|
|
|
// }
|
|
|
|
|
//
|
|
|
|
|
// getDisabledMinutes=(selectedHour)=>{
|
|
|
|
|
// let minutes = []
|
|
|
|
|
// if(this.state.dateString===moment().format('YYYY-MM-DD')){
|
|
|
|
|
// let time = moment().format('HH:mm')
|
|
|
|
|
// let timeArr = time.split(':')
|
|
|
|
|
// if (selectedHour == parseInt(timeArr[0])) {
|
|
|
|
|
// for(var i = 0; i < parseInt(timeArr[1]); i++) {
|
|
|
|
|
// minutes.push(i)
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
// return minutes
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
onChange=(date, dateString)=>{
|
|
|
|
|
this.setState({
|
|
|
|
@ -147,14 +166,14 @@ const CollectionCreateForm = Form.create({ name: 'form_in_modal' })(
|
|
|
|
|
"width":"130px",
|
|
|
|
|
"height":"40px",
|
|
|
|
|
"border":"1px solid rgba(76,172,255,1)",
|
|
|
|
|
"border-radius":"4px",
|
|
|
|
|
"borderRadius":"4px",
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const rightbuton={
|
|
|
|
|
"width":"130px",
|
|
|
|
|
"height":"40px",
|
|
|
|
|
"background":"#4CACFF",
|
|
|
|
|
"border-radius":"4px",
|
|
|
|
|
"borderRadius":"4px",
|
|
|
|
|
}
|
|
|
|
|
const format = 'HH:mm';
|
|
|
|
|
|
|
|
|
@ -181,7 +200,7 @@ const CollectionCreateForm = Form.create({ name: 'form_in_modal' })(
|
|
|
|
|
|
|
|
|
|
{course_groups.map((item,key)=>{
|
|
|
|
|
return(
|
|
|
|
|
<Option value={item.id}>{item.name}</Option>
|
|
|
|
|
<Option value={item.id} key={key}>{item.name}</Option>
|
|
|
|
|
)
|
|
|
|
|
})}
|
|
|
|
|
|
|
|
|
@ -226,21 +245,63 @@ const CollectionCreateForm = Form.create({ name: 'form_in_modal' })(
|
|
|
|
|
onChange={this.onChange}
|
|
|
|
|
/>)}
|
|
|
|
|
</Form.Item>
|
|
|
|
|
|
|
|
|
|
<style>
|
|
|
|
|
{
|
|
|
|
|
`
|
|
|
|
|
#form_in_modal_start_time{
|
|
|
|
|
width:413px;
|
|
|
|
|
padding-left: 10px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#form_in_modal_end_time{
|
|
|
|
|
width:413px;
|
|
|
|
|
padding-left: 10px;
|
|
|
|
|
}
|
|
|
|
|
`
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
<Form.Item label="开始时间:">
|
|
|
|
|
{getFieldDecorator('start_time', {
|
|
|
|
|
rules: [{ type: 'object', required: true, message: '请选择开始时间' }],
|
|
|
|
|
})(<TimePicker style={{width:"413px"}} format={format} getPopupContainer={trigger => trigger.parentNode}/>)}
|
|
|
|
|
})(
|
|
|
|
|
// <TimePicker style={{width:"413px"}} format={format} getPopupContainer={trigger => trigger.parentNode}/>
|
|
|
|
|
<TimePicker
|
|
|
|
|
style={{width:"413px"}}
|
|
|
|
|
selected={this.state.start_time}
|
|
|
|
|
onChange={date => this.handleChangestart_time(date)}
|
|
|
|
|
showTimeSelect
|
|
|
|
|
showTimeSelectOnly
|
|
|
|
|
timeIntervals={1}
|
|
|
|
|
timeCaption="Time"
|
|
|
|
|
timeFormat="HH:mm"
|
|
|
|
|
getPopupContainer={trigger => trigger.parentNode}
|
|
|
|
|
/>
|
|
|
|
|
)}
|
|
|
|
|
</Form.Item>
|
|
|
|
|
|
|
|
|
|
<Form.Item label="结束时间:">
|
|
|
|
|
{getFieldDecorator('end_time', {
|
|
|
|
|
rules: [{ type: 'object', required: true, message: '请选择结束时间' }],
|
|
|
|
|
})(<TimePicker style={{width:"413px"}} format={format} getPopupContainer={trigger => trigger.parentNode}
|
|
|
|
|
disabledHours={this.getDisabledHours}
|
|
|
|
|
disabledMinutes={this.getDisabledMinutes}
|
|
|
|
|
|
|
|
|
|
/>)}
|
|
|
|
|
})(
|
|
|
|
|
// <TimePicker style={{width:"413px"}} format={format} getPopupContainer={trigger => trigger.parentNode}
|
|
|
|
|
// disabledHours={this.getDisabledHours}
|
|
|
|
|
// disabledMinutes={this.getDisabledMinutes}
|
|
|
|
|
//
|
|
|
|
|
// />
|
|
|
|
|
<TimePicker
|
|
|
|
|
style={{width:"413px"}}
|
|
|
|
|
selected={this.state.end_time}
|
|
|
|
|
onChange={date => this.handleChangeend_time(date)}
|
|
|
|
|
showTimeSelect
|
|
|
|
|
showTimeSelectOnly
|
|
|
|
|
timeIntervals={1}
|
|
|
|
|
minTime={this.state.dateString===moment().format('YYYY-MM-DD')||this.state.dateString===null?new Date():false}
|
|
|
|
|
maxTime={this.state.dateString===moment().format('YYYY-MM-DD')||this.state.dateString===null?moment().endOf('day').toDate():false}
|
|
|
|
|
timeCaption="Time"
|
|
|
|
|
timeFormat="HH:mm"
|
|
|
|
|
getPopupContainer={trigger => trigger.parentNode}
|
|
|
|
|
/>
|
|
|
|
|
)}
|
|
|
|
|
</Form.Item>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|