chamomind/jws-frontend
chamomind/jws-frontend
7
0
Fork 0
Code Issues Projects Releases Packages 1 Wiki Activity Actions

refactor: handle color badge

Browse source
This commit is contained in:
Thanaphon Frappet 2024-11-08 11:13:18 +07:00
parent 1aaaa5f2a6
commit 9e70383d3b
1 changed files with 12 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

17
src/components/05_quotation/TableQuotation.vue
View file

@ -1,12 +1,18 @@
<script lang="ts" setup> <script lang="ts" setup>
import { QTableProps } from 'quasar'; import { QTableProps } from 'quasar';
import { QuotationPayload } from 'src/stores/quotations/types'; import { dateFormat } from 'src/utils/datetime';
import BadgeComponent from 'components/BadgeComponent.vue'; import BadgeComponent from 'components/BadgeComponent.vue';
import KebabAction from 'components/shared/KebabAction.vue'; import KebabAction from 'components/shared/KebabAction.vue';
import { setLocale, calculateAge, dateFormat } from 'src/utils/datetime';
import useOptionStore from 'src/stores/options';
const optionStore = useOptionStore(); const hslaColors: Record<string, string> = {
Issued: '--orange-5-hsl',
Accepted: '--pink-6-hsl',
Expired: '--cyan-7-hsl',
PaymentInProcess: '--purple-7-hsl',
PaymentSuccess: '--orange-11-hsl',
ProcessComplete: '--blue-10-hsl',
};
const props = withDefaults( const props = withDefaults(
defineProps<{ defineProps<{
@ -35,7 +41,7 @@ function quotationStatus(value: string) {
if (value === 'Issued') return 'quotation.status.Issued'; if (value === 'Issued') return 'quotation.status.Issued';
if (value === 'Accepted') return 'quotation.status.Accepted'; if (value === 'Accepted') return 'quotation.status.Accepted';
if (value === 'Expired') return 'quotation.status.Expired'; if (value === 'Expired') return 'quotation.status.Expired';
if (value === 'PaymentInProcess') return 'quotation.status.PaymentInProcess'; if (value === 'PaymentInProcess') return 'quotation.status.Invoice';
if (value === 'PaymentSuccess') return 'quotation.status.PaymentSuccess'; if (value === 'PaymentSuccess') return 'quotation.status.PaymentSuccess';
if (value === 'ProcessComplete') return 'quotation.status.ProcessComplete'; if (value === 'ProcessComplete') return 'quotation.status.ProcessComplete';
return ''; return '';
@ -109,6 +115,7 @@ defineEmits<{
<q-td v-if="visibleColumns.includes('status')"> <q-td v-if="visibleColumns.includes('status')">
<BadgeComponent <BadgeComponent
:title="$t(quotationStatus(props.row.quotationStatus))" :title="$t(quotationStatus(props.row.quotationStatus))"
:hsla-color="hslaColors[props.row.quotationStatus] || ''"
/> />
</q-td> </q-td>