ybxf-security-uniapp/pagesA/fire/add_fireRun/add_fireEvent/add_fireEvent.vue

<template>
	<view class="uni-container uni-container-bg">
		<view class="example container" :style="'height: ' + (screenHeight - wheight - 75) + 'px'">
		<view class="event">
			<view class="event-title">事件时间</view>
			<uni-datetime-picker class="time-item-check" type="date" :clear-icon="false":disabled="isview"  v-model="eventTime"
				@maskClick="startMaskClick" placeholder="请选择事件时间" />
			<view class="content">
				<view class="event-title">出动人数</view>
				<u-input v-model="eventPeples" placeholder="请输入出动人数" :maxlength="1000" :disabled="isview"  count height="150">
				</u-input>
			</view>
			<view class="content">
				<view class="event-title">燃烧面积</view>
				<u-input v-model="burnArea" placeholder="请输入燃烧面积" :maxlength="1000" :disabled="isview" count height="150">
				</u-input>
			</view>
			<view class="content">
				<view class="event-title">过火面积</view>
				<u-input v-model="fireArea" placeholder="请输入过火面积" :maxlength="1000" :disabled="isview"  count height="150">
				</u-input>
			</view>
			<view class="content" style="margin-bottom: 60rpx;">
				<view class="event-title">事件内容</view>
				<u--textarea v-model="eventContent" placeholder="请输入内容" :disabled="isview" :maxlength="1000" count height="150">
				</u--textarea >
			</view>
		</view>
		</view>
		<view class="bottons heigthButton" v-if="!isview">
			<view class="buttons-item">
				<u-button shape="circle" type="primary" text="取消"
					:custom-style="{color:'#4CB2B6',backgroundColor: '#fff',border:'1px solid #fff',marginRight:'10px'}"
					@click="cancel">
				</u-button>
				<u-button shape="circle" type="primary" color="#4CB2B6" text="保存" @click="submit">
				</u-button>

			</view>
		</view>
	</view>
</template>

<script>
	import riliicon from '@/static/images/riliicon.png'
	import {
		createStationEvent,
		getOneMicrostation, //编辑获取
		updateOrgReport
	} from '@/api/fire_station/index';
	export default {
		data() {
			return {
				screenHeight: this.$screenHeight,
				wheight: '',
				eventContent: '',
				eventTime: '',
				riliicon: riliicon,
				isEditId: false,
				eventPeples:'',//出动人数
				burnArea:"",//燃烧面积
				fireArea:'',//过火面积
				runId:'',
				isview:false
			}
		},
		onLoad: function(option) {
			if(option.isview=="isview"){
				this.isview=true
			}
			this.runId=option.runId
			if (option.id) {
				this.isEditId = option.id
				getOneMicrostation({
					id: option.id
				}).then(reponse => {
					this.eventTime = reponse.data.eventTime
					this.eventContent = reponse.data.eventContent
					this.eventPeples=reponse.data.eventPeples,//出动人数
					this.burnArea=reponse.data.burnArea,//燃烧面积
					this.fireArea=reponse.data.fireArea,//过火面积
					console.log(reponse, 'opt');
				})
			}
		},
		mounted() {
			uni.createSelectorQuery().in(this).select('.heigthButton').boundingClientRect(data => {
				this.wheight = data.height
			}).exec()
		},
		methods: {
			submit() {
				console.log(this.runId,'this.runIdthis.runId');
				const that = this
				if (!this.eventContent) {
					return this.$modal.msgError('请填写事件内容')
				}
				if (!this.eventTime) {
					return this.$modal.msgError('请选择事件时间')
				}
				if (!this.isEditId) {
					createStationEvent({
						eventContent: this.eventContent,
						eventTime: this.eventTime + '',
						eventPeples:this.eventPeples,//出动人数
						burnArea:this.burnArea,//燃烧面积
						fireArea:this.fireArea,//过火面积
						microstationid:this.runId
					}).then(reponse => {
						that.$modal.msg('保存成功')
						setTimeout(() => {
							uni.navigateBack()
						}, 400)

					}).catch(err => {})
				} else {
					updateOrgReport({
						eventContent: this.eventContent,
						eventTime: this.eventTime + '',
						id: this.isEditId,
						eventPeples:this.eventPeples,//出动人数
						burnArea:this.burnArea,//燃烧面积
						fireArea:this.fireArea,//过火面积
						microstationid:this.runId
					}).then(reponse => {
						that.$modal.msg('编辑成功')
						setTimeout(() => {
							uni.navigateBack()
						}, 400)

					}).catch(err => {})
				}

			},
			cancel() {
				uni.navigateBack()
			}
		}
	}
</script>

<style lang="scss" scoped>
	body {
		background-color: #f5f7f9;
	}

	page {
		background-color: #f5f7f9 !important;
	}

	.uni-container {
		height: 100%
	}

	.event {
		margin-top: 40rpx;
		background-color: #F5F7F9;

		.content {
			margin-top: 40rpx
		}

		.event-title {
			color: #274647;
			font-size: 28rpx;
			margin-bottom: 28rpx
		}
	}

	/deep/ .uniui-calendar:before {
		display: inline-block;
		content: url('~@/static/images/riliicon.png');
		width: 40rpx;
		height: 40rpx;
		position: absolute;
		left: 14rpx;
		top: 16rpx
	}

	/deep/ .uni-input-placeholder {
		left: 44rpx !important;
	}

	/deep/.uni-input-input {
		margin-left: 40rpx;
	}

	/deep/ .uni-date-x[data-v-6e13d7e2],
	/deep/ .uni-date-x {
		height: 72rpx
	}

	.bottons {
		.buttons-item {
			display: flex;
			justify-content: space-between;
			width: 90%;
			margin-left: 5%
		}

		.u-button {
			width: 45%
		}

		position: fixed;
		left: 0;
		bottom: 30rpx;
		right: 0;
	}
	/deep/ .u-input{
		background: #fff;
	}
	.example {
		overflow-y: auto;
	}
</style>