|
|
<template>
|
|
|
<view class="indexPage">
|
|
|
<image class="indexBG" :src="Config.imgUrl + 'trace/fake/mould1/indexBG.png'" mode="aspectFill"></image>
|
|
|
<view class="main">
|
|
|
<view class="brand">
|
|
|
<image class="brandImg" src="@/trace/static/fake/mould1/brandImg.png" mode="widthFix"></image>
|
|
|
</view>
|
|
|
<view class="card">
|
|
|
<view class="cardTitle">
|
|
|
<text>防伪查询验证</text>
|
|
|
</view>
|
|
|
<view class="cardBody">
|
|
|
<text>请输入防伪码或扫码识别验证</text>
|
|
|
<view class="inputBox">
|
|
|
<input type="text" v-model="code" placeholder="请输入防伪码"/>
|
|
|
<view class="scanBox">
|
|
|
<image class="scanIcon" src="@/trace/static/scanIcon.png" mode="aspectFill"></image>
|
|
|
<!-- <uni-icons type="scan" color="#FFFFFF" size="34" style="margin: 0;"></uni-icons> -->
|
|
|
</view>
|
|
|
</view>
|
|
|
<button class="checkBtn" @click="verifyCode">立即验证</button>
|
|
|
<view class="tips">
|
|
|
<text>1. 名创优品防伪验证，扫描包装盒的防伪码即可打开验证页面，刮开涂层输入验证码进行验证。</text>
|
|
|
<text>2. 名创优品用正版授权+亲民价格的战略打法，颠覆了动漫IP周边产品开发的传统模式和价格生态。不断创新门店消费场景，以IP场景带动产品销售，释放IP潮流消费活力，打造独特的“IP乐园”。 </text>
|
|
|
<text>品牌也借助这些全球顶级IP的影响力进一步扩大了自身在全世界范围内的知名度和美誉度。</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<verifyPopup ref="verifyPopup"></verifyPopup>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import verifyPopup from './components/verifyPopup.vue';
|
|
|
import Config from '@/common/js/config.js';
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
Config,
|
|
|
code:'',
|
|
|
}
|
|
|
},
|
|
|
components:{
|
|
|
verifyPopup
|
|
|
},
|
|
|
methods: {
|
|
|
verifyCode(){
|
|
|
// this.$util.redirectTo('./success')
|
|
|
this.$refs.verifyPopup.open()
|
|
|
// uni.showModal({
|
|
|
// title: '温馨提示',
|
|
|
// content: '防伪码验证失败，谨防假冒！',
|
|
|
// showCancel: false,
|
|
|
|
|
|
// })
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
.indexPage{
|
|
|
width: 100%;
|
|
|
height: 100vh;
|
|
|
position: relative;
|
|
|
.indexBG{
|
|
|
position: absolute;
|
|
|
top: 0;
|
|
|
left: 0;
|
|
|
width: 100%;
|
|
|
height: 100vh;
|
|
|
display: block;
|
|
|
}
|
|
|
}
|
|
|
.main{
|
|
|
position: relative;
|
|
|
z-index: 10;
|
|
|
width: 100%;
|
|
|
padding-top: 100rpx;
|
|
|
.brand{
|
|
|
width: 100%;
|
|
|
text-align: center;
|
|
|
.brandImg{
|
|
|
width: 154rpx;
|
|
|
height: auto;
|
|
|
}
|
|
|
}
|
|
|
.card{
|
|
|
margin: 66rpx 26rpx;
|
|
|
background: rgba(255,255,255,0.8);
|
|
|
border-radius: 28rpx;
|
|
|
border: 2rpx solid #FFFFFF;
|
|
|
box-sizing: border-box;
|
|
|
padding: 26rpx;
|
|
|
.cardTitle{
|
|
|
padding-bottom: 26rpx;
|
|
|
@include fontStyle(34rpx,#000000,center,bold,48rpx);
|
|
|
}
|
|
|
.cardBody{
|
|
|
@include fontStyle(28rpx,#000000,left,400,48rpx);
|
|
|
.inputBox{
|
|
|
margin: 16rpx 0;
|
|
|
width: 100%;
|
|
|
height: 96rpx;
|
|
|
background: #FFFFFF;
|
|
|
border-radius: 18rpx 18rpx 18rpx 18rpx;
|
|
|
border: 2rpx solid #D6000F;
|
|
|
|
|
|
@include flexBox(between,center);
|
|
|
box-sizing: border-box;
|
|
|
padding-left: 16rpx;
|
|
|
input{
|
|
|
flex: 1;
|
|
|
height: 100%;
|
|
|
@include fontStyle(28rpx,#000000,left,400,38rpx);
|
|
|
}
|
|
|
.scanBox{
|
|
|
width: 92rpx;
|
|
|
height: 92rpx;
|
|
|
background: #D6000F;
|
|
|
border-radius: 0rpx 18rpx 18rpx 0rpx;
|
|
|
@include flexBox();
|
|
|
.scanIcon{
|
|
|
width: 56rpx;
|
|
|
height: 56rpx;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.checkBtn{
|
|
|
width: 626rpx;
|
|
|
height: 92rpx;
|
|
|
background: #D6000F;
|
|
|
border-radius: 18rpx 18rpx 18rpx 18rpx;
|
|
|
font-weight: 500;
|
|
|
font-size: 33rpx;
|
|
|
color: #FFFFFF;
|
|
|
@include flexBox();
|
|
|
margin: 26rpx 0;
|
|
|
}
|
|
|
.tips{
|
|
|
@include fontStyle(24rpx,#666666,left,400,40rpx);
|
|
|
text{
|
|
|
display: block;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
}
|
|
|
</style>
|
