取消预定

@@ -239,4 +239,13 @@ image{
   height: 22rpx;
   height: 22rpx;
   background-image: url("http://qn.colorcun.com/custom/lite-yd/image/click.png");
   background-image: url("http://qn.colorcun.com/custom/lite-yd/image/click.png");
   background-size: 100%;
   background-size: 100%;
+}
+.mask{
+  background-color: rgba(20,20,20,0.5);
+  position: fixed;
+  top:0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 9999;
 }
 }

+// components/book/reserveCancel/cancel.js
+import util from '../../../utils/util';
+import App from '../../../utils/api';
+const {regeneratorRuntime} = global
+const items=[{name:'顾客取消'},{name:'顾客行程有变'},{name:'信息填写有误'},{name:'操作失误'},{name:'其他原因'}];
+
+Component({
+  /**
+   * 组件的属性列表
+   */
+  properties: {
+    bookInfo:{
+      type:Object,
+      value:{},
+    }
+  },
+
+  /**
+   * 组件的初始数据
+   */
+  data: {
+    hidden: true,
+    otherInputHidden:true,
+    items:JSON.parse(JSON.stringify(items)),
+    _cause:'',
+    cause:'',
+  },
+  /**
+   * 组件的方法列表
+   */
+  methods: {
+    show(){
+      this.setData({
+        hidden:false,
+      })
+    },
+    hide(){
+      this.setData({
+        hidden:true,
+      })
+    },
+    radioChange(e){
+      let val=util.val(e);
+      if(val=='其他原因'){
+        this.setData({
+          otherInputHidden:false,
+          _cause:val
+        })
+      }else{
+        this.setData({
+          otherInputHidden:true,
+          _cause:val
+        })
+      }
+    },
+    otherInput(e){
+      let val=util.val(e);
+      this.setData({
+        cause:val
+      })
+    },
+    async submit(e){
+      console.log(e,);
+      let cause=this.data._cause;
+      if(cause=='其他原因'){
+        cause=this.data.cause;
+      }
+      cause=cause.trim();
+      if(!cause){
+        return util.toast('请选择原因','none')
+      }
+
+      let enter_params=util.cache('enter_params');
+      let sc=(await App.Reserve.SellerInfo(enter_params)).data
+      if(sc.seller_user){
+        cause=cause+'|'+(sc.seller_user.nick_name||sc.seller_user.nickname)
+      }
+      App.Reserve.SetReserveStatus({
+        rid:this.data.bookInfo.id,
+        status:4,
+        cause:cause,
+      }).then(()=>{
+        this.hide()
+        this.triggerEvent('reserveCancel',{hasCancel:true});
+        //this.getDetail(this.data.bookInfo.id,true);
+      })
+    }
+  }
+})

+{
+    "component": true,
+    "usingComponents": {
+        "formids":"../../formids/formids"
+    }
+}

+<!--components/book/reserveCancel/cancel.wxml-->
+<view class="mask flex-vc" hidden="{{hidden}}" bindtap="hide">
+    <view class="cancel" catchtap="catchtap">
+        <view class="flex-rr">
+            <view class="close" bindtap="hide">
+                <image src="http://qn.colorcun.com/custom/lite-yd/image/close.png"></image>
+            </view>
+        </view>
+        <view class="title Semibold flex-vc">请选择取消原因</view>
+        <radio-group class="radio-group flex-vl" bindchange="radioChange">
+            <label class="radio" wx:for="{{items}}" wx:key="items.key">
+                <radio value="{{item.name}}" checked="{{item.checked}}" />
+                {{item.name}}
+            </label>
+        </radio-group>
+        <view class="flex-rr other-view">
+            <input class="other" bindinput="otherInput" placeholder="请填写原因" hidden="{{otherInputHidden}}"/>
+        </view>
+        <formids class="flex-vc"  bindclick="submit">
+            <view class="button">确认</view>
+        </formids>
+    </view>
+</view>

+/* components/book/reserveCancel/cancel.wxss */
+@import "../../../app.wxss";
+.cancel{
+  width: 90%;
+  background-color: #fefefe;
+  border-radius: 10rpx;
+  font-size: 32rpx;
+  padding-bottom: 52rpx;
+}
+.cancel image{
+  width: 100%;
+  height: 100%;
+}
+.close{
+  width: 32rpx;
+  height: 32rpx;
+  margin-top: 12rpx;
+  margin-right: 12rpx;
+}
+.title{
+  font-size: 34rpx;
+}
+.button{
+  width: 300rpx;
+  height: 80rpx;
+  line-height: 80rpx;
+  border-radius: 4rpx;
+  background-color: #199095;
+  font-size: 34rpx;
+  color: #fefefe;
+}
+.radio-group{
+  margin: 44rpx 5% 0rpx;
+}
+.radio{
+  margin-bottom: 40rpx;
+  height: 40rpx;
+  line-height: 40rpx;
+}
+.radio:last-child{
+  margin-bottom: 0;
+}
+.radio radio{
+  margin-right: 30rpx;
+}
+.other-view{
+  height: 110rpx;
+  line-height: 110rpx;
+}
+.other{
+  border-bottom: 2rpx solid #E0E0E0;
+  width: 75%;
+  margin-right: 40rpx;
+}

@@ -148,30 +148,12 @@ Page({
             url:'./b_addnew?id='+this.data.bookInfo.id
             url:'./b_addnew?id='+this.data.bookInfo.id
         })
         })
     },
     },
-  async cancelReserve(){
-    let enter_params=util.cache('enter_params');
-    let sc=(await App.Reserve.SellerInfo(enter_params)).data
-    let cause='';
-    if(sc.seller_user){
-      cause=(sc.seller_user.nick_name||sc.seller_user.nickname)+'手动取消'
-    }
-    wx.showModal({
-      title: '确认取消',
-      content: '你确认要取消预订吗',
-      success:(res)=>{
-        if (res.confirm) {
-          App.Reserve.SetReserveStatus({
-            rid:this.data.bookInfo.id,
-            status:4,
-            cause:cause,
-          }).then(()=>{
-            this.getDetail(this.data.bookInfo.id,true);
-          })
-        } else if (res.cancel) {
-          console.log('用户点击取消')
-        }
-      }
-    })
+  cancelReserve(){
+    this.selectComponent('#cancel').show();
+  },
+  reserveCancel(e){
+    console.log('reserveCancel',e.detail);
+    this.getDetail(this.data.bookInfo.id,true);
   },
   },
   actionSheetChange(e){
   actionSheetChange(e){
     this.setData({
     this.setData({

@@ -6,6 +6,7 @@
     "noticeCall":"/components/book/notice/notice",
     "noticeCall":"/components/book/notice/notice",
     "step":"/components/book/step/step",
     "step":"/components/book/step/step",
     "board":"/components/book/board/board",
     "board":"/components/book/board/board",
+    "cancel":"/components/book/reserveCancel/cancel",
     "nav":"/components/nav/nav"
     "nav":"/components/nav/nav"
   }
   }
 }
 }

@@ -9,7 +9,7 @@
         <view class="gray-deep-font font30r">用餐人数</view>
         <view class="gray-deep-font font30r">用餐人数</view>
         <view class="black-font font34r">{{bookInfo.pnum_str||bookInfo.pnum}}人</view>
         <view class="black-font font34r">{{bookInfo.pnum_str||bookInfo.pnum}}人</view>
     </view>
     </view>
-    <view class="reserve-status-tip">
+    <view class="reserve-status-tip" wx:if="{{bookInfo.status!=null}}">
         <image src="http://qn.colorcun.com/custom/lite-yd/image/reserve-status-{{bookInfo.status}}.png"></image>
         <image src="http://qn.colorcun.com/custom/lite-yd/image/reserve-status-{{bookInfo.status}}.png"></image>
     </view>
     </view>
     <view class="flex-lr order-detail">
     <view class="flex-lr order-detail">
@@ -83,4 +83,5 @@
     </action-sheet-item>
     </action-sheet-item>
     <action-sheet-cancel >取消</action-sheet-cancel>
     <action-sheet-cancel >取消</action-sheet-cancel>
 
 
-</action-sheet>
+</action-sheet>
+<cancel id="cancel" bindreserveCancel="reserveCancel" bookInfo="{{bookInfo}}"></cancel>

@@ -155,7 +155,8 @@
 					"id": 15,
 					"id": 15,
 					"name": "预定本详情",
 					"name": "预定本详情",
 					"pathName": "pages/book/b_detail",
 					"pathName": "pages/book/b_detail",
-					"query": "id=1429"
+					"query": "id=1464",
+					"scene": "1001"
 				},
 				},
 				{
 				{
 					"id": -1,
 					"id": -1,