changes

app/components/pos/CartItem.vue

@@ -2,6 +2,7 @@
 const props = defineProps({
   cartItem: Object,
   deleteable: Boolean,
+  invalid: Boolean,
 });
 const { $deleteapi, $formatNum, $snackbar } = useNuxtApp();
 const { getCarts } = inject("pos");
@@ -30,7 +31,12 @@ async function removeFromCart() {
 </script>
 
 <template>
-  <div class="card m-0">
+  <div
+    class="card m-0"
+    :style="{
+      borderColor: invalid ? 'var(--bulma-danger-70)' : '',
+    }"
+  >
     <div class="card-content p-4 is-flex is-gap-2 is-justify-content-space-between is-align-items-center">
       <div class="is-flex is-gap-4 is-justify-content-space-between is-align-items-center is-flex-grow-1">
         <div class="media m-0">
@@ -48,6 +54,14 @@ async function removeFromCart() {
               <span> • </span>
               <span>{{ cartItem.imei__variant__color__name }}</span>
             </p>
+            <p
+              v-if="invalid"
+              class="is-size-7 has-text-danger-40"
+            >
+              IMEI sản phẩm
+              <span class="tag is-light is-danger fs-11">{{ cartItem.imei__imei }}</span>
+              không có sẵn
+            </p>
           </div>
         </div>
         <p class="has-text-primary-50 font-medium">