refactor:领取优惠券，使用优惠券

orderPages/orderDetail/index.vue

@@ -27,7 +27,7 @@
                                 <view class=" flex-row">
                                     <u-icon name="/static/order/ud1.png" color="#93D21A" size="18"></u-icon>
                                     <text  class="key">服务对象：</text>
-                                    <text  class="value">{{order.serviceObjectName}}</text>
+                                    <text  class="value">{{order.serviceObjectName || ''}}</text>
                                 </view>
                                 <view class="flex-row">
                                     <u-icon name="/static/order/ud2.png" color="#93D21A" size="18"></u-icon>

orderPages/receiveCoupons/index.rpx.scss

@@ -1,3 +1,119 @@
+
 .page{
   background: #F7F7F7;
+  padding: 0 32rpx;
+  border-top: 1px solid #F7F7F7 ;
+}
+.btn{
+  height: 84rpx;
+  background: #FFE05C;
+  border-radius: 54rpx;
+  margin: 32rpx 0;
+
+  font-size: 28rpx;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #333333;
+  line-height: 84rpx;
+  text-align: center;
+}
+.noUse{
+  margin: 32rpx 0;
+  font-size: 28rpx;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #333333;
+  line-height: 40rpx;
+}
+
+
+.row-list{
+  width: 686rpx;
+  height: 188rpx;
+  margin-top: 24rpx;
+  background-image: url('/static/coupon/u210.png');
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+
+
+.h-text{
+  width: 200rpx;
+  height: 188rpx;
+}
+.h-center-content{
+  width: 298rpx;
+  height: 188rpx;
+}
+.h-right-content{
+  width: 188rpx;
+  height: 188rpx;
+}
+.money{
+  height: 52rpx;
+  font-size: 36rpx;
+  font-family: DINAlternate-Bold, DINAlternate;
+  font-weight: bold;
+  color: #333333;
+  line-height: 52rpx;
+  text-align: center;
+}
+.desc{
+  height: 36rpx;
+  font-size: 20rpx;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #333333;
+  line-height: 36rpx;
+  text-align: center;
+}
+.h-value{
+  font-size: 28rpx;
+  font-family: PingFangSC-Medium, PingFang SC;
+  font-weight: bold;
+  color: #333333;
+  line-height: 44rpx;
+  margin-top: 24rpx;
+  margin-left: 24rpx;
+}
+.title{
+  font-size: 20rpx;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #999999;
+  line-height: 36rpx;
+  margin-left: 24rpx;
+}
+.h-btn-value-use{
+  width: 156rpx;
+  height: 64rpx;
+  background: #93D21A;
+  border-radius: 32rpx;
+
+  font-size: 24rpx;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #FFFFFF;
+  line-height: 64rpx;
+  text-align: center;
+}
+.h-btn-img{
+  width: 136rpx;
+  height: 136rpx;
+}
+.row-list:first-child{
+  margin-top: 0;
+}
+.btn{
+  width: 156rpx;
+  height: 64rpx;
+  background: #93D21A;
+  border-radius: 32rpx;
+
+  font-size: 24rpx;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #FFFFFF;
+  line-height: 64rpx;
+  text-align: center;
 }

orderPages/useCoupons/index.vue

@@ -12,13 +12,13 @@
         </view>
         <view  :style="{'height':scrollViewHeight}">
             <scroll-view class="scroll " :style="{'height':scrollViewHeight}" scroll-y>
-                <view  class="row-list flex-row justify-start" v-for="(it,i) in 10" @click="useCoupons(i)">
+                <view  class="row-list flex-row justify-start" :class="{'grayscale' : item.discountsPrice>standardPrice }" v-for="(item,index) in countsList" @click="clickCoupons(item,index)" :key="index">
                     <view class="h-text flex-col justify-center ">
                         <view class="money">
-                            <text>￥{{item.discountsPrice || '100'}}</text>
+                            <text>￥{{item.discountsPrice}}</text>
                         </view>
                         <view class="desc">
-                            <text>{{item.name || '优惠券名字'}}</text>
+                            <text>{{item.name}}</text>
                         </view>
                     </view>
 
@@ -38,16 +38,25 @@
                         </view>
                     </view>
 
-                    <view class="h-right-content flex-col justify-center ">
-                            <u-icon v-if="index == i " name="checkmark-circle-fill" color="#38db38" size="25"></u-icon>
+                    <view class="h-right-content flex-col justify-center">
+
+                        <view class="flex-row justify-center" v-if="item.discountsPrice>standardPrice">
+                            <view class="h-btn-img">
+                                <image class="h-btn-img" src="/static/coupon/u2108.png" mode=""></image>
+                            </view>
+                        </view>
+
+                        <view class="flex-row justify-center" v-else>
+                            <u-icon v-if="item.isUse " name="checkmark-circle-fill" color="#38db38" size="25"></u-icon>
                             <u-icon v-else name="/static/order/ud9.png" color="green" size="25"></u-icon>
-                    </view>
+                        </view>
 
+                    </view>
                 </view>
             </scroll-view>
         </view>
         <view>
-            <view class="btn">
+            <view class="btn" @click="useCoupons">
                 <text>确定</text>
             </view>
         </view>
@@ -59,31 +68,96 @@
 export default {
   data() {
     return {
-        index:-1,
+        countsList:[],
         noUse:true,
         windowHeight:'',
-        scrollViewHeight:''
+        scrollViewHeight:'',
+        standardPrice:0,
     };
   },
-  onLoad(option) {
+  onLoad(e) {
       let sysInfo = uni.getSystemInfoSync()
       this.windowHeight =sysInfo.windowHeight +'px'
       this.scrollViewHeight =sysInfo.windowHeight -(sysInfo.windowWidth/750)*252 +'px'
+      this.getMyCouponList()
+
+      if (e.standardPrice){
+          console.log('++++++++++++++', e.standardPrice)
+          this.standardPrice = e.standardPrice
+      }
+
   },
   computed: {
 
   },
   methods: {
+
+      useCoupons(){
+          let  useCoupons = []
+          for (const useCoupon of this.countsList) {
+              if (useCoupon.isUse){
+                  useCoupons.push(useCoupon)
+              }
+          }
+          uni.$emit('getUseCoupons',useCoupons)
+          uni.redirectTo({
+              url:'/orderPages/serviceItems/index'
+          })
+      },
+
       noUseChange(){
           this.noUse = !this.noUse
           if (this.noUse){
-              this.index = -1
+             this.countsList.forEach(item=>{
+                 item.isUse = false
+             })
           }
       },
-      useCoupons(i){
+      clickCoupons(item,index){
+
+          if (item.discountsPrice > this.standardPrice){
+              return
+          }
+
+          //关闭多选开始
+          this.countsList.forEach(item=>{
+              item.isUse = false
+          })
+          //关闭多选结束
+
+          console.log(item)
           this.noUse = false
-          this.index = i
-      }
+          item.isUse = !item.isUse
+          this.$set(this.countsList,index,item)
+
+          let flag = true
+          this.countsList.forEach(item=>{
+             if (item.isUse){
+                 flag = false
+             }
+          })
+          this.noUse = flag
+
+      },
+
+
+      // 查询可领取的优惠劵
+      getMyCouponList(){
+          let that = this;
+          // 用户绑定门店
+          this.$api.getMyCouponList({
+              type:0,
+              pageNum: 1,
+              pageSize: 1000,
+          }).then((res)=>{
+              console.log(res)
+              this.countsList = res.data.rows;
+          }).catch(() =>{
+              uni.showToast({
+                  title: "操作失败"
+              })
+          })
+      },
 
   },
 };

otherPages/serviceItems/index.wxss

@@ -0,0 +1,415 @@
+@charset "UTF-8";
+/**
+ * 这里是uni-app内置的常用样式变量
+ *
+ * uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
+ * 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
+ *
+ */
+/**
+ * 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
+ *
+ * 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
+ */
+/* 颜色变量 */
+/* 行为相关颜色 */
+/* 文字基本颜色 */
+/* 背景颜色 */
+/* 边框颜色 */
+/* 尺寸变量 */
+/* 文字尺寸 */
+/* 图片尺寸 */
+/* Border Radius */
+/* 水平间距 */
+/* 垂直间距 */
+/* 透明度 */
+/* 文章场景相关 */
+.flex-col.data-v-d0be296e {
+	display: flex;
+	flex-direction: column;
+}
+.flex-row.data-v-d0be296e {
+	display: flex;
+	flex-direction: row;
+}
+.flex-row-reverse.data-v-d0be296e {
+	display: flex;
+	flex-direction: row-reverse;
+}
+.bord.data-v-d0be296e{
+	border: 1px solid red;
+}
+.justify-start.data-v-d0be296e {
+	display: flex;
+	justify-content: flex-start;
+}
+.justify-center.data-v-d0be296e {
+	display: flex;
+	justify-content: center;
+}
+.justify-end.data-v-d0be296e {
+	display: flex;
+	justify-content: flex-end;
+}
+.justify-evenly.data-v-d0be296e {
+	display: flex;
+	justify-content: space-evenly;
+}
+.justify-around.data-v-d0be296e {
+	display: flex;
+	justify-content: space-around;
+}
+.justify-between.data-v-d0be296e {
+	display: flex;
+	justify-content: space-between;
+}
+.align-start.data-v-d0be296e {
+	display: flex;
+	align-items: flex-start;
+}
+.align-center.data-v-d0be296e {
+	display: flex;
+	align-items: center;
+}
+.align-end.data-v-d0be296e {
+	display: flex;
+	align-items: flex-end;
+}
+.sticky.data-v-d0be296e {
+
+	display: flex;
+	position: -webkit-sticky;
+
+	position: sticky;
+	top: 0rpx;
+	z-index: 99;
+}
+.bord.data-v-d0be296e{
+	border:  1px  solid  red;
+}
+.page.data-v-d0be296e {
+  background-color: white;
+  position: relative;
+  width: 750rpx;
+  overflow: hidden;
+  padding-left: 0rpx;
+  padding-right: 0rpx;
+  padding-top: 0rpx;
+  padding-bottom: 32rpx;
+  display: flex;
+  flex-direction: column;
+}
+.box_2.data-v-d0be296e {
+  width: 698rpx;
+  margin-top: 32rpx;
+  flex-direction: row;
+  display: flex;
+  justify-content: space-between;
+}
+.image-text_1.data-v-d0be296e {
+  width: 256rpx;
+  flex-direction: row;
+  display: flex;
+  justify-content: space-between;
+  margin: 6rpx 0 6rpx 0;
+}
+.thumbnail_1.data-v-d0be296e {
+  width: 40rpx;
+  height: 40rpx;
+  margin: 4rpx 0 4rpx 0;
+}
+.text-group_1.data-v-d0be296e {
+  overflow-wrap: break-word;
+  color: #333333;
+  font-size: 32rpx;
+  font-family: PingFangSC-Medium;
+  font-weight: 500;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 48rpx;
+}
+.image_2.data-v-d0be296e {
+  width: 180rpx;
+  height: 60rpx;
+}
+.block_2.data-v-d0be296e {
+  background-color: white;
+  padding: 24rpx 32rpx;
+}
+.text_3.data-v-d0be296e {
+  overflow-wrap: break-word;
+  color: #333333;
+  font-size: 28rpx;
+  font-family: PingFangSC-Medium;
+  font-weight: 500;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 44rpx;
+  margin-left: 32rpx;
+}
+.box_3.data-v-d0be296e {
+  flex-direction: row;
+  display: flex;
+  margin-top: 24rpx;
+}
+.group_2.data-v-d0be296e {
+  margin-left: 32rpx;
+  display: flex;
+  flex-direction: column;
+}
+.image-text_2.data-v-d0be296e {
+  width: 156rpx;
+  flex-direction: row;
+  display: flex;
+  justify-content: space-between;
+}
+.thumbnail_2.data-v-d0be296e {
+  width: 28rpx;
+  height: 28rpx;
+  margin: 4rpx 0 4rpx 0;
+}
+.text-group_2.data-v-d0be296e {
+  overflow-wrap: break-word;
+  color: #666666;
+  font-size: 24rpx;
+  font-family: PingFangSC-Regular;
+  font-weight: normal;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 36rpx;
+}
+.group_3.data-v-d0be296e {
+  width: 156rpx;
+  margin-top: 16rpx;
+  flex-direction: row;
+  display: flex;
+  justify-content: space-between;
+}
+.thumbnail_3.data-v-d0be296e {
+  width: 28rpx;
+  height: 28rpx;
+  margin: 4rpx 0 4rpx 0;
+}
+.text_4.data-v-d0be296e {
+  overflow-wrap: break-word;
+  color: #666666;
+  font-size: 24rpx;
+  font-family: PingFangSC-Regular;
+  font-weight: normal;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 36rpx;
+}
+.text-wrapper_2.data-v-d0be296e {
+  display: flex;
+  flex-direction: column;
+}
+.text_5.data-v-d0be296e {
+  overflow-wrap: break-word;
+  color: #333333;
+  font-size: 24rpx;
+  font-family: PingFangSC-Regular;
+  font-weight: normal;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 36rpx;
+  margin-right: 180rpx;
+}
+.text_6.data-v-d0be296e {
+  overflow-wrap: break-word;
+  color: #333333;
+  font-size: 24rpx;
+  font-family: PingFangSC-Regular;
+  font-weight: normal;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 36rpx;
+  margin-top: 16rpx;
+}
+.text-wrapper_3.data-v-d0be296e {
+  margin-top: 24rpx;
+  margin-left: 32rpx;
+}
+.text_7.data-v-d0be296e {
+  overflow-wrap: break-word;
+  color: #666666;
+  font-size: 20rpx;
+  font-family: PingFangSC-Regular;
+  font-weight: normal;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 36rpx;
+  margin-top: 4rpx;
+}
+.text_8.data-v-d0be296e {
+  overflow-wrap: break-word;
+  color: #ed569f;
+  font-size: 28rpx;
+  font-family: PingFangSC-Medium;
+  font-weight: 500;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 44rpx;
+}
+.box_4.data-v-d0be296e {
+  background-color: #eeeeee;
+  width: 686rpx;
+  height: 2rpx;
+  margin-top: 32rpx;
+  display: flex;
+  flex-direction: column;
+}
+.text_11.data-v-d0be296e {
+  overflow-wrap: break-word;
+  color: #333333;
+  font-size: 24rpx;
+  font-family: PingFangSC-Regular;
+  font-weight: normal;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 36rpx;
+  margin-right: 180rpx;
+}
+.text_12.data-v-d0be296e {
+  overflow-wrap: break-word;
+  color: #333333;
+  font-size: 24rpx;
+  font-family: PingFangSC-Regular;
+  font-weight: normal;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 36rpx;
+  margin-top: 16rpx;
+}
+.text-wrapper_5.data-v-d0be296e {
+  width: 212rpx;
+  flex-direction: row;
+  display: flex;
+  justify-content: space-between;
+  margin: 24rpx 410rpx 0 64rpx;
+}
+.text_13.data-v-d0be296e {
+  overflow-wrap: break-word;
+  color: #666666;
+  font-size: 20rpx;
+  font-family: PingFangSC-Regular;
+  font-weight: normal;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 36rpx;
+  margin-top: 4rpx;
+}
+.text_14.data-v-d0be296e {
+  overflow-wrap: break-word;
+  color: #ed569f;
+  font-size: 28rpx;
+  font-family: PingFangSC-Medium;
+  font-weight: 500;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 44rpx;
+}
+.box_6.data-v-d0be296e {
+  background-color: #eeeeee;
+  width: 686rpx;
+  height: 2rpx;
+  margin-top: 32rpx;
+  display: flex;
+  flex-direction: column;
+}
+.block_3.data-v-d0be296e {
+  background-color: #f7f7f7;
+  border-radius: 50rpx;
+  width: 686rpx;
+  align-self: center;
+  flex-direction: row;
+  display: flex;
+  justify-content: space-between;
+  height: 84rpx;
+}
+.text_15.data-v-d0be296e {
+  overflow-wrap: break-word;
+  color: #333333;
+  font-size: 28rpx;
+  font-family: PingFangSC-Regular;
+  font-weight: normal;
+  text-align: left;
+  white-space: nowrap;
+  line-height: 84rpx;
+}
+.image-text_4.data-v-d0be296e {
+  width: 132rpx;
+  flex-direction: row;
+  display: flex;
+  justify-content: space-between;
+}
+.text-group_4.data-v-d0be296e {
+  overflow-wrap: break-word;
+  color: #999999;
+  font-size: 28rpx;
+  font-family: PingFangSC-Regular;
+  font-weight: normal;
+  text-align: right;
+  white-space: nowrap;
+  line-height: 84rpx;
+}
+.text-group_5.data-v-d0be296e {
+  overflow-wrap: break-word;
+  color: red;
+  font-size: 28rpx;
+  font-family: PingFangSC-Regular;
+  font-weight: normal;
+  white-space: nowrap;
+  line-height: 84rpx;
+}
+.thumbnail_6.data-v-d0be296e {
+  width: 32rpx;
+  height: 32rpx;
+  margin: 6rpx 0 6rpx 0;
+}
+.text-wrapper_6.data-v-d0be296e {
+  background-color: #ffe05c;
+  border-radius: 54rpx;
+  align-self: center;
+  margin-top: 24rpx;
+  display: flex;
+  flex-direction: column;
+  width: 686rpx;
+  padding: 20rpx 314rpx 20rpx 316rpx;
+}
+.text_16.data-v-d0be296e {
+  overflow-wrap: break-word;
+  color: #333333;
+  font-size: 28rpx;
+  font-family: PingFangSC-Regular;
+  font-weight: normal;
+  text-align: center;
+  white-space: nowrap;
+  line-height: 44rpx;
+}
+.tabBarLineHeight.data-v-d0be296e {
+  height: 250rpx;
+}
+.submitButton.data-v-d0be296e {
+  text-align: center;
+  line-height: 84rpx;
+  width: 686rpx;
+  height: 84rpx;
+  background: #FFE05C;
+  border-radius: 54rpx;
+  margin-top: 24rpx;
+}
+.text_9.data-v-d0be296e {
+  margin-left: 24rpx;
+}
+.bottomView.data-v-d0be296e {
+  position: fixed;
+  bottom: 0;
+  width: 750rpx;
+  height: 224rpx;
+  background: #FFFFFF;
+}
+.outView.data-v-d0be296e {
+  width: 600rpx;
+}
+

pages/index/index.vue

@@ -21,12 +21,6 @@
                            @click="handleNoticeClick"></scroll-notice>
           </view>
 
-          <!--          温馨提示-->
-          <view  class="noticeCard">
-            <uni-card>
-              <text>{{indexTips}}</text>
-            </uni-card>
-          </view>
           <!-- 个人信息、钱包、商店 -->
           <view class="h-content-wrap">
             <!-- 欢迎语 -->
@@ -255,7 +249,6 @@ export default {
       },
       storeList: [],
       storeInfo: {},
-      indexTips:'温馨提示:“娇骄儿JJe”微信小程序为新系统限白云店和遵义店使用，微信小程序系统目前处于试运行阶段，老会员卡暂时不能使用；待开放正式版“娇骄儿JJe”微信小程序后会员退卡全店通用，具体时间请关注娇骄儿微信公众号以及“娇骄儿JJe”微信小程序通告。如有异常请联系工作人员：0851-85833828'
     };
   },