隐藏etc 去掉着头顶两个标志 去掉着两个图标

dcc

2024-05-14 cf1a7b806caf347f6b1c1b8d379936bfa3a42dd2

 src/components/list-quotation/index.vue

@@ -1,36 +1,18 @@
<template>
  <div class="list-quatation">
    <ex-tabs @tabs="onTabs"></ex-tabs>
    <h1 data-v-52efe258="" class="font-34 text-black pl-30 pr-30 pt-40 pb-40 bg-grey font-400 text-black font-600">
      {{ $t('币种行情') }}</h1>
    <van-list>
      <van-cell>
        <div class="flex items-center w-full text-grey font-26">
          <div class="left flex items-center">
            <span>{{ $t('交易对') }}</span>
            <div class="filter-box ml-10" v-if="active == 0">
              <div class="w-14 h-12" :class="[sortVal == 1 ? 'icon_top1_active' : 'icon_top1']" @click="listSort(1)">
              </div>
              <div class="w-14 h-12" :class="[sortVal == 2 ? 'icon_top2_active' : 'icon_top2']" @click="listSort(2)">
              </div>
            </div>
            <span>{{ $t('币种') }}/{{ $t('交易量') }}</span>
          </div>
          <div class="mid text-right flex justify-end items-center">
            {{ $t('最新价') }}
            <div class="filter-box ml-10" v-if="active == 0">
              <div class="w-14 h-12" :class="[sortVal == 3 ? 'icon_top1_active' : 'icon_top1']" @click="listSort(3)">
              </div>
              <div class="w-14 h-12" :class="[sortVal == 4 ? 'icon_top2_active' : 'icon_top2']" @click="listSort(4)">
              </div>
            </div>
            {{ $t('价格') }}
          </div>
          <div class="right text-right flex justify-end items-center">
            {{ active == 3 ? $t('成交额') : $t('24h涨跌幅') }}
            <div class="filter-box ml-10" v-if="active == 0">
              <div class="w-14 h-12 " :class="[sortVal == 5 ? 'icon_top1_active' : 'icon_top1']" @click="listSort(5)">
              </div>
              <div class="w-14 h-12" :class="[sortVal == 6 ? 'icon_top2_active' : 'icon_top2']" @click="listSort(6)">
              </div>
            </div>
            <!--                  <img src="./icon-sort.png" alt="icon" class="w-13 h-22 ml-5"/>-->
            {{ active == 3 ? $t('成交额') : $t('涨跌幅') }}
          </div>
        </div>
      </van-cell>
@@ -40,13 +22,13 @@
            <ul class="flex justify-between w-full items-center" @click="onItemClick(item)">
              <li class="flex items-center left">
                <img
                  :src="item.symbol ? `${HOST_URL}/symbol/${item.symbol}.png` : require('@/assets/loading-default.png')"
                  alt="logo" class="w-72 h-72 rounded-full mr-16" />
                    :src="item.symbol ? `${HOST_URL}/wap/symbol/${item.symbol}.png` : require('@/assets/loading-default.png')"
                    alt="logo" class="w-72 h-72 rounded-full mr-16"/>
                <p class="flex flex-col">
                  <span class="flex items-end font-32 flex items-center">
                    <span class="textColor font-600 font-30">{{ item.name && item.name.toUpperCase() || '--' }}</span>
                <!--    <span class="font-24 text-grey" style="position: relative; top: 1px">
                      {{ item.name && item.name.replace(item.symbol.toUpperCase(), '') || '--' }}</span> -->
                    <!--    <span class="font-24 text-grey" style="position: relative; top: 1px">
                          {{ item.name && item.name.replace(item.symbol.toUpperCase(), '') || '--' }}</span> -->
                  </span>

                  <span class="font-24 text-grey mt-10">{{ $t('成交量') + ' ' + (item.amount * 1).toFixed(2) }}</span>
@@ -54,9 +36,11 @@
              </li>
              <li class="flex flex-col items-end mid">
                <p class="textColor font-32 font-600">{{ item.close || '--' }}</p>
                <p class="font-24 text-grey mt-10">{{ currency.currency_symbol }}{{ item.close && (item.close *
                  currency.rate).toFixed(item.close.toString().split('.')[1] ? item.close.toString().split('.')[1].length
                    : 2) || '--' }}</p>
                <p class="font-24 text-grey mt-10">{{ currency.currency_symbol }}{{
                    item.close && (item.close *
                        currency.rate).toFixed(item.close.toString().split('.')[1] ? item.close.toString().split('.')[1].length
                        : 2) || '--'
                  }}</p>
              </li>
              <li class="right flex items-center justify-end">
                <p class="w-153 font-31 h-71 bg-green text-white border-0 text-center btn" v-if="item.change_ratio > 0">
@@ -71,10 +55,12 @@
          <van-cell v-for="item in showList" :key="item.id">
            <ul class="flex justify-between w-full items-center" @click="onItemClick(item)">
              <li class="flex items-center left">
                <img :src="`${HOST_URL}/symbol/${item.symbol}.png`" alt="logo" class="w-72 h-72 rounded-full mr-16" />
                <img :src="`${HOST_URL}/symbol/${item.symbol}.png`" alt="logo" class="w-72 h-72 rounded-full mr-16"/>
                <p class="flex flex-col">
                  <span class="flex items-end font-32 flex items-center">
                    <span class="textColor font-600 font-30">{{ item.symbol && item.symbol.toUpperCase() || '--' }}</span>
                    <span class="textColor font-600 font-30">{{
                        item.symbol && item.symbol.toUpperCase() || '--'
                      }}</span>
                    <span class="font-24 text-grey" style="position: relative; top: 1px">
                      {{ item.name && item.name.replace(item.symbol.toUpperCase(), '') || '--' }}</span>
                  </span>
@@ -83,17 +69,20 @@
              </li>
              <li class="flex flex-col items-end mid">
                <p class="textColor font-32 font-600">{{ item.close }}</p>
                <p class="font-24 text-grey mt-10">{{ currency.currency_symbol }}{{ item.close && (item.close *
                  currency.rate).toFixed(item.close.toString().split('.')[1] ? item.close.toString().split('.')[1].length
                    :
                    2) }}</p>
                <p class="font-24 text-grey mt-10">{{ currency.currency_symbol }}{{
                    item.close && (item.close *
                        currency.rate).toFixed(item.close.toString().split('.')[1] ? item.close.toString().split('.')[1].length
                        :
                        2)
                  }}</p>
              </li>
              <li class="right flex items-center justify-end text-right">
                <div v-if="active == 3" class="textColor w-182 font-700 font-24">
                  {{ (item.volume * 1).toFixed(2) }}
                </div>
                <template v-else>
                  <p class="w-153 font-31 h-71 bg-green text-white border-0 text-center btn" v-if="item.change_ratio > 0">
                  <p class="w-153 font-31 h-71 bg-green text-white border-0 text-center btn"
                     v-if="item.change_ratio > 0">
                    +{{ item.change_ratio }}%</p>
                  <p class="w-153 font-31 h-71 bg-red text-white border-0 text-center btn" v-else>
                    {{ item.change_ratio }}%</p>
@@ -104,6 +93,12 @@
        </div>
      </transition-group>
    </van-list>
    <div class="flex flex-col justify-center items-center pb-58 mt-20" @click="$router.push('/quotes/?active=3')">
      <p class="text-grey font-28 mb-8">{{$t('查看')}}</p>
      <img
        src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAUCAYAAADLP76nAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAGqSURBVHgB1ZdLTsJQFIb/U0SnLoEl6A5kZEwcwNCRcSI+JqBggkiABGEgBB0ZdACuQIwjTYy6AlkCS2giE5ByPVeDmqZIX2j7JU0f99zk/r3/6TklMMeVixcCFuAjBNDuB4JhKlXqTYDW4UNYxJPC5xYfKvyGEB0M3xIkr8vl85CYCTyCEIIPEILtM9CihfR2R+4A0nxBAy3MQy14nCGJ0343GJaLl/ekDyhW6zlFUB4eRGAYzyS3zn4+I6PA4kk9rhDV4B1UKIgc7m0+6wdo3AzP5AUna28w/LKMHmXcvO+8QBv/hCA0e93ZxXGLlxBMUKpe1vhNxPGHcLLmj/ZjhUlxAZjg4f72Lry8ymppCdNH1TSxlk3F6maCTe3ACK7aEd7X2tTyYoLfjbAkQDKt5JZtQf81GC0UNix1BZYFSHK1xvyc1m/w9AhcwKzfjbAlYIQLRU/VIOLZZOwKNnEkQGK76LHfhRhEMwe7jj7TjgVIrOaFXb8b4YoAyYeIYOAaE36MZDPGfk/AJVwTMOKXoqdyM5bXN2NOMVXIrGBY9D79vpJJ7dzAZd4BKZy99D2A6PwAAAAASUVORK5CYII="
        alt="more" class="w-24 h-10">
    </div>
    <!-- <div class="flex flex-col justify-center items-center pb-58 mt-20" @click="$router.push('/quotes/?active=3')" v-if="showMore">
        <p class="text-grey font-28 mb-8">{{ $t('查看') }}</p>
        <img src="./icon-arrow_more.png" alt="more" class="w-24 h-10"/>
@@ -112,11 +107,12 @@
</template>

<script>
import { List, Cell } from 'vant'
import { mapGetters } from 'vuex'
import { fixDate, setStorage } from "@/utils/utis";
import {List, Cell} from 'vant'
import {mapGetters} from 'vuex'
import {fixDate, setStorage} from "@/utils/utis";
import ExTabs from "@/components/ex-tabs/index.vue";
import { HOST_URL } from '@/config'
import {HOST_URL} from '@/config'

export default {
  name: 'ListQuotation',
  data() {
@@ -145,7 +141,7 @@
    },
  },
  computed: {
    ...mapGetters({ currency: 'home/currency' }),
    ...mapGetters({currency: 'home/currency'}),
  },
  components: {
    [List.name]: List,
@@ -295,4 +291,7 @@
    margin-top: 5px;
  }
}
.list-quatation{
  background-color: #ffffff;
}
</style>