修改滚动固定

src/components/Dialogs/loadingDialog.vue

@@ -21,10 +21,6 @@ const props = defineProps({
   type: Boolean,
   required: true,
 },
-buyDataArr: {
-  type: Array,
-  required: true,
-},
 });
 
 const emit = defineEmits(['handleClose'])

src/components/Dialogs/sellDialog.vue

@@ -195,7 +195,8 @@ const sellConfirm = async () => {
       message.error('Your product failed to be listed')
     }
   } else {
-    alert("价格不能为空");
+    // alert("Price cannot be empty");
+    message.error('Price cannot be empty')
   }
 };
 

src/components/assets/hanging.vue

@@ -55,6 +55,8 @@ const getHistoryList = async () => {
   }
   if(myAddress) {
     let res = await apiHangingState(data)
+    console.log(res)
+    return
     for (let sub of res.rows) {
       if (sub.event?.data) {
         const _data = formatPrice(sub.event.data)

src/components/assets/myCard.vue

@@ -25,14 +25,14 @@
           Enabled
         </div>
         <div v-if="nftData.type == 1 && nftData.on_sale == 0" class="link-below" @click="lockToGame">
-          Link below
+          Convert
         </div>
         <!-- <div>{{ nftData.owner_address.substr(0,6) }}...{{ nftData.owner_address.substr(-6) }}</div> -->
       </div>
     </div>
     <div class="card-btn">
-      <div class="card-sell" v-if="nftData.on_sale == 0" @click="sellNft(nftData)">List for Sale</div>
-      <div class="card-cancel" v-if="nftData.on_sale == 1" @click="cancelNft(nftData)">Off the shelves</div>
+      <div class="card-sell" v-if="nftData.on_sale == 0" @click="sellNft(nftData)">List</div>
+      <div class="card-cancel" v-if="nftData.on_sale == 1" @click="cancelNft(nftData)">Cancel listing</div>
     </div>
     <SellDialog :sellDialogVisible="sellDialogVisible" :floorPrice="floorPrice" :sellDataArr="sellDataArr" @handleClose="sellHandleClose" />
   </div>
@@ -86,7 +86,7 @@ const getNftData = async (val) => {
   if(errcode == 0) {
     nftDetailData = data
   } else {
-    alert(errmsg)
+    // alert('0000')
   }
   return nftDetailData
 }

src/components/marketplace/mktContent.vue

@@ -1,5 +1,6 @@
 <template>
   <div class="mkt-content">
+    <div class="content"></div>
     <div class="mkt-content-left">
       <OverView :overviewValue="marketplaceList.overview" @clickOverviewChild="overviewChild" />
       <Sort @clickSortChild="sortChild" />
@@ -64,6 +65,9 @@
         <div class="pages" v-if="nftList != undefined && nftList.length > 0">
           <li v-for="(item, index) in nftList" :key="index">
             <Card v-if="nftList != undefined || nftList.length > 0" @renewNft="renewNft" :nftData="item" />
+              <Card v-if="nftList != undefined || nftList.length > 0" @renewNft="renewNft" :nftData="item" />
+              <Card v-if="nftList != undefined || nftList.length > 0" @renewNft="renewNft" :nftData="item" />
+                <Card v-if="nftList != undefined || nftList.length > 0" @renewNft="renewNft" :nftData="item" />
           </li>
         </div>
         <div class="pages-no" v-else>
@@ -267,6 +271,7 @@ onMounted(() => {
   }
   .mkt-content-right {
     width: calc(100% - 300px);
+    // box-sizing: border-box;
     padding-right: 40px;
     .mkt-content-right-header {
       width: calc(100% - 10px);

src/views/MarketplaceView.vue

@@ -1,7 +1,8 @@
 <template>
-  <div class="market">
-    <MktHeader />
-    <MktContent class="content" />
+  <div class="market" ref="market" :style="{overflow: marketOverflow}">
+      <MktHeader />
+      <!-- <MktContent  @wheel="handleScroll" :style="{ position: isFixed, top: 90+ 'px', }" ref="marketplaceContent" /> -->
+      <MktContent />
   </div>
 </template>
 
@@ -11,13 +12,39 @@ import { ref, reactive, onMounted, onUnmounted } from "vue";
 import MktHeader from '@/components/marketplace/mktHeader.vue'
 import MktContent from '@/components/marketplace/mktContent.vue'
 
+const marketOverflow = ref()
+const headerHeight = ref()
+const marketplaceContent = ref()
+const isFixed = ref(false)
+const handleScroll = (e) => {
+  
+  // console.log(marketplaceContent.value.$el.getBoundingClientRect().top, headerHeight.value.offsetHeight, marketplaceContent.value.$el.getBoundingClientRect().top - headerHeight.value.offsetHeight, e.offsetY)
+  // console.log(marketplaceContent.value.scrollTop)
+  if(marketplaceContent.value.$el.getBoundingClientRect().top < e.offsetY) {
+  //   console.log('固定 ')
+  //   // isFixed.value = true
+    isFixed.value = 'fixed'
+  //   marketOverflow.value = 'hidden'
+  } else {
+  //   // isFixed.value = false
+    isFixed.value = 'static'
+  //   console.log('滚动')
+  //   marketOverflow.value = 'auto'
+  }
+}
 
+onMounted(() => {
+  // marketplaceContent.value.addEventListener('scroll', doScroll)
+})
 
-
+onUnmounted(() => {
+  // content.value.removeEventListener('scroll', doScroll)
+})
 </script>
 
 <style lang="scss" scoped>
 .market {
-  background: #16141b;
+  width: 100%;
+  // height: 100vh;
 }
 </style>