videoArea.vue 1.85 KB
<template>
    <div v-if="videoAreaInfo">
        <titleBox v-if="videoAreaInfo" @more="more"
            :titles="videoAreaInfo">
        </titleBox>
        <div class="item_box" @click="toDetail(videoAreaInfo.img[0])">
            <img v-lazy="videoAreaInfo.img[0].simg + SIGN.BIG" class="main-img" mode="widthFix" />
            <div class="title">
                {{videoAreaInfo.img[0].goods_data.title}}
            </div>
            <div class="desc" v-if="videoAreaInfo.img[0].goods_data.attr">
                {{videoAreaInfo.img[0].goods_data.attr}}
            </div>
            <div class="pic_box">
                <div class="pice">
                    <div class="now">¥ {{videoAreaInfo.img[0].goods_data.price}}</div>
                    <div class="original">¥ {{videoAreaInfo.img[0].goods_data.prices}}</div>
                </div>
                <!--<div class="btn">-->
                    <!--立即购买-->
                <!--</div>-->
            </div>
        </div>
    </div>
</template>

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

            }
        },
        props:["videoAreaInfo"],
        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 'videoArea';
</style>