交易所前端蓝色ui 4.5 jiem
lxf
2025-04-18 02a3d94d359b34e915f34abec024cbc1504a6a7c
src/views/market/market.vue
@@ -51,10 +51,7 @@
              class="content-view-box item-box-bamarket"
              style="height: auto"
            >
              <div
                class="item-box-bamarket-1"
                style=" height: auto"
              >
              <div class="item-box-bamarket-1" style="height: auto">
                <!-- 新四个框 -->
                <div class="flex-container flex justify-between" scoped>
                  <div
@@ -64,24 +61,28 @@
                  >
                    <div class="flex justify-between">
                      <div class="flex-1">
                        <div class="flex" style="margin-top: 15px;margin-bottom: 10px;">
                        <div
                          class="flex"
                          style="margin-top: 15px; margin-bottom: 10px"
                        >
                          <el-image
                              :src="handleSymbolImg(item.symbol)"
                              class="el-img-style flex-symbol"
                            :src="handleSymbolImg(item.symbol)"
                            class="el-img-style flex-symbol"
                          >
                            <div slot="error" class="image-slot">
                              <img
                                  :src="`${ConfigURL.HOST_URL}/symbol/noCoins.png`"
                                  class="el-img-style"
                                  style="width: 40px"
                                :src="`${ConfigURL.HOST_URL}/symbol/noCoins.png`"
                                class="el-img-style"
                                style="width: 40px"
                              />
                            </div>
                          </el-image>
                          <div class="flex-title mt-1">
                            {{ getName(item) }}/USDT
                            <!-- {{ getName(item) }}/USDT -->
                            {{ item.name }}
                          </div>
                        </div>
                        <div class=" items-center">
                        <div class="items-center">
                          <div class="flex-price">
                            {{ item.close }}
                          </div>
@@ -332,7 +333,7 @@
                                        class="css-1wp9rgv"
                                        style="font-size: 14px"
                                      >
                                        {{ getName(item) }}
                                        {{ item.name }}
                                      </div>
                                    </div>
                                  </div>
@@ -592,7 +593,8 @@
                                  </div>
                                  <div class="css-y492if">
                                    <div class="css-1wp9rgv">
                                      {{ getName(item) }}
                                      <!-- {{ getName(item) }} -->
                                      {{ item.name }}
                                    </div>
                                  </div>
                                </div>
@@ -761,21 +763,24 @@
    },
    getList(symbol) {
      let t = this;
      API.url("wap/api/hobi!getRealtime.action", { symbol: symbol }).then((res) => {
        this.jsonArray = res.data;
        //筛选对应type
        this.fliterTypeData();
      });
      API.url("wap/api/hobi!getRealtime.action", { symbol: symbol }).then(
        (res) => {
          this.jsonArray = res.data;
          //筛选对应type
          this.fliterTypeData();
        }
      );
    },
    fliterTypeData() {
      if (this.marketListType == "collect") { //自选
      if (this.marketListType == "collect") {
        //自选
        this.getItemOptionalList();
      } else {
        // // 行情的展示数据
        // this.activeList = this.jsonArray.filter((val) => {
        //   return val.type == this.marketListType;
        // });
        this.activeList = this.jsonArray
        this.activeList = this.jsonArray;
        //获取顶部热门
        this.topListData = [];
        this.activeList.map((val) => {
@@ -838,7 +843,7 @@
      return flag;
    },
    changeActiveType(item) {
      console.log(item)
      console.log(item);
      this.marketListType = item.type;
      this.activeIndex = item.id;
      this.currentPage = 1;
@@ -858,7 +863,8 @@
      if (this.searchValue != "") {
        this.searchList = this.activeList.filter((val) => {
          return (
            val.symbol.toUpperCase().indexOf(this.searchValue.toUpperCase()) != -1
            val.symbol.toUpperCase().indexOf(this.searchValue.toUpperCase()) !=
            -1
          );
        });
        this.OnclickPage(1);
@@ -929,7 +935,7 @@
      return item.symbol.toUpperCase();
    },
    goDetail(symbol, item) {
      console.log(symbol, item)
      console.log(symbol, item);
      let RouterName = "sustainable"; //永续
      if (this.marketListType == "US-stocks") {
        this.$router.push({
@@ -974,12 +980,12 @@
.tab-active {
  border-bottom: 4px solid #1d91ff;
}
.flex-item{
.flex-item {
  min-width: 386px;
  height: 150px;
  max-width: 400px;
}
.flex-price{
.flex-price {
  font-weight: 600;
}
</style>