<!DOCTYPE html>
|
<html lang="en">
|
<!-- 保安員信息 -->
|
|
<head>
|
<meta charset="UTF-8">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<style>
|
.securityInfo {
|
color: #000;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
flex-direction: column;
|
/* background-color: rgba(42, 66, 110, 0.8); */
|
/* background: #0ED2F7; */
|
/* fallback for old browsers */
|
/* background: -webkit-linear-gradient(to left, #B2FEFA, #0ED2F7); */
|
/* Chrome 10-25, Safari 5.1-6 */
|
/* background: linear-gradient(to left, #B2FEFA, #0ED2F7); */
|
/* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
|
width: 100%;
|
height: 100%;
|
}
|
|
.top {
|
width: 100%;
|
margin-top: 15px;
|
/* height: 224px; */
|
/* background-color: aquamarine; */
|
/* background: #0BB9C8; */
|
/* fallback for old browsers */
|
/* background: -webkit-linear-gradient(to left, #0BB9C8, #0cd9e7, #0cd9e7, #0BB9C8); */
|
/* Chrome 10-25, Safari 5.1-6 */
|
/* background: linear-gradient(to left, #0BB9C8, #0cd9e7, #0cd9e7, #0BB9C8); */
|
/* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
flex-direction: column;
|
}
|
|
.avatar {
|
width: 98%;
|
height: 140px;
|
border-radius: 1px;
|
}
|
|
.avatar img {
|
width: 100%;
|
height: 100%;
|
border-radius: 3px;
|
}
|
|
.avatar-1{
|
position: absolute;
|
right:1.8rem;
|
top: 40.5rem;
|
}
|
|
.avatar-1 img{
|
width: 7rem;
|
}
|
|
.realName {
|
margin-top: 15px;
|
font-size: 2rem;
|
letter-spacing: 1px;
|
color: #fff;
|
}
|
|
.content {
|
/* margin: 5px 0; */
|
/* padding: 5px; */
|
width: 95%;
|
/* background-color: rgba(65, 64, 66, 0.1); */
|
/* border-radius: 5px; */
|
display: flex;
|
flex-direction: column;
|
}
|
|
.row-content {
|
width: 100%;
|
height: 3.2rem;
|
/* background-color: seashell; */
|
display: flex;
|
align-items: center;
|
/* justify-content: center; */
|
color: #939393;
|
margin: 0 auto;
|
border-bottom: 1px solid rgba(220, 220, 220, 0.4);
|
}
|
|
.row-contents {
|
width: 100%;
|
height: 3.2rem;
|
/* background-color: seashell; */
|
display: flex;
|
align-items: center;
|
/* justify-content: center; */
|
color: #939393;
|
margin: 0 auto;
|
}
|
|
.row-contentss {
|
width: 100%;
|
height: 3.2rem;
|
display: flex;
|
align-items: center;
|
color: #939393;
|
margin-left: 1rem;
|
font-weight: 550;
|
font-size: 0.9rem;
|
}
|
|
.title {
|
margin-left: 4%;
|
display: inline-block;
|
width: 30%;
|
min-width: 80px;
|
font-size: 0.9rem;
|
font-weight: 550;
|
}
|
|
|
.content-data {
|
position: absolute;
|
right: 1.8rem;
|
font-size: 0.95rem;
|
}
|
.content-data-red {
|
color:red;
|
}
|
|
</style>
|
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
|
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
|
</head>
|
|
|
<body>
|
<div class="securityInfo">
|
|
<!-- <div class="top">
|
<div class="avatar">
|
<img src="./img/bazbj.png">
|
</div>
|
<div class="realName">
|
<span>張三</span>
|
</div>
|
</div>
|
<div class="content">
|
<div class="row-content">
|
<span class="title">名称</span>
|
<span> 张三</span>
|
</div>
|
<div class="row-content">
|
<span class="title">公司名称</span>
|
<span> 南昌市保安服务公司</span>
|
</div>
|
</div> -->
|
</div>
|
<script>
|
var getData = function(name) {
|
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
|
var r = window.location.search.substr(1).match(reg);
|
if (r != null) return decodeURI(r[2]);
|
return null;
|
};
|
var securityNumber = getData("securityNumber");
|
|
|
axios.get('http://61.131.136.25:2080/api/qrCode/getUserInfo?securityNumber=' + securityNumber).then(function(res) {
|
// axios.get('http://192.168.0.114:81/qrCode/getUserInfo?securityNumber=赣洪202115423').then(function(res) {
|
|
var data = res.data;
|
// console.log(data, 456);
|
//计算生日
|
var birthday = data.cardid.substring(6, 10) + "." + data.cardid.substring(10, 12) + "." + data.cardid.substring(12, 14);
|
|
//计算发证机关
|
var fzjg = "";
|
if (data.securitynumber.indexOf("赣") != -1) {
|
fzjg = "南昌市公安局"
|
}
|
|
var classRed = ""
|
//是否吊classRed销
|
if(data.examinationType=="1"){
|
classRed = "content-data-red";
|
data.securitynumber = "已吊销";
|
}
|
var str = `<div class="top">
|
<div class="avatar">
|
<img src="img/securityInfo/security.png">
|
</div>
|
</div>
|
<div class="content">
|
<div class="row-content">
|
<span class="title">姓名:</span>
|
<span class="content-data"> ${data.realName}</span>
|
</div>
|
|
<div class="row-content">
|
<span class="title">性别:</span>
|
<span class="content-data"> ${data.sex == 1 ? '男' : data.sex == 2 ? '女' : ''}</span>
|
</div>
|
|
<div class="row-content">
|
<span class="title">联系电话:</span>
|
<span class="content-data"> ${data.phone}</span>
|
</div>
|
<div class="row-content">
|
<span class="title">身份证号:</span>
|
<span class="content-data"> ${data.cardid}</span>
|
</div>
|
|
<div class="row-content">
|
<span class="title">年龄:</span>
|
<span class="content-data"> ${data.age}</span>
|
</div>
|
|
<div class="row-content">
|
<span class="title">发证机关:</span>
|
<span class="content-data"> ${fzjg}</span>
|
</div>
|
|
<div class="row-content">
|
<span class="title">保安证编号:</span>
|
<span class="content-data ${classRed}"> ${data.securitynumber}</span>
|
</div>
|
|
<div class="row-content">
|
<span class="title">公司名称:</span>
|
<span class="content-data"> ${data.deptName}</span>
|
</div>
|
<div class="row-content">
|
<span class="title">派遣单位名称:</span>
|
<span class="content-data"> ${data.dispatchUnitName}</span>
|
</div>
|
|
|
<div class="row-contentss">
|
<span class="title-1">个人照片:</span>
|
<div class="avatar-1">
|
<img src="${data.avatar}">
|
</div>
|
</div>
|
|
</div>`
|
|
var dom = $('.securityInfo');
|
dom.empty();
|
dom.append(str);
|
});
|
</script>
|
</body>
|
|
</html>
|
