aadd；新增分享弹窗

pages/upload/upload.vue

@@ -52,8 +52,24 @@
 				<text>上传图标</text>
 			</view>
 			<view class="btns">上传照片</view>
-			<view class="btns yellow">分享</view>
+			<view class="btns yellow" @click="showShare=true">分享</view>
 		</view>
+		<u-popup v-model="showShare" mode="bottom" border-radius="16">
+			<view class="upload-popup">
+				<view class="top">分享赚钱</view>
+				<view class="upload-main">
+					<view class="item">
+						<image src="../../static/imgs/ic_whatsapp @2x.png" mode=""></image>
+						<text>whatsapp</text>
+					</view>
+					<view class="item">
+						<image src="../../static/imgs/ic_whatsapp@2x.png" mode=""></image>
+						<text>Facebook</text>
+					</view>
+				</view>
+				<view class="close" @click="showShare=false">取消</view>
+			</view>
+		</u-popup>
 	</view>
 </template>
 
@@ -61,6 +77,7 @@
 	export default {
 		data() {
 			return {
+				showShare: true,
 				active: false,
 				list: [{
 						image: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
@@ -83,9 +100,61 @@
 <style lang="scss" scoped>
 	.app {
 		background-color: #FFFFFF;
-			.wrap {
-				padding: 40rpx;
+
+		.upload-popup {
+			background-color: #F5F5F5;
+
+			.close {
+				height: 114rpx;
+				background: #FFFFFF;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				font-size: 32rpx;
+				font-family: OpenSans;
+				color: #333333;
+				line-height: 43rpx;
+				margin-top: 10rpx;
+			}
+
+			.top {
+				padding: 32rpx 0 37rpx 0;
+				text-align: center;
+				font-size: 32rpx;
+				font-family: OpenSans-Bold, OpenSans;
+				font-weight: bold;
+				color: #333333;
+				line-height: 43rpx;
+				border-bottom: 1rpx solid #DCDCDC;
+				background-color: #FFFFFF;
+			}
+
+			.upload-main {
+				padding: 53rpx 181rpx 58rpx 174rpx;
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				background-color: #FFFFFF;
+
+				.item {
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					font-size: 28rpx;
+					font-family: OpenSans;
+					font-weight: 600;
+					color: #333333;
+					line-height: 40rpx;
+
+					image {
+						width: 84rpx;
+						height: 84rpx;
+						margin-bottom: 21rpx;
+					}
+				}
 			}
+		}
+
 		.main {
 			display: flex;
 			align-items: center;