From 42faef34194c466f03e29d75a63ae502e4213044 Mon Sep 17 00:00:00 2001
From: admin <344137771@qq.com>
Date: Tue, 06 Jan 2026 10:38:46 +0800
Subject: [PATCH] 上一版是10.10的, 这版才是原始源码
---
src/views/usStock/Detail.vue | 152 +++++++++++++++++++-------------------------------
1 files changed, 57 insertions(+), 95 deletions(-)
diff --git a/src/views/usStock/Detail.vue b/src/views/usStock/Detail.vue
index 0e1c4de..d95f270 100644
--- a/src/views/usStock/Detail.vue
+++ b/src/views/usStock/Detail.vue
@@ -50,8 +50,8 @@
<span class="value">{{ formatMoney(chartData?.open) }}</span>
</p>
<p class="flex">
- <span class="label">{{ $t("收") }}</span>
- <span class="value">{{ formatMoney(chartData?.close) }}</span>
+ <span class="label">{{ $t("quantity") }}</span>
+ <span class="value">{{ formatMoney(chartData?.volume) }}</span>
</p>
<!-- <p class="flex">
<span class="label">{{ $t("Change") }}</span>
@@ -60,7 +60,7 @@
}}</span>
</p> -->
</div>
- <!-- <div class="flex-r-item">
+ <div class="flex-r-item">
<p class="flex">
<span class="label">{{ $t("Forehead") }}</span>
<span class="value">{{ formatMoney(chartData?.volume) }}</span>
@@ -75,9 +75,9 @@
</p>
<p class="flex">
<span class="label">{{ $t("amplitude") }}</span>
- <span class="value">{{ formatMoney(chartData?.amplitude) }}</span>
+ <span class="value">{{ formatMoney(chartData?.changeRatio) }}</span>
</p>
- </div> -->
+ </div>
</div>
</section>
<p class="status-info" v-if="chartData?.market?.status">
@@ -110,11 +110,11 @@
</section>
<section class="kline-container flex">
<div class="chart-index">
- <fx-kline :height="400" :symbol="symbol" :isShowsolid="true" :chartType="chartType" v-if="symbol"
- @data="onData" :key="`${symbol}-${timeValue}`" />
+ <fx-kline :height="400" :symbol="symbol" :isShowsolid="true" :chartType="chartType" v-if="symbol" @data="onData"
+ :key="`${symbol}-${timeValue}`" />
</div>
<div class="order-book-container"
- v-if="timeLabelActive === -1 && !['HK-stocks', 'JP-stocks'].includes(symbolType)">
+ v-if="timeLabelActive === 0 && !['HK-stocks', 'JP-stocks'].includes(symbolType)">
<!-- <keep-alive>
<trade-deep-data :symbol="symbol" v-if="symbol" :price="price" class="trade-deep-container" />
</keep-alive> -->
@@ -127,7 +127,7 @@
<div class="justify-between flex flex-1">
<span :class="item.trade_volume >= 100 ? 'text-green' : 'text-red'">{{
item.current ?
- Number(item.current).toFixed(3) : '--'
+ Number(item.current).toFixed(3) : '--'
}}</span>
<span class="text-right textColor" :class="item.trade_volume >= 100 ? 'text-green' : ''">{{
formatMoney(item?.trade_volume)
@@ -141,11 +141,11 @@
<div class="all-etf-ranking">
<div class="tabs flex">
<div class="tab-item" v-for="(item, index) in tabList" @click="selectTabIndex(index, item.value)"
- :class="[tabIndex === item.value ? 'active' : '']" :key="item">
+ :class="[tabIndex === index ? 'active' : '']" :key="item">
{{ item.title }}
</div>
</div>
- <!-- <F10Details :details="details" v-if="tabIndex === 0" /> -->
+ <F10Details :details="details" v-if="tabIndex === 0" />
<div class="new-trade" v-if="tabIndex === 1">
<ul class="px-12 text-grey">
<li class="flex justify-between mt-30">
@@ -278,7 +278,7 @@
const active = ref(0)
const timeLabelActive = ref(0)
const chartType = ref('')
-const tabIndex = ref(1)
+const tabIndex = ref(0)
const constituentList = ref([])
const isConstituent = ref(false)
const price = ref('')
@@ -303,7 +303,7 @@
const bids = ref(arr)
const tabList = route.query.symbolType === 'US-stocks' ? ref([
- // { title: t('ProfileF10'), value: 0 },
+ { title: t('ProfileF10'), value: 0 },
{ title: t('最新交易'), value: 1 },
{ title: t('深度图'), value: 2 },
]) : ref([
@@ -311,46 +311,22 @@
])
const filterOne = ref([
- { name: '1' + t('分'), paramsValue: '1', seconds: 1 * 60 * 1000, index: 12, },
- { name: '1' + t('周'), paramsValue: 'W', seconds: 7 * 24 * 60 * 60 * 1000, index: 2, },
- { name: '1' + t('月'), paramsValue: 'M', seconds: 30 * 24 * 60 * 60 * 1000, index: 3, },
- { name: '1' + t('天'), paramsValue: 'D', seconds: 1 * 24 * 60 * 60 * 1000, index: 4, },
-
- // 乱序的
- // { name: "1" + t("分"), paramsValue: "1day", seconds: 1 * 60 * 1000, index: 12 },
- // { name: "15" + t("分"), paramsValue: "1week", seconds: 15 * 60 * 1000, index: 10 },
- // { name: "30" + t("分"), paramsValue: "1mon", seconds: 30 * 60 * 1000, index: 9 },
- // { name: "120" + t("分"), paramsValue: "1quarter", seconds: 2 * 60 * 60 * 1000, index: 7 },
-
- // {
- // name: "1" + t("天"),
- // paramsValue: "1year",
- // seconds: 1 * 24 * 60 * 60 * 1000,
- // index: 1,
- // },
- // 原本的
- // { name: t('分时'), paramsValue: 'timeSharing', seconds: 1 * 60 * 1000, index: 0, },
- // { name: '1' + t('天'), paramsValue: '1day', seconds: 1 * 24 * 60 * 60 * 1000, index: 1, },
- // { name: '1' + t('周'), paramsValue: '1week', seconds: 7 * 24 * 60 * 60 * 1000, index: 2, },
- // { name: '1' + t('月'), paramsValue: '1mon', seconds: 30 * 24 * 60 * 60 * 1000, index: 3, },
- // { name: '5' + t('天'), paramsValue: '5day', seconds: 5 * 24 * 60 * 60 * 1000, index: 4, },
- // { name: t('season'), paramsValue: '1quarter', seconds: 3 * 30 * 24 * 60 * 60 * 1000, index: 5, },
- // { name: t('Year'), paramsValue: '1year', seconds: 12 * 30 * 24 * 60 * 60 * 1000, index: 6, },
+ { name: t('分时'), paramsValue: 'timeSharing', seconds: 1 * 60 * 1000, index: 0, },
+ { name: '1' + t('天'), paramsValue: '1day', seconds: 1 * 24 * 60 * 60 * 1000, index: 1, },
+ { name: '1' + t('周'), paramsValue: '1week', seconds: 7 * 24 * 60 * 60 * 1000, index: 2, },
+ { name: '1' + t('月'), paramsValue: '1mon', seconds: 30 * 24 * 60 * 60 * 1000, index: 3, },
+ { name: '5' + t('天'), paramsValue: '5day', seconds: 5 * 24 * 60 * 60 * 1000, index: 4, },
+ { name: t('season'), paramsValue: '1quarter', seconds: 3 * 30 * 24 * 60 * 60 * 1000, index: 5, },
+ { name: t('Year'), paramsValue: '1year', seconds: 12 * 30 * 24 * 60 * 60 * 1000, index: 6, },
])
const filterTwo = ref([
- { name: '60' + t('分'), paramsValue: '60', seconds: 60 * 60 * 1000, index: 7, },
- { name: '45' + t('分'), paramsValue: '45', seconds: 45 * 60 * 1000, index: 8, },
- { name: '30' + t('分'), paramsValue: '30', seconds: 30 * 60 * 1000, index: 9, },
- { name: '15' + t('分'), paramsValue: '15', seconds: 15 * 60 * 1000, index: 10, },
- { name: '5' + t('分'), paramsValue: '5', seconds: 5 * 60 * 1000, index: 11, },
- // 原本的
- // { name: '120' + t('分'), paramsValue: '120min', seconds: 2 * 60 * 60 * 1000, index: 7, },
- // { name: '60' + t('分'), paramsValue: '60min', seconds: 1 * 60 * 60 * 1000, index: 8, },
- // { name: '30' + t('分'), paramsValue: '30min', seconds: 30 * 60 * 1000, index: 9, },
- // { name: '15' + t('分'), paramsValue: '15min', seconds: 15 * 60 * 1000, index: 10, },
- // { name: '5' + t('分'), paramsValue: '5min', seconds: 5 * 60 * 1000, index: 11, },
- // { name: '1' + t('分'), paramsValue: '1min', seconds: 1 * 60 * 1000, index: 12, },
+ { name: '120' + t('分'), paramsValue: '120min', seconds: 2 * 60 * 60 * 1000, index: 7, },
+ { name: '60' + t('分'), paramsValue: '60min', seconds: 1 * 60 * 60 * 1000, index: 8, },
+ { name: '30' + t('分'), paramsValue: '30min', seconds: 30 * 60 * 1000, index: 9, },
+ { name: '15' + t('分'), paramsValue: '15min', seconds: 15 * 60 * 1000, index: 10, },
+ { name: '5' + t('分'), paramsValue: '5min', seconds: 5 * 60 * 1000, index: 11, },
+ { name: '1' + t('分'), paramsValue: '1min', seconds: 1 * 60 * 1000, index: 12, },
])
const leftIcon = new URL(`../../assets/theme/${thStore.theme}/image/black-convert.png`, import.meta.url)
@@ -378,9 +354,9 @@
getIsItemHasAddGlobal()
// 默认日k
handleClickSelectTime({
- paramsValue: '1',
- seconds: 1 * 60 * 1000,
- index: 12
+ paramsValue: 'timeSharing',
+ seconds: 1 * 24 * 60 * 60 * 1000,
+ index: 0
})
})
@@ -405,44 +381,8 @@
}
})
-const startAskBidSocket = () => { // 委托和深度
- sockets.value.askBid = new WebSocket(`${WS_URL}/3/${symbol.value}`)
- sockets.value.askBid.onmessage = (evt) => {
- const { data } = evt
- const { code, data: _data } = JSON.parse(data)
- if (code / 1 === 0) {
- deepBuy.value = _data.bids
- deepSell.value = _data.asks
- _data.asks = _data.asks.sort((prev, next) => prev.price - next.price)
- _data.bids = _data.bids.sort((prev, next) => prev.price - next.price)
- asks.value = _data.asks.slice(0, 17)
- bids.value = _data.bids.reverse().slice(0, 17)
- }
- }
-}
-const startDealsSocket = () => { // 交易
- sockets.value.deals = new WebSocket(`${WS_URL}/3/${symbol.value}`)
- sockets.value.deals.onmessage = (evt) => {
- const { data } = evt
- const { code, data: _data } = JSON.parse(data)
- // todo: 数据有些问题
- if (code / 1 === 0) {
- // deals.value = _data.data.slice(0, 17)
- let buys = _data.bids.map(item => {
- item.direction = 'buy'
- return item
- })
- let sells = _data.asks.map(item => {
- item.direction = 'sell'
- return item
- })
- deals.value = [...buys.slice(0, 8), ...sells.slice(0, 9)]
- }
- }
-}
-
watch([tabIndex, symbol], ([val, val2]) => {
- if (val / 1 === 0 || val / 1 === 2) {
+ if (val / 1 === 0) {
sockets.value.deals && sockets.value.deals.close()
sockets.value.deals = null
if (val2) { // 刚进来可能是null
@@ -458,6 +398,32 @@
immediate: true
})
+const startAskBidSocket = () => { // 委托
+ sockets.value.askBid = new WebSocket(`${WS_URL}/3/${symbol.value}`)
+ sockets.value.askBid.onmessage = (evt) => {
+ const { data } = evt
+ const { code, data: _data } = JSON.parse(data)
+ if (code / 1 === 0) {
+ deepBuy.value = _data.bids
+ deepSell.value = _data.asks
+ _data.asks = _data.asks.sort((prev, next) => prev.price - next.price)
+ _data.bids = _data.bids.sort((prev, next) => prev.price - next.price)
+ asks.value = _data.asks.slice(0, 17)
+ bids.value = _data.bids.reverse().slice(0, 17)
+ }
+ }
+}
+const startDealsSocket = () => { // 交易
+ sockets.value.deals = new WebSocket(`${WS_URL}/2/${symbol.value}`)
+ sockets.value.deals.onmessage = (evt) => {
+ const { data } = evt
+ const { code, data: _data } = JSON.parse(data)
+ // todo: 数据有些问题
+ if (code / 1 === 0) {
+ deals.value = _data.data.slice(0, 17)
+ }
+ }
+}
const closeSocket = () => {
sockets.value.quote && sockets.value.quote.close()
@@ -606,14 +572,10 @@
// 事件
const onData = (data) => {
- console.log("dataaaaa", data);
-
chartData.value = data
// symbolType.value = data?.type
}
const fetchQuotes = () => {
- // console.log("quotesStore", quotesStore.coins);
-
_getQuotes(quotesStore.coins).then(data => {
data.map(item => {
item.name = item.symbol
@@ -652,7 +614,7 @@
}
const selectTabIndex = (index, value) => {
- tabIndex.value = value
+ tabIndex.value = index
}
const handleClickMoreBtn = () => {
--
Gitblit v1.9.3