李凌
2025-10-15 7fc6bfe900790ec7c92bce85d5b20a95fbc06e65
src/views/my/assets.vue
@@ -91,7 +91,7 @@
                    </div>
                </div>
            </template>
            <template #right v-if="activeHead != 0">
      <template #right>
                <van-icon name="todo-list-o" class="textColor" @click="toPage('/cryptos/accountChange')" />
            </template>
        </van-nav-bar>
@@ -104,7 +104,7 @@
                <div class="assets_money mt-5 flex justify-start items-end">
                    {{ currency.currency_symbol }}{{ forexAssets?.money_contract ?
                        (forexAssets?.money_contract * (currency.rate ?? 0)).toFixed(2) : '0.00' }}
          <!--  -->
                    <div class="pricing_jj ml-5">
                        {{ pricing }}
                    </div>
@@ -115,8 +115,22 @@
                    </van-dropdown-menu>
                </div>
            </template>
    </div>
            <template v-else-if="activeHead == 1">
    <van-nav-bar>
      <template #left>
        <div class="assets_tabs flex justify-start items-center textColor1">
          <div v-for="i in headList1" :key="i" :class="i.key == activeHead1 ? 'textColor' : ''"
            @click="activeHead1 = i.key">
            {{ i.name }}
          </div>
        </div>
      </template>
    </van-nav-bar>
    <div class="assets_content1">
      <template v-if="activeHead1 == 1">
                <div class="assets_1">
                    {{ $t('资金账户') }}
                </div>
@@ -151,7 +165,7 @@
                </div>
            </template>
            <template v-else-if="activeHead == 2">
      <template v-else-if="activeHead1 == 2">
                <div class="assets_1">
                    {{ $t('交易账户') }}
                </div>
@@ -168,7 +182,107 @@
                </div>
            </template>
        </div>
    </div>
  <!-- <van-nav-bar>
           <template #left>
             <div class="assets_tabs flex justify-start items-center textColor1">
               <div v-for="i in headList" :key="i" :class="i.key == activeHead ? 'textColor' : ''"
                    @click="activeHead = i.key">
                 {{ i.name }}
               </div>
             </div>
           </template>
           <template #right v-if="activeHead != 0">
             <van-icon name="todo-list-o" class="textColor" @click="toPage('/cryptos/accountChange')" />
           </template>
         </van-nav-bar> -->
  <!-- <div class="flex-centerY"
         style="position: sticky;top: 0px;left: 0;height: 55px;width: 100%;background: white;z-index: 999;border-bottom: #f1f1f1 1px solid;padding: 0 20px">
      <div @click="showType=2" class="tab-item flex-center" :class="{'tab-item-select':showType==2}">
        {{ $t('总资产估值') }}
      </div>
      <div @click="showType=1" class="tab-item flex-center" :class="{'tab-item-select':showType==1}">
        {{ $t('资金账户') }}
      </div>
      <div @click="showType=3" class="tab-item flex-center" :class="{'tab-item-select':showType==3}">
        {{ $t('交易账户') }}
      </div>
    </div>
    <div class="assets_content">
      <div v-if="showType==2">
        <div class="assets_1">
          {{ $t('总资产估值') }}
        </div>
        <div class="assets_money mt-5 flex justify-start items-end">
          {{ currency.currency_symbol }}{{
            forexAssets?.money_contract ?
                (forexAssets?.money_contract * (currency.rate ?? 0)).toFixed(2) : '0.00'
          }}
          <div class="pricing_jj ml-5">
            {{ pricing }}
          </div>
          <van-dropdown-menu style="position: relative;top: .5rem;">
            <van-dropdown-item v-model="pricing" :options="pricingList" @change="changePricing">
              <div @click="toPage('/cryptos/exchangeRate')" class="text-center">{{ $t('更多') }}</div>
            </van-dropdown-item>
          </van-dropdown-menu>
        </div>
      </div>
      <div v-if="showType==3">
        <div class="assets_1">
          {{ $t('交易账户') }}
        </div>
        <div class="flex justify-between items-center">
          <div class="assets_money mt-5 flex justify-start items-end">
            ${{ assetObj.contract }}
            <span>USD</span>
          </div>
          <div class="assets_4" @click="toPage('/my/transfer')">
            <img :src="tabList[2].icon" alt="" v-if="theme == 'light'">
            <img :src="tabList[2].icon2" alt="" v-else>
            <p>{{ $t('划转') }}</p>
          </div>
        </div>
      </div>
      <div v-if="showType==1">
        <div class="assets_1">
          {{ $t('资金账户') }}
        </div>
        <div class="assets_money mt-5 flex justify-start items-end">
          ${{ assetObj.capital }}
          <span>USD</span>
        </div>
        <div class="assets_2 flex justify-around items-center">
          <div v-for="i in tabList" :key="i.key" @click="toPage(i.path)">
            <img :src="i.icon" alt="" v-if="theme == 'light'">
            <img :src="i.icon2" alt="" v-else>
            <div>{{ i.name }}</div>
          </div>
        </div>
      </div>
      <div class="assets_3">
        <div class="assets_3_head flex justify-between items-center">
          <span>{{ $t('名称') }}</span>
          <span>{{ $t('volumn') }}</span>
        </div>
        <div class="assets_3_item flex justify-between items-center" v-for="i in assetList" :key="i.id">
          <div class="flex justify-start items-center">
            <img :src="`${HOST_URL}/symbol/${i.symbol_data}.png`"/>
            <span class="ml-5">{{ i.symbol_data.toUpperCase() }}</span>
          </div>
          <div>
            <p>{{ i.volume ? Number(i.volume).toFixed(8) : '0.0' }}</p>
            <p>≈{{ currency.currency_symbol }}
              {{ i.usdt ? Number(i.usdt).toFixed(2) : '0.0' }}</p>
          </div>
        </div>
      </div>
    </div>
  </div> -->
</template>
<script setup>
@@ -191,16 +305,23 @@
const { t } = useI18n()
const activeNames = ref(['1'])
const { dispatch } = useStore();
const showType = ref(2)
const theme = ref(store.state.vant.theme) // 当前主题模式,白天(light)或夜间(dark)
const tabList = [
    {
        key: 1, name: t('充值'), icon: new URL(`@/assets/theme/white/image/assets/recharge.png`, import.meta.url),
        icon2: new URL(`@/assets/theme/dark/image/assets/recharge.png`, import.meta.url), path: '/cryptos/recharge/rechargeList?isForeign=true'
    key: 1,
    name: t('充值'),
    icon: new URL(`@/assets/theme/white/image/assets/recharge.png`, import.meta.url),
    icon2: new URL(`@/assets/theme/dark/image/assets/recharge.png`, import.meta.url),
    path: '/cryptos/recharge/rechargeList?isForeign=true'
    },
    {
        key: 2, name: t('提现'), icon: new URL(`@/assets/theme/white/image/assets/withdrawal.png`, import.meta.url),
        icon2: new URL(`@/assets/theme/dark/image/assets/withdrawal.png`, import.meta.url), path: '/cryptos/Withdraw/withdrawPage'
    key: 2,
    name: t('提现'),
    icon: new URL(`@/assets/theme/white/image/assets/withdrawal.png`, import.meta.url),
    icon2: new URL(`@/assets/theme/dark/image/assets/withdrawal.png`, import.meta.url),
    path: '/cryptos/Withdraw/withdrawPage'
    },
    {
        key: 3, name: t('划转'), icon: new URL(`@/assets/theme/white/image/assets/transfer.png`, import.meta.url),
@@ -279,12 +400,31 @@
const activeHead = ref(0)
const headList = [
    { name: t('总资产估值'), key: 0 },
  // { name: t('资金账户'), key: 1 },
  // { name: t('交易账户'), key: 2 },
]
// 中部切换项
const activeHead1 = ref(1)
const headList1 = [
    { name: t('资金账户'), key: 1 },
    { name: t('交易账户'), key: 2 },
]
</script>
<style lang="scss" scoped>
.tab-item {
  height: 100%;
  font-size: 16px;
  color: #999;
  margin-right: 10px;
}
.tab-item-select {
  color: #111;
}
.assets {
    min-height: 100vh;
    font-size: 1.4rem;
@@ -303,8 +443,15 @@
        }
    }
  .assets_content,
  .assets_content1 {
    padding: 16px 16px;
  }
    .assets_content {
        padding: 16px 16px 10rem;
    @include themify() {
      border-bottom: themed("divi_line") solid 1px;
    }
    }
    .assets_1 {