理财，翻译

lxf

2025-07-10 71a2d3db051347d5ed4376b90cdff756cf11ca84

 src/views/cryptos/Funds/newIndex.vue

@@ -4,7 +4,7 @@

  <div class="px-17">
    <div class="flex items-center justify-between">
      <div class="text-25 font-bold">Defi質押流動性挖礦</div>
        <div class="text-25 font-bold">{{ $t('Defi质押流动性挖矿') }}</div>
      <img class="w-64 h-57 ml-90 flex-none" src="@/assets/imgs/icon-mining.png" draggable="false">
    </div>

@@ -32,42 +32,128 @@
    </div>

    <div class="mt-15">
      <div class="text-16">鎖倉挖礦</div>
        <div class="text-16">{{ $t('去挖矿') }}</div>
      
      <div class="mt-15">
        <div class="h-100 box-border p-15 mb-10 bgimg1">
          <div class="h-100 box-border p-15 mb-10 bgimg1" @click="() => { onShow1 = true }">
          <div class="flex items-center justify-between">
            <div class="text-17 font-bold">01</div>
            <div class="text-16 font-bold">5天</div>
              <div class="text-16 font-bold">5{{ $t('天') }}</div>
          </div>
          <div class="flex mt-5">
            <div>
              <div class="text-11">效益</div>
                <div class="text-11">{{ $t('效益') }}</div>
              <div class="text-16">0.003% - 0.004%</div>
            </div>
            <div class="ml-30">
              <div class="text-11">可投金額</div>
                <div class="text-11">{{ $t('可投金额') }}</div>
              <div class="text-16">1000 - 100000</div>
            </div>
          </div>
        </div>
 
        <div class="h-100 box-border p-15 mb-10 bgimg1">
          <van-action-sheet v-model:show="onShow1">
            <div class="content">
              <div class="py-25 px-18 bg-white rounded-t-20">
                <span class="text-27 font-bold">
                  <span>01</span>
                </span>
                <div class="mt-10 pb-15 border-b-1 border-b-dashed border-#ccc">
                  <div class="flex items-center justify-between text-15">
                    <span data-i18n="cycle" style="font-weight: 600;">{{ $t('周期') }}</span>
                    <span>5</span>
                  </div>
                  <div class="flex items-center justify-between text-15">
                    <span data-i18n="benefit" style="font-weight: 600;">{{ $t('效益') }}</span>
                    <span>0.003-0.004%</span>
                  </div>
                  <div class="flex items-center justify-between text-15">
                    <span data-i18n="purchaseLimit" style="font-weight: 600;">{{ $t("购买数量") }}</span>
                    <span>99999</span>
                  </div>
                </div>
                <div class="mt-15">
                  <div class="flex items-center justify-between text-15">
                    <span data-i18n="amountLimit" style="font-weight: 600;">{{ $t('限额') }}</span>
                    <span>1000-100000</span>
                  </div>
                  <input class="mt-5 rounded-5 py-9 px-16 text-right text-24 font-700"
                    style="border: 0.5px solid rgba(0, 0, 0, 0.2);width: 100%;" type="number" maxlength="140" step="any"
                    enterkeyhint="done" autocomplete="off" id="investmentAmount" name="investmentAmount" />
                </div>
                <div class="mt-60">
                  <span class="text-15 text-#9c9c9c ">
                    <span data-i18n="expectedReturn">
                      {{ $t('预期收益') }}:
                    </span>0</span>
                  <div class="mt-5 h-55 leading-55 bg-#333 text-19 rounded-5 text-center text-white"
                    @click="openPopup(1)">
                    {{ $t('购买') }}
                  </div>
                </div>
              </div>
            </div>
          </van-action-sheet>

          <div class="h-100 box-border p-15 mb-10 bgimg1" @click="() => { onShow2 = true }">
          <div class="flex items-center justify-between">
            <div class="text-17 font-bold">02</div>
            <div class="text-16 font-bold">17天</div>
              <div class="text-16 font-bold">17{{ $t('天') }}</div>
          </div>
          <div class="flex mt-5">
            <div>
              <div class="text-11">效益</div>
                <div class="text-11">{{ $t('效益') }}</div>
              <div class="text-16">0.004% - 0.005%</div>
            </div>
            <div class="ml-30">
              <div class="text-11">可投金額</div>
                <div class="text-11">{{ $t('可投金额') }}</div>
              <div class="text-16">10000 - 10000000</div>
            </div>
          </div>
        </div>

          <van-action-sheet v-model:show="onShow2" title="标题">
            <div class="content">
              <div class="py-25 px-18 bg-white rounded-t-20">
                <span class="text-27 font-bold">
                  <span>02</span>
                </span>
                <div class="mt-10 pb-15 border-b-1 border-b-dashed border-#ccc">
                  <div class="flex items-center justify-between text-15">
                    <span data-i18n="cycle" style="font-weight: 600;">{{ $t('周期') }}</span>
                    <span>17</span>
                  </div>
                  <div class="flex items-center justify-between text-15">
                    <span data-i18n="benefit" style="font-weight: 600;">{{ $t('效益') }}</span>
                    <span>0.004-0.005%</span>
                  </div>
                  <div class="flex items-center justify-between text-15">
                    <span data-i18n="purchaseLimit" style="font-weight: 600;">{{ $t("购买数量") }}</span>
                    <span>99999</span>
                  </div>
                </div>
                <div class="mt-15">
                  <div class="flex items-center justify-between text-15">
                    <span data-i18n="amountLimit" style="font-weight: 600;">{{ $t('限额') }}</span>
                    <span>10000-10000000</span>
                  </div>
                  <input class="mt-5 rounded-5 py-9 px-16 text-right text-24 font-700"
                    style="border: 0.5px solid rgba(0, 0, 0, 0.2);width: 100%;" type="number" maxlength="140" step="any"
                    enterkeyhint="done" autocomplete="off" id="investmentAmount" name="investmentAmount" />
                </div>
                <div class="mt-60">
                  <span class="text-15 text-#9c9c9c ">
                    <span data-i18n="expectedReturn">
                      {{ $t('预期收益') }}:
                    </span>0</span>
                  <div class="mt-5 h-55 leading-55 bg-#333 text-19 rounded-5 text-center text-white"
                    @click="openPopup(2)">
                    {{ $t('购买') }}
                  </div>
                </div>
              </div>
            </div>
          </van-action-sheet>
      </div>
    </div>
  </div>
@@ -81,9 +167,13 @@
import { useI18n } from 'vue-i18n';
const { t } = useI18n();
import { useRouter } from 'vue-router';
import fa from '../../../i18n/fa';
const router = useRouter();

const statiscis = ref({});
const amount = ref('');
const onShow1 = ref(false);
const onShow2 = ref(false);

onMounted(() => {
  getFinancialData();
@@ -93,6 +183,15 @@
  router.back();
}

const handleBuy = () => {
  if (!amount.value) {
    uni.showToast({ title: t('请输入购买金额'), icon: 'none' });
    return;
  }
  // 这里可以添加购买逻辑的API调用
  console.log('购买金额:', amount.value);
}


const getFinancialData = () => {
  // 获取理财数据
@@ -100,6 +199,14 @@
    //console.log('理财统计', res)
    statiscis.value = res
  })
}

const openPopup = (type) => {
  if (type === 1) {
    onShow1.value = false
  } else if (type === 2) {
    onShow2.value = false
  }
}

</script>
@@ -118,6 +225,4 @@
  background-size: 100% 100%;
  background-repeat: no-repeat; 
}


</style>