ybxf-security-uniapp/pagesA/fire/archive/archive_details/archive_details2.vue

<template>
	<view class=" uni-container">
		<view class="example container" :style="'height: ' + (screenHeight - wheight - 75) + 'px'">
			<!-- 自定义表单校验 1-->
			<u--form :model="formData" labelPosition="top" labelWidth="300" labelAlign="left">
				<view class=" flex  flex-direction width100">
					<u-form-item label="居（村）民委员会名称" prop="jwhmc" :required="true">
						<u-input v-model="formData.jwhmc" placeholder="居（村）民委员会名称" disabled/>
					</u-form-item>
					<u-form-item label="联系电话" prop="lxdh" :required="true">
						<u-input v-model="formData.lxdh" placeholder="联系电话" disabled/>
					</u-form-item>
					<u-form-item label="消防安全管理人" prop="xfaqglr" :required="true">
						<u-input v-model="formData.xfaqglr" placeholder="消防安全管理人" disabled/>
					</u-form-item>
					<u-form-item label="办公地址"><u-input v-model="formData.bgdz" disabled placeholder="办公地址" /></u-form-item>

					<u-form-item label="是否建立微型消防站或志愿消防队	">
						<u-input v-model="formData.sfjlwxxfz" disabled placeholder="是否建立微型消防站或志愿消防队" />
					</u-form-item>
					<u-form-item label="是否组织制定防火安全公约		">
						<u-input v-model="formData.sfzdfhgy" disabled placeholder="是否组织制定防火安全公约" />
					</u-form-item>
					<u-form-item label="所辖单位（场所）数量">
						<u-input v-model="formData.sxdwsl" disabled placeholder="所辖单位（场所）数量" />
					</u-form-item>
					<u-form-item label="所辖居（村）民人数" prop="sxjmrs">
						<u-input v-model="formData.sxjmrs" disabled placeholder="所辖居（村）民人数" />
					</u-form-item>
					<u-form-item label="备注">
						<u-textarea disabled v-model="formData.remark"
							placeholder="备注"></u-textarea>
					</u-form-item>
				</view>
			</u--form>
		</view>
		<uni-row class="heigthButton">
			<u-button @click="gotoEditArchive(formData)" shape="circle" size="large" color="#4cb2b6" text="修改信息"
				style="width: 60%;"></u-button>
		</uni-row>
	</view>
</template>
<script>
	var that = null;
	export default {
		data() {
			return {
				formData: {
					orgName: ''
				},
				screenHeight: this.$screenHeight,
				wheight: '',
			};
		},
		mounted() {
			uni.createSelectorQuery().in(this).select('.heigthButton').boundingClientRect(data => {
				this.wheight = data.height
			}).exec()
		},
		onLoad: function(option) {
			that = this;
			var data = option.id;
			// 接收来自上个页面传递的参数
			const eventChannel = this.getOpenerEventChannel();
			eventChannel.on('acceptDataFromOpenerPage', function(val) {
				that.formData = val;
				console.log('val+++++++++++++++++++', that.formData);
			});
			this.formData.orgName = option.orgName;
			console.log('option: ', that.formData);
		},

		methods: {
			// 传递当前页面数据到 ‘修改信息’
			gotoEditArchive(val) {
				uni.navigateTo({
					url: '/pagesA/fire/archive/edit_archive/edit_archive2',
					events: {
						// 为指定事件添加一个监听器，获取被打开页面传送到当前页面的数据
						acceptDataFromOpenedPage: function(val) {
							this.formData = val;
						}
					},
					success: function(res) {
						// 通过eventChannel向被打开页面传送数据
						res.eventChannel.emit('acceptDataFromOpenerPage', val);
					}
				});
			}
		}
	};
</script>
<style lang="scss" scoped>
	page {
		background-color: #F5F7F9;
	}

	.container {
		position: relative;
		// height: 220vh;
		background-color: rgb(245, 247, 249);
		overflow: auto;

		.buju {
			margin: 40rpx 0;
		}
	}

	.cont {}

	.weiwan {
		color: #d51a52;
		background: rgba(213, 26, 82, 0.2);
		padding: 5rpx 20rpx;
		border-radius: 2px;
		border: 1px solid #d51a52;
	}

	.yiwan {
		color: #4cb2b6;
		background: rgba(76, 178, 182, 0.2);
		padding: 5rpx 20rpx;
		border-radius: 2px;
		border: 1px solid #4cb2b6;
	}

	.miaoshu {
		margin-right: 20rpx;
		color: #274647;
		font-weight: 600;
	}
</style>