diff --git a/src/App.vue b/src/App.vue
index c1f4d52..8be2f30 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,8 +1,24 @@
 <script setup>
+import {ref} from 'vue'
+import {NConfigProvider} from 'naive-ui'
+const primaryColor=ref('#2B69A1')
+const   themeOverrides= ref({
+  common: {
+    primaryColorPressed: primaryColor,
+    primaryHover:primaryColor,
+    primaryDefault: primaryColor,
+    primaryActive: primaryColor,
+    primarySuppl: primaryColor,
+    primaryColor: primaryColor,
+    primaryColorHover: primaryColor
+  }
+})
 </script>
 
 <template>
+  <n-config-provider :theme-overrides="themeOverrides">
   <router-view />
+  </n-config-provider>
 </template>
 
 <style>
diff --git a/src/assets/image/asdf3255@2x1.png b/src/assets/image/asdf3255@2x1.png
new file mode 100644
index 0000000..7f49e92
Binary files /dev/null and b/src/assets/image/asdf3255@2x1.png differ
diff --git a/src/main.js b/src/main.js
index 6617765..a6a9115 100644
--- a/src/main.js
+++ b/src/main.js
@@ -4,6 +4,7 @@ import App from './App.vue'
 import '@unocss/reset/sanitize/sanitize.css'
 import '@unocss/reset/sanitize/assets.css'
 import 'virtual:uno.css'
+import "vant/es/image-preview/style";
 import { ImagePreview } from 'vant';
 
 import router from "./router/index.js";
diff --git a/src/store/auth/index.js b/src/store/auth/index.js
index f64d6a9..247fd30 100644
--- a/src/store/auth/index.js
+++ b/src/store/auth/index.js
@@ -1,8 +1,10 @@
 import {ref,computed} from 'vue'
 import {createGlobalState,useStorage} from '@vueuse/core'
-import {competitionApply, competitionWorks, loginRegister, sendCode} from '@/api/auth/index.js'
+import {competitionApply, competitionWorks, loginRegister, sendCode, uploadFile} from '@/api/auth/index.js'
 import {message} from "@/utils/message.js"
 import { useRouter } from 'vue-router';
+import { showImagePreview } from 'vant';
+import useImgModalPopup from "@/components/imgModal/imgModal.js";
 export const useAuth=createGlobalState(()=>{
 
     const router = useRouter();
@@ -35,6 +37,16 @@ export const useAuth=createGlobalState(()=>{
         }
         return true;
     }
+
+    const openMask=(src)=>{
+        showImagePreview({
+            images:[src],
+            closeable: true,
+        })
+    }
+    const goBack=()=>{
+        router.back()
+    }
     const detailData=useStorage('detailData', {}, localStorage)
     const formData=useStorage('formData',{
         name:'',
@@ -61,6 +73,19 @@ export const useAuth=createGlobalState(()=>{
     const removeWorks=(index)=>{
         formData.value.works.splice(index,1)
     }
+    const afterRead=async (file,item)=>{
+        const formData1 = new FormData()
+        formData1.append("file", file.file)
+        formData1.append("type", 'image')
+        const res=await uploadFile(formData1)
+        if (res.status===0){
+            item.picUrl=res.data
+        }
+    }
+    const deleteImg=(item)=>{
+        item.picUrl=''
+        item.imgList=[]
+    }
     const clickApply=async ()=>{
         const isValid = validateFormData();
         if (!isValid){
@@ -87,6 +112,14 @@ export const useAuth=createGlobalState(()=>{
             console.log(res.data,'getDetail')
             detailData.value=res.data
         }
+    }
+     const goConfirm=()=>{
+         const isValid = validateFormData();
+         if (!isValid){
+             message.warning('作品信息不全，请补充')
+             return
+         }
+        router.push('/confirm')
     }
     const clickLogin=async ()=>{
         const data={
@@ -135,7 +168,21 @@ export const useAuth=createGlobalState(()=>{
             }, 1000);
         }
     }
+    const {showImgModal}= useImgModalPopup()
+    const openMask1=(src)=>{
+        showImgModal({url:src})
+        /*  showImagePreview({
+            images:[src],
+            closeable: true,
+          })*/
+    }
     return {
+        goBack,
+        openMask1,
+        deleteImg,
+        afterRead,
+        openMask,
+        goConfirm,
         detailData,
         removeWorks,
         clickAddWorks,
diff --git a/src/views/confirm/size375/index.vue b/src/views/confirm/size375/index.vue
index 71794b8..70733f0 100644
--- a/src/views/confirm/size375/index.vue
+++ b/src/views/confirm/size375/index.vue
@@ -1,16 +1,13 @@
 <script setup>
-import { useAdaptation } from "@/utils/self-adaption.js";
-import {ref} from "vue";
-const { maxWidth } = useAdaptation([
-  { maxWidth: '375px' },
-  { maxWidth: '768px' }
-])
-const showPicker=ref(false)
-const columns=ref([
-  {text:'男',value:0},
-  {text:'女',value:1}
-])
-function onConfirm(){
+import {useAuth} from "@/store/auth/index.js";
+
+const {clickApply,formData} =useAuth()
+import { showImagePreview } from 'vant';
+const openMask=(src)=>{
+  showImagePreview({
+    images:[src],
+    closeable: true,
+  })
 }
 </script>
 
@@ -21,38 +18,38 @@ function onConfirm(){
       <div class="wrap1" style="margin-top: 0">
         <div class="wrap1_1">*姓名</div>
         <div class="wrap1_2">
-         王小午
+         {{formData.name}}
         </div>
       </div>
       <div class="wrap1">
         <div class="wrap1_1">*年龄</div>
         <div class="wrap1_2">
-      10 岁
+      {{formData.age}} 岁
         </div>
       </div>
       <div class="wrap1">
         <div class="wrap1_1">*性别</div>
         <div class="wrap1_2">
-          女
+          {{formData.gender}}
         </div>
       </div>
       <div class="package1">
-        <div class="package1_1">
-          <div class="package1_1_1">*作品1</div>
+        <div class="package1_1" v-for="(item,index) in formData.works">
+          <div class="package1_1_1">*作品{{index+1}}</div>
           <div class="package1_1_2">
-            <img class="package1_1_2_1" src="@/assets/image/zwbackground@2x.png" alt="">
+            <img class="package1_1_2_1 object-contain"  @click="openMask(item.picUrl)" :src="item.picUrl" alt="">
             <div class="package1_1_2_2">
               <div class="package1_1_2_2_1">作品名称</div>
-              <div class="package1_1_2_2_2">盛夏光年</div>
+              <div class="package1_1_2_2_2">{{item.workName}}</div>
             </div>
             <div class="package1_1_2_3">
               <div class="package1_1_2_3_1">
                 <div class="package1_1_2_3_1_1">长度</div>
-                <div class="package1_1_2_3_1_2">34 cm</div>
+                <div class="package1_1_2_3_1_2">{{item.length}} cm</div>
               </div>
               <div class="package1_1_2_3_2">
                 <div class="package1_1_2_3_2_1">宽度</div>
-                <div class="package1_1_2_3_2_2">56 cm</div>
+                <div class="package1_1_2_3_2_2">{{item.wide}} cm</div>
               </div>
             </div>
           </div>
@@ -60,7 +57,7 @@ function onConfirm(){
       </div>
       <div class="package2">
         <div class="package2_1">取消</div>
-        <div class="package2_2">提交报名</div>
+        <div class="package2_2" @click="clickApply">提交报名</div>
       </div>
     </div>
     <div class="content3">
@@ -69,13 +66,6 @@ function onConfirm(){
     <div class="content4">
       <img src="@/assets/image/zu733@2x.png" alt="">
     </div>
-    <van-popup v-model:show="showPicker" round position="bottom">
-      <van-picker
-          :columns="columns"
-          @cancel="showPicker = false"
-          @confirm="onConfirm"
-      />
-    </van-popup>
   </div>
 </template>
 
diff --git a/src/views/confirm/size768/index.vue b/src/views/confirm/size768/index.vue
index 0f5f9f8..561fef3 100644
--- a/src/views/confirm/size768/index.vue
+++ b/src/views/confirm/size768/index.vue
@@ -1,41 +1,61 @@
 <script setup>
+import {useAuth} from "@/store/auth/index.js";
+
+const {clickApply,formData,openMask1,goBack} =useAuth()
 
 </script>
 
 <template>
-  <div class="box-border relative w-[1920px] h-screen bg-no-repeat bg-cover bg-[url('@/assets/image/zu3237.png')] flex items-center flex-col">
-    <div class="mb-[90px]">
-      <img class="w-[525px] h-[87px] mt-[303px]" src="@/assets/image/zu3314@2x.png" alt="">
+  <div class="box-border relative w-[1920px] h-screen bg-no-repeat bg-cover bg-[url('@/assets/image/gdz53@2x.png')] flex items-center flex-col">
+    <div class="mb-[90px] mt-[303px]">
+      <img class="w-[525px] h-[87px]" src="@/assets/image/zu3314@2x.png" alt="">
     </div>
     <div class="absolute top-0 left-[70px]">
       <img class="w-[610px] h-[668px]" src="@/assets/image/gdz47@2x.png" alt="">
     </div>
-    <div class="bg-[url('@/assets/image/z3327@2x1.png')] w-[1173px] h-[1489px] bg-no-repeat bg-cover pt-[98px] pr-[54px] pl-[54px]">
+    <div class="bg-[url('@/assets/image/z3327@2x1.png')] w-[1173px] h-[1489px] bg-no-repeat bg-cover pt-[98px] pr-[54px] pl-[54px] pb-60px">
       <div class="flex">
-        <div class="text-primary text-[35px] w-[200px] font-bold">姓名</div>
-        <div class="text-primary text-[35px]">王小五</div>
+        <div class="text-primary text-[35px] w-[200px] font-bold pl-15px">*姓名</div>
+        <div class="text-primary text-[35px]">{{formData.name}}</div>
       </div>
       <div class="flex mt-[26.74px]">
-        <div class="text-primary text-[35px] w-[200px] font-bold">*年龄</div>
-        <div class="text-primary text-[35px]">10 岁</div>
+        <div class="text-primary text-[35px] w-[200px] font-bold pl-15px">*年龄</div>
+        <div class="text-primary text-[35px]">{{formData.age}} 岁</div>
       </div>
       <div class="flex  mt-[26.74px]">
-        <div class="text-primary text-[35px] w-[200px] font-bold">*性别</div>
-        <div class="text-primary text-[35px]">女</div>
+        <div class="text-primary text-[35px] w-[200px] font-bold pl-15px">*性别</div>
+        <div class="text-primary text-[35px]">{{formData.gender}}</div>
       </div>
-      <div class="w-[1065px] h-[980px] bg-#F5F5F5 mt-[8.26px] flex pt-[21.74px]">
-        <div class="flex">
-          <div class="text-primary font-bold shrink-0 w-[200px]">*作品1</div>
+      <div class="w-[1065px] h-[980px] bg-#F5F5F5 mt-[8.26px] mb-33px flex pt-[21.74px]">
+        <div :class="`flex w-full ${formData.works?.length>1&&index+1!==formData.works?.length?'border-b-1px border-b-[#D6E0E9] border-b-solid mb-50px pb-50px':''}` "  v-for="(item,index) of formData.works" :key="index">
+          <div class="text-primary text-35px font-bold shrink-0 w-[200px] pl-15px">*作品{{index+1}}</div>
           <div>
-            <img class="w-[738px] h-[353px]" src="@/assets/image/dfbackground@2.png" alt="">
-            <div class="flex text-primary text-[30px] font-bold">
-              <div>作品名称</div>
-              <div>盛夏光年</div>
+            <img class="w-[738px] h-[353px]" @click="openMask1(item.picUrl)" :src="item.picUrl" alt="">
+            <div class="flex text-primary text-[30px] mt-20px  w-50%">
+              <div class="font-bold w-187px">作品名称</div>
+              <div class="">{{item.workName}}</div>
+            </div>
+            <div class="flex text-primary text-[30px] mt-20px">
+             <div class="flex w-50%">
+               <div class="font-bold w-187px">长度</div>
+               <div class="">{{item.length}} <span class="ml-30px">cm</span></div>
+             </div>
+              <div class="flex w-50% ml-a">
+                <div class="w-187px">宽度</div>
+                <div class="">{{item.wide}} <span class="ml-30px">cm</span></div>
+              </div>
             </div>
           </div>
         </div>
 
       </div>
+      <div class="flex">
+        <div class="text-primary text-40px w-410px h-98px flex justify-center items-center bg-#fff shadow-[0_16px_16px_rgba(0,0,0,0.1)] rounded-60px" @click="goBack">取消</div>
+        <div class="bg-[url('@/assets/image/asdf3255@2x1.png')] w-600px h-98px bg-contain ml-a text-40px text-#fff flex-center" @click="clickApply">确定</div>
+      </div>
+      <div class="absolute bottom-0 right-0 ">
+        <img class="w-1170px h-557px" src="@/assets/image/dfdf4@2x.png" alt="">
+      </div>
     </div>
 </div>
 </template>
diff --git a/src/views/details/size375/index.vue b/src/views/details/size375/index.vue
index 353ad67..5de760f 100644
--- a/src/views/details/size375/index.vue
+++ b/src/views/details/size375/index.vue
@@ -1,9 +1,7 @@
 <script setup>
 import {useAuth} from "@/store/auth/index.js";
 const {detailData} =useAuth()
-import "vant/es/image-preview/style";
 import { showImagePreview } from 'vant';
-console.log(detailData,'detailData')
 const openMask=(src)=>{
   showImagePreview({
     images:[src],
diff --git a/src/views/details/size768/index.vue b/src/views/details/size768/index.vue
index cb28f34..7751d36 100644
--- a/src/views/details/size768/index.vue
+++ b/src/views/details/size768/index.vue
@@ -37,7 +37,7 @@ const openMask=(src)=>{
             <div v-for="(item, index) in detailData?.worksInfo" :key="index" class="mb-[45px] flex  items-start w-full">
               <div class="text-[35px] w-[200px] font-bold text-[#2B69A1] pt-18px">作品{{ index + 1 }}</div>
               <div class="relative w-[1147px]">
-                <img class="w-738px h-353px" @click="openMask(item.picUrl.replace('https', 'http'))" :src="item.picUrl.replace('https', 'http')" alt="" />
+                <img class="w-738px h-353px object-contain" @click="openMask(item.picUrl.replace('https', 'http'))" :src="item.picUrl.replace('https', 'http')" alt="" />
                 <!--  未入围  -->
                 <img v-if="item.status === 3" src="@/assets/image/zu3222@2x.png" class="w-[404px] h-[404px] absolute top-0 right-0" alt="" />
                 <!--  待定 -->
diff --git a/src/views/login/index.vue b/src/views/login/index.vue
index ddedc89..4a7df9f 100644
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -8,11 +8,13 @@ import size768 from '@/views/login/size768/index.vue'
 import size1440 from '@/views/login/size1440/index.vue'
 import size1920 from '@/views/login/size1920/index.vue'
 import {computed} from "vue";
-import {useWindowSize  } from '@vueuse/core';
+import {useWindowSize } from '@vueuse/core';
 const {clickSendCode}= useAuth()
 const { width, height } = useWindowSize()
 const isLandscape = computed(() => width.value > height.value)
 const {currentRange }= useAdaptation(sizes)
+localStorage.clear()
+console.log('执行1111')
 const viewComponent = computed(()=>{
 switch (currentRange.value?.minWidth){
   case '0px':
diff --git a/src/views/login/size1920/index.vue b/src/views/login/size1920/index.vue
index 3467972..fd4cbbc 100644
--- a/src/views/login/size1920/index.vue
+++ b/src/views/login/size1920/index.vue
@@ -1,6 +1,7 @@
 <script setup>
 import {useAuth} from "@/store/auth/index.js";
 const {clickSendCode,telNum,code}= useAuth()
+
 </script>
 
 <template>
@@ -13,7 +14,7 @@ const {clickSendCode,telNum,code}= useAuth()
         <div class="flex items-center">
           <div class="text-primary text-[14px] font-bold w-[66px]" >手机号</div>
           <div>
-            <input v-no-space v-model="telNum" class="pl-[16px] pr-[16px] w-[341px] h-[34px] focus:outline-none placeholder:text-primary placeholder:text-[14px] focus: bg-[#DCE5E9]   border-none" placeholder="请输入手机号" type="text">
+            <input  v-no-space v-model="telNum" class="pl-[16px] pr-[16px] w-[341px] h-[34px] focus:outline-none placeholder:text-primary placeholder:text-[14px] focus: bg-[#DCE5E9]   border-none" placeholder="请输入手机号" type="text">
           </div>
         </div>
         <div  class="flex items-center mt-[18px]">
diff --git a/src/views/login/size768/index.vue b/src/views/login/size768/index.vue
index 4d11e37..f001977 100644
--- a/src/views/login/size768/index.vue
+++ b/src/views/login/size768/index.vue
@@ -1,4 +1,7 @@
 <script setup>
+import {useAuth} from "@/store/auth/index.js";
+
+const {clickSendCode,telNum,code,showTextCode ,clickLogin }= useAuth()
 
 </script>
 
@@ -12,17 +15,17 @@
         <div class="flex items-center">
           <div class="text-primary text-[35px] font-bold w-[166px]">手机号</div>
           <div>
-            <input class="pl-[61px] w-[853px] h-[85px] focus:outline-none placeholder:text-primary placeholder:text-[35px] focus: bg-[#DCE5E9] focus:text-[35px]  border-none" placeholder="请输入手机号" type="text">
+            <input v-model="telNum" v-no-space class="pl-[61px] w-[853px] h-[85px] focus:outline-none placeholder-text-primary placeholder-text-[35px] focus: bg-[#DCE5E9] text-35px  border-none" placeholder="请输入手机号" type="text">
           </div>
         </div>
         <div class="flex items-center mt-[45px]">
           <div class="text-primary text-[35px] font-bold w-[166px] shrink-0">验证码</div>
           <div class="flex items-center justify-between w-[853px] grow-1">
-            <input class="pl-[61px] w-[528px] h-[85px] focus:outline-none placeholder:text-primary placeholder:text-[35px] focus: bg-[#DCE5E9] focus:text-[35px]  border-none grow-0" placeholder="请输入验证码" type="text">
-            <div class="w-[300px] h-[85px] bg-primary text-#fff flex items-center justify-center">获取验证码</div>
+            <input v-model="code" v-no-space class="pl-[61px] w-[528px] h-[85px] focus:outline-none placeholder-text-primary placeholder-text-[35px] focus: bg-[#DCE5E9] text-35px   border-none " placeholder="请输入验证码" type="text">
+            <div class="w-[300px] h-[85px] bg-primary text-#fff flex items-center justify-center">{{showTextCode}}</div>
           </div>
         </div>
-        <div class="bg-[url('@/assets/image/z3255@2x.png')] w-[600px] h-[98px] bg-center bg-no-repeat bg-contain flex items-center justify-center text-#fff text-[40px] mt-[183px]">登录/注册</div>
+        <div class="bg-[url('@/assets/image/z3255@2x.png')] w-[600px] h-[98px] bg-center bg-no-repeat bg-contain flex items-center justify-center text-#fff text-[40px] mt-[183px]" @click="clickLogin">登录/注册</div>
       </div>
     </div>
       <div class="absolute top-0 left-[70px] z-11">
diff --git a/src/views/signup/index.vue b/src/views/signup/index.vue
index 8c022d4..a488f13 100644
--- a/src/views/signup/index.vue
+++ b/src/views/signup/index.vue
@@ -10,6 +10,7 @@ import {useWindowSize  } from '@vueuse/core';
 const { width, height } = useWindowSize()
 const isLandscape = computed(() => width.value > height.value)
 const {currentRange }= useAdaptation(sizes)
+
 const viewComponent = computed(()=>{
   switch (currentRange.value?.minWidth){
     case '0px':
@@ -33,5 +34,7 @@ const viewComponent = computed(()=>{
 </template>
 
 <style scoped lang="scss">
-
+:deep(.n-base-selection-input__content){
+  color: #2B69A1;
+}
 </style>
diff --git a/src/views/signup/size375/index.vue b/src/views/signup/size375/index.vue
index 9d83943..f535f7b 100644
--- a/src/views/signup/size375/index.vue
+++ b/src/views/signup/size375/index.vue
@@ -1,26 +1,14 @@
 <script setup>
 import {ref} from "vue";
 import {useAuth} from "@/store/auth/index.js";
-import {uploadFile} from "@/api/auth/index.js";
-const {clickApply,formData,genderOptions,clickAddWorks,removeWorks} =useAuth()
+const {formData,genderOptions,clickAddWorks,removeWorks,goConfirm,deleteImg,afterRead} =useAuth()
 const showPicker=ref(false)
 function onConfirm(data){
   formData.value.gender=data.selectedValues?.[0]
   showPicker.value=false
 }
-const afterRead=async (file,item)=>{
-  const formData1 = new FormData()
-  formData1.append("file", file.file)
-  formData1.append("type", 'image')
-const res=await uploadFile(formData1)
-  if (res.status===0){
-    item.picUrl=res.data
-  }
-}
-const deleteImg=(item)=>{
-item.picUrl=''
-  item.imgList=[]
-}
+
+
 </script>
 <template>
   <div class="box-border relative w-1920px h-screen bg-no-repeat bg-cover bg-[url('@/assets/image/zu3237.png')] flex items-center flex-col">
@@ -93,7 +81,7 @@ item.picUrl=''
           <div class="absolute w-6px h-88px bg-white"></div>
         </div>
       </div>
-      <div @click="clickApply" class="mt-60px w-866px h-200px bg-contain bg-no-repeat bg-[url('@/assets/image/zu3189@2x1.png')] flex justify-center items-center text-white text-82px">
+      <div @click="goConfirm" class="mt-60px w-866px h-200px bg-contain bg-no-repeat bg-[url('@/assets/image/zu3189@2x1.png')] flex justify-center items-center text-white text-82px">
         确定
       </div>
     </div>
diff --git a/src/views/signup/size768/index.vue b/src/views/signup/size768/index.vue
index 3d4de3e..fb24e26 100644
--- a/src/views/signup/size768/index.vue
+++ b/src/views/signup/size768/index.vue
@@ -1,5 +1,7 @@
 <script setup>
-
+import {useAuth} from "@/store/auth/index.js";
+import {NSelect} from "naive-ui";
+const {formData,genderOptions,clickAddWorks,removeWorks,goConfirm,deleteImg,afterRead} =useAuth()
 </script>
 
 <template>
@@ -17,59 +19,107 @@
       <div class="flex items-center">
         <div class="text-primary text-[35px] w-[165px] font-bold">*姓名</div>
         <div class="text-primary text-[35px]">
-          <input class="pl-30px pr-[30px] w-[853px] h-[85px] focus:outline-none placeholder-text-primary placeholder:text-[35px] focus: bg-[#DCE5E9] focus:text-[35px]  border-none" placeholder="请输入宝贝姓名" type="text">
+          <input v-no-space v-model="formData.name" class="pl-30px pr-[30px] w-[853px] h-[85px] focus:outline-none placeholder-text-primary placeholder:text-[35px] focus: bg-[#DCE5E9] focus:text-[35px]  border-none" placeholder="请输入宝贝姓名" type="text">
         </div>
       </div>
       <div class="flex items-center mt-[45px]">
         <div class="text-primary text-[35px] w-[165px] font-bold">*年龄</div>
         <div class="text-primary text-[35px]">
-          <input class="pl-30px pr-[30px] w-[853px] h-[85px] focus:outline-none placeholder-text-primary placeholder:text-[35px] focus: bg-[#DCE5E9] focus:text-[35px]  border-none" placeholder="请输入年龄" type="text">
+          <input v-no-space v-model="formData.age" class="pl-30px pr-[30px] w-[853px] h-[85px] focus:outline-none placeholder-text-primary placeholder:text-[35px] focus: bg-[#DCE5E9] focus:text-[35px]  border-none" placeholder="请输入年龄" type="text">
+        </div>
+      </div>
+      <div class="flex items-center mt-18px">
+        <div class="text-primary text-[35px] w-[165px] font-bold">*性别</div>
+        <div class="text-primary text-[35px]">
+          <n-select
+              v-model:value="formData.gender"
+              placeholder="请选择性别"
+              class="w-[853px] h-[85px] focus:outline-none placeholder-text-primary placeholder-text-35px focus: bg-[#DCE5E9]   border-none"
+              :options="genderOptions.map(x=>{
+                return {
+                  label:x.text,value:x.value
+                }
+              })"
+          />
+          <!--          <input class="pl-16px pr-16px w-[645px] h-[34px] focus:outline-none placeholder-text-primary placeholder-text-14px focus: bg-[#DCE5E9]   border-none" placeholder="请输入宝贝姓名" type="text">
+                    <img src="@/assets/image/hsmr@2x.png" class="w-10px h-5px absolute right-19px top-50% translate-y-[-50%]" alt="">-->
         </div>
       </div>
-      <div class="bg-#F5F5F5 mt-38px w-[1065px] flex items-center flex-col grow-1">
-        <div class="flex">
-          <div class="text-primary text-[35px] w-[165px] font-bold mt-38px">*作品1</div>
+      <div class="bg-#F5F5F5 overflow-y-auto mt-38px w-[1065px] flex items-center flex-col grow-1">
+        <div :class="`flex w-full ${formData.works?.length>1&&index+1!==formData.works?.length?'border-b-1px border-b-[#D6E0E9] border-b-solid mb-50px pb-50px':''}` "  v-for="(item,index) of formData.works" :key="index">
+          <div class="text-primary text-[35px] w-[165px] font-bold mt-38px">*作品{{index+1}}</div>
           <div class="mt-20px">
-            <van-uploader>
-              <div class="w-738px h-342px bg-[#D6E0E9] rounded-20px flex flex-col items-center justify-center">
-                <img class="w-43px h-43px" src="@/assets/image/zu3264@2x.png" alt="">
-                <div class="mt-20px text-[#2B69A1] text-35px">上传作品</div>
+            <div class="flex items-end">
+              <van-uploader v-model="item.imgList" @delete="deleteImg(item)"  :max-count="1" :after-read="(e)=>{afterRead(e,item)}">
+                <div class="w-738px h-342px bg-[#D6E0E9] rounded-20px flex flex-col items-center justify-center">
+                  <img class="w-43px h-43px" src="@/assets/image/zu3264@2x.png" alt="">
+                  <div class="mt-20px text-[#2B69A1] text-35px">上传作品</div>
+                </div>
+              </van-uploader>
+              <div class="ml-15px" v-if="formData.works?.length>1" @click="removeWorks(index)">
+                <img class="w-41px h-41px" src="@/assets/image/sc@2x.png" alt="">
               </div>
-            </van-uploader>
+            </div>
             <div class="mt-20px text-30px text-[#2B69A1]">作品名称</div>
-            <input class="mt-20px w-835px h-85px bg-[#DCE5E9] pl-30px pr-[30px] border-none placeholder-[#2B69A1] placeholder-text-35px focus:outline-none" placeholder="请输入作品名称" type="text">
+            <input v-no-space v-model="item.workName" class="mt-20px w-835px h-85px bg-[#DCE5E9] pl-30px pr-[30px] border-none placeholder-[#2B69A1] placeholder-text-35px focus:outline-none" placeholder="请输入作品名称" type="text">
             <div class="flex justify-between mt-20px">
               <div class="flex flex-col">
                 <div class="text-30px text-[#2B69A1]">长度</div>
                 <div class="flex items-center mt-[10px]">
-                  <input class="w-330px h-85px bg-[#DCE5E9] pl-30px pr-[30px] border-none placeholder-[#2B69A1] placeholder-text-35px focus:outline-none" placeholder="请输入" type="text">
+                  <input v-no-space v-model="item.length" class="text-35px w-330px h-85px bg-[#DCE5E9] pl-30px pr-[30px] border-none placeholder-[#2B69A1] placeholder-text-35px focus:outline-none" placeholder="请输入" type="text">
                   <div class="ml-25px text-[#2B69A1] text-35px">cm</div>
                 </div>
               </div>
               <div class="flex flex-col">
                 <div class="text-30px text-[#2B69A1]">宽度</div>
                 <div class="flex items-center mt-[10px]">
-                  <input class="w-330px h-85px bg-[#DCE5E9] pl-30px pr-[30px] border-none placeholder-[#2B69A1] placeholder-text-35px focus:outline-none" placeholder="请输入" type="text">
+                  <input  v-no-space v-model="item.wide" class="w-330px h-85px bg-[#DCE5E9] pl-30px pr-[30px] border-none placeholder-[#2B69A1] placeholder-text-35px text-35px focus:outline-none" placeholder="请输入" type="text">
                   <div class="ml-25px text-[#2B69A1] text-35px">cm</div>
                 </div>
               </div>
             </div>
           </div>
         </div>
-        <div class=" w-90px h-90px mt-[28px] bg-[#336699] rounded-full flex items-center justify-center shadow-0-0-10px-rgba(0,0,0,0.1) relative">
+        <div class=" w-90px h-90px mt-[28px] bg-[#336699] rounded-full flex items-center justify-center shadow-0-0-10px-rgba(0,0,0,0.1) relative shrink-0 mb-50px" @click="clickAddWorks">
           <div class="absolute w-43px h-6px bg-white"></div>
           <div class="absolute w-6px h-43px bg-white"></div>
         </div>
       </div>
-      <div class="mt-43px w-600px h-98px bg-cover bg-no-repeat bg-[url('@/assets/image/dfdf1.png')] flex justify-center items-center text-white text-40px">
+      <div class="mt-43px w-600px h-98px bg-cover bg-no-repeat bg-[url('@/assets/image/dfdf1.png')] flex-center text-white text-40px shrink-0" @click="goConfirm">
         确定
       </div>
     </div>
-    <div class="absolute bottom-0 right-0">
+    <div class="absolute bottom-0 right-0 ">
       <img class="w-1170px h-557px" src="@/assets/image/dfdf4@2x.png" alt="">
     </div>
   </div>
 </template>
 
 <style scoped lang="scss">
+:deep(.van-uploader__preview){
+  margin: 0;
+}
+:deep(.van-image.van-uploader__preview-image){
+  width: 738px;
+  height: 353px;
+  border-radius: 10px;
+}
+:deep(.n-base-selection-placeholder__inner){
+  color: rgb(131, 162, 195)!important;
+}
+:deep(.n-base-selection-label){
+  height: 85px;
+  background: #DCE5E9!important;
+}
+:deep(.n-upload-file.n-upload-file--success-status.n-upload-file--image-card-type){
+
+  border:none;
+  width: 295px;
+  height: 141px;
+}
+:deep(.n-upload-trigger.n-upload-trigger--image-card){
+  border:none;
+  width: 295px;
+  height: 141px;
+}
 </style>
diff --git a/uno.config.js b/uno.config.js
index 69029ef..f794b53 100644
--- a/uno.config.js
+++ b/uno.config.js
@@ -22,4 +22,7 @@ export default defineConfig({
         // 处理 placeholder 伪元素
         [/^placeholder:(.*)$/, ([, style]) => ({ '::placeholder': { ...parseStyle(style) } })],
     ],
+    shortcuts: {
+        'flex-center': 'flex justify-center items-center',
+    },
 })