uniapp2/pages/eleControl/controlReport/controlReportDetail/controlReportDetail.vue

<template>
	<view class="appWrapper">
		<form action="">
			<view style="height:30rpx"></view>

			<view class="form-item">
				<view class="title">
					<text class="necessary">*</text>
					监察标题:
				</view>
				<input type="text" v-model="controlReportDetail.supervision_title" disabled>
			</view>

			<view class="form-item">
				<view class="title"><text class="necessary">*</text>所属站点:</view>
				<select name="" id="" filterable clearable v-model="controlReportDetail.site_id" disabled>
					<option value="">请选择</option>
					<option :value=item.id v-for="item in siteListData">{{ item.site_name}}</option>
				</select>
			</view>

			<view class="form-item">
				<view class="title"><text class="necessary">*</text>监察内容:</view>
				<textarea maxlength="-1" width="250" v-model="controlReportDetail.supervision_content"
					disabled></textarea>
			</view>


			<view class="form-item">
				<view class="title"><text class="necessary">*</text>上传图片:</view> 
				<view @click="previewImage()" style="width:500rpx;text-align:left">
					<image :src=this.$websiteUrl+controlReportDetail.scene_pictures mode="aspectFit"></image>
				</view>
				
				<!-- <view style="width:500rpx">
					<img :src=this.$websiteUrl+controlReportDetail.scene_pictures style="width:30%">

				</view> -->
			</view>

			<view class="form-item">
				<view class="title">
					<text class="necessary">*</text>
					提交人:
				</view>
				<input type="text" v-model="controlReportDetail.creator" disabled>
			</view>

			<view class="form-item">
				<view class="title">
					<text class="necessary">*</text>
					提交时间:
				</view>
				<input type="text" v-model="controlReportDetail.create_time" disabled>
			</view>
		</form>

		<view style="height:20rpx;background:#EDEDED"></view>
		<view class="form-item justify-between" style="border-bottom:1px solid #EDEDED;padding:20rpx 30rpx"
			@tap="goArchiveDetail()">
			<view>现场档案</view>
			<view><text class="icon iconfont margin-left-xs ">&#xe629;</text></view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				siteListData: [],
				controlReportDetail: {},

			}
		},
		onLoad: function(option) {
			this.getDataList({
				"id": option.id
			});
			this.getSiteList();
		},
		onShow() {
			// uni.$on('deltaOptions', function(res) {
			// 	// res就是传的值
			// })

		},
		mounted() {},
		methods: {
			previewImage() {
				// alert(this.$websiteUrl)
				uni.previewImage({
					// urls: [this.$websiteUrl+this.controlReportDetail.scene_pictures],
					urls: [this.controlReportDetail.scene_pictures?this.$websiteUrl+this.controlReportDetail.scene_pictures : "/static/cameraIcon2.png"]
				});
			
			},

			goArchiveDetail() {
				if (this.controlReportDetail.site_id) {

					uni.navigateTo({
						url: '/pages/siteArchive/archiveDetail/archiveDetail?siteId=' + this.controlReportDetail
							.site_id + '&mark=control',
					});
				} else {
					uni.showToast({
						title: "请先选择所属站点",
						icon: "none"
					});

				}
			},

			//数据请求
			async getDataList(params = {}) {
				const res = await this.$myRequest({
					url: 'MonitoringReporting/getMonitoringReportingList',
					showLoading: true,
					data: params
				})
				// console.log('res.data.data')
				// console.log(res.data.data)
				this.controlReportDetail = res.data.data[0];
				console.log(this.controlReportDetail)
			},
			//站带下拉数据请求
			async getSiteList(params = {}) {
				const res = await this.$myRequest({
					url: 'BlackoutPlan/getSiteBox',
					showLoading: true,
					data: params
				})
				this.siteListData = res.data.data
			},
		}
	}
</script>

<style lang="scss">
	select {
		background-size: 6%;
	}
</style>