<template>
|
<div class="ipo page-content">
|
<div class="box_head">
|
<div class="page-w2 head_content flex-between">
|
<div class="head_left flex-center">
|
<img src="@/assets/images/ipo-icon_b.png" />
|
<span>IPO</span>
|
</div>
|
<el-button
|
type="primary"
|
plain
|
@click="$router.push({ path: '/account', query: { nav: 5 } })"
|
>
|
{{ $t("订单") }}
|
<i class="el-icon-caret-right"></i>
|
</el-button>
|
</div>
|
</div>
|
|
<template v-if="tableData && tableData.length > 0">
|
<div class="box_content page-w2">
|
<div class="content_item" v-for="i in tableData" :key="i.id">
|
<div class="item_head">{{ i.title }}</div>
|
<el-row :gutter="20">
|
<el-col :span="9">
|
<div class="flex-start item_label">
|
<div class="label_1">{{ $t("hj313") }}</div>
|
<div class="label_2">
|
<el-tag
|
v-if="i.stockType == 'MEX'"
|
size="small"
|
style="margin-right: 8px"
|
>
|
MEX
|
</el-tag>
|
<el-tag
|
type="success"
|
size="small"
|
style="margin-right: 8px"
|
v-else-if="i.stockType == 'US'"
|
>
|
US
|
</el-tag>
|
<span>{{ i.name }}</span>
|
</div>
|
</div>
|
|
<div class="flex-start item_label">
|
<div class="label_1">{{ $t("hj81") }}</div>
|
<div class="label_2 sc_c" style="font-size: 18px">
|
{{ i.stockType | currencySymbol }} {{ i.price }}
|
</div>
|
</div>
|
|
<div class="flex-start item_label">
|
<div class="label_1">{{ $t("发行时间") }}</div>
|
<div class="label_2">
|
{{ i.subscriptionTime | gettime }}
|
</div>
|
</div>
|
</el-col>
|
|
<el-col :span="9">
|
<div class="flex-start item_label">
|
<div class="label_1">{{ $t("状态") }}</div>
|
<div class="label_2">
|
<el-tag type="warning" v-if="i.listDate > Date.now()">
|
{{ $t("待上市") }}
|
</el-tag>
|
<el-tag v-else>
|
{{ $t("已上市") }}
|
</el-tag>
|
</div>
|
</div>
|
|
<div class="flex-start item_label">
|
<div class="label_1">{{ $t("可申购数量") }}</div>
|
<div class="label_2">
|
{{ i.orderNumber }}
|
</div>
|
</div>
|
|
<div class="flex-start item_label">
|
<div class="label_1">{{ $t("上市时间") }}</div>
|
<div class="label_2">
|
{{ i.listDate | gettime }}
|
</div>
|
</div>
|
</el-col>
|
|
<el-col :span="6" class="flex-center" style="height: 100px">
|
<el-button
|
type="primary"
|
@click="buyOpen(i)"
|
icon="el-icon-plus"
|
v-if="i.isBuy == 0"
|
>
|
{{ $t("申购") }}
|
</el-button>
|
<el-button type="info" disabled v-else-if="i.isBuy == 1">
|
{{ $t("已申购") }}
|
</el-button>
|
</el-col>
|
</el-row>
|
</div>
|
</div>
|
|
<div class="flex-end page-w2">
|
<el-pagination
|
background
|
layout="prev, pager, next"
|
:total="total"
|
:current-page="pageNum"
|
:page-size="pageSize"
|
@current-change="handleCurrentChange"
|
>
|
</el-pagination>
|
</div>
|
</template>
|
|
<el-empty :description="$t('zwsj')" v-else></el-empty>
|
</div>
|
</template>
|
|
<script>
|
import * as api from "@/axios/api";
|
import mixins from "@/mixins/myMixins"; // 混入
|
export default {
|
name: "ipo",
|
mixins: [mixins],
|
data() {
|
return {
|
// 列表参数,必须是opt和myMixins混入配合使用
|
opt: {},
|
buyVisible: false,
|
openObj: {}, // 打开弹窗的数据
|
};
|
},
|
created() {
|
this.apiInterface = api.getStockSubscribeList; // 赋值接口
|
this.init(); // 获取列表
|
},
|
methods: {
|
// 打开购买弹窗
|
buyOpen(i) {
|
this.$confirm("", this.$t("操作确认"), {
|
confirmButtonText: this.$t("qr"),
|
cancelButtonText: this.$t("qx"),
|
})
|
.then(async () => {
|
// 申购
|
let opt = {
|
newCode: i.code,
|
applyNums: i.orderNumber,
|
password: i.password,
|
newlistId: i.newlistId,
|
type: i.type,
|
};
|
let data = await api.getNewAdd(opt);
|
|
if (data.status == 0) {
|
this.$message.success(data.msg);
|
this.init(); // 重新获取列表
|
}
|
})
|
.catch(() => {});
|
},
|
},
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
.ipo {
|
.box_content {
|
padding: 16px 0;
|
.content_item {
|
border: 1px solid #f1f1f1;
|
border-radius: 16px;
|
padding: 10px;
|
margin: 16px 0;
|
background-color: #f7f7f7;
|
font-size: 14px;
|
|
.item_head {
|
font-size: 16px;
|
margin-bottom: 20px;
|
}
|
.item_label {
|
padding-bottom: 16px;
|
.label_1 {
|
color: #777;
|
margin-right: 16px;
|
}
|
.label_2 {
|
font-size: 16px;
|
color: #222;
|
}
|
}
|
}
|
}
|
.box_head {
|
background-color: #f5f5f5;
|
|
.head_content {
|
padding: 32px 0;
|
|
.head_left {
|
font-size: 28px;
|
font-weight: 700;
|
|
img {
|
width: 32px;
|
height: 32px;
|
margin-right: 8px;
|
}
|
}
|
}
|
}
|
}
|
</style>
|
