<style>
	.newsInDetail .acdetailTop {
		width: 100%;
		height: auto;
		background-color: #fff;
		font-family: pingfang !important;
		padding: 10px;
	}

	.newsInDetail .acdetailImg {
		width: 100%;
		height: 190px;
		border-radius: 3px;
		overflow: hidden;
	}

	.newsInDetail .acdetaiTitle {
		margin: 15px auto;
		color: #0B0B0B;
		font-size: 16px;
		font-weight: 600;
	}

	.newsInDetail .acdetaiWriter {
		display: flex;
		justify-content: space-between;
		color: #B9B9B9;
		font-size: 12px;
		margin-top: 10px;
		align-items: center;
	}

	.newsInDetail .acdetaiLine {
		width: 100%;
		height: 10px;
		background-color: #F3F5F7;
	}

	.newsInDetail .acdetailBottom {
		width: 100%;
		min-height: 283px;
		padding: 15px 10px;
		background-color: #fff;
	}

	.newsInDetail .newsInDetail_Intro {
		color: #404040;
		font-size: 14px;
		line-height: 25px;
		margin-top: 20px;
	}
</style>
<template>
	<view class="newsInDetail" style="height:100vh;">
		<view class="acdetailTop">
			<view class="acdetaiTitle">
				<template v-if="dataList&&dataList.Title">
					{{dataList.Title}}
				</template>
			</view>
			<view class="acdetaiWriter">
				<view>
					<u-tag v-if="dataList&&dataList.Industry" :text="dataList.Industry" type="primary"
						style="margin-right: 12px;"></u-tag>
					<text>
						<template v-if="dataList&&dataList.PublishTimeStr">
							{{dataList.PublishTimeStr}}
						</template>
					</text>
				</view>
			</view>
		</view>
		<view class="acdetailBottom">
			<view class="newsInDetail_Intro" v-html="richtext"></view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				pageTitle: '新闻详情',
				msg: {
					Id: 0
				},
				dataList: {},
				richtext: '',
				mainColor: ''
			}
		},
		created() {},
		mounted() {
			uni.setNavigationBarTitle({
				title: this.pageTitle,
			});
		},
		onLoad(option) {
			this.msg.Id = option.Id;
			this.getList();
		},
		methods: {
			getList() {
				this.request2({
						url: "/api/AppletTrade/GetCommerceNews",
						data: this.msg,
					},
					(res) => {
						if (res.resultCode == 1) {
							this.dataList = res.data;
							let html = this.dataList.NewsInfo

							// 1. 处理图片：强制 max-width:100% （你原有的逻辑）
							html = html.replace(/<img[^>]*>/gi, function(match) {
								return match.replace(/style=\"(.*)\"/gi,
									'style="max-width:100% !important; height:auto;"');
							});

							// 2. 处理 table：强制宽度 100%，并移除固定 width 属性
							html = html.replace(/<table[^>]*>/gi, function(match) {
								// 先移除原有的 width 属性（可能是 width="657" 或 width="100%"）
								let newMatch = match.replace(/\s*width\s*=\s*["'][^"']*["']/gi, '');
								// 再处理 style，添加或覆盖 width:100%
								if (/style\s*=\s*["'][^"']*["']/i.test(newMatch)) {
									// 已有 style 属性，添加 width:100%
									newMatch = newMatch.replace(/style\s*=\s*["']([^"']*)["']/i, function(
										styleMatch, styleContent) {
										// 如果 style 中已有 width，先移除
										styleContent = styleContent.replace(/width\s*:[^;]+;?/gi, '');
										return `style="${styleContent}; width:100%;"`;
									});
								} else {
									// 没有 style 属性，直接添加
									newMatch = newMatch.replace(/<table/, '<table style="width:100%;"');
								}
								return newMatch;
							});

							this.richtext = html;
							// this.richtext = this.dataList.NewsInfo.replace(/<img[^>]*>/gi, function(match, capture) {
							// 	var match = match.replace(/style=\"(.*)\"/gi,
							// 		'style="max-width:100% !important"');
							// 	return match;
							// });
						}
					}
				);
			}
		}
	}
</script>