diff --git a/package.json b/package.json
index d2dea5c..6223a48 100644
--- a/package.json
+++ b/package.json
@@ -82,6 +82,7 @@
     "vite": "^4.4.9",
     "vue-echarts": "^6.6.1",
     "vue-masonry": "^0.16.0",
+    "vue-next-masonry": "^1.1.3",
     "xss": "^1.0.14"
   },
   "dependencies": {
diff --git a/pages/dashboard/records/review.vue b/pages/dashboard/records/review.vue
index db64955..f56b673 100644
--- a/pages/dashboard/records/review.vue
+++ b/pages/dashboard/records/review.vue
@@ -1,6 +1,5 @@
 <script setup lang="ts">
 import { UserPollLogsReq, useUserPollLogs } from '~/composables/api'
-
 useHead({
   title: '审核记录'
 })
@@ -70,19 +69,31 @@ watch([page, pageSize], () => {
         v-if="!userPollLogsPending && !userPollLogsError"
         class="records-container"
       >
-        <div class="records">
-          <template v-if="userPollLogsData && userPollLogsData.data.total > 0">
-            <ReviewRecordsCard
-              v-for="userPollLog in userPollLogsData.data.collection"
-              :key="userPollLog.poll_id"
-              :user-poll-log="userPollLog"
-              @show-poll-detail="showPollDetail"
-            />
-          </template>
-          <div v-else class="status">
-            <a-empty />
-          </div>
-        </div>
+        <ClientOnly>
+          <masonry
+            class="records"
+            :cols="{ default: 2, 640: 1 }"
+            :gutter="'1rem'"
+          >
+            <template
+              v-if="userPollLogsData && userPollLogsData.data.total > 0"
+            >
+              <div
+                v-for="userPollLog in userPollLogsData.data.collection"
+                :key="userPollLog.poll_id"
+                class="py-2"
+              >
+                <ReviewRecordsCard
+                  :user-poll-log="userPollLog"
+                  @show-poll-detail="showPollDetail"
+                />
+              </div>
+            </template>
+            <div v-else class="status">
+              <a-empty />
+            </div>
+          </masonry>
+        </ClientOnly>
         <!-- 分页器 -->
         <div
           v-show="userPollLogsData && userPollLogsData.data.total > 0"
@@ -117,8 +128,8 @@ watch([page, pageSize], () => {
       @apply w-full flex-1 flex flex-col;
 
       .records {
-        @apply w-full flex-1 flex flex-col;
-        @apply grid grid-cols-1 md:grid-cols-2 gap-x-4 gap-y-4;
+        @apply w-full flex-1;
+        // @apply grid grid-cols-1 md:grid-cols-2 gap-x-4 gap-y-4;
       }
     }
   }
diff --git a/plugins/masonry.client.ts b/plugins/masonry.client.ts
new file mode 100644
index 0000000..87b46bc
--- /dev/null
+++ b/plugins/masonry.client.ts
@@ -0,0 +1,5 @@
+import Masonry from 'vue-next-masonry'
+
+export default defineNuxtPlugin((nuxtApp) => {
+  nuxtApp.vueApp.use(Masonry, null)
+})
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 83bfe6c..3e10b64 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -220,6 +220,9 @@ devDependencies:
   vue-masonry:
     specifier: ^0.16.0
     version: 0.16.0(vue@3.3.4)
+  vue-next-masonry:
+    specifier: ^1.1.3
+    version: 1.1.3(vue@3.3.4)
   xss:
     specifier: ^1.0.14
     version: 1.0.14
@@ -12225,6 +12228,14 @@ packages:
       vue-demi: 0.13.11(vue@3.3.4)
     dev: true
 
+  /vue-next-masonry@1.1.3(vue@3.3.4):
+    resolution: {integrity: sha512-iY7Hy7Yyno4NE2ZWpbkINHhBdySZ/GfkubleR73CfIbv0uA4jTTl9nCcwErnGMTBIIlGYDl8gZr0OG/vFCy7JQ==}
+    peerDependencies:
+      vue: ^3.0.5
+    dependencies:
+      vue: 3.3.4
+    dev: true
+
   /vue-router@4.2.4(vue@3.3.4):
     resolution: {integrity: sha512-9PISkmaCO02OzPVOMq2w82ilty6+xJmQrarYZDkjZBfl4RvYAlt4PKnEX21oW4KTtWfa9OuO/b3qk1Od3AEdCQ==}
     peerDependencies: