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/components/trade/us-stock-ex-nav/index.vue | 170 ++------------------------------------------------------
1 files changed, 6 insertions(+), 164 deletions(-)
diff --git a/src/components/trade/us-stock-ex-nav/index.vue b/src/components/trade/us-stock-ex-nav/index.vue
index 1d538c9..f29b2c0 100644
--- a/src/components/trade/us-stock-ex-nav/index.vue
+++ b/src/components/trade/us-stock-ex-nav/index.vue
@@ -1,45 +1,16 @@
<template>
<div id="cryptos" class="mt-10">
<div class="nav">
- <div v-for="(item, index) in navList" :key="index" class="list" @click="handleItemClick(item)">
+ <div v-for="(item, index) in navList" :key="index" class="list" @click="goPath(item.path, item.name)">
<div class="imgBox"><img :src="handleImage(item.icon)" alt=""></div>
<div class="mt-10 text-center title">{{ item.name }}</div>
</div>
</div>
-
- <!-- ATS 购买弹框 -->
- <van-popup v-model:show="showAtsModal" round position="center" :style="{ width: '90%', maxWidth: '500px' }">
- <div class="ats-modal">
- <div class="modal-header">
- <h3 class="modal-title">{{ $t('ATS购买') }}</h3>
- <span @click="closeAtsModal" class="close-icon">×</span>
- </div>
- <div class="modal-content">
- <div class="input-group">
- <label class="input-label">{{ $t('购买金额') }}</label>
- <van-field
- v-model="atsAmount"
- type="number"
- :placeholder="$t('请输入购买金额')"
- class="amount-input"
- />
- </div>
- </div>
- <div class="modal-footer">
- <van-button class="cancel-btn" @click="closeAtsModal">{{ $t('关闭') }}</van-button>
- <van-button type="primary" class="buy-btn" @click="handleBuy">{{ $t('购买') }}</van-button>
- </div>
- </div>
- </van-popup>
</div>
</template>
<script>
import { themeStore } from '@/store/theme';
-import { Popup, Field, Button } from 'vant';
-import { showToast } from 'vant';
-import { _stockAts } from '@/service/trade.api';
-
const thStore = themeStore()
export default {
@@ -56,9 +27,7 @@
}
},
components: {
- [Popup.name]: Popup,
- [Field.name]: Field,
- [Button.name]: Button,
+
},
watch: {
initObjData(val) {
@@ -93,46 +62,19 @@
icon: new URL(`../../../assets/theme/${thStore.theme}/image/etfNav/icon6-6.png`, import.meta.url),
path: `/ipo/stock?type=newStock&stock=US-stocks&stockActive=${this.$props.stockActive}`
},
- {
- name: 'ATS',
- icon: new URL(`../../../assets/theme/${thStore.theme}/image/etfNav/icon6-6.png`, import.meta.url),
- path: `/ipo/stock?type=newStock&stock=US-stocks&stockActive=${this.$props.stockActive}`,
- isAts: true
- },
- {
- name: this.$t('大宗交易'),
- icon: new URL(`../../../assets/theme/${thStore.theme}/image/etfNav/icon3-3.png`, import.meta.url),
- path: '/cryptos/blockTrades'
- },
- {
- name: this.$t('暗池交易'),
- icon: new URL(`../../../assets/theme/${thStore.theme}/image/etfNav/icon3-3.png`, import.meta.url),
- path: '/cryptos/darkpoolTrading'
- },
]
}
},
data() {
return {
- navList: [],
- showAtsModal: false,
- atsAmount: ''
+ navList: [
+
+ ],
}
},
methods: {
handleImage(url) {
return new URL(url, import.meta.url).href
- },
- handleItemClick(item) {
- if (item.isAts) {
- // ATS 按钮点击打开弹框
- // this.showAtsModal = true
-
- showToast(this.$t('敬请期待'))
- } else {
- // 其他按钮正常跳转
- this.goPath(item.path, item.name)
- }
},
goPath(path, name) {
if (!path) {
@@ -140,34 +82,6 @@
} else {
this.$router.push(path)
}
- },
- closeAtsModal() {
- this.showAtsModal = false
- this.atsAmount = ''
- },
- handleBuy() {
- if (!this.atsAmount || parseFloat(this.atsAmount) <= 0) {
- showToast({
- message: this.$t('请输入有效的购买金额'),
- type: 'fail'
- })
- return
- }
-
- // 调用ATS购买接口
- _stockAts({
- price: this.atsAmount
- }).then((res) => {
- // 购买成功
- showToast({
- message: this.$t('购买成功'),
- type: 'success'
- })
- this.closeAtsModal()
- }).catch((error) => {
- // 购买失败，错误信息已经在request拦截器中处理了
- console.error('ATS购买失败:', error)
- })
}
},
}
@@ -188,18 +102,9 @@
flex-direction: column;
justify-content: center;
align-items: center;
+ width: 25%;
color: $text_color;
flex-shrink: 0;
-
- // 前4个按钮，每行4个
- &:nth-child(-n+4) {
- width: 25%;
- }
-
- // 第5个及之后的按钮，每行5个
- &:nth-child(n+5) {
- width: 20%;
- }
&:last-child {
margin-right: 0px;
@@ -222,69 +127,6 @@
img {
width: 100%;
height: 100%;
- }
-}
-
-.ats-modal {
- padding: 20px;
- background: #fff;
- border-radius: 12px;
-}
-
-.modal-header {
- display: flex;
- justify-content: space-between;
- align-items: center;
- margin-bottom: 20px;
-
- .modal-title {
- font-size: 18px;
- font-weight: bold;
- color: #21262F;
- }
-
- .close-icon {
- cursor: pointer;
- color: #999;
- font-size: 24px;
- line-height: 1;
- user-select: none;
-
- &:hover {
- color: #666;
- }
- }
-}
-
-.modal-content {
- margin-bottom: 20px;
-
- .input-group {
- .input-label {
- display: block;
- font-size: 14px;
- color: #666;
- margin-bottom: 8px;
- }
-
- .amount-input {
- width: 100%;
- }
- }
-}
-
-.modal-footer {
- display: flex;
- gap: 12px;
-
- .cancel-btn {
- flex: 1;
- border: 1px solid #ddd;
- color: #666;
- }
-
- .buy-btn {
- flex: 1;
}
}
</style>
--
Gitblit v1.9.3