个股中心

2026-01-31 11:05:49 +08:00
parent 1bce4b8e6c
commit e2610ccd9c
2 changed files with 175 additions and 57 deletions
--- a/pages.json
+++ b/pages.json
@@ -163,12 +163,7 @@
 				"navigationBarTitleText": ""
 			}
 		},
-		{
-			"path": "components/word-cloud/word-cloud",
-			"style": {
-				"navigationBarTitleText": ""
-			}
-		},
+	
 		{
 			"path": "components/WordCloud/WordCloud",
 			"style": {
--- a/pages/geGuCenter/geGuCenter.vue
+++ b/pages/geGuCenter/geGuCenter.vue
@@ -109,25 +109,50 @@
 						<view style="color: #2B2B2B; font-weight: bold; font-size: 26rpx; margin-right: 10rpx;">
 							{{item.concept_name}}
 						</view>
-						<view
-							style="color: #EC3440; font-size: 20rpx; border: 1rpx solid #EC3440; border-radius: 15rpx; height: 30rpx; display: flex; align-items: center; justify-content: center; padding: 0 10rpx; box-sizing: border-box;">
-							<image style="width: 18rpx; height: auto;" src="/pages/geGuCenter/icon/ydjk-zs.png"
-								mode="widthFix"></image>
-							<view style="margin-left: 10rpx;">异动</view>
+						<view :style="{
+						        color: alertTypeConfig[item.alert_type]?.color || '#FF7A45',
+						        fontSize: '20rpx',
+						        border: '1rpx solid ' + (alertTypeConfig[item.alert_type]?.color || '#FF7A45'),
+						        borderRadius: '15rpx',
+						        height: '30rpx',
+						        display: 'flex',
+						        alignItems: 'center',
+						        justifyContent: 'center',
+						        padding: '0 10rpx',
+						        boxSizing: 'border-box'
+						      }">
+
+							<image style="width: 18rpx; height: auto;"
+								:style="{ filter: alertTypeConfig[item.alert_type]?.filter || '' }"
+								src="/pages/geGuCenter/icon/ydjk-zs.png" mode="widthFix">
+							</image>
+							<view style="margin-left: 10rpx;">
+								{{ alertTypeConfig[item.alert_type]?.text || '异动' }}
+							</view>
 						</view>
 						<view style="flex: 1; font-size: 22rpx; text-align: right;">
 							<text style="color: #71675D;">板块均涨</text>
 							<text :style="{
-							    color: Number(item.alpha) > 0 ? '#EC3440' : '#01AB5D',
-							    fontWeight: 'bold',
-							    marginLeft: '5rpx',
-							    marginRight: '15rpx'
-							  }">
-								{{ Number(item.alpha) > 0 ? '+' + formatAlpha(item.alpha) : formatAlpha(item.alpha) }}%
+							      color: Number(item.alpha) > 0 ? '#EC3440' : '#01AB5D',
+							      fontWeight: 'bold',
+							      marginLeft: '5rpx',
+							      marginRight: '25rpx'
+							    }">
+								{{ item.formattedAvg }}%
+							</text>
+							<text :style="{
+							    color: item.upCount > 0 ? '#EC3440' : '#888888',
+							    fontWeight: 'bold'
+							  }">
+								{{item.upCount}}涨
 							</text>
-							<text style="color: #EC3440; font-weight: bold;">0涨</text>
 							<text style="color: #888888; margin: 0 5rpx;">/</text>
-							<text style="color: #01AB5D; font-weight: bold;">0跌</text>
+							<text :style="{
+							     color: item.downCount > 0 ? '#01AB5D' : '#888888',
+							     fontWeight: 'bold'
+							   }">
+								{{item.downCount}}跌
+							</text>
 						</view>
 					</view>

@@ -199,7 +224,7 @@
 		</uni-popup>

 		<uni-popup ref="detailPopup" type="bottom" :safeArea="false">
-			<view class="detailPopup">
+			<view class="detailPopup" style="height: 550rpx;">
 				<view
 					style="height: 120rpx; display: flex; align-items: center; justify-content: center; font-size: 28rpx; font-weight: 500;">
 					<view style="color: #727A8E; width: 60rpx;"></view>
@@ -223,30 +248,50 @@

 						<view style="flex: 1; font-size: 22rpx; text-align: right;">
 							<text style="color: #71675D;">板块均涨</text>
-							<text
-								style="color: #EC3440; font-weight: bold; margin-left: 10rpx; margin-right: 20rpx;">+0.00%</text>
-							<text style="color: #EC3440; font-weight: bold;">0涨</text>
+							<text :style="{
+							      color: Number(formattedAvg) > 0 ? '#EC3440' : '#01AB5D',
+							      fontWeight: 'bold',
+							      marginLeft: '10rpx',
+							      marginRight: '20rpx'
+							    }">{{ formattedAvg }}%</text>
+							<text :style="{
+							    color: upCount > 0 ? '#EC3440' : '#888888',
+							    fontWeight: 'bold'
+							  }">
+								{{upCount}}涨
+							</text>
 							<text style="color: #888888; margin: 0 5rpx;">/</text>
-							<text style="color: #01AB5D; font-weight: bold;">0跌</text>
-							<text style="color: #71675D; margin-left: 20rpx;">涨停比</text>
-							<text style="color: #EC3440; font-weight: bold; margin-left: 10rpx;">0%</text>
+							<text :style="{
+							     color: downCount > 0 ? '#01AB5D' : '#888888',
+							     fontWeight: 'bold'
+							   }">
+								{{downCount}}跌
+							</text>
+							
+								<text style="color: #71675D; margin-left: 20rpx;">涨停比</text>
+								<text
+									style="color: #EC3440; font-weight: bold; margin-left: 10rpx;">{{ formatLimitUpRatio(limit_up_ratio, 0) }}</text>
+							
 						</view>
 					</view>
 				</view>
-				<view v-for="(item, index) in conceptStocksList" :key="index"
-					style="padding: 0 25rpx; box-sizing: border-box; height: 45rpx; margin: 0 45rpx; display: flex; align-items: center; font-weight: 500;"
-					:style="{ 'background-color': (index % 2 == 0 ? '#fff' : '#FAFAFC')}">
-					<!-- 股票名称 -->
-					<view style="color: #222222; font-size: 24rpx; font-weight: bold;">{{ item.name }}</view>
-					<!-- 股票代码 -->
-					<view style="flex: 1; color: #888888; font-size: 20rpx; margin: 0 20rpx;">{{ item.code }}</view>
-					<!-- 涨跌幅（动态绑定颜色和格式化显示） -->
-					<view :style="{ color: getChangeColor(item.change_pct), fontSize: '22rpx', fontWeight: 'bold' }">
-						{{ formatChangePct(item.change_pct) }}
-					</view>
-				</view>

-				
+				<scroll-view scroll-y="true" show-scrollbar="false" style="flex: 1; ">
+					<view v-for="(item, index) in conceptStocksList" :key="index"
+						style="padding: 0 25rpx; box-sizing: border-box; height: 45rpx; margin: 0 45rpx; display: flex; align-items: center; font-weight: 500;"
+						:style="{ 'background-color': (index % 2 == 0 ? '#fff' : '#FAFAFC')}">
+						<!-- 股票名称 -->
+						<view style="color: #222222; font-size: 24rpx; font-weight: bold;">{{ item.name }}</view>
+						<!-- 股票代码 -->
+						<view style="flex: 1; color: #888888; font-size: 20rpx; margin: 0 20rpx;">{{ item.code }}</view>
+						<!-- 涨跌幅（动态绑定颜色和格式化显示） -->
+						<view
+							:style="{ color: getChangeColor(item.change_pct), fontSize: '22rpx', fontWeight: 'bold' }">
+							{{ formatChangePct(item.change_pct) }}
+						</view>
+					</view>
+				</scroll-view>
+
 			</view>
 		</uni-popup>
 	</view>
@@ -273,6 +318,43 @@
 				allStockData: [],
 				filteredData: [],
 				conceptStocksList: [],
+				alertTypeConfig: {
+					'surge': {
+						text: '异动',
+						color: '#FF7A45', // rgb(255, 122, 69)
+						filter: 'brightness(0) saturate(100%) invert(54%) sepia(60%) saturate(467%) hue-rotate(344deg) brightness(102%) contrast(101%)'
+					},
+					'shrink_surge_up': {
+						text: '缩量急涨',
+						color: '#722ED1', // rgb(114, 46, 209)
+						filter: 'brightness(0) saturate(100%) invert(24%) sepia(90%) saturate(2865%) hue-rotate(266deg) brightness(87%) contrast(98%)'
+					},
+					'volume_surge_up': {
+						text: '放量急涨',
+						color: '#EB2F96', // rgb(235, 47, 150)
+						filter: 'brightness(0) saturate(100%) invert(34%) sepia(82%) saturate(1970%) hue-rotate(313deg) brightness(91%) contrast(94%)'
+					},
+					'volume_oscillation': {
+						text: '放量震荡',
+						color: '#13C2C2', // rgb(19, 194, 194)
+						filter: 'brightness(0) saturate(100%) invert(71%) sepia(62%) saturate(487%) hue-rotate(142deg) brightness(91%) contrast(93%)'
+					},
+					'surge_up': {
+						text: '急涨',
+						color: '#FF4D4F', // rgb(255, 77, 79)
+						filter: 'brightness(0) saturate(100%) invert(42%) sepia(93%) saturate(727%) hue-rotate(346deg) brightness(102%) contrast(104%)'
+					},
+					'surge_down': {
+						text: '急跌',
+						color: '#52C41A', // rgb(82, 196, 26)
+						filter: 'brightness(0) saturate(100%) invert(68%) sepia(65%) saturate(456%) hue-rotate(71deg) brightness(91%) contrast(86%)'
+					},
+					'shrink_surge_down': {
+						text: '缩量急跌',
+						color: '#FF7A45', // rgb(255, 122, 69)
+						filter: 'brightness(0) saturate(100%) invert(54%) sepia(60%) saturate(467%) hue-rotate(344deg) brightness(102%) contrast(101%)'
+					}
+				},
 				topLists: [{
 						title: '大盘涨跌幅',
 						value: '+0.00%',
@@ -345,7 +427,11 @@
 						backIcon: '/static/icon/gegu/cate-4.png'
 					}
 				],
-				marketAlertsList: []
+				marketAlertsList: [],
+				formattedAvg: 0,
+				upCount: 0,
+				downCount: 0,
+				limit_up_ratio: 0
 			}
 		},
 		onLoad(e) {
@@ -543,6 +629,39 @@
 					this.topLists[0].value = formattedPct;
 					this.topLists[0].color = color;

+					// ========== 新增：处理每个异动条目的均涨/涨数/跌数 ==========
+					const processedAlerts = alerts.map(alertItem => {
+						// 1. 获取当前异动条目下的股票列表（假设字段是 stocks，需根据实际接口调整）
+						const stocks = alertItem.stocks || [];
+
+						// 2. 过滤有效股票（change_pct 非空且是数字）
+						const validStocks = stocks.filter(s => s.change_pct != null && !isNaN(Number(s
+							.change_pct)));
+
+						// 3. 计算板块均涨
+						const avgChange = validStocks.length > 0 ?
+							validStocks.reduce((sum, s) => sum + Number(s.change_pct), 0) / validStocks
+							.length :
+							0;
+
+						// 4. 计算上涨/下跌股票数量
+						const upCount = validStocks.filter(s => Number(s.change_pct) > 0).length;
+						const downCount = validStocks.filter(s => Number(s.change_pct) < 0).length;
+
+						// 5. 格式化均涨值（保留2位小数，处理正负号）
+						const roundedAvg = Math.round(avgChange * 100) / 100; // 四舍五入保留2位
+						const formattedAvg = roundedAvg > 0 ? `+${roundedAvg.toFixed(2)}` : roundedAvg
+							.toFixed(2);
+
+						// 6. 返回原数据 + 新增计算字段
+						return {
+							...alertItem,
+							alpha: avgChange, // 供模板中判断颜色和显示数值
+							upCount: upCount, // 上涨股票数
+							downCount: downCount, // 下跌股票数
+							formattedAvg: formattedAvg // 格式化后的均涨值（带正负号）
+						};
+					});



@@ -562,9 +681,8 @@
 					};

 					// 3. 对 alerts 数组进行排序
-					const sortedAlerts = alerts.sort(sortByTimeDesc);
-
-					// 4. 将排序后的数组赋值给页面变量（假设你用的是 Vue，可根据实际框架调整）
+					const sortedAlerts = processedAlerts.sort(sortByTimeDesc);
+					// 赋值给页面变量的是处理+排序后的数组
 					this.marketAlertsList = sortedAlerts;
 				}).catch(error => {

@@ -626,26 +744,31 @@
 			},
 			bkydAction(item) {
 				this.$refs["detailPopup"].open()
-
-				this.conceptStocksDetails(item.concept_id)
+				this.formattedAvg = item.formattedAvg,
+					this.upCount = item.upCount,
+					this.downCount = item.downCount,
+					this.limit_up_ratio = item.limit_up_ratio,
+					this.conceptStocksDetails(item.concept_id)
 			},
 			conceptStocksDetails(concept_id) {
 				console.log("concept_id", concept_id)

-				conceptStocks(concept_id,{}).then(res => {
+				conceptStocks(concept_id, {}).then(res => {
 					if (res.data && res.data.stocks) {
 						// 将接口数据赋值给列表数组
-					 let rawData = res.data.stocks;
-					            
-					            // 2. 对数据进行排序处理
-					            this.conceptStocksList = rawData.sort((a, b) => {
-					                // 将 None 值转换为 -999
-					                const aValue = a.change_pct === null || a.change_pct === undefined ? -999 : Number(a.change_pct);
-					                const bValue = b.change_pct === null || b.change_pct === undefined ? -999 : Number(b.change_pct);
-					                
-					                // 降序排列（涨幅高的在前）
-					                return bValue - aValue;
-					            });
+						let rawData = res.data.stocks;
+
+						// 2. 对数据进行排序处理
+						this.conceptStocksList = rawData.sort((a, b) => {
+							// 将 None 值转换为 -999
+							const aValue = a.change_pct === null || a.change_pct === undefined ? -999 :
+								Number(a.change_pct);
+							const bValue = b.change_pct === null || b.change_pct === undefined ? -999 :
+								Number(b.change_pct);
+
+							// 降序排列（涨幅高的在前）
+							return bValue - aValue;
+						});
 					} else {
 						console.warn('接口返回数据格式异常', res);
 					}