5.10航天ui交易所pc端,代码jiem-pc
lxf
2025-06-13 066ec67b7080f07a0e47dda9864ee6be2e4b9053
src/views/wealth/pledgeRecord.vue
New file
@@ -0,0 +1,238 @@
<template>
  <div class="router-view">
    <div class="trade">
      <div class="recharge_content">
        <el-tabs
          v-model="activeName"
          class="order-tab"
          @tab-click="handleClick"
        >
          <el-tab-pane
            v-for="(item, index) in labels"
            :key="index"
            :name="index"
            :label="item"
            name="financial"
          >
          </el-tab-pane>
          <div data-v-23118946="" class="head">
            <div data-v-23118946="">
              <div data-v-23118946="">{{ $t("message.user.ma51") }}</div>
              <div data-v-23118946="" class="value">
                <span data-v-23118946="">0</span
                ><span
                  data-v-23118946=""
                  style="font-size: 12px; color: rgba(255, 255, 255, 0.7)"
                >
                  USDT</span
                >
              </div>
            </div>
            <div data-v-23118946="">
              <div data-v-23118946="">{{ $t("message.user.ma52") }}</div>
              <div data-v-23118946="" class="value">0</div>
            </div>
            <div data-v-23118946="">
              <div data-v-23118946="">{{ $t("message.user.leijishouyi") }}</div>
              <div data-v-23118946="" class="value">0</div>
            </div>
            <div data-v-23118946="">
              <div data-v-23118946="">{{ $t("message.user.ma53") }}</div>
              <div data-v-23118946="" class="value">0</div>
            </div>
          </div>
          <el-table :data="tableData" class="width100">
            <el-table-column
              prop="close_timeStr"
              :label="$t('message.user.shijian')"
              :empty-text="$t('message.home.noData')"
            ></el-table-column>
            <el-table-column
              prop="amount"
              :label="
                $t('message.user.tuoguanshijian') +
                '/' +
                $t('message.user.tuoguanjine')
              "
            >
              <template #default="scope">
                <div>
                  <span class="green">{{ scope.row.amount }} (USDT)</span>
                  <span>
                    {{ scope.row.cycle }} {{ $t("message.user.tian") }}</span
                  >
                </div>
              </template>
            </el-table-column>
            <el-table-column
              prop="daily_rate"
              :label="$t('message.user.dangrishouyi')"
            >
              <template #default="scope">
                <div>{{ scope.row.daily_rate }} %</div>
              </template>
            </el-table-column>
            <el-table-column
              prop="symbol_to"
              :label="$t('message.user.yihuoli')"
            >
              <template #default="scope">
                <div>{{ scope.row.profit }}(USDT)</div>
              </template>
            </el-table-column>
            <el-table-column
              prop="symbol_to"
              :label="$t('message.user.shengyutianshu')"
            >
              <template #default="scope">
                <div>{{ scope.row.days }} {{ $t("message.user.tian") }}</div>
              </template>
            </el-table-column>
            <!-- <el-table-column prop="state" label="操作">
                        <template #default="scope">
                            <el-button @click="goDetail(scope.row.order_no)">详情</el-button>
                        </template>
                    </el-table-column>           -->
          </el-table>
        </el-tabs>
      </div>
    </div>
  </div>
  <footer-view></footer-view>
</template>
<script>
import { getFinanceOrder, getMinerOrder } from "@/api/order.js";
export default {
  name: "financialHistory",
  data() {
    return {
      activeName: 0,
      labels: [this.$t("message.user.ma49"), this.$t("message.user.ma50")],
      tableData: [],
      mineData: [],
    };
  },
  mounted() {
    // if (this.$route.query.type) {
    //   this.activeName = this.$route.query.type;
    // }
    let spToken = localStorage.getItem("spToken");
    if (spToken) {
      this.getList();
      this.getMineList();
    }
  },
  methods: {
    handleClick(tab, event) {
      console.log(tab, event);
    },
    // TODO 接口404
    //基金理财列表,state=2为已赎回的
    async getList() {
      const res = await getFinanceOrder({
        state: 2,
        page_no: 1,
      });
      this.tableData = res.data;
    },
    //矿池锁仓列表,state=2为已解锁的
    async getMineList() {
      const res = await getMinerOrder({
        state: 2,
        page_no: 1,
      });
      this.mineData = res.data;
    },
    //理财详情
    goDetail() {},
    //矿池详情
    goMineDetail() {},
    //给表头设置边框线
    getRowClass({ rowIndex, columnIndex }) {
      if (rowIndex == 0) {
        return "border-top:1px solid #EBEEF5";
      }
    },
    getLocalLan() {
      var lang = JSON.parse(localStorage.getItem("lang"));
      // 简体中文:miner_name,繁体:miner_name_cn miner_name_en
      if (lang == "en") {
        return "miner_name_en";
      } else if (lang == "cht") {
        return "miner_name_cn";
      } else if (lang == "zh-CN") {
        return "miner_name";
      }
      return "miner_name_en";
    },
  },
};
</script>
<style scoped>
.router-view {
  flex: 1;
  background-color: #000;
}
.trade {
  min-height: 700px;
  background: #000;
  padding-bottom: 16px;
  padding-top: 28px;
}
.trade .recharge_content {
  max-width: 1232px;
  min-width: 976px;
  margin: 0 auto;
  color: #fff;
}
.head[data-v-23118946] {
  padding: 32px;
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  border-radius: 16px;
  background: linear-gradient(to bottom right, #f7b328, #1e2129);
  font-size: 14px;
  color: #ffffffb3;
  margin-bottom: 20px;
  .value[data-v-23118946] {
    margin-top: 12px;
    font-size: 30px;
    color: #fff;
  }
}
/deep/ .el-table {
  border-radius: 8px;
  padding: 16px;
  background-color: #1b1e26 !important;
}
/deep/ .el-table th.el-table__cell {
  background-color: #1b1e26 !important;
  border-bottom: none !important;
}
/deep/ .el-table__inner-wrapper:before {
  background-color: #1b1e26 !important;
}
/deep/ .el-tabs__nav-wrap:after {
  background-color: #000 !important;
}
/deep/ .el-tabs__item,
/deep/ .el-tabs__item:hover {
  color: #b1b1b1 !important;
  font-size: 18px;
}
/deep/ .el-tabs__item.is-active {
  color: #f7b328 !important;
  font-size: 18px !important;
  font-weight: 600;
}
</style>