<!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);
|
width: 100%;
|
height: 100%;
|
}
|
|
.top {
|
width: 100%;
|
height: 250px;
|
background-color: aquamarine;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
flex-direction: column;
|
}
|
|
.avatar {
|
width: 80px;
|
height: 80px;
|
border-radius: 50px;
|
}
|
|
.avatar img {
|
width: 100%;
|
height: 100%;
|
border-radius: 50px;
|
}
|
|
.realName {
|
margin-top: 15px;
|
font-size: 16px;
|
letter-spacing: 1px;
|
}
|
|
.content {
|
margin-top: 5px;
|
width: 90%;
|
height: 500px;
|
background-color: rgba(74, 66, 98, 0.8);
|
border-radius: 5px;
|
display: flex;
|
flex-direction: column;
|
}
|
|
.row-content {
|
width: 100%;
|
height: 60px;
|
/* background-color: seashell; */
|
display: flex;
|
align-items: center;
|
/* justify-content: center; */
|
color: #fff;
|
margin: 0 auto;
|
border-bottom: 1px solid rgba(255, 255, 255, 0.5);
|
}
|
|
.title {
|
margin-left: 7%;
|
}
|
</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 class="row-content">
|
<span class="title">性别</span>
|
<span> 男</span>
|
</div>
|
<div class="row-content">
|
<span class="title">年龄</span>
|
<span> 50</span>
|
</div>
|
<div class="row-content">
|
<span class="title">保安证编号</span>
|
<span> 赣洪202100001</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");
|
// var realName = getData("realName");
|
// var age = getData("age");
|
// var sex = getData("sex");
|
// var deptName = getData("deptName");
|
// var avatar = getData("avatar");
|
// alert(securityNumber);
|
|
|
axios.get('http://223.82.109.183:2080/api/qrCode/getUserInfo?securityNumber=' + securityNumber).then(function(res) {
|
// axios.get('http://localhost:81/qrCode/getUserInfo?securityNumber=' + securityNumber).then(function(res) {
|
|
var data = res.data;
|
console.log(data, 456);
|
|
|
var str = `<div class="top">
|
<div class="avatar">
|
<img src="${data.avatar}">
|
</div>
|
<div class="realName">
|
<span>${data.realName}</span>
|
</div>
|
</div>
|
<div class="content">
|
<div class="row-content">
|
<span class="title">名称</span>
|
<span> ${data.realName}</span>
|
</div>
|
<div class="row-content">
|
<span class="title">公司名称</span>
|
<span> ${data.deptName}</span>
|
</div>
|
<div class="row-content">
|
<span class="title">性别</span>
|
<span> ${data.sex==1?'男':data.sex==2?'女':''}</span>
|
</div>
|
<div class="row-content">
|
<span class="title">年龄</span>
|
<span> ${data.age}</span>
|
</div>
|
<div class="row-content">
|
<span class="title">保安证编号</span>
|
<span> ${data.securitynumber}</span>
|
</div>
|
|
|
</div>`
|
|
var dom = $('.securityInfo');
|
dom.empty();
|
dom.append(str);
|
});
|
</script>
|
</body>
|
|
</html>
|
