dxz1228 2 gadi atpakaļ
vecāks
revīzija
ba0369a5d1

+ 27 - 3
src/components/CXBBackTop/CXBBackTop.vue

@@ -1,5 +1,8 @@
1 1
 <template>
2
-<div v-show="flag" class="backtop">
2
+<div v-show="flag" class="backtop1" v-if="isShow" >
3
+  <img @click="scrollToTop" class="backTopImg" src="../../static/icon/返回顶部@2x.png" alt="">
4
+</div>
5
+<div v-show="flag" class="backtop2" v-else >
3 6
   <img @click="scrollToTop" class="backTopImg" src="../../static/icon/返回顶部@2x.png" alt="">
4 7
 </div>
5 8
 </template>
@@ -8,9 +11,11 @@
8 11
 import { ref, reactive ,defineProps} from 'vue'
9 12
 
10 13
 let flag = ref(false)
14
+let isShow = ref(true)
11 15
 
12 16
 const props = defineProps({
13
-  Scroll_X: Number
17
+  Scroll_X: Number,
18
+  isCss:Number
14 19
 })
15 20
 
16 21
 watch(()=>props.Scroll_X,()=>{
@@ -21,6 +26,16 @@ watch(()=>props.Scroll_X,()=>{
21 26
     flag.value = false
22 27
   }
23 28
 })
29
+watch(()=>props.isCss,()=>{
30
+  if(props.isCss as number ===1){
31
+    isShow.value = true
32
+  }
33
+  if(props.isCss as number ===2){
34
+    isShow.value = false
35
+  }
36
+},
37
+{immediate:true}
38
+)
24 39
 
25 40
 const scrollToTop = function () {
26 41
   console.log('返回顶部');
@@ -33,7 +48,7 @@ const scrollToTop = function () {
33 48
 </script>
34 49
 
35 50
 <style scoped>
36
-.backtop{
51
+.backtop1{
37 52
   width: 40px;
38 53
   height: 40px;
39 54
   position: fixed;
@@ -42,6 +57,15 @@ const scrollToTop = function () {
42 57
   right: 15px;
43 58
   bottom: 8%;
44 59
 }
60
+.backtop2{
61
+  width: 40px;
62
+  height: 40px;
63
+  position: fixed;
64
+  border-radius: 50%;
65
+  z-index: 999;
66
+  right: 15px;
67
+  bottom: 14%;
68
+}
45 69
 .backTopImg{
46 70
   width: 40px;
47 71
   height: 40px;

Failā izmaiņas netiks attēlotas, jo tās ir par lielu
+ 1 - 1
src/pages.json


+ 2 - 2
src/pages/home/index.vue

@@ -18,7 +18,7 @@ import {getShareId} from "~/apis/product";
18 18
 // import CXBDialogSIgnInSucceed from "~/components/CXBDialogSignInSucceed/CXBDialogSIgnInSucceed.vue";
19 19
 import Cache from "~/utils/cache";
20 20
 
21
-import CXBBackTopVue from "~/components/CXBBackTop/CXBBackTop.vue";
21
+import CXBBackTop from "~/components/CXBBackTop/CXBBackTop.vue";
22 22
 const userStore = useUserStore()
23 23
 const usePageStore = usePageStoreWidthOut()
24 24
 usePageStore.setPageConfig({
@@ -249,7 +249,7 @@ function getIsShow(){
249 249
 </script>
250 250
 <template>
251 251
   <div class="h-screen ">
252
-    <CXBBackTopVue :Scroll_X="Scroll_X"/>
252
+    <CXBBackTop :Scroll_X="Scroll_X" :isCss="1" />
253 253
     <Header :yanglaojin="state.all_yanglao"
254 254
             :exClass="headerClass"
255 255
     />

+ 2 - 3
src/pages/order_addcart/index.vue

@@ -566,7 +566,7 @@ function openTestLog(element) {
566 566
 </script>
567 567
 <template>
568 568
   <div class="">
569
-     <CXBBackTop :Scroll_X="Scroll_X" />
569
+     <CXBBackTop :Scroll_X="Scroll_X"  :isCss="1" />
570 570
     <div v-if="hasShopping" class="bg-white h-10 fixed top-0 w-full z-1 flex justify-end ">
571 571
       <div class="pr-3">
572 572
         <FButton size="small" @click="handleManageCart">
@@ -628,8 +628,7 @@ function openTestLog(element) {
628 628
       </div>
629 629
     </div>
630 630
 
631
-    <!-- <CXBBackTop :Scroll_X="Scroll_X" /> -->
632
-    <div class="pb-12">
631
+    <div class="pb-12" v-if="!hasShopping" >
633 632
       <div class="flex flex-row justify-center items-center gap-3 font-bold text-sm p-3 ">
634 633
         <image :src="like_adorn_220628Image" mode="widthFix" class="w-6 h-6"></image>
635 634
         <div>

+ 2 - 1
src/pages/store/product/detail.vue

@@ -498,7 +498,7 @@ onPageScroll((page) => {
498 498
 <template>
499 499
   <!-- 商品上架状态 -->
500 500
   <div class="flex flex-col gap-3 pb-20" v-if="detail">
501
-    <CXBBackTop :Scroll_X="Scroll_X" />
501
+    <CXBBackTop :Scroll_X="Scroll_X" :isCss="2"  v-if="detail" />
502 502
     <div class="bg-white ">
503 503
       <div class="w-screen h-94">
504 504
         <swiper v-if="detail && detail.slider_image" :indicator-dots="state.indicatorDots"
@@ -702,6 +702,7 @@ onPageScroll((page) => {
702 702
 
703 703
   </div>
704 704
   <!-- 商品下架 -->
705
+  <CXBBackTop :Scroll_X="Scroll_X" :isCss="2"  v-if="isShow" />
705 706
   <div class="relative w-screen " v-if="isShow">
706 707
     <div class="box-out">
707 708
       <div class="flex-box pb-3 px-3 ">

+ 2 - 2
src/pages/store/product/other.vue

@@ -509,7 +509,7 @@ onPageScroll((page) => {
509 509
           <image :key="index" :src="item" mode="aspectFill" class="h-full w-full" />
510 510
         </swiper-item>
511 511
       </swiper>
512
-      <CXBBackTop :Scroll_X="Scroll_X" />
512
+      <CXBBackTop :Scroll_X="Scroll_X" :isCss="2" />
513 513
       <div>
514 514
         <div class="relative p-3 bg-white">
515 515
           <div class="flex gap-2 items-end">
@@ -562,7 +562,7 @@ onPageScroll((page) => {
562 562
       </div>
563 563
     </div>
564 564
     <div class="relative w-screen " v-if="isShow">
565
-      <CXBBackTop :Scroll_X="Scroll_X" />
565
+      <CXBBackTop :Scroll_X="Scroll_X" :isCss="1" />
566 566
       <div class="box-out">
567 567
         <div class="flex-box pb-3 px-3 ">
568 568
           <div class="img-div">