对接

package-lock.json

@@ -8,6 +8,7 @@
         "@dcloudio/uni-ui": "^1.5.11",
         "@element-plus/icons-vue": "^2.3.2",
         "element-plus": "^2.11.5",
+        "highlight.js": "^11.11.1",
         "marked": "^2.0.1",
         "pinia": "^3.0.3",
         "pinia-plugin-persistedstate": "^4.5.0",
@@ -480,6 +481,15 @@
       "license": "MIT",
       "peer": true
     },
+    "node_modules/highlight.js": {
+      "version": "11.11.1",
+      "resolved": "https://registry.npmmirror.com/highlight.js/-/highlight.js-11.11.1.tgz",
+      "integrity": "sha512-Xwwo44whKBVCYoliBQwaPvtd/2tYFkRQtXDWj1nackaV2JPXx3L0+Jvd8/qCJ2p+ML0/XVkJ2q+Mr+UVdpJK5w==",
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=12.0.0"
+      }
+    },
     "node_modules/hookable": {
       "version": "5.5.3",
       "license": "MIT"

package.json

@@ -3,11 +3,10 @@
     "@dcloudio/uni-ui": "^1.5.11",
     "@element-plus/icons-vue": "^2.3.2",
     "element-plus": "^2.11.5",
-    "vue-i18n": "^9.14.5",
+    "highlight.js": "^11.11.1",
     "marked": "^2.0.1",
     "pinia": "^3.0.3",
-    "pinia-plugin-persistedstate": "^4.5.0"
+    "pinia-plugin-persistedstate": "^4.5.0",
+    "vue-i18n": "^9.14.5"
   }
-
-
 }

pages/deepExploration/MainForceActions.vue

@@ -47,9 +47,12 @@
 				<view class="txt">
 					<view class="txtHeader">
 						<image src="/static/deepExploration-images/plus.png" mode="aspectFill"></image>
-						<text>主力追踪</text>
+						<text>{{navItems[currentIndex].name}}</text>
+					</view>
+					<view class="txtContent">
+						<view v-if="loading" class="loading">加载中...</view>
+						<rich-text :nodes="htmlContent"></rich-text>
 					</view>
-					<view class="txtContent"></view>
 				</view>
 			</view>
 		</view>
@@ -79,6 +82,9 @@
 		getModel4First,
 		getModel4Second,
 	} from '/api/deepExploration/deepExploration.js'
+	import marked from 'marked'; // 引入 marked 库
+	import hljs from 'highlight.js';
+	import 'highlight.js/styles/atom-one-dark.css'; // 可替换为其他主题
 
 	// 响应式变量定义
 	const type = ref('deepExploration')
@@ -150,34 +156,67 @@
 	const recordId = ref('')
 	const parentId = ref('')
 	const stockId = ref('')
+
+	const loading = ref(true);
+	const error = ref('');
+	const htmlContent = ref('');
+	const markdownContent = ref('');
+
+	// 初始化 marked 配置（支持代码高亮）
+	marked.setOptions({
+	  highlight: (code, lang) => {
+	    if (lang && hljs.getLanguage(lang)) {
+	      return hljs.highlight(code, { language: lang }).value;
+	    }
+	    return hljs.highlightAuto(code).value;
+	  },
+	  breaks: true,
+	  gfm: true,
+	  sanitize: true, // 过滤掉 Markdown 中的 inline style（可能导致横向溢出）
+	  sanitizer: (html) => {
+	    // 移除所有 style 属性，避免后端返回的 Markdown 带强制横向样式
+	    return html.replace(/style="[^"]*"/g, '');
+	  }
+	});
+
 	//点击主力追踪
 	const handleTrack = async () => {
 		try {
-			const result = await getModel1First({
-				content: searchName.value,
-				language: "cn",
-				marketList: "hk,cn,usa,my,sg,vi,in,gb",
-				model: 1
-			})
-			console.log('result', result);
-			if (result.code == 200) {
-				stockCode.value = result.data.code
-				stockName.value = result.data.name
-				recordId.value = result.data.recordId
-				parentId.value = result.data.parentId
-				stockId.value = result.data.stockId
-				language.value = result.data.language
-				const res = await getModel1Second({
-					language: language.value,
-					recordId: recordId.value,
-					parentId: parentId.value,
-					stockId: stockId.value
-				})
-				console.log('res', res);
-			}
+			markdownContent.value = '\n## 📊 主力解码分析：\n### 序列密码\n\tL2情绪解码。当前股票序列密码为53、0、17、158，市场情绪未出现确定性转折。\n\n### 股票温度\n\tL1情绪监控。当前股票温度为51，处于温热区，情绪积极向上，资金稳步进场。趋势健康，量价配合良好。此时应积极跟随趋势，顺势而为。\n\n### 市场温度\n\t当前市场温度为61，处于温热区，指数温和上行，技术面呈多头排列，资金有序进场，赚钱效应扩散。需警惕市场风险，以规避“甜蜜陷阱”。\n    '
+			htmlContent.value = marked.parse(markdownContent.value);
+			 loading.value = true;
+			// const result = await getModel1First({
+			// 	content: searchName.value,
+			// 	language: "cn",
+			// 	marketList: "hk,cn,usa,my,sg,vi,in,gb",
+			// 	model: 1
+			// })
+			// console.log('result', result);
+			// if (result.code == 200) {
+			// 	stockCode.value = result.data.code
+			// 	stockName.value = result.data.name
+			// 	recordId.value = result.data.recordId
+			// 	parentId.value = result.data.parentId
+			// 	stockId.value = result.data.stockId
+			// 	language.value = result.data.language
+			// 	const res = await getModel1Second({
+			// 		language: language.value,
+			// 		recordId: recordId.value,
+			// 		parentId: parentId.value,
+			// 		stockId: stockId.value,
+			// 		token: 'pCtw6AYK0EHAaIexoFHsbZjtsfEAIhcmwkCFm6uKko8VPfMvyDiODL9v9c0veic9fIpQbvT8zN4sH/Si6Q'
+			// 	})
+			// 	if (res.code == 200) {
+			// 		markdownContent.value = res.data.markdown
+			// 		htmlContent.value = marked.parse(markdownContent.value);
+			// 	}
+			// 	console.log('res', res);
+			// }
 
 		} catch {
-
+			error.value = e.message || '加载失败，请重试';
+		}finally{
+			loading.value = false;
 		}
 	}
 
@@ -584,8 +623,9 @@
 <style scoped lang="scss">
 	.main {
 		width: 100%;
-		height: 100vh;
+		min-height: 100vh;
 		background-color: #fff;
+		 padding-bottom: 120rpx;
 
 		.search {
 			position: relative;
@@ -660,7 +700,6 @@
 			}
 
 			.graphAndTxt {
-				height: 300rpx;
 				background-color: #fff;
 				border-radius: 50rpx 50rpx 0 0;
 				padding: 68.6rpx 36.5rpx 0 36.5rpx;
@@ -783,6 +822,49 @@
 
 					.txtContent {
 						min-height: 200rpx;
+						padding: 20rpx 30rpx;
+						margin-bottom: 100rpx;
+						::v-deep * {
+						    box-sizing: border-box;
+						    width: 100% !important; // 强制所有解析后的标签占满容器宽度
+						    white-space: normal !important; // 取消强制不换行
+						    word-wrap: break-word !important; // 长词/长数字自动换行
+						  }
+						
+						  // 标题样式（确保换行）
+						  ::v-deep h2 {
+						    font-size: 32rpx;
+						    color: #333;
+						    margin: 25rpx 0 15rpx;
+						    line-height: 1.5;
+						  }
+						
+						  // 段落样式（核心换行控制）
+						  ::v-deep p {
+						    font-size: 26rpx;
+						    color: #666;
+						    margin: 15rpx 0;
+						    line-height: 1.8; // 增加行高，提升可读性
+						    text-align: justify; // 两端对齐，避免单侧参差不齐
+						  }
+						
+						  // 列表样式（纵向排列）
+						  ::v-deep ul, ::v-deep ol {
+						    margin: 15rpx 0 15rpx 30rpx;
+						  }
+						
+						  ::v-deep li {
+						    margin: 10rpx 0;
+						    line-height: 1.6;
+						  }
+						
+						  // 加载状态样式
+						  .loading {
+						    text-align: center;
+						    padding: 50rpx 0;
+						    color: #666;
+						    font-size: 26rpx;
+						  }
 					}
 				}
 			}