sr-publicServicePlatform/component/mine/personal-info.js

(function() {
	Vue.component('personal-info', {
		template: '<div class="container ptb20 ">\
				<div class="row w3-row">\
					<left-menu :code="code"></left-menu>\
					<div class="pl251">\
						<div class="bgc-fff c-border ptb30">\
							<form class="mainbox" id="form" role="form" onsubmit="return false;" enctype="multipart/form-data" id="newInterfaceForm">\
								<div class="c-t-center mb10">\
									<img :src="userinfo.imgRemotePath || defaultImg" class="img-circle" width="100" height="100" id="personalImg" />\
									<div class="c-f14 c-909090 pt15">\
										<span>修改头像</span>\
										<input type="file" @change="uploadImg($event)" class="c-vam c-inline-block type-hide pl105" accept="image/jpg,image/jpeg,image/png" style="height:150px;margin-top:-150px;"></div>\
								</div>\
								<div class="w3-row mt50 form-group" style="height: 40px;">\
									<div class="w3-col c-f16 m5 c-t-right" style="width:80px;">姓&emsp;&emsp;名</div>\
									<div class="w3-rest pl15">\
										<input type="text" class="form-control" v-model="userinfo.realName" name="realName">\
									</div>\
								</div>\
								<div class="w3-row form-group" style="height: 40px;">\
									<div class="w3-col c-f16 m5 c-t-right" style="width:80px;">性&emsp;&emsp;别</div>\
									<div class="w3-rest pl15 c-f14">\
										<input type="radio" name="gender"  value="0" v-model="userinfo.gender">&emsp;男&emsp;\
										<input type="radio" name="gender"  value="1" v-model="userinfo.gender">&emsp;女\
									</div>\
								</div>\
								<div class="w3-row  mt25 form-group">\
									<div class="w3-col c-f16 m5 c-t-right" style="width:80px;">手机号码</div>\
									<div class="w3-rest pl15">\
										<input type="text" class="form-control" v-model="userinfo.telephone" name="telephone">\
									</div>\
								</div>\
								<div class="w3-row mt25 form-group">\
									<div class="w3-col c-f16 m5 c-t-right" style="width:80px;">身份证号</div>\
									<div class="w3-rest pl15">\
										<input type="text" class="form-control" v-model="userinfo.idCardNo" name="idCardNo" readonly="readonly">\
									</div>\
								</div>\
								<div class="w3-row mt25 form-group">\
									<div class="w3-col c-f16 m5 c-t-right" style="width:80px;">社保卡号</div>\
									<div class="w3-rest pl15">\
										<input type="text" class="form-control" v-model="userinfo.ssid" name="ssid">\
									</div>\
								</div>\
								<div class="w3-row mt25 form-group">\
									<div class="w3-col c-f16 m5 c-t-right" style="width:80px;">医疗保险号</div>\
									<div class="w3-rest pl15">\
										<input type="text" class="form-control" v-model="userinfo.micard" name="micard">\
									</div>\
								</div>\
								<div class="w3-row mt25 form-group">\
									<div class="w3-col c-323232 c-f16 m5 c-t-right" style="width:80px;">行&emsp;&emsp;业</div>\
									<div class="pl105" data-toggle="modal" data-target="#selindustry">\
										<input id="industry" placeholder="请选择行业" type="text" class="form-control" name="industry"  v-model="userinfo.profession" name="profession"><span class="caret selcaret"></span>\
									</div>\
								</div>\
								<div class="w3-row mt25">\
									<div class="w3-col c-323232 c-f16 m5 c-t-right" style="width:80px;">家庭住址</div>\
									<div class="pl105">\
										<selsect-address ref="getAddress"></selsect-address>\
										<div  class="form-group">\
											<textarea class="form-control mt10"  v-model="userinfo.street" name="street"></textarea>\
										</div>\
									</div>\
								</div>\
								<div class="c-t-center ">\
									<button type="submit" class="btn btn-theme c-f16 mtb30" style="width:144px;" @click="update()">保 存</button>\
								</div>\
							</form>\
							<select-industry ref="getIndustry"></select-industry>\
						</div>\
					</div>\
				</div>\
			</div>',
		props: [],
		data: function() {
			return {
				userinfo: {},
				code: "info",
				address: '',
				defaultImg: "../../../images/moren_touxiang_img.png",
			}
		},
		mounted: function() {
			var vm = this
			vm.initinfo()
			$('#selindustry').on('hidden.bs.modal', function(e) {
				vm.getNewIndustry()
			})
		},
		methods: {
			initinfo: function() {
				var vm = this;
				var loginInfo = JSON.parse(sessionStorage.getItem("oauthInfo"));
				var data1 = {
					userName: loginInfo.user,
					token: loginInfo.accessToken
				}
				loginAPI.getUserInfo(data1).then(function(res) {
					vm.userinfo = res
				})
			},
			getNewAddress: function() {
				var vm = this
				vm.userinfo.provinceId = vm.$refs.getAddress.provinceid
				vm.userinfo.cityId = vm.$refs.getAddress.cityid
				vm.userinfo.areaId = vm.$refs.getAddress.countyid				
				vm.userinfo.provinceName = vm.$refs.getAddress.provincename
				vm.userinfo.cityName = vm.$refs.getAddress.cityname
				vm.userinfo.areaName = vm.$refs.getAddress.countyname
			},
			getNewIndustry: function() {
				var vm = this
				var aaa = vm.$refs.getIndustry.industryname
				var bbb = vm.$refs.getIndustry.directionname
				if(bbb != "请选择方向") {
					vm.userinfo.profession = bbb
				} else if(aaa != "请选择行业") {
					vm.userinfo.profession = aaa
				}
			},
			uploadImg: function(e) {
				var file = {},
					vm = this
				file = e.target.files[0]
				if(file.size > 5 * 1024 * 1024) {
					toastr.error("图片大小格式超出5M范围不可用")
					return false
				}
				var formData = new FormData()
				formData.append('file', file)
				var param = {
					files: formData,
					creator: vm.userinfo.id,
					objectId: 'EHR',
				}
				fileAPI.uploadImg(param).then(function(reslove) {
					vm.userinfo.imgRemotePath = reslove.obj.httpUrl //上传到图片服务器成功则修改个人资料					
				}, function(err) {
					toastr.error("选择图片失败");
				})
			},
			update: function() {
				var vm = this
				var flag = $("#newInterfaceForm").valid();
				if(!flag) {
					//没有通过验证
					return;
				}
				vm.getNewAddress()
				mineAPI.userInforUpdate(vm.userinfo).then(function (res) {
                    toastr.success("修改成功!")
                }).catch(function(){
                    toastr.error("修改失败!")
                })
			},
			
		},
	})

})()