<div>
    <div class="data-box">
        <div class="data-top">
            <div class="fr">
                <el-button type="primary" @click="allDownload()">下载选中的文件</el-button>
                <el-button class="return-btn" @click="open('UserCourseDetailPeriodTable')">返回课时列表</el-button>
            </div>
            <div class="fl data-select__image" :class="urls.length>0?'data-select':'data-selected'"
                @click="allSelect()"></div>
            <div class="fl data-select__text">已选择<span>{{urls.length}}</span>份文件</div>
        </div>
        <div class="data-list" v-if="list.length">
            <div class="data-item" v-for="(item,i) in list" :key="i">
                <div class="fl data-select__image" :class="item.select?'data-select':'data-selected'"
                    @click="select(item)" v-if="!item.downloaded"></div>
                <div v-if="item.childs">
                    <div class="clearfix">
                        <div class="fl item-zlname">
                            <i class="item-file__image fl"></i>
                            <span class="fl">{{item.zltypename}}</span>
                        </div>
                        <div class="fr item-right" @click="openList(item)" style="cursor: pointer;">
                            <i class="el-icon-arrow-right  arrow-right fr"></i>
                            <div class="fr">{{item.childs.length}}个文件</div>
                        </div>
                    </div>
                    <div class="cdata-list" v-if="item.show">
                        <div class="cdata-item" v-for="(sitem,i) in item.childs" :key="i">
                            <div class="fl data-select__image" :class="sitem.select?'data-select':'data-selected'"
                                @click="select(sitem)" v-if="!sitem.downloaded"></div>
                            <div class="fl type-image"
                                :class="(sitem.DocType=='pdf'&&'pdf-image') || (sitem.DocType=='ppt'&&'ppt-image')||'other-image'">
                            </div>
                            <div class="fl cdata-item__name"  @click="filePreview(sitem.ZLAdd,sitem.ZLName)">
                                <div>{{sitem.ZLName}}</div>
                                <div class="data-size">
                                    {{Math.floor(sitem.size/1024)>0?(sitem.size/1024).toFixed()+'M':(sitem.size%1024).toFixed()+'K'}}
                                </div>
                            </div>
                            <div class="fr cdata-item__download" @click.stop="download(sitem)">{{sitem.downloaded?'查看详情':'下载资料'}}</div>
                        </div>
                    </div>
                </div>
                <div @click="filePreview(item.ZLAdd,item.ZLName)" style="cursor: pointer;" v-else>
                    <div class="fl cdata-item__name">
                        <div>{{item.ZLName}}</div>
                        <div class="data-size">
                            {{Math.floor(item.size/1024)>0?(item.size/1024).toFixed()+'M':(item.size%1024).toFixed()+'K'}}
                        </div>
                    </div>
                    <div style="margin-right: 0px;" class="cdata-item__download" @click="download(item)">
                        <ks-image src="/KS_Inc/member-center/images/common/lesson_icon_download@2x.png" v-if="!item.downloaded" class="cdata-item__download-icon"/>
                        <span class="cdata-item__download-tips">{{item.downloaded ? '查看资料':'下载'}}</span>
                    </div>
                </div>
            </div>
        </div>
        <ks-empty msg="课程暂无讲义资料~" v-else/>
    </div>
    
    <!-- <div v-else>
        <div class="data-top">
            <div class="fl data-select__image" :class="urls.length>0?'data-select':'data-selected'"
                @click="allSelect()"></div>
            <div class="fl data-select__text">已选择<span>{{urls.length}}</span>份文件</div>
            <el-button class="fr return-btn" @click="show=!show">返回</el-button>
            <el-button class="fr" type="primary" @click="allDownload()">点击下载</el-button>
        </div>
        <div class="cdata-list">
            <div class="cdata-item" @click="filePreview(item.ZLAdd,item.ZLName)" v-for="(item,i) in childList" :key="i">
                <div class="fl data-select__image" :class="item.select?'data-select':'data-selected'"
                    @click="select(item)"></div>
                <div class="fl type-image"
                    :class="(item.DocType=='pdf'&&'pdf-image') || (item.DocType=='ppt'&&'ppt-image')||'other-image'">
                </div>
                <div class="fl cdata-item__name">
                    <div>{{item.ZLName}}</div>
                    <div class="data-size">
                        {{Math.floor(item.size/1024)>0?(item.size/1024).toFixed()+'M':(item.size%1024).toFixed()+'K'}}
                    </div>
                </div>
                <div class="fr cdata-item__download" :class="item.downloaded && 'cdata-item__download--downloaded'" @click.stop="download(item)"></div>
            </div>
        </div>
    </div> -->
    
</div>