0510航天交易所ui仿制,代码使用的jiem
lxf
2025-05-19 45190f969dd8c7d3d2c6e366694f0dadc5ea07e8
src/page/perpetualContract/perpetualHistory.vue
@@ -2,7 +2,7 @@
  <!-- U本位合约历史 -->
  <div class="perpetualHistory">
    <assets-head
      :title="$t('U本位合约历史')"
      :title="$t('委托订单')"
      :backFunc="
        () => {
          if ($route.query.goback) {
@@ -21,67 +21,13 @@
      "
    />
    <div>
      <van-tabs ref="tabs" v-model="type" @change="onChange" sticky>
      <van-tabs ref="tabs" v-model="type" @change="onChange">
        <van-tab
          :title="item.title"
          v-for="item in selectData"
          :key="item.title"
          :name="item.type"
        >
          <!-- <div class="all-select flex justify-end" v-if="symbol">
            <div class="select-box flex" @click.stop="isAll = !isAll"> -->
          <!-- <div class="flex-1 font-24" v-if="symbol === 'wld'">FTB/USDT</div>
              <div class="flex-1 font-24" v-else-if="symbol === 'mln'">
                DKL/USDT
              </div>
              <div class="flex-1 font-24" v-else-if="symbol === 'qtum'">
                BQHN/USDT
              </div>
              <div class="flex-1 font-24" v-else-if="symbol === 'knc'">
                XCM/USDT
              </div>
              <div class="flex-1 font-24" v-else-if="symbol === 'vet'">
                ACG/USDT
              </div> -->
          <!-- <div class="flex-1 font-24" v-else>
                {{ symbol.toUpperCase() }}/USDT
              </div>
              <van-icon name="arrow-down" />
              <div class="select-data" v-if="isAll">
                <div
                  class="select-item font-24"
                  @click.stop="selectItem(item2)"
                  v-for="(item2, index) in currencyList"
                  :key="index"
                >
                  {{ item2.symbolFullName }}
                </div>
              </div> -->
          <!--       <div data-v-5764026c="" class="select-data"  @click.stop="selectItem(item2)" v-if="isAll">
                        <div data-v-5764026c="" class="select-item font-24">WLD/USDT</div>
                        <div data-v-5764026c="" class="select-item font-24">WDC/USDT</div>
                        <div data-v-5764026c="" class="select-item font-24">BTC/USDT</div>
                        <div data-v-5764026c="" class="select-item font-24">ETH/USDT</div>
                        <div data-v-5764026c="" class="select-item font-24">XTZ/USDT</div>
                        <div data-v-5764026c="" class="select-item font-24">ADA/USDT</div>
                        <div data-v-5764026c="" class="select-item font-24">YFII/USDT</div>
                        <div data-v-5764026c="" class="select-item font-24">MLN/USDT</div>
                        <div data-v-5764026c="" class="select-item font-24">YFI/USDT</div>
                        <div data-v-5764026c="" class="select-item font-24">DAI/USDT</div>
                        <div data-v-5764026c="" class="select-item font-24">ETC/USDT</div>
                        <div data-v-5764026c="" class="select-item font-24">XRP/USDT</div>
                        <div data-v-5764026c="" class="select-item font-24">LTC/USDT</div>
                        <div data-v-5764026c="" class="select-item font-24">USDC/USDT</div>
                        <div data-v-5764026c="" class="select-item font-24">KNC/USDT</div>
                        <div data-v-5764026c="" class="select-item font-24">DOGE/USDT</div>
                        <div data-v-5764026c="" class="select-item font-24">VET/USDT</div>
                        <div data-v-5764026c="" class="select-item font-24">SHIB/USDT</div>
                        <div data-v-5764026c="" class="select-item font-24">QTUM/USDT</div>
                        <div data-v-5764026c="" class="select-item font-24">ICP/USDT</div>
                     </div> -->
          <!-- </div>
          </div> -->
          <template v-if="type === 'orders'">
            <van-list
              v-model="loading"
@@ -103,12 +49,12 @@
                class="flex flex-col justify-center pt-50 pb-20 items-center"
                v-if="!dataList.orders.length && !loading"
              >
                <img
                <!-- <img
                  src="@/assets/image/assets-center/no-data.png"
                  alt=""
                  class="w-180 h-180"
                />
                <p class="text-grey mt-10">{{ $t("暂无记录") }}</p>
                /> -->
                <!-- <p class="text-grey mt-10">{{ $t("暂无记录") }}</p> -->
              </div>
            </van-list>
          </template>
@@ -169,7 +115,7 @@
          type: "orders",
        },
        {
          title: this.$t("历史仓位"),
          title: this.$t("历史委托"),
          type: "hisorders",
        },
      ],
@@ -261,46 +207,61 @@
  @include themify() {
    background: themed("main_background");
  }
  ::v-deep .van-tab {
    @include themify() {
      color: themed("text_color");
    }
    width: 10rem;
    flex: none;
  }
  ::v-deep .van-tabs__nav {
    @include themify() {
      background: themed("tab_background");
    }
  }
  ::v-deep .van-tab--active {
    background: #1194f7;
    border-radius: 5px;
    color: #fff !important;
  }
  ::v-deep .van-nav-bar {
    @include themify() {
      background: themed("main_background");
    }
  }
  ::v-deep .van-nav-bar__title {
    @include themify() {
      color: themed("text_color");
    }
  }
  ::v-deep .van-tabs__nav {
    @include themify() {
      background: themed("tab_background");
    }
  }
  ::v-deep .van-tabs__line {
    background-color: transparent !important;
    background: rgb(247, 179, 40);
  }
  ::v-deep .van-tab--active {
    color: rgb(247, 179, 40);
  }
  // ::v-deep .van-tab {
  //   @include themify() {
  //     color: themed("text_color");
  //   }
  // }
  // ::v-deep .van-tabs__nav {
  //   @include themify() {
  //     background: themed("tab_background");
  //   }
  // }
  // ::v-deep .van-tab--active {
  //   background: #1194f7;
  //   border-radius: 5px;
  //   color: #fff !important;
  // }
  // ::v-deep .van-nav-bar {
  //   @include themify() {
  //     background: themed("main_background");
  //   }
  // }
  // ::v-deep .van-nav-bar__title {
  //   @include themify() {
  //     color: themed("text_color");
  //   }
  // }
  // ::v-deep .van-tabs__nav {
  //   @include themify() {
  //     background: themed("tab_background");
  //   }
  // }
  // ::v-deep .van-tabs__line {
  //   background-color: transparent !important;
  // }
}
.active-line {