ybxf-security-uniapp/pagesA/fire/remind/details/details.vue

<template>
	<view v-if="formData">
		<navInfo title="重要提醒详情"></navInfo>
		<view class="bgTopImg">
			<image slot="right" :src="`${urls}/navBg@2x.png`"></image>
		</view>
		<view class="container uni-container">
			<uni-title type="h2" v-if="formData.remindInfoRespVO" :title="formData.remindInfoRespVO.remindTitle"
				align="center"></uni-title>
			<text class="fabu-time">发布时间:{{formData.pubDate}}</text>
			<text class="fabu-time">完成时间:{{formData.doneDate}}</text>
			<u-line></u-line>
			<view class="main-content">

				<!-- <text>{{formData.comContent}}</text> -->
				<view class="titles">
					提醒内容描述:
				</view>
				<rich-text v-if="formData.remindInfoRespVO" :nodes="formData.remindInfoRespVO.remindContent"
					class="nodes"></rich-text>
				<rich-text v-else :nodes="'暂无内容'" class="nodes"></rich-text>
				<view class="titles"style="color: #000;">
					完成情况描述:
				</view>
				<rich-text v-if="formData.donetext" :nodes="formData.donetext"
					class="nodes"></rich-text>
				<rich-text v-else :nodes="'暂无内容'" class="nodes"></rich-text>

				<view style="color: blue;font-size: 16px;">
					<!-- #ifdef MP-WEIXIN -->
					<!-- 任务接收的文件 -->
					<view class="titles"  v-if="formData.sendFileUrls"style="color: #000;">
						提醒内容附件:
					</view>
					<view v-if="formData.sendFileUrls">
						<view class="" v-for="(item,index) in formData.sendFileUrls" :key="index">
							<text style="color:#00a3f4;cursor: pointer;"
								@click.native="down(item)">点击预览附件{{index+1}}</text>
						</view>
					</view>
					<view class="titles" v-if="formData.doneFileUrls" style="color: #000;">
						完成情况附件:
					</view>
					<!-- 完成文件 -->
					<view v-if="formData.doneFileUrls">
						<view class="" v-for="(item,index) in formData.doneFileUrls" :key="index">
							<text style="color:#00a3f4;cursor: pointer;"
								@click.native="down(item)">点击预览附件{{index+1}}</text>
						</view>
					</view>
					<!-- #endif -->
					<!-- #ifdef H5 -->
					<!-- 任务接收的文件 -->
					<view class="titles"  v-if="formData.sendFileUrls" style="color: #000;">
						提醒内容附件:
					</view>
					<view v-if="formData.sendFileUrls">
						<view class="" v-for="(item,index) in formData.sendFileUrls" :key="index">
							<a style="color:#00a3f4;cursor: pointer;" @click="down(item)">点击预览文件{{index+1}}</a>
						</view>
					</view>
					<view class="titles" v-if="formData.doneFileUrls" style="color: #000;">
						完成情况附件:
					</view>
					<!-- 完成文件 -->
					<view v-if="formData.doneFileUrls">
						<view class="" v-for="(item,index) in formData.doneFileUrls" :key="index">
							<a style="color:#00a3f4;cursor: pointer;" @click="down(item)">点击预览文件{{index+1}}</a>
						</view>
					</view>
					<!-- #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 {
		getRemindBroadDetail
	} from "@/api/remind";
	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: '',
				broadId: null
			}
		},
		//目的页面接收
		//这里用onshow()也可以
		onLoad: function(option) {
			that = this;
			this.broadId = option.id

			// this.$nextTick(() => {

			// 	const eventChannel = this.getOpenerEventChannel();
			// 	// 监听acceptDataFromOpenerPage事件，获取上一页面通过eventChannel传送到当前页面的数据
			// 	eventChannel.on('acceptDataFromOpenerPage', function(val) {
			// 		that.formData = val
			// 		that.times = val.createTime?uni.$u.timeFormat(parseInt(val.createTime.toString().slice(0,-3))):'';
			// 	})
			// })
		},
		onShow() {
			this.getDatas(this.broadId)
		},
		methods: {
			// 下载附件
			down(appendix) {
				downSee(appendix)
			},
			// 获取数据
			getDatas(id) {
				this.loading = true
				getRemindBroadDetail(this.broadId).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: 50rpx;
		/* #endif */
		/* #ifdef  MP-WEIXIN*/
		margin-top: 50rpx;
		/* #endif */
		z-index: 99;
		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;
	}
	//列表样式
	.titles {
		font-weight: 600;
		margin: 20rpx 0;
		font-size: 14px;
	}
</style>