填订页优化

mall/src/components/app-delivery.vue

@@ -57,10 +57,10 @@
         <div class="tui-title">送达时间</div>
         <picker 
           mode="date" 
-          :value="form.reachTime" 
+          :value="form.reachDate" 
           @change="selTimeFn" 
           class="tui-input">
-          <div v-if="form.reachTime">{{ form.reachTime }}</div>
+          <div v-if="form.reachDate">{{ form.reachDate }}</div>
           <div class="tui-placeholder" v-else>请选择送达时间</div>
         </picker>
       </tui-list-cell>
@@ -118,22 +118,23 @@
         <!-- #endif -->
       </tui-list-cell>
     </div>
+
     <!-- 贺卡 -->
     <div class="module-com gift-wrap input-line-wrap">
       <tui-list-cell class="line-cell" :hover="false">
+        <div class="tui-title">选择贺卡</div>
         <div class="gift-content">
           <div class="flex-center">
-            <checkbox
-              class="ljd-checkbox"
-              id="needGift"
-              :checked="form.needCard == 1 ? true : false"
-              @change="needCardChange"
-            ></checkbox>
-            <label for="needGift" class="need-gift">需要贺卡</label>
+              <radio-group @change="needCardChange">
+                <label class="radio"><radio value="1" checked="true" />需要</label>
+                <label class="radio"><radio value="0" />不需要</label>
+                </radio-group>
           </div>
-          <div class="gitf-textarea">
-          
+        </div>
+      </tui-list-cell>
 
+      <tui-list-cell class="line-cell" :hover="false" v-show="showCardInfo">
+        <div class="tui-title">贺卡内容</div>
         <input
           v-model="form.cardInfo"
           placeholder-class="phcolor"
@@ -141,17 +142,19 @@
           class="tui-input"
           name="cardInfo"
           style="width:100%;"
-          placeholder="请填写贺卡内容，留空将寄出空白贺卡"
+          placeholder="请填写内容，留空寄出空白贺卡"
         />
 
-          </div>
-        </div>
       </tui-list-cell>
-      <!-- <block v-if="form.anonymous"> -->
+
+      <!-- <block v-if="form.anonymity"> -->
       <tui-list-cell class="line-cell" :hover="false">
         <div class="none-name-delivery flex-center" style="padding-left:0rpx;">
-          <checkbox class="ljd-checkbox" id="noneNameText" @change="anonymityChange"></checkbox>
+          <div class="tui-title">派送方式</div>
+ <checkbox-group @change="anonymityChange">
+          <checkbox class="ljd-checkbox" value="1" id="noneNameText" ></checkbox>
           <label for="noneNameText" class="none-name-text">匿名派送</label>
+</checkbox-group>
         </div>
       </tui-list-cell>
       <!-- </block> -->
@@ -203,15 +206,16 @@ export default {
     SimpleAddress
   },
   props: {
-    anonymous: {
-      type: Boolean,
-      default: true
+    anonymity: {
+      type: Number,
+      default: 0
     }
   },
   data() {
     return {
       region: [],
       showRegion: false,
+      showCardInfo:true,
       form: {
         receiveUserName: "", // 收花人姓名；到店自提的姓名
         receiveMobile: "", // 收花人手机；到店自提的电话；
@@ -221,7 +225,7 @@ export default {
         receiveFloor: "", // 收花人门楼号和牌号
         receiveFullAddress: "", // 收花人完整地址，从腾讯地图接口获取
         bookMobile: "", // 订花人手机号
-        reachTime: 0, // 配送时间
+        reachDate: 0, // 配送时间
         reachPeriod: "0", // 配送时段，0上午1下午2晚上
         needCard: "1", // 是否要贺卡 0不要 1要
         cardInfo: "", // 贺卡信息
@@ -255,13 +259,13 @@ export default {
         ? this.orderShop.shop.city
         : "";
     }
-    this.form.anonymous = "0"
+    this.form.anonymity = "0"
     //自动填写已有手机号
     this.$set(this.form, "bookMobile", this.shopUser.mobile);
   },
   methods: {
     selTimeFn(e) {
-      this.form.reachTime = e.detail.value;
+      this.form.reachDate = e.detail.value;
     },
     // 选择地址
     selRegionFn() {
@@ -282,11 +286,13 @@ export default {
     timeTodaySelFn(index) {
       this.form.reachPeriod = index;
     },
-    needCardChange() {
-      this.form.needCard = this.form.needCard == 1 ? 0 : 1;
+    needCardChange(e) {
+      this.form.needCard = e.target.value;
+      this.showCardInfo = e.target.value == 0 ? false : true;
+      this.form.cardInfo = '';
     },
-    anonymityChange() {
-      this.form.anonymous = this.form.anonymous == 1 ? 0 : 1;
+    anonymityChange(e) {
+      this.form.anonymity = e.detail.value == 1 ? 1 : 0;
     },
     // 省市联动
     openAddres() {

mall/src/pages/order/buy.vue

@@ -229,13 +229,13 @@ export default {
           this.$msg("请填写收花人电话");
           return false;
         }
-        let reachTime = form.reachTime;
+        let reachDate = form.reachDate;
         let receiveAddress = form.receiveAddress;
         if (this.$util.isEmpty(receiveAddress)) {
           this.$msg("请填写地址！");
           return false;
         }
-        if (this.$util.isEmpty(reachTime) || reachTime == 0) {
+        if (this.$util.isEmpty(reachDate) || reachDate == 0) {
           this.$msg("请填写送达时间！");
           return false;
         }

mall/src/pages/pay/index.vue

@@ -29,7 +29,7 @@
       </div>
       <!-- 查看更多 -->
       <block v-if="tabIndex == 1">
-        <app-delivery-module ref="appDelivery" :anonymous="true" />
+        <app-delivery-module ref="appDelivery" :anonymity="0" />
       </block>
       <!-- 可选优惠 -->
       <div class="module-com discount-wrap" v-if="!$util.isEmpty(discountArr)">