Преглед изворни кода

我的优惠券页面弹框处理

zaijin пре 2 година
родитељ
комит
b7571b74f5
2 измењених фајлова са 56 додато и 41 уклоњено
  1. 7 1
      pages/center/coupon/myCoupon/myCoupon.scss
  2. 49 40
      pages/center/coupon/myCoupon/myCoupon.vue

+ 7 - 1
pages/center/coupon/myCoupon/myCoupon.scss

@@ -11,7 +11,7 @@ page {
   background-color: #f9f9f9;
 }
 .content {
-	height: calc(100% - 25px);
+	height: calc(100% - 74px);
 }
 .search-part {
   display: flex;
@@ -27,6 +27,9 @@ page {
     background-color: #ff6d6d;
   }
 }
+.popup-vehicleNo {
+  padding: 30rpx 0;
+}
 .popup-vehicleNo-title {
   font-size: 40rpx;
   text-align: center;
@@ -50,6 +53,9 @@ page {
     text-align: center;
     font-size: 26rpx;
   }
+  &-scroll {
+    height: 600rpx;
+  }
 }
 .vehicleNo-btn {
   display: flex;

+ 49 - 40
pages/center/coupon/myCoupon/myCoupon.vue

@@ -23,35 +23,39 @@
         </swiper-item>
       </swiper>
       <!-- 绑定车牌 -->
-      <u-popup class="popup-vehicleNo" v-model="bindVehiclePop.showChangeVehicleNo" mode="center" border-radius="20" width="700rpx" height="auto">
-        <view class="popup-vehicleNo-title">绑定车牌</view>
-        <view class="popup-vehicleNo-center"></view>
-        <view class="popup-vehicleNo-content">
-          <view class="new-plate-number">
-            <view class="message-input-wrap" @click="messageInputClick">
-              <u-message-input :maxlength="8" width="60" font-size="40" :disabled-keyboard="true" v-model="form.vehicleNo" />
+      <u-popup v-model="bindVehiclePop.showChangeVehicleNo" :mask-close-able="false" mode="center" border-radius="20" width="700rpx">
+        <view class="popup-vehicleNo">
+          <view class="popup-vehicleNo-title">绑定车牌</view>
+          <view class="popup-vehicleNo-center"></view>
+          <view class="popup-vehicleNo-content">
+            <view class="new-plate-number">
+              <view class="message-input-wrap" @click="messageInputClick">
+                <u-message-input :maxlength="8" width="60" font-size="40" :disabled-keyboard="true" v-model="form.vehicleNo" />
+              </view>
             </view>
           </view>
-        </view>
-        <view class="popup-vehicleNo-select">
-          <u-collapse ref="refValue" :head-style="{ fontSize: '28rpx' }">
-            <u-collapse-item title="点击选择车牌" align="center">
-              <u-cell-group v-if="bindVehiclePop.vehicleList.length">
-                <u-cell-item :title="item.value" v-for="(item, index) in bindVehiclePop.vehicleList" :key="index" :arrow="false">
-                  <u-radio-group v-model="form.vehicleNo" @change="radioGroupChange">
-                    <u-radio :name="item.value" :key="index"></u-radio>
-                  </u-radio-group>
-                </u-cell-item>
-              </u-cell-group>
-              <template v-else>
-                <view class="popup-vehicleNo-select-empty">暂无绑定车牌</view>
-              </template>
-            </u-collapse-item>
-          </u-collapse>
-        </view>
-        <view class="vehicleNo-btn">
-          <u-button type="primary" :disabled="!form.vehicleNo" :loading="bindVehiclePop.loading" @click="handleBindVehicle">确认</u-button>
-          <u-button type="primary" plain @click="cencelBindVehicle">取消</u-button>
+          <view class="popup-vehicleNo-select">
+            <u-collapse ref="refValue" :head-style="{ fontSize: '28rpx' }">
+              <u-collapse-item title="点击选择车牌" align="center">
+                <scroll-view class="popup-vehicleNo-select-scroll" scroll-y="true">
+                  <u-cell-group v-if="bindVehiclePop.vehicleList.length">
+                    <u-cell-item :title="item.value" v-for="(item, index) in bindVehiclePop.vehicleList" :key="index" :arrow="false">
+                      <u-radio-group v-model="form.vehicleNo" @change="radioGroupChange">
+                        <u-radio :name="item.value" :key="index"></u-radio>
+                      </u-radio-group>
+                    </u-cell-item>
+                  </u-cell-group>
+                  <template v-else>
+                    <view class="popup-vehicleNo-select-empty">暂无绑定车牌</view>
+                  </template>
+                </scroll-view>
+              </u-collapse-item>
+            </u-collapse>
+          </view>
+          <view class="vehicleNo-btn">
+            <u-button type="primary" :disabled="!form.vehicleNo" :loading="bindVehiclePop.loading" @click="handleBindVehicle">确认</u-button>
+            <u-button type="primary" plain @click="cencelBindVehicle">取消</u-button>
+          </view>
         </view>
       </u-popup>
       <!-- 选择颜色 -->
@@ -177,18 +181,20 @@ export default {
         });
       }
     },
-    getCarsList() {
-      this.$u.api.getMycars().then((res) => {
-        this.bindVehiclePop.vehicleList = res.data.rows.map((item) => {
-          return {
-            label: item.vehicleNo,
-            value: item.vehicleNo
-          };
-        });
-        this.$nextTick(() => {
-          this.$refs['refValue'].init();
-        });
+    /** 
+     * @description: 获取我的车辆列表
+     * @return {*}
+     */
+    async getCarsList() {
+      const { data } = await this.$u.api.getMycars({ pageNum: 1, pageSize: 100 });
+      const vehicleList = [];
+      data.rows.forEach((item) => {
+        const { vehicleNo } = item;
+        vehicleList.push({ label: vehicleNo, value: vehicleNo });
       });
+      this.bindVehiclePop.vehicleList = vehicleList;
+      await this.$nextTick();
+      this.$refs.refValue.init();
     },
     /**
      * 兑换优惠券
@@ -207,9 +213,12 @@ export default {
             });
             this.form.exchangeCode = '';
             this.$refs['swiperListItem'][this.current].reloadData();
-            this.cencelBindVehicle();
+            // this.cencelBindVehicle();
+            setTimeout(() => {
+              this.bindVehiclePop.loading = false;
+              location.href = location.origin + location.pathname;
+            }, 500);
           }
-          this.bindVehiclePop.loading = false;
         })
         .catch(() => {
           this.bindVehiclePop.loading = false;