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

src/components/asset/showInfo.vue

@@ -66,6 +66,11 @@
                 </div>
             </div>
         </div>
+
+        <div class="hot">
+            <img src="../../assets/info_icon_relizhi.png" alt="" />
+            <span>热力值 {{ info.heats || 0 }}</span>
+        </div>
     </router-link>
 </template>
 
@@ -235,4 +240,29 @@ export default {
         margin-left: 20vw;
     }
 }
+
+.hot {
+    .flex();
+    background-color: #fff3f8;
+    border-radius: 12px 2px 12px 2px;
+    position: absolute;
+    left: 0;
+    top: 0;
+    padding: 2px 10px;
+    z-index: 2;
+    img {
+        width: 18px;
+        height: 18px;
+        margin-right: 6px;
+    }
+    span {
+        font-weight: bold;
+        font-size: 12px;
+        color: #ffffff;
+        line-height: 22px;
+        background: linear-gradient(90deg, #ff2400 0%, #ff6800 100%);
+        -webkit-background-clip: text;
+        -webkit-text-fill-color: transparent;
+    }
+}
 </style>

src/main.js

@@ -85,6 +85,11 @@ if (query.code) {
     }
 }
 store.dispatch('getTime');
+if (location.pathname === '/hall') {
+    if (query.id) {
+        store.commit('setShowRoomId', query.id);
+    }
+}
 if (query.invitor) {
     store.commit('setInvitor', query.invitor);
 

src/store/index.js

@@ -18,7 +18,8 @@ export default createStore({
         netTime: 0,
         usedBuy: true,
         showConsole: false,
-        bankCard: null
+        bankCard: null,
+        showRoomId: null
     },
     mutations: {
         setFinished(state, finished) {
@@ -68,6 +69,9 @@ export default createStore({
         },
         setBankCard(state, bankCard) {
             state.bankCard = bankCard;
+        },
+        setShowRoomId(state, showRoomId) {
+            state.showRoomId = showRoomId;
         }
     },
     actions: {

src/views/Discover.vue

@@ -134,10 +134,12 @@
                 :finished="finished"
                 finished-text=""
                 @load="getList"
+                :class="{ hotList: sort === 'hot' }"
             >
                 <template v-for="(item, index) in list" :key="item.id">
                     <product-info v-if="sort === 'collection'" v-model:info="list[index]" dark></product-info>
                     <creator-small v-else-if="sort === 'creator'" v-model:info="list[index]"></creator-small>
+                    <show-info v-else-if="sort === 'hot'" v-model:info="list[index]" list></show-info>
                 </template>
             </van-list>
         </div>
@@ -153,6 +155,7 @@ import product from '../mixins/product';
 import ProductInfo from '../components/product/productInfo.vue';
 import banner from '../mixins/banner';
 import CreatorSmall from '../components/creator/CreatorSmall.vue';
+import ShowInfo from '../components/asset/showInfo.vue';
 
 export default {
     name: 'discover',
@@ -160,7 +163,8 @@ export default {
     mixins: [banner, product],
     components: {
         ProductInfo,
-        CreatorSmall
+        CreatorSmall,
+        ShowInfo
     },
     data() {
         return {
@@ -272,18 +276,13 @@ export default {
                 });
         },
         beforeChange(index) {
-            if (index === 'hot') {
-                this.wait();
-                return false;
-            }
+            // if (index === 'hot') {
+            //     this.wait();
+            //     return false;
+            // }
             return true;
         },
         getList(isFirst = false) {
-            if (this.sort === 'hot') {
-                this.wait();
-                this.sort = 'creator';
-                return;
-            }
             if (isFirst) {
                 this.page = 0;
                 this.list = [];
@@ -298,12 +297,21 @@ export default {
                 del: false,
                 source: this.$store.state.reviewPay ? 'OFFICIAL' : ''
             };
+            let sort = 'id,desc';
             if (this.sort === 'creator') {
                 url = '/user/all';
                 query = {
                     type: 'MINTER',
                     del: false
                 };
+            } else if (this.sort === 'hot') {
+                url = 'showroom/all';
+                query = {
+                    del: false,
+                    status: 'SUCCESS',
+                    publish: true
+                };
+                sort = 'heats,desc';
             }
 
             return this.$http
@@ -313,7 +321,7 @@ export default {
                         page: this.page,
                         size: 20,
                         query: query,
-                        sort: 'id,desc'
+                        sort: sort
                     },
                     { body: 'json' }
                 )
@@ -382,7 +390,7 @@ export default {
         }
     },
     beforeRouteLeave(to, from, next) {
-        if (!to.meta.menuPage) {
+        if (!to.meta.menuPage || to.path === '/hall') {
             this.scrollTop = this.scrollWrapper.value.scrollTop;
             this.setKeeps(['index', 'discover']);
         } else {
@@ -571,6 +579,19 @@ export default {
     // display: flex;
     // flex-wrap: wrap;
     padding: 0 8px 2px;
+
+    &.hotList {
+        padding: 16px;
+        background: #272b2e;
+
+        .showInfo + .showInfo {
+            margin-top: 16px;
+        }
+        .showInfo {
+            background: #373b3e;
+            border-radius: 12px;
+        }
+    }
     min-height: 100vh;
 }
 

src/views/account/Register.vue

@@ -150,7 +150,8 @@ export default {
                 password: '',
                 password2: '',
                 code: '',
-                inviteCode: this.$store.state.inviteCode || ''
+                inviteCode: this.$store.state.inviteCode || '',
+                showroomId: this.$store.state.showRoomId || ''
             },
             checked: false,
             showInvite: true,

src/views/hall/Detail.vue

@@ -9,7 +9,7 @@
                 <div class="top-right">
                     <div class="top-btn submit" v-if="!isVertical || !windowVertical">
                         <img src="../../assets/icon-tupian.png" alt="" />
-                        <span>{{ assets.length }}</span>
+                        <span>{{ blindBoxsNums || assets.length }}</span>
                     </div>
                     <div
                         class="top-btn submit"
@@ -47,7 +47,7 @@
             <div class="btns" v-if="isVertical && windowVertical && info.publish">
                 <div class="btn">
                     <img src="../../assets/icon-tupian.png" alt="" />
-                    <span>{{ assets.length }}</span>
+                    <span>{{ blindBoxsNums || assets.length }}</span>
                 </div>
                 <div class="btn" @click="like(info)">
                     <img v-if="info.liked" src="../../assets/icon-dianzan3.png" alt="" />
@@ -106,7 +106,7 @@
             </div>
             <div class="img-bg">
                 <div class="bg" :style="{ 'background-image': `url(${info.showroomBg})` }"></div>
-                <div class="imgs" v-if="assets.length === 0 && isMine">
+                <div class="imgs" v-if="assets.length === 0 && isMine && info.type !== 'COMPANY_BOX'">
                     <div class="icon">
                         <van-image
                             :src="require('../../assets/icon-tianjiacangping1.png')"
@@ -118,17 +118,66 @@
                         />
                     </div>
                 </div>
-                <div class="imgs" v-for="(item, index) in showList" :key="index" :style="getStyle(item.length)">
-                    <div class="icon" v-for="(img, imgIndex) in item" :key="imgIndex" @click="goCollection(img)">
-                        <div class="img-box">
-                            <van-image :src="img.pic" :width="picWidth" :height="picWidth" fit="coevr" radius="8" />
-                            <div class="icon-status" :class="{ status1: img.status === '仅展示' }">
-                                <span>{{ img.status }}</span>
-                                <span v-if="img.status === '寄售中'">¥{{ img.price }}</span>
+                <template v-if="info.type === 'COMPANY_BOX'">
+                    <div
+                        class="imgs blindContent"
+                        v-for="(item, index) in assets"
+                        :key="index"
+                        :style="getStyle(item.length)"
+                    >
+                        <div class="icon blind" @click="goCollection(item)">
+                            <div class="img-box">
+                                <van-image
+                                    :src="item.pic"
+                                    :width="picWidth"
+                                    :height="picWidth"
+                                    fit="coevr"
+                                    radius="8"
+                                />
+                                <div class="icon-status" :class="{ status1: item.status === '仅展示' }">
+                                    <span>{{ item.status }}</span>
+                                    <span v-if="item.status === '寄售中'">¥{{ item.price }}</span>
+                                </div>
+                                <div class="boxs-text" v-if="isVertical && windowVertical">
+                                    <span>盲盒内含：</span>
+                                    <span>{{ blindBoxs.length }}/{{ blindBoxsNums }}</span>
+                                </div>
+                            </div>
+
+                            <div class="boxs">
+                                <div class="boxs-text" v-if="!isVertical || !windowVertical">
+                                    <span>盲盒内含：</span>
+                                    <span>{{ blindBoxs.length > 20 ? 20 : blindBoxs.length }}/{{ blindBoxsNums }}</span>
+                                </div>
+                                <div class="blind-imgs" :style="getBlindStyle()">
+                                    <van-image
+                                        class="blind-img"
+                                        v-for="img in blindBoxs"
+                                        :key="img.id"
+                                        :src="changeImgs(img.pic)"
+                                        :width="blindWidth"
+                                        :height="blindWidth"
+                                        fit="cover"
+                                        radius="4"
+                                    />
+                                </div>
                             </div>
                         </div>
                     </div>
-                </div>
+                </template>
+                <template v-else>
+                    <div class="imgs" v-for="(item, index) in showList" :key="index" :style="getStyle(item.length)">
+                        <div class="icon" v-for="(img, imgIndex) in item" :key="imgIndex" @click="goCollection(img)">
+                            <div class="img-box">
+                                <van-image :src="img.pic" :width="picWidth" :height="picWidth" fit="coevr" radius="8" />
+                                <div class="icon-status" :class="{ status1: img.status === '仅展示' }">
+                                    <span>{{ img.status }}</span>
+                                    <span v-if="img.status === '寄售中'">¥{{ img.price }}</span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </template>
             </div>
         </div>
         <van-action-sheet
@@ -170,7 +219,9 @@
                         <div class="name van-multi-ellipsis--l2">
                             {{ collectionInfo.name }}
                         </div>
-                        <div class="code">编号&nbsp;&nbsp; {{ collectionInfo.number }}</div>
+                        <div class="code" v-if="collectionInfo.number">
+                            编号&nbsp;&nbsp; {{ collectionInfo.number }}
+                        </div>
                         <div class="flex1"></div>
                         <div class="collection-user">
                             <div class="collection-user-item">
@@ -269,7 +320,9 @@ export default {
             showIntro: false,
             actions: [{ name: '藏品室上传' }],
             collectionShow: false,
-            collectionInfo: {}
+            collectionInfo: {},
+            blindBoxs: [],
+            blindBoxsNums: 0
         };
     },
     computed: {
@@ -314,6 +367,15 @@ export default {
                 return '15vh';
             }
         },
+        blindWidth() {
+            if (!this.isVertical) {
+                return '11vw';
+            } else if (!this.windowVertical) {
+                return '11vh';
+            } else {
+                return '10vh';
+            }
+        },
         showMore() {
             if (
                 this.isVertical &&
@@ -367,24 +429,59 @@ export default {
                 this.show = true;
             }
         },
-        getStyle(num = 1) {
+        getBlindStyle() {
             if (!this.isVertical) {
                 return {
-                    height: num * 49 + 'vw',
-                    paddingBottom: num == 4 ? '26.5vw' : '10vw'
+                    width: 32 + 'vw',
+                    height: '146vw'
                 };
             } else if (!this.windowVertical) {
                 return {
-                    width: num * 49 + 'vh',
-                    paddingRight: num == 4 ? '26.5vh' : '10vh'
+                    height: 32 + 'vh'
                 };
             } else {
                 return {
-                    width: Math.round(num / 2) * 22 + 'vh',
-                    paddingRight: Math.round(num / 2) == 9 ? '23vh' : '10vh'
+                    height: 35 + 'vh'
                 };
             }
         },
+        getStyle(num = 1) {
+            if (this.info.type === 'COMPANY_BOX') {
+                if (!this.isVertical) {
+                    return {
+                        height: '196vw',
+                        paddingBottom: '26.5vw'
+                    };
+                } else if (!this.windowVertical) {
+                    return {
+                        width: '210vh',
+                        paddingRight: '21vh'
+                    };
+                } else {
+                    return {
+                        width: '200vh',
+                        paddingRight: '23vh'
+                    };
+                }
+            } else {
+                if (!this.isVertical) {
+                    return {
+                        height: num * 49 + 'vw',
+                        paddingBottom: num == 4 ? '26.5vw' : '10vw'
+                    };
+                } else if (!this.windowVertical) {
+                    return {
+                        width: num * 49 + 'vh',
+                        paddingRight: num == 4 ? '26.5vh' : '10vh'
+                    };
+                } else {
+                    return {
+                        width: Math.round(num / 2) * 22 + 'vh',
+                        paddingRight: Math.round(num / 2) == 9 ? '23vh' : '10vh'
+                    };
+                }
+            }
+        },
         getBg() {
             if (!this.isVertical || !this.windowVertical) {
                 return `url(${this.info.headBg})`;
@@ -420,31 +517,53 @@ export default {
                 message: '加载中...',
                 forbidClick: true
             });
-            return this.$http.get('/showroom/get/' + this.roomId).then(res => {
-                this.$toast.clear();
-                this.info = { name: '', ...res };
-                // this.$nextTick(() => {
-                //     if (!this.isMine && res.type === 'COMPANY' && res.status !== 'SUCCESS') {
-                //         this.$dialog
-                //             .alert({
-                //                 title: '提示',
-                //                 message: '当前展厅正在审核中'
-                //             })
-                //             .then(() => {
-                //                 this.backPage();
-                //             });
-                //     }
-                // });
-                this.assets =
-                    res.collections.map(item => {
-                        return {
-                            ...item,
-                            id: item.collectionId
-                        };
-                    }) || [];
-                // this.assets = [...res.collections, ...res.collections, ...res.collections, ...res.collections];
-                return Promise.resolve(res);
-            });
+            return this.$http
+                .get('/showroom/get/' + this.roomId)
+                .then(res => {
+                    this.$toast.clear();
+                    this.info = { name: '', ...res };
+                    // this.$nextTick(() => {
+                    //     if (!this.isMine && res.type === 'COMPANY' && res.status !== 'SUCCESS') {
+                    //         this.$dialog
+                    //             .alert({
+                    //                 title: '提示',
+                    //                 message: '当前展厅正在审核中'
+                    //             })
+                    //             .then(() => {
+                    //                 this.backPage();
+                    //             });
+                    //     }
+                    // });
+                    this.assets =
+                        res.collections.map(item => {
+                            return {
+                                ...item,
+                                id: item.collectionId
+                            };
+                        }) || [];
+                    // this.assets = [...res.collections, ...res.collections, ...res.collections, ...res.collections];
+                    if (res.type === 'COMPANY_BOX') {
+                        return this.$http.post(
+                            '/blindBoxItem/all',
+                            {
+                                query: {
+                                    blindBoxId: this.assets[0].id
+                                },
+                                size: 36
+                            },
+                            { body: 'json' }
+                        );
+                    } else {
+                        return Promise.resolve(res);
+                    }
+                })
+                .then(res => {
+                    if (this.info.type === 'COMPANY_BOX') {
+                        console.log(res);
+                        this.blindBoxs = res.content;
+                        this.blindBoxsNums = res.totalElements;
+                    }
+                });
         },
         back() {
             if (this.isMine && this.isEdit) {
@@ -544,6 +663,7 @@ export default {
             }
         },
         goCollection(info) {
+            console.log(info);
             this.$http.get('/collection/get/' + info.collectionId).then(res => {
                 this.collectionInfo = res;
                 this.collectionShow = true;
@@ -725,8 +845,11 @@ export default {
     // width: 259vh;
     height: 45vh;
     padding: 0 10vh 0 23vh;
-    margin-top: 20vh;
+    margin-top: 18.5vh;
     min-width: calc(100vw - 33vh);
+    &.blindContent {
+        margin-top: 22vh;
+    }
     .icon {
         padding: 3vh 0;
 
@@ -735,17 +858,24 @@ export default {
         width: 22vh;
         box-sizing: border-box;
         position: relative;
+        &.blind {
+            width: 205vh;
+        }
         img {
             width: 110px;
             height: 110px;
             display: block;
         }
         .van-image {
+            display: block;
             position: relative;
             transition: transform ease-in-out 0.3s;
         }
         .img-box {
             position: relative;
+            .boxs-text {
+                padding: 10px 0;
+            }
         }
         .icon-status {
             position: absolute;
@@ -771,6 +901,37 @@ export default {
     }
 }
 
+.blind {
+    background: rgba(0, 0, 0, 0.16);
+    border-radius: 12px;
+    border: 1px solid #ffffff;
+    backdrop-filter: blur(30px);
+    padding: 2vh 0 2vh 2vh !important;
+    align-items: flex-start !important;
+    .boxs {
+        padding-left: 5vh;
+        .boxs-text {
+            padding-right: 8vh;
+        }
+    }
+    .boxs-text {
+        font-size: 10px;
+        font-weight: bold;
+        color: #ffffff;
+        line-height: 10px;
+        .flex();
+        justify-content: space-between;
+    }
+    .blind-imgs {
+        .flex();
+        flex-wrap: wrap;
+        overflow: hidden;
+        .blind-img {
+            margin: 0 5vh 2vh 0;
+        }
+    }
+}
+
 .bottom {
     position: fixed;
     bottom: 120px;
@@ -906,15 +1067,34 @@ export default {
         }
     }
     .imgs {
-        height: 44.6vh;
+        height: 42vh;
         flex-direction: row;
         padding: 0 23vh;
         min-width: calc(100vw - 128vh);
+        margin-top: 20vh;
+        &.blindContent {
+            padding: 0 15vh;
+        }
         .icon {
             // padding: 15vh 0;
             padding: 0 0;
             width: 49vh;
             padding-bottom: 4vh;
+
+            &.blind {
+                width: 88vh;
+                padding: 12px 0 12px 6vh !important;
+                align-items: center !important;
+                .boxs {
+                    padding-left: 6vh;
+                }
+                width: 210vh;
+                .blind-imgs {
+                    .blind-img {
+                        margin: 5vh 5vh 0 0;
+                    }
+                }
+            }
         }
     }
 
@@ -1014,6 +1194,32 @@ export default {
         .icon {
             height: 49vw;
             width: auto;
+            &.blind {
+                flex-direction: column;
+                padding: 6vw 12px 0 12px !important;
+                align-items: center !important;
+                .boxs {
+                    padding-top: 5vw;
+                    padding-left: 0;
+                    position: relative;
+
+                    .boxs-text {
+                        position: absolute;
+                        transform: rotate(90deg);
+                        white-space: nowrap;
+                        /* width: 100vw; */
+                        transform-origin: left bottom;
+                        left: 30vw;
+                        top: 8vw;
+                    }
+                }
+                height: 196vw;
+                .blind-imgs {
+                    .blind-img {
+                        margin: 5vw 5vw 0 0;
+                    }
+                }
+            }
         }
         .van-image {
             transform: rotate(90deg);

src/views/hall/List.vue

@@ -69,7 +69,7 @@ export default {
                     publish: true,
                     type: this.type
                 },
-                sort: 'sort,desc;id,desc'
+                sort: 'heats,desc'
             };
         },
         onRefresh() {