1

李凌

2 days ago dce10d37ad35efe8ed1d39d6e5fcf7e4904381df

1

 src/components/Transform/perpetual-order/index.vue

@@ -10,6 +10,8 @@
                orderHold.length }})</span></div>
            <div class="px-2 ml-12 py-2 flex  items-center textColor1y text-28" @click="tabClick('2')"
              :class="type == '2' ? 'active-line' : ''">{{ $t('当前委托') }}</div>
            <div class="px-2 ml-12 py-2 flex  items-center textColor1 text-28" @click="tabClick('5')"
              :class="type == '5' ? 'active-line' : ''">{{ $t('历史仓位') }}</div>
          </template>
          <template v-else>
            <div class="px-2 py-2 flex  items-center textColor1 text-28" @click="tabClick('3')"
@@ -20,8 +22,8 @@
              :class="type == '4' ? 'active-line' : ''">{{ $t('历史仓位') }}</div>
          </template>
        </div>
        <img src="../../../assets/image/public/record.png" alt="record-img" class="w-16 h-9 pr-8 record-img"
          @click="goHistory" />
        <!-- <img src="../../../assets/image/public/record.png" alt="record-img" class="w-16 h-9 pr-8 record-img"
          @click="goHistory" /> -->
      </div>
      <!-- 永续-->
      <template v-if="topIndex / 1 === 1">
@@ -32,6 +34,11 @@
        <!-- 持有仓位列表 -->
        <div v-if="type == '2'">
          <PerpetualEntrustList :list-data="orderCur" @recall="$emit('recall', $event)"></PerpetualEntrustList>
        </div>
        <!-- 历史仓位列表 -->
        <div v-if="type == '5'">
          <PerpetualHistoryPosition :list-data="perpetualHistroy" />
          <div class="text-grey text-center py-72 text-30" v-if="perpetualHistroy.length == 0">{{ $t('您目前没有持仓') }}</div>
        </div>
      </template>
      <!-- 交割-->
@@ -52,6 +59,7 @@
<script>
import PerpetualEntrustList from '../perpetual-entrust-list/index.vue';
import PerpetualPositionList from '../perpetual-position-list/index.vue';
import PerpetualHistoryPosition from '../perpetual-history-position/index.vue';
import futrueHoldList from '../deliveryContract/hold.vue'
import futrueHistroyPosition from '../deliveryContract/position.vue'
import { mapGetters } from 'vuex'
@@ -60,7 +68,7 @@
  name: "perpetualOrder",
  data() {
    return {
      type: '1', // 1：永续持有，2：永续当前，3：交割持有，4：交割历史
      type: '1', // 1：永续持有，2：永续当前，5：永续历史，3：交割持有，4：交割历史
    };
  },
  props: {
@@ -96,9 +104,19 @@
        return []
      }
    },
    perpetualHistroy: {
      type: Array,
      default() {
        return []
      }
    },
    price: {
      type: [Number, String],
      default: '0.00'
    },
    symbolType: {
      type: String,
      default: 'cryptos'
    },
  },
  watch: {
@@ -147,17 +165,17 @@
      if (type === '4') {
        this.$emit('tab', 'fetchFutrueHistory')
      }
      if (type === '5') {
        this.$emit('tab', 'fetchPerpetualHistory')
      }
      // this.$emit(type)
    },
    goHistory() {
      if (this.userInfo.token) {
        let type = 'cryptos'
        if (this.$route.query.type) {
          type = this.$route.query.type
        }
        const type = this.symbolType || 'cryptos'
        const url = this.topIndex / 1 === 1 ? '/cryptos/perpetualHistory' : '/cryptos/deliveryContractHistory'
        this.$router.push({
          path: url, query: { symbol: this.symbol, type: type }
          path: url, query: { symbol: this.symbol, type }
        });
      } else {
        this.$router.push('/login')
@@ -165,7 +183,7 @@

    }
  },
  components: { PerpetualEntrustList, PerpetualPositionList, futrueHistroyPosition, futrueHoldList },
  components: { PerpetualEntrustList, PerpetualPositionList, PerpetualHistoryPosition, futrueHistroyPosition, futrueHoldList },
  computed: {
    ...mapGetters('user', ['userInfo']),
  },

 src/views/cryptos/PerpetualContract/index.vue

@@ -94,7 +94,7 @@
          <!-- 委托/持仓-->
          <PerpetualOrder class="pl-8 pr-8" :key="keyIndex + 'b'" :symbol="symbol" :order-cur="orderCur"
            :order-hold="orderHold" :topIndex="selectIndex" :futrue-hold="futrueHold" :futrue-histroy="futrueHistroy"
            @tab="onTab" @recall="onRecall">
            :perpetual-histroy="perpetualHistroy" :symbol-type="type" @tab="onTab" @recall="onRecall">
          </PerpetualOrder>
        </div>
      </div>
@@ -180,7 +180,8 @@
          <!-- 委托/持仓-->
          <PerpetualOrder class="pl-8 pr-8" :key="keyIndex + 'd'" :symbol="symbol" :order-cur="orderCur"
            :order-hold="orderHold" :price="price" :topIndex="selectIndex" :futrue-hold="futrueHold"
            :futrue-histroy="futrueHistroy" @tab="onTab" @recall="onRecall">
            :futrue-histroy="futrueHistroy" :perpetual-histroy="perpetualHistroy" :symbol-type="type" @tab="onTab"
            @recall="onRecall">
          </PerpetualOrder>
        </div>
      </div>
@@ -304,6 +305,7 @@
      bids: initArr, // 买单
      orderCur: [], // 当前委托
      orderHold: [], // 持有仓位
      perpetualHistroy: [], // 永续历史
      futrueHold: [], // 交割持仓
      futrueHistroy: [], // 交割历史
      sockets: {
@@ -656,6 +658,18 @@
        // this.clearTimeout()
      })
    },
    fetchPerpetualHistory(symbol) { // 永续历史仓位
      if (this.userInfo.token) {
        contractOrder({
          symbol,
          type: 'hisorders',
          page_no: 1,
          symbolType: this.type || 'cryptos'
        }).then(data => {
          this.perpetualHistroy = data || []
        })
      }
    },
    init(symbol) { // 初始化页面
      this.symbol = symbol
      this.fetchQoutes(symbol)

 src/views/trade/components/OptionsContract.vue

@@ -43,7 +43,7 @@
          <div class="line"></div>
          <PerpetualOrder class="pl-8 pr-8" :key="keyIndex + 'b'" :symbol="symbol" :order-cur="orderCur"
            :order-hold="orderHold" :topIndex="selectIndex" :futrue-hold="futrueHold" :futrue-histroy="futrueHistroy"
            @tab="onTab" @recall="onRecall" />
            :perpetual-histroy="perpetualHistroy" :symbol-type="type" @tab="onTab" @recall="onRecall" />
        </div>
      </div>

@@ -85,8 +85,8 @@
              <div class="px-2 ml-12 py-2 flex items-center textColor1 text-28" @click="onDeliveryTab('history')"
                :class="deliveryPositionTab === 'history' ? 'active-line' : ''">{{ $t('历史仓位') }}</div>
            </div>
            <img src="@/assets/image/public/record.png" alt="record-img" class="w-16 h-9 pr-8 record-img"
              @click="goDeliveryHistory" />
            <!-- <img src="@/assets/image/public/record.png" alt="record-img" class="w-16 h-9 pr-8 record-img"
              @click="goDeliveryHistory" /> -->
          </div>
          <template v-if="deliveryPositionTab === 'hold'">
            <futrue-hold-list :price="price" :list-data="futrueHold" />
@@ -216,6 +216,7 @@
      bids: initDepthArr(),
      orderCur: [],
      orderHold: [],
      perpetualHistroy: [],
      futrueHold: [],
      futrueHistroy: [],
      curTab: 'fetchOrderListHold',
@@ -290,6 +291,8 @@
    symbol(val) {
      if (val && val !== this._lastSymbol) {
        this._lastSymbol = val
        this.futrueHold = []
        this.futrueHistroy = []
        this.closeSocket()
        this.init(val)
      }
@@ -483,23 +486,30 @@
    fetchFutrueHoldList(symbol) {
      if (!this.userInfo || !this.userInfo.token) return
      const symbolType = this.type || 'cryptos'
      symbol = ''
      _futrueOrderList(symbol, 'orders', 1, symbolType).then(data => {
      const querySymbol = symbol || this.symbol || ''
      _futrueOrderList(querySymbol, 'orders', 1, symbolType).then(data => {
        this.futrueHold = (data || []).sort(this.sortData)
      })
      this.clearTimer()
      this.timer = setInterval(() => {
        symbol = ''
        _futrueOrderList(symbol, 'orders', 1, symbolType).then(data => {
        _futrueOrderList(querySymbol, 'orders', 1, symbolType).then(data => {
          this.futrueHold = (data || []).sort(this.sortData)
        })
      }, 1000)
    },
    fetchFutrueHistory(symbol) {
      const symbolType = this.type || 'cryptos'
      symbol = ''
      _futrueOrderList(symbol, 'hisorders', 1, symbolType).then(data => {
      const querySymbol = symbol || this.symbol || ''
      _futrueOrderList(querySymbol, 'hisorders', 1, symbolType).then(data => {
        this.futrueHistroy = data || []
      })
    },
    fetchPerpetualHistory(symbol) {
      if (!this.userInfo || !this.userInfo.token) return
      symbol = ''
      const symbolType = this.type || 'cryptos'
      contractOrder({ symbol, type: 'hisorders', page_no: 1, symbolType }).then(data => {
        this.perpetualHistroy = data || []
      })
    },
    init(symbol) {
@@ -508,10 +518,22 @@
      this.fetchDeepData(symbol)
      this.initParam(symbol)
      this.clearTimer()
      if ((this.selectIndex ?? 1) === 2) {
        if (this.deliveryPositionTab === 'history') {
          this.curTab = 'fetchFutrueHistory'
          this.fetchFutrueHistory(symbol)
        } else {
          this.curTab = 'fetchFutrueHoldList'
          this.fetchFutrueHoldList(symbol)
        }
        return
      }
      if (this.curTab === 'fetchOrderListHold') {
        this.fetchOrderListHold(symbol)
      } else if (typeof this[this.curTab] === 'function') {
        this[this.curTab](symbol)
      } else {
        this.fetchFutrueHoldList(symbol)
        this.fetchOrderListHold(symbol)
      }
    },
    closeSocket() {