其他人改的版本

李凌

2025-10-15 7fc6bfe900790ec7c92bce85d5b20a95fbc06e65

 src/views/ICO/ico.vue

@@ -1,70 +1,76 @@
<template>
    <div class="ico">
        <fx-header>
            <template v-slot:title>
                <div>ICO</div>
            </template>
            <template v-slot:right>
                <van-icon name="todo-list-o" @click="$router.push('/ICO/icoRecord')" />
            </template>
        </fx-header>
  <div class="ico">
    <fx-header>
      <template v-slot:title>
        <div>ICO</div>
      </template>
      <template v-slot:right>
        <van-icon name="todo-list-o" @click="$router.push('/ICO/icoRecord')"/>
      </template>
    </fx-header>

        <div class="ico_list">
            <div class="ico_item mb-5" v-for="i in icoList" :key="i.id">
                <div class="item_1">
                    {{ i.symbol }} ({{ i.name }})
                </div>
                <div class="item_2 flex justify-between">
                    <div class="mr-5">{{ $t('申购时间') }}</div>
                    <div>{{ i.startDate }} ~ {{ i.endDate }}</div>
                </div>
                <div class="item_2 flex justify-between">
                    <div>{{ $t('listingDate') }}</div>
                    <div>{{ i.marketDate }}</div>
                </div>
                <div class="item_2 flex justify-between">
                    <div>{{ $t('每张金额') }}</div>
                    <div>{{ i.unitAmount }}</div>
                </div>
                <div class="item_2 flex justify-between">
                    <div>{{ $t('每张手续费') }}</div>
                    <div>{{ i.unitFee }}</div>
                </div>
                <div class="item_3 flex justify-center">
                    <van-button type="default" round size="large" @click="openBuy(i)">{{ $t('申购') }}</van-button>
                </div>
            </div>
    <div class="ico_list">
      <div class="ico_item mb-5" v-for="i in icoList" :key="i.id">
        <div class="item_1">
          <div>
            {{ i.symbol }}
          </div>
          <div class="item_1_1">
            {{ i.name }}
          </div>
        </div>


        <!-- 购买弹窗 -->
        <van-popup v-model:show="show" round>
            <div class="buy_popup">
                <div class="buy_title flex justify-center">{{ itemObj.symbol }}</div>

                <van-field v-model="sgNum" type="digit" :label="$t('申购数量')" />

                <div class="flex justify-center mt-5">
                    <van-button type="default" size="large" round @click="buy">{{ $t('confirm') }}</van-button>
                </div>
            </div>
        </van-popup>
        <div class="item_2 flex justify-between">
          <div>{{ $t('每张金额') }}</div>
          <div>{{ i.unitAmount }}</div>
        </div>
        <div class="item_2 flex justify-between">
          <div>{{ $t('每张手续费') }}</div>
          <div>{{ i.unitFee }}</div>
        </div>
        <div class="item_2 flex justify-between">
          <div class="mr-5">{{ $t('申购时间') }}</div>
          <div>{{ i.startDate }} ~ {{ i.endDate }}</div>
        </div>
        <div class="item_2 flex justify-between">
          <div>{{ $t('listingDate') }}</div>
          <div>{{ i.marketDate }}</div>
        </div>
        <div class="item_3 flex justify-center">
          <van-button type="default" round size="large" @click="openBuy(i)">{{ $t('申购') }}</van-button>
        </div>
      </div>
    </div>


    <!-- 购买弹窗 -->
    <van-popup v-model:show="show" round>
      <div class="buy_popup">
        <div class="buy_title flex justify-center">{{ itemObj.symbol }}</div>

        <van-field v-model="sgNum" type="digit" :label="$t('申购数量')"/>

        <div class="flex justify-center mt-5">
          <van-button type="default" size="large" round @click="buy">{{ $t('confirm') }}</van-button>
        </div>
      </div>
    </van-popup>
  </div>
</template>

<script setup>
import { ref } from "vue";
import { showToast } from 'vant'
import { _icoList, _icoSubscribe } from "@/service/ico.api.js";
import { useI18n } from "vue-i18n";
const { t } = useI18n()
import {ref} from "vue";
import {showToast} from 'vant'
import {_icoList, _icoSubscribe} from "@/service/ico.api.js";
import {useI18n} from "vue-i18n";

const {t} = useI18n()

// 获取列表
const icoList = ref([])
_icoList().then(res => {
    icoList.value = res.records
  icoList.value = res.records
}).catch(err => {
    showToast(err.msg)
  showToast(err.msg)
})

// 打开申购弹窗
@@ -72,78 +78,86 @@
const itemObj = ref({}) // ico列表项
const sgNum = ref(0) // 申购数量
const openBuy = (i) => {
    show.value = true
    itemObj.value = i
  show.value = true
  itemObj.value = i
}

// 申购
const buy = () => {
    let opt = {
        icoProjectId: itemObj.value.id,
        subscribeNums: sgNum.value,
        subscriptionType: 1,
    }
    _icoSubscribe(opt).then(res => {
        showToast(t('submitSuccess'))
        show.value = false
    }).catch(err => {
        showToast(err)
    })
  let opt = {
    icoProjectId: itemObj.value.id,
    subscribeNums: sgNum.value,
    subscriptionType: 1,
  }
  _icoSubscribe(opt).then(res => {
    showToast(t('submitSuccess'))
    show.value = false
  }).catch(err => {
    showToast(err)
  })
}

</script>

<style lang="scss" scoped>
.ico {
    padding: 0rem 1.2rem 2rem 1.2rem;
    font-size: 1.5rem;
  padding: 0rem 1.2rem 2rem 1.2rem;
  font-size: 1.5rem;

    .buy_popup {
        width: 40rem;
        padding: 1rem;
  .buy_popup {
    width: 40rem;
    padding: 1rem;

        .buy_title {
            font-size: 2.5rem;
            font-weight: 700;
            border-bottom: #aaa solid 1px;
            padding: 1rem;
        }
    .buy_title {
      font-size: 2.5rem;
      font-weight: 700;
      border-bottom: #aaa solid 1px;
      padding: 1rem;
    }
  }

    .ico_list {
        padding: 1rem 0rem;
  .ico_list {
    padding: 1rem 0rem;

        .ico_item {
            padding: .5rem 1rem;
            border: #aaa solid 1px;
            border-radius: 1rem;
    .ico_item {
      padding: .5rem 1rem;
      color: #999;
      font-size: 1.6rem;
      border: #eee solid 1px;
      border-radius:6px;
      //border: #aaa solid 1px;
      //border-radius: 1rem;

            @include themify() {
                background-color: themed("input_background");
            }
      @include themify() {
        //background-color: themed("input_background");
      }

            .item_1 {
                padding: 1rem .5rem;
                border-bottom: #ccc solid 1px;
                font-size: 2rem;
                font-weight: 700;
            }

            .item_2 {
                padding: 1rem .5rem;
                border-bottom: #ccc solid 1px;
                font-size: 1.6rem;
                font-weight: 500;

                &>div:last-child {
                    color: #999;
                }
            }

            .item_3 {
                padding: .5rem;
            }
      .item_1 {
        padding: 1rem .5rem;
        border-bottom: #eee solid 1px;
        font-size: 2.5rem;
        color: black;
        .item_1_1{
          color: #999;
          font-size: 2rem;
        }
      }

      .item_2 {
        padding: 1rem .5rem;
        font-size: 1.4rem;
        font-weight: 500;

        & > div:last-child {
          font-size: 1.7rem;
          color: #333;
        }
      }

      .item_3 {
        padding: .5rem;
      }
    }
  }
}
</style>
</style>