1

jhzh

2026-05-22 ef52095f5e9f0a9fe2da779bb1573947d77d75b6

 src/views/cryptos/Exchange/exchangePage.vue

@@ -1,20 +1,8 @@
<template>
  <div id="cryptos">
    <van-nav-bar left-arrow @click-left="onClickLeft">

      <template #right>
        <van-icon class="exchange-icon" @click="$router.push('/cryptos/exchangeHistory')" name="clock-o" />
      </template>
      <template #title>
        <div class="flex items-center">
          {{ $t('闪兑') }}
          <div class="fee ex-bg"> {{ $t('0手续费') }}</div>
        </div>

      </template>
    </van-nav-bar>
  <div id="cryptos" class="exchange-page-wrap">
    <assets-head :title="$t('闪兑')" :show-left="true" :back-func="onClickLeft" />
    <div class="exchange-page">
      <list-account show class="mt-94" type="exchange" @exchange="onPopup" ref="exchange" />
      <list-account show type="exchange" @exchange="onPopup" ref="exchange" />
      <van-popup class="tabBackground" v-model:show="show" position="bottom" :close-on-click-overlay="false"
        @close="onClose">
        <div class="pop-box relative">
@@ -29,7 +17,7 @@
                  class="w-70 h-70 rounded-full" />
              </div>
              <div class="text-grey font-28 mt-20">{{ $t('从') }}</div>
              <div class="font-30 mt-30">{{ detail.volume }} {{ detail.symbol }}</div>
              <div class="font-30 mt-30">{{ detail.volume }} {{ detail.name }}</div>
            </div>
            <img src="../../../assets/image/exchange/icon_6.png" class="w-30 h-20" style="margin-top:-65px" />

@@ -60,8 +48,8 @@
                  </li> -->
            <li class="flex justify-between font-28 mt-25">
              <span class="text-grey">{{ $t('汇率') }}</span>
              <span class="textColor">1 {{ detail.symbol &&
                detail.symbol.toUpperCase() }}≈{{ (detail.rate * 1).toFixed(5) }} {{ detail.symbol_to &&
              <span class="textColor">1 {{ detail.name &&
                detail.name.toUpperCase() }}≈{{ (detail.rate * 1).toFixed(5) }} {{ detail.symbol_to &&
                  detail.symbol_to.toUpperCase() }}</span>
            </li>
          </ul>
@@ -79,7 +67,7 @@

<script>
import assetsHead from "@/components/Transform/assets-head/index.vue";
import ListAccount from '@/components/Transform/mining-account/index.vue'
import ListAccount from '@/components/Transform/mining-account/index.vue';
import { _initExchange, _exchange } from "@/service/fund.api";
import { Popup, showToast } from "vant"
import { HOST_URL } from '@/config'
@@ -133,6 +121,7 @@
    },
    onConfirm() { // 闪兑
      this.clearInterval()
     console.log(this.detail);
      let obj = {
        symbol: this.detail.symbol_ex,
        symbol_to: this.detail.symbol_to_ex,
@@ -163,61 +152,27 @@
}
</script>

<style lang="scss" scoped>
@import "@/assets/init.scss";

.exchange-page-wrap {
  min-height: 100vh;
  background: #f9f9f9;
}
.exchange-page {
  padding: 29px 24px 38px;
  width: 100%;
  box-sizing: border-box;
}
</style>
<style lang="scss">
@import "@/assets/init.scss";

#cryptos {
  :deep(.van-icon) {
    color: red;
  }

  .exchange-page {
    height: 100vh - 6vh;

    background: $selectSymbol_background;

    :deep(.van-tab--active) {
      background: $selectSymbol_background;
      color: $text_color;
    }

    :deep(.van-nav-bar) {
      // background: $selectSymbol_background;
    }

    :deep(.van-tabs__nav) {
      background: $selectSymbol_background;
    }

    :deep(.van-nav-bar__title) {
      color: $text_color;
    }

    :deep(.van-hairline--bottom::after) {
      border-bottom-width: 0px;
    }

    :deep(.van-nav-bar .van-icon) {
      color: $text_color;

      font-size: 40px;
    }
  }

  .bg-grey-light {
    background: $light-grey;
  }

  .bg-grey-dark {
    background: $light-grey;
  }


#cryptos.exchange-page-wrap {
  .fee {
    // background: #21353A;
    border-radius: 4px;
    color: #00B087;
    font-size: 24px;
    font-size: 1.6rem;
    padding: 5px 10px;
    margin-left: 10px;
  }