fav-brand-list.vue 3.31 KB
<template>
    <div class="fav-type" v-infinite-scroll="loadMore()" infinite-scroll-disabled="busy" infinite-scroll-distance="10">
        <ul class="fav-brand-list">
            <li v-for="item in brandData" track-by="fav_id">
                <div class="fav-del-left {{editmodel ? 'delshow': ''}}" @click="delItem($index, item.fav_id)">
                    <span class="fav-del-span"></span>
                </div>
                <a :href="item.link">
                    <div class="fav-img-box">
                        <img :src="item.imgUrl" alt=""/>
                    </div>
                    <div class="fav-info-list">
                        <span class="title">{{item.brandName}}</span>
                        <span class="down" v-if="item.down">品牌已下架</span>
                    </div>
                </a>
                <div class="fav-del-right">
                    <span class="fav-del-btn"></span>
                </div>
            </li>
        </ul>
        <div class="fav-null-box {{ nullbox }}">
            <span class="fav-null">您暂无收藏任何品牌</span>
            <a slot="go-shopping" class="go-shopping" :href="brandUrl">随便逛逛</a>
        </div>
    </div>
</template>

<script>
    const $ = require('yoho-jquery');
    const tip = require('common/tip');

    module.exports = {
        props: ['brandUrl'],
        data() {
            return {
                nullbox : 'hide',
                busy: false,
                editmodel: false,
                page: 0,
                brandData: []
            };
        },
        methods: {
            loadMore: function() {
                let _this = this;
                this.busy = true;

                $.ajax({
                    url: '/home/favorite/favpaging',
                    data: {
                        page : ++_this.page,
                        tab : "brand"
                    }
                }).then(result => {
                    if (result.isend) {
                        _this.busy = true;
                    } else {
                        _this.busy = false;
                    }

                    if (result.list.length) {
                        result.list.forEach(function(o){
                            _this.brandData.push(o);
                        });
                    }

                    _this.nullbox = _this.brandData.length ? "hide" : "";
                }).fail(() => {
                    tip('网络错误');
                });
            },
            editModel(action) {
                this.editmodel = action;
            },
            delItem(index, id) {
                let _this = this;
                $.ajax({
                    method: 'POST',
                    url: '/home/del-favdel',
                    data: {
                        favId: id,
                        type: 'brand'
                    }
                }).then(function(data) {
                    if (data.code === 200) {
                        _this.brandData.splice(index, 1);
                    } else if (data.code === 400) {
                        tip(data.message);
                    } else {
                        tip('刪除收藏失败');
                    }
                }).fail(function() {
                    tip('网络错误');
                });
            }
        }
    };
</script>