<template>
    <!--pages/activity_topics/topics.wxml-->
    <!-- <text>活动专题</text> -->

    <view class="activity_topics">
        <view class="image" v-for="(item,index) in topic_list"  @tap="onChange" :data-route="item.route">
            <image :src="item.pic" mode="widthFix"></image>
        </view>
    </view>
</template>

<script>
// pages/activity_topics/topics.js
import { httpUtil } from '../../../utils/util.js';
export default {
    data() {
        return {
            topic_list: [],
            //图片列表
            topic_info: [] //分享标题和图片
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad: function (options) {
        let mini_activity_id = options.mini_activity_id;
        httpUtil('/api/v1/topic-detail', 'get', {
            mini_activity_id
        }).then((res) => {
            this.setData({
                topic_list: res.topic_detail,
                topic_info: res.topic_info
            });

            if (!res.topic_info.topic_title) {
                return;
            }

            uni.setNavigationBarTitle({
                title: res.topic_info.topic_title
            });
        });
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {},
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {},
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {},
    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function (e) {
        let title = this.topic_info.topic_title;
        let imageUrl = this.topic_info.share_pic;
        return {
            //自定义转发内容
            title,
            imageUrl //不设置此字段时，默认截取当前页面作为展示的图片
        };
    },
    methods: {
        onChange(e) {
            let url = e.currentTarget.dataset.route;

            if (!url) {
                return;
            }

            uni.navigateTo({
                url
            });
        }
    }
};
</script>
<style>
/* pages/activity_topics/topics.wxss */
.activity_topics {
    height: 100%;
}
.image {
}
.activity_topics .image image {
    width: 100%;
    display: block;
    margin-top: -1rpx;
}
</style>
