交易页面

lxf

2025-07-11 40ba46b887bd8eec7216c63e85b34e096df31420

 src/views/cryptos/TrendDetails/index.vue

@@ -4,23 +4,23 @@
      <trade-head :backFunc="() => $router.push('/')" :symbol="symbol" :islevel="true" @update-coin="onUpdate"
        @data="quote = $event" :title="$t('永续')" @changeLine="onChangeLine" :isNight="isNight" :isChange="isChange"
        :kineType="kineType" :tabIndex="tab" @changeNight="OnchangeNight" />
      <div class="flex justify-between px-32 pt-40" v-if="!kineType">
      <!-- <div class="flex justify-between px-32 pt-40" v-if="!kineType">
        <div class="w-368 h-80 mr-32 font-28 flex justify-center items-center rounded box-border tabBtn"
          :class="tab === '1' ? 'activeBtn' : ''" @click="onTab('1')">{{ $t('永续合约') }}</div>
        <div class="w-368 h-80  font-28 flex justify-center items-center rounded box-border tabBtn"
          :class="tab === '2' ? 'activeBtn' : ''" @click="onTab('2')">{{ queryType == 'cryptos' ? $t('交割合约') : $t('期货交易')
          }}</div>
      </div>
      </div> -->
      <!-- 数据区 -->
      <div :class="{ slide2: animated1, slide1: animated2 }">
        <div class="data-index">
          <div class="flex flex-1 px-32 mt-40">
            <div class="flex flex-col font-22">
              <p class="font-70 font-600" :class="quote.change_ratio > 0 ? 'text-green' : 'text-red'">
              <p class="font-70 font-600" :class="quote.change_ratio_str > 0 ? 'text-green' : 'text-red'">
                {{ quote.close || '--' }}</p>
              <p class="font-22 mt-10">≈ {{ currency.currency_symbol }}{{ quote.close ? (quote.close *
                currency.rate).toFixed(2) : '--' }}
                <span :class="quote.change_ratio > 0 ? 'text-green' : 'text-red'">{{ quote.change_ratio
                <span :class="quote.change_ratio_str > 0 ? 'text-green' : 'text-red'">{{ quote.changeRatioStr
                  ||
                  '--' }}%</span>
              </p>
@@ -33,7 +33,7 @@
                  <p>{{ quote.high || '--' }}</p>
                </div>
                <div class="flex w-1/2 flex-col justify-between w-220 buy-title">
                  <p class="text-grey">{{ $t('24h成交量') }}({{ symbolData && symbolData.toUpperCase() || '--' }})</p>
                  <p class="text-grey">{{ $t('24h成交量') }}</p>
                  <p>{{ quote.amount && quote.amount.toFixed(3) || '--' }}</p>
                </div>
              </div>
@@ -284,7 +284,7 @@
      order_no: '',
      timer: null,
      isChangeLine: false,
      isNight: true,
      isNight: false,
      isChange: true, //是否有切换黑夜白天模式
      kineType: '',
      deepBuy: [],
@@ -443,7 +443,7 @@
        })
        return
      } else {
        this.$router.push(`/cryptos/perpetualContract/${this.symbol}`)
        this.$router.push(`/cryptos/perpetualContract/${this.symbol}?type=cryptos&selectIndex=2`)
      }
    },
    onClose() {
@@ -551,7 +551,7 @@
}

:deep(.van-tabs__nav) {
  background-color: $night !important;
  // background-color: $night !important;
}

@keyframes animate1 {