diff --git a/app/components/x-popup/index.vue b/app/components/x-popup/index.vue
new file mode 100644
index 0000000..93c623c
--- /dev/null
+++ b/app/components/x-popup/index.vue
@@ -0,0 +1,46 @@
+<script setup>
+const props = defineProps({
+  show: {
+    type: Boolean,
+    default: false
+  },
+  title:''
+})
+const emit = defineEmits(['update:show'])
+const close=()=>{
+  emit('update:show',false)
+}
+</script>
+
+<template>
+  <van-popup
+      :show="show"
+      position="bottom"
+      :style="{ height: '74%' }"
+      v-bind="{...$attrs,...$props}"
+      @close="close"
+  >
+    <div class="flex flex-col h-full">
+      <!-- 固定的标题栏 -->
+      <div class="flex items-center pl-16px pr-19px h-40px border-b-1px border-b-[#D3D3D3] shrink-0">
+        <template v-if="$slots.title">
+        <slot name="title"></slot>
+        </template>
+        <template v-else>
+          <div class="text-#000 text-16px">{{title}}</div>
+        </template>
+        <div class="ml-auto flex items-center">
+          <van-icon size="20" name="cross" color="#939393" @click="close"/>
+        </div>
+      </div>
+      <!-- 可滚动的内容区域 -->
+      <div class="flex-1 overflow-y-auto ">
+        <slot/>
+      </div>
+    </div>
+  </van-popup>
+</template>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/app/pages/home/index.vue b/app/pages/home/index.vue
index 3b83a9f..c3e46c0 100644
--- a/app/pages/home/index.vue
+++ b/app/pages/home/index.vue
@@ -3,7 +3,7 @@ import LiveRoom from '@/pages/LiveRoom/index.client.vue';
 import {goodStore} from "@/stores/goods/index.js";
 import ItemList from './components/ItemList/index.vue'
 import Cescribe from './components/Cescribe/index.vue'
-
+import xPopup from '@/components/x-popup/index.vue'
 import {artworkList} from "~/api/goods/index.js";
 import {ref} from "vue";
 
@@ -36,55 +36,104 @@ const showBottom = ref(true)
       </van-tabs>
       <van-back-top right="15vw" bottom="10vh"/>
     </div>
-    <van-popup
-        v-model:show="showBottom"
-        position="bottom"
-        :style="{ height: '74%' }"
-    >
-      <div class="flex flex-col">
-        <div class="h-40px flex items-center pl-16px pr-19px border-b-1px border-b-[#D3D3D3]">
-          <div class="text-#000 text-16px">拍品列表</div>
-          <div class="text-#939393 text-16px ml-14px">共188个拍品</div>
-          <div class="ml-auto flex items-center">
-            <van-icon size="20" name="cross" color="#939393"/>
+    <x-popup v-model:show="showBottom">
+      <template #title>
+        <div class="text-#000 text-16px">拍品列表</div>
+        <div class="text-#939393 text-16px ml-14px">共188个拍品</div>
+      </template>
+      <div class="px-16px py-18px">
+        <div class="flex mb-21px">
+          <div class="mr-10px flex-shrink-0 rounded-4px overflow-hidden">
+            <img class="w-80px h-80px" src="@/static/images/ddfdcaer.png" alt="">
+          </div>
+          <div>
+            <div class="ellipsis line-height-20px text-16px font-600 min-h-40px">
+              张天赐 | 日出而作，日落而息撒打算撒打算撒打决赛多久啊是世奥兰日落而息撒打算撒打算撒打决赛多久啊是世奥兰
+            </div>
+            <div class="text-14px text-#575757">起拍价：RMB 1,000</div>
+            <div class="text-14px text-#B58047">成交价：等待更新</div>
           </div>
         </div>
-        <div class="flex-grow-1 px-16px py-18px">
+
+        <div class="flex mb-21px">
+          <div class="mr-10px flex-shrink-0 rounded-4px overflow-hidden">
+            <img class="w-80px h-80px" src="@/static/images/ddfdcaer.png" alt="">
+          </div>
           <div>
-            <div class="flex mb-21px">
-              <div class="mr-10px flex-shrink-0">
-                <img class="w-80px h-80px" src="@/static/images/ddfdcaer.png" alt="">
-              </div>
-              <div>
-                <div class="ellipsis line-height-20px text-16px font-600 min-h-40px">张天赐 | 日出而作，日落而息撒打算撒打算撒打决赛多久啊是世奥兰日落而息撒打算撒打算撒打决赛多久啊是世奥兰</div>
-                <div class="text-14px text-#575757">起拍价：RMB 1,000</div>
-                <div class="text-14px text-#B58047">成交价：等待更新</div>
-              </div>
+            <div class="ellipsis line-height-20px text-16px font-600 min-h-40px">
+              张天赐 | 日出而作，日落而息撒打算撒打算撒打决赛多久啊是世奥兰日落而息撒打算撒打算撒打决赛多久啊是世奥兰
             </div>
-            <div class="flex mb-21px">
-              <div class="mr-10px flex-shrink-0">
-                <img class="w-80px h-80px" src="@/static/images/ddfdcaer.png" alt="">
-              </div>
-              <div>
-                <div class="ellipsis line-height-20px text-16px font-600 min-h-40px">张天赐 | 日出而作，日落而息撒打算撒打算撒打决赛多久啊是世奥兰日落而息撒打算撒打算撒打决赛多久啊是世奥兰</div>
-                <div class="text-14px text-#575757">起拍价：RMB 1,000</div>
-                <div class="text-14px text-#B58047">成交价：等待更新</div>
-              </div>
+            <div class="text-14px text-#575757">起拍价：RMB 1,000</div>
+            <div class="text-14px text-#B58047">成交价：等待更新</div>
+          </div>
+        </div>
+
+        <div class="flex mb-21px">
+          <div class="mr-10px flex-shrink-0 rounded-4px overflow-hidden">
+            <img class="w-80px h-80px" src="@/static/images/ddfdcaer.png" alt="">
+          </div>
+          <div>
+            <div class="ellipsis line-height-20px text-16px font-600 min-h-40px">
+              张天赐 | 日出而作
             </div>
-            <div class="flex mb-21px">
-              <div class="mr-10px flex-shrink-0">
-                <img class="w-80px h-80px" src="@/static/images/ddfdcaer.png" alt="">
-              </div>
-              <div>
-                <div class="ellipsis line-height-20px text-16px font-600 min-h-40px">张天赐 | 日出而作</div>
-                <div class="text-14px text-#575757">起拍价：RMB 1,000</div>
-                <div class="text-14px text-#B58047">成交价：等待更新</div>
-              </div>
+            <div class="text-14px text-#575757">起拍价：RMB 1,000</div>
+            <div class="text-14px text-#B58047">成交价：等待更新</div>
+          </div>
+        </div>
+
+        <div class="flex mb-21px">
+          <div class="mr-10px flex-shrink-0 rounded-4px overflow-hidden">
+            <img class="w-80px h-80px" src="@/static/images/ddfdcaer.png" alt="">
+          </div>
+          <div>
+            <div class="ellipsis line-height-20px text-16px font-600 min-h-40px">
+              张天赐 | 日出而作
             </div>
+            <div class="text-14px text-#575757">起拍价：RMB 1,000</div>
+            <div class="text-14px text-#B58047">成交价：等待更新</div>
+          </div>
+        </div>
+
+        <div class="flex mb-21px">
+          <div class="mr-10px flex-shrink-0 rounded-4px overflow-hidden">
+            <img class="w-80px h-80px" src="@/static/images/ddfdcaer.png" alt="">
+          </div>
+          <div>
+            <div class="ellipsis line-height-20px text-16px font-600 min-h-40px">
+              张天赐 | 日出而作
+            </div>
+            <div class="text-14px text-#575757">起拍价：RMB 1,000</div>
+            <div class="text-14px text-#B58047">成交价：等待更新</div>
+          </div>
+        </div>
+
+        <div class="flex mb-21px">
+          <div class="mr-10px flex-shrink-0 rounded-4px overflow-hidden">
+            <img class="w-80px h-80px" src="@/static/images/ddfdcaer.png" alt="">
+          </div>
+          <div>
+            <div class="ellipsis line-height-20px text-16px font-600 min-h-40px">
+              张天赐 | 日出而作
+            </div>
+            <div class="text-14px text-#575757">起拍价：RMB 1,000</div>
+            <div class="text-14px text-#B58047">成交价：等待更新</div>
+          </div>
+        </div>
+
+        <div class="flex mb-21px">
+          <div class="mr-10px flex-shrink-0 rounded-4px overflow-hidden">
+            <img class="w-80px h-80px" src="@/static/images/ddfdcaer.png" alt="">
+          </div>
+          <div>
+            <div class="ellipsis line-height-20px text-16px font-600 min-h-40px">
+              张天赐 | 日出而作
+            </div>
+            <div class="text-14px text-#575757">起拍价：RMB 1,000</div>
+            <div class="text-14px text-#B58047">成交价：等待更新</div>
           </div>
         </div>
       </div>
-    </van-popup>
+    </x-popup>
   </div>
 </template>
 <style>
diff --git a/nuxt.config.js b/nuxt.config.js
index 63f663a..7a4fad8 100644
--- a/nuxt.config.js
+++ b/nuxt.config.js
@@ -10,9 +10,7 @@ const publicConfig = Object.entries(process.env)
     config[key] = value
     return config
   }, {})
-
 export default defineNuxtConfig({
-
   hooks: {
     'pages:extend'(pages) {
       const indexPage = pages.findIndex(page => page.path === '/')