index.vue 3.74 KB
<template>
  <div>
  <!--轮播-->
  <swiper v-if="activityAdInfo&&activityAdInfo.banner" :swipers="activityAdInfo.banner"></swiper>
  <!--导航-->
  <swiperItem v-if="activityAdInfo&&activityAdInfo.nav" :navs="activityAdInfo.navs"></swiperItem>
  <!--优惠专区-->
  <discountZone :discountZoneInfo="discountZoneInfo"></discountZone>
  <!--天天特惠-->
  <preferential :preferentialInfo="preferentialInfo"></preferential>
  <!--视听专区-->
  <videoArea :videoAreaInfo="videoAreaInfo"></videoArea>
  </div>
</template>

<script>
    import swiper from "@/components/swiper/swiper";
    import swiperItem from "@/components/swiperItem/swiperItem";
    import discountZone from "@/components/discountZone/discountZone";
    import preferential from "@/components/preferential/preferential";
    import videoArea from "@/components/videoArea/videoArea";
    import { Toast, Indicator } from "mint-ui";
  export default {
    name: 'index',
    data () {
      return {
          activityAdInfo:null,
          discountZoneInfo:null, // 优惠专区
          preferentialInfo:null, // 天天特价
          videoAreaInfo:null // 视听专区
      }
    },
      filters: {

          capitalize: function (value) {
              if (!value) return ''
              value = value.toString()
              return value.charAt(0).toUpperCase() + value.slice(1)
          }

      },
      components:{
        swiper,
        swiperItem,
        discountZone,
        preferential,
        videoArea
    },
    created(){
        this.activityAd();
    },
    methods: {
          /**
             * 调用通用跳转
             * @param {object} item [通用跳转对象]
             */
            toDetail(item) {

                // 判断是否有通用跳转函数
                if (typeof this.$parent.gotoDetail === "function") {

                    // 调用通用跳转
                    this.$parent.gotoDetail(item);
                }
            },
        /**
         * 获取优选库精选活动
         */
        activityAd() {
            // 加载中提示
            Indicator.open("加载中...");

            // 获取证书请求接口
            this.http(
                "/Api/" + this.getApiVersion().index + "/activityAd",
                {
//                  id: this.$route.query.id
                    id: 20
                },
                this.activityAdCallback,
                {
                    method: "post"
                }
            );
        },
        /**
         * 获取优选库精选活动
         * @param {object} res [服务器返回数据]
         * @param {object} ext [扩展参数]
         */
        activityAdCallback(res, ext) {
            // 加载完成
            Indicator.close();
            // 返回处理
            if (res.code == 200) {
                // 解构数据
                let { data: datas } = res;
                /* 获取获取证书信息 开始 */
                this.activityAdInfo = res.data;
                // 优惠专区
                this.discountZoneInfo = this.activityAdInfo.ads.filter(n => n.style==1);
                // 天天特价
                this.preferentialInfo = this.activityAdInfo.ads.filter(n => n.style==2);
                // 视听专区
                this.videoAreaInfo = this.activityAdInfo.ads.filter(n => n.style==13);

            } else if (res.code == 400) {
                // 获取证书信息失败
                Toast(res.message);
            } else {
                // 获取证书信息计划失败
                Toast("获取优选库精选活动失败");
            }
        },
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style rel="stylesheet/less" lang="less" scoped>
    @import "index";
</style>