From 02a3d94d359b34e915f34abec024cbc1504a6a7c Mon Sep 17 00:00:00 2001
From: lxf <1371462558@qq.com>
Date: Fri, 18 Apr 2025 11:00:14 +0800
Subject: [PATCH] feat
---
src/components/constract/index.vue | 178 ++++++++++++++++++++++++++++++++++++++++++++++------------
1 files changed, 140 insertions(+), 38 deletions(-)
diff --git a/src/components/constract/index.vue b/src/components/constract/index.vue
index c9f26f5..9b8e7a5 100644
--- a/src/components/constract/index.vue
+++ b/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;
}
--
Gitblit v1.9.3