取消订单接口

src/components/Pay/WePay.vue

@@ -9,7 +9,7 @@
                 </div>
                 <div class="text-body2 q-mt-lg text-grey-6">请打开微信（WeChat），使用 [扫一扫]扫描上方二维码进行支付</div>
                 <div class="q-mt-xl text-right">
-                    <el-button class="q-px-md q-mr-md" @click="close">取消支付</el-button>
+                    <el-button class="q-px-md q-mr-md" @click="close" :loading="CancelLoading">取消支付</el-button>
                     <el-button type="primary" class="q-px-md" @click="CompletePayment">已完成付款</el-button>
                 </div>
             </div>
@@ -21,7 +21,7 @@ import { ref } from "vue";
 import QRCode from '../QRCode/QRCode.vue';
 import OrderService from "@/services/OrderService";
 import { ApiResult } from "@/configs/axios";
-import { ElMessage } from 'element-plus';
+import { ElMessage, ElMessageBox } from 'element-plus';
 const props = defineProps({
     orderid: {
         type: Number,
@@ -34,8 +34,33 @@ const emit = defineEmits<{
 
 const orders = ref({} as any)
 const loading = ref(false)
-const close = ()=>{
-    emit('close')
+const CancelLoading = ref(false)
+const close = async ()=>{
+    ElMessageBox.confirm(
+        `此操作将取消该订单，是否确定?`,
+        "提示",
+        {
+            confirmButtonText: "确定",
+            cancelButtonText: "取消",
+            type: "warning",
+        })
+        .then(async () => {
+            try {
+              await CanceltOrders()
+            } catch (error) { }
+        })
+        .catch(() => { });
+    
+}
+const CanceltOrders = async ()=>{
+  if(CancelLoading.value)return
+  CancelLoading.value=true
+  const response = await OrderService.CancelPPTOrder(props.orderid)
+  if(response.data.resultCode == ApiResult.SUCCESS){
+    emit('success')
+  }
+
+  CancelLoading.value=false
 }
 
 const CompletePayment = async () => {

src/views/UserCenter/Order.vue

@@ -82,6 +82,7 @@ import { ref, onMounted } from "vue";
 import { useRouter } from "vue-router";
 import { openNewBlank } from '@/utils/common'
 import WePay from '@/components/Pay/WePay.vue'
+import { ElMessageBox } from "element-plus";
 const activeName = ref<string>('all')
 const parameters = ref({
   pageIndex:1,