酒店已付款 取消订单

src/pages/detailHotalDida.vue

@@ -1144,7 +1144,6 @@ export default {
             this.order = pickuporderHotal.find((x) => x.key == key);
             if (this.order) {
               this.msg.searchroomGroup = this.order.order.msg.searchroomGroup
-              this.CountPeople()
             }
           }
         }else{
@@ -1160,6 +1159,7 @@ export default {
           //   }
           // }
         }
+        this.CountPeople()
         
         let params = newVal.params
         if(params.CheckInDate){

src/pages/usercenter/order.vue

@@ -35,7 +35,8 @@
       
     </div>
     
-    <q-card class="rounded-borders q-pa-md q-mt-md" flat v-for="item in orderList" :key="item.id">
+    <q-card class="rounded-borders q-pa-md q-mt-md" flat v-for="(item,index) in orderList" :key="item.id"
+     @click="CommonJump('/orderinfo/'+item.orderNo,{},'blank')">
       <div class="row justify-between items-center">
         <div>
           <q-chip size="12px" :class="[item.goodTypeEnum.bgColor,item.goodTypeEnum.color]" square>{{ item.goodTypeEnum?item.goodTypeEnum.desc:'' }}</q-chip>
@@ -43,7 +44,7 @@
         </div>
         <div class="text-grey-5  desktop-only">下單日期：{{ item.createTimeStr }}</div>
         <div class="row items-center">
-          <q-btn color="dark" icon="iconfont iconmessage1" label="联系客服" flat @click="goCustomerServiceHandler" class="q-mr-md" />
+          <q-btn color="dark" icon="iconfont iconmessage1" label="联系客服" flat @click.stop="goCustomerServiceHandler" class="q-mr-md" />
           <q-icon :name="item.orderStatusInfo.icon" :class="[item.orderStatusInfo.color]" size="14px" />
           <span class="q-ml-sm" :class="[item.orderStatusInfo.color]">{{ item.orderStatusInfo.desc }}</span>
         </div>
@@ -61,7 +62,7 @@
             :style="{width: $q.platform.is.desktop?'150px':'80px',height:$q.platform.is.desktop?'80px':'40px'}"
             />
             <div class="col">
-              <div class="text-body1 ellipsis cursor-pointer" @click="CommonJump('/orderinfo/'+item.orderNo,{},'blank')">{{ item.goodsName }}</div>
+              <div class="text-body1 ellipsis cursor-pointer">{{ item.goodsName }}</div>
               <div class="text-grey-5" :class="{'q-mt-sm':$q.platform.is.desktop}">{{ item.orderMake }} </div>
               <div class="q-mt-sm text-grey-8 f12 row items-center desktop-only">
                 <q-icon name="iconfont iconpeople1" size="14px" class="q-mr-sm" />
@@ -81,20 +82,23 @@
           </div>
           <div class="" :class="{'q-mt-md row items-end':$q.platform.is.mobile,'q-ml-lg':$q.platform.is.desktop}">
             <div class="col mobile-only text-left">
-              <q-btn color="dark" icon="iconfont iconmessage1" label="联系客服" flat @click="goCustomerServiceHandler" />
+              <q-btn color="dark" icon="iconfont iconmessage1" label="联系客服" flat @click.stop="goCustomerServiceHandler" />
             </div>
             <div>
               <div class="text-right">
               <span>CNY </span>
               <span class="text-h6 q-ml-sm">{{ moneyFormat(item.totalPrice,2) }}</span>
             </div>
-            <div class="q-mt-md text-right" v-if="item.orderStatus==1">
+            <div class="q-mt-md text-right" v-if="item.orderStatus==1||
+            (item.goodsType==9&&item.orderStatus==2)">
               <!-- <q-btn color="dark" dense flat class="q-px-sm" label="查看訂單" /> -->
-               <q-btn color="primary" dense flat class="q-px-sm" label="取消訂單" @click="cancalOrder(item.orderNo)" />
-               <q-btn color="primary" dense unelevated class="q-px-sm q-ml-sm" label="立即支付" @click="CommonJump('/pay/'+item.orderNo,{},'blank')" />
+               <q-btn color="primary" dense flat class="q-px-sm" label="取消訂單" 
+               :loading="item.cancalLoading"
+               @click.stop="cancalOrder(item,item.orderNo,index)" />
+               <q-btn v-if="item.orderStatus==1" color="primary" dense unelevated class="q-px-sm q-ml-sm" label="立即支付" @click.stop="CommonJump('/pay/'+item.orderNo,{},'blank')" />
             </div>
             <div class="q-mt-md text-right" v-else>
-              <q-btn color="dark" dense flat class="q-px-sm" @click="CommonJump('/orderinfo/'+item.orderNo,{},'blank')" label="查看訂單" />
+              <q-btn color="dark" dense flat class="q-px-sm" @click.stop="CommonJump('/orderinfo/'+item.orderNo,{},'blank')" label="查看訂單" />
            </div>
             </div>
           </div>
@@ -176,25 +180,96 @@ export default {
     this.getOrderList();
   },
   methods: {
-    cancalOrder(OrderNo) {
-      this.$q.dialog({
-        title: '取消確認',
-        message: '訂單取消後，系統將立即釋放位置，請問是否執行?',
-        cancel: true,
-        persistent: true
-      }).onOk(() => {
-        this.apipost('GetCancelOrder_post',{OrderNo},r=>{
-          if(r.data.resultCode==1){
-            this.$message.success('訂單取消成功')
-            this.getOrderList()
-          }else{
-            this.$message.error('訂單取消失敗，請重新嘗試')
-          }
+    cancalOrder(item,OrderNo,index) {
+      if(item.goodsType!=9){
+        this.$q.dialog({
+          title: '取消確認',
+          message: '訂單取消後，系統將立即釋放位置，請問是否執行?',
+          cancel: true,
+          persistent: true
+        }).onOk(() => {
+          this.erpCancelOrder(OrderNo,index)
+        }).onCancel(() => {
+          
         })
-      }).onCancel(() => {
-        
+      }else{
+        let cancelMsg = {
+          OrderNo: item.orderNo,
+          ErpOrderId: item.erpOrderId,
+          OrderTypeStr: "Hotel", //订单类型为酒店
+          ConfirmID: "",
+          Amount: 0,
+        };
+
+        // 未付款取消
+        if(item.orderStatus==1){
+          this.DiDaCancelOrder(cancelMsg,index)
+        }else if(item.orderStatus==2){//已付款取消
+          this.DiDaBookingCancel(item,cancelMsg,index)
+        }
+      }
+    },
+    erpCancelOrder(OrderNo,index){
+      this.orderList[index].cancalLoading = true
+      this.apipost('GetCancelOrder_post',{OrderNo},r=>{
+        if(r.data.resultCode==1){
+          this.$message.success('訂單取消成功')
+          this.getOrderList()
+        }else{
+          this.$message.error('訂單取消失敗，請重新嘗試')
+        }
+        this.orderList[index].cancalLoading = false
       })
     },
+    DiDaBookingCancel(item,cancelMsg,index){
+      this.orderList[index].cancalLoading = true
+      this.apipost('dmc_post_GetDiDaBookingCancel',{BookingID: item.thirdOrderNo},r=>{
+        this.orderList[index].cancalLoading = false
+        if(r.data.resultCode==1){
+          var tempData = r.data.data;
+          if (tempData) {
+            cancelMsg.ConfirmID = tempData.ConfirmID;
+						cancelMsg.Amount = tempData.Amount;
+            //有取消费用
+            var tipmsg = `訂單取消後，系統將立即釋放位置，請問是否執行?`
+						if (tempData.Amount && tempData.Amount > 0) {
+							tipmsg = `取消订单将收取【 ${tempData.Amount} 元】手续费，是否确认取消订单?`
+            }
+            this.$q.dialog({
+              title: '取消確認',
+              message: tipmsg,
+              cancel: true,
+              persistent: true
+            }).onOk(() => {
+              this.DiDaCancelOrder(cancelMsg,index)
+            }).onCancel(() => {
+              
+            })
+          }
+        }else{
+          this.$message.error('訂單取消失敗，請重新嘗試')
+        }
+      })
+    },
+    DiDaCancelOrder(postMsg,index) {
+      this.orderList[index].cancalLoading = true
+			this.apipost(
+				"post_CancelThirdHotelOrder", postMsg,
+				(res) => {
+					if (res.data.resultCode == 1) {
+						this.$message.success('訂單取消成功')
+            this.getOrderList()
+					}else{
+            this.$message.error('訂單取消失敗，請重新嘗試')
+          }
+          this.orderList[index].cancalLoading = false
+				},
+				(err) => {
+          this.$message.error('訂單取消失敗，請重新嘗試')
+          this.orderList[index].cancalLoading = false
+				}
+			);
+		},
     pageChange(value) {
       this.current = value;
       this.getOrderList();
@@ -247,10 +322,15 @@ export default {
             const { count, pageData, pageCount } = res.data.data;
             this.count = count;
             this.pageCount = pageCount;
+            let arrList = function(list){
+              list.forEach(x=>{
+                x.cancalLoading = false
+              })
+            }
+            arrList(pageData)
             this.orderList = pageData;
             this.orderList.forEach(x=>{
               x.goodTypeEnum = mappingListType(x.goodsType)
-              console.log(x.goodTypeEnum)
               x.orderStatusInfo = EnumHelper.ParseToEnum(OrderStatusEnum,x.orderStatus,'value')
             })
           } else {

src/pages/usercenter/order/orderDetail.vue

@@ -36,9 +36,12 @@
                 <!-- <q-btn color="primary" outline dense label="取消訂單" @click="cancalOrder" class="q-mr-md q-px-md"/>
                 <q-btn color="primary" unelevated dense label="前往付款" @click="goPayOrder" class="q-px-md"/> -->
                 
-            <div class="text-right" v-if="detail.OrderStatus==1">
-               <q-btn color="primary" dense outline class="q-px-sm" label="取消訂單" @click="cancalOrder(detail.OrderNo)" />
-               <q-btn color="primary" dense unelevated class="q-px-sm q-ml-sm" label="立即支付" @click="CommonJump('/pay/'+detail.OrderNo,{},'blank')" />
+            <div class="text-right" v-if="detail.OrderStatus==1||
+            (detail.GoodsType==9&&detail.OrderStatus==2)">
+               <q-btn color="primary" dense outline class="q-px-sm" label="取消訂單" 
+               :loading="cancalLoading"
+               @click="cancalOrder()" />
+               <q-btn v-if="detail.OrderStatus==1" color="primary" dense unelevated class="q-px-sm q-ml-sm" label="立即支付" @click="CommonJump('/pay/'+detail.OrderNo,{},'blank')" />
             </div>
             <!-- <div class="text-right" v-else>
               <q-btn color="dark" dense flat class="q-px-sm" @click="CommonJump('/orderinfo/'+orderNo,{},'blank')" label="查看訂單" />
@@ -55,6 +58,7 @@
               class="rounded-borders q-mr-md"
               spinner-color="grey-2"
               style="width: 150px"
+              :ratio="16/9"
             />
             <div class="col">
               <div class="text-body1 ellipsis">{{detail.GoodsName}}</div>
@@ -142,6 +146,7 @@ data() {
         iconColor: '',
         orderNo: '',
         loading: true,
+        cancalLoading: false,
     }
 },
 created() {},
@@ -154,28 +159,100 @@ mounted() {
     }
 },
 methods: {
-  goPayOrder() {
-    this.CommonJump('/pay/' + this.orderNo)
-  },
+    goPayOrder() {
+      this.CommonJump('/pay/' + this.orderNo)
+    },
     cancalOrder() {
-      this.$q.dialog({
-        title: '取消確認',
-        message: '訂單取消後，系統將立即釋放位置，請問是否執行?',
-        cancel: true,
-        persistent: true
-      }).onOk(() => {
-        this.apipost('GetCancelOrder_post',{OrderNo: this.orderNo},r=>{
-          if(r.data.resultCode==1){
-            this.$message.success('訂單取消成功')
-            window.location.reload()
-          }else{
-            this.$message.error('訂單取消失敗，請重新嘗試')
-          }
+      if(this.detail.GoodsType!=9){
+        this.$q.dialog({
+          title: '取消確認',
+          message: '訂單取消後，系統將立即釋放位置，請問是否執行?',
+          cancel: true,
+          persistent: true
+        }).onOk(() => {
+          this.erpCancelOrder()
+        }).onCancel(() => {
+          
         })
-      }).onCancel(() => {
-        
+      }else{
+        let cancelMsg = {
+          OrderNo: this.detail.OrderNo,
+          ErpOrderId: this.detail.ErpOrderId,
+          OrderTypeStr: "Hotel", //订单类型为酒店
+          ConfirmID: "",
+          Amount: 0,
+        };
+        // 未付款取消
+        if(this.detail.OrderStatus==1){
+          this.DiDaCancelOrder(cancelMsg)
+        }else if(this.detail.OrderStatus==2){//已付款取消
+          this.DiDaBookingCancel(cancelMsg)
+        }
+      }
+    },
+    erpCancelOrder() {
+      this.cancalLoading = true
+      this.apipost('GetCancelOrder_post',{OrderNo: this.orderNo},r=>{
+        if(r.data.resultCode==1){
+          this.$message.success('訂單取消成功')
+          window.location.reload()
+        }else{
+          this.$message.error('訂單取消失敗，請重新嘗試')
+        }
+        this.cancalLoading = false
       })
     },
+    DiDaBookingCancel(cancelMsg){
+       this.cancalLoading = true
+      this.apipost('dmc_post_GetDiDaBookingCancel',{BookingID: this.detail.ThirdOrderNo},r=>{
+        this.cancalLoading = false
+        if(r.data.resultCode==1){
+          var tempData = r.data.data;
+          if (tempData) {
+            cancelMsg.ConfirmID = tempData.ConfirmID;
+						cancelMsg.Amount = tempData.Amount;
+            //有取消费用
+            var tipmsg = `訂單取消後，系統將立即釋放位置，請問是否執行?`
+						if (tempData.Amount && tempData.Amount > 0) {
+							tipmsg = `取消订单将收取【 ${tempData.Amount} 元】手续费，是否确认取消订单?`
+            }
+						this.$q.dialog({
+              title: '取消確認',
+              message: tipmsg,
+              cancel: true,
+              persistent: true
+            }).onOk(() => {
+              console.log(cancelMsg,'----获取手续费接口')
+              this.DiDaCancelOrder(cancelMsg)
+            }).onCancel(() => {
+              
+            })
+          }
+        }else{
+          this.$message.error('訂單取消失敗，請重新嘗試')
+        }
+      })
+    },
+    DiDaCancelOrder(postMsg) {
+      this.cancalLoading = true
+      console.log(postMsg,'----取消接口')
+			this.apipost(
+				"post_CancelThirdHotelOrder", postMsg,
+				(res) => {
+					if (res.data.resultCode == 1) {
+						this.$message.success('訂單取消成功')
+            window.location.reload()
+					}else{
+            this.$message.error('訂單取消失敗，請重新嘗試')
+          }
+          this.cancalLoading = false
+				},
+				(err) => {
+          this.$message.error('訂單取消失敗，請重新嘗試')
+          this.cancalLoading = false
+				}
+			);
+		},
     goHomeHandler(){
       this.loading=false
       setTimeout(() => {
@@ -189,6 +266,7 @@ methods: {
         },
         (res) => {
           if (res.data.resultCode == 1) {
+            let data = res.data.data
             this.detail = res.data.data
             this.orderIcon = ["","icontime1","iconsuccess", "iconsuccess", "icontishi"][this.detail.OrderStatus]
             this.iconColor = ["","blue","blue", "green", "grey"][this.detail.OrderStatus]