代码提交

components/refund-order/refund-order.vue

@@ -0,0 +1,200 @@
+<template>
+  <view>
+    <view
+        :class="['order', className]"
+        v-if="data"
+    >
+
+      <view
+          class="order-header"
+          @tap="toOrderInfo"
+      >
+        <view class="order-logo">
+          <view class="color-y">Y</view>
+          <view>SHOP商城</view>
+        </view>
+        <view class="order-status status-2">
+          {{ refundOrderStatus[data.state] }}
+        </view>
+      </view>
+      <view
+          class="order-goods"
+          @tap="toOrderInfo"
+      >
+        <goods
+            list
+            interval
+            desc="3"
+            showAction
+            model
+            :purchase="item.cartNum"
+            :data="item.productInfo"
+            :price="item.truePrice"
+            v-for="(item, index) in data.cartInfo"
+        />
+      </view>
+      <view
+          class="refund-order-info"
+          @tap="toOrderInfo"
+      >
+        <text
+            class="text"
+            :class="data.state === 3 && 'color-y'"
+        >{{ data.state === 3 ? '成功退款' : '待平台处理' }}
+        </text>
+        <text class="text">{{ data.state === 3 ? '成功' : '' }}退款¥{{data.refundAmount}}</text>
+      </view>
+
+        <view class="order-actions">
+          <!-- 已完成 -->
+          <view class="order-actions-left">
+          </view>
+          <view class="order-actions-btns">
+            <view
+                class="order-actions-default"
+                @tap="handleDelete"
+                v-if="[3,4].includes(data.state)"
+            >
+              删除记录
+            </view>
+            <view
+                class="order-actions-default"
+                @tap="handleRevoke"
+                v-if="[0,1].includes(data.state)"
+            >
+              撤销申请
+            </view>
+            <view
+                class="order-actions-default"
+                @tap="toRefund"
+                v-if="data.state === 5"
+            >
+              再次申请
+            </view>
+            <view
+                class="order-actions-default"
+                @tap="toAddLogistics"
+                v-if="data.state === 1"
+            >
+              填写物流
+            </view>
+            <view
+                class="order-actions-primary"
+                @tap="toOrderInfo"
+            >
+              查看详情
+            </view>
+          </view>
+        </view>
+
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+import { afterSalesOrderDelete, afterSalesOrderRevoke } from '@/api/order'
+
+import { useRouter } from "@/hooks/useRouter";
+import { refundOrderStatus } from '@/config'
+
+const {push} = useRouter()
+
+const emit = defineEmits(['refresh'])
+
+const props = defineProps(['class', 'data'])
+
+const data = ref(props.data)
+
+// 运费金额
+const freightPrice = ref(props.data.freightPrice)
+// 实际支付金额
+const payPrice = ref(props.data.payPrice)
+// 优惠券金额
+const couponPrice = ref(props.data.couponPrice)
+// 订单总价
+const totalPrice = ref(props.data.totalPrice)
+
+// 删除记录
+const handleDelete = async () => {
+  uni.showModal({
+    title: '提示',
+    content: '确认删除记录',
+    success: async (res) => {
+      if (res.confirm) {
+        await afterSalesOrderDelete({
+          id: data.value.id,
+          orderCode: data.value.orderCode
+        })
+        data.value = null
+        uni.showToast({
+          title: '已删除',
+          duration: 2000
+        });
+      } else if (res.cancel) {
+      }
+    }
+  });
+}
+
+// 撤销申请
+const handleRevoke = async () => {
+  uni.showModal({
+    title: '提示',
+    content: '确认撤销申请吗',
+    success: async (res) => {
+      if (res.confirm) {
+        await afterSalesOrderRevoke({
+          id: data.value.id,
+          key: data.value.orderCode
+        })
+        data.value = null
+        uni.showToast({
+          title: '已撤销',
+          duration: 2000
+        });
+      } else if (res.cancel) {
+      }
+    }
+  });
+}
+
+// 查看详情
+const toOrderInfo = () => {
+  push({url: '/pages/refundInfo/refundInfo'}, {
+    data: {
+      id: data.value.id,
+    }
+  })
+}
+
+// 填写物流
+const toAddLogistics = () => {
+  push({url: '/pages/addLogistics/addLogistics'}, {
+    data: {
+      id: data.value.id,
+      orderCode: data.value.orderCode
+    }
+  })
+}
+
+
+// 再次申请
+const toRefund = () => {
+  console.log(data.value)
+  push({url: '/pages/refund/refund'}, {
+    data: {
+      refundType: data.value.serviceType,
+      goods: data.value.cartInfo.map(v=>{
+        return v.productAttrUnique
+      }).toString(),
+      id: data.value.orderId
+    }
+  })
+}
+
+</script>
+
+<style lang="scss">
+
+</style>