<template>
|
<div class="main">
|
<p class="nav justify-between">
|
<img src="@/assets/image/icon-left_arrow.png" alt="" @click="linkToBack" />
|
<span>{{ $t('广告详情') }}</span>
|
<img src="@/assets/image/edit.png" />
|
</p>
|
<p class="flex justify-between p-li bian">
|
<span>{{ $t('广告编号') }}</span>
|
<span class="font-s">{{ info.id }}</span>
|
</p>
|
<div class="flex justify-between items-center p-li">
|
<div>
|
<p class="price">{{ $t('价格') }}</p>
|
<p>{{ $t('固定价格') }}</p>
|
</div>
|
<p class="price-num">￥ {{ info.symbol_value }}</p>
|
</div>
|
<div class="bg"></div>
|
<p class="flex justify-between p-li pd-t">
|
<span>{{ $t('交易总额') }}</span>
|
<span class="font-s">{{ (info.symbol_value / 1) * (info.coin_amount / 1) }} {{ info.currency }}</span>
|
</p>
|
<p class="flex justify-between p-li bor">
|
<span>{{ $t('限额') }}</span><span class="font-s">{{ info.investment_min }} - {{ info.investment_max }} {{
|
info.currency
|
}}</span>
|
</p>
|
<p v-for="(item, index) in payNameArr" :key="'paytype_index' + index" class="flex justify-between p-li pd-t">
|
<span v-if="index === 0">{{ $t('付款方式') }}</span>
|
<span class="font-s flex items-center">
|
<span>{{ info.establish }}</span>
|
<span class="under">{{ item }}</span>
|
<img src="@/assets/image/card.png" class="card-d" alt="" />
|
</span>
|
</p>
|
<p class="flex justify-between p-li">
|
<span>{{ $t('汇率付款方式') }}</span>
|
<span class="font-s">{{ info.pay_rate }} {{ info.currency }}</span>
|
</p>
|
<p class="flex justify-between p-li btm">
|
<span>{{ $t('状态') }}</span>
|
<span class="font-s">{{ $t('已结束') }}</span>
|
</p>
|
|
<div class="up">{{ $t('重新上架') }}</div>
|
</div>
|
</template>
|
|
<script>
|
import { getAdDetail } from '@/API/otc'
|
export default {
|
data() {
|
return {
|
id: '',
|
info: {
|
},
|
}
|
},
|
created() {
|
this.id = this.$route.query.id
|
getAdDetail({
|
id: this.id,
|
language: this.$i18n.locale
|
}).then((res) => {
|
//console.log('广告详情', res)
|
this.info = res
|
})
|
},
|
computed: {
|
payNameArr() {
|
if (this.info.pay_type) {
|
return this.info.pay_type.split(',')
|
} else {
|
return []
|
}
|
}
|
},
|
methods: {
|
linkToBack() {
|
this.$router.go(-1)
|
},
|
},
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.main {
|
// padding: 0 30px;
|
color: #868d9a;
|
|
.p-li {
|
// padding-bottom: 44px;
|
padding: 20px 32px;
|
flex-wrap: nowrap;
|
}
|
|
.pd-t {
|
padding-top: 40px;
|
}
|
}
|
|
.nav {
|
display: flex;
|
align-items: center;
|
font-size: 33px;
|
font-weight: bold;
|
color: #21262f;
|
padding: 30px 40px;
|
|
img {
|
width: 32px;
|
height: 32px;
|
}
|
}
|
|
.bian {
|
padding: 40px 32px !important;
|
border-bottom: 1px dashed #484756;
|
border-top: 1px solid #484756;
|
}
|
|
.price {
|
margin-bottom: 40px;
|
}
|
|
.price-num {
|
font-size: 52px;
|
font-weight: bold;
|
color: #000;
|
}
|
|
.bg {
|
height: 16px;
|
background: #f5f5f5;
|
}
|
|
.font-s {
|
font-weight: bold;
|
color: #000;
|
}
|
|
.card-d {
|
width: 35px;
|
height: 35px;
|
}
|
|
.under {
|
text-decoration-line: underline;
|
margin: 0 16px 0 28px;
|
}
|
|
.btm {
|
border-bottom: 1px dashed #484756;
|
}
|
|
.up {
|
width: 764px;
|
height: 100px;
|
background: #b8bcc5;
|
border-radius: 8px;
|
text-align: center;
|
line-height: 100px;
|
margin: 60px auto;
|
color: #292c2f;
|
font-size: 36px;
|
}
|
</style>
|
