修改

src/main/modern-point/src/router/index.js

@@ -435,6 +435,14 @@ const routes = [
             title: 'Cosmos Art'
         }
     },
+    {
+        path: '/activityList1',
+        name: 'activityList1',
+        component: () => import('../views/activity/List1.vue'),
+        meta: {
+            title: 'Cosmos Art'
+        }
+    },
     {
         path: '/activityDetail',
         name: 'activityDetail',
@@ -523,7 +531,15 @@ const routes = [
         meta: {
             title: 'Cosmos Art'
         }
-    }
+    },
+    {
+        path: '/share',
+        name: 'share',
+        component: () => import('../views/user/Share.vue'),
+        meta: {
+            title: 'Cosmos Art'
+        }
+    },
 ];
 
 const router = createRouter({

src/main/modern-point/src/views/Discover.vue

@@ -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="衍生品"
                 :to="{

src/main/modern-point/src/views/Mine.vue

@@ -155,6 +155,11 @@
                     <van-icon :name="require('@assets/icon-anquan.png')" class="search-icon" />
                 </template>
             </van-grid-item>
+            <van-grid-item text="邀请有礼" :to="{ path: '/share' }">
+                <template #icon>
+                    <van-icon :name="require('@assets/gift.png')" class="search-icon" />
+                </template>
+            </van-grid-item>
         </van-grid>
 
         <div class="tabbar-placeholder"></div>

src/main/modern-point/src/views/activity/List1.vue

@@ -0,0 +1,206 @@
+<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="stock">剩余数量:{{ item.stock }}张</div>
+                    <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) || item.stock === 0"
+                            type="primary"
+                            round
+                            block
+                            >{{ item.stock ? '领取' : '无库存' }}</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>
+
+        <order-open ref="box" :imgSrc="getImg(changeImgs(orderInfo.pic))"></order-open>
+    </div>
+</template>
+
+<script>
+import OrderOpen from '../../components/order/OrderOpen.vue';
+import list from '../../mixins/list';
+import product from '../../mixins/product';
+export default {
+    components: { OrderOpen },
+    name: 'Search',
+    mixins: [list, product],
+    data() {
+        return {
+            list: [],
+            empty: false,
+            url: '/activityCollection/all',
+            orderInfo: {}
+        };
+    },
+    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: '立即兑换'
+                })
+                .then(res => {
+                    return this.$http.post('/activityOrder/create?mintActivityId=' + info.id);
+                })
+                .then(res => {
+                    this.getData(true);
+                    this.orderInfo = res;
+                    this.show();
+                })
+                .catch(e => {
+                    if (e && e.error) {
+                        this.$toast(e.error);
+                    }
+                });
+        },
+        show() {
+            this.$refs.box.show = true;
+            this.$nextTick(() => {
+                this.$refs.box.open();
+            });
+        }
+    }
+};
+</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;
+    }
+}
+.stock {
+    position: absolute;
+    left: 0;
+    right: 0;
+    top: calc(50vw - 40px);
+    line-height: 20px;
+    background-color: rgba(0, 0, 0, 0.6);
+    color: #fff;
+    text-align: center;
+}
+.van-button--disabled {
+    background-color: #939599;
+    opacity: 1;
+}
+</style>

src/main/modern-point/src/views/asset/Detail.vue

@@ -117,7 +117,7 @@
                         <div v-else class="text5">艺术家未设置</div>
                     </div>
                 </van-collapse-item>
-                <van-collapse-item name="4" class="goods-info init">
+                <!-- <van-collapse-item name="4" class="goods-info init">
                     <template #title>
                         <div class="page-title">
                             <img src="@assets/qiaoqiaohua-icon-weidakai.png" alt="" /> 悄悄话<span
@@ -135,7 +135,7 @@
                         </div>
                         <div class="text5" v-else>艺术家未设置</div>
                     </div>
-                </van-collapse-item>
+                </van-collapse-item> -->
                 <van-collapse-item name="5" class="goods-info">
                     <template #title>
                         <div class="titleIcon page-title">
@@ -205,10 +205,10 @@
         </div> -->
         <div class="btn van-safe-area-bottom" ref="btn" v-if="info.status === 'NORMAL'">
             <div class="btns1">
-                <div class="add" @click="Add">
+                <!-- <div class="add" @click="Add">
                     <img class="img" src="@assets/icon-dianzan.png" alt="" />
                     <div class="text2">赠送</div>
-                </div>
+                </div> -->
                 <van-button class="btn1" type="primary" block round @click="Exhibition">{{
                     info.publicShow ? '取消展示' : '公开展示'
                 }}</van-button>

src/main/modern-point/src/views/product/Detail.vue

@@ -130,7 +130,7 @@
                         <div v-else class="tips">艺术家未设置</div>
                     </div>
                 </van-collapse-item>
-                <van-collapse-item name="4" class="goods-info">
+                <!-- <van-collapse-item name="4" class="goods-info">
                     <template #title>
                         <div class="page-title">
                             <img src="@assets/qiaoqiaohua-icon-weidakai.png" alt="" /> 悄悄话<span
@@ -145,7 +145,7 @@
                         </div>
                     </div>
                     <div class="tips" v-else>艺术家未设置</div>
-                </van-collapse-item>
+                </van-collapse-item> -->
                 <van-collapse-item name="5" class="goods-info">
                     <template #title>
                         <div class="titleIcon page-title">

src/main/modern-point/src/views/user/Share.vue

@@ -0,0 +1,285 @@
+<template>
+    <div class="page">
+        <div class="share-img">
+            <img src="../../assets/share1.png" alt="" />
+        </div>
+        <div class="share-btn">
+            <van-button type="primary" @click="share" round block>立即邀请</van-button>
+        </div>
+        <!-- <div class="code">
+            <div class="code-top">
+                <div class="text1">我的邀请码</div>
+                <div class="text2">7474448585955505057578578</div>
+                <van-button round plain> 复制</van-button>
+            </div>
+            <div class="code-btn">
+                <van-button type="primary" round block>领取奖励</van-button>
+            </div>
+        </div> -->
+
+        <div class="panel">
+            <div class="panel-title">我的邀请</div>
+            <div class="panel-box">
+                <div class="panel-item">
+                    <div class="text1">
+                        <span>{{ userInfo.inviteAirDrop || 0 }}</span>
+                        <small>个</small>
+                    </div>
+                    <div class="text2">已获得藏品</div>
+                </div>
+                <div class="panel-item">
+                    <div class="text1">
+                        <span>{{ userInfo.inviteNum || 0 }}</span>
+                        <small>人</small>
+                    </div>
+                    <div class="text2">邀请好友</div>
+                </div>
+            </div>
+        </div>
+
+        <div class="tips">
+            活动规则：<br />
+            1、活动期间内，成功邀请10名注册Cosmos
+            Art平台并且完成实名认证即有机会获得《30w就这？纪念徽章-铜卡》数字藏品卡1张，限量1921份，送完即止；<br />
+            2、活动期间内，累计邀请20名新用户注册并且完成实名认证将有机会获得“莫斯马克米奇”数字藏品空投一张（奖励于“莫斯马克米奇”首次发售后5个小时内空投至用户藏品室），限量500份，送完即止；<br />
+            3、活动期间累计邀请注册且完成实名认证的用户数量排名前十的收藏师将额外获得惊喜奖励。<br />
+        </div>
+
+        <van-overlay :show="show" @click="show = false">
+            <div class="wrapper">
+                <img :src="img" class="wrapper-img" v-if="img" alt="" />
+                <div class="wrapper-box" v-else ref="post" @click.stop>
+                    <img class="share2" :src="shareBg" alt="" />
+                    <vue-qrcode :value="url" :options="{ width: 70, margin: 3 }" class="share-code"></vue-qrcode>
+                </div>
+
+                <img src="../../assets/close.png" alt="" class="close" />
+            </div>
+        </van-overlay>
+    </div>
+</template>
+
+<script>
+import { mapState } from 'vuex';
+import resolveUrl from 'resolve-url';
+import vueQrcode from '@chenfengyuan/vue-qrcode';
+import html2canvas from 'html2canvas';
+export default {
+    computed: {
+        ...mapState(['userInfo']),
+        url() {
+            return resolveUrl(this.$baseUrl, 'cosmos/register?invitor=' + this.userInfo.id);
+        }
+    },
+    components: {
+        vueQrcode
+    },
+    data() {
+        return {
+            show: false,
+            img: '',
+            shareBg: ''
+        };
+    },
+    mounted() {
+        this.getImgBase64(require('../../assets/share2.png'), 'shareBg');
+    },
+    methods: {
+        share() {
+            this.show = true;
+            if (!this.img) {
+                this.$toast.loading({
+                    message: '加载中...',
+                    forbidClick: true
+                });
+                setTimeout(() => {
+                    this.loadImg();
+                }, 500);
+            }
+        },
+        loadImg() {
+            html2canvas(this.$refs.post, {
+                useCORS: true,
+                allowTaint: true,
+                backgroundColor: null,
+                scale: 3
+            }).then(canvas => {
+                this.$toast.clear();
+                this.img = canvas.toDataURL('image/png');
+            });
+        },
+        getImgBase64(img2, key) {
+            let img = new Image();
+            img.crossOrigin = 'anonymous';
+            let _this = this;
+            img.onload = function () {
+                let src = _this.image2Base64(img);
+                _this[key] = src;
+            };
+            img.src = img2;
+        },
+        image2Base64(img) {
+            let canvas = document.createElement('canvas');
+            canvas.width = img.width;
+            canvas.height = img.height;
+            let ctx = canvas.getContext('2d');
+            ctx.drawImage(img, 0, 0, img.width, img.height);
+            let dataURL = canvas.toDataURL('image/png');
+            return dataURL;
+        }
+    }
+};
+</script>
+
+<style lang="less" scoped>
+.page {
+    background-color: #f3f4f5;
+}
+.share-btn {
+    padding: 16px 70px;
+}
+
+.code {
+    padding: 0 7px;
+    .code-top {
+        .flex();
+        height: 56px;
+        border-bottom: 1px dotted #ebeff1;
+
+        .text1 {
+            font-size: 12px;
+            color: #939599;
+        }
+        .text2 {
+            font-size: 12px;
+            color: #26273c;
+            margin-left: 4px;
+            flex-grow: 1;
+        }
+        .van-button {
+            border: 1px solid #ebeff1;
+            min-width: 70px;
+        }
+    }
+    background-color: #fff;
+    margin: 0 16px;
+    border-radius: 12px;
+
+    .code-btn {
+        padding: 12px 80px 16px;
+    }
+}
+
+.panel {
+    margin: 20px 16px 0;
+    background: #ffffff;
+    border-radius: 12px;
+
+    .panel-title {
+        font-size: 18px;
+        font-weight: bold;
+        line-height: 24px;
+        color: #26273c;
+        padding-top: 22px;
+        text-align: center;
+    }
+
+    .panel-box {
+        .flex();
+        .panel-item {
+            width: 50%;
+            .flex-col();
+            align-items: center;
+            justify-content: center;
+            padding: 28px 0;
+
+            .text1 {
+                font-size: 26px;
+                font-weight: bold;
+                line-height: 35px;
+                color: #ff6464;
+                .flex();
+                span {
+                    display: inline-block;
+                }
+                small {
+                    font-size: 12px;
+                    font-weight: normal;
+                    line-height: 17px;
+                    color: #939599;
+                    margin-top: 6px;
+                    display: inline-block;
+                }
+            }
+
+            .text2 {
+                font-size: 12px;
+                line-height: 17px;
+                color: #939599;
+                margin-top: 2px;
+            }
+        }
+    }
+}
+
+.tips {
+    font-size: 14px;
+    line-height: 24px;
+    color: #939599;
+    margin: 25px 16px;
+}
+
+.share-img {
+    padding: 19px 16px 0;
+    img {
+        width: 100%;
+    }
+}
+.wrapper {
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+    .flex-col();
+    align-items: center;
+    justify-content: center;
+}
+.share2 {
+    width: 300px;
+    height: auto;
+    display: block;
+}
+.share-code {
+    position: absolute;
+    bottom: 8px;
+    right: 7px;
+    border-radius: 6px;
+}
+
+.wrapper-box {
+    border-radius: 10px;
+    overflow: hidden;
+    position: relative;
+    .title {
+        font-size: 16px;
+        line-height: 24px;
+        color: #26273c;
+        opacity: 1;
+        text-align: center;
+        padding: 9px;
+        background-color: #fff;
+    }
+}
+
+.wrapper-img {
+    width: 300px;
+    display: block;
+}
+
+.close {
+    width: 40px;
+    height: 40px;
+    display: block;
+    margin-top: 12px;
+}
+</style>