HKRentingMiniprogram/template/headSwiper/headSwiper.js

// template/headSwiper/headSwiper.js
var app = getApp()
Component({
    /**
     * 组件的属性列表
     */
    properties: {
        attachment: Array,
        isInner: Number,
        pages: String,
    },
    observers: {
        attachment(e) {
            this.setHeightArr();
            this.calculateimgLength();
        }
    },
    /**
     * 组件的初始数据
     */
    data: {
        swiperHeight: 0,
        isIndexPage: true,
        indicatorDots: true,
        autoplay: false,
        interval: 3000,
        duration: 500,
        circular: true,
        current: 0,
        swiperCurrent: 0,
        windowWidth: 0,
        imgUrl: [],
        heightArr: [],
        tab: 'live', // live video img
        liveLength: 0,
        videoLength: 0,
        imgLength: 0,
        imgIndex: 0,
        videoIndex: 0,
        liveIndex: 0,
        video: '',
        screen_data: {},
        swiperHeightObj: {
            0: 500
        },
        aState: true,

    },
    lifetimes: {
        attached: function () {
            this.attachedIn()
            // this.setHeightArr()
        },
    },
    attached: function () {
        this.attachedIn()
    },
    /**
     * 组件的方法列表
     */
    methods: {
        attachedIn() {
            let that = this;
            wx.getSystemInfo({
                success: function (res) {
                    that.setData({
                        windowWidth: res.windowWidth,
                        screen_data: app.globalData.screen_data,
                    })
                }
            })
        },
        setHeightArr() {
            this.setData({
                heightArr: Array.from({
                    length: this.properties.attachment.length
                }, item => {
                    return 120
                })
            })
        },
        previewImg(e) {
            console.log("img");
            let that = this;
            let url = e.currentTarget.dataset.url;
            let appid = e.currentTarget.dataset.appid;
            let finderusername = e.currentTarget.dataset.finderusername;
            let feedid = e.currentTarget.dataset.feedid;
            let type = e.currentTarget.dataset.type;

            // 跳转视频号
            if (type == 5) {
                wx.openChannelsActivity({
                    finderUserName: finderusername,
                    feedId: feedid
                })
                return false
            }

            // 跳转直播
            if (type == 4) {
                wx.openChannelsLive({
                    finderUserName: finderusername
                })
                return false
            }

            // 判断跳转小程序
            if (appid) {
                wx.navigateToMiniProgram({
                    appId: appid,
                    path: url
                })
                return false;
            }

            // 判断是否是h5页面的
            if (url && url.indexOf('http') != -1) {
                wx.navigateTo({
                    url: `/pages/webViewwebweb/index?url=${ url }`,
                })
                return false;
            }

            if (url) {
                wx.navigateTo({
                    url: '/' + url,
                })
                return false;
            }

            if (this.properties.pages == 'apartmentDetail') {
                // wx.setStorageSync('attachment', this.properties.attachment)
                // console.log("attachment", this.properties.attachment);
                let sources = this.properties.attachment || []
                sources.forEach(element => {
                    if (element['videourl']) element['type'] = 'video'
                    element['url'] = element['videourl'] || element['image']
                })

                wx.setStorageSync('sourcesList', sources);
                wx.navigateTo({
                    url: '/pages/video_show/video_show?current=' + this.data.current
                })
                // wx.previewMedia({
                //     sources,
                //     current: this.data.current,
                // })
                // wx.navigateTo({
                //     url: `/pages/video_show/video_show?frompage=apartment&current=${this.data.current}`
                // });
                return false
            }

            if (this.data.imgUrl.length == 0) {
                let imgUrl = [];
                that.properties.attachment.map(item => {
                    imgUrl.push(item.image)
                })
                that.setData({
                    imgUrl: imgUrl
                })
            }
            wx.previewImage({
                current: that.data.imgUrl[that.data.current], // 当前显示图片的http链接
                urls: that.data.imgUrl // 需要预览的图片http链接列表
            })
        },
        load(e) {
            let index = e.currentTarget.dataset.index;
            let {
                height,
                width
            } = e.detail

            let swiperHeightObj = this.data.swiperHeightObj
            let targetHeight = (height / width) * 690
            swiperHeightObj[index] = targetHeight
            this.setData({
                swiperHeightObj
            })

            if (this.data.swiperHeight > 0) return false
            let swiperHeight = this.data.windowWidth * e.detail.height / e.detail.width
            this.setData({
                swiperHeight
            })
            this.triggerEvent("recordSwiperHeight", swiperHeight)
        },
        send_form_id: function (e) {
            let {
                statid,
                url,
                type
            } = e.currentTarget.dataset;
            this.previewImg(e)
            wx.request({
                url: app.globalData.config.FormidInsert,
                data: {
                    session: wx.getStorageSync('session'),
                    formid: e.detail.formId,
                    statid
                },
                method: 'POST', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
                header: app.globalData.header,
                success: function (res) {
                    var data = app.return_data(res);
                }
            })
        },
        // 切换图片或视频
        changeTab(e) {
            let tab = e.currentTarget.dataset.tab;
            if (this.data.tab == tab) return false

            let swiperCurrent = 0
            if (tab == 'img') swiperCurrent = this.data.liveLength + this.data.videoLength
            else if (tab == 'video') swiperCurrent = this.data.liveLength

            this.setData({
                // swiperCurrent: tab == 'img' ? this.data.videoLength : 0,
                swiperCurrent,
                current: tab == 'img' ? this.data.videoLength : 0,
                imgIndex: 0,
                videoIndex: 0,
                tab
            })
        },
        // 计算视频个数
        calculateimgLength() {
            let that = this;
            this.data.attachment.forEach(item => {
                if (item.islive) that.data.liveLength++;
                else if (item.isvideo) that.data.videoLength++;
                else that.data.imgLength++;
            })

            this.setData({
                liveLength: this.data.liveLength,
                videoLength: this.data.videoLength,
                imgLength: this.data.imgLength
            })

            if (this.data.current >= this.data.videoLength) {
                this.setData({
                    tab: 'img',
                    imgIndex: this.data.current + this.data.videoLength + this.data.liveLength
                })
            } else if (this.data.current >= this.data.liveLength) {
                this.setData({
                    tab: 'video',
                    videoIndex: this.data.current + this.data.liveLength
                })
            } else {
                this.setData({
                    tab: 'live',
                    liveIndex: this.data.current
                })
            }

        },
        bindchangeSwiper(e) {
            let current = e.detail.current;
            let videoLength = this.data.videoLength
            let liveLength = this.data.liveLength

            let tab = "img"
            if (current >= liveLength + videoLength) tab = "img"
            else if (current >= liveLength) tab = "video"
            else tab = "live"

            this.setData({
                tab,
                current,
                swiperCurrent: current,
                aState: false,
            })
        },
        // play(e) {

        //     wx.navigateTo({
        //         url: '/pages/video_show/video_show?src=' + e.currentTarget.dataset.video,
        //     })
        // },
        closePage() {
            this.setData({
                video: ''
            })
            this.triggerEvent('close', {})
        }
    }
})