|
|
@@ -1,163 +0,0 @@
|
|
|
-<template>
|
|
|
- <div>
|
|
|
- <div class="box" @click="Store">
|
|
|
- <div class="content" v-for="(item, index) in list" :key="index">
|
|
|
- <img class="imgBox" src="../assets/img/888.jpg" alt="" />
|
|
|
- <div class="introduce">{{ item.name }}</div>
|
|
|
- <div class="price">
|
|
|
- <img class="img1" src="../assets/img/icon_jiage@3x.png" alt="" />
|
|
|
- <div class="num">{{ item.price }}</div>
|
|
|
- <div class="time" v-if="flagId == 1">
|
|
|
- <div class="time1">抢购倒计时<span>1天 01:35:06</span></div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="border"></div>
|
|
|
- <div class="fans">
|
|
|
- <div class="text">
|
|
|
- <div class="text1 name1">
|
|
|
- <img class="text2" src="../assets/img/888.jpg" alt="" />
|
|
|
- <div class="text3">铸造者</div>
|
|
|
- </div>
|
|
|
- <div class="text1" v-if="flagId !== '1'">
|
|
|
- <img class="text2" src="../assets/img/888.jpg" alt="" />
|
|
|
- <div class="text3">持有者</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="text">
|
|
|
- <div class="text1" v-if="flagId !== '1'">
|
|
|
- <img class="text2 text4" src="../assets/img/like.png" alt="" />
|
|
|
- <div class="text3">16</div>
|
|
|
- </div>
|
|
|
- <div class="text1" v-else>
|
|
|
- <img class="text2 text4" src="../assets/img/icon-yuyue@3x.png" alt="" />
|
|
|
- <div class="text3">预约</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-<script>
|
|
|
-export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- list: [
|
|
|
- { name: '游戏《百分之一》精美皮肤-恶…', price: '320' },
|
|
|
- { name: '游戏《百分之一》精美皮肤-恶…', price: '320' },
|
|
|
- { name: '游戏《百分之一》精美皮肤-恶…', price: '320' },
|
|
|
- { name: '游戏《百分之一》精美皮肤-恶…', price: '320' }
|
|
|
- ]
|
|
|
- };
|
|
|
- },
|
|
|
- computed: {
|
|
|
- flagId() {
|
|
|
- return this.$route.query.flag;
|
|
|
- }
|
|
|
- },
|
|
|
- mounted() {},
|
|
|
- methods: {
|
|
|
- Store() {
|
|
|
- this.$router.push('/storeDetail');
|
|
|
- }
|
|
|
- }
|
|
|
-};
|
|
|
-</script>
|
|
|
-<style lang="less" scoped>
|
|
|
-.box {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- .content {
|
|
|
- .line();
|
|
|
- width: 276px;
|
|
|
- height: 416px;
|
|
|
- .imgBox {
|
|
|
- height: 266px;
|
|
|
- width: 100%;
|
|
|
- border-radius: 8px 8px 0px 0px;
|
|
|
- }
|
|
|
- .introduce {
|
|
|
- padding: 10px 16px 6px;
|
|
|
- font-size: 14px;
|
|
|
- font-weight: 400;
|
|
|
- color: #939599;
|
|
|
- line-height: 20px;
|
|
|
- }
|
|
|
- .price {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- // justify-content: space-between;
|
|
|
- padding: 0 16px 16px;
|
|
|
- .img1 {
|
|
|
- width: 10px;
|
|
|
- height: 11px;
|
|
|
- margin-top: 10px;
|
|
|
- }
|
|
|
- .num {
|
|
|
- font-size: 30px;
|
|
|
- font-family: OSP-DIN, OSP;
|
|
|
- font-weight: normal;
|
|
|
- color: @prim;
|
|
|
- line-height: 30px;
|
|
|
- }
|
|
|
- .time {
|
|
|
- display: flex;
|
|
|
- margin-left: 24px;
|
|
|
- .time1 {
|
|
|
- font-size: 14px;
|
|
|
- font-weight: 400;
|
|
|
- color: #939599;
|
|
|
- line-height: 24px;
|
|
|
- }
|
|
|
- span {
|
|
|
- font-size: 14px;
|
|
|
- font-weight: 400;
|
|
|
- color: @prim;
|
|
|
- line-height: 24px;
|
|
|
- margin-left: 6px;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .border {
|
|
|
- height: 1px;
|
|
|
- background: #494a4d;
|
|
|
- border-radius: 1px;
|
|
|
- margin: 0 16px;
|
|
|
- }
|
|
|
- .fans {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- padding: 19px 16px 20px;
|
|
|
- .text {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- .text1 {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- &.name1 {
|
|
|
- margin-right: 22px;
|
|
|
- }
|
|
|
- .text2 {
|
|
|
- width: 20px;
|
|
|
- height: 20px;
|
|
|
- border-radius: 50%;
|
|
|
- margin-right: 4px;
|
|
|
- &.text4 {
|
|
|
- width: 18px;
|
|
|
- height: 18px;
|
|
|
- }
|
|
|
- }
|
|
|
- .text3 {
|
|
|
- font-size: 14px;
|
|
|
- font-weight: 400;
|
|
|
- color: #939599;
|
|
|
- line-height: 24px;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</style>
|