| New file |
| | |
| | | <!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> |