<template>
    <section>
        <TopNav :bgColor="bgColor" :title="navTitle" :isNavFix="isNavFix" :burialPoint="pointStyle"></TopNav>

        <!-- <teacherTop :backMethod="backMethod"></teacherTop> -->
        <section class="activity-box">
            <div class="activity-count">共{{list.length}}个活动</div>
            <div class="activity-list">
                <div class="activity-item" v-for="(item,index) in list" :key="index" @click="goToPage(item)">
                    <img v-lazy="item.imageUrl" class="img" :key="item.imageUrl"/>
                   <!--  <div class="time">活动时间：9月3日-9月9日</div> -->
                </div>
                <div class="no-show" v-if="list.length.length == 0">
                    暂无数据
                </div>
            </div>
            <BackTop v-if="isShowBackTop" :burialPoint="pointStyle"></BackTop>
        </section>
    </section>
    
</template>

<script>
// import { setEventByModuleCode } from '@/utils/index'
// import TopNav from '../../components/common/topNav';
import TopNav from '../../componentsn/teacher/topNav';
// import teacherTop from '../../components/teachers/teach-top';
// import BackTop from '../../components/common/backTop';
import BackTop from '../../componentsn/teacher/backTop';
import {activity_action} from '../../utils/buryingPoint';
import { deepCopy } from '../../utils';
export default {
    data(){
        return {
            backMethod: 'native',
            tittle: '',
            list: [],
            bgColor: '#fff',
            navTitle:' 专项合作',
            isBorder: true,
            isNavFix: true,
            id: 1,
            tabName:'活动',
            tabList: [],
            isShowBackTop: false,
            pointStyle: 'activity',
            token: null
        }
    },
    components:{
        TopNav,
        BackTop
    },
    created(){
        let _this = this;
        this.id = this.$route.query.categoryId || 1
        this.navTitle = this.id == 1 ? '专项合作' : '活动掠影'
        // this.token = this.$route.query.userToken || this.$route.query.token
        window.__getUserInfo = function(parm){
            _this.token = parm.userToken
            _this.getTabData()
        }
        window.addEventListener('scroll', this.scrollFun);
        if( window.__isWeb) {
            this.getTabData()
        }
        this.getUserInfo()
    },
	mounted(){
      
    },
    beforeDestroyed(){
        window.removeEventListener('scroll', this.scrollFun)
    },

    methods:{

        //获取版本号
        getUserInfo(){
            rocNative.getUserInfo({
                __funcName: '__getUserInfo'
            })
        },
        scrollFun(){
            let scrollTop = document.documentElement.scrollTop;
            this.isShowBackTop = scrollTop > 0 ? true : false;
        },
        goToPage(itemData){
            let paramList = deepCopy(this.setEventByModuleCode(itemData))
            let isStrokeUrl = paramList[0] && paramList[0]['value'] && paramList[0]['value'].indexOf('stroke.js') !== -1
            let strokeUrl = ''
            if ( isStrokeUrl ) {
                strokeUrl = paramList[0]['value'] + '&token=' + this.token
                paramList[0]['value'] = strokeUrl
            }
            rocNative.dispatchEventByModuleCode({
                modeCode: itemData.appModuleInfo.code,
                jsonString: paramList
            })
            this.appBuryingPointEntrust({
                ...activity_action,
                labelId: itemData.id,
                functionCode: this.id == 1 ? 'c_project' : 'f_activity',
                actionCode: this.id == 1 ? 'c_project_tab' : 'c_activity_tab',
                labelValue: itemData.title,
                createdTime: new Date().getTime()
            })
        },

        // 埋点
        appBuryingPointEntrust(val) {
            rocNative.appBuryingPointEntrust(val)
        },
        //查询tab 
        getTabData(){
            let _this = this,
            parm = {
                id: _this.id || 1,
                setEntry: 'headers',
                token: _this.token,
            }
            _this.GET('contents/contentList/tabById',parm).then(function(res){
                if(res.code === '000000'){
                  _this.navTitle =  res.data.name || '';
                  _this.tabName = _this.tabList[0] || '';
                  // if(_this.tabList.length>0){
                  //   _this.tabName = _this.tabList[0] || '';
                  // }
                  _this.getData();
                }else{
                  //alert(res.message)
                }
            })
        },

        //查询内容
        getData(){
            let _this = this,
            parm = {
                id: _this.id,
                tabName : _this.tabName,
                setEntry: 'headers',
                token: _this.token
            }
            // if(_this.tabName != ''){
            //     parm.tabName = _this.tabName
            // }
            _this.GET('contents/contentList/contentById',parm).then(function(res){

                if(res.code === '000000'){
                    _this.list =  res.data.contentList &&  res.data.contentList.contentList || [];
                }
            })
        }
    },
}

</script>

<style lang="scss" scoped>
    @import '../../style/mixin';
    .activity-box{
        padding: px2rem(15px);
        background: #fff;
    }
    .no-show{
        font-size: px2rem(15px);
        color: #999;
        text-align: center;
    }
    .activity-count{
        color: #999;
        font-size: px2rem(15px);
        padding-bottom: px2rem(15px);
    }
    .activity-item{
        // position: relative;
        width: px2rem(345px);
        max-height: px2rem(170px);
        margin-bottom:px2rem(10px);
        // box-shadow: 0 px2rem(2px) px2rem(6px) RGBA(42, 94, 161, 0.15);
        display: block;
        overflow: hidden;
        .img{
            width: 100%;
            max-height: 100%;
        }
        .time{
            position: absolute;
            color:#fff;
            height: px2rem(25px);
            line-height: px2rem(25px);
            background: RGBA(0, 0, 0, 0.1);
            border-radius: 0 0 px2rem(5px) px2rem(5px);
            width: 100%;
            bottom: 0;
            left: 0;
            z-index: 10;
            font-size: px2rem(14px);
            padding-left: px2rem(5px);
        }
    }

</style>
