<!--
    @name: Options
    @author: kahu4
    @date: 2024-01-16 18:21
    @description：Options
    @update: 2024-01-16 18:21
-->
<script setup>
import { toRefs } from "vue";

const emits = defineEmits(['cancel', 'pay', 'refund', 'delete', 'confirm', 'invite', 'cancelRefund'])
/**
 * @property {status} 订单状态
 */
const props = defineProps({
  status: {
    type: String,
    required: true
  },
  shopType: {
    type: [String, Number],
    required: true
  }
})
const {status, shopType} = toRefs(props)
</script>

<template>
  <view class="options">
    <view
        v-if="status === '0'"
        class="order-actions-delete item"
        @click="emits('cancel')"
    >
      取消订单
    </view>
    <view
        v-if="status === '0'"
        class="order-actions-primary item"
        @tap="emits('pay')"
    >
      立即付款
    </view>
    <!-- 除了待付款和已取消 -->
    <view
        v-if="(shopType===1&&['1','2','3','4','8','6'].includes(status)) || (shopType===2&&['6'].includes(status)) "
        class="order-actions-delete item"
        @tap="emits('refund')"
    >
      申请退款
    </view>
    <view
        v-if="(shopType ===2 && ['8'].includes(status))"
        class="order-actions-default item"
        @tap="emits('cancelRefund')"
    >
      取消订单
    </view>
    <!-- 核销码 -->
    <view
        v-if="status==='8' && shopType === 2"
        class="order-actions-primary item"
        @tap="emits('checkOffCode')"
    >
      核销码
    </view>
    <!-- 已完成 -->
    <view
        v-if="['4','5','-2'].includes(status)"
        class="order-actions-primary item"
        @tap="emits('delete')"
    >
      删除订单
    </view>
    <!-- 已发货 待收货 -->
    <view
        v-if="status === '2'"
        class="order-actions-primary item"
        @tap="emits('confirm')"
    >
      确认收货
    </view>
    <!-- 已发货 待收货 -->
    <view
        v-if="status === '6'"
        class="order-actions-primary item"
        @tap="emits('invite')"
    >
      邀请好友拼团
    </view>
  </view>

</template>

<style
    lang="scss"
    scoped>
.options {
  width: 100%;
  display: flex;

  .item {
    flex: 1;
  }

}
</style>
