update

src/components/MyPhoto.vue

@@ -84,6 +84,10 @@ const toggleBorder = (item, index) => {
 };
 
 const handleDabangClick = () => {
+  if (!mergeId) {
+    weui.alert("请先合成照片！")
+    return false;
+  }
   fetch(`https://huodong2.lzlj.com/api/faceFamily/face/publish/${mergeId}`, {
     method: 'POST',
     headers: {
@@ -278,7 +282,7 @@ markers.value = [
              ? activeBorderImage : defaultBorderImage" 
             class="border-image"
             alt="border"
-            @click="!globalStore.chartsBattle && toggleBorder(item, index)"
+            @click="(!globalStore.chartsBattle && item.result_url !== failedImg) && toggleBorder(item, index)"
           />
         </div>
       </div>
@@ -366,10 +370,10 @@ markers.value = [
 }
 .image-wrapper {
   position: relative;
-  margin-bottom: 0;
-  float: left;
   margin-right: 2vw;
   margin-left: 2vw;
+  width: 38vw;
+  height: 59vw;
 }
 .border-image {
   position: absolute;
@@ -383,8 +387,11 @@ markers.value = [
   display: block;
   width: 84vw;
   height: 57vh;
-  position: absolute;
+  position: relative;
-  top: 26%;
+  display: flex;
+  flex-flow: row;
+  flex-wrap: wrap;
+  top: 10vw;
 }
 
 .image-container {

src/components/PhotoSquare.vue

@@ -28,6 +28,7 @@ const username = ref();
 const likesCount = ref();
 const userImg = ref();
 const ranking = ref();
+const displayMyPublishPhoto = ref(false);
 
 const fetchImages = async () => {
   
@@ -44,6 +45,11 @@ const fetchImages = async () => {
     const data = await response.json()
     console.log('Success:', data)
     images.value = data.data
+    if (data.my_published_photo) {
+      displayMyPublishPhoto.value = true;
+    } else {
+      displayMyPublishPhoto.value = false;
+    }
     username.value = data.my_published_photo.user_name;
     likesCount.value = data.my_published_photo.likes_count;
     userImg.value = data.my_published_photo.result_url;
@@ -66,16 +72,10 @@ const linkCountInvite = ref(0);
 
 const urlParams = new URLSearchParams(window.location.search);
 mergeId.value = urlParams.get('merge_id');
-watch(() => mergeId, async (newVal) => {
+
-  if (!newVal) {
-    return
-  }
-  if (newVal.value) {
-    getInviteInfo();
-  }
-})
 
 const getInviteInfo = ()=> {
+  disableInviteHelp.value = true;
   const urlParams = new URLSearchParams(window.location.search);
   mergeId.value = urlParams.get('merge_id');
   fetch(`https://huodong2.lzlj.com/api/faceFamily/face/merge/${mergeId.value}`, {
@@ -97,10 +97,20 @@ const getInviteInfo = ()=> {
   }); 
 }
 
+watch(() => mergeId, async (newVal) => {
+  if (!newVal) {
+    return
+  }
+  if (newVal.value) {
+    getInviteInfo();
+  }
+})
+
+const displayInviteHelpBtn = ref(true);
 const inviteHelp = ()=> {
   const formData = {
     invite_code: userinfos.invite_code,
-    merge_id: ''
+    merge_id: mergeId.value
   }
   fetch('https://huodong2.lzlj.com/api/faceFamily/face/like', {
     method: 'POST',
@@ -111,7 +121,7 @@ const inviteHelp = ()=> {
   })
   .then(response => response.json())
   .then(data => {
-    disableInviteHelp.value = true;
+    displayInviteHelpBtn.value = false;
     ElMessage.success('点赞成功！');
   })
   .catch((error) => {
@@ -197,11 +207,11 @@ markers.value = [
           </div>
         </div> -->
       </div>
-      <div v-if="!disableInviteHelp" class="fixed-background-container">
+      <div v-if="!disableInviteHelp && displayMyPublishPhoto" class="fixed-background-container">
         <div class="flex-container">
           <div class="left-group">
             <p class="photo-number">{{ ranking }}</p>
-            <img :src="userImg" class="user-img" alt="我的照片">
+            <img :src="userImg" class="user-img" alt="">
             <p class="photo-name bold">{{ username }}</p>
           </div>
           <p class="right-item photo-name bold" style="padding-left: 3vw;">{{ likesCount }}赞</p>
@@ -216,10 +226,10 @@ markers.value = [
             <img src="../assets/images/zpgc-border.webp" class="border-image-share" alt="border" />
             <div class="flex-container-detail-invite">
               <div class="left-group-left">
-                <p class="photo-number">111</p>
+                <p class="photo-number">{{ rankingInvite }}</p>
-                <p class="photo-name">222</p>
+                <p class="photo-name">{{ nameInvite }}</p>
               </div>
-              <p class="right-item photo-name" style="padding-left: 3vw;">333赞</p>
+              <p class="right-item photo-name" style="padding-left: 3vw;">{{ linkCountInvite }}赞</p>
             </div>
           </div>
         </div>