2 changed files with 101 additions and 294 deletions
@ -1,278 +0,0 @@ |
|||
<!DOCTYPE html> |
|||
<html lang="en"> |
|||
<head> |
|||
<meta charset="UTF-8"> |
|||
<meta http-equiv="X-UA-Compatible" content="IE=edge"> |
|||
<meta name="viewport" content="width=device-width,initial-scale=1.0"> |
|||
<link rel="icon" href="./favicon.ico"> |
|||
<title id="sys_title">欢迎使用牛栏山二锅头防伪查询系统</title> |
|||
<script src="./fwm/jquery.min.js"></script> |
|||
<script src="./config.js"></script> |
|||
<!-- <script type="text/javascript" src="https://api.map.baidu.com/api?v=1.0&&type=webgl&ak=Di3uzrPoRAPKso8IAbBG138RUwBTIWbR"></script> --> |
|||
<script type="text/javascript" src="https://api.map.baidu.com/api?v=3.0&ak=Di3uzrPoRAPKso8IAbBG138RUwBTIWbR"></script> |
|||
</head> |
|||
<style> |
|||
html,body,h1,h2,h3,h4,h5,h6,div,dl,dt,dd,ul,ol,li,p,blockquote,pre,hr,figure,table,caption,th,td,form,fieldset,legend,input,button,textarea,menu { |
|||
margin: 0; |
|||
padding: 0; |
|||
} |
|||
body { |
|||
height: 100%; |
|||
-moz-osx-font-smoothing: grayscale; |
|||
-webkit-font-smoothing: antialiased; |
|||
text-rendering: optimizeLegibility; |
|||
font-family: Helvetica Neue, Helvetica, Arial, Microsoft Yahei, Hiragino Sans GB, Heiti SC, WenQuanYi Micro Hei, sans-serif; |
|||
} |
|||
|
|||
label { |
|||
font-weight: 700; |
|||
} |
|||
|
|||
html { |
|||
height: 100%; |
|||
box-sizing: border-box; |
|||
} |
|||
*, |
|||
*:before, |
|||
*:after { |
|||
box-sizing: inherit; |
|||
} |
|||
.flex-box { |
|||
display: -webkit-box; |
|||
display: -webkit-flex; |
|||
/* Safari */ |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
} |
|||
.flex-box-column { |
|||
display: -webkit-box; |
|||
display: -webkit-flex; |
|||
/* Safari */ |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
flex-direction: column; |
|||
} |
|||
.search-container { |
|||
position: relative; |
|||
width: 100vw; |
|||
min-height: 100%; |
|||
background-image: url('./fwm/img/search-bg.png'); |
|||
background-repeat: no-repeat; |
|||
background-size: 100% 100%; |
|||
} |
|||
.content-block { |
|||
position: relative; |
|||
margin-top: 42vh; |
|||
width: 320px; |
|||
color: #fff; |
|||
} |
|||
.content-block .title { |
|||
font-size: 18px; |
|||
line-height: 30px; |
|||
} |
|||
.content-box { |
|||
position: relative; |
|||
top:5px; |
|||
width: 100%; |
|||
min-height: 200px; |
|||
background: #fff; |
|||
border-radius: 20px; |
|||
padding: 15px; |
|||
word-wrap:break-word; |
|||
/* font-weight: 550; */ |
|||
} |
|||
.content-box .content-text { |
|||
font-size: 14px; |
|||
line-height: 30px; |
|||
color: #000000; |
|||
} |
|||
.content-box .num-text { |
|||
font-size: 12px; |
|||
text-align: center; |
|||
line-height: 30px; |
|||
color: #C02932; |
|||
} |
|||
.text-indent-1 { |
|||
text-indent:1em |
|||
} |
|||
.aplayer-block { |
|||
position: relative; |
|||
/* bottom: 20px; */ |
|||
margin: 20px 0; |
|||
width: 100%; |
|||
height: 50px; |
|||
/* background: #fff; */ |
|||
border-radius: 25px; |
|||
} |
|||
.aplayer-block audio { |
|||
width: 100%; |
|||
} |
|||
.nla-public { |
|||
position: absolute; |
|||
right: 15px; |
|||
width: 80px; |
|||
height: 80px; |
|||
bottom: 10px; |
|||
|
|||
} |
|||
</style> |
|||
<body> |
|||
<div class="search-container flex-box-column"> |
|||
<div class="content-block"> |
|||
|
|||
<p class="title text-indent-1">查询结果:</p> |
|||
<div class="content-box"> |
|||
<div id="patch" style="display: none;"> |
|||
<img src="./fwm/img/nls.jpg" class="nla-public"> |
|||
<p class="content-text">尊敬的客户您好!</p> |
|||
<p class="content-text text-indent-1">您所查询的商品编码为:</p> |
|||
<p class="num-text" id="gyhl_code"></p> |
|||
<p class="content-text text-indent-1">您查询的是由"北京顺鑫农业股份有限公司牛栏山酒厂"生产的正牌产品,请放心使用,谢谢您的查询。</p> |
|||
<br> |
|||
<p class="content-text">查询次数:<span id="scan_count"></span>,首次查询时间为:<br> <span id="first_scan" style="color:#C02932;"></span></p> |
|||
</div> |
|||
<div id="noFound" style="display: none;"> |
|||
<p class="content-text text-indent-1" style="color:red;font-size: 18px;">您所查询的商品不存在!</p> |
|||
</div> |
|||
</div> |
|||
<div class="aplayer-block" id="aplayerBlock" style="display: none;"> |
|||
<audio id="play1" controls="controls" > |
|||
<source id="audioSource" src=""></source> |
|||
</audio> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</body> |
|||
|
|||
<script> |
|||
function checkSocureData(posParam) { |
|||
let param = window.location.href.split('?')[1] || '' |
|||
if(param&&posParam.lat&&posParam.lng&&posParam.address) |
|||
{ |
|||
$.ajax({ |
|||
url: config.API_URL+"/scan/code/"+encodeURIComponent(param)+"/"+encodeURIComponent(posParam.lng)+"/"+encodeURIComponent(posParam.lat)+"/"+encodeURIComponent(posParam.address), |
|||
type: "GET", |
|||
dataType: "json", |
|||
success: function(res) { |
|||
if(res.code == 200) |
|||
{ |
|||
$("#patch").show() |
|||
$("#aplayerBlock").show() |
|||
|
|||
$("#gyhl_code").text(res.data.gyhl_code) |
|||
$("#scan_count").text(res.data.scan_count) |
|||
$("#first_scan").text(res.data.first_scan) |
|||
|
|||
let url = config.API_URL + res.data.url |
|||
$('#play1').attr('src',url) |
|||
var fry_audio=$('#play1').get('0'); |
|||
fry_audio.load() |
|||
|
|||
// createAudioMP3(res.data.gyhl_code) |
|||
} else { |
|||
$("#noFound").show() |
|||
} |
|||
}, |
|||
error: function(err) { |
|||
console.log(err); |
|||
} |
|||
}); |
|||
} |
|||
} |
|||
|
|||
//获取地址信息,设置地址label |
|||
function getAddress(point){ |
|||
let params = {} |
|||
params.lat = point.lat |
|||
params.lng = point.lng |
|||
var gc = new BMap.Geocoder(); |
|||
gc.getLocation(point, function(rs){ |
|||
var addComp = rs.addressComponents; |
|||
var address = addComp.province + addComp.city + addComp.district + addComp.street + addComp.streetNumber;//获取地址 |
|||
params.address = address |
|||
checkSocureData(params) |
|||
console.log(params); |
|||
}); |
|||
|
|||
} |
|||
//错误类型 |
|||
function handleError(value) { |
|||
switch (value) { |
|||
case 1: |
|||
alert("位置服务被拒绝"); |
|||
break; |
|||
case 2: |
|||
alert("暂时获取不到位置信息"); |
|||
break; |
|||
case 3: |
|||
alert("获取信息超时"); |
|||
break; |
|||
case 4: |
|||
alert("未知错误"); |
|||
break; |
|||
} |
|||
} |
|||
//浏览器定位 |
|||
function getCurrentPosition () { |
|||
var geolocation = new BMap.Geolocation(); |
|||
geolocation.getCurrentPosition(function(r){ |
|||
if(this.getStatus() == BMAP_STATUS_SUCCESS){ |
|||
// if(r.accuracy==null){ |
|||
// handleError(1) |
|||
// //用户决绝地理位置授权 |
|||
// return; |
|||
// } |
|||
mk = new BMap.Marker(r.point); |
|||
// alert(r.point.lat+';'+r.point.lng) |
|||
getAddress(r.point); |
|||
}else { |
|||
handleError(this.getStatus()) |
|||
} |
|||
}); |
|||
} |
|||
window.onload=function(){ |
|||
getCurrentPosition() |
|||
|
|||
|
|||
//IP定位 |
|||
// var map = new BMap.Map("allmap"); |
|||
// var point = new BMap.Point(116.331398,39.897445); |
|||
// map.centerAndZoom(point,12); |
|||
|
|||
// function myFun(result){ |
|||
// var cityName = result.name; |
|||
// map.setCenter(cityName); |
|||
// alert("当前定位城市:"+cityName); |
|||
// } |
|||
// var myCity = new BMap.LocalCity(); |
|||
// myCity.get(myFun); |
|||
|
|||
//浏览器定位 |
|||
// var map = new BMap.Map("allmap"); |
|||
// var point = new BMap.Point(116.331398,39.897445); |
|||
// map.centerAndZoom(point,12); |
|||
// var geolocation = new BMap.Geolocation(); |
|||
// geolocation.getCurrentPosition(function(r){ |
|||
// if(this.getStatus() == BMAP_STATUS_SUCCESS){ |
|||
// if(r.accuracy==null){ |
|||
// handleError(1) |
|||
// //用户决绝地理位置授权 |
|||
// return; |
|||
// } |
|||
// // var mk = new BMap.Marker(r.point); |
|||
// // map.addOverlay(mk); |
|||
// // map.panTo(r.point); |
|||
// // alert('您的位置:'+r.point.lng+','+r.point.lat); |
|||
// } |
|||
// else { |
|||
// // alert('failed:'+this.getStatus()); |
|||
// handleError(this.getStatus()) |
|||
// } |
|||
// },handleError); |
|||
|
|||
} |
|||
</script> |
|||
|
|||
</html> |
Loading…
Reference in new issue