11 changed files with 123 additions and 253 deletions
Before Width: | Height: | Size: 277 KiB |
After Width: | Height: | Size: 197 KiB |
Before Width: | Height: | Size: 33 KiB |
Before Width: | Height: | Size: 30 KiB |
@ -1,202 +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>欢迎使用预包装食品标签合规性核验系统</title> |
|||
<script src="jquery.min.js"></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('bg-scanCode.png'); |
|||
background-repeat: no-repeat; |
|||
background-size: 100% 100%; |
|||
} |
|||
.content-block { |
|||
position: relative; |
|||
margin-top: 42vh; |
|||
width: 320px; |
|||
width: 93.5%; |
|||
color: #fff; |
|||
} |
|||
.content-box { |
|||
position: relative; |
|||
top:0; |
|||
width: 100%; |
|||
min-height: 200px; |
|||
padding: 15px; |
|||
margin-bottom: 15px; |
|||
word-wrap:break-word; |
|||
background: #FFFFFF; |
|||
border-radius: 10px; |
|||
box-shadow: 0px 4px 20px 0px rgba(65, 194, 252, 0.14), 0px 7px 13px 0px rgba(50, 147, 255, 0.52); |
|||
} |
|||
.content-box .content-title{ |
|||
margin-bottom: 8px; |
|||
font-size: 20px; |
|||
font-weight: 400; |
|||
color: #1F5C99; |
|||
line-height: 54px; |
|||
border-bottom: 1px dashed #D2E1EA; |
|||
} |
|||
.content-box .content-text { |
|||
font-size: 16px; |
|||
line-height: 44px; |
|||
color: #666666; |
|||
border-bottom: 1px dashed #D2E1EA; |
|||
overflow: hidden; |
|||
} |
|||
.content-box .content-text label{ |
|||
line-height: 30px; |
|||
font-weight: normal; |
|||
vertical-align: top; |
|||
} |
|||
.content-box .content-text span{ |
|||
display: block; |
|||
float: right; |
|||
width: 70%; |
|||
line-height: 30px; |
|||
color: #222222; |
|||
text-align: right; |
|||
} |
|||
.content-box .content-text span img{ |
|||
width: 70px; |
|||
height: 60px; |
|||
margin: 8px 0 0 8px; |
|||
border-radius: 10px; |
|||
} |
|||
.content-box .content-pdf{ |
|||
margin-top: 15px; |
|||
} |
|||
.content-box .content-pdf a{ |
|||
display: block; |
|||
margin: 12px 0; |
|||
font-size: 12px; |
|||
color:#3293FF; |
|||
} |
|||
.content-box .content-btn{ |
|||
margin-top: 70px; |
|||
} |
|||
.content-box .content-btn a{ |
|||
display: block; |
|||
width: 100%; |
|||
padding: 15px 0; |
|||
margin-bottom: 25px; |
|||
font-size: 18px; |
|||
color: #FFFFFF; |
|||
text-align: center; |
|||
text-decoration: none; |
|||
background: #30E3D8; |
|||
border-radius: 80px; |
|||
} |
|||
.content-box .content-btn a.btn-register{ |
|||
background: #3293FF; |
|||
} |
|||
.text-indent-1 { |
|||
text-indent:1em; |
|||
} |
|||
</style> |
|||
<body> |
|||
<div class="search-container flex-box-column"> |
|||
<div id="data"></div> |
|||
<div class="content-block"> |
|||
<div class="content-box"> |
|||
<h3 class="content-title">产品信息</h3> |
|||
<div class="content-info" id="content-info"> |
|||
|
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</body> |
|||
<script> |
|||
var code = ''; |
|||
var str = window.location.href.split('?')[1]; |
|||
var baseUrlIp = "http://172.119.51.195:8080"; |
|||
function productInfo(){ |
|||
$.ajax({ |
|||
url: baseUrlIp + "/company/standard/fetch/" + str, |
|||
type: "get", // 请求方式get / post |
|||
dataType: "json", // 数据类型 |
|||
// 请求成功后的回调函数 |
|||
success: function(res) { |
|||
if(res.code == 200){ |
|||
// data后台返回来的数据 |
|||
var html = ''; |
|||
var picHtml = ''; |
|||
var fileHtml = ''; |
|||
// 包装图片 |
|||
var pics = res.data.standard.productImgUrl.split(',') |
|||
for (var i = 0; i < pics.length; i++) { |
|||
picHtml +='<img src='+ pics[i] +'/>' |
|||
} |
|||
// 文件 |
|||
for (var i = 0; i < res.data.fileList.length; i++) { |
|||
fileHtml +='<a href='+ res.data.fileList[i].fileUrl+'>'+ res.data.fileList[i].fileName +'</a>' |
|||
} |
|||
html +='<p class="content-text"><label>产品名称:</label><span id="product_name">'+ res.data.standard.productName +'</span></p>' |
|||
+'<p class="content-text"><label>包装图片:</label><span id="product_pics">'+ picHtml +'</span></p>' |
|||
+'<p class="content-text"><label>包装标准:</label><span id="product_standard">'+ res.data.standard.ybzStandard +'</span></p>' |
|||
+'<p class="content-text"><label>营养成分:</label><span id="product_nutrients">'+ res.data.standard.nutrients +'</span></p>' |
|||
+'<div class="content-pdf" id="product_pdfs">'+ fileHtml +'</div>'; |
|||
} else { |
|||
html +='<span style="color:#000;">该产品码无效</span>'; |
|||
} |
|||
// append 结尾插入内容 |
|||
$('#content-info').append(html); |
|||
}, |
|||
error: function(err) { |
|||
console.log(err); |
|||
} |
|||
}); |
|||
} |
|||
productInfo() |
|||
</script> |
|||
</html> |
Loading…
Reference in new issue