Skip to content

严立 / mini-shimao

Go to a project
Commit 0e8e40b6 by wjw
Options

ww--券码核销

parent 1132be00
Inline Side-by-side
Showing with 461 additions and 21 deletions
image/scan.png 0 → 100644
image/scan.png

261 Bytes
pages/commodity/snacks/snacks.wxml
<view class="cates">
<view class="cates-container">
<!-- 左边菜单 -->
<scroll-view scroll-y class="left-menu">
<scroll-view scroll-y enhanced="true" show-scrollbar="false" class="left-menu">
<view
class="menu-item {{currentIndex === index ? 'active' : ''}}"
wx:for="{{leftMenuList}}"
......@@ -81,5 +81,4 @@
<!-- 添加成功 -->
<l-toast show="{{showAddSucc}}" l-image-class="toast-image" l-class="toast-bg" image="/image/success.png" title="添加购物车成功" />
</view>
</view>
<Blank></Blank>
</view>
\ No newline at end of file
pages/commodity/snacks/snacks.wxss
......@@ -11,7 +11,6 @@ Page {
.left-menu {
width: 160rpx;
background: #F2F3F5;
}
::-webkit-scrollbar {
width: 0;
......@@ -148,7 +147,7 @@ Page {
.item-info-old-price {
margin-top: 4rpx;
font-size: 22rpx;
color: #959DA9;
color: #C2C7CF;
text-decoration:line-through
}
......
pages/home/home/home.js
......@@ -334,4 +334,14 @@ Page({
url: '/pages/pay/order-detail/order-detail?type=' + event.currentTarget.dataset.index
})
},
onTest4: function (event) {
wx.navigateTo({
url: '/pages/pay/coupon-input/coupon-input'
})
},
onTest5: function (event) {
wx.navigateTo({
url: '/pages/pay/coupon-detail/coupon-detail?type=' + event.currentTarget.dataset.index
})
},
})
\ No newline at end of file
pages/home/home/home.wxml
......@@ -94,5 +94,9 @@
<button class="test-button" data-index="{{4}}" bindtap="onTest3">订单 已评价</button>
<button class="test-button" data-index="{{5}}" bindtap="onTest3">订单 待付款</button>
<button class="test-button" bindtap="onTest4">券码核销</button>
<button class="test-button" data-index="{{4}}" bindtap="onTest5">券码详情 普通</button>
<button class="test-button" data-index="{{5}}" bindtap="onTest5">券码详情 餐品</button>
</view>
</view>
\ No newline at end of file
pages/pay/coupon-detail/coupon-detail.js
Page({
data: {
orderType: 1, // 1 - 年卡/月卡，2 - 次票， 3 - SPA， 4 - 文创， 5 - 餐品， 6 - 活动， 7 - 观影
couponInfo: {
type: '套票',
store: '儿童营地',
id: '26719921231',
useTime: '2020-11-06'
},
goodsList: [
{
id: 0,
cover: '',
name: '咖喱蔬菜大虾',
quantity: '2',
price: '30.60'
},
{
id: 1,
cover: '',
name: '南瓜坚果汤',
quantity: '3',
price: '30.60'
},
],
orderInfo: {
name: '林有一',
phone: '15802035122',
idNum: '350600366462131',
}
},
onLoad: function (options) {
console.log(options)
if (options.type) options.type = Number(options.type)
let orderType = options.type
this.setData({
orderType
})
this.setView()
},
setView() {
let orderType = this.data.orderType
switch (orderType) {
case 4:
this.setData({
goodsList: [
{
cover: '',
name: '《海错图》超级豪华精致古风限量版折扇',
quantity: '1',
price: '30.60'
}
],
note: '身份证号变更为350600366462132'
})
break
case 5:
break
}
}
})
\ No newline at end of file
pages/pay/coupon-detail/coupon-detail.json
{
"usingComponents": {}
"usingComponents": {
"Blank": "../../../component/Blank/Blank"
}
}
\ No newline at end of file
pages/pay/coupon-detail/coupon-detail.wxml
<!--pages/home/home/home.wxml-->
<text>pages/home/home/home.wxml</text>
<navigation class="navigation" titleText="券码核销" background="#ffffff" backIcon="/image/back.png"></navigation>
<view class="container">
<view class="list-wrapper">
<view class="title-wrapper">兑换券信息</view>
<view class="info-wrapper row con-b">
<view class="info-name">商品类型</view>
<view class="info-text">{{couponInfo.type}}</view>
</view>
<view class="info-wrapper row con-b">
<view class="info-name">所属门店</view>
<view class="info-text">{{couponInfo.store}}</view>
</view>
<view class="info-wrapper row con-b">
<view class="info-name">券号</view>
<view class="info-text">{{couponInfo.id}}</view>
</view>
<view class="info-wrapper row con-b">
<view class="info-name">有效期</view>
<view class="info-text">{{couponInfo.useTime}}</view>
</view>
</view>
<view class="list-wrapper">
<view class="title-wrapper">商品详情</view>
<view class="goods-list">
<view class="goods-item row align-c" wx:for="{{goodsList}}" wx:key="id">
<view class="goods-img">
<image mode="widthFix" src="{{item.cover}}"></image>
</view>
<view class="goods-name">{{item.name}}</view>
<view class="goods-price-num col">
<view class="goods-num">{{'共'+item.quantity + '件'}}</view>
<view class="goods-price">
<text class="price-symbol">￥</text>
<text>{{item.price}}</text>
</view>
</view>
</view>
</view>
</view>
<view class="list-wrapper">
<view class="title-wrapper">订单详情</view>
<view class="info-wrapper row con-b">
<view class="info-name">姓名</view>
<view class="info-text">{{orderInfo.name}}</view>
</view>
<view class="info-wrapper row con-b">
<view class="info-name">手机</view>
<view class="info-text">{{orderInfo.phone}}</view>
</view>
<view class="info-wrapper row con-b">
<view class="info-name">身份证</view>
<view class="info-text">{{orderInfo.idNum}}</view>
</view>
</view>
<view class="list-wrapper">
<view class="title-wrapper">订单详情</view>
<view class="info-wrapper row con-b">
<view class="info-name">姓名</view>
<view class="info-text">{{orderInfo.name}}</view>
</view>
<view class="info-wrapper row con-b">
<view class="info-name">手机</view>
<view class="info-text">{{orderInfo.phone}}</view>
</view>
<view class="info-wrapper row con-b">
<view class="info-name">身份证</view>
<view class="info-text">{{orderInfo.idNum}}</view>
</view>
</view>
<view class="list-wrapper" wx:if="{{note}}">
<view class="title-wrapper">备注</view>
<view class="info-wrapper row con-b">
<view class="info-name">{{note}}</view>
</view>
</view>
</view>
<view class="footer-wrapper">
<view class="footer-btn row con-b align-e">
<view class="cancel-btn">取消核销</view>
<view class="confirm-btn">确认核销</view>
</view>
<Blank></Blank>
</view>
pages/pay/coupon-detail/coupon-detail.wxss
/* pages/home/home/home.wxss */
\ No newline at end of file
.container {
margin-top: 120rpx;
padding-bottom: 196rpx;
}
.list-wrapper {
width: 750rpx;
}
.title-wrapper {
width: 750rpx;
height: 64rpx;
padding: 0 40rpx;
color: #959DA9;
font-size: 26rpx;
font-weight: 600;
line-height: 64rpx;
background-color: #F7F8FA;
}
.info-wrapper {
width: 670rpx;
height: 96rpx;
margin: 0 auto;
color: #15191F;
font-size: 30rpx;
line-height: 96rpx;
border-bottom: 1px solid #E2E7EF;
}
.info-wrapper:last-child {
border-bottom: none;
}
.goods-list {
padding: 24rpx 40rpx;
}
.goods-item {
height: 188rpx;
}
.goods-img {
width: 140rpx;
height: 140rpx;
background-color: #ccc;
}
.goods-name {
flex: 1;
height: 84rpx;
color: #15191F;
font-size: 30rpx;
font-weight: 600;
line-height: 42rpx;
margin: 0 32rpx;
}
.goods-price-num {
width: 100rpx;
height: 84rpx;
}
.goods-num {
flex: 1;
font-size: 30rpx;
font-weight: 600;
text-align: right;
}
.goods-price {
flex: 1;
text-align: right;
color: #959DA9;
font-size: 26rpx;
}
.price-symbol {
font-size: 22rpx;
}
.footer-wrapper {
position: fixed;
left: 0;
bottom: 0rpx;
}
.footer-btn {
width: 750rpx;
height: 128rpx;
padding: 0 40rpx;
background-color: #fff;
border-top: 1px solid #E2E7EF;
}
.cancel-btn, .confirm-btn {
width: 318rpx;
height: 96rpx;
font-size: 30rpx;
font-weight: 600;
line-height: 96rpx;
text-align: center;
border-radius: 4rpx;
}
.cancel-btn {
color: #656E7B;
background-color: #fff;
border: 1px solid #C2C7CF;
}
.confirm-btn {
color: #fff;
background-color: #86C5E1;
}
image {
width: 100%;
height: 100%;
}
pages/pay/coupon-input/coupon-input.js
Page({
data: {
avatarUrl: '/pages/mine/home/image/avatar.png',
showDialog: false
},
onLoad: function (options) {
},
handleWriteOff() {
let showDialog = true
this.setData({
showDialog
})
},
handleScanCode() {
wx.scanCode({
onlyFromCamera: true,
success: (res) => {
console.log(res)
}
})
}
})
\ No newline at end of file
pages/pay/coupon-input/coupon-input.wxml
<!--pages/home/home/home.wxml-->
<text>pages/home/home/home.wxml</text>
<navigation class="navigation" titleText="券码核销" backIcon="/image/back.png"></navigation>
<view class="container">
<!-- 头像信息 -->
<view class="header col align-c">
<view class="header-bg">
<image src=""></image>
</view>
<view class="header-avatar">
<l-avatar size="160" src="{{avatarUrl}}"></l-avatar>
</view>
<view class="header-info">
<view class="info-name">文碧海</view>
<view class="info-text col con-b">
<view class="row con-b">
<text class="info-left">工作身份</text>
<text class="info-right">前台核销</text>
</view>
<view class="row con-b">
<text class="info-left">所属门店</text>
<text class="info-right">艺术花坊</text>
</view>
</view>
</view>
</view>
<!-- 核销输入框 -->
<view class="coupon-input-wrapper row con-b">
<input placeholder="请输入券码" placeholder-style="color: #C2C7CF"></input>
<view class="coupon-input-btn" bindtap="handleWriteOff">核销</view>
<l-dialog show="{{showDialog}}" l-class="dialog-wrapper" l-title-class="dialog-title" l-confirm-class="dialog-confirm" title="非本店券码，无法使用">
<view class="dialog-content">所属门店：原味舒食</view>
</l-dialog>
<l-toast show="{{true}}" l-image-class="toast-image" l-class="toast-bg" image="/image/success.png" title="核销成功" />
</view>
<!-- 扫码核销 -->
<view class="coupon-scan-wrapper row con-c align-c" bindtap="handleScanCode">
<view class="scan-icon">
<image mode="widthFix" src="/image/scan.png"></image>
</view>
<view class="scan-text" bindtap="handleCouponScan">扫码核销</view>
<view class="scan-right">
<image mode="widthFix" src="/image/more-g.png"></image>
</view>
</view>
</view>
\ No newline at end of file
pages/pay/coupon-input/coupon-input.wxss
/* pages/home/home/home.wxss */
\ No newline at end of file
.header-bg {
width: 750rpx;
height: 774rpx;
background-color: #ccc;
}
.header-avatar {
position: absolute;
top: 264rpx;
width: 160rpx;
height: 160rpx;
}
.header-info {
position: absolute;
top: 472rpx;
width: 232rpx;
height: 205rpx;
}
.info-name {
width: 100%;
height: 116rpx;
text-align: center;
color: #15191F;
font-size: 34rpx;
font-weight: 600;
}
.info-text {
height: 88rpx;
}
.info-left {
color: #959DA9;
font-size: 26rpx;
}
.info-right {
color: #15191F;
font-size: 26rpx;
}
.coupon-input-wrapper {
width: 668rpx;
height: 80rpx;
margin-top: 70rpx;
}
.coupon-input-wrapper input {
width: 480rpx;
height: 80rpx;
padding: 0 22rpx 0 24rpx;
font-size: 30rpx;
line-height: 80rpx;
border: 1px solid #DBDFE5;
border-radius: 4rpx;
}
.coupon-input-btn {
width: 156rpx;
height: 80rpx;
margin-left: 32rpx;
font-size: 30rpx;
color: #fff;
line-height: 80rpx;
text-align: center;
background-color: #86C5E1;
border-radius: 4rpx;
}
.dialog-wrapper {
width: 590rpx !important;
}
.dialog-title {
margin-top: 48rpx !important;
color: #15191F !important;
font-size: 34rpx !important;
font-weight: 600 !important;
}
.dialog-confirm {
height: 94rpx !important;
color: #5DB5DD !important;
font-size: 30rpx !important;
}
.dialog-content {
margin-bottom: 30rpx;
color: #959DA9;
font-size: 30rpx;
}
.toast-bg {
min-width: 262rpx !important;
min-height: 262prx !important;
}
.toast-image {
}
.coupon-scan-wrapper {
width: 668rpx;
height: 160rpx;
margin-top: 64rpx;
padding: 0 48rpx;
background-color: #F2F3F5;
border-radius: 4rpx;
}
.scan-text {
flex: 1;
height: 48rpx;
padding: 0 16rpx;
color: #15191F;
font-size: 34rpx;
font-weight: 600;
}
.scan-icon, .scan-right {
width: 40rpx;
height: 40rpx;
}
image {
width: 100%;
height: 100%;
}
project.config.json
......@@ -133,15 +133,22 @@
},
{
"id": -1,
"name": "pages/home/home/home",
"pathName": "pages/home/home/home",
"name": "pages/commodity/snacks/snacks",
"pathName": "pages/commodity/snacks/snacks",
"query": "",
"scene": null
},
{
"id": -1,
"name": "pages/commodity/snacks/snacks",
"pathName": "pages/commodity/snacks/snacks",
"name": "pages/pay/coupon-input/coupon-input",
"pathName": "pages/pay/coupon-input/coupon-input",
"query": "",
"scene": null
},
{
"id": -1,
"name": "pages/pay/coupon-detail/coupon-detail",
"pathName": "pages/pay/coupon-detail/coupon-detail",
"scene": null
}
]
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment