<script setup>
import { useOrderStore } from "@/stores/OrderStore";
const { returnedStatus } = useOrderStore();
const getStatusColor = () => {
  switch (returnedStatus) {
    case "ready_for_returned":
      return "text-green-600 bg-green-100";
    case "partial_returned":
      return "text-primary-600 bg-primary-100";
    case "all_returned":
      return "text-primary-600 bg-primary-100";
  }
};
</script>
<template>
  <div class="my-2">
    <div
      :class="`${getStatusColor()} flex !w-full py-2 px-4 gap-1 rounded-md font-semibold justify-center`"
    >
      <check-circle-icon
        v-if="returnedStatus === 'ready_for_returned'"
        class="w-4"
      />
      {{ $t(returnedStatus) }}
      <span v-if="returnedStatus === 'ready_for_returned'">📦</span>
    </div>
  </div>
</template>
