202 lines
6.3 KiB
Vue
202 lines
6.3 KiB
Vue
<template>
|
|
<div class="dialog" v-if="dialogForm">
|
|
<div class="head_box">
|
|
<span>详情</span>
|
|
<div><el-button size="small" @click="close">关闭</el-button></div>
|
|
</div>
|
|
<div class="cntinfo">
|
|
<!-- 内容描述 -->
|
|
<el-descriptions class="desc" :column="3" border label-width="200px">
|
|
<el-descriptions-item label="培训项目名称">{{ detail.ssbakk }}</el-descriptions-item>
|
|
<el-descriptions-item label="培训地址">{{ detail.njnf }}</el-descriptions-item>
|
|
<el-descriptions-item label="培训开始时间">{{ detail.xm }}</el-descriptions-item>
|
|
|
|
<el-descriptions-item label="培训结束时间">{{ detail.sfzhm }}</el-descriptions-item>
|
|
<el-descriptions-item label="组织单位">{{ detail.dh }}</el-descriptions-item>
|
|
<el-descriptions-item label="培训内容">{{ detail.xb }}</el-descriptions-item>
|
|
|
|
<el-descriptions-item label="保安公司名称">{{ detail.ssbakk }}</el-descriptions-item>
|
|
<el-descriptions-item label="年审年份">{{ detail.njnf }}</el-descriptions-item>
|
|
<el-descriptions-item label="姓名">{{ detail.xm }}</el-descriptions-item>
|
|
|
|
<el-descriptions-item label="身份证号码">{{ detail.sfzhm }}</el-descriptions-item>
|
|
<el-descriptions-item label="电话">{{ detail.dh }}</el-descriptions-item>
|
|
<el-descriptions-item label="性别">{{ detail.xb }}</el-descriptions-item>
|
|
<el-descriptions-item label="民族">{{ detail.mz }}</el-descriptions-item>
|
|
<el-descriptions-item label="年龄">{{ detail.nl }}</el-descriptions-item>
|
|
<el-descriptions-item label="籍贯">{{ detail.jg }}</el-descriptions-item>
|
|
<el-descriptions-item label="文化程度">{{ detail.whcd }}</el-descriptions-item>
|
|
|
|
<el-descriptions-item label="证书编号">{{ detail.zsbh }}</el-descriptions-item>
|
|
<el-descriptions-item label="上岗证号码">{{ detail.sgxkhm }}</el-descriptions-item>
|
|
<el-descriptions-item label="服务行业"> {{ detail.fwxy }}</el-descriptions-item>
|
|
|
|
<el-descriptions-item label="服务行业名称">{{ detail.fwxymc }}</el-descriptions-item>
|
|
<el-descriptions-item label="入职时间">{{ detail.rzsj }}</el-descriptions-item>
|
|
<el-descriptions-item label="政治面貌"> {{ detail.zzmm }}</el-descriptions-item>
|
|
|
|
<el-descriptions-item label="无犯罪记录证明">
|
|
<div class="img-grid one">
|
|
<el-image
|
|
:src="baseUrl + detail.wfbjlzm"
|
|
fit="cover"
|
|
:preview-src-list='[baseUrl + detail.wfbjlzm]'
|
|
preview-teleported
|
|
class="img"
|
|
/>
|
|
</div>
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="体检报告">
|
|
<div class="img-grid one">
|
|
<el-image
|
|
:src="baseUrl + detail.tjbg"
|
|
fit="cover"
|
|
:preview-src-list='[baseUrl + detail.tjbg]'
|
|
preview-teleported
|
|
class="img"
|
|
/>
|
|
</div>
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="身份证正反面">
|
|
<div class="img-grid two">
|
|
<el-image
|
|
:src="baseUrl + detail.sfzzm"
|
|
fit="cover"
|
|
:preview-src-list='[baseUrl + detail.sfzzm]'
|
|
preview-teleported
|
|
class="img"
|
|
/>
|
|
<el-image
|
|
:src="baseUrl + detail.sfzfm"
|
|
fit="cover"
|
|
:preview-src-list='[baseUrl + detail.sfzfm]'
|
|
preview-teleported
|
|
class="img"
|
|
/>
|
|
</div>
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="发证机关">{{ detail.fqjg }}</el-descriptions-item>
|
|
<el-descriptions-item label="发证日期">{{ detail.fqsj }}</el-descriptions-item>
|
|
<el-descriptions-item label="签到状态">{{ detail.qdzt }}</el-descriptions-item>
|
|
<el-descriptions-item label="签到时间" :span="2">{{ detail.qdsj }}</el-descriptions-item>
|
|
<el-descriptions-item label="签到表" :span="3"></el-descriptions-item>
|
|
<el-descriptions-item label="培训图片" :span="3"></el-descriptions-item>
|
|
</el-descriptions>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, computed, defineEmits, getCurrentInstance,defineProps } from 'vue';
|
|
import { qcckPost } from "@/api/qcckApi.js";
|
|
const emit = defineEmits(["refresh"]);
|
|
const { proxy } = getCurrentInstance();
|
|
const baseUrl = '/bagl/mosty-base/minio/image/download'
|
|
const props = defineProps({
|
|
dic: {
|
|
default: [[]], //二维数组
|
|
type: Array
|
|
}
|
|
})
|
|
|
|
const dialogForm = ref(false);
|
|
const detail = ref({})
|
|
|
|
// 初始化数据
|
|
const init = (type, row,) => {
|
|
// dialogForm.value = true;
|
|
// qcckPost({},'/mosty-base/bans/njxx/getInfo/'+row.id).then(res => {
|
|
// let zj = res.sfzzfmj.split(',');
|
|
// res.sfzzm = [zj[0]];
|
|
// res.sfzfm = [zj[1]];
|
|
// detail.value = res || {};
|
|
// })
|
|
};
|
|
|
|
const close = () => {
|
|
dialogForm.value = false;
|
|
detail.value = {};
|
|
};
|
|
|
|
defineExpose({ init })
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
@import "@/assets/css/layout.scss";
|
|
.mapBox {
|
|
width: calc(100% - 24rem);
|
|
height: 500px;
|
|
overflow: hidden;
|
|
margin: 0 12rem;
|
|
}
|
|
.cntinfo{
|
|
position: relative;
|
|
padding: 10px 20px;
|
|
box-sizing: border-box;
|
|
.tag-box{
|
|
position: absolute;
|
|
top: 20px;
|
|
right: 50px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 10px;
|
|
z-index: 99999;
|
|
.tag_item{
|
|
width: 70px;
|
|
height: 70px;
|
|
border-radius: 50%;
|
|
line-height: 65px;
|
|
text-align: center;
|
|
font-size: 16px;
|
|
margin-bottom: 20px;
|
|
}
|
|
.jtb_item{
|
|
border: 5px solid #FA3758;
|
|
color: #FA3758;
|
|
background: rgba(250,55,88,0.2);
|
|
}
|
|
.tgg_item{
|
|
color: #28EEBF;
|
|
background: rgba(40,238,191,0.2);
|
|
border: 5px solid #28EEBF;
|
|
}
|
|
.dsh_item{
|
|
background: rgba(0,114,255,0.2);
|
|
color: #0072FF;
|
|
border: 5px solid #0072FF;
|
|
}
|
|
}
|
|
}
|
|
|
|
.desc {
|
|
width: 100%;
|
|
}
|
|
|
|
.img-grid {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
min-height: 70px;
|
|
}
|
|
|
|
.img-grid.one .img,
|
|
.img-grid.one .img-placeholder {
|
|
width: 64px;
|
|
height: 64px;
|
|
}
|
|
|
|
.img-grid.two .img,
|
|
.img-grid.two .img-placeholder {
|
|
width: 64px;
|
|
height: 64px;
|
|
}
|
|
|
|
.img-placeholder {
|
|
background: #d9d9d9;
|
|
border-radius: 2px;
|
|
}
|
|
::v-deep .el-descriptions__label.el-descriptions__cell.is-bordered-label{
|
|
background: #F6FAFF;
|
|
}
|
|
</style>
|