兑换券

const/actioncmd.js

@@ -33,3 +33,6 @@ export const ACTION_GET_ACCOUNT = "ACTION_GET_ACCOUNT";
 
 //直接收款
 export const ACTION_DIRECT_PAYMENT = "ACTION_DIRECT_PAYMENT";
+
+//兑换券
+export const ACTION_CONVERT_COUPON = "ACTION_CONVERT_COUPON";

pages/index/index.acss

-
 /* home样式 */
+
 .homePage {
     display: flex;
     flex-direction: column;
@@ -9,8 +9,8 @@
     position: absolute
 }
 
-
 /* home样式 */
+
 .homePageFilter {
     display: flex;
     flex-direction: column;
@@ -21,7 +21,6 @@
     position: absolute
 }
 
-
 .homeTopView {
     position: relative;
     width: 750rpx;
@@ -77,7 +76,6 @@
 
 */
 
-
 .topView {
     position: relative;
     width: 768rpx;
@@ -453,6 +451,28 @@
     justify-content: space-around
 }
 
+/* 券底部-兑换成功 */
+
+.coupon-bottom-success {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center
+}
+
+/* 券底部-兑换失败 */
+
+.coupon-bottom-fail {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center
+}
+
 /* 返回 */
 
 .coupon-back-container {
@@ -509,6 +529,14 @@
     width: 252rpx;
     height: 60rpx;
 }
+/* 确定 兑换成功 */
+
+.sure-use-coupon {
+    border-radius: 5px;
+    width: 252rpx;
+    height: 60rpx;
+    margin-top: 56rpx;
+}
 
 /* 扫券引导图 */
 
@@ -518,7 +546,8 @@
 }
 
 /* 自定义键盘 */
-.land-keybord{
+
+.land-keybord {
     width: 100%;
     height: 100%;
     position: absolute;
@@ -622,4 +651,75 @@
     font-weight: 400;
     color: rgba(0, 0, 0, 0.65);
     line-height: 27rpx;
+}
+
+/* 兑换券成功 icon */
+
+.scan-coupon-success {
+    width: 86rpx;
+    height: 86rpx;
+    margin-top: 26rpx;
+}
+
+/* 兑换券失败 icon */
+
+.scan-coupon-fail {
+    width: 86rpx;
+    height: 86rpx;
+    margin-top: 26rpx;
+}
+
+/* 兑换券成功文本 */
+.scan-coupon-text-success {
+    font-size: 26rpx;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    color: rgba(0, 122, 255, 1);
+    line-height: 26rpx;
+    margin-top: 24rpx;
+}
+
+/* 兑换券失败文本 */
+.scan-coupon-text-fail {
+    font-size: 26rpx;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    color:rgba(255,0,0,1);
+    line-height: 26rpx;
+    margin-top: 24rpx;
+}
+
+
+/* 兑换券失败容器*/
+.failure-operation {
+    width: 100%;
+    height: 62rpx;
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
+    margin-top: 26rpx;
+}
+
+/* 兑换券 关闭 */
+.close-use-coupon{
+  width:252rpx;
+  height:60rpx;
+  margin-right: 18rpx;
+}
+
+/* 兑换券 再次兑换 */
+.again-use-coupon{
+  width:252rpx;
+  height:60rpx;
+  margin-left: 18rpx;
+}
+
+ /* 兑换券失败描述 */
+.scan-coupon-text-fail-desr{
+  font-size:22rpx;
+  font-family:PingFangSC-Regular,PingFang SC;
+  font-weight:400;
+  color:rgba(91,105,129,1);
+  line-height:22rpx;
+  margin-top: 15rpx
 }
\ No newline at end of file

pages/index/index.axml

@@ -15,13 +15,48 @@
     <view class="homeBodyView">
     <!--  还需要加一层swiper -->
       <view style="display:flex;flex-direction:row;position:relative;margin-top: 14rpx;margin-left: 32rpx;margin-right: 32rpx;">
-        <view class="homeGridItem" catchTap="sendGoToCollections">
+        <view class="homeGridItem" catchTap="convertCoupon">
           <image mode="aspectFit" src="/images/collections.png" class="homeItemImage"/>
           <view class="homeItemText">收银</view>
         </view>
       </view>
     </view>
 
+    <!-- 兑换优惠券 -->
+      <view class="page-coupon" a:if="{{convertCouponState != 0}}">
+            <view class="coupon-top" >
+                <view class="coupon-back-container" onTap="convertCouponClose" a:if="{{convertCouponState == 1}}">
+                    <image class="coupon-back-icon" mode="aspectFit" src="/images/icon_back.png"/>
+                    <text class="coupon-back-text">返回</text>
+                </view>
+                <view class="coupon-title" a:if="{{convertCouponState == 1}}">兑换</view>
+                <view></view>
+            </view>
+            <!-- 等待扫描 -->
+            <view class="coupon-bottom" a:if="{{convertCouponState == 1}}">
+                <text class="scan-coupon-text">等待顾客扫描兑换券码…</text>
+                <image class="scan-coupon-guide" mode="aspectFit" src="/images/scan_guide.png"/>
+                <button class="cancel-use-coupon" size="default" type="ghost" onTap="convertCouponClose">关闭</button>
+            </view>
+             <!-- 兑换失败 -->
+             <view class="coupon-bottom-fail" a:if="{{convertCouponState == 2}}">
+                <image class="scan-coupon-fail" mode="aspectFit" src="/images/icon_failed.png"/>
+                <text class="scan-coupon-text-fail">兑换失败</text>
+                <text class="scan-coupon-text-fail-desr">兑换失败！无效的兑换码</text>
+                <view class="failure-operation">
+                     <button class="close-use-coupon"  type="ghost"  size="default"  onTap="convertCouponClose">关闭</button>
+                     <button class="again-use-coupon"  type="primary" size="default"  onTap="againConvertCouponClose">重新兑换</button>
+                </view> 
+            </view>
+             <!-- 兑换成功 -->
+              <view class="coupon-bottom-success" a:if="{{convertCouponState == 3}}">
+                <image class="scan-coupon-success" mode="aspectFit" src="/images/icon_success.png"/>
+                <text class="scan-coupon-text-success">兑换码已识别</text>
+                <button class="sure-use-coupon" type="primary" size="default"  onTap="convertCouponClose">确定</button>
+            </view>
+
+        </view>
+
   </view> 
  
     <!--扫码页-->

pages/index/index.js

@@ -11,6 +11,7 @@ import { ACTION_ON_PAY_FAILED } from '../../const/actioncmd'
 import { ACTION_GO_HOME } from '../../const/actioncmd'
 import { ACTION_GET_ACCOUNT } from '../../const/actioncmd'
 import { ACTION_DIRECT_PAYMENT } from '../../const/actioncmd'
+import { ACTION_CONVERT_COUPON } from '../../const/actioncmd'
 
 
 Page({
@@ -32,6 +33,13 @@ Page({
     isPrintSuccess: false,
     payPriceFen: 0,
     /**商品扫码页相关参数 */
+    
+    //是否正在用券
+    couponUseing: false,
+
+    //兑换券 0关闭兑换券弹窗 1等待兑换 2.兑换失败 3.兑换成功
+    convertCouponState: 0,
+
     //是否正在用券
     couponUseing: false,
     //0代表弹窗关闭 1代表手动输入条码弹窗 2代表会员 3.收款 4.退款 
@@ -152,14 +160,18 @@ Page({
             storeName:res.data.storeName
           });
         }else if(res.action == ACTION_DIRECT_PAYMENT){
+           //直接收款
            if(res.data != null){
              context.setData({totalPrice:res.data})
            }
            context.goPage('waitoperate');
+        }else if(res.action == ACTION_CONVERT_COUPON){
+           //兑换券
+           context.setData({convertCouponState:res.data}) 
         }
+        
       }
     });
-    
   },
   onHide() {
     // 页面隐藏
@@ -197,12 +209,10 @@ Page({
         data: null
       },
       success: (res) => {
-
         console.log("发送收银事件到前屏小程序 成功 ===》" + JSON.stringify(res));
       },
       fail: (res) => {
         console.log("发送收银事件到前屏小程序 失败 ===》 " + JSON.stringify(res));
-
       },
     });
   },
@@ -355,8 +365,6 @@ Page({
         });
       }
     })
-
-
   },
 
 
@@ -497,6 +505,48 @@ Page({
     })
   },
 
+ //兑换券
+ convertCoupon(e){
+    this.setData({convertCouponState:1})
+    this.sendConvertCouponToFront()
+ }, 
+
+//兑换券界面关闭
+ convertCouponClose(e){
+    this.setData({convertCouponState:0})
+    this.sendConvertCouponToFront()
+ },
+
+//再次兑换
+ againConvertCouponClose(e){
+    this.setData({convertCouponState:1})
+    this.sendConvertCouponToFront()
+ },
+
+ //发生兑换券到前屏
+ sendConvertCouponToFront(){
+    my.ix.sendBuddyMessage({
+      target: getApp().globalData.frontScreenAppId,
+      data: {
+        action:ACTION_CONVERT_COUPON,
+        data:this.data.convertCouponState
+      },
+      success: (res) => {
+        console.log("通知前屏关闭兑换券弹窗 成功 ===》" + JSON.stringify(res));
+      },
+      fail: (res) => {
+        console.log("通知前屏关闭兑换券弹窗 失败 ===》 " + JSON.stringify(res));
+        my.showToast({
+          type: 'fail',
+          content: '操作失败',
+          duration: 3000,
+          success: () => {
+          },
+        });
+      }
+    })
+ },
+
   //用券返回
   couponBack(e) {
     this.setData({ couponUseing: false })