import {Component, ElementRef, ViewChild} from '@angular/core';
import {IonicPage, NavController, NavParams, Slides} from 'ionic-angular';
import {LearnDetailPage} from "../learn-detail/learn-detail";

@IonicPage()
@Component({
  selector: 'page-learn-manage',
  templateUrl: 'learn-manage.html',
})
export class LearnManagePage {

    @ViewChild(Slides) slides: Slides;
    @ViewChild('tips') tips:ElementRef;

    index;
    tabsList = [
        {name:"全部",},
        {name:"待发布",},
        {name:"已发布",},
        {name:"已过期",}
    ];
    allList = [];   //全部
    noList = [];    //待发布
    doList = [];    //已发布
    edList = [];   //已过期
    list = [
        {title:'党组织文章测试1',groupName:'全体人员',status:'1'},
        {title:'党组织文章测试2',groupName:'全体人员',status:'1'},
        {title:'党组织文章测试3',groupName:'全体人员',status:'2'},
        {title:'党组织文章测试4',groupName:'全体人员',status:'2'},
        {title:'党组织文章测试5',groupName:'全体人员',status:'3'},
        {title:'党组织文章测试6',groupName:'全体人员',status:'3'},
        {title:'党组织文章测试7',groupName:'全体人员',status:'4'},
        {title:'党组织文章测试8',groupName:'全体人员',status:'4'},
    ];

    constructor(public navCtrl: NavController, public navParams: NavParams) {
    }

    ionViewDidLoad() {
        let itemWidth = window.screen.width /4;
        this.tips.nativeElement.style.left = itemWidth / 2 - this.tips.nativeElement.offsetWidth / 2 + 'px';
        this.getList()
    }

    getList(){
        this.list.forEach(e=>{
            if(e.status === '1') this.noList.push(e);
            if(e.status === '2') this.doList.push(e);
            if(e.status === '3') this.edList.push(e);
        })
    }

    change(index) {

        let itemWidth = window.screen.width /4;
        // 自身div的一半 - 滑块的一半
        this.tips.nativeElement.style.left = itemWidth * index + itemWidth / 2 - this.tips.nativeElement.offsetWidth / 2 + 'px';
        this.slides.slideTo(index)
        this.index = index;
    }

    //
    slideChanged(){
        this.index = this.slides.getActiveIndex();
        if(this.index < 3){
            let itemWidth = window.screen.width /4;
            // 自身div的一半 - 滑块的一半
            this.tips.nativeElement.style.left = itemWidth * this.index + itemWidth / 2 - this.tips.nativeElement.offsetWidth / 2 + 'px';
        }
    }

    goToResult(item){
        this.navCtrl.push("LearnDetailPage")
    }


}
