1

李凌

5 days ago 349c48e168b9f2580334422228acde7d1b21bede

 src/views/cryptos/FinancialHistory/index.vue

@@ -15,28 +15,26 @@
        <van-pull-refresh :pulling-text="$t('下拉即可刷新')" :loosing-text="$t('释放即可刷新')" :loading-text="$t('加载中')"
          v-model="isLoading" @refresh="onRefresh">
          <van-list v-model:loading="loading" :finished="finished" @load="onLoad" :loading-text="$t('加载中')">
            <div v-for="(item, index) in list" :key="'buy' + index">
              <div class="box-border px-33">
                <div class="flex justify-between items-center h-110 font-31 font-400">
                  <div class="text-grey">{{ $t('时间') }}</div>
                  <div class="textColor"> {{ item.create_time }}</div>
            <div v-for="(item, index) in list" :key="'buy' + index" class="history-card-wrap">
              <div class="history-card" @click="type === 1 ? handleGoOrderDetail(item) : null">
                <div class="history-row">
                  <span class="history-label">{{ $t('时间') }}</span>
                  <span class="history-value">{{ item.create_time }}</span>
                </div>
                <div class="flex justify-between items-center h-110 font-31 font-400">
                  <div class="text-grey">{{ $t('数量') }}</div>
                  <div class="textColor">{{ item.amount }}&nbsp;USDT</div>
                <div class="history-row">
                  <span class="history-label">{{ $t('数量') }}</span>
                  <span class="history-value">{{ item.amount }} USDT</span>
                </div>
                <div class="flex justify-between items-center h-110 font-31 font-400">
                  <div class="text-grey">{{ $t('周期') }}</div>
                  <div class="textColor"> {{ item.cycle == 0 ? $t('无限期') : item.cycle + $t('天') }}</div>
                <div class="history-row">
                  <span class="history-label">{{ type === 1 && !isMinerTest(item.test) ? $t('可解锁周期') : $t('周期') }}</span>
                  <span class="history-value">{{ item.cycle == 0 ? $t('无限期') : item.cycle + (type === 1 && !isMinerTest(item.test) ? $t('分钟') : $t('天')) }}</span>
                </div>
                <div class="flex justify-between items-center h-110 font-31 font-400">
                  <div class="text-grey">{{ $t('累计收益') }}</div>
                  <div class="textColor" :class="item.profit / 1 > 0 ? 'text-green' : 'text-red'"> {{ item.profit }}
                  </div>
                <div class="history-row">
                  <span class="history-label">{{ $t('累计收益') }}</span>
                  <span class="history-value" :class="item.profit / 1 > 0 ? 'text-green' : 'text-red'">{{ item.profit }}</span>
                </div>

                <div v-if="type === 1" class="history-tip">{{ $t('点击查看详情') }}</div>
              </div>
              <div class="contBackground h-12"></div>
            </div>
          </van-list>
        </van-pull-refresh>
@@ -58,20 +56,19 @@
        <van-pull-refresh :pulling-text="$t('下拉即可刷新')" :loosing-text="$t('释放即可刷新')" :loading-text="$t('加载中')"
          v-model="isLoading" @refresh="onRefresh">
          <van-list v-model:loading="loading" :finished="finished" :finished-text="$t('没有更多了')" @load="onLoad">
            <div v-for="(item, index) in list" :key="'interest' + index">
              <div class="flex justify-between items-center h-150 px-33">
            <div v-for="(item, index) in list" :key="'interest' + index" class="history-card-wrap">
              <div class="interest-row">
                <div class="flex items-center">
                  <img v-if="item.amount / 1 > 0 ? false : true" :src="require('@/assets/image/assets-center/out.png')"
                    alt="" class="w-44 h-44 mr-30">
                  <img v-else :src="require('@/assets/image/assets-center/in.png')" alt="" class="w-44 h-44 mr-30">
                    alt="" class="interest-icon">
                  <img v-else :src="require('@/assets/image/assets-center/in.png')" alt="" class="interest-icon">
                  <div class="flex flex-col">
                    <div class="mb-17 font-32 font-400 textColor">{{ $t('利息数量') }}（USDT）</div>
                    <div class="text-grey font-27">{{ item.createTimeStr }}</div>
                    <div class="interest-title">{{ $t('利息数量') }}（USDT）</div>
                    <div class="interest-time">{{ item.createTimeStr }}</div>
                  </div>
                </div>
                <div class="font-31" :class="item.amount / 1 > 0 ? 'text-green' : 'text-red'">{{ item.amount }}</div>
                <div class="interest-amount" :class="item.amount / 1 > 0 ? 'text-green' : 'text-red'">{{ item.amount }}</div>
              </div>
              <div class="contBackground h-2"></div>
            </div>
          </van-list>
        </van-pull-refresh>
@@ -87,6 +84,7 @@
import { getfinacialProductsBought, getMachineBought } from '@/service/financialManagement.api.js';
import { _fundRecord } from '@/service/fund.api';
import financialList from "@/components/Transform/assetsCenter/financialList.vue";
import { isMinerTest } from '@/utils/index.js'
export default {
  name: "index",
  components: {
@@ -111,6 +109,7 @@
    }
  },
  methods: {
    isMinerTest,
    handleGoOrderDetail(item) {
      if (this.type === 0) {
        this.$router.push({
@@ -215,6 +214,8 @@
</script>

<style lang="scss" scoped>
@import '@/assets/init.scss';

.MiningPoolFinanceHistory {
  width: 100%;
  box-sizing: border-box;
@@ -223,8 +224,107 @@
    background-color: $main_background;
  }

  :deep(.van-tab) {
    font-size: 32px;
  }

  :deep(.van-tab--active) {
    color: $text_color;
    font-weight: 600;
  }
}

.history-card-wrap {
  padding: 16px 32px 0;
}

.history-card {
  padding: 28px 28px 24px;
  border-radius: 20px;
  @include themify() {
    background: themed('cont_background');
  }
}

.history-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 20px;
  padding: 18px 0;
  font-size: 32px;
  line-height: 1.45;

  & + & {
    @include themify() {
      border-top: 1px solid themed('line_color');
    }
  }
}

.history-label {
  flex-shrink: 0;
  @include themify() {
    color: themed('text_color1');
  }
}

.history-value {
  text-align: right;
  font-weight: 500;
  word-break: break-all;
  @include themify() {
    color: themed('text_color');
  }
}

.history-tip {
  margin-top: 12px;
  padding-top: 16px;
  text-align: center;
  font-size: 28px;
  color: #004aee;
  @include themify() {
    border-top: 1px solid themed('line_color');
  }
}

.interest-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 16px 32px 0;
  padding: 28px;
  border-radius: 20px;
  @include themify() {
    background: themed('cont_background');
  }
}

.interest-icon {
  width: 52px;
  height: 52px;
  margin-right: 24px;
}

.interest-title {
  margin-bottom: 12px;
  font-size: 34px;
  font-weight: 500;
  @include themify() {
    color: themed('text_color');
  }
}

.interest-time {
  font-size: 28px;
  @include themify() {
    color: themed('text_color1');
  }
}

.interest-amount {
  font-size: 40px;
  font-weight: 600;
}
</style>