fix

public/heart.js

 jQuery(document).ready(function ($) {
-    $("html,body").click(function (e) {
-        // var n = Math.round(Math.random() * 100);
-	var n = 1;
-	var $i = $("<b/>").text("+" + n);
-	var x = e.pageX,
-	    y = e.pageY;
-	$i.css({
-		"z-index": 99999,
-		  "top": y - 20,
-		  "left": x,
-		  "position": "absolute",
-		   "color": "#fff"
-        // "color": "#C6B0EA"
+    // $("html,body").click(function (e) {
+    //     // var n = Math.round(Math.random() * 100);
+    //     console.log(e,'==')
+	// var n = 1;
+	// var $i = $("<b/>").text("+" + n);
+	// var x = e.pageX,
+	//     y = e.pageY;
+	// $i.css({
+	// 	"z-index": 99999,
+	// 	  "top": y - 20,
+	// 	  "left": x,
+	// 	  "position": "absolute",
+	// 	   "color": "#fff"
+    //     // "color": "#C6B0EA"
        
-	});
-	$("body").append($i);
-		$i.animate({
-		     "top": y - 80,
-		     "opacity": 0
-		}, 1500, function () {
-		 $i.remove();
-	  });
-	  e.stopPropagation();
-	});
+	// });
+	// $("body").append($i);
+	// 	$i.animate({
+	// 	     "top": y - 80,
+	// 	     "opacity": 0
+	// 	}, 1500, function () {
+	// 	 $i.remove();
+	//   });
+	//   e.stopPropagation();
+	// });
 });

src/pages/pg4/plant.vue

       <div class="content-item" v-for="(item, inx) in list" :key="inx">
         <div v-show="isChoise(item.name)">
           <img
-            class="shadow animate__animated animate__fadeIn popularity-values"
+            class="shadow animate__animated animate__fadeIn plus1"
             :src="item.img2"
             alt=""
-            @click="() => click(item)"
+            @click="(e) => click(item, e)"
           />
           <!-- <span class="num">已种植数量{{ contries[item.name] }}</span> -->
         </div>
         <div v-show="!isChoise(item.name)">
-          <img class="popularity-values" :src="item.img1" alt="" @click="() => click(item)" />
+          <img
+            class="plus1"
+            :src="item.img1"
+            alt=""
+            @click="(e) => click(item, e)"
+          />
         </div>
       </div>
       <div class="content-item">
 const flowerShow = ref();
 const planted = ref(false);
 const badgeShow = ref(false);
-let  timer = 'timer'
 
-const isChoise = (name) => {
-  // const
-  //   console.log(name, "==--");
-  return choise.value?.filter((x) => x === name)?.length > 0;
-};
-const  animate =(plus)=> {
-clearInterval(timer);
-timer = setInterval(function () {
-  plus--;
-  if (plus <= 0) {
-    clearInterval(timer);
-  }
-  let $i = $("<i>+1</i>");
-  $(".popularity-values").append($i);
+let timer = "timer";
+
+const animate = (plus, e) => {
+  // var _this = this;
+  console.log(e, "==");
+
+  var n = 1;
+  var $i = $("<b/>").text("+" + n);
+  var x = e.pageX,
+    y = e.pageY;
+  var n = 1;
+  var $i = $("<b/>").text("+" + n);
+  var x = e.pageX,
+    y = e.pageY;
+  $i.css({
+    "z-index": 99999,
+    top: y - 20,
+    left: x,
+    position: "absolute",
+    color: "#fff",
+    // "color": "#C6B0EA"
+  });
+  $("body").append($i);
   $i.animate(
     {
-      top: "-1.1rem",
-      right: "-0.9rem",
-      // "top": \'-55px\',
-      // "right": \'-45px\',
-      opacity: 0.1,
-      fontSize: "0.46rem",
+      top: y - 80,
+      opacity: 0,
     },
-    1800,
+    1500,
     function () {
       $i.remove();
     }
   );
-}, 800);
+  e.stopPropagation();
+};
+const isChoise = (name) => {
+  // const
+  //   console.log(name, "==--");
+  return choise.value?.filter((x) => x === name)?.length > 0;
 };
 
-
-const click = (item) => {
+const click = (item, e) => {
   const arr = choise.value;
   updateContries(item.name);
-  console.log(arr, "==");
-  animate(1);
+  animate(1, e);
   choise.value = [...new Set(arr.concat([item.name]))];
 };