fast-history.vue 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150
  1. <template>
  2. <view>
  3. <headContent borderBottom>
  4. <template #left>
  5. <reverse-back />
  6. </template>
  7. <template #content>
  8. <view class="haed-title">
  9. 历史仓位
  10. </view>
  11. </template>
  12. </headContent>
  13. <template v-for="item in list">
  14. <view class="content-box" :rise-fall="stocksColor">
  15. <view class="content-top">
  16. <view class="top-left">
  17. <view class="top-left-title">
  18. <text>{{ item.symbol }}</text>
  19. <text v-if="item.settled == 0">永续</text>
  20. <text v-else-if="item.settled == 9">快捷</text>
  21. </view>
  22. <view class="top-left-b">
  23. <text>{{ item.multiple }}倍杠杆</text>
  24. <text class="top-left-b-tag">{{ item.type_name }}</text>
  25. </view>
  26. </view>
  27. <view :class="['top-right' , $setColor(item.profits)]">
  28. <text class="color">{{ item.profits }}</text>
  29. <text class="color top-right-float">平仓盈亏{{ $getChange(item , 1) }}%</text>
  30. </view>
  31. <!-- <view class="top-right top-right-btns">
  32. <text class="top-right-btn" @click.stop="setCloseLeverAll()">撤单</text>
  33. </view> -->
  34. </view>
  35. <view class="content-info">
  36. <view class="info-item">
  37. <text class="info-item-lable">保证金(USDT)</text>
  38. <text class="info-item-val">{{ item.caution_money }}</text>
  39. </view>
  40. <view class="info-item">
  41. <text class="info-item-lable">开仓价格(USDT)</text>
  42. <text class="info-item-val">{{ item.price }}</text>
  43. </view>
  44. <view class="info-item">
  45. <text class="info-item-lable">平仓价格(USDT)</text>
  46. <text class="info-item-val">{{ item.origin_price }}</text>
  47. </view>
  48. <view class="info-item">
  49. <text class="info-item-lable">平仓数量(张)</text>
  50. <text class="info-item-val">{{ item.number }}</text>
  51. </view>
  52. <view class="info-item">
  53. <text class="info-item-lable">手续费(USDT)</text>
  54. <text class="info-item-val">{{ item.trade_fee || '--' }}</text>
  55. </view>
  56. <view class="info-item">
  57. <text class="info-item-lable">平仓类型(USDT)</text>
  58. <text class="info-item-val">{{ item.status === 3 ? '强制平仓' : '' }}</text>
  59. </view>
  60. </view>
  61. <view class="record-hint">
  62. <text class="record-lable">平仓时间 {{ item.handle_time }}</text>
  63. <view class="record-icon" @click.stop="val => $refs.shareRef.openShare(item)">
  64. <text class="icon-size iconfont">&#xe8b0;</text>
  65. <text class="icon-size">分享</text>
  66. </view>
  67. </view>
  68. </view>
  69. <gap />
  70. </template>
  71. <view class="loadmore-box" v-show="loadStatus !== 'nomore' || list.length > 0">
  72. <u-loadmore :status="loadStatus" nomoreText="没有更多数据" :fontSize='28' :icon="false"/>
  73. </view>
  74. <empty class="empty-content" v-show="loadStatus === 'nomore' && list.length <= 0" />
  75. <sharePage ref="shareRef" :shareType="2"></sharePage>
  76. </view>
  77. </template>
  78. <script>
  79. import {
  80. mapGetters
  81. } from 'vuex'
  82. import {
  83. Api_getRegister
  84. } from "@/api/index.js"
  85. export default {
  86. name: 'fast-history',
  87. data() {
  88. return {
  89. list: [],
  90. loadStatus: 'nomore', // loading / nomore / loadmore
  91. limit: 10,
  92. page: 1,
  93. };
  94. },
  95. computed: {
  96. ...mapGetters([
  97. "stocksColor",
  98. 'PageContentHeight'
  99. ])
  100. },
  101. onLoad() {
  102. this.getRegister()
  103. },
  104. onReachBottom() {
  105. if (this.loadStatus === 'loadmore') {
  106. this.page++;
  107. this.getRegister()
  108. }
  109. },
  110. methods: {
  111. getRegister() {
  112. if (this.loadStatus === 'loading') {
  113. return false
  114. };
  115. this.loadStatus = 'loading'
  116. Api_getRegister({
  117. status: -1,
  118. page: this.page,
  119. limit: this.limit,
  120. settled: 9
  121. }).then(res => {
  122. const data = res.message;
  123. this.list = this.list.concat(data.data)
  124. this.page = data.current_page
  125. if (this.list.length >= data.total) {
  126. this.loadStatus = 'nomore'
  127. } else {
  128. this.loadStatus = 'loadmore'
  129. }
  130. }).catch(err => {
  131. if (this.page >= 2) {
  132. this.page -= 1;
  133. this.loadStatus = 'loadmore'
  134. } else {
  135. this.loadStatus = 'nomore'
  136. }
  137. })
  138. }
  139. }
  140. }
  141. </script>
  142. <style lang="scss" scoped>
  143. @import "~../sustainability/index.scss";
  144. </style>