个人资料

apis/user.js

@@ -144,4 +144,13 @@ export function receiveGiveCoupon(data) {
 		data:data ,
 		url: '/mobile/chargingCouponApi/receiveGiveCoupon'
 	})
+}
+
+export function changeBirthday(data) {
+	 
+	return request({
+		method: 'get',
+		data:data ,
+		url: '/mobile/regUser/changeBirthday'
+	})
 }

pages/user/dataSet.vue

@@ -1,256 +1,539 @@
 <template>
 	<view>
 		<ujp-navbar title="个人资料"></ujp-navbar>
-		
+
 		<!-- 个人信息 -->
 		<view class="userCell">
-			<view class="title">
+			<view class="title oldTextjp2" oldstyle="font-size: 20px;">
 				个人信息
 			</view>
 			<!-- 头像 -->
-			<view class="userCell-item" >
-				<view class="userCell-title oldTextjp" oldstyle="font-size: 20px;">
-					<text class="user" ><img style="visibility: middle;;" src="../../assets/img/account-circle-fill.svg" alt=""></text>
-					<p>头像</p>
+			<view class="userCell-item">
+				<view class="userCell-title">
+					<text class="user"><img style="visibility: middle;;" src="../../assets/img/account-circle-fill.svg"
+							alt=""></text>
+					<p class="oldTextjp" oldstyle="font-size: 18px;">头像</p>
 				</view>
-				<view class="userCell-content">
+				<view class="userCell-content oldTextjp2" oldstyle="font-size: 18px;" @click="uploadPhoto">
 					<view class="value">
-					  
-					  		<u-avatar class="avatar" :src="src" size="80">
+
+						<view class="box">
+							<u-avatar v-if="form.headImg != null" class="avatar" :src="form.headImg+'?x-oss-process=image/resize,m_fill,w_256,h_256'" size="80">
 								<img src="" alt="">
-								
 							</u-avatar>
-							<view class="box">
-								<img class="camera" src="../../assets/img/camera-fill.svg" alt="">
-							</view>
-							
-
+							<img v-else class="camera" src="../../assets/img/camera-fill.svg" alt="">
+						</view>
+						
 					</view>
 					<u-icon name="arrow-right-s-line" custom-prefix="custom-icon" color="#B3B3B3" size="48"></u-icon>
 				</view>
 			</view>
 			<!-- 昵称 -->
-		<view class="userCell-item" >
-			<view class="userCell-title oldTextjp" oldstyle="font-size: 20px;">
-				<text class="user" ><img style="visibility: middle;;" src="../../assets/img/edit-box-fill.svg" alt=""></text>
-				<p>昵称</p>
-			</view>
-			<view class="userCell-content" @click="show=true">
-				<view class="value black">
-					萌萌哒
+			<view class="userCell-item">
+				<view class="userCell-title oldTextjp" oldstyle="font-size: 20px;">
+					<text class="user"><img style="visibility: middle;;" src="../../assets/img/edit-box-fill.svg"
+							alt=""></text>
+					<p class="oldTextjp" oldstyle="font-size: 18px;">昵称</p>
+				</view>
+				<view class="userCell-content oldTextjp2" oldstyle="font-size: 18px;" @click="maskShow">
+					<view class="value black">
+						{{form.nickName}}
+					</view>
+					<u-icon name="arrow-right-s-line" custom-prefix="custom-icon" color="#B3B3B3" size="48"></u-icon>
 				</view>
-				<u-icon name="arrow-right-s-line" custom-prefix="custom-icon" color="#B3B3B3" size="48"></u-icon>
 			</view>
-		</view>
-		<!-- 生日 -->	
-			<view class="userCell-item" >
+			<!-- 生日 -->
+			<view class="userCell-item">
 				<view class="userCell-title oldTextjp" oldstyle="font-size: 20px;">
-					<text class="user" ><img style="visibility: middle;;" src="../../assets/img/cake-2-fill.svg" alt=""></text>
-					<p>生日</p>
+					<text class="user"><img style="visibility: middle;;" src="../../assets/img/cake-2-fill.svg"
+							alt=""></text>
+					<p class="oldTextjp" oldstyle="font-size: 18px;">生日</p>
 				</view>
-				<view class="userCell-content">
-					<view class="value">
+				<u-picker mode="time" v-model="timeShow" :params="params" @confirm="confirmTime" @cancel="cancelTime"></u-picker>
+				<view class="userCell-content oldTextjp2" oldstyle="font-size: 18px;" @click="timeShowClick">
+					<view class="value black" v-if="birthday != null">
+						{{birthday}}
+					</view>
+					<view class="value" v-else>
 						请选择
 					</view>
 					<u-icon name="arrow-right-s-line" custom-prefix="custom-icon" color="#B3B3B3" size="48"></u-icon>
 				</view>
 			</view>
-			
-			
+
 		</view>
 		<u-line color="#F2F2F2 100%" length="87.2%" margin="8px auto 0" />
 		<!-- 账户与安全 -->
 		<view class="userCell">
-			<view class="title">
+			<view class="title oldTextjp2" oldstyle="font-size: 20px;">
 				账户与安全
 			</view>
 			<!-- 更换手机号 -->
-			<view class="userCell-item" >
+			<view class="userCell-item">
 				<view class="userCell-title oldTextjp" oldstyle="font-size: 20px;">
-					<text class="user" ><img style="visibility: middle;;" src="../../assets/img/smartphone-fill.svg" alt=""></text>
-					<p>更换手机号</p>
+					<text class="user"><img style="visibility: middle;;" src="../../assets/img/smartphone-fill.svg"
+							alt=""></text>
+					<p class="oldTextjp" oldstyle="font-size: 18px;">更换手机号</p>
 				</view>
-				<view class="userCell-content">
+				<view class="userCell-content oldTextjp2" oldstyle="font-size: 18px;" @click="gotoUrl('pages/user/phone')">
 					<view class="value black">
-						139****9333
+						{{userPhone}}
 					</view>
 					<u-icon name="arrow-right-s-line" custom-prefix="custom-icon" color="#B3B3B3" size="48"></u-icon>
 				</view>
 			</view>
 			<!-- 实名认证 -->
-		<view class="userCell-item" >
-			<view class="userCell-title oldTextjp" oldstyle="font-size: 20px;">
-				<text class="user" ><img style="visibility: middle;;" src="../../assets/img/shield-user-fill.svg" alt=""></text>
-				<p>实名认证</p>
-			</view>
-			<view class="userCell-content">
-				<view class="value">
-					未实名
+			<view class="userCell-item">
+				<view class="userCell-title oldTextjp" oldstyle="font-size: 20px;">
+					<text class="user"><img style="visibility: middle;;" src="../../assets/img/shield-user-fill.svg"
+							alt=""></text>
+					<p class="oldTextjp" oldstyle="font-size: 18px;">实名认证</p>
+				</view>
+				<view class="userCell-content oldTextjp2" oldstyle="font-size: 18px;">
+					<view class="value">
+						未实名
+					</view>
+					<u-icon name="arrow-right-s-line" custom-prefix="custom-icon" color="#B3B3B3" size="48"></u-icon>
 				</view>
-				<u-icon name="arrow-right-s-line" custom-prefix="custom-icon" color="#B3B3B3" size="48"></u-icon>
 			</view>
-		</view>	
 		</view>
 		<u-line color="#F2F2F2 100%" length="87.2%" margin="8px auto 0" />
 		<!-- 更多操作 -->
 		<view class="userCell">
-			<view class="title">
+			<view class="title oldTextjp2" oldstyle="font-size: 20px;">
 				更多操作
 			</view>
 			<!-- 车辆信息 -->
-			<view class="userCell-item" >
+			<view class="userCell-item">
 				<view class="userCell-title oldTextjp" oldstyle="font-size: 20px;">
-					<text class="user" ><img style="visibility: middle;;" src="../../assets/img/car-fill (1).svg" alt=""></text>
-					<p>车辆信息</p>
+					<text class="user"><img style="visibility: middle;;" src="../../assets/img/car-fill (1).svg"
+							alt=""></text>
+					<p class="oldTextjp" oldstyle="font-size: 18px;">车辆信息</p>
 				</view>
-				<view class="userCell-content">
-					<view class="value">
+				<view class="userCell-content oldTextjp2" oldstyle="font-size: 18px;" @click="carClick">
+					<view class="value black" v-if="carList.carNum != null">
+						{{carList.carNum}}
+					</view>
+					<view class="value" v-else>
 						未绑定
 					</view>
 					<u-icon name="arrow-right-s-line" custom-prefix="custom-icon" color="#B3B3B3" size="48"></u-icon>
 				</view>
 			</view>
 			<!-- 长辈模式 -->
-		<view class="userCell-item" >
-			<view class="userCell-title oldTextjp" oldstyle="font-size: 20px;">
-				<text class="user" ><img style="visibility: middle;;" src="../../assets/img/zoom-in-fill.svg" alt=""></text>
-				<p>长辈模式</p>
-			</view>
-			<view class="userCell-content">
-				<view class="value">
-					
-					<view class="text black">
-						字体更多 看得清
+			<view class="userCell-item">
+				<view class="userCell-title">
+					<text class="user"><img style="visibility: middle;;" src="../../assets/img/zoom-in-fill.svg"
+							alt=""></text>
+					<p class="oldTextjp" oldstyle="font-size: 18px;">长辈模式</p>
+				</view>
+				<view class="userCell-content oldTextjp2" oldstyle="font-size: 18px;">
+					<view class="value">
+
+						<view class="text black">
+							字体更大 看得清
+						</view>
+
+						<u-switch v-model="checked" active-color="#00E266" @change="checkedChange"></u-switch>
 					</view>
-					
-					<u-switch v-model="checked" active-color="#00E266" ></u-switch>
+					<u-icon name="arrow-right-s-line" custom-prefix="custom-icon" color="#B3B3B3" size="48"></u-icon>
 				</view>
-				<u-icon name="arrow-right-s-line" custom-prefix="custom-icon" color="#B3B3B3" size="48"></u-icon>
-			</view>
-		</view>	
-		<!-- 注销账号 -->
-		<view class="userCell-item" >
-			<view class="userCell-title oldTextjp" oldstyle="font-size: 20px;">
-				<text class="user" ><img style="visibility: middle;;" src="../../assets/img/spam-3-fill.svg" alt=""></text>
-				<p>注销账号</p>
 			</view>
-			<view class="userCell-content">
-				<view class="value black" style="font-size: 14px;">
-					注销后无法恢复，请谨慎操作
+			<!-- 注销账号 -->
+			<view class="userCell-item" @click="gotoUrl('pages/user/logout')">
+				<view class="userCell-title">
+					<text class="user"><img style="visibility: middle;;" src="../../assets/img/spam-3-fill.svg"
+							alt=""></text>
+					<p class="oldTextjp" oldstyle="font-size: 18px;">注销账号</p>
+				</view>
+				<view class="userCell-content">
+					<view class="value black" :style="elderStatus ? 'font-size: 16px;' : 'font-size: 14px;'">
+						注销后无法恢复，请谨慎操作
+					</view>
+					<u-icon name="arrow-right-s-line" custom-prefix="custom-icon" color="#B3B3B3" size="48"></u-icon>
 				</view>
-				<u-icon name="arrow-right-s-line" custom-prefix="custom-icon" color="#B3B3B3" size="48"></u-icon>
 			</view>
 		</view>
-		</view>
-		
-		
-		
-		<view class="exit">
+
+		<view class="exit oldTextjp2" oldstyle="font-size: 18px;" @click="signOut">
 			退出账号
 		</view>
-		
+		<view>
+			<u-modal v-model="exitShow" @confirm="confirm" confirm-color="#FF3D00" :show-cancel-button="true" ref="uModal" :asyncClose="true" :title="title" 
+				:content="content" :content-style="{color: '#333333'}"></u-modal>
+		</view>
+
 		<!-- 遮罩层 -->
 		<u-mask :show="show" @click="show = false" :zoom='false'>
 			<view class="warp">
-						<view class="rect" @tap.stop>
-							<p>修改昵称</p>
-							
-								<textarea name="" id="" cols="30" rows="10">
-									
-							
-								
-							</textarea>
-							<img class="canc" src="../../assets/img/md-cancel Copy@3x.png" alt="">
-							<u-button type="success">保存</u-button>
-						</view>
-					</view>
+				<view class="rect" @tap.stop>
+					<p>修改昵称</p>
+
+					<textarea name="" id="" cols="30" rows="10" v-model="name"></textarea>
+					<img class="canc" src="../../assets/img/md-cancel Copy@3x.png" alt="" @click="nickNameReset">
+					<u-button type="success" @click="nameSubmit">保存</u-button>
+				</view>
+			</view>
 		</u-mask>
 	</view>
-	
-	
+
 </template>
 
 <script>
+	import * as API from '@/apis/index.js'
+	import * as userApi from '@/apis/user.js'
+	import * as loginApi from '@/apis/login.js'
+
 	export default {
 		data() {
 			return {
-				checked:false,
+				params: {
+					year: true,
+					month: true,
+					day: true,
+					hour: false,
+					minute: false,
+					second: false,
+					timestamp: true,
+				},
+				timeShow: false,
+				exitShow: false,
+				title: '退出账号',
+				content: '是否退出当前账号?',
+				checked: false,
 				src: '',
-				show: true
+				show: false,
+				fontMode: '',
+				userId: '',
+				userPhone: '',
+				name: '',
+				form: {
+					nickName: '',
+					headImg: '',
+				},
+				birthday: '',
+				carList: {
+					carNum: null,
+				},
+				elderStatus: false,
+			}
+		},
+		onShow() {
+			if (this.carhelp.get("getElderModeClass") == "长辈模式") {
+				this.checked = true;
+				this.elderStatus = true;
+			} else {
+				this.checked = false;
+				this.elderStatus = false;
 			}
+
+			this.getUserInfo();
+			this.getCarList();
 		},
 		methods: {
-			
+			carClick() {
+				if(this.carList.carNum != null) {
+					uni.navigateTo({
+						url: '/pages/user/car/carAdd?id=' + this.carList.id
+					})
+				} else {
+					uni.navigateTo({
+						url: '/pages/user/car/carDet'
+					})
+				}
+			},
+			getCarList() {
+				uni.showLoading({
+					title: "加载中",
+					mask: true,
+				})		
+				userApi.regUserCarList().then((res) => {
+					uni.hideLoading();
+					if(res.data.length != 0) {
+						this.carList = res.data[0];
+					}
+				}).catch(error => {
+					uni.showToast({
+						title: error,
+						icon: "none"
+					})
+				})
+			},
+			timeShowClick() {
+				if(this.birthday == null) {
+					this.timeShow = true;
+				}
+			},
+			confirmTime(params) {
+				this.birthday = params.year + '-' + params.month + '-' + params.day;
+				console.log(this.birthday)
+				
+				uni.showLoading({
+					title: "加载中",
+					mask: true,
+				})		
+				userApi.changeBirthday({birthday: this.birthday}).then((res) => {
+					uni.hideLoading();
+					this.timeShow = false;
+				
+				}).catch(error => {
+					uni.showToast({
+						title: error,
+						icon: "none"
+					})
+				})
+			},
+			cancelTime() {
+				this.timeShow = false;
+			},
+			signOut() {
+				this.exitShow = true;
+			},
+			confirm() {
+				uni.showLoading({
+					title: "加载中",
+					mask: true,
+				})		
+				userApi.logout().then((res) => {
+					uni.hideLoading();
+					this.exitShow = false;
+					this.carhelp.logoff()
+					uni.redirectTo({
+						url: '/pages/login/login'
+					})
+				}).catch(error => {
+					uni.showToast({
+						title: error,
+						icon: "none"
+					})
+				})
+			},
+			submit() {
+				uni.showLoading({
+					title: "加载中",
+					mask: true,
+				})		
+				userApi.updatePersonInformation(this.form).then((res) => {
+					uni.hideLoading();
+				}).catch(error => {
+					uni.showToast({
+						title: error,
+						icon: "none"
+					})
+				})
+			},
+			nameSubmit() {
+				this.form.nickName = this.name;
+				this.submit();
+				this.show = false;
+			},
+			maskShow() {
+				this.show = true;
+				this.name = this.form.nickName;
+			},
+			nickNameReset() {
+				this.name = '';
+			},
+			checkedChange() {
+				if (this.checked) {
+					this.carhelp.set("getElderModeClass", "长辈模式");
+					this.fontMode = '1';
+					this.elderStatus = true;
+				} else {
+					this.carhelp.set("getElderModeClass", "标准模式");
+					this.fontMode = '0';
+					this.elderStatus = false;
+				}
+
+				API.changeFont({
+					fontMode: this.fontMode
+				}).then((res) => {
+
+				}).catch(error => {
+					uni.showToast({
+						title: error,
+						icon: "none"
+					})
+				})
+			},
+			getUserInfo() {
+				uni.showLoading({
+					title: "加载中",
+					mask: true,
+				})
+				loginApi.findByOpenId({
+					openId: this.carhelp.getOpenId()
+				}).then((res) => {
+					uni.hideLoading();
+					this.form.nickName = res.data.regUser.nickName;
+					this.form.headImg = res.data.regUser.headImg;
+					this.birthday = res.data.regUser.birthday;
+					
+					var phone = res.data.regUser.phone;
+					var phone1 = phone.slice(0,3);
+					var phone2 = phone.slice(-4);
+					this.userPhone = phone1 + '****' + phone2;
+				}).catch(error => {
+					uni.showToast({
+						title: error,
+						icon: "none"
+					})
+				})
+			},
+			uploadPhoto() {
+				let _self = this;
+				
+				const crop = {
+					quality: 100,
+					width: 600,
+					height: 600,
+					resize: true
+				};
+				
+				// 上传图片
+				uni.chooseImage({
+					count: 1,
+					crop,
+					success: async (res) => {
+						//(res);
+						let tempFile = res.tempFiles[0],
+							avatar_file = {
+								// #ifdef H5
+								extname: tempFile.name.split('.')[tempFile.name.split('.').length - 1],
+								// #endif
+								// #ifndef H5
+								extname: tempFile.path.split('.')[tempFile.path.split('.').length - 1]
+								// #endif
+							},
+							filePath = res.tempFilePaths[0]
+							
+						// #ifndef APP-PLUS
+						//(`filePath=${filePath}`)
+						
+						//非app端用前端组件剪裁头像，app端用内置的原生裁剪
+						let fileData = await new Promise((callback) => {
+							uni.navigateTo({
+								url: '/pages/user/cropImage?path=' + filePath +
+									`&options=${JSON.stringify(crop)}`,
+								animationType: "fade-in",
+								events: {
+									success: url => {
+										callback(url)
+									}
+								}
+							});
+						})
+						// #endif
+						
+						//返回 base64 图片
+						//(fileData);
+						
+						var token = _self.carhelp.getToken()
+						
+						uni.showLoading({
+							title: '上传中'
+						});
+						
+						uni.request({
+						    url: process.car.BASE_URL + "uploadBase64",
+							method: 'POST',
+						    data: {
+						        photoBase64Data: fileData
+						    },
+						    header: {
+						        'Authorization': token,
+								'content-type': 'application/x-www-form-urlencoded'
+						    },
+						    success: (res) => {
+								let jsonData = res.data;
+						        _self.form.headImg = jsonData.data;
+										_self.submit();
+								uni.hideLoading();
+						    }
+						});
+					}
+				});
+			},
 		}
 	}
 </script>
 
 <style lang="scss" scoped>
-	page{
+	page {
 		background-color: #fff;
 		padding-bottom: 67px;
 	}
-	.userCell{
-		.user{
-			
-			img{
+
+	.userCell {
+		.user {
+
+			img {
 				vertical-align: middle;
 			}
 		}
-		.title{
+
+		.title {
 			padding: 24px 20px 8px 20px;
 			font-size: 18px;
 			color: rgba(16, 16, 16, 100);
 		}
-		
-		
-		.userCell-item{
+
+
+		.userCell-item {
 			display: flex;
 			justify-content: space-between;
 			align-items: center;
 			padding: 16px;
-			
-			.userCell-title{
+
+			.userCell-title {
 				font-size: 16px;
 				display: flex;
-				p{
+
+				p {
 					margin-left: 8px;
 					font-size: 16px;
 					line-height: 28px;
 					color: #333333;
 				}
 			}
-			.userCell-content{
+
+			.userCell-content {
 				display: flex;
 				color: rgba(153, 153, 153, 100);
 				font-size: 16px;
 				line-height: 20px;
-				
+
 			}
-			.value{
+
+			.value {
 				display: flex;
-				.text{
+
+				.text {
 					line-height: 28px;
 				}
-				.circle{
+
+				.circle {
 					width: 40px;
 					height: 40px;
 				}
-				.u-avatar{
+
+				.u-avatar {
 					position: absolute;
 				}
-				.camera{
+
+				.camera {
 					width: 20px;
 					height: 20px;
-					
+
 					position: absolute;
 					left: 50%;
 					top: 50%;
-					transform: translate(-50%,-50%);
+					transform: translate(-50%, -50%);
 					z-index: 9999;
-					
+
 				}
-				.box{
+
+				.box {
 					border-radius: 999px;
 					height: 40px;
 					width: 40px;
@@ -260,44 +543,49 @@
 					background-position: 30% 10%;
 					background-size: cover;
 				}
-				
+
 			}
-			.u-switch{
+
+			.u-switch {
 				width: 48px;
 				height: 24px;
 				vertical-align: middle;
 				margin-left: 8px;
 			}
-		    /deep/.u-switch__node{
+
+			/deep/.u-switch__node {
 				width: 24px !important;
 				height: 24px !important;
 			}
-			
-			span{
-				color:#999;
-				
+
+			span {
+				color: #999;
+
 			}
-			.add{
-				color:#999;
+
+			.add {
+				color: #999;
 			}
-			.black{
+
+			.black {
 				color: #666666;
 			}
 		}
 	}
 
-.exit{
-	color: rgba(238, 49, 56, 100);
-	font-size: 16px;
-	text-align: center;
-	margin-top: 10px;
-}
-.warp {
-		
+	.exit {
+		color: rgba(238, 49, 56, 100);
+		font-size: 16px;
+		text-align: center;
+		margin-top: 10px;
+	}
+
+	.warp {
+
 		position: fixed;
 		left: 0;
 		bottom: 0;
-		
+
 		width: 100%;
 	}
 
@@ -306,13 +594,15 @@
 		height: 100%;
 		background-color: #fff;
 		padding: 24px 0;
-		p{
+
+		p {
 			color: rgba(16, 16, 16, 100);
 			font-size: 16px;
 			line-height: 24px;
-			padding:0 24px;
+			padding: 0 24px;
 		}
-		textarea{
+
+		textarea {
 			width: 87.2%;
 			border-radius: 8px;
 			background-color: rgba(229, 231, 234, 100);
@@ -322,14 +612,16 @@
 			padding: 0 8px;
 			position: relative;
 		}
-		.canc{
+
+		.canc {
 			width: 20px;
 			height: 20px;
 			position: absolute;
 			top: 70px;
 			right: 7vw;
 		}
-		.u-btn{
+
+		.u-btn {
 			width: 89.2%;
 			color: rgba(255, 255, 255, 100);
 			font-size: 18px;
@@ -338,6 +630,4 @@
 			z-index: 99999;
 		}
 	}
-
-
 </style>

pages/user/index.vue

@@ -465,7 +465,7 @@
 			toData() {			
 				if(this.userId) {
 					uni.navigateTo({
-						url: '/pages/user/data'
+						url: '/pages/user/dataSet'
 					})
 				} else {
 					uni.navigateTo({