modify: 兑换弹框样式

src/component/exchange-coupon-modal/exchange-coupon-modal.js

@@ -11,7 +11,7 @@ Component({
    * 组件的初始数据
    */
   data: {
-    couponNum:'2'
+    couponNum:'1'
   },
 
   /**

src/component/exchange-coupon-modal/exchange-coupon-modal.wxml

@@ -7,7 +7,7 @@
       </view>
       <view class="modal-content">
         <view class='modal-desc'>
-          <text>500积分</text>
+          <text><text class="num">500</text>积分</text>
           <view class='coupon-number'> 
             <view class="redus"  catchtap="minusNum">-</view>
             <input type="number"  catchtap bindblur="blurNum" bindinput="inputNum" value="{{couponNum}}"></input>

src/component/exchange-coupon-modal/exchange-coupon-modal.wxss

@@ -16,22 +16,25 @@
   background-color: rgba(0, 0, 0, 0.6);
   opacity: 1;
   z-index: 3;
-
 }
-
+.num {
+  color: rgb(255, 152, 0);
+  padding-right:10rpx;
+}
 .modal-container {
   position: fixed;
   left: 96rpx;
   top: 30%;
   background-color: #fff;
   width: 558rpx;
-  height: 456rpx;
+  height: 400rpx;
   z-index: 4;
   border-radius: 20rpx;
 }
-
 .modal-header{
   padding: 38rpx 56rpx;
+  border-radius: 20rpx;
+  background-color: rgb(227, 223, 223);
 }
 .modal-title{
   font-size: 32rpx;
@@ -61,8 +64,10 @@
 .cancel,.query{
   display: inline-block;
   width: 200rpx;
-  font-size: 28rpx;
-  border-radius: 40rpx;
+  font-size: 26rpx;
+}
+.query {
+  background: rgb(2, 187, 112)
 }
 .cancel{
   margin-right: 30rpx;

src/pages/IntegralMall/IntegralMall.js

@@ -14,7 +14,8 @@ wxService.page({
     query: '',
     totalPages: 0,
     integralCouponList: [], // 积分兑换优惠券列表
-    noMore: false
+    noMore: false,
+    isExchange: false
   },
 
   /**
@@ -48,6 +49,12 @@ wxService.page({
       wx.hideLoading();
     })
   },
+  //立即兑换
+  exchange(){
+    this.setData({
+      isExchange :true
+    })
+  },
   // 点击跳转至会员规则页
   handleGoMemberRulesRules() {
     wxService.router(`/pages/memberRules/memberRules`)

src/pages/IntegralMall/IntegralMall.json

@@ -2,6 +2,7 @@
   "enablePullDownRefresh":true,
   "navigationBarTitleText": "积分商城",
   "usingComponents": {
-    "no-more": "/component/noMore/noMore"
+    "no-more": "/component/noMore/noMore",
+    "exchange-coupon-modal": "/component/exchange-coupon-modal/exchange-coupon-modal"
   }
 }
\ No newline at end of file

src/pages/IntegralMall/IntegralMall.wxml

@@ -12,7 +12,7 @@
               <view class='coupon-time fs-24'>{{item.startTime}}</view>
               <view class='coupon-desc fs-24' data-id="{{item.id}}" bindtap="goCouponDetail">查看详情</view>
             </view>
-            <view class='coupon-code fs-24'>立即兑换</view>
+            <view class='coupon-code fs-24' bindtap='exchange'>立即兑换</view>
         </view>
       </view>
    <view class='empty-wrap' wx:if="{{!integralCouponList.length}}">
@@ -21,5 +21,6 @@
         <view class='empty-text'>没有任何卡劵</view>
       </view>
    </view>
+  <exchange-coupon-modal isExchange='{{isExchange}}'/>
   <no-more wx:if="{{noMore}}"/>
 </view>

src/project.config.json

@@ -37,7 +37,7 @@
 			"list": []
 		},
 		"miniprogram": {
-			"current": -1,
+			"current": 8,
 			"list": [
 				{
 					"id": -1,
@@ -86,6 +86,12 @@
 					"name": "welvcom",
 					"pathName": "pages/welcome/welcome",
 					"query": ""
+				},
+				{
+					"id": 8,
+					"name": "我的卡券",
+					"pathName": "pages/coupons/coupons",
+					"query": ""
 				}
 			]
 		}