policyDetail.vue 4.69 KB
<template>
	<view class="page" style="width: 100%;height: 100%;">
		<!-- 文章内容 -->
		<view class="article-data">
			<view class="article-top">{{detailData.title}}</view>
			<view class="article-title">
				<view class="article-title-left">
					{{ detailData.creatorTime}}
				</view>
				<view class="article-title-right"><image src="../../static/kan.png"></image>{{detailData.viewCount ? detailData.viewCount : 0}}人</view>
			</view>
			<view class="article-content">
				<text>{{detailData.subTitle}}</text>
			</view>
			<view class="article-content">
				<view ref="htmlContainer" class="" v-html="detailData.bodyContent"  style="overflow: scroll;width: 100%;"></view>
			</view>
			<view class="article-img" v-show="detailData.imgUrl" v-for="(it,index) in detailData.imgUrl" :key="index">
				<image :src="baseUrl + it.url" mode="widthFix"></image>
			</view>
			<view class="doc_box" v-if="isDoc">
				<view class="" v-for="(it,index) in doc" :key="index">
					<a :href="baseUrl + it.url">{{it.name}}</a>
				</view>
			</view>
			<view class="doc_box" v-if="isPdf">
				<view class="" v-for="(it,index) in pdf" :key="index">
					<a :href="baseUrl + it.url">{{it.name}}</a>
				</view>
			</view>
		</view>
		
		<!-- <view class="feed-list">
			<view class="feed-list-box">
				<view class="feed-list-box-left">
					<view><image src="../../static/img/logo.png"></image></view>
					<view>
						<view class="feed-list-box-name">{{detailData.comanyName}}</view>
						<view class="feed-list-box-add"><image src="../../static/kefu1.png"></image>成都市锦江区带永明路666号</view>
					</view>
				</view>
				<view><view class="feed-list-box-btn">查看</view></view>
			</view>
			<view class="feed-list-content" @click="ArticleDetails">
				<view class="feed-list-content-title">{{detailData.subTitle}}</view>
				<view class="feed-list-content-flex">
					<view>{{ detailData.creatorTime}}</view>
					<view><image src="../../static/kan.png"></image><text style="color:#888D9C;">{{detailData.viewCount ? detailData.viewCount : 0}}人</text></view>
				</view>
			</view>
			<view class="feed-list-content">
				<view class="feed-list-content-title">急寻!!诚挚求购优质60吨火星苹果!</view>
				<view class="feed-list-content-flex">
					<view>2022-02-22 22:56</view>
					<view><image src="../../static/kan.png"></image><text style="color:#888D9C;">{{detailData.viewCount ? detailData.viewCount : 0}}人</text></view>
				</view>
			</view>
			<view class="feed-list-content">
				<view class="feed-list-content-title">急寻!!诚挚求购优质60吨火星苹果!</view>
				<view class="feed-list-content-flex">
					<view>2022-02-22 22:56</view>
					<view><image src="../../static/kan.png"></image><text style="color:#888D9C;">36人</text></view>
				</view>
			</view>
		</view> -->
	</view>
</template>

<script>
import utils from '../../service/utils';
import BASE_URL from '../../common/config.js'
	export default {
		data() {
			return {
				
				isComment: false,
				isGoods: false,
				// 需求详情数据
				detailData:[],
				// 存放页面跳转传递的数据
				data:[],
				baseUrl: "https://www.dygxq-es.cn",
				// doc文件
				doc:[],
				// pdf文件
				pdf:[],
				isDoc:false,
				isPdf:false
			};
		},
		onLoad(options){
			let that = this
			// 获取页面跳转传递来的数据
			this.data = JSON.parse(options.data)
			console.log(that.data)
			that.getPolicyDetail()
		},
		mounted() {
			// this.$nextTick(() => {
			// 	console.log('图片大小修改')
			//       // const images = this.$refs.htmlContainer.querySelectorAll('img');
			// 	  let images = this.$refs.htmlContainer.querySelectorAll('img')
			//       images.forEach(img => {
			//         img.style.width = '100%'; // 修改图片宽度为200px
			//         img.style.height = 'auto'; // 高度自动缩放以保持图片比例
			//       });
			//     });
		},
		methods:{
			// 获取需求详情数据
			getPolicyDetail(){
				let that = this
				let currentId = that.data
				console.log(currentId)
				that.API.getPolicyDetail(currentId).then(res =>{
					console.log(res)
					let createTime = utils.formatTime(res.data.createTime)
					res.data.creatorTime = createTime
					that.detailData = res.data
					that.doc = that.detailData.fileAtt
					that.isDoc = that.doc.length > 0
					that.pdf = that.detailData.fileInfo
					that.isPdf = that.pdf.length > 0
					console.log(that.detailData)
					let detailContent = res.data.bodyContent.replace(/<img/g,"<img style='max-width:100%;height:auto;'")
					that.detailData.bodyContent = detailContent
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	@import 'ArticleDetails.scss';
	::v-deep ima{
		width: 100%;
	}
	
	.article-content{
		img{
			width: 100%;
		}
	}
</style>