66 lines
3.1 KiB
Vue
66 lines
3.1 KiB
Vue
|
<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/dfa45@2x.png')] flex items-center flex-col">
|
||
|
|
<div class="mb-[33px] mt-[176px]">
|
||
|
|
<img class="w-[280px] h-[46px]" src="@/assets/image/zu3314@2x.png" alt="">
|
||
|
|
</div>
|
||
|
|
<div class="absolute top-0 left-[193px]">
|
||
|
|
<img class="w-[315px] h-[391px]" src="@/assets/image/gdz47@2x.png" alt="">
|
||
|
|
</div>
|
||
|
|
<div class="bg-[url('@/assets/image/zue3250@2x.png')] w-[1211px] h-[794px] bg-no-repeat bg-contain pt-[52px] pr-[137px] pl-[137px] pb-31px">
|
||
|
|
<div class="flex">
|
||
|
|
<div class="text-primary text-[19px] w-[83px] font-bold pl-15px">*姓名</div>
|
||
|
|
<div class="text-primary text-[19px]">{{formData.name}}</div>
|
||
|
|
</div>
|
||
|
|
<div class="flex mt-[15px]">
|
||
|
|
<div class="text-primary text-[19px] w-[83px] font-bold pl-15px">*年龄</div>
|
||
|
|
<div class="text-primary text-[19px]">{{formData.age}} 岁</div>
|
||
|
|
</div>
|
||
|
|
<div class="flex mt-[15px]">
|
||
|
|
<div class="text-primary text-[19px] w-[83px] font-bold pl-15px">*性别</div>
|
||
|
|
<div class="text-primary text-[19px]">{{formData.gender}}</div>
|
||
|
|
</div>
|
||
|
|
<div class="w-[936px] h-[523px] bg-#F5F5F5 mt-[8.26px] mb-20px flex pt-[15px]">
|
||
|
|
<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-19px font-bold shrink-0 w-[83px] pl-15px">*作品{{index+1}}</div>
|
||
|
|
<div>
|
||
|
|
<img class="w-[393px] h-[188px] object-contain" @click="openMask1(item.picUrl)" :src="item.picUrl" alt="">
|
||
|
|
<div class="flex text-primary text-[16px] mt-20px w-50%">
|
||
|
|
<div class="font-bold w-100px">作品名称</div>
|
||
|
|
<div class="">{{item.workName}}</div>
|
||
|
|
</div>
|
||
|
|
<div class="flex text-primary text-[16px] mt-20px">
|
||
|
|
<div class="flex w-50%">
|
||
|
|
<div class="font-bold w-100px">长度</div>
|
||
|
|
<div class="">{{item.length}} <span class="ml-16px">cm</span></div>
|
||
|
|
</div>
|
||
|
|
<div class="flex w-50% ml-a">
|
||
|
|
<div class="w-100px">宽度</div>
|
||
|
|
<div class="">{{item.wide}} <span class="ml-16px">cm</span></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
<div class="flex-center">
|
||
|
|
<div class="text-primary text-21px w-320px h-52px 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-320px h-52px bg-contain ml-29px text-21px text-#fff flex-center" @click="clickApply">确定</div>
|
||
|
|
</div>
|
||
|
|
<div class="absolute bottom-0 right-0 ">
|
||
|
|
<img class="w-876px h-385px" src="@/assets/image/dfdc46@2x.png" alt="">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<style scoped lang="scss">
|
||
|
|
|
||
|
|
</style>
|