discover.ts

import {Component, ElementRef, HostListener, NgZone, Renderer2, ViewChild} from '@angular/core';
import {
    Content,
    InfiniteScrollContent,
    IonicPage,
    ModalController,
    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";
import {FilterComponent} from "../../../components/filter/filter";
import {PartyPersonComponent} from "../../../components/party-person/party-person";
import {DiscoverService} from "../../discover-pages/discover.service";
import {AppMainService} from "../../../app/app.service";

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;
    @ViewChild('partyPerson') partyPerson: PartyPersonComponent;

    //所属板块类型:
    //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": null,
                    "indexChildren": '34'
                },
                {
                    "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,
        "branchId": 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;

    //分页
    pageSize = 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;

    branchObj = {
        partyList: [],
        show: false,
        personList: []
    };

    mineInfo;  //登录人信息

    constructor(public navCtrl: NavController, public navParams: NavParams, private appMainSer: AppMainService,
                public commonSer: CommonService, public renderer: Renderer2, private discoverSer: DiscoverService,
                public zone: NgZone, public storage: Storage, private modalCtrl: ModalController,
                public tabsSer: TabsService, public emitSer: EmitService) {
        // 接收发射过来的数据
        this.appMainSer.readInfo.subscribe(value => {
            this.noReadNum = value;
        })
    }

    ionViewDidLoad() {
        this.storage.get('userLoginInfo').then((value) => {
            this.userId = value.userid;
        });
        //获取个人信息
        this.appMainSer.mineInfo.subscribe(value => {
            this.mineInfo = value;
        });
        this.initSwiper();
        this.getBanner();
        this.scrollHeight();
        this.getBranch();
        timer(20).subscribe(() => {
            const htmlFontSize = getComputedStyle(window.document.documentElement)['font-size'];
            this.itemWidth = htmlFontSize.split("px")[0] * 8;
            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();
        }
    }

    //获取党支部
    getBranch() {
        this.tabsSer.getBranchList().subscribe(
            (res) => {
                this.branchObj.partyList = res.data.map(e => {
                    const d = {
                        type: e.id,
                        name: e.name
                    };
                    return d;
                });
            }
        )
    }

    getMemberList(id) {
        const data = {
            branchId: id
        };
        this.discoverSer.getMemberList(data).subscribe(
            (res) => {
                if (res) this.branchObj.personList = res.data;
            }
        )
    }

    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();
            }
        )
    }

    slideChanged() {
        const index = this.slides.realIndex;
        const distance = index * this.itemWidth / 2;   //滑动的长度
        this.newContentParent.nativeElement.scrollLeft = distance;
        this.changeParent(this.tabsList[index]);
    }

    //父级选择
    changeParent(item) {
        if (this.indexParent === item.indexParent) return;

        this.obj.parentName = item.name;
        this.obj.childrenName = item.children[0].name;
        this.newsContent.nativeElement.scrollLeft = 0;   //二级菜单滑动重置

        this.indexParent = item.indexParent;

        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';

        if (!this.obj.branchId) this.obj.branchId = this.mineInfo.branchId;
        if (item.children[0].name == "支部成员") {
            this.moreParty("parent");
            if (this.obj.branchId) this.getMemberList(this.obj.branchId);
            this.branchObj.show = true;
            this.slides.slideTo(this.indexParent, 500);
            return false;
        } else {
            this.branchObj.show = false;
        }

        if (item.name != "支部风采") this.obj.branchId = null;

        const data = {
            pageNum: 1,
            pageSize: this.pageSize,
            isRecent: this.isRecent,
            obj: {
                'plateType': this.obj.plateType,
                'resourceType': this.resourceType,
                "relatePlateType": this.relatePlateType,
                "branchId": this.obj.branchId
            }
        };
        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.slideList)
            }
        )
    }

    //子级选择
    changeChildren(item) {
        this.indexChildren = item.indexChildren;
        this.obj.childrenName = item.name;
        if (!this.obj.branchId) this.obj.branchId = this.mineInfo.branchId;

        if (item.name === "支部成员") {
            if (this.obj.branchId) this.getMemberList(this.obj.branchId);
            this.branchObj.show = true;
            return false;
        } else {
            this.branchObj.show = false;
        }

        if (this.obj.parentName != "支部风采") this.obj.branchId = null;
        this.resourceType = item.name == "视频资料" ? 3 : 1;
        this.isRecent = this.obj.parentName == "最新发布" ? 1 : 0;

        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 = {
            pageNum: 1,
            pageSize: this.pageSize,
            isRecent: this.isRecent,
            obj: {
                'plateType': this.obj.plateType,
                'resourceType': this.resourceType,
                "relatePlateType": this.relatePlateType,
                "branchId": this.obj.branchId
            }
        };
        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;
                console.log(this.slideList);
                console.log(this.slideList[this.indexParent]);
            }
        )
    }

    //查询我要出题
    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) {
        if (this.obj.childrenName === "支部成员") {
            if (this.obj.branchId) this.getMemberList(this.obj.branchId);
            this.branchObj.show = true;
            e.complete();
            return false;
        } else {
            this.branchObj.show = false;
            this.obj.branchId = null;
        }
        this.getBanner();
        const data = {
            pageNum: 1,
            pageSize: this.pageSize,
            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].length || this.totalNum < this.slideList[this.indexParent].length) {
            e.complete();
            return false;
        }
        this.pageNum++;
        const data = {
            pageNum: this.pageNum,
            pageSize: this.pageSize,
            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})
        }
    }

    //多模块
    moreTab() {
        let modal = this.modalCtrl.create(FilterComponent, {
            list: this.tabsList,
            type: this.obj.plateType,
            title: '我的频道'
        }, {
            enterAnimation: 'modal-from-right-enter',
            leaveAnimation: 'modal-from-right-leave'
        });
        modal.onDidDismiss(data => {
            if (data) {
                this.changeParent(data);
                console.log(data);
            }
        });
        modal.present();
    }

    moreParty(type) {
        console.log(type);
        let modal = this.modalCtrl.create(FilterComponent, {
            list: this.branchObj.partyList,
            type: this.obj.branchId,
            title: '党支部',
            desc: "点击进入党支部"
        }, {
            enterAnimation: 'modal-from-right-enter',
            leaveAnimation: 'modal-from-right-leave'
        });
        modal.onDidDismiss(data => {
            if (data) {
                this.obj.branchId = data.type;
                let res;
                if (this.obj.childrenName === "支部成员") {
                    res = {
                        type: null,
                        indexChildren: '34',
                        name: "支部成员"
                    };
                } else {
                    res = {
                        type: this.obj.plateType,
                        indexChildren: this.indexChildren,
                        name: this.obj.childrenName
                    };
                }
                this.changeChildren(res);

            }
        });
        modal.present();
    }


    //消息提醒页面
    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"));
        }
    }


}