|
|
|
@ -1,15 +1,36 @@ |
|
|
|
<template> |
|
|
|
<view class="bg-panel-3"> |
|
|
|
<view class="d-flex p-x-md p-0 fa p-t-md justify-between align-center fn-18 bg-panel-3 color-light flex-wrap"> |
|
|
|
<v-header class="nav-tab" :left-arrow="false" style="background-color: #121212;"> |
|
|
|
<template #left> |
|
|
|
<!-- <van-icon name="user-circle-o" class="fn-25 color-theme-1" style="color: #D0712F;" /> --> |
|
|
|
<image src="@/assets/img/home/top.png" mode="aspectFit" style="width: 36rpx;height: 36rpx;"></image> |
|
|
|
</template> |
|
|
|
<template #title> |
|
|
|
<view style="color: #ffffff; font-size: 30rpx;">{{$t("base.d0")}}</view> |
|
|
|
</template> |
|
|
|
<template #right> |
|
|
|
<view class="per-bot p-y-md p-x-sm d-flex align-center"> |
|
|
|
<!-- <img :src="$localImgUrl('Page6.png')" alt="" class="h-20 m-r-xs" /> --> |
|
|
|
<span class="color-light"> |
|
|
|
<v-lang @change="marketList = []; |
|
|
|
indexData();getHelpList();"></v-lang> |
|
|
|
<i class="iconfont m-l-xs fn-sm"></i> |
|
|
|
</span> |
|
|
|
</view> |
|
|
|
</template> |
|
|
|
</v-header> |
|
|
|
|
|
|
|
<view class="d-flex p-x-md p-0 p-t-md justify-between align-center fn-18 color-light flex-wrap"> |
|
|
|
<view class="w-max" style="height: var(--status-bar-height)"></view> |
|
|
|
<view @click="$emit('symbol')" class="d-flex align-center"> |
|
|
|
<i class="iconfont color-light fn-bold fn-18"></i> |
|
|
|
<!-- <i class="iconfont color-light fn-bold fn-18"></i> --> |
|
|
|
<text class="fn-bold" style="margin-right: 5px;">{{ symbol }}</text> |
|
|
|
{{ $t("first.b8") }} |
|
|
|
<text class="fn-10 m-l-xs p-y-2" |
|
|
|
<i class="iconfont" style="margin-left: 5px;"></i> |
|
|
|
<!-- <text class="fn-10 m-l-xs p-y-2" |
|
|
|
:class="increase.increase < 0 ? 'color-sell bg-sell-transparent' : 'color-buy bg-buy-transparent'"> |
|
|
|
{{increase.increaseStr}} |
|
|
|
</text> |
|
|
|
</text> --> |
|
|
|
</view> |
|
|
|
<view class="d-flex fn-20 color-theme-1"> |
|
|
|
<view class="m-r-xs" @click="$emit('option')"> |
|
|
|
@ -28,7 +49,7 @@ |
|
|
|
<van-icon name="chart-trending-o"/> |
|
|
|
</v-link> |
|
|
|
</view> |
|
|
|
<view class="p-ms bg-form-panel-3 fn-sm m-t-xs rounded-sm d-flex justify-between w-max fn-13"> |
|
|
|
<!-- <view class="p-ms bg-form-panel-3 fn-sm m-t-xs rounded-sm d-flex justify-between w-max fn-13"> |
|
|
|
<view class="item w-33 t-no positions"> |
|
|
|
<view class="label">{{ $t("contract.d4") }}(USDT)</view> |
|
|
|
<view class="num color-light d-flex align-center" style="margin-top:8px;"> |
|
|
|
@ -39,12 +60,12 @@ |
|
|
|
</view> |
|
|
|
<view class="item p-x-xs t-no w-33 fn-center"> |
|
|
|
<view class="label"> |
|
|
|
<!-- {{ $t("contract.d5") }} --> |
|
|
|
{{ $t("contract.d5") }} |
|
|
|
{{ $t("contract.e4") }} |
|
|
|
(USDT) |
|
|
|
</view> |
|
|
|
<view class="num color-light " style="margin-top:8px;"> |
|
|
|
<!-- {{accountInfo.totalUnrealProfit}} --> |
|
|
|
{{accountInfo.totalUnrealProfit}} |
|
|
|
{{accountInfo.usable_balance}} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
@ -58,10 +79,11 @@ |
|
|
|
}} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> --> |
|
|
|
|
|
|
|
</view> |
|
|
|
<view class="w-max" style="height: var(--status-bar-height)"></view> |
|
|
|
<view class="h-120"></view> |
|
|
|
<!-- <view class="h-120"></view> --> |
|
|
|
<scroll-view |
|
|
|
@refresherrefresh="onRefresh" |
|
|
|
:refresher-enabled="refresherEnabled&&scrollTop<50" |
|
|
|
@ -80,7 +102,7 @@ |
|
|
|
<text style="width: 50%;display: inline-block;">平仓</text> |
|
|
|
</view> |
|
|
|
</view> --> |
|
|
|
<view class="d-flex fn-center m-b-ms h-30 color-light"> |
|
|
|
<view class="d-flex fn-center m-b-ms h-30 color-light" style="margin-top: 20px;"> |
|
|
|
<!-- <v-picker |
|
|
|
:list="commissionTypes" |
|
|
|
v-model="form.type" |
|
|
|
@ -91,7 +113,7 @@ |
|
|
|
</text> |
|
|
|
<i class="iconfont"></i> |
|
|
|
</v-picker> --> |
|
|
|
<v-dropdwon class="w-60 m-r-xs bg-form-panel-3 p-y-xxs rounded posi" :list="commissionTypes" |
|
|
|
<v-dropdwon class="w-60 m-r-xs bg-form-panel-3 p-y-xxs posi border_1" :list="commissionTypes" |
|
|
|
@onClick="dropDownChange"> |
|
|
|
</v-dropdwon> |
|
|
|
<!-- <v-picker |
|
|
|
@ -104,7 +126,7 @@ |
|
|
|
<i class="iconfont fn-13"></i> |
|
|
|
</v-picker> --> |
|
|
|
<v-dropdwon v-if="lever_rage.length>0" |
|
|
|
class="w-40 m-r-xs posi bg-form-panel-3 p-y-xxs rounded" :contract="contract" |
|
|
|
class="w-40 m-r-xs posi bg-form-panel-3 p-y-xxs border_1" :contract="contract" |
|
|
|
:list="lever_rage" @onClick="openNum" :leverShow="leverShow"> |
|
|
|
</v-dropdwon> |
|
|
|
</view> |
|
|
|
@ -131,19 +153,26 @@ |
|
|
|
<view> |
|
|
|
<!-- :placeholder="$t('contract.d2')" |
|
|
|
v-model="form.amount" --> |
|
|
|
<v-input |
|
|
|
<!-- <v-input |
|
|
|
v-model="margin" |
|
|
|
:placeholder="$t('contract.d2')" |
|
|
|
@input="sliderActive=-1" |
|
|
|
class="h-30 p-x-sm p-y-xxs rounded bg-form-panel-3" |
|
|
|
> |
|
|
|
<template #right> |
|
|
|
<span class="color-light fn-bold"> |
|
|
|
<!-- {{ $t("contract.d8") }} --> |
|
|
|
USDT |
|
|
|
</span> |
|
|
|
<span class="color-light fn-bold">{{ $t("contract.d8") }}USDT</span> |
|
|
|
</template> |
|
|
|
</v-input> |
|
|
|
</v-input> --> |
|
|
|
<v-input |
|
|
|
v-model="margin" |
|
|
|
@input="sliderActive=-1" |
|
|
|
:placeholder="$t('contract.d2')" style="border: 1px solid #202020;"> |
|
|
|
<template #right> |
|
|
|
<view class="color-light fn-bold" style="margin-right: 10px;"> |
|
|
|
<!-- {{ $t("contract.d8") }} --> |
|
|
|
USDT</view> |
|
|
|
</template> |
|
|
|
</v-input> |
|
|
|
</view> |
|
|
|
<view class="m-b-xs"> |
|
|
|
<view class="m-t-xs"> |
|
|
|
@ -152,11 +181,11 @@ |
|
|
|
<text>100%</text> |
|
|
|
</view> --> |
|
|
|
<view class="d-flex justify-between"> |
|
|
|
<view class="borders w-23 rounded-3 fn-center p-y-xs fn-12" |
|
|
|
<!-- <view class="borders w-23 rounded-3 fn-center p-y-xs fn-12" |
|
|
|
v-for="(item,index) in progress" @click="sliderChange(item,index)" |
|
|
|
:class="sliderActive==index?'color-theme-1 active':''"> |
|
|
|
{{item}}% |
|
|
|
</view> |
|
|
|
</view> --> |
|
|
|
<!-- <bing-progress |
|
|
|
activeColor="#60c08c" |
|
|
|
barBorderRadius="20px" |
|
|
|
@ -172,12 +201,14 @@ |
|
|
|
:value="activeStep" |
|
|
|
/> --> |
|
|
|
</view> |
|
|
|
<!-- <el-slider |
|
|
|
<el-slider |
|
|
|
:value="activeStep" |
|
|
|
@input="sliderChange" |
|
|
|
:step="20" |
|
|
|
:step="25" |
|
|
|
show-stops |
|
|
|
></el-slider> --> |
|
|
|
:marks="marks" |
|
|
|
:show-tooltip="false" |
|
|
|
></el-slider> |
|
|
|
<!-- :format-tooltip="tooltip" --> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
@ -185,12 +216,25 @@ |
|
|
|
<span class="color-default">{{ $t("contract.d9") }}</span> |
|
|
|
<span>{{ margin }}</span> |
|
|
|
</view> --> |
|
|
|
|
|
|
|
<!-- 1111 --> |
|
|
|
<view class="d-flex flex-wrap"> |
|
|
|
<view class="fn-12"> |
|
|
|
<!-- <view class="fn-12"> |
|
|
|
{{$t('first.a3')}} |
|
|
|
<text class="color-theme-1">({{$t('reg.b4')}})</text> |
|
|
|
</view> |
|
|
|
<view class="d-flex justify-between m-y-xs align-center"> |
|
|
|
</view> --> |
|
|
|
<view class="fn-sm m-t-xs d-flex justify-between" style="width: 100%;"> |
|
|
|
<view class="d-flex"> |
|
|
|
{{ $t("common.c3") }} |
|
|
|
<view class="m-l-xs"> |
|
|
|
{{ maxNum }} |
|
|
|
{{ $t("contract.d8") }} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<img :src="$localImgUrl('antOutline.png')" alt="" class="h-18" /> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- <view class="d-flex justify-between m-y-xs align-center"> |
|
|
|
<v-input |
|
|
|
:placeholder="$t('contract.i4')" |
|
|
|
v-model="form.tp_trigger_price" |
|
|
|
@ -203,7 +247,35 @@ |
|
|
|
class="h-30 p-x-ms m-l-xs rounded fn-12 bg-form-panel-3" |
|
|
|
> |
|
|
|
</v-input> |
|
|
|
</view> |
|
|
|
</view> --> |
|
|
|
|
|
|
|
<!-- 止盈/止损 --> |
|
|
|
<view style="margin-top: 10px;"> |
|
|
|
<van-checkbox :value="shows" @change="shows = !shows" checked-color="#fff" shape="square" icon-size="15px"> |
|
|
|
<text class="col-fff m-r-xs" style="font-size: 13px;">{{ $t('contract.i4') }}/{{ $t('contract.i7') }}</text> |
|
|
|
</van-checkbox> |
|
|
|
</view> |
|
|
|
<view style="margin: 10px 0px;" v-if="shows"> |
|
|
|
<v-input |
|
|
|
v-model="form.tp_trigger_price" |
|
|
|
:placeholder="$t('contract.i4')" style="border: 1px solid #202020;"> |
|
|
|
<template #right> |
|
|
|
<view class="fn-bold" style="margin-right: 10px;"> |
|
|
|
<!-- {{ $t("contract.d8") }} --> |
|
|
|
USDT</view> |
|
|
|
</template> |
|
|
|
</v-input> |
|
|
|
|
|
|
|
<v-input |
|
|
|
v-model="form.sl_trigger_price" |
|
|
|
:placeholder="$t('contract.i7')" style="border: 1px solid #202020;margin-top: 5px;"> |
|
|
|
<template #right> |
|
|
|
<view class="fn-bold" style="margin-right: 10px;"> |
|
|
|
<!-- {{ $t("contract.d8") }} --> |
|
|
|
USDT</view> |
|
|
|
</template> |
|
|
|
</v-input> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="m-b-sm m-t-xs"> |
|
|
|
<template v-if="isLogin"> |
|
|
|
@ -214,11 +286,26 @@ |
|
|
|
size="small" |
|
|
|
block |
|
|
|
class="w-max rounded" |
|
|
|
style="background-color: #25A74F;" |
|
|
|
> |
|
|
|
style="background-color: #25A74F;"> |
|
|
|
<span class="but_text">{{ $t("contract.c0") }}</span> |
|
|
|
<!--<span class="fn-10 but_right">{{ $t("contract.e0") }}</span>--> |
|
|
|
<!-- <span class="fn-10 but_right">{{ $t("contract.e0") }}</span> --> |
|
|
|
</v-button> |
|
|
|
<view class="fn-sm m-t-xs d-flex"> |
|
|
|
<view class=""> |
|
|
|
可买 |
|
|
|
</view> |
|
|
|
<view class="" style="margin-left: 10px;"> |
|
|
|
{{amount}} BTC |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="d-flex"> |
|
|
|
<view class=""> |
|
|
|
成本 |
|
|
|
</view> |
|
|
|
<view class="" style="margin-left: 10px;"> |
|
|
|
-- |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</template> |
|
|
|
<template v-else> |
|
|
|
<v-button |
|
|
|
@ -227,7 +314,7 @@ |
|
|
|
to="/pages/login/index" |
|
|
|
:type="'green'" |
|
|
|
class="w-max rounded" |
|
|
|
style="background-color: #25A74F;" |
|
|
|
style="background-color: #25A74F;" |
|
|
|
>{{ $t("exchange.d0") }} |
|
|
|
</v-button |
|
|
|
> |
|
|
|
@ -250,11 +337,27 @@ |
|
|
|
size="small" |
|
|
|
block |
|
|
|
class="w-max rounded" |
|
|
|
style="background-color: #CA3F66;" |
|
|
|
style="background-color: #CA3F66;" |
|
|
|
> |
|
|
|
<span class="but_text">{{ $t("contract.c2") }}</span> |
|
|
|
<!--<span class="fn-10 but_right">{{ $t("contract.e2") }}</span>--> |
|
|
|
</v-button> |
|
|
|
<view class="fn-sm m-t-xs d-flex"> |
|
|
|
<view class=""> |
|
|
|
可卖 |
|
|
|
</view> |
|
|
|
<view class="" style="margin-left: 10px;"> |
|
|
|
{{amount}} BTC |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="d-flex"> |
|
|
|
<view class=""> |
|
|
|
成本 |
|
|
|
</view> |
|
|
|
<view class="" style="margin-left: 10px;"> |
|
|
|
-- |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</template> |
|
|
|
<template v-else> |
|
|
|
<v-button |
|
|
|
@ -268,25 +371,25 @@ |
|
|
|
</v-button |
|
|
|
> |
|
|
|
</template> |
|
|
|
<view class="fn-sm m-t-xs d-flex justify-between"> |
|
|
|
<!-- <view class="fn-sm m-t-xs d-flex justify-between"> |
|
|
|
<view class=""> |
|
|
|
{{ $t("common.c3") }} |
|
|
|
</view> |
|
|
|
<view class=""> |
|
|
|
{{ maxNum }} |
|
|
|
<!-- {{ $t("contract.d8") }} --> |
|
|
|
{{ $t("contract.d8") }} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="fn-sm m-t-xs d-flex justify-between"> |
|
|
|
</view> --> |
|
|
|
<!-- <view class="fn-sm m-t-xs d-flex justify-between"> |
|
|
|
<view class=""> |
|
|
|
{{ $t("common.c4") }} |
|
|
|
<!-- {{ $t('contract.d2') }} --> |
|
|
|
{{ $t('contract.d2') }} |
|
|
|
</view> |
|
|
|
<view class=""> |
|
|
|
<!-- {{ form.amount}} USDT --> |
|
|
|
{{ form.amount}} USDT |
|
|
|
{{amount}} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> --> |
|
|
|
</view> |
|
|
|
<!-- <view |
|
|
|
class="m-b-xs border-t border-b p-y-xs d-flex justify-between align-center" |
|
|
|
@ -308,6 +411,17 @@ |
|
|
|
</view> --> |
|
|
|
</view> |
|
|
|
<view class="w-6/12 p-r-md p-l-md box-size"> |
|
|
|
|
|
|
|
<view style="margin-top: 20px;" class="m-b-md"> |
|
|
|
<view style="text-align: right;"> |
|
|
|
{{ $t("contract.d6") }} |
|
|
|
<van-icon @click="popshow=true" class="color-theme-1 m-l-xs" name="info-o"/> |
|
|
|
</view> |
|
|
|
<view class="num color-light fn-right" style="margin-top:8px;">{{ |
|
|
|
accountInfo.riskRate || "0%" |
|
|
|
}} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<sell-and-buy |
|
|
|
@price="form.entrust_price = $event" |
|
|
|
:sellList="sellList" |
|
|
|
@ -865,7 +979,15 @@ export default { |
|
|
|
refreshing: false, |
|
|
|
pingAmount: '', |
|
|
|
imgurl: '', |
|
|
|
bao: 0 |
|
|
|
bao: 0, |
|
|
|
marks:{ |
|
|
|
2: '0%', |
|
|
|
25: '25%', |
|
|
|
50: '50%', |
|
|
|
75: '75%', |
|
|
|
100: '100%', |
|
|
|
}, |
|
|
|
shows:false |
|
|
|
}; |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
@ -1679,7 +1801,10 @@ export default { |
|
|
|
bottom: 8px; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.border_1{ |
|
|
|
border: 1px solid #212121; |
|
|
|
border-radius: 5px; |
|
|
|
} |
|
|
|
/deep/ .van-stepper { |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
@ -1742,6 +1867,13 @@ export default { |
|
|
|
display: block; |
|
|
|
} |
|
|
|
} |
|
|
|
::v-deep uni-input{ |
|
|
|
background-color: #121212; |
|
|
|
} |
|
|
|
|
|
|
|
::v-deep .van-checkbox__icon--checked{ |
|
|
|
color: #000; |
|
|
|
} |
|
|
|
|
|
|
|
.span-next { |
|
|
|
width: 30%; |
|
|
|
@ -1772,13 +1904,6 @@ export default { |
|
|
|
border-radius: 3px; |
|
|
|
} |
|
|
|
|
|
|
|
/deep/ .el-slider__stop { |
|
|
|
width: 5px; |
|
|
|
height: 10px; |
|
|
|
border-radius: 0; |
|
|
|
top: -2px; |
|
|
|
background-color: $form-panel-4; |
|
|
|
} |
|
|
|
|
|
|
|
.w-50 { |
|
|
|
width: 48%; |
|
|
|
@ -1832,7 +1957,9 @@ export default { |
|
|
|
width: 100%; |
|
|
|
box-sizing: border-box; |
|
|
|
} |
|
|
|
|
|
|
|
.col-fff{ |
|
|
|
color: white; |
|
|
|
} |
|
|
|
.w-23 { |
|
|
|
width: 22%; |
|
|
|
} |
|
|
|
@ -1962,4 +2089,29 @@ export default { |
|
|
|
.red /deep/ uni-button{ |
|
|
|
background-color: #CA3F66 !important; |
|
|
|
} |
|
|
|
|
|
|
|
// 滑块样式 |
|
|
|
::v-deep .el-slider__marks-text{ |
|
|
|
font-size: 18rpx; |
|
|
|
} |
|
|
|
::v-deep .el-slider__runway{ |
|
|
|
background-color: #2B2B2B; |
|
|
|
height: 8rpx; |
|
|
|
} |
|
|
|
::v-deep .el-slider__bar{ |
|
|
|
background-color: white; |
|
|
|
} |
|
|
|
::v-deep .el-slider__stop{ |
|
|
|
background-color: #121212; |
|
|
|
border: 2px solid #2B2B2B; |
|
|
|
top: -3px; |
|
|
|
// border-radius: 10px; |
|
|
|
} |
|
|
|
::v-deep .el-slider__button{ |
|
|
|
width: 20rpx; |
|
|
|
height: 20rpx; |
|
|
|
border: 2px solid #fff; |
|
|
|
background-color: #121212; |
|
|
|
} |
|
|
|
|
|
|
|
</style> |