feat

lxf

2025-04-18 02a3d94d359b34e915f34abec024cbc1504a6a7c

 src/components/constract/index.vue

@@ -409,14 +409,14 @@
              :style="{ display: isFullscreen ? 'none' : 'block' }"
            >
              <OrderBookNew
                  :pageData="pageData"
                  :pageType="pageType"
                  :changeClickData="handleChangeClickData"
                  :sellList="sellList"
                  :buyList="buyList"
                  :bigIndex="bigIndex"
                  :recentList="wsTradeData"
                  :unit="unit"
                :pageData="pageData"
                :pageType="pageType"
                :changeClickData="handleChangeClickData"
                :sellList="sellList"
                :buyList="buyList"
                :bigIndex="bigIndex"
                :recentList="wsTradeData"
                :unit="unit"
              ></OrderBookNew>
            </div>

@@ -562,6 +562,8 @@
import { useUserStore } from "@/store/user";
import { useCurrencyStore } from "@/store/currency";
import ConfigURL from "@/config/index";
import API from "@/api/api";

export default {
  name: "constractPage",
  errorCaptured(err, vm, info) {
@@ -640,39 +642,109 @@
      clickData: undefined,

      kTimeArrCoin: [
        { data: "minHour", title: this.$t("message.jiaoyi.fenshi") },
        { data: "1min", title: this.$t("message.jiaoyi.1fenzhong") },
        { data: "5min", title: this.$t("message.jiaoyi.5fenzhong") },
        { data: "15min", title: this.$t("message.jiaoyi.15fenzhong") },
        { data: "30min", title: this.$t("message.jiaoyi.30fenzhong") },
        { data: "60min", title: this.$t("message.jiaoyi.1xiaoshi") },
        { data: "4hour", title: this.$t("message.jiaoyi.4xiaoshi") },
        { data: "1day", title: this.$t("message.jiaoyi.1ri") },
        { data: "1week", title: this.$t("message.jiaoyi.1zhou") },
        { data: "1mon", title: this.$t("message.jiaoyi.1yue") },
        {
          data: "minHour",
          title: this.$t("message.jiaoyi.fenshi"),
        },
        {
          data: "1min",
          title: this.$t("message.jiaoyi.1fenzhong"),
        },
        {
          data: "5min",
          title: this.$t("message.jiaoyi.5fenzhong"),
        },
        {
          data: "15min",
          title: this.$t("message.jiaoyi.15fenzhong"),
        },
        {
          data: "30min",
          title: this.$t("message.jiaoyi.30fenzhong"),
        },
        {
          data: "60min",
          title: this.$t("message.jiaoyi.1xiaoshi"),
        },
        {
          data: "4hour",
          title: this.$t("message.jiaoyi.4xiaoshi"),
        },
        {
          data: "1day",
          title: this.$t("message.jiaoyi.1ri"),
        },
        {
          data: "1week",
          title: this.$t("message.jiaoyi.1zhou"),
        },
        {
          data: "1mon",
          title: this.$t("message.jiaoyi.1yue"),
        },
      ],
      kTimeArrETF: [
        { data: "minHour", title: this.$t("message.jiaoyi.fenshi") },
        { data: "1day", title: this.$t("message.jiaoyi.1ri") },
        { data: "5day", title: this.$t("message.jiaoyi.5ri") },
        { data: "1week", title: this.$t("message.jiaoyi.1zhou") },
        { data: "1mon", title: this.$t("message.jiaoyi.1yue") },
        { data: "1quarter", title: this.$t("message.jiaoyi.season") },
        { data: "1year", title: this.$t("message.jiaoyi.year") },
        {
          data: "minHour",
          title: this.$t("message.jiaoyi.fenshi"),
        },
        {
          data: "1day",
          title: this.$t("message.jiaoyi.1ri"),
        },
        {
          data: "5day",
          title: this.$t("message.jiaoyi.5ri"),
        },
        {
          data: "1week",
          title: this.$t("message.jiaoyi.1zhou"),
        },
        {
          data: "1mon",
          title: this.$t("message.jiaoyi.1yue"),
        },
        {
          data: "1quarter",
          title: this.$t("message.jiaoyi.season"),
        },
        {
          data: "1year",
          title: this.$t("message.jiaoyi.year"),
        },
      ],
      kTimeArrMore: [
        { data: "1min", title: this.$t("message.jiaoyi.1fenzhong") },
        { data: "5min", title: this.$t("message.jiaoyi.5fenzhong") },
        { data: "15min", title: this.$t("message.jiaoyi.15fenzhong") },
        { data: "30min", title: this.$t("message.jiaoyi.30fenzhong") },
        { data: "60min", title: this.$t("message.jiaoyi.60fenzhong") },
        { data: "120min", title: this.$t("message.jiaoyi.120fenzhong") },
        {
          data: "1min",
          title: this.$t("message.jiaoyi.1fenzhong"),
        },
        {
          data: "5min",
          title: this.$t("message.jiaoyi.5fenzhong"),
        },
        {
          data: "15min",
          title: this.$t("message.jiaoyi.15fenzhong"),
        },
        {
          data: "30min",
          title: this.$t("message.jiaoyi.30fenzhong"),
        },
        {
          data: "60min",
          title: this.$t("message.jiaoyi.60fenzhong"),
        },
        {
          data: "120min",
          title: this.$t("message.jiaoyi.120fenzhong"),
        },
      ],
      kTimeArr: [],
      klineWidth: 0,
      loading: false,
      timer: undefined,
      type: "1", //选中市价或限价类型
      allSymbol: "",
    };
  },
  components: {
@@ -745,6 +817,7 @@
    },
  },
  created() {
    this.getSymbol(); // 获取说所有币
    this.getAllCurrency(); //获取市场的币种
    this.initWebSocket(); // 最新成交
  },
@@ -921,13 +994,19 @@
    gotoPage(type) {
      switch (type) {
        case "reCharge":
          this.$router.push({ path: "/recharge" });
          this.$router.push({
            path: "/recharge",
          });
          break;
        case "exchange":
          this.$router.push({ path: "/exchange" });
          this.$router.push({
            path: "/exchange",
          });
          break;
        case "withdraw":
          this.$router.push({ path: "/withdraw" });
          this.$router.push({
            path: "/withdraw",
          });
          break;
      }
    },
@@ -1000,9 +1079,11 @@
        this.klineIndex = "minHour";
      }
      this.kTimeIndex = item.data;
      // this.$forceUpdate(); // 强制重新渲染组件
    },
    //定时轮训的
    getKlineData() {
      // console.log("getKlineData定时轮训的");
      AxiosKline.getKline({
        symbol: this.$route.params.id,
        line: this.kParamsTime,
@@ -1071,6 +1152,7 @@
          return val.direction == "sell";
        });
      }
      return val.direction == "sell";
      //
    },
    // 用于深度图
@@ -1084,12 +1166,25 @@
        this.deepSell = deepData.data?.asks;
      }
    },
    // 获取所有symbol
    getSymbol() {
      API.url("wap/api/item!list.action", {}).then((res) => {
        this.allSymbol = res.data
          .map((val) => {
            return val.symbol;
          })
          .join(",");
        this.getTimeTimer();
      });
    },
    // 获取行情数据，用于币种数据展示和币种的弹窗
    getRealTimeData(val, search) {
      // console.log('获取行情数据，用于币种数据展示和币种的弹窗',val)
      Axios.getRealtime({ symbol: 'btc,plcl,eth,bnb,ada,omg,xtz,sol,' +
            'xrp,doge,avax,link,ltc,algo,bch,luna,uni,icp,etc,fil,xlm' +
            ',atom,matic,theta,trx,ftt,bsv,eos,dai,comp,saga,prcl,tnsl' }).then((res) => {
      this.getSymbol();
      console.log("获取行情数据，用于币种数据展示和币种的弹窗", this.allSymbol);
      if (!this.allSymbol) return;
      Axios.getRealtime({
        symbol: this.allSymbol,
      }).then((res) => {
        if (res.code == "0") {
          var data = res.data;
          // console.log(this.$route.params.id,'this.$route.params.id')
@@ -1164,12 +1259,14 @@
</script>
<style>
@import url("@/assets/css/coin/trade.css");

.home-container {
  background: #171a1e;
  width: 100%;
  border: 1px solid #24272c;
  border-bottom: none;
}

.kline-wrap {
  z-index: 0;
}
@@ -1253,6 +1350,7 @@
  justify-content: center;
  width: 100%;
}

.kTimeDivider {
  width: 1px;
  height: 30px;
@@ -1364,6 +1462,7 @@
  text-align: center;
  border-right: 1px solid #909090;
}

.status-info {
  padding: 4px 8px;
  border-radius: 4px;
@@ -1474,9 +1573,11 @@
  height: 100%;
  box-sizing: border-box;
}

.el-button + .el-button {
  margin-left: 0 !important;
}

.asset-block .assets-btns {
  display: grid;
  grid-template-columns: auto auto auto;
@@ -1653,6 +1754,7 @@
  color: #fff !important;
  font-size: 40px;
}

::v-deep .el-tabs__item:hover {
  color: #fff !important;
}