ybxf-security-uniapp/pagesA/fire/fire_station/people_fireStation/people_fireStation.vue

<template>
	<view>
		<button @click="addNewPeople" class="antherBtn">{{tomole}}</button>
		<u-button type="primary" text="提交测试按钮" @click="addSure" class="antherBtn"></u-button>
		<!-- 新增的人员表单项 -->
		<div v-for="(person, index) in membersList" :key="index" style="border-bottom: 1px solid black;">
			<u--form>
				<u-form-item class="typeStyle" :prop="'name' + (index + 1)">
					<p style="width: 150rpx;margin-left: 20rpx;">姓名{{(index + 1)}}</p>
					<u-input v-model="person.name" :placeholder="'请输入姓名'" />
				</u-form-item>
				<u-form-item class="typeStyle" :prop="'age' + (index + 1)">
					<p style="width: 150rpx;margin-left: 20rpx;">身份证号</p>
					<u-input v-model="person.userNum" :placeholder="'请输入身份证号'" />
				</u-form-item>
				<!-- 其他人员信息字段 -->
				<u-form-item class="typeStyle" :prop="'age' + (index + 1)">
					<p style="width: 150rpx;margin-left: 20rpx;">电话号</p>
					<u-input v-model="person.phone" :placeholder="'请输入电话号'" />
				</u-form-item>
				<u-form-item class="typeStyle" :prop="'age' + (index + 1)">
					<p style="width: 150rpx;margin-left: 20rpx;">人员类型</p>
					<u-input v-model="person.worker" :placeholder="'请输入人员类型'" />
				</u-form-item>
				<u-form-item class="antherStyle">
					<p style="width: 150rpx;">职务</p>
					<uni-data-select v-model="person.power" :localdata="range" @change="change"></uni-data-select>
				</u-form-item>
			</u--form>
		</div>
	</view>
</template>

<script>
	import {
		creatFirePeople,
		delFirePeople,
		outexcel,
		getMesbyid,
		getfirelist,
		getfirepage,
		editFirePeople,
		getuserfireid
	} from "../../../../api/peoplefire/index.js"
	export default {
		data() {
			return {
				membersList: [], //添加的人员数组
				resultId: '',
				value: 0,
				range: [{
						value: 0,
						text: "负责人"
					},
					{
						value: 1,
						text: "值班人员"
					},
					{
						value: 2,
						text: "普通人员"
					},
				],
				tomole: "添加人员",
				tableList: [], //显示的人员数组
				userId:'',
				smallFireId:'',
			}
		},
		methods: {
			addNewPeople() {
				const newPerson = {
					name: '',
					userNum: '',
					phone: '',
					worker: "",
					power: "",
					// 其他字段
				};
				this.membersList.push(newPerson);
			},
			addSure() {
				if (this.membersList.length !== 0) {
					let result = this.membersList
					result = JSON.stringify(result)
					localStorage.setItem('peopleNum', result)
				}
				console.log(this.membersList);
			},
			change(e) {
				console.log("e:", e);
			},
			getbackid() {
				let x = localStorage.getItem('getUserInfo_key')
				x = JSON.parse(x)
				this.userId = x.data.userInfo.id
				getuserfireid({userId:this.userId}).then(res=>{
					console.log(res,'userfire');
				})
				console.log(x.data.userInfo.id,'xxx');
			},
			getAllFire() {
				getfirepage({
					pageNo: 1,
					pageSize: 10
				}).then(res => {
					this.tableList = res.data.list
				})
			}
		},
		onLoad(options) {
			console.log(options, 'options')
			this.resultId = this.$route.query.addId
			if (this.resultId === '2') {
				this.tomole = '添加负责人'
			} else if (this.resultId === '1') {
				this.tomole = '添加值班人'
			} else {
				this.tomole = '添加人员信息'
			}
			console.log(this.$route.query, 'query'); // 输出传递的参数值
		},
		onShow() {
			this.getAllFire()
			this.getbackid()
		}
	}
</script>

<style>
	/deep/ .typeStyle {
		width: 650rpx !important;
	}

	/deep/ .antherStyle {
		width: 630rpx;
		height: 100rpx;
		margin-left: 20rpx;
	}

	/deep/ .antherBtn {
		width: 300rpx;
		margin-bottom: 30rpx;
		background-color: #4DB1B6;
		color: white;
	}
</style>