//*
// 个人中心 我的预约
// */

import Loger from "../Loger";
import Ape from "./Ape";
import $ from "jquery";
import ClassDataProxy from "proxy/ClassDataProxy";
import ErrorApe from "./ErrorApe";
import MessageTypes from "../MessageTypes";

const classifyList = `<div class="courseMinuteListTimeTit" style="display: {_isShowTitle}">
                            <span class="courseMinuteListTime">{_liveTimer}</span>
                            <span class="courseMinuteListWire"></span>
                        </div>
                      <div class="classifyListMyCenter {_classifyListR}">
                            <div class="myCenterContentMask accessLearningBtn">
                                <button class="myCenterContentMaskBtn btnHover" data="{_meetingNumber}">进入学习</button>
                            </div>
                            <div class="myCenterContentMask cancelReservation">
                                <button class="myCenterContentMaskBtn btnHover" data="{_studentMeetingId}">取消预约</button>
                            </div>
                            <img class="myCenterContentListImg" src="{_msgImg}" alt="">
                            <p class="myCenterContentListTit">{_meetingName}</p>
                            <p class="myCenterContentListTit1">主讲人：{_create_user}</p>
                            <p class="myCenterContentMin">45min</p>
                            <span class="myCenterContentTimer">{_liveTimer}</span>
                        </div>`;

//学生端显示老师信息
const teacherInfoLeft = `<div class="teacherCorrelatedInfoBox">
                                <div class="teacherCorrelatedInfoLeft">
                                    <img class="teacherCorrelatedInfoImg" id="teacherCorrelatedInfoImg" src="images/u293.png" alt="">
                                    <div class="teacherCorrelatedInfo">
                                        <b class="teacherCorrelatedInfoName" id="teacherCorrelatedInfoName">{_teacherName}</b>
                                        <b class="teacherCorrelatedInfoMajor">北京市|少儿英语</b>
                                        <b class="teacherCorrelatedInfoCourse">课程:50</b>
                                        <span class="teacherCorrelatedInfoMajorMsg">毕业于外国语学院，专业8级</span>
                                        <p class="cancelReservationBtn"">取消预约</p>
                                    </div>
                                </div>
                                <div class="teacherCorrelatedInfoCenter">`;
const teacherInfoCenter= `<img class="teachercourseImg" data="{_id}" src="{_imgSrc}" alt="">`;
const teacherInfoRight = `</div> <div class="teacherCorrelatedInfoBtn" data="{_teacherName}" value="{_meetingId}">更多课程</div>
                        </div></div>`;

const teacherDetail = `<span class="teacherDetailCurriculumList">《{_detailList}》</span>`

let loger = Loger.getLoger('PC-MyBookingsApe');
class MyBookingsApe extends Ape {
    constructor() {
        super();
        this.dataList = {};
        this.teacherList = {};
        this.presentInd = 1;//点击翻页默认为第一页
        this.addEvent();
        this.init();
    }

    init() {

        $('#subscribeList .liveInfoLeftLi').on('click',this._subscribeListHandler.bind(this));//课程 老师

        $('#studentMyCenterContentList').on('mouseenter','.classifyListMyCenter',this._mouseenter.bind(this));//个人中心移入进入课堂
        $('#studentMyCenterContentList').on('mouseleave','.classifyListMyCenter',this._mouseleave.bind(this));//个人中心移出进入课堂

        $('#courseMinuteList').on('mouseenter','.classifyListMyCenter',this._mouseenter.bind(this));//课程移入进入课堂
        $('#courseMinuteList').on('mouseleave','.classifyListMyCenter',this._mouseleave.bind(this));//课程移出进入课堂

        $('#teacherCorrelatedInfo').on('mouseenter','.classifyListMyCenter',this._cancelMouseenter.bind(this));//我的预约 课程移入显示取消预约
        $('#teacherCorrelatedInfo').on('mouseleave','.classifyListMyCenter',this._cancelMouseleave.bind(this));//我的预约 课程移出隐藏取消预约

        $('#studentMyCenterContentList').on('click','.accessLearningBtn',this._enterClassRoomHandler.bind(this));//我的预约进入课堂
        $('#courseMinuteList').on('click','.accessLearningBtn',this._enterClassRoomHandler.bind(this));//我的预约进入课堂

        $('#myCurriculumInfo').on('click','.teacherEnterClass',this._enterClassRoomHandler.bind(this));//我的课程进入课堂


        $('#teacherCorrelatedInfo').on('click','.teacherCorrelatedInfoBtn',this._teacherSubscribeMoveHandler.bind(this));//点击预约查看当前点击的更多信息

        $('#teacherCorrelatedInfo').on('click','.cancelReservation',this._cancelSubscribeHandler.bind(this));//取消预约

        $('#teacherCorrelatedInfo').on('click','.teachercourseImg',this._teacherClassDetails.bind(this));//点击进入老师课堂详情页

    }

    addEvent() {

    }
    //我的预约
    myBookingsMessage(){
        if(ClassDataProxy.userType == ClassDataProxy.USER_TYPE_8){
            this.studentBookings();
        }
    }
    studentBookings(){
        let that = this;
        let data = $('#subscribeList').find('.liveInfoLeftLiCheck').attr('data');
        this._studentCurriculumInfo(12,function(_data){
            if(_data){
                if(data == '1'){
                    that._studentSubscribeTeacher(_data.returnData.data)
                }else{
                    that._studentSubscribe(_data.returnData.data)
                }
            }
        });
    }
    _studentSubscribe(_data){
        let teacherCorrelatedInfo = $('#teacherCorrelatedInfo');
        teacherCorrelatedInfo.empty();
        for(let i = 0;i<_data.length;i++){
            if(_data[i]){
                let j = (i%4)==3;
                let _classifyList = this._format(classifyList,{
                    _classifyListR : j?'classifyListR':'',
                    _isShowTitle : 'none',
                    _meetingNumber : _data[i].meetingNumber,
                    _msgImg : '../images/u373.png',
                    _meetingName : _data[i].meeting_name,
                    _create_user : _data[i].teacherName,
                    _liveTimer : _data[i].meetingBeginTime.split(' ')[0],
                    _studentMeetingId : _data[i].studentMeetingId
                })
                teacherCorrelatedInfo.append(_classifyList)

            }else{
                console.error('_gainClassData没数据')
            }
        }

    }
    _studentSubscribeTeacher(_data){
        let teacherCorrelatedInfo = $('#teacherCorrelatedInfo');
        teacherCorrelatedInfo.empty();
        if(_data){
            this.teacherList={};
            for(let i = 0;i<_data.length;i++){
                let item=_data[i];
                if(item){
                    let temp = item.teacherName;
                    if(!this.teacherList[temp]) {
                        this.teacherList[temp] = [];
                    }
                    this.teacherList[temp].push(item)
                }
            }
            for( let key in this.teacherList){
                let teacherInfo = ''
                let arrList = this.teacherList[key];
                teacherInfo = this._format(teacherInfoLeft,{
                    _teacherName : key,
                    //  meetingNumber
                })
                for(let n = 0;n<arrList.length;n++){
                    teacherInfo += this._format(teacherInfoCenter,{
                        _imgSrc : 'images/u374.png',
                        _id : arrList[n].teacherName
                    })
                }
                teacherInfo += this._format(teacherInfoRight,{
                    _teacherName : key,
                   // _meetingId :
                })
                teacherCorrelatedInfo.append(teacherInfo)
            }
        }
    }
    //取消预约
    _cancelSubscribeHandler(evt){
        let _id = $(evt.target).attr('data');
        let _url = ClassDataProxy.locationProtocol + ClassDataProxy.locationProt + '/studentMeeting/updateStudentMeetingBySite/'+_id;
        let that = this;
        $.ajax({
            type: "PUT",
            url: _url,
            timeout:5000,
            headers: {
                siteId:ClassDataProxy.siteId,
                'token':ClassDataProxy.token
            },
            data:{status:'5'},
            success:function(_data){
                //获取课堂数据
                if(_data && _data.code == 200){
                    that.studentBookings();
                }
            },
            error:function(error){
                console.log(error,'失败')
            }
        })

    }
    //点击老师预约显示 老师详细
    _teacherClassDetails(evt){
        let name = $(evt.target).attr('data');
        let ind = $(evt.target).index();
        let _data = this.teacherList[name][ind]

        $('#lanclassBox').show();
        $('#myCenterBox').hide();

        $('#lanclassContentTitle').html(_data.meeting_name);
        $('#lanclassContentInfoName').html(_data.teacherName);
        $('#lanclassContentInfoTimeStart').html('开始时间：'+_data.meetingBeginTime);
        $('#lanclassContentInfoTimeEnd').html('结束时间：'+_data.meetingEndTime);
    }
    _teacherSubscribeMoveHandler(evt){
        $('#teacherDetailBox').show();
        $('#myCenterBox').hide();

      /*  let buttonIsCheck = $('#orderBtn').attr('value','0');
        if($('#orderBtn').attr('value') == '0'){
            $('#orderBtn').attr('disabled',false)
            $('#orderBtn').css('background','#ccc')
        }*/

        let teacherDetailCurriculum = $('#teacherDetailCurriculum');
        teacherDetailCurriculum.empty();

        let _data = $(evt.target).attr('data');
        if(_data){
            let _dataList = this.teacherList[_data];
            $('#teacherDetailInfoDetailName').html(_dataList[0].teacherName);
            for(let i = 0;i<_dataList.length;i++){
                let _teacherDetail = this._format(teacherDetail,{
                    _detailList : _dataList[i].meeting_name
                })
                teacherDetailCurriculum.append(_teacherDetail)
            }
        }
    }
    //切换类的公用样式
    commonality(evt){
        $(evt.currentTarget).addClass('liveInfoLeftLiCheck').siblings().removeClass('liveInfoLeftLiCheck');
    }
    _subscribeListHandler(evt){
        this.commonality(evt);
        this.studentBookings();
    }
    _cancelMouseenter(evt){
        $(evt.currentTarget).find('.cancelReservation').show();
    }
    _cancelMouseleave(evt){
        $(evt.currentTarget).find('.cancelReservation').hide();
    }
    _mouseenter(evt){
        $(evt.currentTarget).find('.accessLearningBtn').show();
    }
    _mouseleave(evt){
        $(evt.currentTarget).find('.accessLearningBtn').hide();
    }
    _enterClassRoomHandler(evt){
        let ind = $(evt.target).attr('data');
        window.open('http://networkshool.xuedianyun.com/3m/attend.do?meetingNumber=' + ind);
    }
    _studentCurriculumInfo(num,callback){
        let _url = ClassDataProxy.locationProtocol + ClassDataProxy.locationProt + '/studentMeeting/getStudentMeetingByStudentId/'+ClassDataProxy.id;
        let that = this;
        $.ajax({
            type: "GET",
            url: _url,
            timeout:5000,
            headers: {siteId:ClassDataProxy.siteId,pageno:num,id:ClassDataProxy.id,
                'token':ClassDataProxy.token},
            success:function(_data){

                //获取我的课程数据
                if(_data && _data.code == 200){
                    if(callback){
                        callback(_data);
                    }
                }else{
                    if(callback){
                        callback(null);
                    }
                }
            },
            error:function(error){
                //alert('直播数据获取失败')
                if(callback){
                    callback(null);
                }
                loger.log(error,'直播数据获取失败')
            }
        })
    }
    //工具类
    _format(str, obj) {
        return str.replace(/\{(\w+)\}/g, function (match, group, index) {
            return obj[group];
        });
    };
}
export default MyBookingsApe;