|
|
|
@ -1,5 +1,5 @@ |
|
|
|
<template> |
|
|
|
<div class="markets-pair-list exchange-store bg-plain ex-s-p-c"> |
|
|
|
<div class="markets-pair-list exchange-store bg-plain"> |
|
|
|
<div class="nav nav-pills" style="align-items: center;width:180px;" v-if="0"> |
|
|
|
<div class="nav-item" :class="{ active: tab == 1 }"> |
|
|
|
<a class="nav-link" :class="{ active: tab == 1 }" @click="tab = 1">{{ |
|
|
|
@ -43,13 +43,21 @@ |
|
|
|
</el-popover> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="content-box"> |
|
|
|
<div class="nav-item" :class="{ active: tab == 1 }" style="flex-shrink:0;"> |
|
|
|
<a class="nav-link" :class="{ active: tab == 1 }" @click="tab = 1">{{ |
|
|
|
$t("contract.d5") |
|
|
|
}}</a> |
|
|
|
<div class="nav nav-pills"> |
|
|
|
<div class="nav-item" :class="{ active: form.type == 2 }" @click="form.type = 2"> |
|
|
|
<a style="display:block;padding:5px 0px;"> |
|
|
|
{{ $t("contract.d9") }} |
|
|
|
</a> |
|
|
|
</div> |
|
|
|
<div class="nav-item" :class="{ active: form.type == 1 }" @click="form.type = 1"> |
|
|
|
<a style="display:block;padding:5px 0px;"> |
|
|
|
{{ $t("contract.e0") }} |
|
|
|
</a> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="d-flex align-items-center" style="flex-shrink:0;"> |
|
|
|
<div class="d-flex align-items-center" style="flex-shrink:0;margin-left:20px;"> |
|
|
|
<el-popover |
|
|
|
placement="bottom" |
|
|
|
width="100" |
|
|
|
@ -80,134 +88,112 @@ |
|
|
|
</div> |
|
|
|
</el-popover> |
|
|
|
</div> |
|
|
|
<div class="line-A"></div> |
|
|
|
<div v-if="type == 2" class="input-group my-4 input-group-sm"> |
|
|
|
<div class="input-group-prepend"> |
|
|
|
<span class="input-group-text">{{ $t("contract.d7") }}</span> |
|
|
|
</div> |
|
|
|
<input type="number" class="form-control" placeholder="" /> |
|
|
|
<div class="input-group-append"> |
|
|
|
<span class="input-group-text">USDT</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div> |
|
|
|
<div class="" style="color: #666;"> |
|
|
|
<div class="nav nav-pills"> |
|
|
|
<div class="nav-item" :class="{ active: form.type == 1 }" @click="form.type = 1"> |
|
|
|
<a style="display:block;padding:5px 0px;margin:0 15px 0 0;"> |
|
|
|
{{ $t("contract.e0") }} |
|
|
|
</a> |
|
|
|
</div> |
|
|
|
<div class="nav-item" :class="{ active: form.type == 2 }" @click="form.type = 2"> |
|
|
|
<a style="display:block;padding:5px 0px;margin:0 15px 0 0;"> |
|
|
|
{{ $t("contract.d9") }} |
|
|
|
</a> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="" style="color: #666;white-space: nowrap;margin: 0px 0px 10px 0px;"> |
|
|
|
<span style="margin-right: 10px;">{{ $t("contract.a3") }}</span> |
|
|
|
<span> {{ accountInfo.usable_balance }} USDT |
|
|
|
</div> |
|
|
|
<div class="ex-s-p-c"> |
|
|
|
<!-- 买入 --> |
|
|
|
<div style="width:47%;"> |
|
|
|
<div class="usable-box-A"> |
|
|
|
<span>{{ $t("contract.a3") }}</span> |
|
|
|
<span style="color: #444;"> {{ accountInfo.usable_balance }} USDT |
|
|
|
<i |
|
|
|
class="el-icon-sort" |
|
|
|
@click="$router.push('/wallet/assets/exchange')" |
|
|
|
></i> |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="line-A"></div> |
|
|
|
<div class="d-flex align-items-center px-2"> |
|
|
|
<div class="input-group-a"> |
|
|
|
<div class="input-group-append"> |
|
|
|
<span class="input-group-text">{{ $t("contract.d8") }}</span> |
|
|
|
</div> |
|
|
|
<template v-if="form.type == 1"> |
|
|
|
<div class="form-control-A">{{ $t('contract.d8') }}</div> |
|
|
|
<input |
|
|
|
type="number" |
|
|
|
v-model="form.entrust_price" |
|
|
|
v-model="form.entrust_price_buy" |
|
|
|
class="form-control" |
|
|
|
placeholder="" |
|
|
|
:placeholder="$t('contract.d8')" |
|
|
|
/> |
|
|
|
<div class="input-group-append"> |
|
|
|
<span class="input-group-text">USDT</span> |
|
|
|
</div> |
|
|
|
<div class="form-control-B">USDT</div> |
|
|
|
</template> |
|
|
|
<template v-if="form.type == 2"> |
|
|
|
<div class="form-control-A">{{ $t('contract.d8') }}</div> |
|
|
|
<input |
|
|
|
type="text" |
|
|
|
disabled |
|
|
|
:value="$t('contract.d9')" |
|
|
|
class="form-control" |
|
|
|
:placeholder="$t('contract.d9')" |
|
|
|
placeholder="" |
|
|
|
/> |
|
|
|
</template> |
|
|
|
</div> |
|
|
|
<!-- <button |
|
|
|
@click="form.type == 1 ? (form.type = 2) : (form.type = 1)" |
|
|
|
class="btn btn-sm btn-outline-primary ml-2 text-nowrap" |
|
|
|
> |
|
|
|
{{ form.type == 1 ? $t("contract.e0") : $t("contract.d9") }} |
|
|
|
</button> --> |
|
|
|
</div> |
|
|
|
<div class="input-group-a align-items-center"> |
|
|
|
<div class=""> |
|
|
|
<!-- <span class="input-group-text">{{ $t("contract.e1") }}</span> --> |
|
|
|
<span class="input-group-text">{{ $t("contract.l2") }}</span> |
|
|
|
</div> |
|
|
|
|
|
|
|
<input |
|
|
|
type="number" |
|
|
|
class="form-control" |
|
|
|
v-model="margin" |
|
|
|
:placeholder="tips" |
|
|
|
/> |
|
|
|
<!-- <div class="input-group-append"> |
|
|
|
<span class="input-group-text">{{ $t("contract.e2") }}</span> |
|
|
|
</div> --> |
|
|
|
</div> |
|
|
|
<div class="line-A"></div> |
|
|
|
<div style="width:200px;margin:0px 12px;"> |
|
|
|
<div class="px-2" v-if="this.tab == 1"> |
|
|
|
<el-slider |
|
|
|
:value="activeStep" |
|
|
|
@input="sliderChange" |
|
|
|
:format-tooltip="tooltip" |
|
|
|
:marks="marks" |
|
|
|
></el-slider> |
|
|
|
<!-- :step="25" --> |
|
|
|
<div class="input-group-a"> |
|
|
|
<div class="form-control-A">{{ $t("contract.l2") }}</div> |
|
|
|
<input |
|
|
|
type="number" |
|
|
|
class="form-control" |
|
|
|
v-model="margin_buy" |
|
|
|
:placeholder="tips" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<!-- 开仓 --> |
|
|
|
<div v-if="tab == 1" class="kaicang"> |
|
|
|
<div class="d-flex justify-content-between mb-3" style="color: #999;"> |
|
|
|
<div>{{ $t("contract.e1") }}：</div> |
|
|
|
<!-- {{$t("contract.e2")}} --> |
|
|
|
<div>{{ amount }}</div> |
|
|
|
<div> |
|
|
|
<div class="px-2" v-if="this.tab == 1"> |
|
|
|
<el-slider |
|
|
|
:value="activeStep_buy" |
|
|
|
@input="sliderChange($event, 'buy')" |
|
|
|
:format-tooltip="tooltip" |
|
|
|
:marks="marks" |
|
|
|
></el-slider> |
|
|
|
<!-- :step="25" --> |
|
|
|
</div> |
|
|
|
<!-- <div class="d-flex justify-content-between mb-4"> |
|
|
|
<div>{{ $t("contract.a3") }}:</div> |
|
|
|
<div> |
|
|
|
{{ accountInfo.usable_balance }} USDT |
|
|
|
<i |
|
|
|
class="el-icon-sort" |
|
|
|
@click="$router.push('/wallet/assets/exchange')" |
|
|
|
></i> |
|
|
|
<!-- 开仓 --> |
|
|
|
<div v-if="tab == 1" class="kaicang"> |
|
|
|
<div class="d-flex justify-content-between mb-3" style="color: #999;"> |
|
|
|
<div>{{ $t("contract.e1") }}：</div> |
|
|
|
<!-- {{$t("contract.e2")}} --> |
|
|
|
<div>{{ amount_buy }}</div> |
|
|
|
</div> |
|
|
|
</div> --> |
|
|
|
<!-- <div class="d-flex justify-content-between mb-4"> |
|
|
|
<div>{{ $t("contract.a3") }}:</div> |
|
|
|
<div> |
|
|
|
{{ accountInfo.usable_balance }} USDT |
|
|
|
<i |
|
|
|
class="el-icon-sort" |
|
|
|
@click="$router.push('/wallet/assets/exchange')" |
|
|
|
></i> |
|
|
|
</div> |
|
|
|
</div> --> |
|
|
|
</div> |
|
|
|
<!-- 平仓 --> |
|
|
|
<div v-if="tab == 2"> |
|
|
|
<div class="d-flex justify-content-between"> |
|
|
|
<div>{{ $t("contract.e4") }}：</div> |
|
|
|
<div>{{ multiplePositions }} {{ $t("contract.e2") }}</div> |
|
|
|
</div> |
|
|
|
<div class="d-flex justify-content-between mb-4"> |
|
|
|
<div>{{ $t("contract.e5") }}:</div> |
|
|
|
<div>{{ shortPosition }} {{ $t("contract.e2") }}</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<!-- 平仓 --> |
|
|
|
<div v-if="tab == 2"> |
|
|
|
<div class="d-flex justify-content-between"> |
|
|
|
<div>{{ $t("contract.e4") }}：</div> |
|
|
|
<div>{{ multiplePositions }} {{ $t("contract.e2") }}</div> |
|
|
|
<div class="d-flex justify-content-between"> |
|
|
|
<div class="input-group-a" style="width:49%;"> |
|
|
|
<input |
|
|
|
type="number" |
|
|
|
class="form-control" |
|
|
|
v-model="form.sl_trigger_price_buy" |
|
|
|
:placeholder="$t('contract.i7')" |
|
|
|
style="text-align:left;" |
|
|
|
/> |
|
|
|
<div class="form-control-B">USDT</div> |
|
|
|
</div> |
|
|
|
<div class="d-flex justify-content-between mb-4"> |
|
|
|
<div>{{ $t("contract.e5") }}:</div> |
|
|
|
<div>{{ shortPosition }} {{ $t("contract.e2") }}</div> |
|
|
|
<div class="input-group-a" style="width:49%;"> |
|
|
|
<input |
|
|
|
type="number" |
|
|
|
class="form-control" |
|
|
|
v-model="form.tp_trigger_price_buy" |
|
|
|
:placeholder="$t('contract.i8')" |
|
|
|
style="text-align:left;" |
|
|
|
/> |
|
|
|
<div class="form-control-B">USDT</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="line-A"></div> |
|
|
|
<div class="exchange_button" v-if="tab == 1" style="color: #999;"> |
|
|
|
<div class="px-2 flex-fill"> |
|
|
|
<button |
|
|
|
@click="ifOpenPosition(1)" |
|
|
|
@ -217,11 +203,116 @@ |
|
|
|
{{ $t("contract.d0") }} |
|
|
|
<!-- <span class="fn-12"> （{{ $t("contract.e6") }}） </span> --> |
|
|
|
</button> |
|
|
|
<div class="text-left" style="white-space: nowrap;"> |
|
|
|
<div class="text-left" style="white-space: nowrap; color: #999;"> |
|
|
|
{{ $t("contract.e7") }} {{ maxNum }} |
|
|
|
<!-- {{ $t("contract.e2") }} --> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<!-- 卖出 --> |
|
|
|
<div style="width:47%;"> |
|
|
|
<div class="usable-box-A"> |
|
|
|
<span>{{ $t("contract.a3") }}</span> |
|
|
|
<span style="color: #444;"> {{ accountInfo.usable_balance }} USDT |
|
|
|
<i |
|
|
|
class="el-icon-sort" |
|
|
|
@click="$router.push('/wallet/assets/exchange')" |
|
|
|
></i> |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
<div class="input-group-a"> |
|
|
|
<template v-if="form.type == 1"> |
|
|
|
<div class="form-control-A">{{ $t('contract.d8') }}</div> |
|
|
|
<input |
|
|
|
type="number" |
|
|
|
v-model="form.entrust_price_sell" |
|
|
|
class="form-control" |
|
|
|
:placeholder="$t('contract.d8')" |
|
|
|
/> |
|
|
|
<div class="form-control-B">USDT</div> |
|
|
|
</template> |
|
|
|
<template v-if="form.type == 2"> |
|
|
|
<div class="form-control-A">{{ $t('contract.d8') }}</div> |
|
|
|
<input |
|
|
|
type="text" |
|
|
|
disabled |
|
|
|
:value="$t('contract.d9')" |
|
|
|
class="form-control" |
|
|
|
placeholder="" |
|
|
|
/> |
|
|
|
</template> |
|
|
|
</div> |
|
|
|
<div class="input-group-a"> |
|
|
|
<div class="form-control-A">{{ $t("contract.l2") }}</div> |
|
|
|
<input |
|
|
|
type="number" |
|
|
|
class="form-control" |
|
|
|
v-model="margin_sell" |
|
|
|
:placeholder="tips" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<div> |
|
|
|
<div class="px-2" v-if="this.tab == 1"> |
|
|
|
<el-slider |
|
|
|
:value="activeStep_sell" |
|
|
|
@input="sliderChange($event, 'sell')" |
|
|
|
:format-tooltip="tooltip" |
|
|
|
:marks="marks" |
|
|
|
></el-slider> |
|
|
|
<!-- :step="25" --> |
|
|
|
</div> |
|
|
|
<!-- 开仓 --> |
|
|
|
<div v-if="tab == 1" class="kaicang"> |
|
|
|
<div class="d-flex justify-content-between mb-3" style="color: #999;"> |
|
|
|
<div>{{ $t("contract.e1") }}：</div> |
|
|
|
<!-- {{$t("contract.e2")}} --> |
|
|
|
<div>{{ amount_sell }}</div> |
|
|
|
</div> |
|
|
|
<!-- <div class="d-flex justify-content-between mb-4"> |
|
|
|
<div>{{ $t("contract.a3") }}:</div> |
|
|
|
<div> |
|
|
|
{{ accountInfo.usable_balance }} USDT |
|
|
|
<i |
|
|
|
class="el-icon-sort" |
|
|
|
@click="$router.push('/wallet/assets/exchange')" |
|
|
|
></i> |
|
|
|
</div> |
|
|
|
</div> --> |
|
|
|
</div> |
|
|
|
<!-- 平仓 --> |
|
|
|
<div v-if="tab == 2"> |
|
|
|
<div class="d-flex justify-content-between"> |
|
|
|
<div>{{ $t("contract.e4") }}：</div> |
|
|
|
<div>{{ multiplePositions }} {{ $t("contract.e2") }}</div> |
|
|
|
</div> |
|
|
|
<div class="d-flex justify-content-between mb-4"> |
|
|
|
<div>{{ $t("contract.e5") }}:</div> |
|
|
|
<div>{{ shortPosition }} {{ $t("contract.e2") }}</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="d-flex justify-content-between"> |
|
|
|
<div class="input-group-a" style="width:49%;"> |
|
|
|
<input |
|
|
|
type="number" |
|
|
|
class="form-control" |
|
|
|
v-model="form.sl_trigger_price_sell" |
|
|
|
:placeholder="$t('contract.i7')" |
|
|
|
style="text-align:left;" |
|
|
|
/> |
|
|
|
<div class="form-control-B">USDT</div> |
|
|
|
</div> |
|
|
|
<div class="input-group-a" style="width:49%;"> |
|
|
|
<input |
|
|
|
type="number" |
|
|
|
class="form-control" |
|
|
|
v-model="form.tp_trigger_price_sell" |
|
|
|
:placeholder="$t('contract.i8')" |
|
|
|
style="text-align:left;" |
|
|
|
/> |
|
|
|
<div class="form-control-B">USDT</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="px-2 flex-fill"> |
|
|
|
<button |
|
|
|
@click="ifOpenPosition(2)" |
|
|
|
@ -232,12 +323,39 @@ |
|
|
|
<!-- <span class="fn-12"> （{{ $t("contract.e8") }}） </span> --> |
|
|
|
</button> |
|
|
|
<!-- <div class="text-center"> --> |
|
|
|
<div class="text-right" style="white-space: nowrap;"> |
|
|
|
<div class="text-left" style="white-space: nowrap; color: #999;"> |
|
|
|
{{ $t("contract.e7") }} {{ maxNum }} |
|
|
|
<!-- {{ $t("contract.e2") }} --> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="content-box" v-if="0"> |
|
|
|
|
|
|
|
<div class="line-A"></div> |
|
|
|
<div v-if="type == 2" class="input-group my-4 input-group-sm"> |
|
|
|
<div class="input-group-prepend"> |
|
|
|
<span class="input-group-text">{{ $t("contract.d7") }}</span> |
|
|
|
</div> |
|
|
|
<input type="number" class="form-control" placeholder="" /> |
|
|
|
<div class="input-group-append"> |
|
|
|
<span class="input-group-text">USDT</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div> |
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
|
<div class="line-A"></div> |
|
|
|
|
|
|
|
<div class="line-A"></div> |
|
|
|
|
|
|
|
<div class="line-A"></div> |
|
|
|
<div class="exchange_button" v-if="tab == 1" style="color: #999;"> |
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
|
<div class="" v-if="tab == 2"> |
|
|
|
<div class="px-2 flex-fill mb-4"> |
|
|
|
<button |
|
|
|
@ -281,8 +399,16 @@ export default { |
|
|
|
// 1:限价 2:市价 |
|
|
|
type: 2, |
|
|
|
entrust_price: undefined, |
|
|
|
entrust_price_buy: undefined, |
|
|
|
entrust_price_sell: undefined, |
|
|
|
amount:"", |
|
|
|
lever_rate: "" |
|
|
|
amount_buy:"", |
|
|
|
amount_sell:"", |
|
|
|
lever_rate: "", |
|
|
|
sl_trigger_price_sell:'',//止盈 |
|
|
|
sl_trigger_price_buy:'',//止盈 |
|
|
|
tp_trigger_price_sell:'',//止损 |
|
|
|
tp_trigger_price_buy:'',//止损 |
|
|
|
}, |
|
|
|
// 最多可开张数 |
|
|
|
maxNum: 0, |
|
|
|
@ -296,6 +422,8 @@ export default { |
|
|
|
75:'' |
|
|
|
}, |
|
|
|
margin:0, |
|
|
|
margin_buy:0, |
|
|
|
margin_sell:0, |
|
|
|
}; |
|
|
|
}, |
|
|
|
props: { |
|
|
|
@ -324,15 +452,22 @@ export default { |
|
|
|
watch: { |
|
|
|
symbol() { |
|
|
|
this.form.entrust_price = undefined; |
|
|
|
this.form.entrust_price_sell = undefined; |
|
|
|
this.form.entrust_price_buy = undefined; |
|
|
|
this.contractAccount(); |
|
|
|
this.getSymbolDetail(); |
|
|
|
}, |
|
|
|
defaultPrice(n) { |
|
|
|
this.form.entrust_price = n; |
|
|
|
this.form.entrust_price_sell = n; |
|
|
|
this.form.entrust_price_buy = n; |
|
|
|
}, |
|
|
|
newPriceObj(n) { |
|
|
|
if (n && this.form.entrust_price === undefined) { |
|
|
|
this.form.entrust_price = n.price; |
|
|
|
if (n && this.form.entrust_price_sell === undefined) { |
|
|
|
this.form.entrust_price_sell = n.price; |
|
|
|
} |
|
|
|
if (n && this.form.entrust_price_buy === undefined) { |
|
|
|
this.form.entrust_price_buy = n.price; |
|
|
|
} |
|
|
|
}, |
|
|
|
contractOpen(n, o) { |
|
|
|
@ -390,9 +525,14 @@ export default { |
|
|
|
if (!item) return 0; |
|
|
|
return item.avail_position; |
|
|
|
}, |
|
|
|
activeStep() { |
|
|
|
if (!this.form.amount || !this.maxNum) return 0; |
|
|
|
let num = (this.form.amount / this.maxNum) * 100; |
|
|
|
activeStep_buy() { |
|
|
|
if (!this.form.amount_buy || !this.maxNum) return 0; |
|
|
|
let num = (this.form.amount_buy / this.maxNum) * 100; |
|
|
|
return num; |
|
|
|
}, |
|
|
|
activeStep_sell() { |
|
|
|
if (!this.form.amount_sell || !this.maxNum) return 0; |
|
|
|
let num = (this.form.amount_sell / this.maxNum) * 100; |
|
|
|
return num; |
|
|
|
}, |
|
|
|
// 保证金 |
|
|
|
@ -400,13 +540,22 @@ export default { |
|
|
|
// if (!this.form.lever_rate) return ''; |
|
|
|
// return math.omitTo(this.form.amount*this.unit_amount / this.form.lever_rate, 4); |
|
|
|
// }, |
|
|
|
amount(){ |
|
|
|
amount_buy(){ |
|
|
|
console.info(this.form.lever_rate) |
|
|
|
console.info(this.margin) |
|
|
|
if (!this.form.lever_rate || !this.margin) return 0; |
|
|
|
let p=this.margin*this.form.lever_rate; |
|
|
|
console.info(this.margin_buy) |
|
|
|
if (!this.form.lever_rate || !this.margin_buy) return 0; |
|
|
|
let p=this.margin_buy*this.form.lever_rate; |
|
|
|
|
|
|
|
this.form.amount=p; |
|
|
|
this.form.amount_buy=p; |
|
|
|
return p |
|
|
|
}, |
|
|
|
amount_sell(){ |
|
|
|
console.info(this.form.lever_rate) |
|
|
|
console.info(this.margin_sell) |
|
|
|
if (!this.form.lever_rate || !this.margin_sell) return 0; |
|
|
|
let p=this.margin_sell*this.form.lever_rate; |
|
|
|
|
|
|
|
this.form.amount_sell=p; |
|
|
|
return p |
|
|
|
} |
|
|
|
}, |
|
|
|
@ -455,10 +604,17 @@ export default { |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 设置数量 |
|
|
|
sliderChange($ev) { |
|
|
|
this.form.amount = Math.round((this.maxNum * $ev) / 100)||''; |
|
|
|
console.info(this.form) |
|
|
|
this.margin=this.form.amount/this.form.lever_rate || 0 |
|
|
|
sliderChange($ev, operate) { |
|
|
|
|
|
|
|
if(operate=='sell'){ |
|
|
|
this.form.amount_sell = Math.round((this.maxNum * $ev) / 100)||''; |
|
|
|
console.info(this.form) |
|
|
|
this.margin_sell=this.form.amount_sell/this.form.lever_rate || 0 |
|
|
|
}else if (operate == 'buy'){ |
|
|
|
this.form.amount_buy = Math.round((this.maxNum * $ev) / 100)||''; |
|
|
|
console.info(this.form) |
|
|
|
this.margin_buy=this.form.amount_buy/this.form.lever_rate || 0 |
|
|
|
} |
|
|
|
}, |
|
|
|
// 选择杠杆 |
|
|
|
selectLever(idx) { |
|
|
|
@ -508,21 +664,56 @@ export default { |
|
|
|
}, |
|
|
|
// 开仓 |
|
|
|
openPosition(side) { |
|
|
|
// side ,1--buy,2--sell |
|
|
|
let data = { |
|
|
|
side, |
|
|
|
symbol: this.symbol, |
|
|
|
...this.form |
|
|
|
// side, |
|
|
|
// symbol: this.symbol, |
|
|
|
// ...this.form |
|
|
|
}; |
|
|
|
if(side==1){ |
|
|
|
data = { |
|
|
|
amount: this.form.amount_buy, |
|
|
|
entrust_price: this.form.entrust_price_buy, |
|
|
|
lever_rate: this.form.lever_rate, |
|
|
|
side: 1, |
|
|
|
symbol: this.symbol, |
|
|
|
type: this.form.type, |
|
|
|
sl_trigger_price: this.form.sl_trigger_price_buy,//止盈 |
|
|
|
tp_trigger_price: this.form.tp_trigger_price_buy,//止损 |
|
|
|
} |
|
|
|
}else if(side==2){ |
|
|
|
data = { |
|
|
|
amount: this.form.amount_sell, |
|
|
|
entrust_price: this.form.entrust_price_sell, |
|
|
|
lever_rate: this.form.lever_rate, |
|
|
|
side: 2, |
|
|
|
symbol: this.symbol, |
|
|
|
type: this.form.type, |
|
|
|
sl_trigger_price: this.form.sl_trigger_price_sell,//止盈 |
|
|
|
tp_trigger_price: this.form.tp_trigger_price_sell,//止损 |
|
|
|
} |
|
|
|
} |
|
|
|
if(this.form.type==2){ |
|
|
|
// data.entrust_price = this.margin; |
|
|
|
data.entrust_price = this.newPriceObj.price; |
|
|
|
data.amount = this.amount; |
|
|
|
if(side==1){ |
|
|
|
data.amount = this.amount_buy; |
|
|
|
}else if(side==2){ |
|
|
|
data.amount = this.amount_sell; |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
console.log(this.margin, '保证金') |
|
|
|
console.log(data, 111111, this.newPriceObj.price); |
|
|
|
Contract.openPosition(data).then(() => { |
|
|
|
this.contractAccount(); |
|
|
|
this.form.amount = 0; |
|
|
|
this.form.amount_buy = 0; |
|
|
|
this.form.amount_sell = 0; |
|
|
|
this.form.sl_trigger_price_sell = 0;//止盈 |
|
|
|
this.form.sl_trigger_price_buy = 0;//止盈 |
|
|
|
this.form.tp_trigger_price_sell = 0;//止损 |
|
|
|
this.form.tp_trigger_price_buy = 0; |
|
|
|
this.$message.success(this.$t("contract.f5")); |
|
|
|
this.$emit("position"); |
|
|
|
}); |
|
|
|
@ -557,26 +748,76 @@ export default { |
|
|
|
/* /deep/ .el-slider__stop{ |
|
|
|
background-color: ; |
|
|
|
} */ |
|
|
|
.markets-pair-list .nav-item.active a{ |
|
|
|
color: #F7D558 !important; |
|
|
|
.markets-pair-list{ |
|
|
|
padding: 5px 12px; |
|
|
|
} |
|
|
|
.content-box{ |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
} |
|
|
|
.nav-item{ |
|
|
|
padding: 4px 19px; |
|
|
|
text-align-last: center; |
|
|
|
background-color: #FFF; |
|
|
|
border-radius: 3px; |
|
|
|
margin-right: 10px; |
|
|
|
cursor: pointer; |
|
|
|
} |
|
|
|
.nav-item.active{ |
|
|
|
background-color: #F7D558; |
|
|
|
} |
|
|
|
.nav-item a{ |
|
|
|
color: #333 !important; |
|
|
|
} |
|
|
|
.ex-s-p-c{ |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
align-items: center; |
|
|
|
border-top: 1px solid; |
|
|
|
padding: 10px 0px; |
|
|
|
} |
|
|
|
.ex-s-p-c .content-box{ |
|
|
|
.usable-box-A{ |
|
|
|
color: #666; |
|
|
|
white-space: nowrap; |
|
|
|
margin-bottom: 10px; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: space-between; |
|
|
|
} |
|
|
|
.ex-s-p-c .input-group-a { |
|
|
|
position: relative; |
|
|
|
display: -ms-flexbox; |
|
|
|
display: flex; |
|
|
|
-ms-flex-align: stretch; |
|
|
|
align-items: stretch; |
|
|
|
-ms-flex-align: center; |
|
|
|
align-items: center; |
|
|
|
justify-content: space-between; |
|
|
|
background-color: #fafafa; |
|
|
|
margin-bottom: 10px; |
|
|
|
} |
|
|
|
.form-control{ |
|
|
|
border: none; |
|
|
|
font-size: 14px; |
|
|
|
text-align: right; |
|
|
|
flex: 1; |
|
|
|
color: #000; |
|
|
|
} |
|
|
|
.form-control-A{ |
|
|
|
color: #666; |
|
|
|
text-align: center; |
|
|
|
padding: 0px 10px; |
|
|
|
} |
|
|
|
.form-control-B{ |
|
|
|
color: #000; |
|
|
|
text-align: center; |
|
|
|
padding: 0px 10px; |
|
|
|
} |
|
|
|
.btn-success{ |
|
|
|
background-color: #9ED889; |
|
|
|
background-image: none; |
|
|
|
padding: 10px; |
|
|
|
} |
|
|
|
.btn-danger{ |
|
|
|
background-color: #D5444E; |
|
|
|
background-image: none; |
|
|
|
padding: 10px; |
|
|
|
} |
|
|
|
.line-A{ |
|
|
|
width: 1px; |
|
|
|
|
