townShip.vue 10.3 KB
<template>
	<!-- 机构 -->
	<view class="page">
		<view class="content">
			<view class="top-box" @click="gopath('/pages/receiptRegistration/receiptRegistrationList')">
				<view>上报历史</view>
				<view class="top-box-img">
					<image src="../../static/right2.png"></image>
				</view>
			</view>
			<view class="titleall-left">
				<view class="titleall-left-line"></view>我要上报
			</view>
			<view class="message-list">
				<view class="info-box">
					<view class="info-box-list">
						<view class="serve">
							<view class="serve-title">发生地点</view>
							<view>
								<input placeholder-style="color:#3d3d3d;font-weight: bold;font-size: 25rpx;"
									v-model="form.incidentLocation" placeholder="请输入" style="text-align: right;" />
							</view>
						</view>
					</view>
				</view>
				<view class="info-box">
					<view class="info-box-list">
						<view class="serve">
							<view class="serve-title">儿童姓名</view>
							<view>
								<input placeholder-style="color:#3d3d3d;font-weight: bold;font-size: 25rpx;"
									v-model="form.childName" placeholder="请输入" style="text-align: right;" />
							</view>
						</view>
					</view>
				</view>
				<view class="info-box">
					<view class="info-box-list">
						<view class="serve">
							<view class="serve-title">儿童性别</view>
							<view class="serve-right">
								<picker @change="bindPickerChangeSex" :value="index" :range="sexArray">
									<view class="uni-input">{{form.sex?sexArray[form.sex]:'请选择'}}</view>
								</picker>
								<image src="../../static/down3.png"></image>
							</view>
						</view>
					</view>
				</view>
				<view class="info-box">
					<view class="info-box-list">
						<view class="serve">
							<view class="serve-title">儿童年龄</view>
							<view>
								<input placeholder-style="color:#3d3d3d;font-weight: bold;font-size: 25rpx;"
									v-model="form.age" placeholder="请输入" style="text-align: right;" />
							</view>
						</view>
					</view>
				</view>
				<view class="info-box">
					<view class="info-box-list">
						<view class="serve">
							<view class="serve-title">报告原因</view>
							<view>
								<input placeholder-style="color:#3d3d3d;font-weight: bold;font-size: 25rpx;"
									v-model="form.reportReason" placeholder="请输入" style="text-align: right;" />
							</view>
						</view>
					</view>
				</view>
				<view class="info-box">
					<view class="info-box-list">
						<view>
							<view class="serve-title" style="font-size: 25rpx;color: #909090;">其他信息</view>
							<textarea v-model="form.reportRecord" placeholder="请输入"
								placeholder-style="color:#3d3d3d;font-weight: bold;font-size: 25rpx;"
								style="margin-top: 20rpx;"></textarea>
							<!-- <view>
								<input placeholder-style="color:#3d3d3d;font-weight: bold;font-size: 25rpx;"
									v-model="form.reportRecord" placeholder="请输入" style="text-align: right;" />
							</view> -->
						</view>
						<!-- <view class="serve">
							<view class="serve-title">其他信息</view>
							<view>
								<input placeholder-style="color:#3d3d3d;font-weight: bold;font-size: 25rpx;"
									v-model="form.reportRecord" placeholder="请输入" style="text-align: right;" />
							</view>
						</view> -->
					</view>
				</view>
			</view>
			<view class="titleall-left">
				<view class="titleall-left-line"></view>报告人信息
			</view>
			<view class="message-list">
				<view class="info-box">
					<view class="info-box-list">
						<view class="serve">
							<view class="serve-title">姓名</view>
							<view>
								<input placeholder-style="color:#3d3d3d;font-weight: bold;font-size: 25rpx;"
									v-model="form.reporterName" placeholder="请输入" style="text-align: right;" />
							</view>
						</view>
					</view>
				</view>
				<view class="info-box">
					<view class="info-box-list">
						<view class="serve">
							<view class="serve-title">与儿童关系</view>
							<view>
								<input placeholder-style="color:#3d3d3d;font-weight: bold;font-size: 25rpx;"
									v-model="form.relationshipWithChild" placeholder="请输入" style="text-align: right;" />
							</view>
						</view>
					</view>
				</view>
				<view class="info-box">
					<view class="info-box-list">
						<view class="serve">
							<view class="serve-title">电话</view>
							<view>
								<input placeholder-style="color:#3d3d3d;font-weight: bold;font-size: 25rpx;"
									v-model="form.phone" placeholder="请输入" style="text-align: right;" />
							</view>
						</view>
					</view>
				</view>
				<view class="info-box">
					<view class="info-box-list">
						<view class="serve">
							<view class="serve-title">报告主体</view>
							<view class="serve-right">
								<picker @change="bindPickerChangeSubject" :value="index" :range="SubjectArray">
									<view class="uni-input">{{form.reporterType?SubjectArray[index]:'请选择'}}</view>
								</picker>
								<image src="../../static/down3.png"></image>
							</view>
						</view>
					</view>
				</view>
				<view class="info-box" v-if="form.reporterType == '群众'">
					<view class="info-box-list">
						<view class="serve">
							<view class="serve-title">职业</view>
							<view>
								<input placeholder-style="color:#3d3d3d;font-weight: bold;font-size: 25rpx;"
									v-model="form.reporterOccupation" placeholder="请输入" style="text-align: right;" />
							</view>
						</view>
					</view>
				</view>
				<view class="info-box" v-if="form.reporterType == '单位' || form.reporterType == '社会组织'">
					<view class="info-box-list">
						<view class="serve">
							<view class="serve-title">单位名称</view>
							<view>
								<input placeholder-style="color:#3d3d3d;font-weight: bold;font-size: 25rpx;"
									v-model="form.reporterOrganizationName" placeholder="请输入"
									style="text-align: right;" />
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="page-footer">
				<view class="footer-buy">
					<view class="cart-add" @click="register">
						<image src="../../static/btn5.png"></image>
						<text>立即上报</text>
					</view>
				</view>
			</view>

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

<script>
	export default {
		data() {
			return {
				form: {
					reportTime: "",
					reportPlatform: "",
					incidentLocation: "",
					childName: "",
					sex: "",
					age: "",
					reportReason: "",
					reportRecord: "",
					reporterName: "",
					relationshipWithChild: "",
					phone: "",
					reporterType: "",
					reporterOrganizationName: "",
					reporterOccupation: "",
					userId: uni.getStorageSync('USERS_KEY').userId,
					reportPlatform: '个人上报'
				},
				// 性别下拉框
				sexArray: ['男', '女'],
				// 报告主体
				SubjectArray: ['群众', '单位', '社会组织'],
				index: 0
			};
		},
		methods: {
			gopath(e) {
				uni.navigateTo({
					url: e
				})
			},
			// 选择性别
			bindPickerChangeSex: function(e) {
				console.log('picker发送选择改变,携带值为', e)
				this.form.sex = e.detail.value;
			},
			// 选择主体
			bindPickerChangeSubject: function(e) {
				console.log('picker发送选择改变,携带值为', e)
				this.index = e.detail.value;
				this.form.reporterType = this.SubjectArray[this.index];
			},
			// 获取当前时间
			getTime() {
				var now = new Date();
				var year = now.getFullYear(); //获取完整的年份(4位,1970-????)
				var month = now.getMonth() + 1; //获取当前月份(0-11,0代表1月)
				var day = now.getDate(); //获取当前日(1-31)
				var hour = now.getHours(); //获取当前小时数(0-23)
				var minute = now.getMinutes(); //获取当前分钟数(0-59)
				var second = now.getSeconds(); //获取当前秒数(0-59)
				this.form.reportTime = year + "-" + (month < 10 ? "0" + month : month) + "-" + (day < 10 ? "0" + day :
						day) + " " + (hour < 10 ? "0" + hour : hour) + ":" + (minute < 10 ? "0" + minute : minute) + ":" +
					(
						second < 10 ? "0" + second : second);
			},
			register() {
				if (this.form.incidentLocation == null || this.form.incidentLocation.length == 0) {
					uni.showToast({
						icon: 'none',
						title: '请填写发生地点'
					})
					return
				}
				if (this.form.childName == null || this.form.childName.length == 0) {
					uni.showToast({
						icon: 'none',
						title: '请填写儿童姓名'
					})
					return
				}
				if (this.form.sex == null || this.form.sex.length == 0) {
					uni.showToast({
						icon: 'none',
						title: '请选择儿童性别'
					})
					return
				}
				if (this.form.age == null || this.form.age.length == 0) {
					uni.showToast({
						icon: 'none',
						title: '请填写儿童年龄'
					})
					return
				}
				if (this.form.reportReason == null || this.form.reportReason.length == 0) {
					uni.showToast({
						icon: 'none',
						title: '请填写报告原因'
					})
					return
				}
				if (this.form.reportRecord == null || this.form.reportRecord.length == 0) {
					uni.showToast({
						icon: 'none',
						title: '请填写其他信息'
					})
					return
				}
				if (this.form.reporterName == null || this.form.reporterName.length == 0) {
					uni.showToast({
						icon: 'none',
						title: '请填写报告人姓名'
					})
					return
				}
				if (this.form.relationshipWithChild == null || this.form.relationshipWithChild.length == 0) {
					uni.showToast({
						icon: 'none',
						title: '请填写与儿童关系'
					})
					return
				}
				if (this.form.phone == null || this.form.phone.length == 0) {
					uni.showToast({
						icon: 'none',
						title: '请填写电话'
					})
					return
				}
				if (this.form.reporterType == null || this.form.reporterType.length == 0) {
					uni.showToast({
						icon: 'none',
						title: '请选择报告主体'
					})
					return
				}
				this.getTime();
				this.form.filingType = '个人';
				this.form.reportType = '强制报告';
				console.log(this.form)
				this.API.addRegistration(this.form).then(res => {
					console.log(res)
					if (res.code == 200) {
						uni.showToast({
							icon: 'success',
							title: '上报成功'
						})
						setTimeout(() => {
							uni.redirectTo({
								url: '/pages/receiptRegistrationSuccess/receiptRegistrationSuccess',
							})
						}, 800)
					}
				})

			}
		}
	}
</script>

<style scoped lang="scss">
	@import 'receiptRegistration.scss';
</style>