GuangYuYuan-app/pages/join/teamwork.vue

<template>
	<view class="team_work">
		<view class="banner">
			<image src="../../static/other/work.jpg" mode=""></image>
		</view>
		<view class="content">
			<view class="center">
				<view class="title">
					欢迎申请城市合伙人，请填写申请信息
				</view>
				<view class="city">
					<view class="left">
						<span>*</span>
						意向代理城市（中国）
					</view>
					<view class="right">
						<u-input v-model="form.city" :type="type" placeholder="请输入城市名" maxlength='4' />
					</view>
				</view>
				<view class="introduce">
					城市资源介绍
					<view class="inp">
						<textarea v-model="form.resource" cols="30" rows="3" placeholder="请输入城市资源介绍"></textarea>
					</view>
				</view>
				<view class="city">
					<view class="left">
						<span>*</span>
						合伙人姓名
					</view>
					<view class="right">
						<u-input v-model="form.name" :type="type" placeholder="请输入姓名" maxlength='4' />
					</view>
				</view>
				<view class="city">
					<view class="left">
						<span>*</span>
						手机
					</view>
					<view class="right">
						<u-input v-model="form.phoneNum" type="number" placeholder="请输入手机号码" />
					</view>
				</view>
				<view class="city">
					<view class="left">
						公司
					</view>
					<view class="right">
						<u-input v-model="form.company" :type="type" placeholder="请输入公司名称" />
					</view>
				</view>
				<view class="select">
					<view class="head">是否从事过按摩行业</view>
					<u-radio-group v-model="value1">
						<u-radio @change="selectIsWork" v-for="(item, index) in isWork" :key="index" :name="item.name">
							{{item.name}}
						</u-radio>
					</u-radio-group>
				</view>
				<view class="select">
					<view class="head">有几年按摩行业管理经验</view>
					<u-radio-group v-model="value2">
						<u-radio @change="selectIsYear" v-for="(item, index) in workYear" :key="index" :name="item.name">
							{{item.name}}
						</u-radio>
					</u-radio-group>
				</view>
				<view class="select">
					<view class="head">是否正在经营实体门店</view>
					<u-radio-group v-model="value3">
						<u-radio @change="selectIsEntity" v-for="(item, index) in isWork" :key="index" :name="item.name">
							{{item.name}}
						</u-radio>
					</u-radio-group>
				</view>
				<view class="btn_box">
					<view class="">
						提交后，我们会尽快和您取得联系。
					</view>
					<view class="btn" @click="submit">
						{{title}}
					</view>
				</view>
			</view>

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

<script>
	import {
		add,
		businessDevelopment,
		businessupdate
	} from '../../api/index'
	export default {
		data() {
			return {
				type: '',
				// isWork:0,
				isWork: [{
						name: '是',
						value: '1'
					},
					{
						name: '否',
						value: '0'
					}
				],
				workYear: [{
						name: '1-3年',
						value: '1'
					},
					{
						name: '4-10年',
						value: '2'
					},
					{
						name: '10年以上',
						value: '2'
					}
				],
				// u-radio-group的v-model绑定的值如果设置为某个radio的name，就会被默认选中
				value1: '',
				value2: '',
				value3: '',
				form: {
					city: '',
					company: '',
					isEntity: null,
					name: '',
					phoneNum: '',
					resource: '',
					years: null,
					id:''
				},
				title: '提交',
				updateId:''
			}
		},
		methods: {
			selectIsWork(e) {
				e == '是' ? this.form.isMassage = 1 : this.form.isMassage = 0;
			},
			selectIsYear(e) {
				this.form.years = e
			},
			selectIsEntity(e) {
				e == '是' ? this.form.isEntity = 1 : this.form.isEntity = 0;
			},
			getData() {
				let data = {}
				data.openId = uni.getStorageSync('wx_copenid')
				businessDevelopment(data).then(res => {
					this.form = res.data.data
					this.form.id = res.data.data.id
					this.title = '修改'
					res.data.data.isMassage == 0 ? this.value1 = '否' : this.value1 = '是'
					this.value2 = res.data.data.years
					res.data.data.isEntity == 0 ? this.value3 = '否' : this.value3 = '是'
				})
			},
			submit() {
				if (this.form.city == '') {
					uni.showToast({
						title: '请填写意向代理城市',
						icon: 'none'
					})
					return
				} else if (this.form.name == '') {
					uni.showToast({
						title: '请填写姓名',
						icon: 'none'
					})
					return
				} else if (this.form.phoneNum == '') {
					uni.showToast({
						title: '请填写手机号码',
						icon: 'none'
					})
					return
				} else if (!/^1[3456789]\d{9}$/.test(this.form.phoneNum)) {
					uni.showToast({
						title: '请输入正确的手机号',
						icon: 'none'
					});
					return;
				} else {
					if (this.title == '提交') {
						add(this.form).then(res => {
							if (res.data.code == 200) {
								uni.showToast({
									title: '已提交',
									icon: 'none'
								})
								setTimeout(() => {
									uni.navigateBack()
								}, 1000)
							} else {
								uni.showToast({
									title: res.data.msg,
									icon: 'none'
								})
							}
						})
					}else{
						businessupdate(this.form).then(res =>{
							if (res.data.code == 200) {
								uni.showToast({
									title: '已修改',
									icon: 'none'
								})
								setTimeout(() => {
									uni.navigateBack()
								}, 1000)
							} else {
								uni.showToast({
									title: res.data.msg,
									icon: 'none'
								})
							}
						})
					}
				}
			}
		},
		onShow() {
			this.getData()
			// uni.setStorageSync('access-token', 'eyJhbGciOiJIUzUxMiJ9.eyJ0ZjoiOiIwOGExYmJiNi1kY2ExLTRlYzktOWZlMy1kM2M3MTY1MmI0MWUifQ.ovvnC3-KzZ-c5BHfzB_5AtU4OKjHoMmHyOY5Y-YRsoJ14zkoGfqHpdBHgln6jhnsdIHNebsNspNNq_7-Mrl3Dw')
		}
	}
</script>

<style lang="scss" scoped>
	::v-deep .uni-input-wrapper {
		width: 150px;
		text-align: right;
		font-weight: 400;
	}

	.team_work {
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: column;
		overflow-y: auto;

		.banner {
			width: 100%;

			image {
				width: 100%;
			}
		}

		.content {
			width: 100%;
			flex: 1;
			padding: 0px 20rpx;
			box-sizing: border-box;
			background-color: #f7f7f7;
			position: relative;
			display: flex;
			justify-content: center;

			.center {
				width: 93%;
				padding: 30rpx;
				padding-bottom: 50px;
				box-sizing: border-box;
				background-color: #fff;
				border-radius: 10rpx;
				position: absolute;
				top: -30px;

				.title {
					border-bottom: 1px solid #ccc;
					padding: 20rpx 0px;
					font-size: 30rpx;
					font-weight: 700;
				}

				.city {
					padding: 16rpx 0px;
					font-size: 30rpx;
					font-weight: 700;
					border-bottom: 1px solid #ccc;
					display: flex;
					justify-content: space-between;
					align-items: center;
					box-sizing: border-box;

					.left {
						width: 60%;

						span {
							color: red;
							margin-right: 10rpx;
						}
					}

					.right {
						flex: 1;
					}
				}

				.introduce {
					font-size: 30rpx;
					font-weight: 700;
					padding-top: 10px;

					textarea {
						width: 100%;
						height: 80px;
						background-color: #f9f9f9;
						border-radius: 10px;
						padding: 15rpx;
						box-sizing: border-box;
						font-size: 26rpx;
						font-weight: 400;
						margin-top: 10px;
					}
				}

				.select {
					border-bottom: 1px solid #ccc;
					padding: 20rpx 0px;

					.head {
						margin-bottom: 10rpx;
						font-size: 30rpx;
						font-weight: 700;
					}
				}
			}

			.btn_box {
				margin-top: 20px;
				width: 100%;
				height: 50px;
				font-size: 26rpx;
				display: flex;
				flex-direction: column;
				align-items: center;

				.btn {
					width: 95%;
					height: 40px;
					text-align: center;
					background: linear-gradient(to right, #35c99d, #27aea7);
					margin: 10px auto;
					line-height: 40px;
					border-radius: 10px;
					color: #fcfdff;
				}
			}
		}
	}
</style>