collectionItem.vue 2.02 KB
<template>
    <router-link to="{ name: 'goodsDetail', params: { productId: 0 }}" tag="li">
        <div class="record-item">
            <img :src="imgSrc" class="record-img"/>
            <div class="record-info">
                <p class="record-title">{{item.productName}}</p>
                <p class="record-coin">联盟币:{{item.productListPrice}}</p>
            </div>
            <div class="record-time">{{item.favoriateTime}}
                <span @click.stop="openConfirm(item.favoriateId,item.type)" class="cancel-collect">取消收藏</span>
            </div>
        </div>
    </router-link>
</template>
<script type="text/ecmascript-6">
    import {formatImg}  from '../../utils/commonUtil';
    import {MessageBox, Toast} from 'mint-ui';
    import {getmyCollectionList, clearmyCollectionList, addCancelCollection} from '../../vuex/actions';

    export default {
        data() {
            return {}
        },
        props: {
            item: '',
            pageNum: ''

        },
        computed: {
            imgSrc(){
                return formatImg.formatSRC(this.item.productPhoto, 100, 100);
            }
        },
        methods: {
            openConfirm(id, type) {
                var self = this;
                MessageBox.confirm('确定取消收藏?', '提示').then(action => {
                    self.addCancelCollection(id, type).then(function () {
                        Toast({
                            message: '取消成功',
                            position: 'bottom',
                            duration: 5000
                        });
                        self.clearmyCollectionList().then(function () {
                            self.getmyCollectionList(0, self.pageNum);
                        })
                    });
                });

            }
        },
        vuex: {
            getters: {},
            actions: {
                getmyCollectionList,
                clearmyCollectionList,
                addCancelCollection
            }
        }
    }
</script>