lxf
2025-07-11 2a95677853ec636b4c568d0045a8bb1d4ef13097
src/views/cryptos/Funds/newIndex.vue
@@ -1,89 +1,179 @@
<template>
  <div>
  <assets-head :title="t('资金账户')" :back-func="backFunc" ></assets-head>
    <assets-head :title="t('资金账户')" :back-func="backFunc"></assets-head>
  <div class="px-17">
    <div class="flex items-center justify-between">
      <div class="text-25 font-bold">Defi質押流動性挖礦</div>
      <img class="w-64 h-57 ml-90 flex-none" src="@/assets/imgs/icon-mining.png" draggable="false">
    </div>
    <div class="h-182 mt-20 pt-28 px-19 box-border text-white bgimg">
      <div class="flex justify-between items-center">
        <div class="text-11">{{ t('托管金额') }}</div>
        <img class="w-17 h-17" src="@/assets/imgs/icon-income.png" draggable="false">
    <div class="px-17">
      <div class="flex items-center justify-between">
        <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>
      <div class="text-34 font-bold mt-5 block">{{ statiscis.amount_sum || 0 }}</div>
      <div class="flex justify-between my-20 text-center text-16">
        <div>
          <div>{{ t('累计收益') }}</div>
          <div class="text-20">{{ statiscis.aready_profit || 0 }}</div>
      <div class="h-182 mt-20 pt-28 px-19 box-border text-white bgimg">
        <div class="flex justify-between items-center">
          <div class="text-11">{{ t('托管金额') }}</div>
          <img class="w-17 h-17" src="@/assets/imgs/icon-income.png" draggable="false">
        </div>
        <div>
          <div>{{ t('预计日收益') }}</div>
          <div class="text-20">{{ statiscis.today_profit || 0 }}</div>
        </div>
        <div>
          <div>{{ t('托管订单') }}</div>
          <div class="text-20">{{ statiscis.order_sum || 0 }}</div>
        <div class="text-34 font-bold mt-5 block">{{ statiscis.amount_sum || 0 }}</div>
        <div class="flex justify-between my-20 text-center text-16">
          <div>
            <div>{{ t('累计收益') }}</div>
            <div class="text-20">{{ statiscis.aready_profit || 0 }}</div>
          </div>
          <div>
            <div>{{ t('预计日收益') }}</div>
            <div class="text-20">{{ statiscis.today_profit || 0 }}</div>
          </div>
          <div>
            <div>{{ t('托管订单') }}</div>
            <div class="text-20">{{ statiscis.order_sum || 0 }}</div>
          </div>
        </div>
      </div>
    </div>
    <div class="mt-15">
      <div class="text-16">鎖倉挖礦</div>
      <div class="mt-15">
        <div class="h-100 box-border p-15 mb-10 bgimg1">
          <div class="flex items-center justify-between">
            <div class="text-17 font-bold">01</div>
            <div class="text-16 font-bold">5天</div>
          </div>
          <div class="flex mt-5">
            <div>
              <div class="text-11">效益</div>
              <div class="text-16">0.003% - 0.004%</div>
        <div class="text-16">{{ $t('去挖矿') }}</div>
        <div class="mt-15">
          <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{{ $t('天') }}</div>
            </div>
            <div class="ml-30">
              <div class="text-11">可投金額</div>
              <div class="text-16">1000 - 100000</div>
            <div class="flex mt-5">
              <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">{{ $t('可投金额') }}</div>
                <div class="text-16">1000 - 100000</div>
              </div>
            </div>
          </div>
        </div>
        <div class="h-100 box-border p-15 mb-10 bgimg1">
          <div class="flex items-center justify-between">
            <div class="text-17 font-bold">02</div>
            <div class="text-16 font-bold">17天</div>
          </div>
          <div class="flex mt-5">
            <div>
              <div class="text-11">效益</div>
              <div class="text-16">0.004% - 0.005%</div>
          <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>
            <div class="ml-30">
              <div class="text-11">可投金額</div>
              <div class="text-16">10000 - 10000000</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{{ $t('天') }}</div>
            </div>
            <div class="flex mt-5">
              <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">{{ $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>
  </div>
</div>
</template>
<script setup>
import { financeStatics} from '@/service/financialManagement.api.js'
import { financeStatics } from '@/service/financialManagement.api.js'
import { ref, onMounted } from 'vue';
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();
@@ -91,6 +181,15 @@
const backFunc = () => {
  router.back();
}
const handleBuy = () => {
  if (!amount.value) {
    uni.showToast({ title: t('请输入购买金额'), icon: 'none' });
    return;
  }
  // 这里可以添加购买逻辑的API调用
  console.log('购买金额:', amount.value);
}
@@ -102,6 +201,14 @@
  })
}
const openPopup = (type) => {
  if (type === 1) {
    onShow1.value = false
  } else if (type === 2) {
    onShow2.value = false
  }
}
</script>
<style lang="scss" scoped>
@@ -110,14 +217,12 @@
.bgimg {
  background: url('@/assets/imgs/mining-card.png') no-repeat;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-repeat: no-repeat;
}
.bgimg1 {
  background: url('@/assets/imgs/mining-bg.png') no-repeat;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-repeat: no-repeat;
}
</style>