5.10航天ui交易所pc端,代码jiem-pc
lxf
2025-06-13 066ec67b7080f07a0e47dda9864ee6be2e4b9053
src/views/wealth/newLockMiner.vue
New file
@@ -0,0 +1,232 @@
<!-- 矿池锁仓页面 -->
<template>
<div>
  <div style="background-color: #111214">
    <!-- <div class="miner-background"></div> -->
    <div class="router-view">
      <section class="container">
        <section class="header">
          <p class="header-title">{{ $t("message.user.ma54") }}</p>
          <button aria-disabled="false" type="button" class="el-button header-btn">
            <i class="el-icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024">
                <path fill="currentColor"
                  d="M832 384H576V128H192v768h640zm-26.496-64L640 154.496V320zM160 64h480l256 256v608a32 32 0 0 1-32 32H160a32 32 0 0 1-32-32V96a32 32 0 0 1 32-32m160 448h384v64H320zm0-192h160v64H320zm0 384h384v64H320z">
                </path>
              </svg></i>
            <span class="" @click="goRouter('/pledgeRecord')">{{ $t("message.user.ma55") }}</span>
          </button>
        </section>
        <section class="content">
          <p class="content-subtitle">{{ $t("message.user.ma56") }}</p>
          <p class="content-desc">{{ $t("message.user.ma57") }}</p>
          <p class="content-subtitle">{{ $t("message.user.ma58") }}</p>
          <div class="plane">
            <div class="plane-info">
              <p class="plane-info__title">{{ $t("message.user.ma59") }}</p>
              <p class="plane-info__desc">{{ $t("message.user.ma60") }}</p>
            </div>
            <div class="plane-info">
              <p class="plane-info__title">{{ $t("message.user.ma61") }}</p>
              <p class="plane-info__desc">{{ $t("message.user.ma62") }}</p>
            </div>
          </div>
          <p class="content-subtitle">{{ $t("message.user.ma63") }}</p>
          <p class="content-desc">
            <span>1. {{ $t("message.user.ma64") }}</span>
            <span>2. {{ $t("message.user.ma65") }}</span>
            <span>3. {{ $t("message.user.ma66") }}</span>
            <span>4. {{ $t("message.user.ma67") }}</span>
          <div class="content-desc">
            <p class="title1">{{ $t("message.user.ma68") }}</p>
            <span>{{ $t("message.user.ma69") }}</span>
            <p class="title1">{{ $t("message.user.ma70") }}</p>
            <span>1. {{ $t("message.user.ma71") }}</span>
            <span>2. {{ $t("message.user.ma72") }}</span>
            <span>3. {{ $t("message.user.ma73") }}</span>
            <span>4. {{ $t("message.user.ma74") }}</span>
            <span>5. {{ $t("message.user.ma75") }}</span>
          </div>
          </p>
        </section>
        <section class="list-container">
          <ul class="list"></ul>
        </section><!---->
      </section>
    </div>
  </div>
  <footer-view></footer-view>
</div>
</template>
<script>
export default {
  data() {
    return {
      language: "zh-CN",
    };
  },
  methods: {
    goRouter(parmas) {
        this.$router.push(parmas);
    },
  },
};
</script>
<style scoped>
@import url(./wealth.css);
.el-table>>>.el-table thead {
  font-size: 15px !important;
}
/* .en-btn-style{
    position: relative;
    top:30px;
} */
input[type="checkbox"] {
  border: 1px solid #ffffff;
}
.css-search-3 {
  background-color: #111214;
}
/* 改变表格背景颜色 */
/deep/ .el-table__cell {
  background: #111214 !important;
  /* 你想要的颜色 */
}
.collapse {
  border-top: none;
  border-bottom-color: #111214;
}
/deep/ .el-collapse-item__header {
  background-color: #111214;
  color: white;
}
/deep/ .el-collapse-item__content {
  font-size: 15px;
  background-color: #111214;
  color: rgb(185, 185, 185);
}
/deep/ .el-table__empty-block {
  background-color: #111214;
}
.css-search-3 input {
  color: #fff;
  font-size: 14px;
}
.router-view {
  flex: 1;
  background-color: #000;
}
.container {
  background-color: #000;
  width: 1232px;
  padding: 24px 16px 16px;
  margin: auto;
  .list {
    display: flex;
    flex-wrap: wrap;
    color: #fff;
  }
}
.header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 80px;
  margin-bottom: 16px;
  .header-title {
    font-size: 36px;
    color: #fff;
  }
  .header-btn {
    min-width: 114px;
    line-height: 40px;
    height: 40px;
    font-size: 16px;
    background-color: transparent;
    border: 1px solid #fff;
    color: #fff;
  }
  .el-button [class*=el-icon]+span {
    margin-left: 6px;
  }
  .el-button>span {
    align-items: center;
    display: inline-flex;
  }
}
.content {
  color: #fff;
  padding: 24px 0;
  .content-subtitle {
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
    margin-bottom: 12px;
    margin-top: 24px;
  }
  .plane {
    display: flex;
    justify-content: space-between;
    align-items: center;
    .plane-info {
      flex: 1 0 49%;
      max-width: 500px;
      padding: 16px;
      box-sizing: border-box;
      border-radius: 12px;
      background-color: #1e2129;
      text-align: center;
    }
    .plane-info__title {
      font-size: 24px;
      line-height: 32px;
      color: #f7b328;
    }
    .plane-info__desc {
      color: #ececec;
      line-height: 24px;
    }
  }
  .content-subtitle {
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
    margin-bottom: 12px;
    margin-top: 24px;
  }
}
.content-desc {
  font-size: 14px;
  color: #989898;
}
</style>