前端完成，扫码待优化
parent
263421326a
commit
6003bcc555
|
|
@ -7,32 +7,27 @@
|
|||
<meta name="keywords" content="" />
|
||||
<meta name="description" content="" />
|
||||
<!-- css加载 -->
|
||||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<link rel="stylesheet" href="./css/common.css">
|
||||
<link rel="stylesheet" href="./css/style.css">
|
||||
<!-- js加载 -->
|
||||
<script src="../js/jquery-3.6.1.min.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/base.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/script.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="./js/jquery-3.6.1.min.js" type="text/javascript"></script>
|
||||
<script src="./js/base.js" type="text/javascript"></script>
|
||||
<script src="./js/script.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<body>
|
||||
<!-- 头部 -->
|
||||
<div class="header background-00 color-ff flex">
|
||||
<div class="header-back flex">
|
||||
<!-- <img src="../images/icon/icon-back.png" alt="返回" onclick="window.history.go(-1)"> -->
|
||||
<div class="header background-00 color-ff font38 flex">手机号绑定</div>
|
||||
<!-- 内容 -->
|
||||
<div class="bind-content border-box">
|
||||
<!-- 标题 -->
|
||||
<div class="bind-phone-title font36">手机号绑定</div>
|
||||
<!-- 手机号 -->
|
||||
<div class="phone">
|
||||
<div class="sub-title color-99 font30">手机号</div>
|
||||
<input class="phone-input font30" type="number" placeholder="请输入手机号">
|
||||
</div>
|
||||
<div class="header-title font38">手机号绑定</div>
|
||||
</div>
|
||||
<!-- 内容 -->
|
||||
<div class="bind-content border-box">
|
||||
<!-- 标题 -->
|
||||
<div class="bind-phone-title font36">手机号绑定</div>
|
||||
<!-- 手机号 -->
|
||||
<div class="phone">
|
||||
<div class="sub-title color-99 font30">手机号</div>
|
||||
<input class="phone-input font30" type="number" placeholder="请输入手机号">
|
||||
</div>
|
||||
<!-- 提交 -->
|
||||
<div class="bind-btn radius25 background-f35 color-ff font36 flex">立即绑定</div>
|
||||
</div>
|
||||
<!-- 提交 -->
|
||||
<div class="bind-btn radius25 background-f35 color-ff font36 flex">立即绑定</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,44 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport"
|
||||
content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
|
||||
<title>活动领券</title>
|
||||
<meta name="keywords" content="" />
|
||||
<meta name="description" content="" />
|
||||
<!-- css加载 -->
|
||||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<!-- js加载 -->
|
||||
<script src="../js/jquery-3.6.1.min.js" type="text/javascript"></script>
|
||||
<script src="../js/base.js" type="text/javascript"></script>
|
||||
<script src="../js/script.js" type="text/javascript"></script>
|
||||
<script src="../js/jsQR.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<body>
|
||||
<!-- 头部 -->
|
||||
<div class="header background-00 color-ff font38 flex">活动领券</div>
|
||||
<!-- 扫码 -->
|
||||
<canvas id="qr-canvas"></canvas>
|
||||
<video id="v" autoplay></video>
|
||||
<script src="../js/qrcode.js" type="text/javascript"></script>
|
||||
<script src="../js/scan.js" type="text/javascript"></script>
|
||||
|
||||
<!-- 尾部 -->
|
||||
<div class="footer background-ff border-box">
|
||||
<div class="foot foot-business font24 flex">
|
||||
<a href="index.html" class="item flex active">
|
||||
<img src="../images/icon/icon-tabbar-05.png" alt="核销">
|
||||
<img src="../images/icon/icon-active-05.png" alt="核销">
|
||||
<span>核销</span>
|
||||
</a>
|
||||
<a href="my.html" class="item flex">
|
||||
<img src="../images/icon/icon-tabbar-04.png" alt="我的">
|
||||
<img src="../images/icon/icon-active-04.png" alt="我的">
|
||||
<span>我的</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,44 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport"
|
||||
content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
|
||||
<title>活动领券</title>
|
||||
<meta name="keywords" content="" />
|
||||
<meta name="description" content="" />
|
||||
<!-- css加载 -->
|
||||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<!-- js加载 -->
|
||||
<script src="../js/jquery-3.6.1.min.js" type="text/javascript"></script>
|
||||
<script src="../js/base.js" type="text/javascript"></script>
|
||||
<script src="../js/script.js" type="text/javascript"></script>
|
||||
<script src="../js/jsQR.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<body>
|
||||
<!-- 头部 -->
|
||||
<div class="header background-00 color-ff font38 flex">活动领券</div>
|
||||
<!-- 扫码 -->
|
||||
<canvas id="qr-canvas"></canvas>
|
||||
<video id="v" autoplay></video>
|
||||
<script src="../js/qrcode.js" type="text/javascript"></script>
|
||||
<script src="../js/scan.js" type="text/javascript"></script>
|
||||
|
||||
<!-- 尾部 -->
|
||||
<div class="footer background-ff border-box">
|
||||
<div class="foot foot-business font24 flex">
|
||||
<a href="index.html" class="item flex active">
|
||||
<img src="../images/icon/icon-tabbar-05.png" alt="核销">
|
||||
<img src="../images/icon/icon-active-05.png" alt="核销">
|
||||
<span>核销</span>
|
||||
</a>
|
||||
<a href="my.html" class="item flex">
|
||||
<img src="../images/icon/icon-tabbar-04.png" alt="我的">
|
||||
<img src="../images/icon/icon-active-04.png" alt="我的">
|
||||
<span>我的</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,55 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
|
||||
<title>我的</title>
|
||||
<meta name="keywords" content="" />
|
||||
<meta name="description" content="" />
|
||||
<!-- css加载 -->
|
||||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<!-- js加载 -->
|
||||
<script src="../js/jquery-3.6.1.min.js" type="text/javascript"></script>
|
||||
<script src="../js/base.js" type="text/javascript"></script>
|
||||
<script src="../js/script.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<body>
|
||||
<!-- 头部 -->
|
||||
<div class="header background-00 color-ff font38 flex">我的</div>
|
||||
<!-- 个人中心简介 -->
|
||||
<div class="my-info-bg flex">
|
||||
<div class="my-info color-ff">
|
||||
<div class="cover radius100 background-ff flex"><img src="../images/logo.png" alt="头像"></div>
|
||||
<div class="nick-name font30">CREEP <span>(商家)</span></div>
|
||||
<div class="bind-phone font24">绑定手机：13438123836</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 个人中心内容 -->
|
||||
<div class="my-content border-box">
|
||||
<a href="used.html" class="item flex">
|
||||
<span class="flex">
|
||||
<img src="../images/icon/icon-my-03.png" alt="已使用卡券" style="width: .52rem;height: .39rem;">
|
||||
</span>
|
||||
<p class="font24">已使用卡券</p>
|
||||
<img src="../images/icon/icon-arrow-right.png" alt="更多">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- 尾部 -->
|
||||
<div class="footer background-ff border-box">
|
||||
<div class="foot foot-business font24 flex">
|
||||
<a href="index.html" class="item flex">
|
||||
<img src="../images/icon/icon-tabbar-05.png" alt="核销">
|
||||
<img src="../images/icon/icon-active-05.png" alt="核销">
|
||||
<span>核销</span>
|
||||
</a>
|
||||
<a href="my.html" class="item flex active">
|
||||
<img src="../images/icon/icon-tabbar-04.png" alt="我的">
|
||||
<img src="../images/icon/icon-active-04.png" alt="我的">
|
||||
<span>我的</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,100 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
|
||||
<title>已使用卡券</title>
|
||||
<meta name="keywords" content="" />
|
||||
<meta name="description" content="" />
|
||||
<!-- css加载 -->
|
||||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<!-- js加载 -->
|
||||
<script src="../js/jquery-3.6.1.min.js" type="text/javascript"></script>
|
||||
<script src="../js/base.js" type="text/javascript"></script>
|
||||
<script src="../js/script.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<body>
|
||||
<!-- 头部 -->
|
||||
<div class="header background-00 color-ff font38 flex">已使用卡券</div>
|
||||
<!-- 待使用卡券 -->
|
||||
<div class="card-list card-list-business border-box">
|
||||
<div class="item radius30 border-box flex">
|
||||
<div class="info flex">
|
||||
<div class="price color-ae font120">100<span class="background-ae radius100 font24 color-ff">元</span></div>
|
||||
<div class="txt used-txt">
|
||||
<span class="font48">消费券</span>
|
||||
<p class="font24 color-af">有效期至：2021.03.02</p>
|
||||
<p class="font24 color-af clips1">使用商家：掌中宝串串</p>
|
||||
<p class="copy font24 color-af flex">
|
||||
券码后6位：asdfgh
|
||||
<span class="copy-btn color-83">复制完整劵码<em>111</em></span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item radius30 border-box flex">
|
||||
<div class="info flex">
|
||||
<div class="price color-ae font120">100<span class="background-ae radius100 font24 color-ff">元</span></div>
|
||||
<div class="txt used-txt">
|
||||
<span class="font48">消费券</span>
|
||||
<p class="font24 color-af">有效期至：2021.03.02</p>
|
||||
<p class="font24 color-af clips1">使用商家：无</p>
|
||||
<p class="copy font24 color-af flex">
|
||||
券码后6位：asdfgh
|
||||
<span class="copy-btn color-83">复制完整劵码<em>222</em></span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item radius30 border-box flex">
|
||||
<div class="info flex">
|
||||
<div class="price color-ae font120">100<span class="background-ae radius100 font24 color-ff">元</span></div>
|
||||
<div class="txt used-txt">
|
||||
<span class="font48">消费券</span>
|
||||
<p class="font24 color-af">有效期至：2021.03.02</p>
|
||||
<p class="font24 color-af clips1">使用商家：无</p>
|
||||
<p class="copy font24 color-af flex">
|
||||
券码后6位：asdfgh
|
||||
<span class="copy-btn color-83">复制完整劵码<em>333</em></span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item radius30 border-box flex">
|
||||
<div class="info flex">
|
||||
<div class="price color-ae font120">100<span class="background-ae radius100 font24 color-ff">元</span></div>
|
||||
<div class="txt used-txt">
|
||||
<span class="font48">消费券</span>
|
||||
<p class="font24 color-af">有效期至：2021.03.02</p>
|
||||
<p class="font24 color-af clips1">使用商家：无</p>
|
||||
<p class="copy font24 color-af flex">
|
||||
券码后6位：asdfgh
|
||||
<span class="copy-btn color-83">复制完整劵码<em>444</em></span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 弹窗背景 -->
|
||||
<div class="pull-bg"></div>
|
||||
<!-- 复制成功提示 -->
|
||||
<div class="copy-tips font24 background-ff radius20">复制成功</div>
|
||||
|
||||
<!-- 尾部 -->
|
||||
<div class="footer background-ff border-box">
|
||||
<div class="foot foot-business font24 flex">
|
||||
<a href="index.html" class="item flex">
|
||||
<img src="../images/icon/icon-tabbar-05.png" alt="核销">
|
||||
<img src="../images/icon/icon-active-05.png" alt="核销">
|
||||
<span>核销</span>
|
||||
</a>
|
||||
<a href="my.html" class="item flex active">
|
||||
<img src="../images/icon/icon-tabbar-04.png" alt="我的">
|
||||
<img src="../images/icon/icon-active-04.png" alt="我的">
|
||||
<span>我的</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -90,12 +90,15 @@ button,input,select,textarea {
|
|||
.font90{ font-size: .90rem;}
|
||||
.font100{ font-size: 1.0rem;}
|
||||
.font110{ font-size: 1.1rem;}
|
||||
.font120{ font-size: 1.2rem;}
|
||||
|
||||
/* 文字颜色 */
|
||||
.color-ff{ color: #ffffff;}
|
||||
.color-af{ color: #afafaf;}
|
||||
.color-99{ color: #999999;}
|
||||
.color-93{ color: #939393;}
|
||||
.color-ae{ color: #aeaeae;}
|
||||
.color-83{ color: #838383;}
|
||||
.color-86{ color: #868686;}
|
||||
.color-66{ color: #666666;}
|
||||
.color-00{ color: #000000;}
|
||||
|
|
|
|||
137
css/style.css
137
css/style.css
|
|
@ -1,5 +1,6 @@
|
|||
/* 头部 */
|
||||
.header {
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 7.5rem;
|
||||
height: .94rem;
|
||||
|
|
@ -9,24 +10,6 @@
|
|||
z-index: 99;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.header-back {
|
||||
justify-content: center;
|
||||
width: .6rem;
|
||||
height: .4rem;
|
||||
}
|
||||
|
||||
.header-back>img {
|
||||
width: .4rem;
|
||||
height: .4rem;
|
||||
}
|
||||
|
||||
.header-title {
|
||||
width: calc(100% - 1.2rem);
|
||||
line-height: 1.2;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 尾部 */
|
||||
.footer {
|
||||
width: 7.5rem;
|
||||
|
|
@ -54,6 +37,10 @@
|
|||
width: 25%;
|
||||
}
|
||||
|
||||
.foot-business>.item{
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.foot>.item img {
|
||||
height: .34rem;
|
||||
margin-top: .06rem;
|
||||
|
|
@ -66,7 +53,7 @@
|
|||
.foot>.item span {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin-top: .06rem;
|
||||
margin-top: .02rem;
|
||||
}
|
||||
|
||||
.foot>.item.active img:nth-of-type(1) {
|
||||
|
|
@ -148,11 +135,11 @@
|
|||
|
||||
@keyframes scale_name {
|
||||
from {
|
||||
transform: scale(.95);
|
||||
transform: scale(.9);
|
||||
}
|
||||
|
||||
to {
|
||||
transform: scale(1.05);
|
||||
transform: scale(1.1);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -372,6 +359,68 @@
|
|||
height: .5rem;
|
||||
}
|
||||
|
||||
/* 商家详情 */
|
||||
.detail-info{
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: .3rem .5rem;
|
||||
border-top: .16rem solid #ffd6ac;
|
||||
border-bottom: .16rem solid #ffd6ac;
|
||||
}
|
||||
.detail-info>.cover{
|
||||
width: 1.3rem;
|
||||
height: 1.3rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
.detail-info>.cover img{
|
||||
width: 100%;
|
||||
min-height: 1.3rem;
|
||||
}
|
||||
.detail-info>.txt{
|
||||
width: calc(100% - 1.65rem);
|
||||
}
|
||||
.detail-info>.txt p{
|
||||
margin-top: .15rem;
|
||||
}
|
||||
/* 标题 */
|
||||
.detail-title{
|
||||
padding: .2rem .4rem;
|
||||
margin-top: .2rem;
|
||||
}
|
||||
/* 介绍 */
|
||||
.detail{
|
||||
padding: 0 .4rem;
|
||||
}
|
||||
.detail img{
|
||||
max-width: 100%;
|
||||
margin: .1rem auto;
|
||||
}
|
||||
/* 地址 */
|
||||
.address{
|
||||
padding: 0 .4rem;
|
||||
}
|
||||
.addr-map{
|
||||
width: 100%;
|
||||
height: 4rem;
|
||||
}
|
||||
.addr-txt{
|
||||
margin: .3rem 0;
|
||||
}
|
||||
.addr-txt .item{
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: .64rem;
|
||||
}
|
||||
.addr-txt .item p{
|
||||
width: calc(100% - 0.48rem);
|
||||
}
|
||||
.addr-txt .item span{
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: .38rem;
|
||||
height: .38rem;
|
||||
}
|
||||
|
||||
/* 我的 */
|
||||
.my-info-bg {
|
||||
|
|
@ -478,6 +527,41 @@
|
|||
.card-list .item>.info {
|
||||
width: calc(100% - 1.12rem);
|
||||
}
|
||||
.card-list-business .item{
|
||||
padding: .3rem .25rem;
|
||||
}
|
||||
.card-list-business .item>.info {
|
||||
width: 100%;
|
||||
}
|
||||
.card-list-business .item>.info .txt{
|
||||
min-width: 3.78rem;
|
||||
}
|
||||
.card-list-business .item>.info .copy{
|
||||
justify-content: space-between;
|
||||
}
|
||||
.card-list-business .item .copy-btn>em{
|
||||
display: block;
|
||||
width: 0;
|
||||
height: 0;
|
||||
overflow: hidden;
|
||||
position: fixed;
|
||||
top: -5rem;
|
||||
right: -5rem;
|
||||
}
|
||||
|
||||
/* 复制成功提示 */
|
||||
.copy-tips{
|
||||
display: none;
|
||||
padding: .15rem .3rem;
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
z-index: 999;
|
||||
transform: translate(-50%,-50%);
|
||||
}
|
||||
.copy-tips.show{
|
||||
display: block;
|
||||
}
|
||||
|
||||
.card-list .item>.info .price {
|
||||
margin-right: .3rem;
|
||||
|
|
@ -572,3 +656,14 @@
|
|||
align-items: center;
|
||||
height: .98rem;
|
||||
}
|
||||
|
||||
/* 扫码 */
|
||||
#qr-canvas{
|
||||
width: 6rem;
|
||||
height: 6rem;
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
z-index: 9;
|
||||
transform: translate(-50%,-50%);
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 158 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 211 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.9 KiB |
|
|
@ -0,0 +1,136 @@
|
|||
//先要加载接口，要在函数外，保证先加载
|
||||
document.write('<script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=O4aFVMSLVl1aiTX2sF40aVfC"></script>');
|
||||
//显示地图
|
||||
//参数：显示容器ID，属性(city,addr,title,lawfirm,tel,user,mapx,pic,ismove,piobj,zoom)
|
||||
function ShowMap(objname,options){
|
||||
if(options){
|
||||
this._city = options.city ? options.city : ""; //城市
|
||||
this._addr = options.addr ? options.addr : ""; //地址
|
||||
this._title = options.title ? options.title : ""; //信息窗口标题
|
||||
this._lawfirm = options.lawfirm ? options.lawfirm : ""; //律所
|
||||
this._tel = options.tel ? options.tel : ""; //电话
|
||||
this._user = options.user ? options.user : ""; //主任
|
||||
this._mapx = options.mapx ? options.mapx : ""; //地图坐标
|
||||
this._pic = options.pic ? options.pic : ""; //图片
|
||||
this._ismove = options.ismove ? options.ismove : "0"; //是否拖动，1为拖动为设置标注，0为显示。默认0
|
||||
this._piobj = options.piobj ? options.piobj : ""; //接收拖动坐标的表单ID
|
||||
this._zoom = options.zoom ? options.zoom : "14"; //放大级别，默认14
|
||||
}
|
||||
//设定初始坐标
|
||||
var point=new BMap.Point(113.63156,34.83794);
|
||||
//范围为3-18级
|
||||
var zoom=this._zoom;
|
||||
|
||||
//创建地图
|
||||
var map = new BMap.Map(objname);
|
||||
//map.enableScrollWheelZoom();
|
||||
var opts = {type: BMAP_NAVIGATION_CONTROL_ZOOM};
|
||||
map.addControl(new BMap.NavigationControl(opts));
|
||||
map.centerAndZoom(point, zoom);//设初始化地图。
|
||||
//设置版权控件位置
|
||||
var cr = new BMap.CopyrightControl({anchor: BMAP_ANCHOR_TOP_LEFT});
|
||||
map.addControl(cr); //添加版权控件
|
||||
var bs = map.getBounds(); //返回地图可视区域
|
||||
//坐标不为空时按坐标显示
|
||||
if (this._mapx != ""){
|
||||
var mx=this._mapx.substr(0,this._mapx.indexOf(","));
|
||||
var my=this._mapx.substr(this._mapx.indexOf(",")+1);
|
||||
point=new BMap.Point(mx,my);
|
||||
map.centerAndZoom(point, zoom); //重新调整位置
|
||||
}
|
||||
//否则按地址显示
|
||||
else if (this._addr != ""){
|
||||
//创建地址解析器实例
|
||||
var myGeo = new BMap.Geocoder();
|
||||
//将地址解析结果显示在地图上，并调整地图视野。此过程为异步，所以要重设标注
|
||||
myGeo.getPoint(this._addr, function(poi){
|
||||
map.centerAndZoom(poi, zoom);
|
||||
marker.setPosition(poi); //重调标注位置
|
||||
}, this._city);
|
||||
}
|
||||
//否则按城市显示
|
||||
else if (this._city != ""){
|
||||
map.setCenter(this._city); //设置地图中心点。
|
||||
//此定位无具体坐标，所以显示模式时要清除标注。要延时处理
|
||||
if (this._ismove=="0"){setTimeout(function(){map.clearOverlays();}, 1000);}
|
||||
}
|
||||
//都为空按IP定位
|
||||
else{
|
||||
//创建一个获取本地城市位置的实例
|
||||
var myCity = new BMap.LocalCity();
|
||||
//获取城市
|
||||
myCity.get(function(result){map.setCenter(result.name);});
|
||||
if (this._ismove=="0"){setTimeout(function(){map.clearOverlays();}, 1000);}
|
||||
}
|
||||
|
||||
var icowidth = 20;
|
||||
var icoheight = 27;
|
||||
var myIcon = new BMap.Icon("../images/icon/icomap.png", new BMap.Size(icowidth,icoheight));
|
||||
//创建标注
|
||||
var marker = new BMap.Marker(point,{icon:myIcon});
|
||||
//var marker = new BMap.Marker(point);
|
||||
map.addOverlay(marker); // 将标注添加到地图中
|
||||
|
||||
//设置标注时
|
||||
if (this._ismove=="1"){
|
||||
marker.enableDragging(); //可拖拽
|
||||
var label = new BMap.Label("拖拽到您的位置",{offset:new BMap.Size(20,-15)});
|
||||
label.setStyle({ backgroundColor:"red", color:"white", fontSize : "12px" });
|
||||
marker.setLabel(label);
|
||||
var poj=this._piobj; //过程里不支持this，要传给变量
|
||||
|
||||
//拖拽设置位置
|
||||
marker.addEventListener("dragend", function(e){
|
||||
try{document.getElementById(poj).value = e.point.lng + "," + e.point.lat;}catch (ex) {}
|
||||
});
|
||||
//点击设置位置
|
||||
map.addEventListener("click", function(e){
|
||||
marker.setPosition(e.point); //重调标注位置
|
||||
try{document.getElementById(poj).value = e.point.lng + "," + e.point.lat;}catch (ex) {}
|
||||
});
|
||||
}
|
||||
//显示标注时
|
||||
if (this._ismove=="0"){
|
||||
marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
|
||||
|
||||
//显示窗口设置
|
||||
var opts = {width:250,height:110,title : "<font color=#de0011 size=3>" + this._title + "</font>"} //窗口标题
|
||||
var infotxt="<table border='0'><tr><td valign='top'>"; //窗口内容
|
||||
if (this._pic != ""){infotxt += "<img src='"+this._pic+"' id='picid' style='float:left;margin-right:5px;padding-top:8px; width=50>";}
|
||||
infotxt += "</td><td><p style='font-size:12px;line-height:16px;padding-top:8px;'>";
|
||||
// if (this._lawfirm !=""){infotxt += "<b>公司：</b>" + this._lawfirm + "<br/>";};
|
||||
if (this._addr !=""){infotxt += "<b>地址：</b>" + this._addr + "<br/>";};
|
||||
if (this._tel !=""){infotxt += "<b>电话：</b>" + this._tel + "<br/>";};
|
||||
if (this._user !=""){infotxt += "<b>联系人：</b>" + this._user + "<br/>";};
|
||||
infotxt += "</p></td></tr></table>";
|
||||
|
||||
//显示文本标题
|
||||
var label2 = new BMap.Label(this._title,{offset:new BMap.Size(20,-15)});
|
||||
label2.setStyle({ backgroundColor:"red", color:"white", fontSize : "12px" });
|
||||
//marker.setLabel(label2);
|
||||
//创建信息窗口
|
||||
var infoWindow = new BMap.InfoWindow(infotxt,opts);
|
||||
marker.addEventListener("mouseover", function(){
|
||||
this.openInfoWindow(infoWindow);
|
||||
//图片加载完毕重绘infowindow。防止在网速较慢，图片未加载时，生成的信息框高度比图片的总高度小，导致图片部分被隐藏
|
||||
document.getElementById('picid').onload = function (){infoWindow.redraw();}
|
||||
});
|
||||
}
|
||||
}
|
||||
//获取地理位置,间隔符
|
||||
//百度查询接口为异步，所以这里要用异步回调方式
|
||||
function getBDAddress(callBackFun,spStr){
|
||||
if (!spStr){spStr="";} //分隔符，默认空
|
||||
var geolocation = new BMap.Geolocation();
|
||||
geolocation.getCurrentPosition(function(r){
|
||||
if(this.getStatus() == BMAP_STATUS_SUCCESS){
|
||||
var point = new BMap.Point(r.point.lng,r.point.lat);
|
||||
var gc = new BMap.Geocoder();
|
||||
gc.getLocation(point, function(rs){
|
||||
var addComp = rs.addressComponents;
|
||||
var addVal = addComp.province + spStr + addComp.city + spStr + addComp.district + spStr + addComp.street + spStr + addComp.streetNumber;
|
||||
callBackFun(addVal);
|
||||
});
|
||||
}
|
||||
},{enableHighAccuracy: true})
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,92 @@
|
|||
//是否成功调用getUserMedia标识
|
||||
var gUM = false;
|
||||
|
||||
//画布getContext对象
|
||||
var gCtx = null;
|
||||
|
||||
// 数据流对象
|
||||
var imageData = null;
|
||||
|
||||
//视频展示对象
|
||||
var v = document.getElementById("v");
|
||||
var n = navigator;
|
||||
|
||||
// 画布元素
|
||||
var gCanvas = document.getElementById("qr-canvas");
|
||||
gCtx = gCanvas.getContext('2d');
|
||||
qrcode.callback = function(e) {
|
||||
//结果回调
|
||||
alert(e);
|
||||
}
|
||||
|
||||
//不同getUserMedia处理
|
||||
if (n.getUserMedia) {
|
||||
// 移动设备打开后置摄像头【 facingMode: "environment"】
|
||||
n.getUserMedia({
|
||||
video: {
|
||||
facingMode: "environment"
|
||||
}
|
||||
}, success, error);
|
||||
} else if (n.mediaDevices.getUserMedia) {
|
||||
n.mediaDevices.getUserMedia({
|
||||
video: {
|
||||
facingMode: "environment"
|
||||
},
|
||||
audio: false
|
||||
})
|
||||
.then(success)
|
||||
.catch(error);
|
||||
} else if (n.webkitGetUserMedia) {
|
||||
webkit = true;
|
||||
n.webkitGetUserMedia({
|
||||
video: {
|
||||
facingMode: "environment"
|
||||
}
|
||||
}, success, error);
|
||||
} else if (n.mozGetUserMedia) {
|
||||
moz = true;
|
||||
n.mozGetUserMedia({
|
||||
video: {
|
||||
facingMode: "environment"
|
||||
}
|
||||
}, success, error);
|
||||
}
|
||||
|
||||
//getUserMedia调用成功
|
||||
function success(stream) {
|
||||
v = document.getElementById("v");
|
||||
try {
|
||||
v.srcObject = stream;
|
||||
} catch {
|
||||
//这里是兼容写法
|
||||
let compatibleURL = window.URL || window.webkitURL;
|
||||
v.src = compatibleURL.createObjectURL(stream);
|
||||
}
|
||||
gUM = true;
|
||||
setTimeout(captureToCanvas, 500);
|
||||
}
|
||||
|
||||
//getUserMedia调用失败
|
||||
function error(error) {
|
||||
alert(error)
|
||||
gUM = false;
|
||||
return;
|
||||
}
|
||||
|
||||
//将视频流放到画布
|
||||
function captureToCanvas() {
|
||||
if (gUM) {
|
||||
gCtx.drawImage(v, 0, 0);
|
||||
setTimeout(captureToCanvas, 500);
|
||||
imageData = gCtx.getImageData(0, 0, 600, 600);
|
||||
const code = jsQR(imageData.data, imageData.width, imageData.height, {
|
||||
inversionAttempts: "dontInvert",
|
||||
});
|
||||
alert('code.data:' + code.data);
|
||||
if (code) {
|
||||
window.location.href = code.data;
|
||||
} else {
|
||||
alert("识别错误")
|
||||
}
|
||||
}
|
||||
}
|
||||
33
js/script.js
33
js/script.js
|
|
@ -50,8 +50,17 @@ jQuery(function($){
|
|||
if($('.navigation-btn').length){
|
||||
// 打开弹窗
|
||||
$('.navigation-btn').click(function(){
|
||||
// 高德地图
|
||||
window.open('http://uri.amap.com/marker?position=104.098515,30.763954&name=万圣家园B区&coordinate=gaode&callnative=1')
|
||||
// 百度地图(纬度，经度)
|
||||
window.open('http://api.map.baidu.com/marker?location=30.763954,104.098515&title=万圣家园B区&content=居民小区&output=html')
|
||||
});
|
||||
}
|
||||
|
||||
// 详情页导航
|
||||
if($('.addr-item-btn').length){
|
||||
// 打开弹窗
|
||||
$('.addr-item-btn').click(function(){
|
||||
// 百度地图(纬度，经度)
|
||||
window.open('http://api.map.baidu.com/marker?location=30.763954,104.098515&title=万圣家园B区&content=居民小区&output=html')
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -68,4 +77,24 @@ jQuery(function($){
|
|||
$('.card-window').removeClass('show');
|
||||
});
|
||||
}
|
||||
|
||||
// 复制完整券码
|
||||
if($('.copy-btn').length){
|
||||
$('.copy-btn').click(function() {
|
||||
var copyText = $(this).find('em').text(); //获取对象
|
||||
var oInput = document.createElement('input');//创建一个input标签
|
||||
oInput.value = copyText;//设置value属性
|
||||
document.body.appendChild(oInput);//挂载到body下面
|
||||
oInput.select(); // 选择对象
|
||||
document.execCommand("Copy"); // 执行浏览器复制命令
|
||||
oInput.className = 'oInput';
|
||||
oInput.style.display='none';
|
||||
$('.pull-bg').addClass('show');
|
||||
$('.copy-tips').addClass('show');
|
||||
setTimeout(function(){
|
||||
$('.pull-bg').removeClass('show');
|
||||
$('.copy-tips').removeClass('show');
|
||||
},1000)
|
||||
})
|
||||
}
|
||||
})
|
||||
|
|
@ -11,18 +11,13 @@
|
|||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<!-- js加载 -->
|
||||
<script src="../js/jquery-3.6.1.min.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/base.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/script.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/jquery-3.6.1.min.js" type="text/javascript"></script>
|
||||
<script src="../js/base.js" type="text/javascript"></script>
|
||||
<script src="../js/script.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<body>
|
||||
<!-- 头部 -->
|
||||
<div class="header background-00 color-ff flex">
|
||||
<div class="header-back flex">
|
||||
<!-- <img src="../images/icon/icon-back.png" alt="返回" onclick="window.history.go(-1)"> -->
|
||||
</div>
|
||||
<div class="header-title font38">商家展示</div>
|
||||
</div>
|
||||
<div class="header background-00 color-ff font38 flex">商家展示</div>
|
||||
<!-- 商户搜索 -->
|
||||
<div class="search radius25 border-box flex">
|
||||
<input class="search-input font24" type="text" placeholder="商户搜索">
|
||||
|
|
@ -105,7 +100,7 @@
|
|||
</div>
|
||||
<!-- 尾部 -->
|
||||
<div class="footer background-ff border-box">
|
||||
<div class="foot flex">
|
||||
<div class="foot font24 flex">
|
||||
<a href="index.html" class="item flex">
|
||||
<img src="../images/icon/icon-tabbar-01.png" alt="首页">
|
||||
<img src="../images/icon/icon-active-01.png" alt="首页">
|
||||
|
|
|
|||
|
|
@ -3,29 +3,75 @@
|
|||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
|
||||
<title>抽奖</title>
|
||||
<title>商家详情</title>
|
||||
<meta name="keywords" content="" />
|
||||
<meta name="description" content="" />
|
||||
<!-- css加载 -->
|
||||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<!-- js加载 -->
|
||||
<script src="../js/jquery-3.6.1.min.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/base.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/script.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/jquery-3.6.1.min.js" type="text/javascript"></script>
|
||||
<script src="../js/base.js" type="text/javascript"></script>
|
||||
<script src="../js/script.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<body>
|
||||
<!-- 头部 -->
|
||||
<div class="header background-00 color-ff flex">
|
||||
<div class="header-back flex">
|
||||
<!-- <img src="../images/icon/icon-back.png" alt="返回" onclick="window.history.go(-1)"> -->
|
||||
<div class="header background-00 color-ff font38 flex">商家详情</div>
|
||||
<!-- 商家概况 -->
|
||||
<div class="detail-info flex">
|
||||
<div class="cover radius30"><img src="../images/recommend.jpg" alt="商家详情"></div>
|
||||
<div class="txt">
|
||||
<h1 class="font30">深夜食堂-万安店</h1>
|
||||
<p class="font24 color-93">营业时间：07：30-22：00</p>
|
||||
</div>
|
||||
<div class="header-title font38">商家详情</div>
|
||||
</div>
|
||||
|
||||
<!-- 标题 -->
|
||||
<div class="detail-title font36 border-box"><strong>商家介绍</strong></div>
|
||||
<!-- 商家介绍 -->
|
||||
<div class="detail border-box">
|
||||
<div class="detail-txt font30">
|
||||
<p><img src="../images/detail-01.jpg" alt="商家介绍"></p>
|
||||
<p>黄山菜饭骨头汤(虹桥公馆店)位于苏州市昆山市商银路与溪桥路交汇处北标签: 餐饮 黄焖鸡店 快餐 中式快餐 餐馆 小吃 小吃快餐店 小吃快餐 推荐菜: 统一冰红茶 荷包蛋 卤蛋分类</p>
|
||||
<p><img src="../images/detail-02.jpg" alt="商家介绍"></p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 标题 -->
|
||||
<div class="detail-title font36 border-box"><strong>商家地址</strong></div>
|
||||
<!-- 商家地址 -->
|
||||
<div class="address border-box">
|
||||
<div class="addr-map" id="addr-map"></div>
|
||||
<div class="addr-txt">
|
||||
<div class="item addr-item-btn flex">
|
||||
<p class="font24"><strong>地址：四川省成都市天府新区华阳镇</strong></p>
|
||||
<span class="radius100 background-f35 flex">
|
||||
<img src="../images/icon/icon-addr.png" alt="导航" style="width: .26rem; height: .26rem;">
|
||||
</span>
|
||||
</div>
|
||||
<a class="item flex" href="tel:028-203029302">
|
||||
<p class="font24"><strong>联系电话：028-203029302</strong></p>
|
||||
<span class="radius100 background-f35 flex">
|
||||
<img src="../images/icon/icon-phone.png" alt="电话" style="width: .22rem; height: .22rem;">
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<script src="../js/bdmap.js" type="text/javascript"></script>
|
||||
<script type="text/javascript">
|
||||
ShowMap("addr-map",{
|
||||
city:'四川省',
|
||||
addr:'四川省成都市天府新区华阳镇',
|
||||
title:'深夜食堂-万安店',
|
||||
lawfirm:'深夜食堂-万安店',
|
||||
tel:'028-203029302',
|
||||
mapx:'',
|
||||
ismove:'0',
|
||||
piobj:'nxp',
|
||||
zoom:10
|
||||
});
|
||||
</script>
|
||||
<!-- 尾部 -->
|
||||
<div class="footer background-ff border-box">
|
||||
<div class="foot flex">
|
||||
<div class="foot font24 flex">
|
||||
<a href="index.html" class="item flex">
|
||||
<img src="../images/icon/icon-tabbar-01.png" alt="首页">
|
||||
<img src="../images/icon/icon-active-01.png" alt="首页">
|
||||
|
|
|
|||
|
|
@ -11,19 +11,14 @@
|
|||
<link rel="stylesheet" href="../css/style.css">
|
||||
<link rel="stylesheet" href="../css/swiper-bundle.min.css">
|
||||
<!-- js加载 -->
|
||||
<script src="../js/jquery-3.6.1.min.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/base.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/script.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/swiper-bundle.min.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/jquery-3.6.1.min.js" type="text/javascript"></script>
|
||||
<script src="../js/base.js" type="text/javascript"></script>
|
||||
<script src="../js/script.js" type="text/javascript"></script>
|
||||
<script src="../js/swiper-bundle.min.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<body>
|
||||
<!-- 头部 -->
|
||||
<div class="header background-00 color-ff flex">
|
||||
<div class="header-back flex">
|
||||
<!-- <img src="../images/icon/icon-back.png" alt="返回" onclick="window.history.go(-1)"> -->
|
||||
</div>
|
||||
<div class="header-title font38">活动领券</div>
|
||||
</div>
|
||||
<div class="header background-00 color-ff font38 flex">活动领券</div>
|
||||
<!-- 轮播图 -->
|
||||
<div class="banner">
|
||||
<div class="banner-swiper swiper">
|
||||
|
|
@ -107,7 +102,7 @@
|
|||
</div>
|
||||
<!-- 尾部 -->
|
||||
<div class="footer background-ff border-box">
|
||||
<div class="foot flex">
|
||||
<div class="foot font24 flex">
|
||||
<a href="index.html" class="item flex active">
|
||||
<img src="../images/icon/icon-tabbar-01.png" alt="首页">
|
||||
<img src="../images/icon/icon-active-01.png" alt="首页">
|
||||
|
|
|
|||
|
|
@ -10,18 +10,13 @@
|
|||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<!-- js加载 -->
|
||||
<script src="../js/jquery-3.6.1.min.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/base.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/script.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/jquery-3.6.1.min.js" type="text/javascript"></script>
|
||||
<script src="../js/base.js" type="text/javascript"></script>
|
||||
<script src="../js/script.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<body>
|
||||
<!-- 头部 -->
|
||||
<div class="header background-00 color-ff flex">
|
||||
<div class="header-back flex">
|
||||
<!-- <img src="../images/icon/icon-back.png" alt="返回" onclick="window.history.go(-1)"> -->
|
||||
</div>
|
||||
<div class="header-title font38">抽奖</div>
|
||||
</div>
|
||||
<div class="header background-00 color-ff font38 flex">抽奖</div>
|
||||
<!-- 内容 -->
|
||||
<div class="luck-draw">
|
||||
<div class="turntable-title">
|
||||
|
|
@ -43,7 +38,7 @@
|
|||
</div>
|
||||
<!-- 尾部 -->
|
||||
<div class="footer background-ff border-box">
|
||||
<div class="foot flex">
|
||||
<div class="foot font24 flex">
|
||||
<a href="index.html" class="item flex">
|
||||
<img src="../images/icon/icon-tabbar-01.png" alt="首页">
|
||||
<img src="../images/icon/icon-active-01.png" alt="首页">
|
||||
|
|
|
|||
26
user/my.html
26
user/my.html
|
|
@ -3,25 +3,20 @@
|
|||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
|
||||
<title>抽奖</title>
|
||||
<title>我的</title>
|
||||
<meta name="keywords" content="" />
|
||||
<meta name="description" content="" />
|
||||
<!-- css加载 -->
|
||||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<!-- js加载 -->
|
||||
<script src="../js/jquery-3.6.1.min.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/base.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/script.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/jquery-3.6.1.min.js" type="text/javascript"></script>
|
||||
<script src="../js/base.js" type="text/javascript"></script>
|
||||
<script src="../js/script.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<body>
|
||||
<!-- 头部 -->
|
||||
<div class="header background-00 color-ff flex">
|
||||
<div class="header-back flex">
|
||||
<!-- <img src="../images/icon/icon-back.png" alt="返回" onclick="window.history.go(-1)"> -->
|
||||
</div>
|
||||
<div class="header-title font38">我的</div>
|
||||
</div>
|
||||
<!-- 头部 -->
|
||||
<div class="header background-00 color-ff font38 flex">我的</div>
|
||||
<!-- 个人中心简介 -->
|
||||
<div class="my-info-bg flex">
|
||||
<div class="my-info color-ff">
|
||||
|
|
@ -32,13 +27,6 @@
|
|||
</div>
|
||||
<!-- 个人中心内容 -->
|
||||
<div class="my-content border-box">
|
||||
<a href="bind-phone.html" class="item flex">
|
||||
<span class="flex">
|
||||
<img src="../images/icon/icon-my-01.png" alt="绑定手机" style="width: .25rem;height: .38rem;">
|
||||
</span>
|
||||
<p class="font24">手机号绑定</p>
|
||||
<img src="../images/icon/icon-arrow-right.png" alt="更多">
|
||||
</a>
|
||||
<a href="not-used.html" class="item flex">
|
||||
<span class="flex">
|
||||
<img src="../images/icon/icon-my-02.png" alt="待使用卡券" style="width: .43rem;height: .43rem;">
|
||||
|
|
@ -57,7 +45,7 @@
|
|||
|
||||
<!-- 尾部 -->
|
||||
<div class="footer background-ff border-box">
|
||||
<div class="foot flex">
|
||||
<div class="foot font24 flex">
|
||||
<a href="index.html" class="item flex">
|
||||
<img src="../images/icon/icon-tabbar-01.png" alt="首页">
|
||||
<img src="../images/icon/icon-active-01.png" alt="首页">
|
||||
|
|
|
|||
|
|
@ -10,23 +10,18 @@
|
|||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<!-- js加载 -->
|
||||
<script src="../js/jquery-3.6.1.min.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/base.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/script.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/jquery-3.6.1.min.js" type="text/javascript"></script>
|
||||
<script src="../js/base.js" type="text/javascript"></script>
|
||||
<script src="../js/script.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<body>
|
||||
<!-- 头部 -->
|
||||
<div class="header background-00 color-ff flex">
|
||||
<div class="header-back flex">
|
||||
<!-- <img src="../images/icon/icon-back.png" alt="返回" onclick="window.history.go(-1)"> -->
|
||||
</div>
|
||||
<div class="header-title font38">待使用卡券</div>
|
||||
</div>
|
||||
<!-- 头部 -->
|
||||
<div class="header background-00 color-ff font38 flex">待使用卡券</div>
|
||||
<!-- 待使用卡券 -->
|
||||
<div class="card-list border-box">
|
||||
<div class="item radius30 border-box flex">
|
||||
<div class="info flex">
|
||||
<div class="price color-f35 font110">100<span class="background-f35 radius100 font24 color-ff">元</span></div>
|
||||
<div class="price color-f35 font120">100<span class="background-f35 radius100 font24 color-ff">元</span></div>
|
||||
<div class="txt">
|
||||
<span class="font48">消费券</span>
|
||||
<p class="font24 color-af">有效期至：2021.03.02</p>
|
||||
|
|
@ -38,7 +33,7 @@
|
|||
</div>
|
||||
<div class="item radius30 border-box flex">
|
||||
<div class="info flex">
|
||||
<div class="price color-f35 font110">100<span class="background-f35 radius100 font24 color-ff">元</span></div>
|
||||
<div class="price color-f35 font120">100<span class="background-f35 radius100 font24 color-ff">元</span></div>
|
||||
<div class="txt">
|
||||
<span class="font48">消费券</span>
|
||||
<p class="font24 color-af">有效期至：2021.03.02</p>
|
||||
|
|
@ -50,7 +45,7 @@
|
|||
</div>
|
||||
<div class="item radius30 border-box flex">
|
||||
<div class="info flex">
|
||||
<div class="price color-f35 font110">100<span class="background-f35 radius100 font24 color-ff">元</span></div>
|
||||
<div class="price color-f35 font120">100<span class="background-f35 radius100 font24 color-ff">元</span></div>
|
||||
<div class="txt">
|
||||
<span class="font48">消费券</span>
|
||||
<p class="font24 color-af">有效期至：2021.03.02</p>
|
||||
|
|
@ -62,7 +57,7 @@
|
|||
</div>
|
||||
<div class="item radius30 border-box flex">
|
||||
<div class="info flex">
|
||||
<div class="price color-f35 font110">100<span class="background-f35 radius100 font24 color-ff">元</span></div>
|
||||
<div class="price color-f35 font120">100<span class="background-f35 radius100 font24 color-ff">元</span></div>
|
||||
<div class="txt">
|
||||
<span class="font48">消费券</span>
|
||||
<p class="font24 color-af">有效期至：2021.03.02</p>
|
||||
|
|
@ -87,7 +82,7 @@
|
|||
|
||||
<!-- 尾部 -->
|
||||
<div class="footer background-ff border-box">
|
||||
<div class="foot flex">
|
||||
<div class="foot font24 flex">
|
||||
<a href="index.html" class="item flex">
|
||||
<img src="../images/icon/icon-tabbar-01.png" alt="首页">
|
||||
<img src="../images/icon/icon-active-01.png" alt="首页">
|
||||
|
|
|
|||
|
|
@ -3,30 +3,25 @@
|
|||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
|
||||
<title>待使用卡券</title>
|
||||
<title>已使用卡券</title>
|
||||
<meta name="keywords" content="" />
|
||||
<meta name="description" content="" />
|
||||
<!-- css加载 -->
|
||||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<!-- js加载 -->
|
||||
<script src="../js/jquery-3.6.1.min.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/base.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/script.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="../js/jquery-3.6.1.min.js" type="text/javascript"></script>
|
||||
<script src="../js/base.js" type="text/javascript"></script>
|
||||
<script src="../js/script.js" type="text/javascript"></script>
|
||||
</head>
|
||||
<body>
|
||||
<!-- 头部 -->
|
||||
<div class="header background-00 color-ff flex">
|
||||
<div class="header-back flex">
|
||||
<!-- <img src="../images/icon/icon-back.png" alt="返回" onclick="window.history.go(-1)"> -->
|
||||
</div>
|
||||
<div class="header-title font38">待使用卡券</div>
|
||||
</div>
|
||||
<!-- 头部 -->
|
||||
<div class="header background-00 color-ff font38 flex">已使用卡券</div>
|
||||
<!-- 待使用卡券 -->
|
||||
<div class="card-list border-box">
|
||||
<div class="item radius30 border-box flex">
|
||||
<div class="info flex">
|
||||
<div class="price color-ae font110">100<span class="background-ae radius100 font24 color-ff">元</span></div>
|
||||
<div class="price color-ae font120">100<span class="background-ae radius100 font24 color-ff">元</span></div>
|
||||
<div class="txt used-txt">
|
||||
<span class="font48">消费券</span>
|
||||
<p class="font24 color-af">有效期至：2021.03.02</p>
|
||||
|
|
@ -39,7 +34,7 @@
|
|||
</div>
|
||||
<div class="item radius30 border-box flex">
|
||||
<div class="info flex">
|
||||
<div class="price color-ae font110">100<span class="background-ae radius100 font24 color-ff">元</span></div>
|
||||
<div class="price color-ae font120">100<span class="background-ae radius100 font24 color-ff">元</span></div>
|
||||
<div class="txt used-txt">
|
||||
<span class="font48">消费券</span>
|
||||
<p class="font24 color-af">有效期至：2021.03.02</p>
|
||||
|
|
@ -52,7 +47,7 @@
|
|||
</div>
|
||||
<div class="item radius30 border-box flex">
|
||||
<div class="info flex">
|
||||
<div class="price color-ae font110">100<span class="background-ae radius100 font24 color-ff">元</span></div>
|
||||
<div class="price color-ae font120">100<span class="background-ae radius100 font24 color-ff">元</span></div>
|
||||
<div class="txt used-txt">
|
||||
<span class="font48">消费券</span>
|
||||
<p class="font24 color-af">有效期至：2021.03.02</p>
|
||||
|
|
@ -65,7 +60,7 @@
|
|||
</div>
|
||||
<div class="item radius30 border-box flex">
|
||||
<div class="info flex">
|
||||
<div class="price color-ae font110">100<span class="background-ae radius100 font24 color-ff">元</span></div>
|
||||
<div class="price color-ae font120">100<span class="background-ae radius100 font24 color-ff">元</span></div>
|
||||
<div class="txt used-txt">
|
||||
<span class="font48">消费券</span>
|
||||
<p class="font24 color-af">有效期至：2021.03.02</p>
|
||||
|
|
@ -80,7 +75,7 @@
|
|||
|
||||
<!-- 尾部 -->
|
||||
<div class="footer background-ff border-box">
|
||||
<div class="foot flex">
|
||||
<div class="foot font24 flex">
|
||||
<a href="index.html" class="item flex">
|
||||
<img src="../images/icon/icon-tabbar-01.png" alt="首页">
|
||||
<img src="../images/icon/icon-active-01.png" alt="首页">
|
||||
|
|
|
|||
Loading…
Reference in New Issue