上传头像成功后关闭弹窗

pages/my/userinfo.vue

@@ -14,7 +14,7 @@
 				</view>
 				<!-- #endif -->
 				<!-- #ifndef MP-WEIXIN -->
-				<view @click="uploadImg()">
+				<view @click="toggle()">
 					<jp-cropper-watermark :watermarkType="1" mode="ratio" :width="400" :height="500" :maxWidth="400" :maxHeight="500" :url="url" @cancel="oncancel" @ok="onok"></jp-cropper-watermark>
 					<image src="../../static/logo.png" v-if="avatar==null" mode=""
 						style="width: 111rpx;height: 111rpx;border-radius: 50%;"></image>
@@ -76,6 +76,24 @@
 		<view class="footer-btn">
 			<view class="usermain-btn" @click="messagebtn()">保存</view>
 		</view>
+		<view>
+			<!-- 普通弹窗 -->
+			<uni-popup ref="popup" type="bottom" background-color="#fff" @change="change">
+				<view class="popup-content">
+					<view class="popup-content-top">
+						<view @click="uploadImg(0)" class="popup-content-top-btn" style="border-bottom: 1px solid #ccc;">
+							查看头像
+						</view>
+						<view @click="uploadImg(1)" class="popup-content-top-btn">
+							从相册选择图片
+						</view>
+					</view>
+					<view class="popup-content-bottom" @click="quxiao">
+						取消
+					</view>
+				</view>
+			</uni-popup>
+		</view>
 	</view>
 </template>
 
@@ -101,7 +119,8 @@
 				zhiFuBaoName: '',
 				sex: 1,
 				age: 0,
-				url:''
+				url:'',
+				upUrl:''
 			};
 		},
 		onLoad(e) {
@@ -199,7 +218,7 @@
 					let userId = uni.getStorageSync('userId');
 					uni.uploadFile({
 						url: websocketUtils.uploadFileUrl(), //真实的接口地址
-						filePath:that.url,
+						filePath:that.upUrl,
 						header: {
 							token: token
 						},
@@ -207,6 +226,7 @@
 						success: uploadFileRes => {
 							url = JSON.parse(uploadFileRes.data);
 							// that.avatar = url.data
+							that.$refs.popup.close('bottom')
 							uni.hideLoading();
 						}
 					});
@@ -216,20 +236,20 @@
 				// url设置为空，隐藏控件
 				this.url = "";
 			},
-			uploadImg() {
+			quxiao(){
+				this.$refs.popup.close('bottom')
+			},
+			toggle(type) {
+				this.$refs.popup.open('bottom')
+			},
+			uploadImg(index) {
 				let token = uni.getStorageSync('token')
-
 				if (!token) {
 					this.goLoginInfo();
 					return;
 				}
 				let that = this;
 				var url = null;
-				uni.showActionSheet({
-					// itemList按钮的文字接受的是数组
-					itemList: ["查看头像", "从相册选择图片"],
-					success(e) {
-						var index = e.tapIndex
 				if (index === 0) {
 					// 用户点击了预览当前图片
 					// 可以自己实现当前头像链接的读取
@@ -258,20 +278,14 @@
 									})
 								  } else {
 									that.url = res.tempFilePaths[0];
+									that.upUrl=res.tempFilePaths[0];
 								  }
 								
 							  }
 							});
-									
-									
-									
 						}
 					});
 				}
-					}, fail: function (err) {
-							console.log('showActionSheet失败', err);
-						}
-				})
 			},
 			
 			getUserInfo() {
@@ -356,7 +370,28 @@
 	};
 </script>
 
-<style>
+<style scoped>
+	.popup-content-bottom{
+		width: 100%;
+		text-align: center;
+		padding: 15px 0px;
+		border-radius: 5px;
+		background-color: #fcfcfd;
+		margin: 7px 0px;
+	}
+	.popup-content-top{
+		border-radius: 5px;
+		background-color: #fcfcfd;
+	}
+	.popup-content-top-btn{
+		width: 100%;
+		text-align: center;
+		padding: 15px 0px;
+		
+	}
+	.popup-content{
+		padding: 0 36rpx;
+	}
 	page {
 		background: #f7f7f7;
 	}
@@ -367,7 +402,7 @@
 
 	.usermain {
 		background: #ffffff;
-		padding: 0 36rpx;
+		padding: 0 20rpx;
 	}
 
 	.usermain-item {