znyc.dispatching.wx/pages/construction_add/construction_add.vue

<template>
	<view id="warp">
		<view class="t_login_passList dispalyFlexRow">
			<view class="input_icon"><text style="color:red;">*</text>施工单位：</view>
			<input class="input_css" v-model="gcInfo.constructionName" border="none" placeholder="请输入施工单位"></input>
		</view>
		<view class="t_login_passList dispalyFlexRow">
			<view class="input_icon">联 系 人：</view>
			<input class="input_css" v-model="gcInfo.contactName" border="none" placeholder="请输入联系人"></input>
		</view>
		<view class="t_login_passList dispalyFlexRow">
			<view class="input_icon">联系电话：</view>
			<input class="input_css" v-model="gcInfo.contactPhone" border="none" placeholder="请输入联系电话"></input>
		</view>
		<view class="t_login_passList dispalyFlexRow">
			<view class="input_icon">启用状态：</view>
			<view class="input_img">
				<switch :checked="gcInfo.status" color="#007AFF" @change="change" />
			</view>
		</view>
		<view class="btn_css">
			<button class="btn" @tap="nextHandle">保存</button>
		</view>
	</view>
</template>
<script>
	const {
		urlList,
		https
	} = require('@/static/api');
	export default {
		data() {
			return {
				gcInfo: {
					constructionName: '',
					contactName:'',
					contactPhone:'',
					status: true,
				},
			};
		},
		onLoad(options) {
			const {
				item
			} = options;
			// console.log(item)
			if (item) {
				this.gcInfo=JSON.parse(item)
				uni.setNavigationBarTitle({
					title: '施工单位编辑'
				});
			}
		},
		methods: {
			change(e){
				 	this.gcInfo.status=e.detail.value
			},
			// 保存
			nextHandle() {
				let {
					constructionName,
					contactName,
					contactPhone,
					status,
				} = this.gcInfo;
				if (constructionName == '') {
					uni.showToast({
						title: '请填写施工单位名称',
						icon: 'none',
					})
					return;
				};
				this.gcInfo.id ? this.putAddUser('put') : this.putAddUser('add')
			},
			// 修改、新增 人员信息
			putAddUser(type) {
				var postData = {
					constructionName: this.gcInfo.constructionName,
					contactName: this.gcInfo.contactName,
					contactPhone: this.gcInfo.contactPhone,
					status: this.gcInfo.status
				}
				if (type == 'add') {
					console.log(postData)
					https(urlList.add_construction, 'POST', postData, '正在新增...').then(data => {
						console.log(data)
						uni.showToast({
							title: '新增成功',
							icon: 'none',
							duration: 1500
						})
						setTimeout(()=>{
							uni.navigateBack();
						},1500)
					}).catch(err => {
						uni.showToast({
							title: err,
							icon: 'none',
							duration: 1500
						})
					})
				} else {
					postData.id = this.gcInfo.id;
					https(urlList.add_construction, 'PUT', postData, '正在修改...').then(data => {
						const that = this;
						uni.showToast({
							title: '修改成功',
							icon: 'none'
						})
						setTimeout(()=>{
							uni.navigateBack();
						},1500)
					}).catch(err => {
						uni.showToast({
							title: err,
							icon: 'none',
							duration: 1500
						})
					})
				}
			},
		},
	}
</script>

<style lang="scss" scoped>
	#warp {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		.dispalyFlexRow {
			display: flex;
			flex-direction: row;
			align-items: center;
		}
	
	.dispalyFlexColumn {
			display: flex;
			flex-direction: column;
		}

		.t_login_passList {
			width: 720rpx;
			padding: 10rpx 0rpx;
			border-bottom: 1rpx solid #e6e6e6;

			.input_icon {
				width: 270rpx;
				// border: 1px solid red;
				margin-top: 5rpx;
				display: flex;
				flex-direction: row;
				align-items: center;
				padding-left: 10rpx;
			}

			.input_css {
				height: 70rpx;
				width: 400rpx;
				// text-align: right;
				display: inline-block;
			}

			.input_css3 {
				height: 70rpx;
				width: 350rpx;
				text-align: right;
				display: inline-block;
			}

			.code3 {
				margin-left: 20rpx;
				width: 50rpx;
				display: flex;
				justify-content: flex-end;
			}

			.input_img {
				width: 430rpx;
				display: flex;
				justify-content: flex-end;
			}

			.t_login_passList2 {
				width: 100%;
				display: flex;
				flex-direction: row;
				align-items: center;

				.input_icon {
					width: 470rpx;
					// border: 1px solid red;
					margin-top: 5rpx;
					display: flex;
					flex-direction: row;
					align-items: center;
					padding-left: 10rpx;
				}

				.input_css3 {
					height: 70rpx;
					width: 150rpx;
					text-align: right;
					display: inline-block;
				}

				.code3 {
					margin-left: 20rpx;
					width: 50rpx;
					display: flex;
					justify-content: flex-end;
				}
			}

			.people_list {
				width: 100%;
				display: flex;
				flex-direction: column;
				align-items: flex-end;

				.p_list_item {
					display: flex;
					flex-direction: row;
					align-items: center;
					margin-right: 20rpx;
					margin-top: 10rpx;
					color: #4f4f4f;
				}
			}
		}

		.no_center {
			align-items: flex-start;
		}

		.btn_css {
			width: 700rpx;
			position: fixed;
			bottom: 10rpx;
			left: 25rpx;
			display: block;

			.btn {
				background-color: #1B64F8FF;
				color: white;
				margin-bottom: 48rpx;
			}
		}
	}
</style>