refactor(04): service work product price color

This commit is contained in:
puriphatt 2024-08-15 15:18:26 +07:00
parent 3f4a3dde90
commit 2f289cfaea
3 changed files with 60 additions and 14 deletions

View file

@ -235,7 +235,7 @@ defineEmits<{
<div
class="row col items-center justify-between full-width surface-1 q-py-md q-px-sm"
>
<div class="row items-center col-9 no-wrap" v-if="productItems">
<div class="row items-center col-8 no-wrap" v-if="productItems">
<q-btn
v-if="!readonly"
id="btn-product-up"
@ -302,8 +302,8 @@ defineEmits<{
</q-tooltip>
</span>
<div
class="bordered q-px-sm"
style="border-radius: 6px; max-width: 60px"
class="bordered q-px-xs ellipsis"
style="border-radius: 6px; max-width: 100px"
>
{{ product.code }}
</div>
@ -311,17 +311,44 @@ defineEmits<{
</div>
</div>
<div class="row justify-end text-right col-3 q-pr-sm">
<div class="row justify-end text-right col q-pr-sm">
<span
class="col-12 text-weight-bold text-h6"
class="col-12 q-col-gutter-md row"
style="color: var(--teal-9)"
>
฿ {{ formatNumberDecimal(product.price, 2) }}
<span class="col ellipsis price-orange text-weight-bold">
<div class="text-caption app-text-muted-2">
{{ $t('salePrice') }}
</div>
฿{{ formatNumberDecimal(product.price, 2) }}
<q-tooltip>
฿{{ formatNumberDecimal(product.price, 2) }}
</q-tooltip>
</span>
<span class="col ellipsis price-purple text-weight-bold">
<div class="text-caption app-text-muted-2">
{{ $t('agentPrice') }}
</div>
฿{{ formatNumberDecimal(product.agentPrice, 2) }}
<q-tooltip>
฿{{ formatNumberDecimal(product.agentPrice, 2) }}
</q-tooltip>
</span>
<span class="col ellipsis price-pink column">
<div class="text-caption app-text-muted-2">
{{ $t('processingPrice') }}
</div>
฿{{ formatNumberDecimal(product.serviceCharge, 2) }}
<q-tooltip>
฿{{ formatNumberDecimal(product.serviceCharge, 2) }}
</q-tooltip>
</span>
</span>
<span class="col-9 text-caption app-text-muted-2">
<span class="col-9 q-mt-sm text-caption app-text-muted-2">
{{ $t('processTime') }}
</span>
<span class="col-3 text-caption app-text-muted-2">
<span class="col-3 q-mt-sm text-caption app-text-muted-2">
{{ product.process }} {{ $t('day') }}
</span>
</div>
@ -338,7 +365,9 @@ defineEmits<{
round
color="negative"
@click.stop="$emit('deleteProduct', productItems, index)"
/>
>
<q-tooltip>{{ $t('delete') }}</q-tooltip>
</q-btn>
</div>
</div>
<div v-else class="app-text-muted q-py-md q-px-lg">
@ -381,4 +410,22 @@ defineEmits<{
padding-top: 16px;
min-width: 0px;
}
.price-orange {
color: var(--orange-5);
&.dark {
color: var(--orange-6);
}
}
.price-purple {
color: var(--violet-11);
&.dark {
color: var(--violet-10);
}
}
.price-pink {
color: var(--pink-6);
}
</style>

View file

@ -15,7 +15,6 @@ const role = ref();
onMounted(async () => {
const uid = getUserId();
role.value = getRole();
console.log(role.value);
if (!uid) return;

View file

@ -3012,7 +3012,7 @@ watch(
{{ $t('salePrice') }}
</div>
<div class="col-4 text-weight-bold">
{{
฿{{
formatNumberDecimal(props.row.price || 0, 2)
}}
</div>
@ -3028,7 +3028,7 @@ watch(
{{ $t('agentPrice') }}
</div>
<div class="col-4 text-weight-bold">
{{
฿{{
formatNumberDecimal(
props.row.agentPrice || 0,
2,
@ -3046,8 +3046,8 @@ watch(
<div class="col-4 app-text-muted-2">
{{ $t('processingPrice') }}
</div>
<div class="col-4 text-weight-bold">
{{
<div class="col-4">
฿{{
formatNumberDecimal(
props.row.serviceCharge || 0,
2,