preferential.vue 1.63 KB
<template>
    <div v-if="preferentialInfo">
        <titleBox v-if="preferentialInfo" @more="more"
            :titles="preferentialInfo">
        </titleBox>
        <div v-if="preferentialInfo" class="item_box">
            <div class="left">
                <img class="item" v-lazy="item.simg + SIGN.MIDDLE" v-if="index < 3" v-for="(item,index) in preferentialInfo.img" :key="index" @click="toDetail(item)" />
            </div>
            <div class="right">
                <img class="first" v-lazy="preferentialInfo.img[3].simg + SIGN.MIDDLE" @click="toDetail(preferentialInfo.img[3])" />
                <img class="item" v-lazy="preferentialInfo.img[4].simg + SIGN.MIDDLE" @click="toDetail(preferentialInfo.img[4])" />
            </div>
        </div>
    </div>
</template>

<script>
    // 引入组件
    import titleBox from "@/components/titleBox/titleBox";
    
    export default {
        name: 'preferential',
        data() {
            return {

            }
        },
        props:["preferentialInfo"],
        components:{
            titleBox
        },
        methods: {

            /**
             * 详情
             * @param {object} item [详情数据]
             */
            toDetail(item) {
                this.$emit("toDetail", item);
            },

            /**
             * 更多
             * @param {object} item [详情数据]
             */
            more(item) {
                this.$emit("more", item);
            }
        }
    }
</script>

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