ybxf-security-uniapp/pagesA/fire/notice/notcice_details/notcice_details.vue

<template>
	<view v-if="formData">
		<navInfo :title="current==1?'指令详情':'通知公告详情'"></navInfo>
		<view class="bgTopImg">
			<image slot="right" :src="`${urls}/navBg@2x.png`" class="bgTopImg"></image>
		</view>
		<view class="container uni-container">
			<uni-title type="h2" v-if="formData.comType" :title="formData.comTitle" align="center"></uni-title>
			<uni-title type="h2" v-else :title="formData.title" align="center"></uni-title>
			<text class="fabu-time">发布时间:{{times}}</text>
			<u-line></u-line>
			<view class="main-content">
				
				<!-- <text>{{formData.comContent}}</text> -->
				<rich-text v-if="formData.comContent" :nodes="formData.comContent" class="nodes"></rich-text>
				<rich-text v-else :nodes="formData.content" class="nodes"></rich-text>
				<view style="color: blue;float:right;font-size: 16px;" v-if="formData.attId">
					<!-- #ifdef MP-WEIXIN -->
					<text style="color:#00a3f4;cursor: pointer;"
						@click.native="down(formData.attId)">点击预览附件</text>
					<!-- #endif -->
					<!-- #ifdef H5 -->
					<a style="color:#00a3f4;cursor: pointer;" @click="down(formData.attId)">点击预览文件</a>
					<!-- #endif -->
				</view>
				<!-- <text class="uni-body flex justify-center padding-tb-sm"> 发布时间：{{formData.time}}</text> -->


				<!-- <text   class="flex flex-direction-row text-indent">
				 {{item}} </text> -->
				<!-- <text class="uni-body flex justify-end padding-tb-sm"> xx省消防救援总队 </text> -->

				<!-- <a class="uni-body flex justify-center padding-tb-sm" style='color: #007AFF;'> 附件1：历史遗留消防设施操作员名册.pdf</a> -->
			</view>
		</view>
		
	</view>
</template>
<script>
	let that = null
	import {
		getNoticeDetail, // 通知公告列详情
	} from "@/api/notice";
	import config from '@/config'
	import {
		downSee
	} from '@/utils/common.js'
	const baseUrlImg = config.baseUrlImg
	import navInfo from '@/pagesA/components/my-nav/nav'
	
	export default {
		components: {
			navInfo
		},
		data() {
			return {
				urls: baseUrlImg,
				// 数据
				formData: [],
				// 每页数据量
				pageSize: 20,
				// 当前页
				pageNo: 1,
				// 数据总量
				total: 0,
				// formData数据加载中
				loading: false,
				true: true,
				times: '',
				current: ''
			}
		},
		//目的页面接收
		//这里用onshow()也可以
		onLoad: function(option) {
			that = this;
			if (option.current) {
				this.current = option.current

			}
			this.$nextTick(() => {

				const eventChannel = this.getOpenerEventChannel();
				// 监听acceptDataFromOpenerPage事件，获取上一页面通过eventChannel传送到当前页面的数据
				eventChannel.on('acceptDataFromOpenerPage', function(val) {
					console.log(' val', val)
					that.formData = val
					that.times = val.createTime?uni.$u.timeFormat(parseInt(val.createTime.toString().slice(0,-3))):'';
				})
			})
		},
		methods: {
			// 下载附件
			down(appendix) {
				downSee(appendix)
			},
			// 获取数据
			// getData(id) {
			// 	console.log('id', id);
			// 	this.loading = true
			// 	getNoticeDetail({
			// 		id: id
			// 	}).then(response => {
			// 		console.log(response);
			// 		// 为数据赋值：通过展开运算符的形式，进行新旧数据的拼接 
			// 		this.formData = response.data
			// 	});
			// },
		}
	}
</script>
<style lang="scss" scoped>
	.album {
		@include flex;
		align-items: flex-start;

		&__avatar {
			background-color: $u-bg-color;
			padding: 5px;
			border-radius: 3px;
		}

		&__content {
			margin-left: 10px;
			flex: 1;
		}
	}

	.container {
		border-radius: 30px 30px 0px 0px;
		background: #fff;
		/*#ifdef H5*/
		margin-top: 100rpx;
		/* #endif */
		/* #ifdef  MP-WEIXIN*/
		margin-top: 100rpx;
		/* #endif */
		z-index: 999999;
		position: relative;
		min-height: 400rpx;
		;
	}

	.text-indent {
		text-indent: 2rem;
		display: block;
	}

	.main-content {
		margin-top: 30rpx;
	}

	/deep/.uni-title__base {
		color: #274647 !important
	}

	.fabu-time {
		display: flex;
		align-items: center;
		justify-content: center;
		margin-bottom: 20rpx;
	}
</style>