<!-- -->
|
<template>
|
<div style="height: 100%">
|
<van-nav-bar
|
:placeholder="true"
|
:safe-area-inset-top="true"
|
:title="$t('订单详情')"
|
left-arrow
|
:fixed="true"
|
@click-left="handleBack"
|
>
|
</van-nav-bar>
|
|
<div class="bottomIfr">
|
<div class="pagebox" @click="toDetails">
|
<div class="pagebox_left">
|
<span class="i_icon">{{ pages.stockGid }}</span>
|
<span class="i_hint">{{ pages.stockSpell }}</span>
|
</div>
|
<div class="pagebox_right">
|
<van-icon name="arrow" size="1.2em" />
|
</div>
|
</div>
|
<div class="pagebox">
|
<div class="pagebox_left">{{ $t("盈虧") }}</div>
|
<div class="pagebox_right">
|
{{ pages.stockGid | currencySymbol }}
|
{{ pages.profitAndLose | _toString }}
|
</div>
|
</div>
|
<div class="pagebox">
|
<div class="pagebox_left">{{ $t("hj141") }}</div>
|
<div class="pagebox_right">
|
{{ pages.stockGid | currencySymbol }} {{ pages.profitAndLoseParent }}
|
</div>
|
</div>
|
<div class="pagebox">
|
<div class="pagebox_left">{{ $t("倉位(股)") }}</div>
|
<div class="pagebox_right">{{ pages.orderNum }}</div>
|
</div>
|
<div class="pagebox" v-if="pages.now_price">
|
<div class="pagebox_left">{{ $t("hj40") }}</div>
|
<div class="pagebox_right">
|
{{ pages.stockGid | currencySymbol }}
|
{{ pages.now_price | _toString }}
|
</div>
|
</div>
|
<div class="pagebox">
|
<div class="pagebox_left">
|
{{ $t("持倉價") }}
|
</div>
|
<div class="pagebox_right">
|
{{ pages.stockGid | currencySymbol }}
|
{{ pages.buyOrderPrice | _toString }}
|
</div>
|
</div>
|
<div class="pagebox">
|
<div class="pagebox_left">
|
{{ $t("訂單金額") }}
|
</div>
|
<div class="pagebox_right">
|
{{ pages.stockGid | currencySymbol }}
|
{{ pages.orderTotalPrice | _toString }}
|
</div>
|
</div>
|
<div class="pagebox">
|
<div class="pagebox_left">{{ $t("hj44") }}</div>
|
<div class="pagebox_right">
|
{{ pages.stockGid | currencySymbol }} {{ pages.orderFee | _toString }}
|
</div>
|
</div>
|
<div class="pagebox">
|
<div class="pagebox_left">
|
{{ $t("訂單編號") }}
|
</div>
|
<div class="pagebox_right">{{ pages.buyOrderId }}</div>
|
</div>
|
<div class="pagebox" v-if="pages.buyOrderTime">
|
<div class="pagebox_left">{{ $t("持倉時間") }}</div>
|
<div class="pagebox_right">
|
{{ $moment(pages.buyOrderTime).format("DD-MM-YYYY hh:mm:ss A") }}
|
</div>
|
</div>
|
<div class="pagebox" v-if="pages.sellOrderTime">
|
<div class="pagebox_left">{{ $t("hj128") }}</div>
|
<div class="pagebox_right">
|
{{ $moment(pages.sellOrderTime).format("DD-MM-YYYY hh:mm:ss A") }}
|
</div>
|
</div>
|
<div class="buttonbox flex-center" v-show="!pages.sellOrderTime">
|
<van-button type="primary" @click="close"> {{ $t("平仓") }}</van-button>
|
</div>
|
|
<Dialog ref="closeDialog" :title="$t('确认平仓')" :confirm="confirm">
|
<template v-slot:center>
|
<div>
|
<div class="hang">
|
<div class="left">{{ $t("hj39") }}</div>
|
<div class="right">{{ pages.stockName }}</div>
|
</div>
|
<div class="hang">
|
<div class="left">{{ $t("買漲/買跌") }}</div>
|
<div class="right">{{ $t(pages.orderDirection) }}</div>
|
</div>
|
<div class="hang">
|
<div class="left">{{ $t("倉位(股)") }}</div>
|
<input
|
class="input_box"
|
type="number"
|
:max="pages.orderNum"
|
:placeholder="$t('hj262')"
|
v-model="ordernum"
|
/>
|
</div>
|
<div class="hang">
|
<div class="left">{{ $t("類型") }}</div>
|
<div class="right">{{ $t("市價") }}</div>
|
</div>
|
</div>
|
</template>
|
</Dialog>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import Dialog from "@/components/Dialog";
|
import * as api from "@/axios/api";
|
import { Notify } from "vant";
|
export default {
|
components: { Dialog },
|
data() {
|
return {
|
pages: {},
|
ordernum: ""
|
};
|
},
|
// 生命周期 - 创建完成（访问当前this实例）
|
created() {
|
this.getInfoSite();
|
},
|
// 生命周期 - 挂载完成（访问DOM元素）
|
mounted() {},
|
methods: {
|
handleBack() {
|
// 点击返回/
|
this.$router.go(-1);
|
},
|
async getInfoSite() {
|
var res = {
|
positionSn: this.$route.query.codes
|
};
|
let data = await api.findByPostionSn(res);
|
if (data.status === 0) {
|
this.pages = data.data;
|
}
|
},
|
// 点击进入详情
|
toDetails() {
|
const obj = {
|
pid: this.pages.stockCode || "",
|
type: this.pages.stockGid || ""
|
};
|
window.localStorage.setItem("kLine", JSON.stringify(obj));
|
|
this.$router.push({
|
path: "/kline",
|
query: {
|
code: this.pages.stockCode,
|
type: this.pages.stockGid
|
}
|
});
|
},
|
// 打开平仓弹窗
|
close() {
|
this.$refs.closeDialog.show = true;
|
this.ordernum = "";
|
},
|
// 平仓
|
async confirm() {
|
this.$refs.closeDialog.show = false;
|
const res = await api.sell({
|
positionSn: this.pages.positionSn,
|
number: this.ordernum
|
});
|
if (res.status === 0) {
|
this.finished = false;
|
Notify({ type: "success", message: res.msg });
|
this.$router.go(-1);
|
} else {
|
Notify({ type: "danger", message: res.msg });
|
}
|
}
|
}
|
};
|
</script>
|
<style scoped lang="less">
|
@dark_green: #07c160;
|
@green: #c4d600;
|
/deep/ .van-nav-bar__content {
|
height: 65px;
|
}
|
/deep/ .van-nav-bar__title {
|
font-family: "DINPro";
|
width: 100%;
|
height: 1.17333rem;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
font-style: normal;
|
font-weight: 500;
|
font-size: 0.48rem;
|
color: #14181f;
|
}
|
.bottomIfr {
|
// position: absolute;
|
// top: 1.5rem;
|
// left: 0;
|
// right: 0;
|
// bottom: 0;
|
width: 100vw;
|
height: calc(100% - 65px);
|
// height:;
|
background-color: #fff !important;
|
font-size: 10vw;
|
|
.buttonbox {
|
padding-top: 1.2em;
|
|
/deep/ .van-button--primary {
|
background-color: @green;
|
border-color: @green;
|
font-size: 0.4em;
|
}
|
}
|
}
|
.pagebox {
|
margin: 0 0.6em;
|
height: 3.2em;
|
font-size: 0.4em;
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
border-bottom: 1px solid #ddd;
|
|
.i_icon {
|
border-radius: 0 26em 26em 0;
|
background: @dark_green;
|
color: #fff;
|
padding: 0.1em 0.5em 0.1em 0.4em;
|
margin-right: 0.3em;
|
font-size: 0.8em;
|
}
|
|
.i_name {
|
margin-top: 0.2em;
|
// color: #777777;
|
font-size: 0.9em;
|
}
|
.pagebox_right {
|
color: #969799;
|
}
|
}
|
|
.hang {
|
display: flex;
|
justify-content: space-between;
|
.left {
|
font-style: normal;
|
font-weight: 500;
|
font-size: 0.34667rem;
|
color: #8c9fad;
|
}
|
.right {
|
font-style: normal;
|
font-weight: 500;
|
font-size: 0.34667rem;
|
color: #14181f;
|
text-align: right;
|
}
|
}
|
.conentIfr {
|
width: 100%;
|
height: 90%;
|
border: none;
|
//取消滚动条
|
overflow: hidden;
|
}
|
</style>
|
