个人添加图片

lxf

2025-07-16 8588fe30f17d0d28190a279aab8675de0dbf1a5b

 src/components/Transform/popup-delivery/index.vue

@@ -1,9 +1,9 @@
<template>
  <div id="cryptos">
    <div class="popup-delivery w-700 font-28 rounded-2xl overflow-hidden">
    <div class="popup-delivery w-500 font-28 rounded-2xl overflow-hidden" style="padding: 10px;height: 90%;">
      <div class="border-b-color pt-54 pb-36 relative textColor">
        <h1 class="font-38 px-32">{{ detailData.name }} {{ $t('交割') }}</h1>
        <img src="@/assets/image/icon-close.png" class="w-38 h-38 absolute right-10 top-10" @click="onClose" />
        <h1 class="font-38 px-32">{{ detailData.name }} {{ $t('兑换') }}</h1>
        <!-- <img src="@/assets/image/icon-close.png" class="w-38 h-38 absolute right-10 top-10" @click="onClose" /> -->
      </div>
      <div class="flex justify-center mt-45" v-if="!(detailData.state === 'created')">
        <!-- {{detailData.time_num}} -->
@@ -17,8 +17,10 @@
        </van-circle>
      </div>
      <div class="mt-45 font-50 text-center"
        :class="{ 'text-green': detailData.profit_state === '1', 'text-red': detailData.profit_state === '0' }" v-else>{{
          $t('盈亏') }}<span>{{ detailData.profit_state === '1' ? '+' : '' }}{{ detailData.profit }}</span> {{ routeType == 'cryptos' ? 'USDT' : 'USD' }}</div>
        :class="{ 'text-green': detailData.profit_state === '1', 'text-red': detailData.profit_state === '0' }" v-else>
        {{
          $t('服务费') }}<span>{{ detailData.profit_state === '1' ? '+' : '' }}{{ detailData.profit }}</span> {{ routeType ==
          'cryptos' ? 'USDT' : 'USD' }}</div>
      <ul class="flex flex-col pb-61 textColor">
        <li v-for="item in listItem" :key="item.id" class="flex justify-between px-38 mt-28">
          <p class="text-grey font-30">{{ item.text }}</p>
@@ -37,12 +39,12 @@
          <p class="font-30 " :class="colorChoose(item)" v-else>{{ handleBuyWord(item) }}</p>
        </li>
      </ul>
      <div v-if="showBtns" class="flex justify-between text-white px-38 pb-61">
      <div v-if="showBtns" class="flex justify-center text-white px-38 pb-61">
        <p :class="{ 'btnMain': detailData.state !== 'created', 'bgDark': detailData.state === 'created' }"
          class="w-255 h-90 rounded-lg flex justify-center items-center mr-20" @click="onClose">{{ $t('关闭') }}</p>
        <p @click="continueToBuy"
        <!-- <p @click="continueToBuy"
          :class="{ 'btnMain': detailData.state === 'created', 'bgDark': detailData.state !== 'created', 'disableBtn': disabled }"
          class="w-385 h-90 rounded-lg flex justify-center items-center">{{ $t('继续下单') }}</p>
          class="w-385 h-90 rounded-lg flex justify-center items-center">{{ $t('继续下单') }}</p> -->
      </div>
    </div>
  </div>
@@ -109,7 +111,7 @@
        { id: 2, text: this.detailData.state !== 'created' ? this.$t('现价') : this.$t('结算价格'), key: 'close_price' },
        { id: 3, text: this.$t('方向'), key: 'direction' },
        { id: 4, text: this.$t('数量'), key: 'amount', extro: this.routeType == 'cryptos' ? 'USDT' : 'USD' },
        { id: 5, text: this.$t('交割时间'), key: 'settlement_time' }
        { id: 5, text: this.$t('兑换时间'), key: 'settlement_time' }
      ]
    }
  },
@@ -138,14 +140,15 @@
      //     {id: 4, text: '数量', key: 'amount', extro: 'USDT'},
      //     {id: 5, text: '交割时间', key: 'settlement_time'}
      // ]
      routeType:'cryptos'
      routeType: 'cryptos'
    }
  },
  methods: {
    continueToBuy() {
      if (this.detailData.state !== 'created') {
        return
      }
      console.log('detailData: ', this.detailData)
      // if (this.detailData.state !== 'created') {
      //   return
      // }
      this.$emit('continueToBuy', this.detailData)

      //this.$router.push(`/trendDetails/${symbol}`)
@@ -153,9 +156,9 @@
    handleBuyWord(item) {
      if (item.id === 3) {
        if (this.detailData.direction === 'buy') {
          return this.$t('开多')
          return this.$t('买入')
        } else {
          return this.$t('开空')
          return this.$t('卖出')
        }
      } else if (item.key === 'settlement_time') {
        return this.detailData.time_num + this.detailData.time_unit