feat: show status as badge

This commit is contained in:
Vlad Stan
2022-07-08 13:50:09 +03:00
parent cce341fb39
commit ccae7876d9

View File

@ -18,7 +18,6 @@
<h5 class="text-subtitle1 q-my-none">Charges</h5> <h5 class="text-subtitle1 q-my-none">Charges</h5>
</div> </div>
<div class="col q-pr-lg"> <div class="col q-pr-lg">
<q-input <q-input
borderless borderless
@ -91,41 +90,6 @@
</q-btn> </q-btn>
</q-td> </q-td>
<q-td auto-width> <q-td auto-width>
<q-btn
v-if="props.row.time_elapsed && props.row.balance < props.row.amount"
unelevated
flat
dense
size="xs"
icon="error"
:color="($q.dark.isActive) ? 'red' : 'red'"
>
<q-tooltip> Time elapsed </q-tooltip>
</q-btn>
<q-btn
v-else-if="props.row.balance >= props.row.amount"
unelevated
flat
dense
size="xs"
icon="check"
:color="($q.dark.isActive) ? 'green' : 'green'"
>
<q-tooltip> PAID! </q-tooltip>
</q-btn>
<q-btn
v-else
unelevated
dense
size="xs"
icon="cached"
flat
:color="($q.dark.isActive) ? 'blue' : 'blue'"
>
<q-tooltip> Processing </q-tooltip>
</q-btn>
<q-btn <q-btn
flat flat
dense dense
@ -136,6 +100,21 @@
> >
<q-tooltip> Delete charge </q-tooltip> <q-tooltip> Delete charge </q-tooltip>
</q-btn> </q-btn>
<q-badge
v-if="props.row.time_elapsed && props.row.balance < props.row.amount"
color="red"
>
expired
</q-badge>
<q-badge
v-else-if="props.row.balance >= props.row.amount"
color="green"
>
paid
</q-badge>
<q-badge v-else color="blue"> waiting </q-badge>
</q-td> </q-td>
<q-td <q-td
v-for="col in props.cols" v-for="col in props.cols"