<template>
|
<div>
|
<van-cell>
|
<van-row
|
align="center"
|
type="flex"
|
justify="space-between"
|
class="item-box"
|
>
|
<van-col span="8">{{ $t("名称") }}</van-col>
|
<van-col span="12">
|
{{ $t("单价") }}
|
</van-col>
|
<van-col span="4">
|
{{ $t("操作") }}
|
</van-col>
|
</van-row>
|
</van-cell>
|
<div class="fg"></div>
|
<van-cell v-for="item in showList" :key="item.id">
|
<van-row
|
align="center"
|
type="flex"
|
justify="space-between"
|
@click="subscription(item)"
|
class="item-box"
|
>
|
<van-col span="8">{{ item.newCoinName }}</van-col>
|
<van-col span="12">{{ item.issuePrice }}</van-col>
|
<van-col span="4">
|
<div class="bt">
|
{{ item.type === 1 ? $t("认购") : $t("配售") }}
|
</div>
|
</van-col>
|
</van-row>
|
</van-cell>
|
</div>
|
</template>
|
|
<script>
|
import { icoNewCurrencygetList, icoOrderAppAdd } from "@/API/home.api";
|
import { List, Cell, Dialog, Notify } from "vant";
|
|
export default {
|
components: {
|
[Dialog.Component.name]: Dialog.Component,
|
[List.name]: List,
|
[Cell.name]: Cell,
|
},
|
props: ["active"],
|
watch: {
|
active() {
|
this.getList();
|
},
|
},
|
data() {
|
return {
|
showList: [],
|
};
|
},
|
mounted() {
|
this.getList();
|
},
|
methods: {
|
async subscription(item) {
|
Dialog.confirm({
|
title: this.$t("提示"),
|
message: this.$t("是否认购"),
|
confirmButtonText: this.$t("确定"),
|
cancelButtonText: this.$t("取消"),
|
})
|
.then(async () => {
|
const res = await icoOrderAppAdd({
|
icoNewCurrencyId: item.id,
|
orderType: item.type,
|
tokenCode: item.tokenCode,
|
});
|
// 认购成功
|
Notify({ type: "success", message: this.$t("认购成功") });
|
setTimeout(() => {
|
this.$router.push(`/list-urrency?type=${item.type}`);
|
}, 500);
|
})
|
.catch(() => {
|
// on cancel
|
});
|
},
|
async getList() {
|
const res = await icoNewCurrencygetList({ type: 1 });
|
this.showList = res;
|
},
|
},
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
::v-deep .van-field__body {
|
height: 100%;
|
padding-left: 10px;
|
}
|
|
.item-box {
|
padding: 0 20px;
|
border-bottom: 1px solid #eee;
|
min-height: 100px;
|
}
|
|
.fg {
|
width: 100%;
|
height: 10px;
|
}
|
.bt {
|
width: 100%;
|
// height: 50px;
|
line-height: 50px;
|
margin: 10px 0;
|
text-align: center;
|
background-color: #def7ef;
|
color: #22d27f;
|
}
|
.placing {
|
border-top-left-radius: 20px;
|
border-top-right-radius: 20px;
|
}
|
|
.placing-box {
|
padding: 40px;
|
.placing-header {
|
// width: 100%;
|
margin: 20px 0;
|
text-align: center;
|
font-size: 46px;
|
}
|
.right {
|
text-align: right;
|
}
|
.mb {
|
margin-bottom: 10px;
|
}
|
.input-box {
|
border: 1px solid #c2c4c7;
|
display: flex;
|
|
.jy {
|
min-width: 150px;
|
border-left: 1px solid #c2c4c7;
|
display: flex;
|
align-items: center;
|
padding: 20px 0;
|
justify-content: space-between;
|
> div {
|
flex: 1;
|
// height: 50%;
|
text-align: center;
|
}
|
.jia {
|
border-left: 1px solid #c2c4c7;
|
}
|
}
|
}
|
}
|
::v-deep .van-field__body {
|
height: 100%;
|
padding-left: 10px;
|
}
|
.bfb {
|
display: flex;
|
justify-content: space-between;
|
margin-top: 15px;
|
> div {
|
width: 20%;
|
text-align: center;
|
border: 1px solid transparent;
|
background-color: #f6f6fc;
|
font-size: 24px;
|
line-height: 50px;
|
}
|
.bfbActive {
|
color: #056aea;
|
border: 1px solid #056aea;
|
background-color: #fff;
|
}
|
}
|
</style>
|
