mz/pages/public/MecRegister.vue

<template>
	<view class="content">
		<view class="content_box">
			<view class="row b-b">
				<text class="tit">机构名称</text>
				<input class="input" type="text" v-model="name" placeholder="请输入机构名称" placeholder-class="placeholder" />
			</view>
			<view class="row b-b">
				<text class="tit">联系电话</text>
				<input class="input" type="text" v-model="phone" placeholder="请输入联系电话"
					placeholder-class="placeholder" />
			</view>
			<view class="row b-b">
				<text class="tit">负责人</text>
				<input class="input" type="text" v-model="leader" placeholder="请输入负责人姓名"
					placeholder-class="placeholder" />
			</view>
		</view>
		<view class="content_box">
			<view class="row b-b" @tap="showPicker('region')">
				<text class="tit">省市区</text>
				<input class="input" @focus='outFocus' v-model="addr" placeholder="请选择省市区"></input>
			</view>
			<w-picker mode="region" :value="defaultRegion" default-type="value" @confirm="onConfirm($event,'region')"
				@cancel="handleCancel" ref="region"></w-picker>
			<view class="row b-b">
				<text class="tit">详细地址</text>
				<input class="input" type="text" v-model="address" placeholder="请输入商家地址"
					placeholder-class="placeholder" />
			</view>
		</view>
		<!-- <view class="content_box">
			<view class="examine_list">
				<view class="examine_name">营业执照</view>
				<view class="examine_img"><image :src="img" @click="scImg('img')"></image></view>
			</view>
		</view> -->
		<view class="check_box flex_item">
			<view>
				<radio style="transform: scale(0.75)" @click="Getcheckbox" color="#6786FB" :checked="checked" />
			</view>
			<view class="">我已阅读并同意<text @click="TOprivacy">《预约平台用户协议》</text></view>
		</view>
		<view class="check_box flex_item" style="font-size: 26rpx;">
			<view class="">注册完成后，务必关注公众号<text style="color:#6786FB ;">【共享预约平台】</text>，否则无法接收到消息推送！</view>
		</view>
		<view class="add-btn" @click="confirm">提交申请</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex';
	import uniList from '@/components/uni-list/uni-list.vue';
	import uniListItem from '@/components/uni-list-item/uni-list-item.vue';
	import wPicker from "@/components/w-picker/w-picker.vue"
	import {
		setOrgan
	} from "@/api/index.js"
	import {
		getUserInfo
	} from '@/api/login.js';
	// import { upload } from '@/api/index.js';
	export default {
		components: {
			uniList,
			uniListItem,
			wPicker
		},
		data() {
			return {
				loading: false,
				checked: false,
				name: '', //机构名称
				phone: "",
				region: '',
				defaultRegion: [],
				defaultRegion1: [],
				options: [],
				leader: '', //负责人
				addr: '', //省市区
				address: '', //详细地址
				// img:'/static/img/add.png',
			};
		},
		onLoad(option) {
			let jginfo = uni.getStorageSync('jginfo') || ''
			console.log(jginfo, '获取jginfo')
			if (jginfo) {
				this.name = jginfo.name
				this.phone = jginfo.phone
				this.province = jginfo.province
				this.province_id = jginfo.province_id
				this.city = jginfo.city
				this.city_id = jginfo.city_id
				this.district = jginfo.district
				this.district_id = jginfo.district_id
				this.leader = jginfo.leader
				this.address = jginfo.address
				this.addr = jginfo.addr
			}
		},
		methods: {
			...mapMutations(['setUserInfo']),
			TOprivacy() {
				uni.navigateTo({
					url: '/pages/public/uagreement'
				})
			},
			//省市区弹窗
			showPicker(type) {
				this.$refs[type].show();
			},
			// scImg(item) {
			// 	upload({
			// 		file: ''
			// 	}).then(e => {

			// 	}).catch((e) => {

			// 	});
			// },
			//阅读并同意
			Getcheckbox() {
				let obj = this;
				obj.checked = !obj.checked;
			},
			//取消弹窗
			handleCancel() {

			},
			outFocus(e) {
				console.log(event.target)
				event.target.blur()
			},
			//省市区选择确定
			onConfirm(res, type) {
				let obj = this;
				obj.result = res;
				console.log(res, 'res')
				obj.addr = res.result;
				if (res.name) {
					obj.province = res.name[0];
					obj.city = res.name[1];
					obj.district = res.name[2];
				} else {
					obj.province = '北京市';
					obj.city = '北京市';
					obj.district = '东城区';
				}
				obj.province_id = res.value[0];
				obj.city_id = res.value[1];
				obj.district_id = res.value[2];
				obj.hospital = ''; //重置医院
			},
			//提交
			confirm() {
				let obj = this;
				if (obj.loading) {
					return
				}
				if (!obj.name) {
					obj.$api.msg('请填写机构名称');
					return;
				}
				if (!obj.phone) {
					obj.$api.msg('请填写联系电话');
					return;
				}
				if (!obj.leader) {
					obj.$api.msg('请填写负责人姓名');
					return;
				}
				if (!obj.addr) {
					obj.$api.msg('请选择省市区');
					return;
				}
				if (!obj.address) {
					obj.$api.msg('请填写详细地址');
					return;
				}
				if (obj.checked == false) {
					obj.$api.msg('请阅读并同意机构入驻协议');
					return;
				}
				obj.loading = true
				// let jginfo = {
				// 	name: obj.name,
				// 	phone: obj.phone,
				// 	province: obj.province,
				// 	province_id: obj.province_id,
				// 	city: obj.city,
				// 	city_id: obj.city_id,
				// 	district: obj.district,
				// 	district_id: obj.district_id,
				// 	leader: obj.leader,
				// 	address: obj.address,
				// 	addr: obj.addr
				// }
				// console.log(jginfo, 'jginfo++++++++++++++')
				// uni.setStorageSync('jginfo', jginfo)
				setOrgan({
						name: obj.name,
						mobile: obj.phone,
						province: obj.province,
						province_id: obj.province_id,
						city: obj.city,
						city_id: obj.city_id,
						district: obj.district,
						district_id: obj.district_id,
						leader: obj.leader,
						detail_address: obj.address,
						latitude: 1,
						longitude: 1
					})
					.then(function(e) {
						obj.loading = false
						obj.$api.msg(e.msg);
						obj.userInfo();
						let jginfo = {
							name: obj.name,
							phone: obj.phone,
							province: obj.province,
							province_id: obj.province_id,
							city: obj.city,
							city_id: obj.city_id,
							district: obj.district,
							district_id: obj.district_id,
							leader: obj.leader,
							address: obj.address,
							addr: obj.addr
						}
						console.log(jginfo, 'jginfo++++++++++++++')
						uni.setStorageSync('jginfo', jginfo)
						if (e.msg == '已提交，请等待审核！') {
							setTimeout(function() {
								// uni.switchTab({
								// 	url: '/pages/index/home'
								// })
								// document.addEventListener(
								// 	"WeixinJSBridgeReady",
								// 	function() {
								// 		WeixinJSBridge.call("closeWindow");
								// 	},
								// 	false
								// );
								// //ios手机
								// WeixinJSBridge.call("closeWindow");
								uni.navigateTo({
									url: '/pages/public/erweima'
								})
							}, 2000);
						}
					})
					.catch(e => {
						obj.loading = false
						console.log(e)
					});
			},
			//选择身份后更新用户信息
			userInfo() {
				getUserInfo({})
					.then(function(e) {
						console.log(e);
						uni.setStorageSync('userInfo', e.data);
					})
					.catch(function(e) {
						console.log(e);
					});
			},
			//跳转机构入驻协议
			// toagreement(){
			// 	uni.navigateTo({
			// 		url: '/pages/public/agreement'
			// 	});
			// },
		}
	};
</script>

<style lang="scss">
	page {
		background: $page-color-base;
		padding-top: 25rpx;
	}

	.content_box {
		background-color: #ffffff;
		width: 92%;
		margin: 0rpx auto;
		border-radius: 15rpx;
		margin-bottom: 25rpx;
	}

	.row {
		display: flex;
		align-items: center;
		// position: relative;
		padding: 0 30rpx;
		height: 110rpx;
		background: #fff;
		border-bottom: 1rpx solid #f8f6f6;

		.tit {
			flex-shrink: 0;
			width: 180rpx;
			font-size: 30rpx;
			color: $font-color-dark;
		}

		.input {
			flex: 1;
			font-size: 30rpx;
			color: $font-color-dark;
		}

		.iconlocation {
			font-size: 36rpx;
			color: $font-color-light;
		}
	}

	.examine_name {
		color: #171717;
		font-size: 28rpx;
		padding: 25rpx 25rpx;
	}

	.examine_img {
		width: 100%;
		text-align: center;
		padding-bottom: 25rpx;
	}

	.examine_img image {
		width: 200rpx;
		height: 200rpx;
	}

	.default-row {
		margin-top: 16rpx;

		.tit {
			flex: 1;
		}

		switch {
			transform: translateX(16rpx) scale(0.9);
		}
	}

	.add-btn {
		position: fixed;
		bottom: 0rpx;
		width: 100%;
		height: 100rpx;
		font-size: $font-lg;
		color: #fff;
		background-color: #6786FB;
		line-height: 100rpx;
		text-align: center;
	}

	.img_box {
		padding: 35rpx 35rpx;
		width: 250rpx;
		height: 250rpx;
	}

	.img_box image {
		width: 100%;
		height: 100%;
	}

	.alert-box {
		background-color: #ffffff;
	}

	.b-b:after {
		position: relative !important;
	}

	.check_box {
		padding: 25rpx 25rpx;
		font-size: 28rpx;

		text {
			color: #6786FB;
		}
	}
</style>