<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>聊天窗口</title>
    <link rel="stylesheet" href="../css/edu-tic copy.css">
    <link rel="stylesheet" href="../css/global.css">
    <link rel="stylesheet" href="../css/page_classlist.css">
    <script src="../vendor/vue/vue.min.js"></script>    
    <!-- WebIM SDK -->
    <script src="https://tic-res-1259648581.file.myqcloud.com/webim/webim.min.js"></script>
</head>
<body>
<div class="tic-chatapp" id="classlist_app">
    <div class="tic-chatapp__tool">
        <div class="tic-chatapp__tool-img" :style="{background: 'url('+ userInfo.avatar + ')'}">            
        </div>
        <div class="tic-chatapp__tool-list">
            <a href="javascript:;" class="tic-btn actived">
                <i class="tic-chatapp-book"></i>
            </a>
            <a v-if='false' href="javascript:;" class="tic-btn">
                <i class="tic-chatapp-news"></i>
            </a>
            <a v-if='false' href="javascript:;" class="tic-btn">
                <i class="tic-chatapp-file"></i>
            </a>
        </div>
        <div class="tic-chatapp__tool-ft">
            <a v-if='false' href="javascript:;" class="tic-btn">
                <i class="tic-chatapp-setting"></i>
            </a>
        </div>
    </div>
    <div class="tic-chatapp__msg">
        <div v-if='false' class="tic-chatapp__msg-add">
            <span class="text">+ 新建</span>
        </div>
        <div class="tic-chatapp__tab">
            <div class="tic-tab">
                <div class="tic-tab__list">
                    <ul>
                        <li :class='[{"actived":class_filter=="will"}]' @click='setClassFilter("will")'>待开课</li>
                        <li :class='[{"actived":class_filter=="ing"}]' @click='setClassFilter("ing")'>进行中</li>
                        <li :class='[{"actived":class_filter=="end"}]' @click='setClassFilter("end")'>已结束</li>
                    </ul>
                </div>
                <div class="tic-tab__content actived">
                    <div class="tic-chatapp__list roll-scroll">
                        <div v-if='class_list.length==0' class="tic-chatapp__list">
                            <div class="tic-chatapp__list-item text-empty">
                                没有更多数据～
                            </div>
                        </div>
                        <div v-for="item in class_list" :class='["tic-chatapp__list-item", {"actived":cur_class_info.class_id==item.class_id}]'>
                            <div class="tic-chatapp__list-item--info" @click='activeClass(item)'>
                                <h3 class="title" v-text='item.class_topic'></h3>
                                <p class="class-id" v-text='item.class_id'></p>
                                <p class="time" v-text='item.show_time'></p>
                            </div>
                            <div class="tic-chatapp__list-item--btn">
                                <button :class='["tic-btn", "v2", "weak", {"actived":cur_class_info.class_id==item.class_id}, {"disabled":class_filter=="end"}]' 
                                    @click="enterClass(item.class_id)" v-text='class_filter=="end" ? "已结束" : "进入"'></button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="tic-chatapp__details">
        <div class="tic-chatapp__operation">
            <a href="javascript:;" class="tic-btn" @click='minWindow()'>
                <i class="tic-icon tic-icon-minshow"></i>
            </a>
            <a href="javascript:;" class="tic-btn" @click='maxWindow()'>
                <i class="tic-icon tic-icon-dialog-maxshow"></i>
            </a>
            <a href="javascript:;" class="tic-btn" @click='closeWindow()'>
                <i class="tic-icon tic-icon-dialog-close"></i>
            </a>
        </div>
        <div class="tic-chatapp__details-list roll-scroll">
            <div class="tic-chatapp__details-item">
                <div class="tic-chatapp__details-item--hd">
                    <h3 class="title">课程信息</h3>
                </div>
                <div class="tic-chatapp__details-item--bd">
                    <div class="tic-chatapp__details-course">
                        <div class="tic-chatapp__details-course--info">
                            <p>课堂主题：{{cur_class_info.class_topic}}</p>
                            <p>课堂ID：{{cur_class_info.class_id}}</p>
                        </div>
                        <div class="tic-chatapp__details-course-op">
                            <button :class='["tic-btn", "v2", {"disabled":class_filter=="end"}]' 
                                @click="enterClass(cur_class_info.class_id)" v-text='class_filter=="end" ? "已结束" : "进入教室"'></button>
                            <button class="tic-btn v2 weak" v-if='false'>分享</button>
                        </div>
                    </div>
                </div>
            </div>
            <div class="tic-chatapp__details-item">
                <div class="tic-chatapp__details-item--hd">
                    <h3 class="title">老师信息</h3>
                </div>
                <div class="tic-chatapp__details-item--bd">
                    <div class="tic-chatapp__details-user">
                        <div v-if="teacherInfo" class="details-user__img" :style="{background: 'url('+ teacherInfo.avatar + ')'}"> 
                        </div>
                        <div class="details-user__info">
                            <p v-if="teacherInfo" class="details-user__info-item">
                                {{teacherInfo.nickname}}
                            </p>
                            <p v-if="teacherInfo" class="details-user__info-item">
                                {{teacherInfo.personal_profile}}
                            </p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="tic-chatapp__details-item">
                <div class="tic-chatapp__details-item--hd">
                    <h3 class="title">课程简介</h3>
                </div>
                <div class="tic-chatapp__details-item--bd">
                    <div class="details-item__info">
                        {{cur_class_info.class_introduction}}
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div v-if="is_show_dialog" class="tic-dialog" v-cloak>
    <div v-if="is_show_msg" class="xdialog" v-cloak>
        <div class="xdialog-title">
            <span class="xdialog-title-name" v-text="dialog_title"></span>
            <img class="xdialog-sys-close" @click="onDlgClick(-1)" />
        </div>
        <div class="xdialog-content">
            <span class="xdialog-content-msg" v-text="dialog_msg"></span>
        </div>
        <div class="xdialog_button">
            <template v-for="(item, index) in dialog_button">
                <button @click="onDlgClick(index)" class="btn_common">{{ item }}</button>
            </template>
        </div>
    </div>
</div>

        <script src="../js/storage.js"></script>
        <script src="../js/include.js"></script>
        <script src="../js/classlist/page_classlist.js"></script>
</body>
</html>