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/quotes/components/BuySellTradeTab.vue | 210 ++++++++++++++++++++++++++++------------------------
1 files changed, 114 insertions(+), 96 deletions(-)
diff --git a/src/views/quotes/components/BuySellTradeTab.vue b/src/views/quotes/components/BuySellTradeTab.vue
index 9d9da98..289551b 100644
--- a/src/views/quotes/components/BuySellTradeTab.vue
+++ b/src/views/quotes/components/BuySellTradeTab.vue
@@ -5,9 +5,9 @@
<div class="line-first flex">
<div class="line-first-l">
<p>
- <span>{{ t("最新价") }} {{ chartData.close }}</span>
- <span class="red">{{ chartData?.changeRatio }}%</span>
- <span class="red">{{ chartData?.netChange }}</span>
+ <span>{{ t("最新价") }} {{ chartData.close }}</span> <span class="red">{{
+ chartData?.changeRatio
+ }}</span> <span class="red">{{ chartData?.netChange }}</span>
</p>
</div>
<!-- <div class="line-first-r">
@@ -38,8 +38,7 @@
</div> -->
<div class="orderbook-container flex justify-between px-30 py-30">
<div
- :class="{ 'trade-order-area': true, 'sell-box': props.isSell, 'trade-order-area-full': ['JP-stocks', 'HK-stocks', 'UK-stocks', 'DE-stocks', 'BZ-stocks'].includes(symbolType) }"
- :style="{ width: `${['US-stocks'].includes(symbolType) ? '100%' : ''}` }">
+ :class="{ 'trade-order-area': true, 'sell-box': props.isSell, 'trade-order-area-full': ['JP-stocks', 'HK-stocks','UK-stocks','DE-stocks','BZ-stocks'].includes(symbolType) }">
<!-- TODO: 搜索 -->
<!-- <div class="name-input" @click="showSearch = true"> -->
<div class="name-input">
@@ -52,8 +51,7 @@
<img src="@/assets/image/quotes/grey-select.png" alt="select-icon" class="select-icon" />
</div>
<div class="option-box" v-show="isShow">
- <div class="text-30" v-for="(item, index) in selectData" :key="item.type"
- @click="selectItem(item, index)">
+ <div class="text-30" v-for="(item, index) in selectData" :key="item.type" @click="selectItem(item, index)">
{{ item.title }}
</div>
</div>
@@ -110,60 +108,56 @@
</span>
</p>
</div>
- <template v-if="!['US-stocks'].includes(symbolType)">
- <div class="trade-deep-data"
- v-if="!['HK-stocks', 'JP-stocks', 'UK-stocks', 'DE-stocks', 'BZ-stocks'].includes(symbolType)">
- <keep-alive>
- <trade-deep-data :symbol="symbol" v-if="symbol" :price="form.price" class="trade-deep-container"
- @newPrice="getNewPrice" />
- </keep-alive>
- </div>
- <div class="trade-deep-data" v-else>
- <div class="index-card flex-r"
- v-if="!['HK-stocks', 'JP-stocks', 'UK-stocks', 'DE-stocks', 'BZ-stocks'].includes(symbolType)">
- <div class="flex-r-item">
- <p>
- <span class="label">{{ $t('最高') }}</span>
- <span class="value">{{ formatMoney(chartData?.high) }}</span>
- </p>
- <p>
- <span class="label">{{ $t('最低') }}</span>
- <span class="value">{{ formatMoney(chartData?.low) }}</span>
- </p>
- <p>
- <span class="label">{{ $t('成交量') }}</span>
- <span class="value">{{ formatMoney(chartData?.volume) }}</span>
- </p>
- <p>
- <span class="label">{{ $t('换手率') }}</span>
- <span class="value">{{
- chartData?.turnoverRate ? formatMoney(chartData?.turnoverRate) + '%' : '-'
- }}</span>
- </p>
- <p>
- <span class="label">{{ t('marketValue') }}</span>
- <span class="value">{{ formatMoney(chartData?.marketCapital) }}</span>
- </p>
- <p>
- <span class="label">{{ $t('amplitude') }}</span>
- <span class="value">{{ formatMoney(chartData?.changeRatio) }}</span>
- </p>
- <p>
- <span class="label">{{ $t('pb') }}</span>
- <span class="value">{{ formatMoney(chartData?.pb) }}</span>
- </p>
- <p>
- <span class="label">{{ $t('eps') }}</span>
- <span class="value">{{ formatMoney(chartData?.eps) }}</span>
- </p>
- <p>
- <span class="label">{{ $t('navps') }}</span>
- <span class="value">{{ formatMoney(chartData?.navps) }}</span>
- </p>
- </div>
+ <div class="trade-deep-data" v-if="!['HK-stocks', 'JP-stocks','UK-stocks','DE-stocks','BZ-stocks'].includes(symbolType)">
+ <keep-alive>
+ <trade-deep-data :symbol="symbol" v-if="symbol" :price="form.price" class="trade-deep-container"
+ @newPrice="getNewPrice" />
+ </keep-alive>
+ </div>
+ <div class="trade-deep-data" v-else>
+ <div class="index-card flex-r" v-if="!['HK-stocks', 'JP-stocks','UK-stocks','DE-stocks','BZ-stocks'].includes(symbolType)">
+ <div class="flex-r-item">
+ <p>
+ <span class="label">{{ $t('最高') }}</span>
+ <span class="value">{{ formatMoney(chartData?.high) }}</span>
+ </p>
+ <p>
+ <span class="label">{{ $t('最低') }}</span>
+ <span class="value">{{ formatMoney(chartData?.low) }}</span>
+ </p>
+ <p>
+ <span class="label">{{ $t('成交量') }}</span>
+ <span class="value">{{ formatMoney(chartData?.volume) }}</span>
+ </p>
+ <p>
+ <span class="label">{{ $t('换手率') }}</span>
+ <span class="value">{{
+ chartData?.turnoverRate ? formatMoney(chartData?.turnoverRate) + '%' : '-'
+ }}</span>
+ </p>
+ <p>
+ <span class="label">{{ t('marketValue') }}</span>
+ <span class="value">{{ formatMoney(chartData?.marketCapital) }}</span>
+ </p>
+ <p>
+ <span class="label">{{ $t('amplitude') }}</span>
+ <span class="value">{{ formatMoney(chartData?.changeRatio) }}</span>
+ </p>
+ <p>
+ <span class="label">{{ $t('pb') }}</span>
+ <span class="value">{{ formatMoney(chartData?.pb) }}</span>
+ </p>
+ <p>
+ <span class="label">{{ $t('eps') }}</span>
+ <span class="value">{{ formatMoney(chartData?.eps) }}</span>
+ </p>
+ <p>
+ <span class="label">{{ $t('navps') }}</span>
+ <span class="value">{{ formatMoney(chartData?.navps) }}</span>
+ </p>
</div>
</div>
- </template>
+ </div>
</div>
<!-- <div class="orderbook-container flex justify-between px-30 py-30 hk-stocks-orderbook" v-else>
<div :class="{ 'trade-order-area': true, 'sell-box': props.isSell }">
@@ -249,8 +243,7 @@
<!-- <li>{{ t('成交历史') }}</li> -->
</ul>
</div>
- <img src="../../../assets/image/public/record.png" alt="record-img" class="pr-5 record-img"
- @click="goHistory" />
+ <img src="../../../assets/image/public/record.png" alt="record-img" class="pr-5 record-img" @click="goHistory" />
</div>
</div>
<section class="etf-container">
@@ -261,8 +254,8 @@
@cancelOrder="cancelOrder" />
</div>
<div class="pl-10 pr-10 pb-50" v-else-if="tabType == '2'">
- <history-item :unit="currentUnit(symbolType)" v-for="item in entrustList" :key="item.order_no"
- :coinPrice="coinPrice" :entrust="item" :state="item.state" @cancelOrder="cancelOrder" />
+ <history-item :unit="currentUnit(symbolType)" v-for="item in entrustList" :key="item.order_no" :coinPrice="coinPrice"
+ :entrust="item" :state="item.state" @cancelOrder="cancelOrder" />
</div>
<div class="pl-5 pr-5" v-else>
<div class="mb-10 border-b assets-box">
@@ -270,10 +263,10 @@
<ul>
<li v-for="item in pairsList" :key="item.symbol" class="flex justify-between py-2">
<div class="flex items-center">
- <!-- <img :src="item.symbol
+ <img :src="item.symbol
? `${HOST_URL}/symbol/${item.symbol.toLowerCase()}.png`
: require('@/assets/loading-default.png')
- " class="w-15 h-15 rounded-full mr-5 usdt-icon" /> -->
+ " class="w-15 h-15 rounded-full mr-5 usdt-icon" />
<p class="flex flex-col">
<strong class="text-28 textColor mb-6">{{
item.symbol.toUpperCase()
@@ -285,7 +278,7 @@
<strong class="text-28 textColor mb-6">{{ item.usable }}</strong>
<span class="text-28 text-grey">
{{ currency.currency_symbol }}
- {{ item.usableUsdt ? formatNumberWithComma(item.usableUsdt * currency.rate) : "0.0" }}
+ {{ item.usableUsdt ? (item.usableUsdt * currency.rate).toFixed(2) : "0.0" }}
</span>
</div>
</li>
@@ -311,7 +304,7 @@
<strong class="text-28 textColor mb-6">{{ item.usable }}</strong>
<span class="text-28 text-grey">
{{ currency.currency_symbol }}
- {{ item.usableUsdt ? formatNumberWithComma(item.usableUsdt * currency.rate) : "0.0" }}
+ {{ item.usableUsdt ? (item.usableUsdt * currency.rate).toFixed(2) : "0.0" }}
</span>
</div>
</li>
@@ -391,8 +384,8 @@
</section>
<div class="kline-container flex" v-if="showKlineChart">
<div class="chart-index">
- <fx-kline :height="500" :symbol="symbol" :isShowsolid="true" :chartType="chartType" v-if="symbol"
- @data="onData" :key="`${symbol}-${timeValue}`" />
+ <fx-kline :height="500" :symbol="symbol" :isShowsolid="true" :chartType="chartType" v-if="symbol" @data="onData"
+ :key="`${symbol}-${timeValue}`" />
</div>
</div>
</div>
@@ -437,7 +430,6 @@
import { SET_STAGE } from "@/store/types.store";
import { formatMoney } from '@/utils/index.js'
import { currentUnit } from '@/utils/coinUnit.js'
-import { formatNumberWithComma } from '@/utils/utis';
const thStore = themeStore();
const THEME = thStore.theme;
@@ -457,26 +449,53 @@
},
});
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: 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 timeLabelActive = ref(12);
+const timeLabelActive = ref(1);
const chartType = ref("");
const quotesStore = useQuotesStore();
const userStore = useUserStore();
@@ -563,9 +582,9 @@
onMounted(async () => {
initPage(props.symbolFlag);
handleClickSelectTime({
- paramsValue: "1",
+ paramsValue: "1day",
seconds: 1 * 24 * 60 * 60 * 1000,
- index: 12,
+ index: 1,
});
});
@@ -687,9 +706,9 @@
router.push(`/quotes/detail?symbol=${symbol.value}&tabActive=7&symbolType=A-stocks&type=A-stocks`)
} else if (symbolType === "UK-stocks") {
router.push(`/quotes/usStockDetail?symbol=${symbol.value}&tabActive=9&symbolType=UK-stocks`)
- } else if (symbolType === "DE-stocks") {
+ }else if (symbolType === "DE-stocks") {
router.push(`/quotes/usStockDetail?symbol=${symbol.value}&tabActive=10&symbolType=DE-stocks`)
- } else if (symbolType === "BZ-stocks") {
+ }else if (symbolType === "BZ-stocks") {
router.push(`/quotes/usStockDetail?symbol=${symbol.value}&tabActive=11&symbolType=BZ-stocks`)
} else {
router.push(`/quotes/usStockDetail?symbol=${symbol.value}&tabActive=4&symbolType=HK-stocks`)
@@ -740,8 +759,8 @@
return;
}
if (currentType.value === "open") {
- form.volume = parseFloat(form.total).toFixed(5);
- form.total = ((parseFloat(form.total) / parseFloat(form.price))).toFixed(5)
+ form.volume = parseFloat(form.total).toFixed(5);
+ form.total = ((parseFloat(form.total) / parseFloat(form.price))).toFixed(5)
} else {
form.volume = parseFloat(form.total) / parseFloat(form.price);
form.volume = form.volume.toFixed(5);
@@ -753,7 +772,7 @@
return;
}
if (currentType.value === "open") {
- form.total = form.volume
+ form.total = form.volume
volume = parseFloat(form.volume) * parseFloat(form.price);
} else {
volume = form.volume;
@@ -837,7 +856,7 @@
getOrderList();
if (type === "open") {
//console.log('开仓数据')
- Axios.tradeBuyToken({ type: symbolType }).then((res) => {
+ Axios.tradeBuyToken({ type : symbolType}).then((res) => {
initOpen.volume = res.volume;
initOpen.fee = res.fee;
initOpen.session_token = res.session_token;
@@ -1317,7 +1336,6 @@
display: flex;
flex-direction: column;
width: 210px;
- // width: 100%;
font-size: 12px;
margin-right: 12px;
--
Gitblit v1.9.3