Merge branch 'feature_220519_facebook_share' into pre

log-center/logEnum.js

@@ -9,9 +9,11 @@ export const businessType = {
 }
 
 export const objectType = {
-    installButton: "install-button"
+    installButton: "install-button",
+    copyLinkButton: "copy-link-button"
 }
 
 export const pageSource = {
-    newUserLandingPage: "new-user-landing-page"
+    newUserLandingPage: "new-user-landing-page",
+    mobileLandingPage: "mobile-landing-page"
 }

pages/facebook/shareCallback.vue

@@ -0,0 +1,17 @@
+<template>
+  <div></div>
+</template>
+
+<script>
+export default {
+  name: "shareCallback",
+  data() {
+    return {
+    };
+  },
+  mounted() {
+  },
+};
+</script>
+
+<style scoped></style>

pages/index.vue

@@ -65,7 +65,7 @@
 						<img v-else src="/svg/icon-twitter.svg" alt />
 						<div class="luck-content">
 							<div class="luck-title">{{ item.simpleUserInfoVO.nickName || 'Twitter User' }}</div>
-							<div class="luck-time">{{ formatTime(item.receiveTimestamp) }}</div>
+							<div class="luck-time">{{ formatTime(item.receiveTimestamp, 'MM-DD HH:mm') }}</div>
 						</div>
 						<div class="luck-money">
 							<img :src="item.currencyIconPath" alt />
@@ -156,15 +156,15 @@
 		</div>
 		<div v-if="show_moblie" class="moblie">
 			<div class="head-area">
-				<div class="txt">GET GIVEAWAY</div>
+				<div class="gift">
+                    <img :src=" require('../static/subject/gift.svg') " />
+                </div>
+				<div class="txt">
+                    <div>Complete tasks</div>
+                    <div>to Draw Prizes</div>
+                </div>
 			</div>
 			<!-- 领取列表 -->
-			<div class="luck-list-title">
-				<div>{{ detail.postBizData.receiveCount || 0 }}/{{ detail.postBizData.totalCount || 0 }} Winners</div>
-				<div> {{ detail.postBizData.receiveAmountValue }} / {{
-						detail.postBizData.amountValue || ''
-				}} {{ detail.postBizData.currencySymbol || '' }}</div>
-			</div>
 			<div class="luck-list" @scroll="handleScroll($event)">
 				<div class="luck-item" v-for="item, i in luck_list" v-bind:key="i">
 					<img v-if="item.simpleUserInfoVO.avatarUrl" :src="item.simpleUserInfoVO.avatarUrl" alt />
@@ -184,19 +184,22 @@
 				</div>
 			</div>
 			<div class="area-cp-link">
-				<div class="area-title">
-					<img src="/svg/icon-mobile.svg" alt="">
-					<div class="right">
-						<div class="right-title">Get Giveaway on PC</div>
-						<div class="right-content">You need to use a computer to complete tasks, and Get Giveaways (Just
-							2-3 minutes)</div>
-					</div>
-				</div>
+				<div class="area-list">
+                    <div class="item">
+                        <div class="icon"><img :src=" require('../static/subject/01.svg') " /></div>
+                        <div class="font">Complete the tasks on tweet</div>
+                    </div>
+                    <div class="item">
+                        <div class="icon"><img :src=" require('../static/subject/02.svg') " /></div>
+                        <div class="font">Open link on PC to draw</div>
+                        <div class="pc"><img :src=" require('../static/subject/pc.svg') " /></div>
+                    </div>
+                </div>
 				<div class="area-content">
 					{{ cp_link }}
 				</div>
 				<div class="area-btn">
-					<div class="btn" :data-clipboard-text="cp_link">Copy Link</div>
+					<div class="btn" :data-clipboard-text="cp_link" @click="copyLinkHandle">Copy Link</div>
 				</div>
 			</div>
 			<div class="layer" v-show="layer_show">
@@ -235,13 +238,13 @@ const jumpUrl = page[process.env.NUXT_ENV.MODE] + '/'
 const baseURL = api[process.env.NUXT_ENV.MODE]
 const appType = 1;
 
-
+let appVersionCode = 6;
 export default {
 	name: "index",
 	data() {
 		return {
 			cp_link: '',
-			appVersionCode: 3,
+			appVersionCode: appVersionCode,
 			mid: '',
 			show_moblie: false,
 			show_home: false,
@@ -259,8 +262,8 @@ export default {
 				}
 			},
 			currencyIconPath: '',
-			title: '',
-			twitterTitle: 'DeNet: An Easy Web3 Tool For GIVEAWAY / AIRDROP',
+			title: 'DeNet Giveaway',
+			metaTitle: 'DeNet: An Easy Web3 Tool For GIVEAWAY / AIRDROP',
 			jumpUrl: jumpUrl,
 			status: '',
 			page_index: 1,
@@ -282,6 +285,20 @@ export default {
 			title: this.title,
 			appVersionCode: 3,
 			meta: [
+				// facebook 
+				{
+					name: 'og:url',
+					content: this.jumpUrl + this.detail.postId
+				},
+				{
+					name: 'og:title',
+					content: this.metaTitle
+				},
+				{
+					name: 'og:image',
+					content: this.detail.postBizData.imagePath || ''
+				},
+				// twitter
 				{
 					name: 'twitter:card',
 					content: 'summary_large_image'
@@ -292,7 +309,7 @@ export default {
 				},
 				{
 					name: 'twitter:title',
-					content: this.twitterTitle
+					content: this.metaTitle
 				},
 				{
 					name: 'twitter:image',
@@ -302,6 +319,23 @@ export default {
 		}
 	},
 	methods: {
+		copyLinkHandle() {
+			Report.reportLog({
+				baseInfo: {
+					appVersionCode: this.appVersionCode,
+					mid: this.mid,
+					pageSource: Report.pageSource.mobileLandingPage,
+					appType,
+					machineCode: this.mid
+				},
+				params: {
+					eventData: {
+						businessType: Report.businessType.buttonClick,
+						objectType: Report.objectType.copyLinkButton
+					}
+				}
+			})
+		},
 		clickOpenChrome() {
 			window.open('https://www.google.com/chrome')
 		},
@@ -317,7 +351,8 @@ export default {
 					appVersionCode: this.appVersionCode,
 					mid: this.mid,
 					pageSource: Report.pageSource.newUserLandingPage,
-					appType
+					appType,
+					machineCode: this.mid
 				},
 				params: {
 					eventData: {
@@ -518,6 +553,7 @@ export default {
 		let { route } = params;
 		let { data } = await axios.post(`${baseURL}/denet/post/getDetail`, {
 			baseInfo: {
+				appVersionCode: appVersionCode,
 				mid: function () {
 					return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
 						var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
@@ -570,6 +606,21 @@ export default {
 
 		document.documentElement.style.fontSize = '62.5%'
 		if (this.isMobile()) {
+			this.setCookieMid();
+			Report.reportLog({
+				baseInfo: {
+					appVersionCode: this.appVersionCode,
+					mid: this.mid,
+					pageSource: Report.pageSource.mobileLandingPage,
+					appType,
+					machineCode: this.mid
+				},
+				params: {
+					eventData: {
+						businessType: Report.businessType.pageView
+					}
+				}
+			})
 			this.show_moblie = true
 			this.cp_link = window.location.href
 			// 复制链接
@@ -593,14 +644,21 @@ export default {
 		} else if (isBrowser() == 'chrome') {
 			// 领取任务红包
 			this.setCookieMid()
-			this.getRedPacket()
+			// 是否被领完
+			if(this.detail.postBizData.receiveCount < this.detail.postBizData.totalCount){
+				this.getRedPacket()	
+			}else{
+				this.show_home = true
+				this.status = 'nothing'
+			}
 			this.setPickupInfo()
 			Report.reportLog({
 				baseInfo: {
 					appVersionCode: this.appVersionCode,
 					mid: this.mid,
 					pageSource: Report.pageSource.newUserLandingPage,
-					appType
+					appType,
+					machineCode: this.mid
 				},
 				params: {
 					eventData: {
@@ -679,7 +737,7 @@ body,
 
 	.head-area {
 		width: 100%;
-		height: 8rem;
+		height: 11rem;
 		text-align: center;
 		letter-spacing: 0.3px;
 		font-size: 2rem;
@@ -689,10 +747,16 @@ body,
 		border-radius: 0 586px 586px/0 0 104px 104px;
 		display: flex;
 		align-items: center;
-
+        justify-content: center;
+        .gift {
+            margin-right: 1.4rem;
+            img {
+                width: 5.2rem;
+            }
+        }
 		.txt {
-			width: 100%;
-			text-align: center;
+			font-size: 1.8rem;
+			text-align: left;
 		}
 	}
 
@@ -712,14 +776,13 @@ body,
 	.luck-list {
 		flex: 1;
 		width: 100%;
-		background: #fff;
 		overflow-y: auto;
 
 		.luck-item {
 			display: flex;
 			padding: 12px 0;
 			margin: 0 16px;
-			border-bottom: 1px solid #d1d1d1;
+			border-bottom: 1px solid #F2F2F2;
 			justify-content: space-between;
 			position: relative;
 
@@ -805,49 +868,43 @@ body,
 
 	.area-cp-link {
 		background: #fff;
-		display: flex;
 		width: 100%;
 		flex-wrap: wrap;
-		position: fixed;
-		bottom: 0;
 		height: 20rem;
 		box-shadow: 0px -4px 10px rgba(0, 0, 0, 0.1);
-		border-top-left-radius: 2rem;
-		border-top-right-radius: 2rem;
-
-		.area-title {
-			display: flex;
-
-			img {
-				width: 6.4rem;
-				height: 6.4rem;
-				margin: 1.5rem;
-			}
-
-			.right {
-				flex: 1;
-				letter-spacing: 0.3px;
-
-				.right-title {
-					font-size: 1.7rem;
-					color: #000000;
-					margin-top: 1.7rem;
-
-				}
-
-				.right-content {
-					font-size: 1.2rem;
-					color: #989898;
-				}
-			}
-		}
+		border-top-left-radius: 1rem;
+		border-top-right-radius: 1rem;
+
+        .area-list {
+            width: 34.3rem;
+            margin: 1.5rem auto;
+            .item {
+                clear: both;
+                overflow: hidden;
+                margin: 0.7rem 0;
+                font-size: 1.6rem;
+                font-weight: 500;
+                .icon {
+                    float: left;
+                    margin-right: 0.8rem;
+                }
+                .font {
+                    float: left;
+                    margin-right: 0.8rem;
+                }
+                .pc {
+                    float: left;
+                }
+            }
+        }
 
 		.area-content {
 			background: #F4F4F4;
-			height: 4.6rem;
-			padding: 0 1rem;
-			width: 100%;
+			padding: 0.7rem 1rem;
+            margin: 0 auto 1rem;
+			width: 34.3rem;
 			font-size: 1.3rem;
+            border-radius: 0.5rem;
 			word-break: break-all;
 		}
 
@@ -1050,7 +1107,7 @@ body,
 		border-radius: 2rem;
 		// background: red;
 		overflow-y: hidden;
-		box-shadow: 0 0 5px #888888;
+		box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
 		background: #fff;
 
 
@@ -1114,7 +1171,7 @@ body,
 				text-align: center;
 				color: #fff;
 				background: #389AFF;
-				border-radius: 0 586px 586px/0 0 104px 104px;
+				border-radius: 0 586px 586px/0 0 164px 164px;
 
 				.txt {
 					padding-top: 8.5rem;
@@ -1158,9 +1215,10 @@ body,
 			padding: 14px 0 11px 0;
 			background: #fff;
 			display: flex;
+            font-weight: 500;
 			justify-content: space-between;
 			color: #B0B0B0;
-			border-bottom: 1px solid #D1D1D1;
+			border-bottom: 1px solid #F2F2F2;
 		}
 
 
@@ -1172,7 +1230,7 @@ body,
 				display: flex;
 				padding: 12px 0;
 				margin: 0 16px;
-				border-bottom: 1px solid #d1d1d1;
+				border-bottom: 1px solid #F2F2F2;
 				justify-content: space-between;
 				position: relative;
 
@@ -1216,14 +1274,14 @@ body,
 						font-size: 16px;
 						letter-spacing: 0.3px;
 						color: #444444;
+                        margin-bottom: 5px;
 					}
 
 					.luck-time {
 						font-weight: 400;
 						font-size: 12px;
 						line-height: 14px;
-
-						color: #9b9b9b;
+						color: #B0B0B0;
 					}
 				}
 
@@ -1296,7 +1354,7 @@ body,
 	}
 
 	.redPacket2 {
-		left: 30.6rem;
+		left: 43.6rem;
 		margin-left: -18rem;
 	}
 
@@ -1310,7 +1368,7 @@ body,
 	.install {
 		position: absolute;
 		top: 20rem;
-		left: 78.5rem;
+		left: 73.5rem;
 
 		.title {
 			font-size: 4.8rem;
@@ -1324,7 +1382,7 @@ body,
 			width: 40rem;
 			height: 3.3rem;
 			line-height: 3.3rem;
-
+            font-weight: normal;
 			span {
 				font-size: 1.4rem;
 			}

static/subject/01.svg

@@ -0,0 +1,4 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="10" cy="10" r="10" fill="#1D9BF0"/>
+<path d="M9.80176 14.5H11.8457V4.63574H9.79492L7.24512 6.40625V8.26562L9.76074 6.5293H9.80176V14.5Z" fill="white"/>
+</svg>

static/subject/02.svg

@@ -0,0 +1,4 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="10" cy="10" r="10" fill="#1D9BF0"/>
+<path d="M6.35645 7.60254V7.63672H8.27051V7.60254C8.27051 6.69336 8.97461 6.02344 9.93164 6.02344C10.8477 6.02344 11.4971 6.61133 11.4971 7.34961C11.4971 8.0332 11.1895 8.53223 10.1914 9.53027L6.47266 13.1123V14.5H13.6436V12.8594H9.19336V12.8184L11.5996 10.501C12.6865 9.4209 13.5068 8.49805 13.5068 7.26758C13.5068 5.62012 12.0781 4.41699 10 4.41699C7.84668 4.41699 6.35645 5.73633 6.35645 7.60254Z" fill="white"/>
+</svg>