修改茶艺师相关的UI

This commit is contained in:
wangxiaowei
2026-04-30 17:51:28 +08:00
parent b1711be66b
commit 3a95965564
4 changed files with 497 additions and 181 deletions

View File

@ -70,21 +70,14 @@
:preview-src-list="[formData.avatar]" fit="cover" />
<div v-else class="image-placeholder">未上传</div>
</div>
<div class="image-item">
<div class="image-label">茶艺师资格证书</div>
<el-image v-if="formData.license_img"
style="width: 120px; height: 120px; border-radius: 8px"
:src="formData.license_img" :zoom-rate="1.2" :max-scale="7" :min-scale="0.2"
:preview-src-list="[formData.license_img]" fit="cover" />
<div v-else class="image-placeholder">未上传</div>
</div>
</div>
<div class="image-grid mt-4">
<div class="image-item">
<div class="image-label">身份证正面</div>
<el-image v-if="formData.front_card"
style="width: 120px; height: 120px; border-radius: 8px"
:src="formData.front_card" :zoom-rate="1.2" :max-scale="7" :min-scale="0.2"
:preview-src-list="[formData.front_card]" fit="cover" />
:preview-src-list="[formData.front_card]" fit="cover" preview-teleported />
<div v-else class="image-placeholder">未上传</div>
</div>
<div class="image-item">
@ -92,7 +85,17 @@
<el-image v-if="formData.back_card"
style="width: 120px; height: 120px; border-radius: 8px"
:src="formData.back_card" :zoom-rate="1.2" :max-scale="7" :min-scale="0.2"
:preview-src-list="[formData.back_card]" fit="cover" />
:preview-src-list="[formData.back_card]" fit="cover" preview-teleported />
<div v-else class="image-placeholder">未上传</div>
</div>
</div>
<div class="image-grid mt-4">
<div class="image-item">
<div class="image-label">茶艺师资格证书</div>
<el-image v-if="formData.license_img"
style="width: 120px; height: 120px; border-radius: 8px"
:src="formData.license_img" :zoom-rate="1.2" :max-scale="7" :min-scale="0.2"
:preview-src-list="[formData.license_img]" fit="cover" preview-teleported />
<div v-else class="image-placeholder">未上传</div>
</div>
<div class="image-item">
@ -100,8 +103,8 @@
<el-image v-if="formData.health_certificate"
style="width: 120px; height: 120px; border-radius: 8px"
:src="formData.health_certificate" :zoom-rate="1.2" :max-scale="7"
:min-scale="0.2" :preview-src-list="[formData.health_certificate]"
fit="cover" />
:min-scale="0.2" :preview-src-list="[formData.health_certificate]" fit="cover"
preview-teleported />
<div v-else class="image-placeholder">未上传</div>
</div>
</div>
@ -120,12 +123,7 @@
<div v-for="(item, index) in formData.image" :key="index" class="gallery-item">
<el-image style="width: 150px; height: 150px; border-radius: 8px" :src="item"
:zoom-rate="1.2" :max-scale="7" :min-scale="0.2" :preview-src-list="formData.image"
:initial-index="index" fit="cover" class="gallery-image" />
<div class="gallery-overlay">
<el-icon>
<ZoomIn />
</el-icon>
</div>
:initial-index="index" fit="cover" class="gallery-image" preview-teleported />
</div>
</div>
<el-empty v-else description="暂无个人展示照片" :image-size="80" />