Merge branch 'master' of http://git.izouma.com/xiongzhu/raex_front into dev

.env.development

@@ -1,4 +1,4 @@
-VUE_APP_BASE_URL=https://test.raex.vip/
+VUE_APP_BASE_URL=https://www.raex.vip/
 NODE_ENV=development
 VUE_APP_PUBLIC_PATH=/
 ASSETS_PATH=raex

src/components/creator/RankInfo.vue

@@ -2,7 +2,7 @@
     <div class="rank" :class="[`rank${index}`]">
         <div class="rank-icon">
             <img v-if="index < 3" :src="icons[index]" alt="" />
-            <span v-else>{{ index + 1 }}</span>
+            <span v-else>{{ getNum(index + 1) }}</span>
         </div>
         <div class="content">
             <van-image round width="42" height="42" :src="info.avatar" />
@@ -81,9 +81,8 @@ export default {
             height: 38px;
         }
         span {
-            font-size: 20px;
-            font-family: AlibabaPuHuiTi-Bold, AlibabaPuHuiTi;
-            font-weight: bold;
+            font-size: 16px;
+            font-family: AlibabaPuHuiTi-Regular, AlibabaPuHuiTi;
             color: var(--text0);
             line-height: 20px;
         }
@@ -119,14 +118,16 @@ export default {
         }
     }
 
-    &::after {
-        content: '';
-        position: absolute;
-        left: 16px;
-        right: 16px;
-        bottom: 0;
-        height: 1px;
-        background-color: var(--border);
+    &:not(:last-child) {
+        &::after {
+            content: '';
+            position: absolute;
+            left: 16px;
+            right: 16px;
+            bottom: 0;
+            height: 1px;
+            background-color: var(--border);
+        }
     }
 }
 </style>

src/components/product/HotCollect.vue

@@ -0,0 +1,117 @@
+<template>
+    <div class="collect-info" @click="goSearch">
+        <van-image width="46" height="46" radius="8" :src="getImg(changeImgs(info.pic, 600))" />
+        <div class="content">
+            <div class="text1 van-ellipsis">{{ info.name }}</div>
+            <div class="text2">
+                <span>收藏品</span>
+            </div>
+        </div>
+        <van-button size="mini" plain type="primary" round> 查看</van-button>
+
+        <img :src="icons[index]" v-if="index < 3" alt="" class="rank-img" />
+        <div class="rank-num" v-else>{{ index + 1 }}</div>
+    </div>
+</template>
+
+<script>
+import product from '../../mixins/product';
+export default {
+    mixins: [product],
+    props: {
+        index: {
+            type: Number,
+            default: 0
+        },
+        info: {
+            type: Object,
+            default: () => {
+                return {};
+            }
+        }
+    },
+    data() {
+        return {
+            icons: [
+                require('@assets/info_icon_no1-ip.png'),
+                require('@assets/info_icon_no2-ip.png'),
+                require('@assets/info_icon_no3-ip.png')
+            ]
+        };
+    },
+    methods: {
+        goSearch() {
+            this.$router.push({
+                path: '/productSearchCorpse',
+                query: {
+                    search: this.info.prefixName
+                }
+            });
+        }
+    }
+};
+</script>
+
+<style lang="less" scoped>
+.collect-info {
+    .flex();
+    padding: 12px 16px;
+    position: relative;
+    .van-image {
+        flex-shrink: 0;
+    }
+}
+
+.content {
+    flex-grow: 1;
+    overflow: hidden;
+    padding: 0 20px 0 12px;
+
+    .text1 {
+        font-size: 14px;
+        font-weight: bold;
+        color: #000000;
+        line-height: 24px;
+    }
+    .text2 {
+        margin-top: 4px;
+        span {
+            font-size: 12px;
+            color: #8a8a8e;
+            line-height: 18px;
+            background: #f5f7fa;
+            border-radius: 2px;
+            padding: 0 10px;
+            overflow: hidden;
+        }
+    }
+}
+
+.van-button {
+    min-width: 68px;
+    background: #f5f7fa;
+}
+
+.rank-img {
+    width: 20px;
+    height: 20px;
+    position: absolute;
+    top: 12px;
+    left: 16px;
+}
+
+.rank-num {
+    position: absolute;
+    top: 12px;
+    left: 16px;
+    text-align: center;
+    font-size: 14px;
+    font-weight: bold;
+    color: #ffffff;
+    line-height: 20px;
+    width: 20px;
+    height: 20px;
+    background: linear-gradient(42deg, #8d94b2 0%, #abb2d4 100%);
+    border-radius: 8px 0px 8px 0px;
+}
+</style>

src/components/product/NewsRecord.vue

@@ -102,6 +102,11 @@ export default {
 <style lang="less" scoped>
 /deep/.van-badge {
     z-index: 20;
+
+    &.van-badge--dot {
+        border: 1px solid #ffffff;
+        --van-badge-dot-size: 10px;
+    }
 }
 .news-record {
     position: relative;

src/views/Home.vue

@@ -85,12 +85,11 @@
                     <div class="text2">{{ item.remark }}</div>
                 </div>
             </div>
-
-            <div class="card news" style="order: 2" v-if="hotUsers.length > 0">
+            <div class="card news" style="order: 2" v-if="HotCollects.length > 0">
                 <div class="news-title">
                     <div class="news-left">
-                        <div class="text1">热力探索</div>
-                        <div class="text2">本周探索者购买力排名</div>
+                        <div class="text1">热力IP</div>
+                        <div class="text2">一周最热IP排名</div>
                     </div>
                 </div>
                 <div class="rank-list">
@@ -102,10 +101,32 @@
                         slides-per-view="auto"
                         free-mode
                     >
-                        <swiper-slide v-for="(item, index) in hotUsers" :key="index">
-                            <rank-info :index="index" v-model:info="hotUsers[index]"></rank-info>
+                        <swiper-slide v-for="(item, index) in HotCollects" :key="index">
+                            <!-- <rank-info :index="index" v-model:info="hotUsers[index]"></rank-info> -->
+                            <hot-collect :index="index" :info="item"></hot-collect>
                         </swiper-slide>
                     </swiper>
+
+                    <div class="rank-more" :style="{ visibility: hideMore ? 'hidden' : 'visible' }">
+                        <van-icon name="icon-a-iconarrowdown1" class-prefix="font_family" />
+                        <div>上滑显示更多</div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="card news" style="order: 2" v-if="hotUsers.length > 0">
+                <div class="news-title">
+                    <div class="news-left">
+                        <div class="text1">热力探索</div>
+                        <div class="text2">本周探索者购买力排名</div>
+                    </div>
+                </div>
+                <div class="rank-list">
+                    <div class="rankSwiper">
+                        <template v-for="(item, index) in hotUsers" :key="index">
+                            <rank-info :index="index" v-model:info="hotUsers[index]"></rank-info>
+                        </template>
+                    </div>
                 </div>
             </div>
         </div>
@@ -123,7 +144,7 @@
                 <div class="text1" :class="{ active: active === 1 }" @click="changeActive(1)">绿洲头条</div>
             </van-badge>
         </div> -->
-        <div class="listSwiper-title">往期数字艺术品</div>
+        <div class="listSwiper-title">最新数字艺术品</div>
         <div class="listSwiper">
             <product-large
                 v-for="(item, index) in products"
@@ -174,6 +195,7 @@ import NewsInfo from '../components/product/NewsInfo';
 import NewsSmall from '../components/product/NewsSmall.vue';
 import NewsRecord from '../components/product/NewsRecord.vue';
 import RankInfo from '../components/creator/RankInfo.vue';
+import HotCollect from '../components/product/HotCollect.vue';
 
 export default {
     name: 'home',
@@ -185,7 +207,8 @@ export default {
         ProductLarge,
         ProductSmall,
         NewsRecord,
-        RankInfo
+        RankInfo,
+        HotCollect
     },
     computed: {
         ...mapState(['userInfo']),
@@ -230,7 +253,8 @@ export default {
             scrollTop: 0,
             riskShow: false,
             hideMore: false,
-            hotUsers: []
+            hotUsers: [],
+            HotCollects: []
         };
     },
     mounted() {
@@ -339,7 +363,7 @@ export default {
                 message: '加载中...',
                 forbidClick: true
             });
-            return Promise.all([this.getBanner(), this.getProduct(), this.getHot()]).then(() => {
+            return Promise.all([this.getBanner(), this.getProduct(), this.getHot(), this.getTop()]).then(() => {
                 this.$toast.clear();
                 return Promise.resolve();
             });
@@ -351,6 +375,12 @@ export default {
                 return Promise.resolve();
             });
         },
+        getTop() {
+            return this.$http.get('/asset/topTen').then(res => {
+                this.HotCollects = res;
+                return Promise.resolve();
+            });
+        },
         getProduct() {
             return this.$http.get('/collection/recommend').then(res => {
                 this.products = res.filter(item => {
@@ -794,9 +824,21 @@ export default {
 }
 
 .rankSwiper {
-    height: 320px;
+    height: 350px;
     .swiper-slide {
-        height: 65px;
+        height: 70px;
+        position: relative;
+    }
+    .swiper-slide + .swiper-slide {
+        &::before {
+            content: '';
+            height: 1px;
+            background: #f5f7fa;
+            left: 74px;
+            right: 16px;
+            top: 0;
+            position: absolute;
+        }
     }
     // overflow: auto;
 }

src/views/Submit.vue

@@ -344,6 +344,10 @@ export default {
             if (!this.checkWebDriver(e)) {
                 return;
             }
+            this.$toast.loading({
+                message: '加载中...',
+                forbidClick: true
+            });
             this.createOrder()
                 .then(res => {
                     this.orderId = res.id;

src/views/activity/Submit.vue

@@ -254,6 +254,10 @@ export default {
                 this.$toast('请选择支付方式');
                 return;
             }
+            this.$toast.loading({
+                message: '加载中...',
+                forbidClick: true
+            });
             this.createOrder()
                 .then(res => {
                     this.$toast.clear();