discover.ts

import {Component, ElementRef, HostListener, NgZone, Renderer2, ViewChild} from '@angular/core';
import {Content, InfiniteScrollContent, IonicPage, NavController, NavParams, Slide, Slides} from 'ionic-angular';
import {SearchNewPage} from "../../home-pages/search-new/search-new";
import {TabsService} from "../tabs.service";
import {StuffDetailPage} from "../../home-pages/stuff-detail/stuff-detail";
import {PublishPage} from "../../discover-pages/publish/publish";
import {EmitService} from "../../../provide/emit.service";
import {NoticePage} from "../notice/notice";
import {AppGlobal} from "../../../service/http.service";
import {CommonService} from "../../../provide/common.service";
import {SwiperComponent} from "../../../components/swiper/swiper";
import {timer} from "rxjs/observable/timer";
import {Storage} from "@ionic/storage";

declare let Swiper: any;

@IonicPage()
@Component({
    selector: 'page-discover',
    templateUrl: 'discover.html',
})
export class DiscoverPage {
    @ViewChild('swiperCom') swiperCom: SwiperComponent;
    @ViewChild('tips') tips: ElementRef;
    @ViewChild('fixedTab') fixedTab: ElementRef;
    @ViewChild('topHeight') topHeight: ElementRef;
    @ViewChild('tabsParent') tabsParent: ElementRef;
    @ViewChild('tabsChildren') tabsChildren: ElementRef;
    @ViewChild('tabSpan') tabSpan: ElementRef;
    @ViewChild('newsContent') newsContent: ElementRef;
    @ViewChild('newContentParent') newContentParent: ElementRef;
    @ViewChild('scrollTab') scrollTab: ElementRef;
    @ViewChild(Content) content: Content;
    @ViewChild('slideContent') slideContent: Content;
    @ViewChild(Slides) slides: Slides;

    //所属板块类型:
    //1党章党规,2系列讲话,3中央精神,4本市部署,5通知公告,6党建动态,7工作提示,8党务参考
    //9廉政格言,10纪检提示,11风险排查,12警示教育,13支部活动,14党建联建,15结对帮扶,
    tabsList = [
        {
            "name": "最新发布", "type": 0, "indexParent": 0, "children": [
                {
                    "name": "最新发布",
                    "type": 0,
                    "indexChildren": '01'
                },
            ]
        },
        {
            "name": "主题教育", "type": 1, "indexParent": 1, "children": [
                {
                    "name": "中央精神",
                    "type": 1,
                    "indexChildren": '11'
                },
                {
                    "name": "本市部署",
                    "type": 2,
                    "indexChildren": '12'
                },
                {
                    "name": "机关动态",
                    "type": 3,
                    "indexChildren": '13'
                },
                {
                    "name": "学习心得",
                    "type": 5,
                    "indexChildren": '14'
                },
                {
                    "name": "学习资料",
                    "type": 4,
                    "indexChildren": '15'
                }
            ]
        },
        {
            "name": "机关党委", "type": 5, "indexParent": 2, "children": [
                {
                    "name": "通知公告",
                    "type": 5,
                    "indexChildren": '21'
                },
                {
                    "name": "党建动态",
                    "type": 6,
                    "indexChildren": '22'
                },
                {
                    "name": "工作提示",
                    "type": 7,
                    "indexChildren": '23'
                },
                {
                    "name": "党务参考",
                    "type": 8,
                    "indexChildren": '24'
                }
            ]
        },
        {
            "name": "支部风采", "type": 13, "indexParent": 3, "children": [
                {
                    "name": "支部活动",
                    "type": 13,
                    "indexChildren": '32'
                },
                {
                    "name": "党建联建",
                    "type": 14,
                    "indexChildren": '33'
                }
            ]
        },
        {
            "name": "党风廉政", "type": 9, "indexParent": 4, "children": [
                {
                    "name": "廉政格言",
                    "type": 9,
                    "indexChildren": '41'
                },
                {
                    "name": "纪检提示",
                    "type": 10,
                    "indexChildren": '42'
                },
                {
                    "name": "警示教育",
                    "type": 12,
                    "indexChildren": '43'
                }
            ]
        },
        {
            "name": "互动交流", "type": 21, "indexParent": 5, "children": [
                {
                    "name": "学思践悟",
                    "type": 21,
                    "indexChildren": '51'
                },
                {
                    "name": "话题讨论",
                    "type": 22,
                    "indexChildren": '52'
                },
                {
                    "name": "你问我答",
                    "type": 24,
                    "indexChildren": '55'
                }]
        },
        {
            "name": "知识拓展", "type": 16, "indexParent": 6, "children": [
                {
                    "name": "视频资料",
                    "type": 16,
                    "indexChildren": '61'
                },
                {
                    "name": "他山之石",
                    "type": 18,
                    "indexChildren": '63'
                },
                {
                    "name": "综合知识",
                    "type": 19,
                    "indexChildren": '64'
                },
            ]
        }
    ];
    childrenList = [];
    isRecent = 1;
    obj = {
        "plateType": null,   //分类
        "parentName": null,
        "childrenName": null,
    };
    resourceType = 1; //1 标题图片 2 轮播图  3 视频
    relatePlateType;   //关联主题教育
    userId;  //用户id

    picture: string = AppGlobal.domain + '/wisdomgroup';

    slideTitle;
    slideIndex = 1;

    indexParent = 1;
    indexChildren = 0;
    newList;   //新闻列表

    toRight = true;

    noReadNum;

    slideList = new Array(7);   //数组的改变 会导致上拉加载更多失效。。
    slideArr = new Array(7);
    toIndex;

    //分页
    pageCount = AppGlobal.pageCount;
    pageNum = 1;
    totalNum;  //总条数

    isPublish = false;
    swiper;
    swiperImg;

    slidersItems = [
        {
            "static": "true",
            "id": null,
            "plateType": "20",
            "title": "不忘初心，牢记使命",
            "imgUrl": "./assets/imgs/home/edu_banner.png"
        }
    ];

    itemWidth;
    spanWidth;

    constructor(public navCtrl: NavController, public navParams: NavParams,
                public commonSer: CommonService, public renderer: Renderer2,
                public zone: NgZone, public storage: Storage,
                public tabsSer: TabsService, public emitSer: EmitService) {
        // 接收发射过来的数据
        this.emitSer.eventEmit.subscribe((value: any) => {
            if (!isNaN(value)) {
                this.noReadNum = value;
            }
        });
    }

    ionViewDidLoad() {
        this.storage.get('userLoginInfo').then((value) => {
            this.userId = value.userid;
        });
        this.initSwiper();
        this.getBanner();
        this.scrollHeight();
        timer(20).subscribe(() => {
            this.itemWidth = window.screen.width / 4;
            this.spanWidth = this.tabSpan.nativeElement.offsetWidth;   //文字宽度
            this.changeParent(this.tabsList[0])
        });
    }


    ionViewDidLeave() {
        const videoArr = document.querySelectorAll("video");
        for (let i = 0; i < videoArr.length; i++) {
            videoArr[i].pause();
        }
    }

    public dragTo(e) {
        if (e.target.scrollLeft > window.screen.width / 3) {
            this.toRight = false;
        } else {
            this.toRight = true;
        }
    }

    //文章分类固定
    scrollHeight() {
        const height = this.topHeight.nativeElement.offsetHeight;
        this.content.ionScroll.subscribe(($event) => {
            this.zone.run(() => {
                if (this.content.scrollTop > height) {
                    this.renderer.addClass(this.fixedTab.nativeElement, 'tabs-fixed-scroll')
                } else {
                    this.renderer.removeClass(this.fixedTab.nativeElement, 'tabs-fixed-scroll')
                }
            })
        })
    }

    //初始化swiper
    initSwiper() {
        let that = this;
        that.swiperImg = new Swiper('#swiper-slide', {
            speed: 1000,
            autoplay: {
                delay: 3000,
                disableOnInteraction: false,
            },//可选选项，自动滑动
            observer: true,
            observeParents: true,
            observeSlideChildren: true,
            loop: false,
            on: {
                init: function () {

                },
                slideChangeTransitionEnd: function () {
                    if (that.swiperImg) {
                        that.slideIndex = this.activeIndex + 1;
                        that.slideTitle = that.slidersItems[that.swiperImg.realIndex].title;
                        that.swiperImg.update();
                    }
                },
                click: function () {
                    const item = that.slidersItems[this.activeIndex];
                    if (item.static == "true") {
                        that.swiper.slideTo(1, 500);  //前往主题教育
                        return false;
                    }
                    if (item.plateType == "20") return false;
                    that.navCtrl.push(StuffDetailPage, {
                        id: item.id
                    })
                }
            }
        });
    }

    //前往主题教育
    goEdu() {
        this.swiper.slideTo(1, 500);  //前往主题教育
    }

    //获取轮播图
    getBanner() {
        const data = {
            obj: {
                "resourceType": 2,   //1标题图片,2推荐轮播图,3视频
                "isRecommend": 1,   //推荐(1是0否)
            }
        };
        this.tabsSer.stuffPage(data).subscribe(
            (res) => {
                this.slidersItems = [];
                if (res.data.list.length > 0) {
                    res.data.list.forEach(e => {
                        if (e.attachments.length > 0) {
                            e.imgUrl = e.attachments[0].path;
                        }
                    });
                }
                this.slidersItems = this.slidersItems.concat(res.data.list);
                this.slideTitle = this.slidersItems[0].title;
                this.swiperImg.update();
            }
        )
    }

    //父级选择
    changeParent(item) {
        this.newsContent.nativeElement.scrollLeft = 0;   //二级菜单滑动重置

        this.indexParent = item.indexParent;
        this.obj.parentName = item.name;
        this.obj.childrenName = item.children[0].name;

        this.toIndex = item.indexParent;
        this.childrenList = item.children;

        if (this.obj.parentName == "主题教育") {
            this.obj.plateType = null;
            this.relatePlateType = item.type;
        } else {
            this.obj.plateType = item.type;
            this.relatePlateType = null;
        }

        this.resourceType = item.name == "知识拓展" ? 3 : 1;
        this.isRecent = this.obj.parentName == "最新发布" ? 1 : 0;
        if (this.childrenList.length > 0) this.indexChildren = this.childrenList[0].indexChildren;
        this.tips.nativeElement.style.width = this.tabSpan.nativeElement.offsetWidth + 'px';
        // 自身div的一半 - 滑块的一半
        this.tips.nativeElement.style.left = this.itemWidth * (this.indexParent) + (this.itemWidth - this.spanWidth) / 2 + 'px';
        const data = {
            pageSize: 1,
            pageCount: this.pageCount,
            isRecent: this.isRecent,
            obj: {
                'plateType': this.obj.plateType,
                'resourceType': this.resourceType,
                "relatePlateType": this.relatePlateType
            }
        };
        this.tabsSer.stuffPage(data).subscribe(
            (res) => {
                this.newList = res.data.list;
                this.totalNum = res.data.total;
                this.newList.forEach(e => {
                    if (e.attachments && e.attachments.length > 0) {
                        if (e.attachments[0].resourceType != 2) {
                            e.path = e.attachments[0].path;
                            e.resourceType = e.attachments[0].resourceType;
                        } else if (e.attachments.length > 1) {
                            e.path = e.attachments[1].path;
                            e.resourceType = e.attachments[1].resourceType;
                        }
                    }
                });
                this.slides.slideTo(this.indexParent, 500);
                this.slideList[this.indexParent] = this.newList;
                console.log(this.newList);
            }
        )
    }

    //子级选择
    changeChildren(item) {
        this.indexChildren = item.indexChildren;
        this.resourceType = item.name == "视频资料" ? 3 : 1;
        this.isRecent = this.obj.parentName == "最新发布" ? 1 : 0;
        this.obj.childrenName = item.name;

        if (this.obj.parentName == "主题教育") {
            this.obj.plateType = null;
            this.relatePlateType = item.type;
        } else {
            this.obj.plateType = item.type;
            this.relatePlateType = null;
        }

        if (this.obj.childrenName == "你问我答") {
            this.getQuestion();
            return false;
        }

        const data = {
            pageSize: 1,
            pageCount: this.pageCount,
            isRecent: this.isRecent,
            obj: {
                'plateType': this.obj.plateType,
                'resourceType': this.resourceType,
                "relatePlateType": this.relatePlateType
            }
        };
        this.tabsSer.stuffPage(data).subscribe(
            (res) => {
                this.newList = res.data.list;
                this.newList.forEach(e => {
                    if (e.attachments && e.attachments.length > 0) {
                        e.path = e.attachments[0].path;
                        e.resourceType = e.attachments[0].resourceType;
                    }
                });
                this.slideList[this.indexParent] = this.newList;
                this.getMore(res);
            }
        )
    }

    getMore(res) {
        const totalNum: number = res.data.total;
        if (totalNum < this.pageCount) return false;
        const data = {
            pageNum: 1,
            pageCount: totalNum,
            isRecent: this.isRecent,
            obj: {
                'plateType': this.obj.plateType,
                'resourceType': this.resourceType,
                "relatePlateType": this.relatePlateType
            }
        };
        this.tabsSer.stuffPage(data).subscribe(
            (res) => {
                res.data.list.splice(0, 10);
                res.data.list.forEach(e => {
                    if (e.attachments && e.attachments.length > 0) {
                        e.path = e.attachments[0].path;
                        e.resourceType = e.attachments[0].resourceType;
                    }
                    this.slideList[this.indexParent].push(e);
                });
            }
        )
    }

    //查询我要出题
    getQuestion() {
        const data = {
            pageNum: 1,
            pageSize: 1000,
            privateFlag: 0,
        };
        this.tabsSer.findPersonQuestions(data).subscribe(
            (res) => {
                this.newList = res.list;
                this.slideList[this.indexParent] = this.newList;
            }
        )
    }

    //下拉刷新
    doRefresh(e) {
        this.getBanner();
        const data = {
            pageNum: 1,
            pageCount: this.pageCount,
            isRecent: this.isRecent,
            obj: {
                'plateType': this.obj.plateType,
                'resourceType': this.resourceType,
                "relatePlateType": this.relatePlateType
            }
        };
        this.tabsSer.stuffPage(data).subscribe(
            (res) => {
                this.newList = res.data.list;
                this.newList.forEach(e => {
                    if (e.attachments.length > 0) {
                        e.path = e.attachments[0].path;
                        e.resourceType = e.attachments[0].resourceType;
                    }
                })
                setTimeout(() => {
                    this.slideList[this.toIndex] = this.newList;
                    this.commonSer.toastTime('刷新成功!', 800);
                    e.complete();
                }, 1000);
            }
        )
    }

    //上拉加载更多
    doInfinite(e) {
        if (this.totalNum == this.slideList[this.indexParent]) {
            e.complete();
            return false;
        }
        this.pageNum++;
        const data = {
            pageNum: this.pageNum,
            pageCount: this.pageCount,
            isRecent: this.isRecent,
            obj: {
                'plateType': this.obj.plateType,
                'resourceType': this.resourceType,
                "relatePlateType": this.relatePlateType
            }
        };
        this.tabsSer.stuffPage(data).subscribe(
            (res) => {
                this.totalNum = res.data.total;
                res.data.list.forEach(e => {
                    if (e.attachments && e.attachments.length > 0) {
                        e.path = e.attachments[0].path;
                        e.resourceType = e.attachments[0].resourceType;
                    }
                    this.slideList[this.indexParent].push(e);
                });
                e.complete();
            }
        )
    }

    //前往搜索页面
    goToSearch() {
        this.navCtrl.push(SearchNewPage);
    }

    //查看详情
    goToDetail(item) {
        this.navCtrl.push(StuffDetailPage, {
            id: item.id
        });
    }

    //前往发布页面
    goToPublish(type) {
        this.navCtrl.push(PublishPage, {type: type});
        this.isPublish = false;
    }

    //回答题目
    goToResponse(item) {
        console.log(item);
        if (item.userId == this.userId) {
            this.navCtrl.push('AcceptPage', {id: item.id})
        } else {
            this.navCtrl.push('ResponsePage', {item: item})
        }
    }

    //消息提醒页面
    goToNotice() {
        this.navCtrl.push(NoticePage);
    }

    close() {
        this.isPublish = false;
    }

    stop(e) {
        e.stopPropagation();
    }

    //我要出题
    issue() {
        this.navCtrl.push('SelectTypePage', {type: 'issue'});
    }

    //列表视频不同时播放
    clickVideo(e) {
        const videoArr = document.querySelectorAll("video");
        for (let i = 0; i < videoArr.length; i++) {
            if (videoArr[i] != e.target) {
                videoArr[i].pause();
            }
        }
    }

    loadVideo(e) {
        const scale = 0.8;
        const canvas = document.createElement('canvas');
        canvas.width = 120 * scale;
        canvas.height = 120 * scale;
        //绘制图片
        canvas.getContext('2d').drawImage(e.target, 0, 0, canvas.width, canvas.height);
        //设置标签的poster属性

        let img = new Image();
        img.src = canvas.toDataURL("image/png");
        img.setAttribute("crossOrigin", 'Anonymous')
        img.onload = () => {
            e.target.setAttribute("poster", canvas.toDataURL("image/png"));
        }
    }

    slideChanged() {

    }


}