Fam Zheng
@ -1,6 +0,0 @@
|
||||
.PHONY: FORCE
|
||||
blue.zip green.zip: FORCE
|
||||
for c in blue green; do \
|
||||
cp template/$$c.html template/index.html; \
|
||||
(cd template && zip -r ../$$c *); \
|
||||
done
|
||||
|
Before Width: | Height: | Size: 3.6 KiB |
|
Before Width: | Height: | Size: 9.7 KiB |
|
Before Width: | Height: | Size: 4.4 KiB |
|
Before Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 3.5 KiB |
|
Before Width: | Height: | Size: 9.4 KiB |
|
Before Width: | Height: | Size: 4.6 KiB |
|
Before Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 4.3 KiB |
|
Before Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 113 KiB |
|
Before Width: | Height: | Size: 208 KiB |
|
Before Width: | Height: | Size: 356 KiB |
|
Before Width: | Height: | Size: 318 KiB |
|
Before Width: | Height: | Size: 3.0 KiB |
|
Before Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 58 KiB |
|
Before Width: | Height: | Size: 39 KiB |
|
Before Width: | Height: | Size: 191 B |
|
Before Width: | Height: | Size: 1.7 KiB |
|
Before Width: | Height: | Size: 1.5 KiB |
|
Before Width: | Height: | Size: 1.8 KiB |
|
Before Width: | Height: | Size: 1.7 KiB |
|
Before Width: | Height: | Size: 1.5 KiB |
|
Before Width: | Height: | Size: 1.3 KiB |
|
Before Width: | Height: | Size: 1.5 KiB |
|
Before Width: | Height: | Size: 1.4 KiB |
|
Before Width: | Height: | Size: 4.4 KiB |
|
Before Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 96 KiB |
|
Before Width: | Height: | Size: 89 KiB |
|
Before Width: | Height: | Size: 665 B |
|
Before Width: | Height: | Size: 901 B |
|
Before Width: | Height: | Size: 104 KiB |
|
Before Width: | Height: | Size: 170 KiB |
|
Before Width: | Height: | Size: 196 KiB |
|
Before Width: | Height: | Size: 88 KiB |
|
Before Width: | Height: | Size: 187 KiB |
|
Before Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 39 KiB |
|
Before Width: | Height: | Size: 22 KiB |
|
Before Width: | Height: | Size: 116 KiB |
|
Before Width: | Height: | Size: 116 KiB |
|
Before Width: | Height: | Size: 110 KiB |
@ -1,407 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
|
||||
<link rel="stylesheet" type="text/css" href="css/vant.css" />
|
||||
<!--<link rel="stylesheet" href="../../js/mz/font-awesome-4.7.0/css/font-awesome.css" />-->
|
||||
|
||||
<title>loading...</title>
|
||||
<style type="text/css">
|
||||
body,
|
||||
html {
|
||||
|
||||
font-size: .5rem;
|
||||
color: #878787;
|
||||
}
|
||||
|
||||
img {
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
img,
|
||||
div {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
max-width: 500px;
|
||||
margin: 0 auto;
|
||||
background-color: #33a243;
|
||||
}
|
||||
|
||||
.main {
|
||||
position: relative;
|
||||
width: 13rem;
|
||||
height: 88vh;
|
||||
padding: .7rem;
|
||||
margin-top: .8rem;
|
||||
margin-left: .5rem;
|
||||
background-color: #ededed;
|
||||
border-radius: .5rem 0 .5rem .5rem;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
|
||||
.main .cd {
|
||||
height: calc(100% - .5rem);
|
||||
box-sizing: border-box;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.main .cd img {
|
||||
width: 100%;
|
||||
margin-top: .3rem;
|
||||
}
|
||||
|
||||
.fw_box {
|
||||
position: relative;
|
||||
padding: 0 .2rem;
|
||||
}
|
||||
|
||||
.fw_box .row {
|
||||
position: absolute;
|
||||
bottom: 20px;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.fw_box .row .row-left {
|
||||
width: 30%;
|
||||
padding: 0 0 0 5px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.fw_box .row .row-right {
|
||||
padding: 18px 0 0 5px;
|
||||
text-align: left;
|
||||
width: 70%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.fw_box .row .row-right .code {
|
||||
line-height: 10px;
|
||||
font-size: 8px;
|
||||
}
|
||||
|
||||
.fw_box .row .row-right .quality {
|
||||
line-height: 15px;
|
||||
font-size: 12px;
|
||||
color: green;
|
||||
}
|
||||
|
||||
.fw_box .row .row-right .product {
|
||||
line-height: 10px;
|
||||
font-size: 8px;
|
||||
}
|
||||
|
||||
.fw_box img.product-image {
|
||||
}
|
||||
|
||||
.main .cd .tab1_4 {
|
||||
width: 7rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.main .cd .tab1_5 {
|
||||
padding: 0 .5rem;
|
||||
}
|
||||
|
||||
.line {
|
||||
display: flex;
|
||||
margin-bottom: .3rem;
|
||||
}
|
||||
|
||||
.line>div:first-child {
|
||||
margin-right: .2rem;
|
||||
flex-shrink: 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.line2 {
|
||||
text-align: center;
|
||||
margin-bottom: .2rem;
|
||||
color: #afafaf;
|
||||
}
|
||||
|
||||
.center {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.sy_msg {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.sy_msg .address {
|
||||
position: absolute;
|
||||
top: 10.4rem;
|
||||
left: .3rem;
|
||||
width: 10.5rem;
|
||||
height: 6rem;
|
||||
/* background-color: violet;
|
||||
opacity: .6; */
|
||||
}
|
||||
|
||||
.pb20 {
|
||||
margin-bottom: .2rem;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.right {
|
||||
position: relative;
|
||||
left: -0.05rem;
|
||||
width: calc(100% - 13rem);
|
||||
height: 90vh;
|
||||
box-sizing: border-box;
|
||||
margin-top: .8rem;
|
||||
padding-right: .6rem;
|
||||
}
|
||||
|
||||
.right .item {
|
||||
width: 100%;
|
||||
margin-bottom: .3rem;
|
||||
}
|
||||
|
||||
.right .item img {
|
||||
width: 100%;
|
||||
padding-left: .2rem;
|
||||
}
|
||||
|
||||
.right .item .active {
|
||||
background-color: #ededed;
|
||||
border-radius: 0 .3rem .3rem 0;
|
||||
}
|
||||
|
||||
.map_item {
|
||||
height: 2rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.map_item1 {
|
||||
height: 2.5rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-top: .5rem solid #F4F4F4;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
[v-cloak] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.bottom_icon {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 100%;
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
.border-bottom {
|
||||
border-bottom: 1px solid #d4d4d4;
|
||||
}
|
||||
|
||||
.padding_all_30 {
|
||||
padding: .3rem;
|
||||
}
|
||||
|
||||
.padding_rl_30 {
|
||||
padding-left: .3rem;
|
||||
padding-right: .3rem;
|
||||
}
|
||||
.separator {
|
||||
width: 53px !important;
|
||||
height: 2px !important;
|
||||
margin: 20px auto !important;
|
||||
display: block;
|
||||
}
|
||||
.content-section {
|
||||
border-bottom: 1px dotted #666;
|
||||
margin-bottom: 10px;
|
||||
padding: 0 0 10px 10px;
|
||||
}
|
||||
.content-section .title {
|
||||
color: #aaa;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.w-70 {
|
||||
width: 80% !important;
|
||||
}
|
||||
.mx-auto {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
.brand-info-title {
|
||||
margin: 18px 0;
|
||||
display: block;
|
||||
text-align: center;
|
||||
font-size: 0.6rem;
|
||||
font-weight: bold;
|
||||
color: #555;
|
||||
}
|
||||
img.icon {
|
||||
margin: 0 3px 0 0 !important;
|
||||
width: 10px !important;
|
||||
height: 13px !important;
|
||||
}
|
||||
div.indented {
|
||||
padding-left: 16px;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container" id="app" v-cloak>
|
||||
<img src="./images/green_bottom.png" alt="" class="bottom_icon" />
|
||||
<div class="main">
|
||||
<div class="cd" v-if="active==0" style="text-align: center;">
|
||||
<div class="fw_box">
|
||||
<img src="./images/head-bg-1.png" />
|
||||
<div class="row">
|
||||
<div class="row-left">
|
||||
<img class="product-image" :src="get_property('产品图片')" />
|
||||
</div>
|
||||
<div class="row-right">
|
||||
<div class="product">
|
||||
{{ info.product }}
|
||||
</div>
|
||||
<div class="quality">
|
||||
通过了QBS4000质量评价
|
||||
</div>
|
||||
<div class="code">溯源编码:{{code}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<img src="./images/green-dashed-separator.png" class="separator" />
|
||||
<img src="./images/general-info.png" class="general-info" />
|
||||
</div>
|
||||
<div class="cd" v-if="active==1">
|
||||
<img :src="get_property('产品图片')" class="w-70 mx-auto" @click="showImg" />
|
||||
<img src="./images/green-dashed-separator.png" class="separator" />
|
||||
<div class="content-section">
|
||||
<div class="title">
|
||||
产品名称 / Product name
|
||||
</div>
|
||||
<div class="content">
|
||||
{{ info.product }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="content-section">
|
||||
<div class="title">
|
||||
产品型号 / Product model
|
||||
</div>
|
||||
<div class="content">
|
||||
{{ get_property('产品型号') }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="content-section">
|
||||
<div class="title">
|
||||
产品类别 / Product Category
|
||||
</div>
|
||||
<div class="content">
|
||||
{{ get_property('产品类别') }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="padding_all_30" style="margin-top: .2rem;">
|
||||
</div>
|
||||
</div>
|
||||
<div class="cd" v-if="active==2">
|
||||
<img src="./images/cert-1.png" />
|
||||
<img src="./images/green-dashed-separator.png" class="separator" />
|
||||
<img :src="get_property('检测报告')" @click="showImg" />
|
||||
<img src="./images/green-dashed-separator.png" class="separator" />
|
||||
<div class="center">
|
||||
点击查看完整检测报告
|
||||
</div>
|
||||
</div>
|
||||
<div class="cd" v-if="active==3">
|
||||
<div class="content-section">
|
||||
<div class="title">
|
||||
<img src="images/house-icon.png" class="icon" alt=""/>
|
||||
生产企业 / manufacturing enterprise
|
||||
</div>
|
||||
<div class="content indented">
|
||||
{{ get_property('生产企业') }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="content-section">
|
||||
<div class="title">
|
||||
<img src="images/pos-icon.png" class="icon" alt=""/>
|
||||
生产地址 / production address
|
||||
</div>
|
||||
<div class="content indented">
|
||||
{{ get_property('生产地址') }}
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<img src="./images/green-dashed-separator.png" class="separator" />
|
||||
<img :src="get_property('位置图片')" @click="openAddress" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="cd" v-if="active==4">
|
||||
<div class="content-section">
|
||||
<div class="brand-info-title">
|
||||
正规企业信用信息
|
||||
</div>
|
||||
<img :src="get_property('营业执照')" @click="showImg" />
|
||||
<img src="./images/green-dashed-separator.png" class="separator" />
|
||||
<div class="center">
|
||||
点击查看完整企业信息
|
||||
</div>
|
||||
</div>
|
||||
<div class="content-section">
|
||||
<div class="brand-info-title">
|
||||
商标注册信息
|
||||
</div>
|
||||
<img :src="get_property('商标信息')" @click="showImg" />
|
||||
<img src="./images/green-dashed-separator.png" class="separator" />
|
||||
<div class="center">
|
||||
点击查看完整商标信息
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="right">
|
||||
<div class="item" v-for="(item,index) in btns" @click="changeBtn(index)">
|
||||
<img :src="item.img1" v-if="index!==active">
|
||||
<img :src="item.img" v-if="index===active" class="active">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<van-action-sheet v-model="mapShow" title="">
|
||||
<div class="map_content">
|
||||
<div class="map_item" @click="getMapApp('腾讯地图')">腾讯地图</div>
|
||||
<div class="map_item1" @click="mapShow=false">取消</div>
|
||||
</div>
|
||||
</van-action-sheet>
|
||||
</div>
|
||||
</body>
|
||||
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
|
||||
<script src="js/vue.min.js"></script>
|
||||
<script src="js/vant.min.js"></script>
|
||||
<script src="js/rem.js"></script>
|
||||
<script type="text/javascript" src="js/url.js"></script>
|
||||
<script type="text/javascript">
|
||||
$(function() {
|
||||
loadJS('js/green.js');
|
||||
})
|
||||
</script>
|
||||
</html>
|
||||
@ -1,67 +0,0 @@
|
||||
const app = new Vue({
|
||||
el: "#app",
|
||||
data: {
|
||||
active: 0,
|
||||
info: {},
|
||||
btns: [{
|
||||
img: './images/blue/rzicon1.png',
|
||||
img1: './images/blue/rzicon2.png'
|
||||
},
|
||||
{
|
||||
img: './images/blue/cpicon1.png',
|
||||
img1: './images/blue/cpicon2.png'
|
||||
},
|
||||
{
|
||||
img: './images/blue/jcicon1.png',
|
||||
img1: './images/blue/jcicon2.png'
|
||||
},
|
||||
{
|
||||
img: './images/blue/syicon1.png',
|
||||
img1: './images/blue/syicon2.png'
|
||||
},
|
||||
{
|
||||
img: './images/blue/ppicon1.png',
|
||||
img1: './images/blue/ppicon2.png'
|
||||
},
|
||||
],
|
||||
},
|
||||
created() {
|
||||
},
|
||||
mounted() {
|
||||
this.reload();
|
||||
},
|
||||
methods: {
|
||||
async reload() {
|
||||
var code = 123;
|
||||
var url = "https://dev.themblem.com/api/product-info/" + code + "/api/properties";
|
||||
url = 'http://localhost:8000/api/product-info/c3170586095/api/properties/';
|
||||
var r = await fetch(url);
|
||||
var info = await r.json();
|
||||
console.log(info);
|
||||
this.info = info;
|
||||
},
|
||||
changeBtn(index) {
|
||||
this.active = index
|
||||
},
|
||||
goDetails(index) {
|
||||
location.href = "img_details.html?index=" + index
|
||||
},
|
||||
goPageZfsy() {
|
||||
// location.href=this.zfsy_url
|
||||
},
|
||||
showImg(e) {
|
||||
let url = e.currentTarget.dataset.url
|
||||
vant.ImagePreview({
|
||||
images: [url],
|
||||
startPosition: 0
|
||||
});
|
||||
},
|
||||
previewReport() {
|
||||
let reports = this.reports
|
||||
vant.ImagePreview({
|
||||
images: reports,
|
||||
startPosition: 0
|
||||
});
|
||||
},
|
||||
}
|
||||
})
|
||||
@ -1,236 +0,0 @@
|
||||
var app = new Vue({
|
||||
el: "#app",
|
||||
data: {
|
||||
active: 0,
|
||||
code: 'loading...',
|
||||
info: {},
|
||||
mapShow: false,
|
||||
mapAddress: {
|
||||
name: '广州市诚投科技有限公司',
|
||||
address: '广东省广州市番禺区节能科技园天安总部中心25号楼',
|
||||
latitude: 22.825255,
|
||||
longitude: 113.514967,
|
||||
},
|
||||
reports: ["./images/report1.jpg",
|
||||
"./images/report2.jpg",
|
||||
"./images/report3.jpg"
|
||||
],
|
||||
productMsg: [{
|
||||
title: '产品名称:',
|
||||
msg: '立健牌三清冲剂'
|
||||
},
|
||||
{
|
||||
title: '产品规格:',
|
||||
msg: '15g/袋x20袋/盒'
|
||||
},
|
||||
{
|
||||
title: '产品型号:',
|
||||
msg: '定制装'
|
||||
},
|
||||
{
|
||||
title: '产品类别:',
|
||||
msg: '保健食品'
|
||||
},
|
||||
{
|
||||
title: '指导价格:',
|
||||
msg: 'XX元/盒'
|
||||
},
|
||||
],
|
||||
syMsg: [{
|
||||
title: '产品名称:',
|
||||
msg: '立健牌三清冲剂'
|
||||
},
|
||||
{
|
||||
title: '生产批次:',
|
||||
msg: '001'
|
||||
},
|
||||
{
|
||||
title: '生产日期:',
|
||||
msg: '2024年1月1日'
|
||||
},
|
||||
{
|
||||
title: '生产企业:',
|
||||
msg: '衍生健康医药(广东)有限公司'
|
||||
},
|
||||
{
|
||||
title: '生产地址:',
|
||||
msg: '广东省云浮市何杨公路1-8号衍生健康医药产业园'
|
||||
},
|
||||
|
||||
],
|
||||
btns: [{
|
||||
img: './images/green/pjicon1.png',
|
||||
img1: './images/green/pjicon2.png'
|
||||
},
|
||||
{
|
||||
img: './images/green/cpicon1.png',
|
||||
img1: './images/green/cpicon2.png'
|
||||
},
|
||||
{
|
||||
img: './images/green/jcicon1.png',
|
||||
img1: './images/green/jcicon2.png'
|
||||
},
|
||||
{
|
||||
img: './images/green/syicon1.png',
|
||||
img1: './images/green/syicon2.png'
|
||||
},
|
||||
{
|
||||
img: './images/green/ppicon1.png',
|
||||
img1: './images/green/ppicon2.png'
|
||||
},
|
||||
|
||||
|
||||
],
|
||||
},
|
||||
created() {
|
||||
this.code = this.code.replace(/(.{4})/g, '$1 ')
|
||||
},
|
||||
computed: {
|
||||
properties() {
|
||||
return this.info.properties || {};
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
get_property(name) {
|
||||
console.log("get_property", name, this.properties);
|
||||
if (this.properties[name]) {
|
||||
var x = this.properties[name];
|
||||
if (x.file) {
|
||||
return x.file;
|
||||
}
|
||||
if (x.text) {
|
||||
return x.text;
|
||||
}
|
||||
if (x.richtext) {
|
||||
return x.richtext;
|
||||
}
|
||||
}
|
||||
return '';
|
||||
},
|
||||
changeBtn(index) {
|
||||
this.active = index
|
||||
},
|
||||
goDetails(index) {
|
||||
location.href = "img_details.html?index=" + index
|
||||
},
|
||||
goPageZfsy() {
|
||||
// location.href=this.zfsy_url
|
||||
},
|
||||
//---物流查询--------------
|
||||
wl(code, type, area_code, area_addresss) {
|
||||
let _this = this
|
||||
if (type == 0) {
|
||||
var url = "/open/wl?code=" + code
|
||||
} else {
|
||||
if (area_code) {
|
||||
var url = "/open/wl?code=" + code + '&is_warn=1&adcode=' + area_code + '&area_addresss=' + area_addresss;
|
||||
} else {
|
||||
var url = "/open/wl?code=" + code + '&is_warn=1'
|
||||
}
|
||||
}
|
||||
|
||||
$
|
||||
.ajax({
|
||||
'url': URL + "/open/fw?code=" +
|
||||
code + "&tenant_prefix=" + flag,
|
||||
'type': 'get',
|
||||
'dataType': 'json',
|
||||
'success': function(data, statusText) {
|
||||
if (data.success) {
|
||||
var details = data.details;
|
||||
|
||||
_this.first_query_time = details.first_query_time
|
||||
if (details.query_times == 1) {
|
||||
_this.descn = "您所查询的是珞参麟品牌官方正品，品质保证，敬请放心食用。"
|
||||
} else {
|
||||
_this.descn = `您好！您所查询的防伪码已被查询，查询次数为${details.query_times}次，如有疑问请联系您所购买的产品的供应商。`
|
||||
}
|
||||
} else {
|
||||
_this.descn = "该溯源码不存在，如有疑问请联系您所购买的产品的供应商。"
|
||||
}
|
||||
|
||||
},
|
||||
error: function(data) {
|
||||
_this.descn = "正在为您努力计算密码，请24小时候查询"
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
|
||||
},
|
||||
|
||||
|
||||
showImg(e) {
|
||||
let url = e.currentTarget.src
|
||||
vant.ImagePreview({
|
||||
images: [url],
|
||||
startPosition: 0
|
||||
});
|
||||
},
|
||||
previewReport() {
|
||||
let reports = this.reports
|
||||
vant.ImagePreview({
|
||||
images: reports,
|
||||
startPosition: 0
|
||||
});
|
||||
},
|
||||
openAddress() {
|
||||
this.mapShow=true
|
||||
},
|
||||
getMapApp(mapType) {
|
||||
const {
|
||||
name,
|
||||
address,
|
||||
latitude,
|
||||
longitude,
|
||||
} = this.mapAddress;
|
||||
if (wx && wx.miniProgram && wx.miniProgram.navigateTo) {
|
||||
wx.miniProgram.navigateTo({
|
||||
url: `/pages/nav/nav?latitude=${latitude}&longitude=${longitude}`,
|
||||
});
|
||||
} else {
|
||||
let url = '';
|
||||
switch (mapType) {
|
||||
case '腾讯地图':
|
||||
url = 'https://apis.map.qq.com/uri/v1/marker?marker=coord:' + latitude + ',' + longitude + ';addr:' +
|
||||
address + ';title:'+name+'&referer=keyfree';
|
||||
break;
|
||||
case '高德地图':
|
||||
url = 'https://uri.amap.com/marker?position=' + longitude + ',' + latitude + '&name=' + address +
|
||||
'&callnative=1';
|
||||
break;
|
||||
case '百度地图':
|
||||
url = 'http://api.map.baidu.com/marker?location=' + latitude + ',' + longitude + '&title='+name+'&content=' +
|
||||
address + '&output=html&src=webapp.reformer.appname&coord_type=gcj02';
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
window.location.href = url;
|
||||
}
|
||||
},
|
||||
async reload() {
|
||||
let params = new URLSearchParams(window.location.search);
|
||||
var baseurl = params.get('baseurl') || "";
|
||||
var url = baseurl + 'api/properties/';
|
||||
var r = await fetch(url);
|
||||
var b = await r.json();
|
||||
console.log(b);
|
||||
this.info = b;
|
||||
this.code = b.code;
|
||||
var pos = this.get_property("公司位置");
|
||||
if (pos) {
|
||||
try {
|
||||
var fs = pos.split(',');
|
||||
this.mapAddress.latitude = parseFloat(fs[0].trim())
|
||||
this.mapAddress.longitude = parseFloat(fs[1].trim())
|
||||
} catch (e) {
|
||||
}
|
||||
}
|
||||
document.title = b.product;
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.reload();
|
||||
},
|
||||
})
|
||||
@ -1,13 +0,0 @@
|
||||
(function(doc, win) {
|
||||
var docEl = doc.documentElement,
|
||||
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
|
||||
recalc = function() {
|
||||
var clientWidth = docEl.clientWidth;
|
||||
if (!clientWidth) return;
|
||||
if(clientWidth>500) clientWidth=500
|
||||
docEl.style.fontSize = 20 * (clientWidth / 320) + 'px'; //在320px的屏幕上，1rem=20px
|
||||
};
|
||||
if (!doc.addEventListener) return;
|
||||
win.addEventListener(resizeEvt, recalc, false);
|
||||
doc.addEventListener('DOMContentLoaded', recalc, false);
|
||||
})(document, window);
|
||||
@ -1,340 +0,0 @@
|
||||
var token_name = "kyd_wx_access_token";
|
||||
var cartName = "kyd_wx_products";
|
||||
let BaseUrl = 'http://wy.cortruth.com/wybc_wx';
|
||||
var back_url = location.href;
|
||||
var LOGIN_URL;
|
||||
var isWxLogin = false;
|
||||
var flag='uuu'
|
||||
|
||||
if(isWxLogin)
|
||||
LOGIN_URL = BaseUrl + "/open/jxs/wxLogin?backUrl=" + back_url;
|
||||
else
|
||||
LOGIN_URL = BaseUrl + '/static/login.html';
|
||||
|
||||
const nullHeadImg = "http://kyd.cortruth.com/kyd_wx/static/images/zw1.jpg";
|
||||
const rootUrl = "http://kyd.cortruth.com/kyd_wx/";
|
||||
|
||||
// 后加载js 无回调
|
||||
function loadJS(url) {
|
||||
loadJS(url, function() {});
|
||||
}
|
||||
// 后加载js 有回调
|
||||
function loadJS(url, callback) {
|
||||
|
||||
var script = document.createElement('script'),
|
||||
fn = callback || function() {};
|
||||
script.type = 'text/javascript';
|
||||
// IE
|
||||
if(script.readyState) {
|
||||
script.onreadystatechange = function() {
|
||||
if(script.readyState == 'loaded' || script.readyState == 'complete') {
|
||||
script.onreadystatechange = null;
|
||||
fn();
|
||||
}
|
||||
};
|
||||
} else {
|
||||
// 其他浏览器
|
||||
script.onload = function() {
|
||||
fn();
|
||||
};
|
||||
}
|
||||
script.src = url + "?" + Math.random();
|
||||
document.getElementsByTagName('head')[0].appendChild(script);
|
||||
|
||||
}
|
||||
|
||||
function ajaxW(isLoading, url, submitType, param, successFunction) {
|
||||
var code = getRequestParam("statusCode");
|
||||
if(code == null || code == '') {
|
||||
if(isLoading) {
|
||||
mui.showLoading("正在加载..", "div"); // 加载文字和类型，plus环境中类型为div时强制以div方式显示
|
||||
}
|
||||
param.access_token = getToken()
|
||||
mui.ajax({
|
||||
url: BaseUrl + url,
|
||||
type: submitType,
|
||||
dataType: "json",
|
||||
// contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
|
||||
data: param,
|
||||
success: function(data) {
|
||||
if(isLoading) {
|
||||
mui.hideLoading();
|
||||
}
|
||||
successFunction(data);
|
||||
},
|
||||
error: function(data) {
|
||||
if(isLoading) {
|
||||
mui.hideLoading();
|
||||
}
|
||||
console.log('error', data);
|
||||
var httpCode = data.status;
|
||||
if(httpCode == 500) {
|
||||
mui.toast('系统异常');
|
||||
return;
|
||||
}
|
||||
// var code = data.responseJSON.code;
|
||||
var responseJSON = data.response;
|
||||
console.log('responseJSON', responseJSON)
|
||||
responseJSON = JSON.parse(responseJSON);
|
||||
console.log(responseJSON);
|
||||
var code = responseJSON.code;
|
||||
if(code == 401) {
|
||||
localStorage.removeItem(token_name);
|
||||
mui.toast('登录状态异常，请重新登录');
|
||||
|
||||
location.href = LOGIN_URL;
|
||||
return;
|
||||
} else if(code == 402) {
|
||||
localStorage.removeItem(token_name);
|
||||
mui.toast('登录状态过期，请重新登录');
|
||||
|
||||
location.href = LOGIN_URL;
|
||||
return;
|
||||
} else if(code == 403) {
|
||||
mui.toast('权限不足');
|
||||
return;
|
||||
} else {
|
||||
|
||||
location.href = LOGIN_URL;
|
||||
}
|
||||
}
|
||||
|
||||
})
|
||||
} else {
|
||||
|
||||
if(code == '408') {
|
||||
ajaxN(true, '/open/jxs/oauthToken', 'post', {}, function(d) {
|
||||
if(!d.success) {
|
||||
mui.alert(d.message)
|
||||
return;
|
||||
}
|
||||
setToken(d.details.token.access_token)
|
||||
localStorage.role = d.details.role_name;
|
||||
if(!d.details.role_name) {
|
||||
mui.toast('获取角色失败！')
|
||||
return
|
||||
}
|
||||
|
||||
setTimeout(function() {
|
||||
location.href = back_url.substr(0, back_url.indexOf('statusCode=') - 1);
|
||||
}, 1000)
|
||||
|
||||
})
|
||||
}
|
||||
if(code == '407') {
|
||||
mui.alert('该微信号未与经销商绑定');
|
||||
location.href = rootUrl + 'login.html';
|
||||
return
|
||||
}
|
||||
if(code == '405') {
|
||||
mui.alert('该经销商已被冻结');
|
||||
return
|
||||
}
|
||||
if(code == '403') {
|
||||
mui.alert('权限不足');
|
||||
return
|
||||
}
|
||||
if(code == '402') {
|
||||
mui.alert('令牌过期');
|
||||
return
|
||||
}
|
||||
if(code == '401') {
|
||||
mui.alert('令牌错误');
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// 判断是否有登陆，token是否正确
|
||||
function ajaxP(isLoading, url, submitType, param, successFunction, errorFunction) {
|
||||
if(isLoading) {
|
||||
mui.showLoading("正在加载..", "div"); // 加载文字和类型，plus环境中类型为div时强制以div方式显示
|
||||
}
|
||||
param.access_token = getToken()
|
||||
mui.ajax({
|
||||
url: BaseUrl + url,
|
||||
type: submitType,
|
||||
dataType: "json",
|
||||
// contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
|
||||
data: param,
|
||||
success: function(data) {
|
||||
if(isLoading) {
|
||||
mui.hideLoading();
|
||||
}
|
||||
successFunction(data);
|
||||
},
|
||||
error: function(data) {
|
||||
if(isLoading) {
|
||||
mui.hideLoading();
|
||||
}
|
||||
errorFunction(data);
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
function ajaxN(isLoading, url, submitType, param, successFunction) {
|
||||
|
||||
if(isLoading) {
|
||||
mui.showLoading("正在加载..", "div"); // 加载文字和类型，plus环境中类型为div时强制以div方式显示
|
||||
}
|
||||
mui.ajax({
|
||||
url: BaseUrl + url,
|
||||
type: submitType,
|
||||
dataType: "json",
|
||||
// contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
|
||||
data: param,
|
||||
success: function(data) {
|
||||
if(isLoading) {
|
||||
mui.hideLoading();
|
||||
}
|
||||
successFunction(data);
|
||||
},
|
||||
error: function(data) {
|
||||
if(isLoading) {
|
||||
mui.hideLoading();
|
||||
}
|
||||
console.log('error', data);
|
||||
var httpCode = data.status;
|
||||
if(httpCode == 500) {
|
||||
mui.toast('系统异常');
|
||||
return;
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
// ----获取url带的参数-------
|
||||
function getRequestParam(key) {
|
||||
// http://ip:port/xxx.html?key1=value1&key2=value2&key3=value3
|
||||
if(location.href.indexOf('?') == -1) {
|
||||
// 不带任何参数
|
||||
return '';
|
||||
}
|
||||
|
||||
var params = location.href.split('?')[1];
|
||||
// key1=value1&key2=value2&key3=value3
|
||||
if(params.indexOf(key + '=') == -1) {
|
||||
return '';
|
||||
}
|
||||
var paramVal = params.split(key + '=')[1];
|
||||
// value2&key3=value3
|
||||
return paramVal.split('&')[0];
|
||||
}
|
||||
// 全局定义滚动事件
|
||||
function scrollP(scrollFn) {
|
||||
Vue.directive('scroll', {
|
||||
bind: (el, binding, vnode) => {
|
||||
scrollFn(el, binding);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function goPage(url) {
|
||||
location.href = url;
|
||||
}
|
||||
var yanzheng = {
|
||||
mail: function(a) {
|
||||
return /^(\w-*\.*)+@(\w-?)+(\.\w{2,})+$/.test(a)
|
||||
},
|
||||
phone: function(a) {
|
||||
return a.match(/^1[1-9][0-9]{9}$/) && 11 == a.length
|
||||
}
|
||||
};
|
||||
|
||||
function setIndex(i) {
|
||||
if(i == 0) {
|
||||
goPage('index.html')
|
||||
}
|
||||
if(i == 1) {
|
||||
goPage('product.html')
|
||||
}
|
||||
if(i == 2) {
|
||||
goPage('cart.html')
|
||||
}
|
||||
if(i == 3) {
|
||||
goPage('news.html')
|
||||
}
|
||||
if(i == 4) {
|
||||
var token = getToken()
|
||||
if(!token) {
|
||||
goPage('login.html')
|
||||
return;
|
||||
}
|
||||
if(localStorage.role == 'ROLE_ADMIN') {
|
||||
goPage('admin.html');
|
||||
} else if(localStorage.role == 'ROLE_JXS') {
|
||||
goPage('my.html');
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
// 返回判断
|
||||
function goBack() {
|
||||
if(localStorage.role == 'ROLE_ADMIN') {
|
||||
goPage('../../admin.html');
|
||||
} else if(localStorage.role == 'ROLE_JXS') {
|
||||
goPage('../../my.html')
|
||||
}
|
||||
}
|
||||
|
||||
// 包含微信分享的页面返回判断
|
||||
function goBackWithShare() {
|
||||
if(getRequestParam('from')) {
|
||||
goPage("../../index.html")
|
||||
} else {
|
||||
window.history.back();
|
||||
}
|
||||
}
|
||||
|
||||
// token
|
||||
function setToken(val) {
|
||||
localStorage.setItem(token_name, val)
|
||||
}
|
||||
|
||||
function getToken() {
|
||||
return localStorage.getItem(token_name);
|
||||
}
|
||||
|
||||
function setCartName(val) {
|
||||
localStorage.setItem(cartName, val)
|
||||
}
|
||||
|
||||
function getCartName() {
|
||||
return localStorage.getItem(cartName);
|
||||
}
|
||||
|
||||
// 手机正则
|
||||
function telRegular(text) {
|
||||
const reg = /^1[1-9][0-9]{9}$/;
|
||||
var state = reg.test(text)
|
||||
if(!state) {
|
||||
// mui.toast('手机号码格式不正确！')
|
||||
}
|
||||
return state
|
||||
}
|
||||
|
||||
// 身份证正则
|
||||
function IDRegular(text) {
|
||||
const reg = /^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$|^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/;
|
||||
var state = reg.test(text)
|
||||
if(!state) {
|
||||
// mui.toast('身份证格式不正确！')
|
||||
}
|
||||
return state
|
||||
}
|
||||
// input只能输入整数
|
||||
function changeFn(event) {
|
||||
let val = event.target.value.trim()
|
||||
// 只能是正整数或空,可根据需求修改正则
|
||||
// item = e.target.value.replace(/[^\d]/g,'')
|
||||
if(/^[1-9]\d*$|^$/.test(val)) {
|
||||
return val
|
||||
}
|
||||
}
|
||||
// input只能输入两位小数
|
||||
function decimal(val) {
|
||||
var value = (val.match(/^\d*(\.?\d{0,2})/g)[0]) || null
|
||||
return value
|
||||
}
|
||||
7
examples/template-0506/js/vant.min.js
vendored
6
examples/template-0506/js/vue.min.js
vendored
@ -1,289 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
|
||||
<link rel="stylesheet" type="text/css" href="css/vant.css" />
|
||||
<!--<link rel="stylesheet" href="../../js/mz/font-awesome-4.7.0/css/font-awesome.css" />-->
|
||||
|
||||
<title>三清冲剂</title>
|
||||
<style type="text/css">
|
||||
body,
|
||||
html {
|
||||
|
||||
line-height: 1.1rem;
|
||||
font-size: .5rem;
|
||||
color: #878787;
|
||||
}
|
||||
|
||||
img {
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
img,
|
||||
div {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
max-width: 500px;
|
||||
margin: 0 auto;
|
||||
background-color: #008ed0;
|
||||
}
|
||||
|
||||
.main {
|
||||
position: relative;
|
||||
width: 13rem;
|
||||
height: 88vh;
|
||||
padding: .7rem;
|
||||
margin-top: .8rem;
|
||||
margin-left: .5rem;
|
||||
background-color: #ededed;
|
||||
border-radius: .5rem 0 .5rem .5rem;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
|
||||
.main .cd {
|
||||
height: calc(100% - .5rem);
|
||||
box-sizing: border-box;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.main .cd img {
|
||||
width: 100%;
|
||||
margin-top: .3rem;
|
||||
}
|
||||
|
||||
.fw_box {
|
||||
position: relative;
|
||||
padding: 0 .2rem;
|
||||
}
|
||||
|
||||
.fw_box .code {
|
||||
position: absolute;
|
||||
top: 7.8rem;
|
||||
left: 3.3rem;
|
||||
font-size: .5rem;
|
||||
transform: scale(.8);
|
||||
}
|
||||
|
||||
.main .cd .tab1_4 {
|
||||
width: 7rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.main .cd .tab1_5 {
|
||||
padding: 0 .5rem;
|
||||
}
|
||||
|
||||
.line {
|
||||
display: flex;
|
||||
margin-bottom: .3rem;
|
||||
}
|
||||
|
||||
.line>div:first-child {
|
||||
margin-right: .2rem;
|
||||
flex-shrink: 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.line2 {
|
||||
text-align: center;
|
||||
margin-bottom: .2rem;
|
||||
color: #afafaf;
|
||||
}
|
||||
|
||||
.sy_msg {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.sy_msg .address {
|
||||
position: absolute;
|
||||
top: 10.4rem;
|
||||
left: .3rem;
|
||||
width: 10.5rem;
|
||||
height: 6rem;
|
||||
/* background-color: violet;
|
||||
opacity: .6; */
|
||||
}
|
||||
|
||||
.pb20 {
|
||||
margin-bottom: .2rem;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.right {
|
||||
position: relative;
|
||||
left: -0.05rem;
|
||||
width: calc(100% - 13rem);
|
||||
height: 90vh;
|
||||
box-sizing: border-box;
|
||||
margin-top: .8rem;
|
||||
padding-right: .6rem;
|
||||
}
|
||||
|
||||
.right .item {
|
||||
width: 100%;
|
||||
margin-bottom: .3rem;
|
||||
}
|
||||
|
||||
.right .item img {
|
||||
width: 100%;
|
||||
padding-left: .2rem;
|
||||
}
|
||||
|
||||
.right .item .active {
|
||||
background-color: #ededed;
|
||||
border-radius: 0 .3rem .3rem 0;
|
||||
}
|
||||
|
||||
.map_item {
|
||||
height: 2rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.map_item1 {
|
||||
height: 2.5rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-top: .5rem solid #F4F4F4;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
[v-cloak] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.bottom_icon {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 100%;
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
.border-bottom {
|
||||
border-bottom: 1px solid #d4d4d4;
|
||||
}
|
||||
|
||||
.padding_all_30 {
|
||||
padding: .3rem;
|
||||
}
|
||||
|
||||
.padding_rl_30 {
|
||||
padding-left: .3rem;
|
||||
padding-right: .3rem;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container" id="app" v-cloak>
|
||||
<img src="./images/blue_bottom.png" alt="" class="bottom_icon" />
|
||||
<div class="main">
|
||||
<div class="cd" v-if="active==0" style="text-align: center;">
|
||||
<div class="fw_box">
|
||||
<img src="./images/blue_tab1_1.png" />
|
||||
<div class="code">溯源编码:{{code}}</div>
|
||||
</div>
|
||||
<img src="./images/blue_tab1_2.png" @click="showImg" data-url="./images/blue_tab1_2.png" />
|
||||
<img src="./images/blue_tab1_3.png" @click="showImg" data-url="./images/blue_tab1_3.png" />
|
||||
<img src="./images/blue_tab1_4.png" class="tab1_4" />
|
||||
<img src="./images/blue_tab1_5.png" class="tab1_5" />
|
||||
</div>
|
||||
<div class="cd" v-if="active==1">
|
||||
<img src="./images/tab2_1.jpg" @click="showImg" data-url="./images/tab2_1.jpg" />
|
||||
<div class="border-bottom padding_all_30">
|
||||
<div class="line" v-for="(item,index) in productMsg" v-key="index">
|
||||
<div>{{item.title}}</div>
|
||||
<div>{{item.msg}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="padding_all_30" style="margin-top: .2rem;">
|
||||
产品介绍:<br />
|
||||
立健是一个专注于肠道调养的健康品牌,立健牌三清冲剂是国家食品药品监督管理局批准的首批益生元类保健产品。<br />
|
||||
<br />
|
||||
益生元与肠道健康:<br />
|
||||
益生元,国际学名一一双岐因子,是肠道益生菌的最佳!食物”来源,能为肠道益生菌提供充足营养。益生元的生理功能是通过促进肠道内益生菌特别是双歧杆菌的大量增殖,有效抑制肠道内有害菌的生长,平衡肠道菌群环境,促进肠道蠕动,保持肠道年轻态。
|
||||
</div>
|
||||
</div>
|
||||
<div class="cd" v-if="active==2">
|
||||
<img src="./images/tab3_1.png" />
|
||||
<div class="border-bottom padding_all_30">
|
||||
<div class="line2">检验机构:华测检测认证集团股份有限公司</div>
|
||||
<div class="line2">报告编号:qbs88888888</div>
|
||||
</div>
|
||||
<img src="./images/tab3_2.png" style="padding: 0 20rpx;" @click="previewReport" />
|
||||
</div>
|
||||
|
||||
<div class="cd" v-if="active==3">
|
||||
<div class="padding_all_30" style="padding-bottom: 0;">
|
||||
<div class="line " v-for="(item,index) in syMsg" v-key="index">
|
||||
<div>{{item.title}}</div>
|
||||
<div>{{item.msg}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sy_msg">
|
||||
<img src="./images/tab4_1.jpg" style="margin-top: 0;" />
|
||||
<div class="address" @click="openAddress"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="cd" v-if="active==4">
|
||||
<div class="padding_all_30">
|
||||
<div class="pb20">
|
||||
立健是一个专注于肠道养护的健康品牌,立健三清冲剂是国家食品药品监督管理局批准的首批保健食品、新华网大型科普栏目《健康解码》推荐产品。</div>
|
||||
<div class="pb20"> 产品中的异麦芽低聚糖纯度高达90%,能改善胃肠道功能,有效调理肠道菌群环境,保持肠道健康,是国内同类产品的佼佼者。
|
||||
</div>
|
||||
<div class="pb20">
|
||||
目前,立健三清冲剂已成功进入全国大中型医药连锁及时尚品连锁店渠道,在电商平台已初具规模,并已逐渐向美容品和童婴市场延伸。<br>
|
||||
</div>
|
||||
</div>
|
||||
<img src="./images/tab5_1.png" style="margin-top: 0;" @click="showImg" data-url="./images/tab5_1.png" />
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="right">
|
||||
<div class="item" v-for="(item,index) in btns" @click="changeBtn(index)">
|
||||
<img :src="item.img1" v-if="index!==active">
|
||||
<img :src="item.img" v-if="index===active" class="active">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<van-action-sheet v-model="mapShow" title="">
|
||||
<div class="map_content">
|
||||
<div class="map_item" @click="getMapApp('腾讯地图')">腾讯地图</div>
|
||||
<div class="map_item1" @click="mapShow=false">取消</div>
|
||||
</div>
|
||||
</van-action-sheet>
|
||||
</div>
|
||||
</body>
|
||||
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
|
||||
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
|
||||
<script src="js/vue.min.js"></script>
|
||||
<script src="js/vant.min.js"></script>
|
||||
<script src="js/rem.js"></script>
|
||||
<script type="text/javascript" src="js/url.js"></script>
|
||||
<script type="text/javascript">
|
||||
$(function() {
|
||||
loadJS('js/blue.js');
|
||||
})
|
||||
</script>
|
||||
</html>
|
||||
@ -1,286 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
|
||||
<link rel="stylesheet" type="text/css" href="css/vant.css" />
|
||||
<!--<link rel="stylesheet" href="../../js/mz/font-awesome-4.7.0/css/font-awesome.css" />-->
|
||||
|
||||
<title>三清冲剂</title>
|
||||
<style type="text/css">
|
||||
body,
|
||||
html {
|
||||
|
||||
line-height: 1.1rem;
|
||||
font-size: .5rem;
|
||||
color: #878787;
|
||||
}
|
||||
|
||||
img {
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
img,
|
||||
div {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
max-width: 500px;
|
||||
margin: 0 auto;
|
||||
background-color: #33a243;
|
||||
}
|
||||
|
||||
.main {
|
||||
position: relative;
|
||||
width: 13rem;
|
||||
height: 88vh;
|
||||
padding: .7rem;
|
||||
margin-top: .8rem;
|
||||
margin-left: .5rem;
|
||||
background-color: #ededed;
|
||||
border-radius: .5rem 0 .5rem .5rem;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
|
||||
.main .cd {
|
||||
height: calc(100% - .5rem);
|
||||
box-sizing: border-box;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.main .cd img {
|
||||
width: 100%;
|
||||
margin-top: .3rem;
|
||||
}
|
||||
|
||||
.fw_box {
|
||||
position: relative;
|
||||
padding: 0 .2rem;
|
||||
}
|
||||
|
||||
.fw_box .code {
|
||||
position: absolute;
|
||||
top: 7.8rem;
|
||||
left: 3.5rem;
|
||||
font-size: .5rem;
|
||||
transform: scale(.8);
|
||||
}
|
||||
|
||||
.main .cd .tab1_4 {
|
||||
width: 7rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.main .cd .tab1_5 {
|
||||
padding: 0 .5rem;
|
||||
}
|
||||
|
||||
.line {
|
||||
display: flex;
|
||||
margin-bottom: .3rem;
|
||||
}
|
||||
|
||||
.line>div:first-child {
|
||||
margin-right: .2rem;
|
||||
flex-shrink: 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.line2 {
|
||||
text-align: center;
|
||||
margin-bottom: .2rem;
|
||||
color: #afafaf;
|
||||
}
|
||||
|
||||
.sy_msg {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.sy_msg .address {
|
||||
position: absolute;
|
||||
top: 10.4rem;
|
||||
left: .3rem;
|
||||
width: 10.5rem;
|
||||
height: 6rem;
|
||||
/* background-color: violet;
|
||||
opacity: .6; */
|
||||
}
|
||||
|
||||
.pb20 {
|
||||
margin-bottom: .2rem;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.right {
|
||||
position: relative;
|
||||
left: -0.05rem;
|
||||
width: calc(100% - 13rem);
|
||||
height: 90vh;
|
||||
box-sizing: border-box;
|
||||
margin-top: .8rem;
|
||||
padding-right: .6rem;
|
||||
}
|
||||
|
||||
.right .item {
|
||||
width: 100%;
|
||||
margin-bottom: .3rem;
|
||||
}
|
||||
|
||||
.right .item img {
|
||||
width: 100%;
|
||||
padding-left: .2rem;
|
||||
}
|
||||
|
||||
.right .item .active {
|
||||
background-color: #ededed;
|
||||
border-radius: 0 .3rem .3rem 0;
|
||||
}
|
||||
|
||||
.map_item {
|
||||
height: 2rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.map_item1 {
|
||||
height: 2.5rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-top: .5rem solid #F4F4F4;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
[v-cloak] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.bottom_icon {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 100%;
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
.border-bottom {
|
||||
border-bottom: 1px solid #d4d4d4;
|
||||
}
|
||||
|
||||
.padding_all_30 {
|
||||
padding: .3rem;
|
||||
}
|
||||
|
||||
.padding_rl_30 {
|
||||
padding-left: .3rem;
|
||||
padding-right: .3rem;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container" id="app" v-cloak>
|
||||
<img src="./images/green_bottom.png" alt="" class="bottom_icon" />
|
||||
<div class="main">
|
||||
<div class="cd" v-if="active==0" style="text-align: center;">
|
||||
<div class="fw_box">
|
||||
<img src="./images/tab1_1.png" />
|
||||
<div class="code">溯源编码:{{code}}</div>
|
||||
</div>
|
||||
<img src="./images/tab1_2.png" @click="showImg" data-url="./images/tab1_2.png" />
|
||||
<img src="./images/tab1_3.png" class="tab1_5" style="margin-top: 1rem;" />
|
||||
</div>
|
||||
<div class="cd" v-if="active==1">
|
||||
<img src="./images/tab2_1.jpg" @click="showImg" data-url="./images/tab2_1.jpg" />
|
||||
<div class="border-bottom padding_all_30">
|
||||
<div class="line" v-for="(item,index) in productMsg" v-key="index">
|
||||
<div>{{item.title}}</div>
|
||||
<div>{{item.msg}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="padding_all_30" style="margin-top: .2rem;">
|
||||
产品介绍:<br />
|
||||
立健是一个专注于肠道调养的健康品牌,立健牌三清冲剂是国家食品药品监督管理局批准的首批益生元类保健产品。<br />
|
||||
<br />
|
||||
益生元与肠道健康:<br />
|
||||
益生元,国际学名一一双岐因子,是肠道益生菌的最佳!食物”来源,能为肠道益生菌提供充足营养。益生元的生理功能是通过促进肠道内益生菌特别是双歧杆菌的大量增殖,有效抑制肠道内有害菌的生长,平衡肠道菌群环境,促进肠道蠕动,保持肠道年轻态。
|
||||
</div>
|
||||
</div>
|
||||
<div class="cd" v-if="active==2">
|
||||
<img src="./images/tab3_1.png" />
|
||||
<div class="border-bottom padding_all_30">
|
||||
<div class="line2">检验机构:华测检测认证集团股份有限公司</div>
|
||||
<div class="line2">报告编号:qbs88888888</div>
|
||||
</div>
|
||||
<img src="./images/tab3_2.png" style="padding: 0 20rpx;" @click="previewReport" />
|
||||
</div>
|
||||
|
||||
<div class="cd" v-if="active==3">
|
||||
<div class="padding_all_30" style="padding-bottom: 0;">
|
||||
<div class="line " v-for="(item,index) in syMsg" v-key="index">
|
||||
<div>{{item.title}}</div>
|
||||
<div>{{item.msg}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sy_msg">
|
||||
<img src="./images/tab4_1.jpg" style="margin-top: 0;" />
|
||||
<div class="address" @click="openAddress"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="cd" v-if="active==4">
|
||||
<div class="padding_all_30">
|
||||
<div class="pb20">
|
||||
立健是一个专注于肠道养护的健康品牌,立健三清冲剂是国家食品药品监督管理局批准的首批保健食品、新华网大型科普栏目《健康解码》推荐产品。</div>
|
||||
<div class="pb20"> 产品中的异麦芽低聚糖纯度高达90%,能改善胃肠道功能,有效调理肠道菌群环境,保持肠道健康,是国内同类产品的佼佼者。
|
||||
</div>
|
||||
<div class="pb20">
|
||||
目前,立健三清冲剂已成功进入全国大中型医药连锁及时尚品连锁店渠道,在电商平台已初具规模,并已逐渐向美容品和童婴市场延伸。<br>
|
||||
</div>
|
||||
</div>
|
||||
<img src="./images/tab5_1.png" style="margin-top: 0;" @click="showImg" data-url="./images/tab5_1.png" />
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="right">
|
||||
<div class="item" v-for="(item,index) in btns" @click="changeBtn(index)">
|
||||
<img :src="item.img1" v-if="index!==active">
|
||||
<img :src="item.img" v-if="index===active" class="active">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<van-action-sheet v-model="mapShow" title="">
|
||||
<div class="map_content">
|
||||
<div class="map_item" @click="getMapApp('腾讯地图')">腾讯地图</div>
|
||||
<div class="map_item1" @click="mapShow=false">取消</div>
|
||||
</div>
|
||||
</van-action-sheet>
|
||||
</div>
|
||||
</body>
|
||||
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
|
||||
<script src="js/vue.min.js"></script>
|
||||
<script src="js/vant.min.js"></script>
|
||||
<script src="js/rem.js"></script>
|
||||
<script type="text/javascript" src="js/url.js"></script>
|
||||
<script type="text/javascript">
|
||||
$(function() {
|
||||
loadJS('js/green.js');
|
||||
})
|
||||
</script>
|
||||
</html>
|
||||
|
Before Width: | Height: | Size: 3.6 KiB |
|
Before Width: | Height: | Size: 9.7 KiB |
|
Before Width: | Height: | Size: 4.4 KiB |
|
Before Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 3.5 KiB |
|
Before Width: | Height: | Size: 9.4 KiB |
|
Before Width: | Height: | Size: 4.6 KiB |
|
Before Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 4.3 KiB |
|
Before Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 113 KiB |
|
Before Width: | Height: | Size: 208 KiB |
|
Before Width: | Height: | Size: 356 KiB |
|
Before Width: | Height: | Size: 318 KiB |
|
Before Width: | Height: | Size: 3.0 KiB |
|
Before Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 1.7 KiB |
|
Before Width: | Height: | Size: 1.5 KiB |
|
Before Width: | Height: | Size: 1.8 KiB |
|
Before Width: | Height: | Size: 1.7 KiB |
|
Before Width: | Height: | Size: 1.5 KiB |
|
Before Width: | Height: | Size: 1.3 KiB |
|
Before Width: | Height: | Size: 1.5 KiB |
|
Before Width: | Height: | Size: 1.4 KiB |
|
Before Width: | Height: | Size: 4.4 KiB |
|
Before Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 96 KiB |
|
Before Width: | Height: | Size: 104 KiB |
|
Before Width: | Height: | Size: 170 KiB |
|
Before Width: | Height: | Size: 196 KiB |
|
Before Width: | Height: | Size: 88 KiB |
|
Before Width: | Height: | Size: 187 KiB |
|
Before Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 39 KiB |
|
Before Width: | Height: | Size: 22 KiB |
|
Before Width: | Height: | Size: 116 KiB |
|
Before Width: | Height: | Size: 116 KiB |
|
Before Width: | Height: | Size: 110 KiB |
@ -1,286 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
|
||||
<link rel="stylesheet" type="text/css" href="css/vant.css" />
|
||||
<!--<link rel="stylesheet" href="../../js/mz/font-awesome-4.7.0/css/font-awesome.css" />-->
|
||||
|
||||
<title>三清冲剂</title>
|
||||
<style type="text/css">
|
||||
body,
|
||||
html {
|
||||
|
||||
line-height: 1.1rem;
|
||||
font-size: .5rem;
|
||||
color: #878787;
|
||||
}
|
||||
|
||||
img {
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
img,
|
||||
div {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
max-width: 500px;
|
||||
margin: 0 auto;
|
||||
background-color: #33a243;
|
||||
}
|
||||
|
||||
.main {
|
||||
position: relative;
|
||||
width: 13rem;
|
||||
height: 88vh;
|
||||
padding: .7rem;
|
||||
margin-top: .8rem;
|
||||
margin-left: .5rem;
|
||||
background-color: #ededed;
|
||||
border-radius: .5rem 0 .5rem .5rem;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
|
||||
.main .cd {
|
||||
height: calc(100% - .5rem);
|
||||
box-sizing: border-box;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.main .cd img {
|
||||
width: 100%;
|
||||
margin-top: .3rem;
|
||||
}
|
||||
|
||||
.fw_box {
|
||||
position: relative;
|
||||
padding: 0 .2rem;
|
||||
}
|
||||
|
||||
.fw_box .code {
|
||||
position: absolute;
|
||||
top: 7.8rem;
|
||||
left: 3.5rem;
|
||||
font-size: .5rem;
|
||||
transform: scale(.8);
|
||||
}
|
||||
|
||||
.main .cd .tab1_4 {
|
||||
width: 7rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.main .cd .tab1_5 {
|
||||
padding: 0 .5rem;
|
||||
}
|
||||
|
||||
.line {
|
||||
display: flex;
|
||||
margin-bottom: .3rem;
|
||||
}
|
||||
|
||||
.line>div:first-child {
|
||||
margin-right: .2rem;
|
||||
flex-shrink: 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.line2 {
|
||||
text-align: center;
|
||||
margin-bottom: .2rem;
|
||||
color: #afafaf;
|
||||
}
|
||||
|
||||
.sy_msg {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.sy_msg .address {
|
||||
position: absolute;
|
||||
top: 10.4rem;
|
||||
left: .3rem;
|
||||
width: 10.5rem;
|
||||
height: 6rem;
|
||||
/* background-color: violet;
|
||||
opacity: .6; */
|
||||
}
|
||||
|
||||
.pb20 {
|
||||
margin-bottom: .2rem;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.right {
|
||||
position: relative;
|
||||
left: -0.05rem;
|
||||
width: calc(100% - 13rem);
|
||||
height: 90vh;
|
||||
box-sizing: border-box;
|
||||
margin-top: .8rem;
|
||||
padding-right: .6rem;
|
||||
}
|
||||
|
||||
.right .item {
|
||||
width: 100%;
|
||||
margin-bottom: .3rem;
|
||||
}
|
||||
|
||||
.right .item img {
|
||||
width: 100%;
|
||||
padding-left: .2rem;
|
||||
}
|
||||
|
||||
.right .item .active {
|
||||
background-color: #ededed;
|
||||
border-radius: 0 .3rem .3rem 0;
|
||||
}
|
||||
|
||||
.map_item {
|
||||
height: 2rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.map_item1 {
|
||||
height: 2.5rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-top: .5rem solid #F4F4F4;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
[v-cloak] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.bottom_icon {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 100%;
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
.border-bottom {
|
||||
border-bottom: 1px solid #d4d4d4;
|
||||
}
|
||||
|
||||
.padding_all_30 {
|
||||
padding: .3rem;
|
||||
}
|
||||
|
||||
.padding_rl_30 {
|
||||
padding-left: .3rem;
|
||||
padding-right: .3rem;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container" id="app" v-cloak>
|
||||
<img src="./images/green_bottom.png" alt="" class="bottom_icon" />
|
||||
<div class="main">
|
||||
<div class="cd" v-if="active==0" style="text-align: center;">
|
||||
<div class="fw_box">
|
||||
<img src="./images/tab1_1.png" />
|
||||
<div class="code">溯源编码:{{code}}</div>
|
||||
</div>
|
||||
<img src="./images/tab1_2.png" @click="showImg" data-url="./images/tab1_2.png" />
|
||||
<img src="./images/tab1_3.png" class="tab1_5" style="margin-top: 1rem;" />
|
||||
</div>
|
||||
<div class="cd" v-if="active==1">
|
||||
<img src="./images/tab2_1.jpg" @click="showImg" data-url="./images/tab2_1.jpg" />
|
||||
<div class="border-bottom padding_all_30">
|
||||
<div class="line" v-for="(item,index) in productMsg" v-key="index">
|
||||
<div>{{item.title}}</div>
|
||||
<div>{{item.msg}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="padding_all_30" style="margin-top: .2rem;">
|
||||
产品介绍:<br />
|
||||
立健是一个专注于肠道调养的健康品牌,立健牌三清冲剂是国家食品药品监督管理局批准的首批益生元类保健产品。<br />
|
||||
<br />
|
||||
益生元与肠道健康:<br />
|
||||
益生元,国际学名一一双岐因子,是肠道益生菌的最佳!食物”来源,能为肠道益生菌提供充足营养。益生元的生理功能是通过促进肠道内益生菌特别是双歧杆菌的大量增殖,有效抑制肠道内有害菌的生长,平衡肠道菌群环境,促进肠道蠕动,保持肠道年轻态。
|
||||
</div>
|
||||
</div>
|
||||
<div class="cd" v-if="active==2">
|
||||
<img src="./images/tab3_1.png" />
|
||||
<div class="border-bottom padding_all_30">
|
||||
<div class="line2">检验机构:华测检测认证集团股份有限公司</div>
|
||||
<div class="line2">报告编号:qbs88888888</div>
|
||||
</div>
|
||||
<img src="./images/tab3_2.png" style="padding: 0 20rpx;" @click="previewReport" />
|
||||
</div>
|
||||
|
||||
<div class="cd" v-if="active==3">
|
||||
<div class="padding_all_30" style="padding-bottom: 0;">
|
||||
<div class="line " v-for="(item,index) in syMsg" v-key="index">
|
||||
<div>{{item.title}}</div>
|
||||
<div>{{item.msg}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sy_msg">
|
||||
<img src="./images/tab4_1.jpg" style="margin-top: 0;" />
|
||||
<div class="address" @click="openAddress"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="cd" v-if="active==4">
|
||||
<div class="padding_all_30">
|
||||
<div class="pb20">
|
||||
立健是一个专注于肠道养护的健康品牌,立健三清冲剂是国家食品药品监督管理局批准的首批保健食品、新华网大型科普栏目《健康解码》推荐产品。</div>
|
||||
<div class="pb20"> 产品中的异麦芽低聚糖纯度高达90%,能改善胃肠道功能,有效调理肠道菌群环境,保持肠道健康,是国内同类产品的佼佼者。
|
||||
</div>
|
||||
<div class="pb20">
|
||||
目前,立健三清冲剂已成功进入全国大中型医药连锁及时尚品连锁店渠道,在电商平台已初具规模,并已逐渐向美容品和童婴市场延伸。<br>
|
||||
</div>
|
||||
</div>
|
||||
<img src="./images/tab5_1.png" style="margin-top: 0;" @click="showImg" data-url="./images/tab5_1.png" />
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="right">
|
||||
<div class="item" v-for="(item,index) in btns" @click="changeBtn(index)">
|
||||
<img :src="item.img1" v-if="index!==active">
|
||||
<img :src="item.img" v-if="index===active" class="active">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<van-action-sheet v-model="mapShow" title="">
|
||||
<div class="map_content">
|
||||
<div class="map_item" @click="getMapApp('腾讯地图')">腾讯地图</div>
|
||||
<div class="map_item1" @click="mapShow=false">取消</div>
|
||||
</div>
|
||||
</van-action-sheet>
|
||||
</div>
|
||||
</body>
|
||||
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
|
||||
<script src="js/vue.min.js"></script>
|
||||
<script src="js/vant.min.js"></script>
|
||||
<script src="js/rem.js"></script>
|
||||
<script type="text/javascript" src="js/url.js"></script>
|
||||
<script type="text/javascript">
|
||||
$(function() {
|
||||
loadJS('js/green.js');
|
||||
})
|
||||
</script>
|
||||
</html>
|
||||
@ -1,203 +0,0 @@
|
||||
new Vue({
|
||||
el: "#app",
|
||||
data: {
|
||||
active: 0,
|
||||
code: 'loading...',
|
||||
mapShow: false,
|
||||
mapAddress: {
|
||||
name: '广州市诚投科技有限公司',
|
||||
address: '广东省广州市番禺区节能科技园天安总部中心25号楼',
|
||||
latitude: 22.825255,
|
||||
longitude: 113.514967,
|
||||
},
|
||||
reports: ["./images/report1.jpg",
|
||||
"./images/report2.jpg",
|
||||
"./images/report3.jpg"
|
||||
],
|
||||
productMsg: [{
|
||||
title: '产品名称:',
|
||||
msg: '立健牌三清冲剂'
|
||||
},
|
||||
{
|
||||
title: '产品规格:',
|
||||
msg: '15g/袋x20袋/盒'
|
||||
},
|
||||
{
|
||||
title: '产品型号:',
|
||||
msg: '定制装'
|
||||
},
|
||||
{
|
||||
title: '产品类别:',
|
||||
msg: '保健食品'
|
||||
},
|
||||
{
|
||||
title: '指导价格:',
|
||||
msg: 'XX元/盒'
|
||||
},
|
||||
],
|
||||
syMsg: [{
|
||||
title: '产品名称:',
|
||||
msg: '立健牌三清冲剂'
|
||||
},
|
||||
{
|
||||
title: '生产批次:',
|
||||
msg: '001'
|
||||
},
|
||||
{
|
||||
title: '生产日期:',
|
||||
msg: '2024年1月1日'
|
||||
},
|
||||
{
|
||||
title: '生产企业:',
|
||||
msg: '衍生健康医药(广东)有限公司'
|
||||
},
|
||||
{
|
||||
title: '生产地址:',
|
||||
msg: '广东省云浮市何杨公路1-8号衍生健康医药产业园'
|
||||
},
|
||||
|
||||
],
|
||||
btns: [{
|
||||
img: './images/blue/rzicon1.png',
|
||||
img1: './images/blue/rzicon2.png'
|
||||
},
|
||||
{
|
||||
img: './images/blue/cpicon1.png',
|
||||
img1: './images/blue/cpicon2.png'
|
||||
},
|
||||
{
|
||||
img: './images/blue/jcicon1.png',
|
||||
img1: './images/blue/jcicon2.png'
|
||||
},
|
||||
{
|
||||
img: './images/blue/syicon1.png',
|
||||
img1: './images/blue/syicon2.png'
|
||||
},
|
||||
{
|
||||
img: './images/blue/ppicon1.png',
|
||||
img1: './images/blue/ppicon2.png'
|
||||
},
|
||||
|
||||
|
||||
],
|
||||
},
|
||||
created() {
|
||||
this.code = this.code.replace(/(.{4})/g, '$1 ')
|
||||
|
||||
|
||||
|
||||
},
|
||||
methods: {
|
||||
changeBtn(index) {
|
||||
this.active = index
|
||||
},
|
||||
goDetails(index) {
|
||||
location.href = "img_details.html?index=" + index
|
||||
},
|
||||
goPageZfsy() {
|
||||
// location.href=this.zfsy_url
|
||||
},
|
||||
//---物流查询--------------
|
||||
wl(code, type, area_code, area_addresss) {
|
||||
let _this = this
|
||||
if (type == 0) {
|
||||
var url = "/open/wl?code=" + code
|
||||
} else {
|
||||
if (area_code) {
|
||||
var url = "/open/wl?code=" + code + '&is_warn=1&adcode=' + area_code + '&area_addresss=' + area_addresss;
|
||||
} else {
|
||||
var url = "/open/wl?code=" + code + '&is_warn=1'
|
||||
}
|
||||
}
|
||||
|
||||
$
|
||||
.ajax({
|
||||
'url': URL + "/open/fw?code=" +
|
||||
code + "&tenant_prefix=" + flag,
|
||||
'type': 'get',
|
||||
'dataType': 'json',
|
||||
'success': function(data, statusText) {
|
||||
if (data.success) {
|
||||
var details = data.details;
|
||||
|
||||
_this.first_query_time = details.first_query_time
|
||||
if (details.query_times == 1) {
|
||||
_this.descn = "您所查询的是珞参麟品牌官方正品，品质保证，敬请放心食用。"
|
||||
} else {
|
||||
_this.descn = `您好！您所查询的防伪码已被查询，查询次数为${details.query_times}次，如有疑问请联系您所购买的产品的供应商。`
|
||||
}
|
||||
} else {
|
||||
_this.descn = "该溯源码不存在，如有疑问请联系您所购买的产品的供应商。"
|
||||
}
|
||||
|
||||
},
|
||||
error: function(data) {
|
||||
_this.descn = "正在为您努力计算密码，请24小时候查询"
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
|
||||
},
|
||||
|
||||
|
||||
showImg(e) {
|
||||
let url = e.currentTarget.dataset.url
|
||||
vant.ImagePreview({
|
||||
images: [url],
|
||||
startPosition: 0
|
||||
});
|
||||
},
|
||||
previewReport() {
|
||||
let reports = this.reports
|
||||
vant.ImagePreview({
|
||||
images: reports,
|
||||
startPosition: 0
|
||||
});
|
||||
},
|
||||
openAddress() {
|
||||
this.mapShow=true
|
||||
},
|
||||
getMapApp(mapType) {
|
||||
const {
|
||||
name,
|
||||
address,
|
||||
latitude,
|
||||
longitude,
|
||||
} = this.mapAddress;
|
||||
if (wx && wx.miniProgram && wx.miniProgram.navigateTo) {
|
||||
wx.miniProgram.navigateTo({
|
||||
url: `/pages/nav/nav?latitude=${latitude}&longitude=${longitude}`,
|
||||
});
|
||||
} else {
|
||||
let url = '';
|
||||
switch (mapType) {
|
||||
case '腾讯地图':
|
||||
url = 'https://apis.map.qq.com/uri/v1/marker?marker=coord:' + latitude + ',' + longitude + ';addr:' +
|
||||
address + ';title:'+name+'&referer=keyfree';
|
||||
break;
|
||||
case '高德地图':
|
||||
url = 'https://uri.amap.com/marker?position=' + longitude + ',' + latitude + '&name=' + address +
|
||||
'&callnative=1';
|
||||
break;
|
||||
case '百度地图':
|
||||
url = 'http://api.map.baidu.com/marker?location=' + latitude + ',' + longitude + '&title='+name+'&content=' +
|
||||
address + '&output=html&src=webapp.reformer.appname&coord_type=gcj02';
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
window.location.href = url;
|
||||
}
|
||||
},
|
||||
async reload() {
|
||||
var url = 'api/properties/';
|
||||
var r = await fetch(url);
|
||||
var b = await r.json();
|
||||
this.code = b.code;
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.reload();
|
||||
},
|
||||
})
|
||||
@ -1,67 +0,0 @@
|
||||
const app = new Vue({
|
||||
el: "#app",
|
||||
data: {
|
||||
active: 0,
|
||||
info: {},
|
||||
btns: [{
|
||||
img: './images/blue/rzicon1.png',
|
||||
img1: './images/blue/rzicon2.png'
|
||||
},
|
||||
{
|
||||
img: './images/blue/cpicon1.png',
|
||||
img1: './images/blue/cpicon2.png'
|
||||
},
|
||||
{
|
||||
img: './images/blue/jcicon1.png',
|
||||
img1: './images/blue/jcicon2.png'
|
||||
},
|
||||
{
|
||||
img: './images/blue/syicon1.png',
|
||||
img1: './images/blue/syicon2.png'
|
||||
},
|
||||
{
|
||||
img: './images/blue/ppicon1.png',
|
||||
img1: './images/blue/ppicon2.png'
|
||||
},
|
||||
],
|
||||
},
|
||||
created() {
|
||||
},
|
||||
mounted() {
|
||||
this.reload();
|
||||
},
|
||||
methods: {
|
||||
async reload() {
|
||||
var code = 123;
|
||||
var url = "https://dev.themblem.com/api/product-info/" + code + "/api/properties";
|
||||
url = 'http://localhost:8000/api/product-info/c3170586095/api/properties/';
|
||||
var r = await fetch(url);
|
||||
var info = await r.json();
|
||||
console.log(info);
|
||||
this.info = info;
|
||||
},
|
||||
changeBtn(index) {
|
||||
this.active = index
|
||||
},
|
||||
goDetails(index) {
|
||||
location.href = "img_details.html?index=" + index
|
||||
},
|
||||
goPageZfsy() {
|
||||
// location.href=this.zfsy_url
|
||||
},
|
||||
showImg(e) {
|
||||
let url = e.currentTarget.dataset.url
|
||||
vant.ImagePreview({
|
||||
images: [url],
|
||||
startPosition: 0
|
||||
});
|
||||
},
|
||||
previewReport() {
|
||||
let reports = this.reports
|
||||
vant.ImagePreview({
|
||||
images: reports,
|
||||
startPosition: 0
|
||||
});
|
||||
},
|
||||
}
|
||||
})
|
||||