|
|
@@ -111,32 +111,39 @@
|
|
|
<div class="status" v-else>
|
|
|
{{ getLabelName(info.status, assetStatusOptions) }}
|
|
|
</div>
|
|
|
-
|
|
|
- <div class="price1 num" v-if="info.salable">
|
|
|
- <div class="num1">
|
|
|
- <div class="price2 num2">数量</div>
|
|
|
- <span class="span">{{ info.total }}</span>
|
|
|
- </div>
|
|
|
+ <div style="margin-top: 3px" class="price1 num" v-if="info.salable">
|
|
|
+ <div class="price2 num2">单次限购 1 件</div>
|
|
|
<div class="price2 num2">已售 {{ info.sale }} / 剩余 {{ info.stock }}</div>
|
|
|
</div>
|
|
|
+ </div>
|
|
|
+ <div class="content" v-if="info.status !== 'GIFTING' && info.status !== 'GIFTED'">
|
|
|
+ <el-collapse v-model="activeNames" :accordion="false">
|
|
|
+ <el-collapse-item name="6">
|
|
|
+ <template slot="title">
|
|
|
+ <img class="imgs" src="../assets/detail/icon-cangzuo@3x.png" alt="" />
|
|
|
+ <span>操作</span>
|
|
|
+ </template>
|
|
|
+ <div class="btn-content">
|
|
|
+ <div class="btn-list">
|
|
|
+ <div class="buy" @click="changeShow">
|
|
|
+ <i class="font_family icon-icon-gongkaizhanshi"></i>
|
|
|
+ <span>{{ info.publicShow ? '改为仅展示' : '公开展示' }}</span>
|
|
|
+ </div>
|
|
|
|
|
|
- <div class="btn-content" v-if="info.status !== 'GIFTING' && info.status !== 'GIFTED'">
|
|
|
- <div class="btn-list">
|
|
|
- <div class="btn-item" @click="changeShow">
|
|
|
- <i class="font_family icon-icon-gongkaizhanshi"></i>
|
|
|
- <span>{{ info.publicShow ? '取消展示' : '公开展示' }}</span>
|
|
|
- </div>
|
|
|
- <div class="btn-item" @click="send">
|
|
|
- <i class="font_family icon-icon-zengsong"></i>
|
|
|
- <span>赠送好友</span>
|
|
|
+ <el-button @click="Consignment" class="buy" type="primary" size="default"
|
|
|
+ ><i class="font_family icon-icon-zhuanrang1"></i
|
|
|
+ ><span>{{ info.consignment ? '下架藏品' : '寄售上架' }}</span></el-button
|
|
|
+ >
|
|
|
+ <div class="btn-item" @click="send">
|
|
|
+ <i class="font_family icon-icon-zengsong"></i>
|
|
|
+ <span>赠送</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <el-button @click="Consignment" class="buy" type="primary" size="default"
|
|
|
- ><i class="font_family icon-icon-zhuanrang1"></i
|
|
|
- ><span>{{ info.consignment ? '取消寄售' : '寄售上架' }}</span></el-button
|
|
|
- >
|
|
|
- </div>
|
|
|
+ </el-collapse-item>
|
|
|
+ </el-collapse>
|
|
|
</div>
|
|
|
+
|
|
|
<div class="content">
|
|
|
<el-collapse v-model="activeNames" :accordion="false">
|
|
|
<el-collapse-item name="5">
|
|
|
@@ -251,24 +258,31 @@
|
|
|
<span>交易历史</span>
|
|
|
</template>
|
|
|
<el-table :data="tableData" stripe style="width: 100%; background: #1c1e26">
|
|
|
- <el-table-column prop="fromUser" label="用户" width="455">
|
|
|
+ <el-table-column prop="fromUser" label="卖方" width="355">
|
|
|
<template slot-scope="scope">
|
|
|
- <div style="color: #fdfb60; font-size: 16px">
|
|
|
+ <div style="color: #fdfb60; font-size: 14px">
|
|
|
{{ scope.row.fromUser }}
|
|
|
</div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column prop="operation" label="操作" width="505">
|
|
|
+ <el-table-column prop="operation" label="操作" width="305">
|
|
|
<template slot-scope="scope">
|
|
|
- <div style="font-size: 16px">
|
|
|
+ <div style="font-size: 14px">
|
|
|
{{ scope.row.operation }}
|
|
|
<span v-if="scope.row.price">{{ scope.row.price }}</span>
|
|
|
</div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
+ <el-table-column prop="operation" label="持有方" width="305">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div style="font-size: 14px">
|
|
|
+ {{ scope.row.owner }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
<el-table-column prop="createdAt" label="时间">
|
|
|
<template slot-scope="scope">
|
|
|
- <div style="font-size: 16px">
|
|
|
+ <div style="font-size: 14px">
|
|
|
{{ scope.row.createdAt }}
|
|
|
</div>
|
|
|
</template>
|
|
|
@@ -1022,6 +1036,7 @@ export default {
|
|
|
}
|
|
|
.box {
|
|
|
width: 218px;
|
|
|
+ margin-top: 5px;
|
|
|
}
|
|
|
|
|
|
.img {
|
|
|
@@ -1031,14 +1046,15 @@ export default {
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
.iconBox {
|
|
|
- margin-left: -20px;
|
|
|
+ margin-left: -10px;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
.img2 {
|
|
|
width: 24px;
|
|
|
height: 24px;
|
|
|
- padding-left: 38px;
|
|
|
+ padding-left: 30px;
|
|
|
cursor: pointer;
|
|
|
+ margin-top: 5px;
|
|
|
}
|
|
|
}
|
|
|
.hoverTips {
|
|
|
@@ -1265,12 +1281,6 @@ export default {
|
|
|
height: 44px;
|
|
|
padding: 0 16px;
|
|
|
margin-top: 20px;
|
|
|
- // .time1 {
|
|
|
- // font-size: @menuFont2;
|
|
|
- // font-weight: 400;
|
|
|
- // color: #939599;
|
|
|
- // line-height: 24px;
|
|
|
- // }
|
|
|
.time2 {
|
|
|
font-size: 16px;
|
|
|
font-weight: 400;
|
|
|
@@ -1289,14 +1299,15 @@ export default {
|
|
|
padding: 0 16px;
|
|
|
background: #1f2230;
|
|
|
border-radius: 0px 0px 8px 8px;
|
|
|
- margin-bottom: 30px;
|
|
|
.price1 {
|
|
|
display: flex;
|
|
|
- padding: 18px 0 24px 0;
|
|
|
- border-bottom: 1px solid #494a4d;
|
|
|
+ padding: 23px 0 20px 0;
|
|
|
+
|
|
|
&.num {
|
|
|
justify-content: space-between;
|
|
|
border-bottom: 0;
|
|
|
+ padding: 0;
|
|
|
+ border-top: 1px solid #2b2e3e;
|
|
|
}
|
|
|
.num1 {
|
|
|
display: flex;
|
|
|
@@ -1310,13 +1321,13 @@ export default {
|
|
|
margin-left: 16px;
|
|
|
}
|
|
|
.price2 {
|
|
|
- font-size: 16px;
|
|
|
+ font-size: 14px;
|
|
|
font-weight: 400;
|
|
|
color: #939599;
|
|
|
line-height: 24px;
|
|
|
- padding-top: 12px;
|
|
|
+ margin-top: 13px;
|
|
|
&.num2 {
|
|
|
- padding-top: 0;
|
|
|
+ padding-bottom: 16px;
|
|
|
}
|
|
|
}
|
|
|
.price3 {
|
|
|
@@ -1511,28 +1522,35 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
.buy {
|
|
|
- width: 100%;
|
|
|
+ width: 230px;
|
|
|
+ height: 48px;
|
|
|
+ border-radius: 8px;
|
|
|
display: block;
|
|
|
- height: 52px;
|
|
|
- background: linear-gradient(135deg, @prim 0%, @warn 100%);
|
|
|
+ .line();
|
|
|
border-radius: 8px;
|
|
|
border-width: 0;
|
|
|
- color: #000;
|
|
|
- margin-top: 30px;
|
|
|
- &:hover {
|
|
|
- background: linear-gradient(135deg, darken(@prim, 10%), darken(@warn, 10%));
|
|
|
- }
|
|
|
+ color: #fff;
|
|
|
+ line-height: 48px;
|
|
|
+ text-align: center;
|
|
|
+ margin-right: 30px;
|
|
|
+ // &:hover {
|
|
|
+ // background: linear-gradient(135deg, darken(@prim, 10%), darken(@warn, 10%));
|
|
|
+ // }
|
|
|
|
|
|
- &.used {
|
|
|
- background: linear-gradient(135deg, darken(@prim, 50%), darken(@warn, 50%));
|
|
|
- color: #939599;
|
|
|
- }
|
|
|
+ // &.used {
|
|
|
+ // background: linear-gradient(135deg, darken(@prim, 50%), darken(@warn, 50%));
|
|
|
+ // color: #939599;
|
|
|
+ // }
|
|
|
i {
|
|
|
font-size: 24px;
|
|
|
+ margin-top: 4px;
|
|
|
+ vertical-align: middle;
|
|
|
}
|
|
|
span {
|
|
|
- font-size: 20px;
|
|
|
- margin-left: 16px;
|
|
|
+ font-size: @menuFont;
|
|
|
+ color: #ffffff;
|
|
|
+ vertical-align: middle;
|
|
|
+ margin-left: 10px;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
@@ -1600,55 +1618,6 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-// /deep/.content2 {
|
|
|
-// margin-top: 30px;
|
|
|
-// .el-collapse-item__wrap {
|
|
|
-// border-bottom-width: 0;
|
|
|
-// }
|
|
|
-// .el-collapse {
|
|
|
-// border-width: 0;
|
|
|
-// }
|
|
|
-
|
|
|
-// .el-collapse-item__header {
|
|
|
-// background-color: #1c1e26;
|
|
|
-// padding-left: 16px;
|
|
|
-// height: 68px;
|
|
|
-// border-bottom-width: 0;
|
|
|
-// img {
|
|
|
-// width: 24px;
|
|
|
-// height: 24px;
|
|
|
-// margin-right: 10px;
|
|
|
-// }
|
|
|
-// font-size: 16px;
|
|
|
-// color: #ffffff;
|
|
|
-// line-height: 24px;
|
|
|
-// }
|
|
|
-// .el-collapse-item__content {
|
|
|
-// background-color: #1f2230;
|
|
|
-// height: 100px !important;
|
|
|
-// }
|
|
|
-// .el-table {
|
|
|
-// background-color: transparent;
|
|
|
-// padding: 0 16px;
|
|
|
-// tr {
|
|
|
-// background-color: transparent;
|
|
|
-// }
|
|
|
-// th {
|
|
|
-// background-color: transparent;
|
|
|
-// }
|
|
|
-// &::before {
|
|
|
-// content: none;
|
|
|
-// }
|
|
|
-// }
|
|
|
-
|
|
|
-// .el-collapse-item {
|
|
|
-// &:last-child {
|
|
|
-// .el-collapse-item__wrap {
|
|
|
-// border-width: 0;
|
|
|
-// }
|
|
|
-// }
|
|
|
-// }
|
|
|
-// }
|
|
|
.list {
|
|
|
margin: -16px;
|
|
|
|
|
|
@@ -1658,9 +1627,11 @@ export default {
|
|
|
}
|
|
|
|
|
|
.status {
|
|
|
- font-size: 22px;
|
|
|
- color: #fdfb60;
|
|
|
- line-height: 36px;
|
|
|
+ font-size: 20px;
|
|
|
+ font-family: PingFangSC-Regular, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #939599;
|
|
|
+ line-height: 30px;
|
|
|
padding: 20px 0 16px;
|
|
|
}
|
|
|
|
|
|
@@ -1672,37 +1643,34 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
.btn-content {
|
|
|
- padding: 20px 0;
|
|
|
- border-top: 1px solid #2b2e3e;
|
|
|
+ padding: 20px 16px;
|
|
|
}
|
|
|
|
|
|
.btn-list {
|
|
|
.flex();
|
|
|
|
|
|
.btn-item {
|
|
|
+ width: 98px;
|
|
|
+ height: 48px;
|
|
|
+ padding-top: 4px !important;
|
|
|
.line();
|
|
|
color: #fff;
|
|
|
- flex-grow: 1;
|
|
|
- line-height: 52px;
|
|
|
text-align: center;
|
|
|
span {
|
|
|
- font-size: 20px;
|
|
|
+ font-size: @menuFont;
|
|
|
+ color: #ffffff;
|
|
|
vertical-align: middle;
|
|
|
}
|
|
|
i {
|
|
|
font-size: 24px;
|
|
|
- margin-right: 16px;
|
|
|
+ margin-right: 10px;
|
|
|
vertical-align: middle;
|
|
|
}
|
|
|
-
|
|
|
&:hover {
|
|
|
&::before {
|
|
|
background-color: fade(#1c1e26, 90%);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- .btn-item + .btn-item {
|
|
|
- margin-left: 30px;
|
|
|
- }
|
|
|
}
|
|
|
</style>
|
