|
|
@@ -41,74 +41,55 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
- <!-- 滑动切换容器 -->
|
|
|
- <swiper
|
|
|
- class="view-swiper"
|
|
|
- :current="swiperIndex"
|
|
|
- @change="onSwiperChange"
|
|
|
- :duration="200"
|
|
|
- >
|
|
|
- <!-- 热力图视图 -->
|
|
|
- <swiper-item>
|
|
|
- <scroll-view scroll-y class="swiper-scroll">
|
|
|
- <view v-if="myStocks.length > 0" class="stock-list">
|
|
|
- <stock-list-item
|
|
|
- v-for="(stock, index) in myStocks"
|
|
|
- :key="stock.code"
|
|
|
- :stock="stock"
|
|
|
- :show-delete="true"
|
|
|
- @delete="removeStock(index)"
|
|
|
- @click="handleStockClick(stock, index)"
|
|
|
- />
|
|
|
- </view>
|
|
|
- <view v-else class="empty-content">
|
|
|
- <view class="empty-icon">📊</view>
|
|
|
- <text class="empty-text">暂无收藏股票</text>
|
|
|
- <text class="empty-desc">在强势池中点击"+"按钮添加股票</text>
|
|
|
- </view>
|
|
|
- </scroll-view>
|
|
|
- </swiper-item>
|
|
|
-
|
|
|
- <!-- 详情表格视图 -->
|
|
|
- <swiper-item>
|
|
|
- <scroll-view scroll-y class="swiper-scroll">
|
|
|
- <view v-if="myStocks.length > 0" class="stock-table">
|
|
|
- <!-- 表头 -->
|
|
|
- <view class="table-header">
|
|
|
- <text class="th-name">股票</text>
|
|
|
- <text class="th-date">自选日</text>
|
|
|
- <text class="th-price">自选价</text>
|
|
|
- <text class="th-profit">自选收益</text>
|
|
|
- </view>
|
|
|
- <!-- 表格内容 -->
|
|
|
- <view
|
|
|
- v-for="(stock, index) in myStocks"
|
|
|
- :key="stock.code"
|
|
|
- class="table-row"
|
|
|
- @click="handleStockClick(stock, index)"
|
|
|
- >
|
|
|
- <view class="td-name">
|
|
|
- <text class="stock-name">{{ stock.name }}</text>
|
|
|
- <view class="stock-code-row">
|
|
|
- <text :class="['stock-tag', getMarketClass(stock.code)]">{{ getMarketTag(stock.code) }}</text>
|
|
|
- <text class="stock-code">{{ stock.code }}</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <text class="td-date">{{ stock.addDate || '--' }}</text>
|
|
|
- <text class="td-price">{{ formatPrice(stock.addPrice) }}</text>
|
|
|
- <text :class="['td-profit', getProfitClass(stock.profitPercent)]">
|
|
|
- {{ stock.profitPercent || '--' }}
|
|
|
- </text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view v-else class="empty-content">
|
|
|
- <view class="empty-icon">📊</view>
|
|
|
- <text class="empty-text">暂无收藏股票</text>
|
|
|
- <text class="empty-desc">在强势池中点击"+"按钮添加股票</text>
|
|
|
+ <!-- 热力图视图 -->
|
|
|
+ <view v-show="viewMode === 'list'" class="stock-list" :class="{ 'hidden-list': myStocks.length === 0 }">
|
|
|
+ <stock-list-item
|
|
|
+ v-for="(stock, index) in myStocks"
|
|
|
+ :key="stock.code"
|
|
|
+ :stock="stock"
|
|
|
+ :show-delete="true"
|
|
|
+ @delete="removeStock(index)"
|
|
|
+ @click="handleStockClick(stock, index)"
|
|
|
+ />
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 详情表格视图 -->
|
|
|
+ <view v-show="viewMode === 'table'" class="stock-table" :class="{ 'hidden-list': myStocks.length === 0 }">
|
|
|
+ <!-- 表头 -->
|
|
|
+ <view class="table-header">
|
|
|
+ <text class="th-name">股票</text>
|
|
|
+ <text class="th-date">自选日</text>
|
|
|
+ <text class="th-price">自选价</text>
|
|
|
+ <text class="th-profit">自选收益</text>
|
|
|
+ </view>
|
|
|
+ <!-- 表格内容 -->
|
|
|
+ <view
|
|
|
+ v-for="(stock, index) in myStocks"
|
|
|
+ :key="stock.code"
|
|
|
+ class="table-row"
|
|
|
+ @click="handleStockClick(stock, index)"
|
|
|
+ >
|
|
|
+ <view class="td-name">
|
|
|
+ <text class="stock-name">{{ stock.name }}</text>
|
|
|
+ <view class="stock-code-row">
|
|
|
+ <text :class="['stock-tag', getMarketClass(stock.code)]">{{ getMarketTag(stock.code) }}</text>
|
|
|
+ <text class="stock-code">{{ stock.code }}</text>
|
|
|
</view>
|
|
|
- </scroll-view>
|
|
|
- </swiper-item>
|
|
|
- </swiper>
|
|
|
+ </view>
|
|
|
+ <text class="td-date">{{ stock.addDate || '--' }}</text>
|
|
|
+ <text class="td-price">{{ formatPrice(stock.addPrice) }}</text>
|
|
|
+ <text :class="['td-profit', getProfitClass(stock.profitPercent)]">
|
|
|
+ {{ stock.profitPercent || '--' }}
|
|
|
+ </text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 空状态 -->
|
|
|
+ <view v-if="myStocks.length === 0" class="empty-content">
|
|
|
+ <view class="empty-icon">📊</view>
|
|
|
+ <text class="empty-text">暂无收藏股票</text>
|
|
|
+ <text class="empty-desc">在强势池中点击"+"按钮添加股票</text>
|
|
|
+ </view>
|
|
|
|
|
|
<!-- 底部安全区域 -->
|
|
|
<view class="bottom-safe-area"></view>
|
|
|
@@ -139,7 +120,6 @@ import StockListItem from '../../components/StockListItem.vue'
|
|
|
const isLoggedIn = ref(false)
|
|
|
const myStocks = ref([])
|
|
|
const viewMode = ref('list') // 'list' 或 'table'
|
|
|
-const swiperIndex = ref(0) // swiper当前索引
|
|
|
const isLoading = ref(false) // 加载状态
|
|
|
const lastLoadTime = ref(0) // 上次加载时间
|
|
|
const CACHE_DURATION = 5000 // 缓存有效期5秒
|
|
|
@@ -147,14 +127,6 @@ const CACHE_DURATION = 5000 // 缓存有效期5秒
|
|
|
// 设置视图模式
|
|
|
const setViewMode = (mode) => {
|
|
|
viewMode.value = mode
|
|
|
- swiperIndex.value = mode === 'list' ? 0 : 1
|
|
|
-}
|
|
|
-
|
|
|
-// swiper滑动切换
|
|
|
-const onSwiperChange = (e) => {
|
|
|
- const index = e.detail.current
|
|
|
- swiperIndex.value = index
|
|
|
- viewMode.value = index === 0 ? 'list' : 'table'
|
|
|
}
|
|
|
|
|
|
const indexData = ref({
|
|
|
@@ -606,16 +578,6 @@ onUnload(() => {
|
|
|
color: #E53935;
|
|
|
}
|
|
|
|
|
|
-/* 滑动切换容器 */
|
|
|
-.view-swiper {
|
|
|
- height: calc(100vh - 380rpx);
|
|
|
- width: 100%;
|
|
|
-}
|
|
|
-
|
|
|
-.swiper-scroll {
|
|
|
- height: 100%;
|
|
|
-}
|
|
|
-
|
|
|
/* 隐藏空列表 */
|
|
|
.hidden-list {
|
|
|
display: none !important;
|