技师管理-技师申请:增加身份证正反面、资质证书显示

This commit is contained in:
1378012178@qq.com 2025-02-11 17:25:14 +08:00
parent 5f0ddb739e
commit 8723f38b54
1 changed files with 46 additions and 0 deletions

View File

@ -55,6 +55,52 @@
</div>
</template>
</el-table-column>
<el-table-column prop="front" label="身份证正面" width="150">
<template slot-scope="scope">
<div v-if="scope.row.front == null || scope.row.front == ''">
暂无图片
</div>
<div v-if="scope.row.front" style="display:flex;flex-wrap: wrap;">
<el-popover placement="top-start" title="" trigger="hover">
<img style="width: 50px; height: 50px" :src="scope.row.front" alt=""
slot="reference">
<img style="width: auto; height: 600px" :src="scope.row.front" alt="">
</el-popover>
</div>
</template>
</el-table-column>
<el-table-column prop="back" label="身份证返面" width="150">
<template slot-scope="scope">
<div v-if="scope.row.back == null || scope.row.back == ''">
暂无图片
</div>
<div v-if="scope.row.back" style="display:flex;flex-wrap: wrap;">
<el-popover placement="top-start" title="" trigger="hover">
<img style="width: 50px; height: 50px" :src="scope.row.back" alt=""
slot="reference">
<img style="width: auto; height: 600px" :src="scope.row.back" alt="">
</el-popover>
</div>
</template>
</el-table-column>
<el-table-column prop="certification" label="资格证书" >
<template slot-scope="scope">
<div v-if="!scope.row.certification || scope.row.certification.trim() === ''">
暂无图片
</div>
<div v-else style="display:flex;flex-wrap: wrap;">
<!-- 使用split方法根据逗号分割字符串 -->
<div v-for="(src, index) in scope.row.certification.split(',')" :key="index" style="margin-right: 10px;">
<el-popover placement="top-start" title="" trigger="hover">
<!-- 展示缩略图 -->
<img style="width: 50px; height: 50px;" :src="src.trim()" alt="" slot="reference">
<!-- 放大显示 -->
<img style="width: auto; height: 600px;" :src="src.trim()" alt="">
</el-popover>
</div>
</div>
</template>
</el-table-column>
<el-table-column prop="age" label="年龄" >
</el-table-column>
<el-table-column prop="phone" label="电话" >