40 lines
1.1 KiB
Vue
40 lines
1.1 KiB
Vue
<script setup>
|
|
import { toDateFormat } from 'src/filters/date.js';
|
|
|
|
defineProps({ date: { type: [Date, String], required: true } });
|
|
|
|
function getBadgeAttrs(date) {
|
|
let today = Date.vnNew();
|
|
today.setHours(0, 0, 0, 0);
|
|
let timeTicket = new Date(date);
|
|
timeTicket.setHours(0, 0, 0, 0);
|
|
|
|
let timeDiff = today - timeTicket;
|
|
|
|
if (timeDiff == 0) return { color: 'warning', class: 'black-text-color' };
|
|
if (timeDiff < 0) return { color: 'success', class: 'black-text-color' };
|
|
return { color: 'transparent', class: 'normal-text-color' };
|
|
}
|
|
|
|
function formatShippedDate(date) {
|
|
if (!date) return '-';
|
|
const dateSplit = date.split('T');
|
|
const [year, month, day] = dateSplit[0].split('-');
|
|
const newDate = new Date(year, month - 1, day);
|
|
return toDateFormat(newDate);
|
|
}
|
|
</script>
|
|
<template>
|
|
<QBadge v-bind="getBadgeAttrs(date)" class="q-pa-sm" style="font-size: 14px">
|
|
{{ formatShippedDate(date) }}
|
|
</QBadge>
|
|
</template>
|
|
<style lang="scss">
|
|
.black-text-color {
|
|
color: var(--vn-black-text-color);
|
|
}
|
|
.normal-text-color {
|
|
color: var(--vn-text-color);
|
|
}
|
|
</style>
|