diff --git a/src/api/ai/image/index.ts b/src/api/ai/image/index.ts
index 43ddc7ec..8eb16105 100644
--- a/src/api/ai/image/index.ts
+++ b/src/api/ai/image/index.ts
@@ -99,5 +99,10 @@ export const ImageApi = {
   // 删除绘画
   deleteImage: async (id: number) => {
     return await request.delete({ url: `/ai/image/delete?id=` + id })
-  }
+  },
+
+  // release 列表
+  publicList: async (params) => {
+    return await request.get({ url: `/ai/image/public-list`, params})
+  },
 }
diff --git a/src/views/ai/image/square/index.vue b/src/views/ai/image/square/index.vue
new file mode 100644
index 00000000..c8e2c4bf
--- /dev/null
+++ b/src/views/ai/image/square/index.vue
@@ -0,0 +1,42 @@
+<template>
+   <div class="card-list">
+     <div v-for="item in publicList" :key="item" class="card">
+       <img :src="item.picUrl" class="img"/>
+     </div>
+   </div>
+</template>
+<script setup lang="ts">
+import { ImageApi, ImageVO, ImageMidjourneyButtonsVO } from '@/api/ai/image'
+
+/** 属性 */
+const pageNo = ref<number>(1)
+const pageSize = ref<number>(20)
+const publicList = ref<ImageVO[]>([])
+
+/** 获取数据 */
+const getListData = async () => {
+  const res = await ImageApi.publicList({pageNo: pageNo.value, pageSize: pageSize.value});
+  publicList.value = res.list as ImageVO[];
+  console.log('publicList.value', publicList.value)
+}
+
+onMounted(async () => {
+  await getListData()
+})
+</script>
+<style scoped lang="scss">
+
+.card-list {
+  //display: flex;
+  //flex-direction: column;
+  column-count: 4;
+  column-gap: 3px;
+}
+
+.card {
+
+  .img {
+    width: 50%;
+  }
+}
+</style>