123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203 |
- <template>
- <view class="">
- <view class="lable-select-box">
- <view class="lable-select">
- <!-- val.sync="全部合约" -->
- <selectCondition val="全部合约"/>
- <selectCondition val="全部类型"/>
- </view>
- <text class="lable-title-icon iconfont"></text>
- </view>
- <u-list class="swiper-list" :style="{'height': scrollHeight ? `${scrollHeight}px` : '' }"
- @scrolltolower="scrolltolower">
- <template v-for="item in list">
- <view class="content-box" :rise-fall="stocksColor" @click.stop="lookInfo(item)">
- <view class="content-top">
- <view class="top-left">
- <view class="top-left-title">
- <text>{{ item.symbol }}</text>
- <text v-if="item.settled == 0">永续</text>
- <text v-else-if="item.settled == 9">快捷</text>
- </view>
- <view class="top-left-b">
- <text>{{ item.multiple }}倍杠杆</text>
- <text class="top-left-b-tag">{{ item.type_name }}</text>
- <text class="top-left-b-tag">{{ item.status_name }}</text>
- </view>
- </view>
- <view :class="['top-right' , $setColor(item.profits)]">
- <text class="color">{{ $numIntercepting(item.profits , 2) || '--'}}</text>
- <text class="color top-right-float"><text
- class="bdColor">平仓盈亏</text>{{ $getChange(item , 4) }}%</text>
- </view>
- </view>
- <view class="content-info">
- <view class="info-item">
- <text class="info-item-lable">保证金(USDT)</text>
- <text class="info-item-val">{{ item.caution_money }}</text>
- </view>
- <view class="info-item">
- <text class="info-item-lable">开仓价格(USDT)</text>
- <text class="info-item-val">{{ item.price }}</text>
- </view>
- <view class="info-item">
- <text class="info-item-lable">平仓价格(USDT)</text>
- <text class="info-item-val">{{ item.update_price }}</text>
- </view>
- <view class="info-item">
- <text class="info-item-lable">平仓数量(张)</text>
- <text class="info-item-val">{{ item.share }}</text>
- </view>
- <view class="info-item">
- <text class="info-item-lable">手续费(USDT)</text>
- <text class="info-item-val">{{ item.trade_fee || '--' }}</text>
- </view>
- <view class="info-item">
- <text class="info-item-lable">平仓类型(USDT)</text>
- <text class="info-item-val">{{ item.status === 3 ? '强制平仓' : '' }}</text>
- </view>
- </view>
- <view class="record-hint">
- <text class="record-lable">平仓时间 {{ item.handle_time }}</text>
- <view class="record-icon" @click.stop="$emit('shareContent' , item)">
- <text class="icon-size iconfont"></text>
- <text class="icon-size">分享</text>
- </view>
- </view>
- </view>
- <gap />
- </template>
- <view class="loadmore-box" v-show="loadStatus !== 'nomore' || list.length > 0">
- <u-loadmore :status="loadStatus" nomoreText="没有更多数据" :fontSize='28' :icon="false" />
- </view>
- <view class="empty-content" :style="{'height': scrollHeight ? `${scrollHeight}px` : '' }"
- v-if="loadStatus === 'nomore' && list.length <= 0">
- <empty />
- </view>
- </u-list>
- </view>
- </template>
- <script>
- import {
- mapGetters
- } from 'vuex'
- import {
- Api_getRegister
- } from "@/api/index.js"
- import selectCondition from "./select-condition.vue"
- export default {
- name: 'login',
- components:{selectCondition},
- props: {
- listHeight: {
- type: Number,
- default: 0
- },
- status: {
- type: Number,
- default: ''
- },
- },
- data() {
- return {
- loadStatus: '', // loading / nomore / loadmore
- limit: 10,
- page: 1,
- scrollHeight: 0,
- list: [],
- };
- },
- // 80rpx
- watch: {
- listHeight: {
- handler(newH) {
- if (newH) {
- this.scrollHeight = newH - uni.upx2px(80) ;
- }
- },
- immediate: true
- },
- status: {
- handler(newSatus, oldStatus) {
- if (newSatus === -1 && newSatus !== oldStatus) {
- this.limit = 10;
- this.page = 1;
- this.list = []
- this.getRegister()
- }
- },
- immediate: true
- },
- },
- computed: {
- ...mapGetters([
- "stocksColor",
- ])
- },
- mounted() {
- // this.getRegister()
- },
- methods: {
- scrolltolower() {
- console.log('scrolltolower = ')
- if (this.loadStatus === 'loadmore') {
- // loadStatus: 'loading', // loading / nomore / loadmore
- this.page ++;
- this.getRegister()
- }
- },
- getRegister() {
- if (this.loadStatus === 'loading') {
- return false
- };
- this.loadStatus = 'loading'
- Api_getRegister({
- status: this.status,
- page: this.page,
- limit: this.limit
- }).then(res => {
- const data = res.message;
- this.list = this.list.concat(data.data)
- this.page = data.current_page;
- if (this.list.length >= data.total) {
- this.loadStatus = 'nomore'
- } else {
- this.loadStatus = 'loadmore'
- }
- }).catch(err => {
- if (this.page >= 2) {
- this.page -= 1;
- this.loadStatus = 'loadmore'
- } else {
- this.loadStatus = 'nomore'
- }
- })
- },
- lookInfo(item){
- this.$setStorageSync('historyInfo' , item)
- uni.navigateTo({
- url:'/pages/contract/order-info'
- });
- }
- }
- }
- </script>
- <style lang="scss" scoped>
- @import "~../sustainability/index.scss";
- @import "~./index.scss";
- .top-right-float{
- text{
- border: none;
- }
- }
- .top-left-b-tag{
- font-size: 20rpx;
- border-radius: 5rpx;
- }
- </style>
|