活动

src/main/comos/src/mixins/list.js

@@ -44,6 +44,9 @@ export default {
                     if (!this.finished) {
                         this.page = this.page + 1;
                     }
+                    if (this.afterData) {
+                        this.afterData();
+                    }
                 });
             } else {
                 this.$http.post(this.url, data, { body: 'json' }).then(res => {
@@ -57,6 +60,9 @@ export default {
                     if (!this.finished) {
                         this.page = this.page + 1;
                     }
+                    if (this.afterData) {
+                        this.afterData();
+                    }
                 });
             }
         }

src/main/comos/src/router/index.js

@@ -398,6 +398,14 @@ const routes = [
             title: 'Cosmos Art'
         }
     },
+    {
+        path: '/activityList1',
+        name: 'activityList1',
+        component: () => import('../views/activity/List1.vue'),
+        meta: {
+            title: 'Cosmos Art'
+        }
+    },
     {
         path: '/activityDetail',
         name: 'activityDetail',

src/main/comos/src/views/Discover.vue

@@ -17,7 +17,7 @@
             </swiper-slide>
         </swiper>
 
-        <van-grid :border="false" :column-num="$store.state.review ? 4 : 5">
+        <van-grid :border="false" :column-num="4">
             <van-grid-item text="精选推荐" :to="{ path: '/productList' }">
                 <template v-slot:icon>
                     <img class="grid-img" src="@assets/info_icon_jingxuanxilie.png" />
@@ -43,6 +43,11 @@
                     <img class="grid-img" src="@assets/info_icon_xiliehuodong.png" />
                 </template>
             </van-grid-item>
+            <van-grid-item text="活动收集" :to="{ path: '/activityList1' }">
+                <template v-slot:icon>
+                    <img class="grid-img" src="@assets/info_icon_xiliehuodong.png" />
+                </template>
+            </van-grid-item>
             <!-- <van-grid-item text="铸造商店" @click="wait">
                 <template v-slot:icon>
                     <img class="grid-img" src="@assets/info_icon_zhuzaoshangdian.png" />
@@ -171,10 +176,10 @@ export default {
     },
     methods: {
         getInit() {
-            this.$toast.loading({
-                message: '加载中...',
-                forbidClick: true
-            });
+            // this.$toast.loading({
+            //     message: '加载中...',
+            //     forbidClick: true
+            // });
             this.getBanner();
             this.getProduct('BLIND_BOX', this.sortOptions['精选盲盒']).then(res => {
                 this.box = res;

src/main/comos/src/views/activity/List1.vue

@@ -0,0 +1,165 @@
+<template>
+    <div class="search">
+        <van-list v-model:loading="loading" :finished="finished" finished-text="" @load="getData">
+            <template v-for="(item, index) in list" :key="index">
+                <div class="activity">
+                    <van-image
+                        width="calc(50vw - 20px)"
+                        height="calc(50vw - 20px)"
+                        :src="getImg(item.pic)"
+                        fit="cover"
+                    />
+                    <div class="content">
+                        <div class="text1">{{ item.name }}</div>
+                        <div class="text2">
+                            集齐{{ item.num }}张{{ item.collectionName }}徽章, 可换取一张<span>{{
+                                item.awardCollectionName
+                            }}</span
+                            >藏品
+                        </div>
+                        <van-button
+                            size="small"
+                            @click="getActivity(item, index)"
+                            :disabled="!canGet(item)"
+                            type="primary"
+                            round
+                            block
+                            >领取</van-button
+                        >
+                    </div>
+
+                    <div class="status" :class="{ used: !canGet(item) }">{{ canGet(item) ? '已集齐' : '未集齐' }}</div>
+                </div>
+            </template>
+
+            <van-empty v-if="empty" description="暂无活动哦~" :image="require('@assets/kong_png_wusousuo.png')" />
+        </van-list>
+    </div>
+</template>
+
+<script>
+import list from '../../mixins/list';
+export default {
+    name: 'Search',
+    mixins: [list],
+    data() {
+        return {
+            list: [],
+            empty: false,
+            url: '/activityCollection/all'
+        };
+    },
+    methods: {
+        beforeData() {
+            return {
+                query: {
+                    del: false
+                }
+            };
+        },
+        canGet(info) {
+            return info.collections && info.collections.length >= info.num;
+        },
+        afterData() {
+            if (this.isLogin) {
+                [...this.list].forEach((item, index) => {
+                    console.log(item);
+                    this.getCollect(item.collectionId).then(res => {
+                        this.list[index] = { ...item, collections: res };
+                    });
+                });
+            }
+        },
+        getCollect(id) {
+            return this.$http
+                .post(
+                    '/asset/all',
+                    {
+                        query: {
+                            userId: this.$store.state.userInfo.id,
+                            collectionId: Number(id),
+                            projectId: this.$store.state.projectId,
+                            status: 'NORMAL,TRADING,GIFTING'
+                        }
+                    },
+                    { body: 'json' }
+                )
+                .then(res => {
+                    return Promise.resolve(res.content);
+                });
+        },
+        getActivity(info, index) {
+            this.$dialog.confirm({
+                title: '提示',
+                message: `确认要使用${info.num}张${info.collectionName}兑换一张${info.awardCollectionName}吗?`,
+                confirmButtonText: '立即兑换'
+            });
+        }
+    }
+};
+</script>
+
+<style lang="less" scoped>
+.search {
+    padding-bottom: 50px;
+    background-color: @bg3;
+}
+.van-list {
+    padding: 10px;
+}
+.activity {
+    display: inline-block;
+    vertical-align: top;
+    width: calc(50vw - 20px);
+    box-sizing: border-box;
+    margin: 5px;
+    border-radius: 8px;
+    overflow: hidden;
+    position: relative;
+
+    .status {
+        font-size: 12px;
+        background-color: #f7931a;
+        color: @bg;
+        position: absolute;
+        top: 0;
+        right: 0;
+        border-radius: 0 8px 0 8px;
+        padding: 0 6px;
+        line-height: 18px;
+
+        &.used {
+            background-color: #939599;
+        }
+    }
+    .van-image {
+        display: block;
+    }
+    .text1 {
+        font-size: 16px;
+        color: @text0;
+        line-height: 24px;
+        text-align: center;
+    }
+
+    .content {
+        padding: 7px;
+        background-color: @bg;
+    }
+
+    .text2 {
+        text-align: center;
+        font-size: 14px;
+        line-height: 16px;
+        margin-top: 5px;
+        color: @text0;
+        span {
+            color: @prim;
+        }
+    }
+
+    .van-button {
+        margin-top: 10px;
+    }
+}
+</style>