|
|
@@ -2,10 +2,10 @@
|
|
|
* Created by FANGlh on 2018/11/12 15:34.
|
|
|
*/
|
|
|
|
|
|
-import React,{Component} from 'react';
|
|
|
-import './ClassSchedule.css';
|
|
|
+import React, {Component} from 'react';
|
|
|
+import './ClassSchedule.css';
|
|
|
import line_img from '../../../style/imgs/line_img.png';
|
|
|
-import {fetchPost,fetchGet,fetchGetNoSession} from '../../../utils/fetchRequest';
|
|
|
+import {fetchPost, fetchGet, fetchGetNoSession} from '../../../utils/fetchRequest';
|
|
|
import {API} from '../../../configs/api.config';
|
|
|
import {Toast} from 'antd-mobile';
|
|
|
import moment from 'moment'
|
|
|
@@ -13,61 +13,105 @@ import {connect} from 'react-redux';
|
|
|
import hi0_img from '../../../style/imgs/ic_head1.png';
|
|
|
|
|
|
function HSItem(props) {
|
|
|
- return(
|
|
|
- <div style={{marginTop:0,marginLeft:10}}>
|
|
|
- <img src={line_img} alt="" style={{width:2,height:25,marginLeft:12}}/>
|
|
|
- <div className="sch_hang_sty">
|
|
|
+ return (
|
|
|
+ <div className='common-flex-row' style={{height: '60px', paddingLeft: '26px'}}>
|
|
|
+ <div className='common-flex-column'
|
|
|
+ style={{height: '100%', justifyContent: 'center', alignItems: 'center'}}>
|
|
|
+ {props.isFirst ? <div style={{flex: 1}}></div>
|
|
|
+ : <div style={{background: '#E9E9E9', flex: '1', width: '2px'}}></div>}
|
|
|
<div className="green_point"></div>
|
|
|
- <div className="sch_time_sty">{moment(props.itemdata.curStartTime).format('HH:mm')}–{moment(props.itemdata.curEndTime).format('HH:mm')}</div>
|
|
|
- <div className="sch_class_sty">{props.itemdata.curName}</div>
|
|
|
- <img className="teach_img" src={props.itemdata.userPhoto==""||props.itemdata.userPhoto==null ? hi0_img : props.itemdata.userPhoto}alt=""/>
|
|
|
- <div className="sch_teacher_sty">{props.itemdata.userName}</div>
|
|
|
+ {props.isLast ? <div style={{flex: 1}}></div>
|
|
|
+ : <div style={{background: '#E9E9E9', flex: '1', width: '2px'}}></div>}
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div className="sch_hang_sty">
|
|
|
+ <div
|
|
|
+ className="sch_time_sty">{props.itemdata.startTime}–{props.itemdata.endTime}</div>
|
|
|
+ <div className="sch_class_sty">{props.itemdata.subjectName}</div>
|
|
|
+ <img className="teach_img"
|
|
|
+ src={props.itemdata.teacherPhoto == "" || props.itemdata.userPhoto == null ? hi0_img : props.itemdata.userPhoto}
|
|
|
+ alt=""/>
|
|
|
+ <div className="sch_teacher_sty">{props.itemdata.teacherName}</div>
|
|
|
</div>
|
|
|
{/*<img src={line_img} alt="" style={{width:2,height:15,marginLeft:12}}/>*/}
|
|
|
</div>
|
|
|
)
|
|
|
}
|
|
|
-class ClassSchedule extends Component{
|
|
|
|
|
|
- constructor(){
|
|
|
+class ClassSchedule extends Component {
|
|
|
+
|
|
|
+ constructor() {
|
|
|
super();
|
|
|
this.state = {
|
|
|
- curDay:new Date().getDay(),
|
|
|
- classData:{
|
|
|
- monday:[],
|
|
|
- tuesday:[],
|
|
|
- wednesday:[],
|
|
|
- thursday:[],
|
|
|
- friday:[],
|
|
|
- saturday:[],
|
|
|
- sunday:[]
|
|
|
+ curDay: new Date().getDay(),
|
|
|
+ classData: {
|
|
|
+ monday: [],
|
|
|
+ tuesday: [],
|
|
|
+ wednesday: [],
|
|
|
+ thursday: [],
|
|
|
+ friday: [],
|
|
|
+ saturday: [],
|
|
|
+ sunday: []
|
|
|
},
|
|
|
- curDayData:[],
|
|
|
- Class_SchData:[1,2,3,4],
|
|
|
+ curDayData: [],
|
|
|
+ Class_SchData: [1, 2, 3, 4],
|
|
|
}
|
|
|
}
|
|
|
- render(){
|
|
|
- return(
|
|
|
+
|
|
|
+ render() {
|
|
|
+ const courseItems = []
|
|
|
+
|
|
|
+ if (this.state.curDayData) {
|
|
|
+ this.state.curDayData.forEach((itemata, index) => {
|
|
|
+ let isFirst = false
|
|
|
+ let isLast = false
|
|
|
+ if (index === 0) {
|
|
|
+ isFirst = true
|
|
|
+ isLast = false
|
|
|
+ }
|
|
|
+ if (index === (this.state.curDayData.length - 1)) {
|
|
|
+ isFirst = false
|
|
|
+ isLast = true
|
|
|
+ }
|
|
|
+ courseItems.push(<HSItem key={index} itemdata={itemata}
|
|
|
+ handelSItem={this.handelSItem}
|
|
|
+ isFirst={isFirst} isLast={isLast}/>)
|
|
|
+
|
|
|
+ })
|
|
|
+ }
|
|
|
+ return (
|
|
|
<div>
|
|
|
<div className="header_days_sty">
|
|
|
- <div onClick={this.selectDayClick.bind(this,1)} className={this.state.CurDay == 1 ? "isday_click" : 'each_day_default'} >一</div>
|
|
|
- <div onClick={this.selectDayClick.bind(this,2)} className={this.state.CurDay == 2 ? "isday_click" : 'each_day_default'}>二</div>
|
|
|
- <div onClick={this.selectDayClick.bind(this,3)} className={this.state.CurDay == 3 ? "isday_click" : 'each_day_default'}>三</div>
|
|
|
- <div onClick={this.selectDayClick.bind(this,4)} className={this.state.CurDay == 4 ? "isday_click" : 'each_day_default'}>四</div>
|
|
|
- <div onClick={this.selectDayClick.bind(this,5)} className={this.state.CurDay == 5 ? "isday_click" : 'each_day_default'}>五</div>
|
|
|
+ <div onClick={this.selectDayClick.bind(this, 1)}
|
|
|
+ className={this.state.CurDay == 1 ? "isday_click" : 'each_day_default'}>一
|
|
|
+ </div>
|
|
|
+ <div onClick={this.selectDayClick.bind(this, 2)}
|
|
|
+ className={this.state.CurDay == 2 ? "isday_click" : 'each_day_default'}>二
|
|
|
+ </div>
|
|
|
+ <div onClick={this.selectDayClick.bind(this, 3)}
|
|
|
+ className={this.state.CurDay == 3 ? "isday_click" : 'each_day_default'}>三
|
|
|
+ </div>
|
|
|
+ <div onClick={this.selectDayClick.bind(this, 4)}
|
|
|
+ className={this.state.CurDay == 4 ? "isday_click" : 'each_day_default'}>四
|
|
|
+ </div>
|
|
|
+ <div onClick={this.selectDayClick.bind(this, 5)}
|
|
|
+ className={this.state.CurDay == 5 ? "isday_click" : 'each_day_default'}>五
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- <div className="comhline_sty"></div>
|
|
|
+ <div className="comhline_sty" style={{marginBottom:'20px'}}></div>
|
|
|
+ {courseItems}
|
|
|
+
|
|
|
{/*<div style={{fontSize:14,color:"#333333",margin:20}}>11月12日,<span style={{fontSize:12}}>2018年</span></div>*/}
|
|
|
- <div className="scheedule_sty1">
|
|
|
- {/*<div style={{color:"#333333",fontSize:14,marginBottom:10,marginTop:10}}>上午</div>*/}
|
|
|
+ {/*<div className="scheedule_sty1">
|
|
|
+ <div style={{color:"#333333",fontSize:14,marginBottom:10,marginTop:10}}>上午</div>
|
|
|
<p>{this.state.curWeek}</p>
|
|
|
- <div className="comhline_sty1" style={{marginBottom:10}}></div>
|
|
|
+ <div className="comhline_sty1" style={{marginBottom: 10}}></div>
|
|
|
<div>
|
|
|
- {/*{this.state.curDayData.map((itemdata,index) => <HSItem key ={index} itemdata = {itemdata} handelSItem={this.handelSItem}></HSItem>)}*/}
|
|
|
+ {this.state.curDayData.map((itemdata,index) => <HSItem key ={index} itemdata = {itemdata} handelSItem={this.handelSItem}></HSItem>)}
|
|
|
</div>
|
|
|
- </div>
|
|
|
+ </div>*/}
|
|
|
|
|
|
- <div className="comhline_sty"></div>
|
|
|
+ {/*<div className="comhline_sty"></div>*/}
|
|
|
|
|
|
{/*<div className="scheedule_sty1">*/}
|
|
|
{/*<div style={{color:"#333333",fontSize:14,marginBottom:10,marginTop:10}}>下午</div>*/}
|
|
|
@@ -80,45 +124,47 @@ class ClassSchedule extends Component{
|
|
|
)
|
|
|
}
|
|
|
|
|
|
- selectDayClick = (value)=>{
|
|
|
- console.log("value",value)
|
|
|
+ selectDayClick = (value) => {
|
|
|
+ console.log("value", value)
|
|
|
var Cdata = null
|
|
|
- if(value == 1){
|
|
|
- Cdata = this.state.classData.monday
|
|
|
- }else if(value == 2){
|
|
|
- Cdata = this.state.classData.tuesday
|
|
|
- }else if(value == 3){
|
|
|
- Cdata = this.state.classData.wednesday
|
|
|
- }else if(value == 4){
|
|
|
- Cdata = this.state.classData.thursday
|
|
|
- }else if(value == 5){
|
|
|
- Cdata = this.state.classData.friday
|
|
|
+ if (value == 1) {
|
|
|
+ Cdata = this.state.classData.curMons
|
|
|
+ } else if (value == 2) {
|
|
|
+ Cdata = this.state.classData.curTuess
|
|
|
+ } else if (value == 3) {
|
|
|
+ Cdata = this.state.classData.curWeds
|
|
|
+ } else if (value == 4) {
|
|
|
+ Cdata = this.state.classData.curThurs
|
|
|
+ } else if (value == 5) {
|
|
|
+ Cdata = this.state.classData.curFris
|
|
|
+ } else {
|
|
|
+ Cdata = []
|
|
|
}
|
|
|
this.setState({
|
|
|
- CurDay:value,
|
|
|
- curDayData:Cdata
|
|
|
- },function (){
|
|
|
- console.log("curDayData",this.state.curDayData)
|
|
|
+ CurDay: value,
|
|
|
+ curDayData: Cdata
|
|
|
+ }, function () {
|
|
|
+ console.log("curDayData", this.state.curDayData)
|
|
|
})
|
|
|
}
|
|
|
|
|
|
componentWillMount() {
|
|
|
document.title = '课表查询'
|
|
|
}
|
|
|
+
|
|
|
componentDidMount() {
|
|
|
- fetchGet(API.curriculumListByStuId,{
|
|
|
- stuId:this.props.userInfo.user.student.stuId,
|
|
|
- curStatus:1
|
|
|
- },{}).then((response)=>{
|
|
|
- if(response.success && response.data){
|
|
|
+ fetchGet(API.curriculumListByStuId, {
|
|
|
+ stuId: this.props.userInfo.user.student.stuId,
|
|
|
+ curStatus: 1
|
|
|
+ }, {}).then((response) => {
|
|
|
+ if (response.success && response.data) {
|
|
|
this.setState({
|
|
|
- classData:response.data
|
|
|
- },function () {
|
|
|
+ classData: response.data
|
|
|
+ }, function () {
|
|
|
this.selectDayClick(this.state.curDay)
|
|
|
})
|
|
|
}
|
|
|
- }).catch((error) =>{
|
|
|
- console.log('error',error)
|
|
|
+ }).catch((error) => {
|
|
|
if (typeof error === 'string') {
|
|
|
Toast.fail(error, 2)
|
|
|
} else {
|
|
|
@@ -127,6 +173,7 @@ class ClassSchedule extends Component{
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
let mapStateToProps = (state) => ({
|
|
|
userInfo: {...state.redUserInfo}
|
|
|
})
|