From afab3a98a65f7fb4f342251238ab3c329e4242dd Mon Sep 17 00:00:00 2001
From: inleft <inleft@qq.com>
Date: Tue, 30 Aug 2022 18:44:23 +0800
Subject: [PATCH] 调整统计脚本渲染逻辑 新增自定义表情组件

---
 src/components/mini/Aplayer.vue |   70 +++++++++++++++++++++++-----------
 1 files changed, 47 insertions(+), 23 deletions(-)

diff --git a/src/components/mini/Aplayer.vue b/src/components/mini/Aplayer.vue
index 9421d4d..0f6688c 100644
--- a/src/components/mini/Aplayer.vue
+++ b/src/components/mini/Aplayer.vue
@@ -1,29 +1,60 @@
 <template>
 	<div class="fade">
 		<a-col v-bind="colMain">
-			<aplayer ref="myAplayer" :audio="audio" :autoplay="autoplay" fixed style="z-index: 10;" :volume="0.1"
+			<div ref="myAplayerDiv" class="aplayer aplayer-narrow aplayer-fixed aplayer-arrow"
+				style="z-index: 10;width: 300px;" @click="startPlay" v-if="!showMyHeart">
+				<a-tooltip :title="tipContent" :visible="showTip" placement="right"
+					:getPopupContainer="getPopupContainer">
+					<div class="aplayer-body">
+						<div class="aplayer-pic"
+							style="background-image: url(&quot;http://p2.music.126.net/0AYWra9rCzgeprGp6OUyUw==/868614185993997.jpg?param=130y130&quot;); background-color: rgb(183, 218, 255);">
+							<div class="aplayer-button aplayer-play"><svg xmlns="http://www.w3.org/2000/svg"
+									viewBox="0 0 16 31" class="">
+									<path
+										d="M15.552 15.168q.448.32.448.832 0 .448-.448.768L1.856 25.28q-.768.512-1.312.192T0 24.192V7.744q0-.96.544-1.28t1.312.192z">
+									</path>
+								</svg></div>
+						</div>
+					</div>
+				</a-tooltip>
+			</div>
+			<aplayer v-else ref="myAplayer" :audio="audio" :autoplay="autoplay" fixed style="z-index: 10;" :volume="0.1"
 				:preload="preload" />
 		</a-col>
 
-		<!-- <a-modal ref="musicModal" title="" :dialog-style="{ top: '10px' }" :mask="false"
-		:maskClosable="false"	:visible="modal1Visible" @ok="() => setModal1Visible(false)" @cancel="() => setModal1Visible(false)">
-			<p>{{secondsToGo}}秒后关闭</p>
-		</a-modal> -->
 	</div>
 </template>
 
 <script>
 	import APlayer from '@moefe/vue-aplayer';
+	import myConstant from "../../config/myConstant.js"
 
 	export default {
-		created() {
+		mounted() {
 			this.$nextTick(function() {
-				this.$message.info("stop..")
-				this.$refs.myAplayer.pause();
+				if (localStorage.getItem(myConstant.visitorFirstKey) == null &&
+					localStorage.getItem(myConstant.visitorDataKey) == null) {
+					this.showTip = true;
+					setTimeout(() => {
+						this.showTip = false;
+					}, 7000);
+
+					var today = new Date();
+					var year = today.getFullYear() + "";
+					var month = today.getMonth() + 1 + "";
+					var date = today.getDate() + "";
+					localStorage.setItem(myConstant.visitorFirstKey,
+						year + (month > 10 ? month : '0' + month) + date)
+				}
+
 			})
 		},
 		data() {
 			return {
+				tipContent: "我有一首歌想送给你听..",
+				showTip: false,
+				showMyHeart: false,
+
 				colMain: {
 					xs: 0,
 					sm: 0,
@@ -33,8 +64,6 @@
 					xxl: 1
 				},
 				autoplay: false,
-				modal1Visible: true,
-				secondsToGo: 5,
 				preload: "none",
 				audio: {
 					name: 'Moonwisher',
@@ -46,21 +75,16 @@
 			};
 
 		},
-		created() {
-			// const interval = setInterval(() => {
-			// 	this.secondsToGo -= 1;
-			// }, 1000);
-
-			// setTimeout(() => {
-			// 	clearInterval(interval);
-			// 	this.modal1Visible = false
-			// }, 5000);
-		},
 		methods: {
-			setModal1Visible(modal1Visible) {
-
-				this.modal1Visible = modal1Visible;
+			startPlay() {
+				this.showMyHeart = true;
+				setTimeout(() => {
+					this.$refs.myAplayer.play()
+				}, 500);
 			},
+			getPopupContainer(triggerNode) {
+				return triggerNode.parentNode
+			}
 		},
 	};
 	// var ap = new APlayer({

--
Gitblit v1.9.1