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

refactor: จัด ข้อมูลของ บริการและสินค้า

Browse source
This commit is contained in:
Net 2024-07-09 16:18:48 +07:00
parent 8e1b1ef66f
commit cd51de0159
1 changed files with 65 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

74
src/pages/04_product-service/MainPage.vue
View file

@ -30,6 +30,9 @@ import PaginationComponent from 'src/components/PaginationComponent.vue';
import useFlowStore from 'src/stores/flow';
import useMyBranchStore from 'src/stores/my-branch';
import { dateFormat } from 'src/utils/datetime';
import {formatNumberDecimal} from 'src/stores/utils';
const useMyBranch = useMyBranchStore();
const { fetchListOptionBranch } = useMyBranch;
@ -253,7 +256,7 @@ const tbColumn = {
},
{
name: 'priceInformation',
align: 'left',
align: 'center',
label: 'priceInformation',
field: 'name',
},
@ -272,6 +275,12 @@ const tbColumn = {
label: 'serviceWorkTotal',
field: (v) => v.work.length,
},
{
name: 'createdAt',
align: 'left',
label: 'createdAt',
field: 'createdAt',
}
],
} satisfies {
groupAndType: QTableProps['columns'];
@ -300,8 +309,8 @@ const tbControl = reactive({
],
},
service: {
fieldDisplay: ['serviceName', 'serviceDetail', 'serviceWorkTotal'],
fieldSelected: ['serviceName', 'serviceDetail', 'serviceWorkTotal'],
fieldDisplay: ['serviceName', 'serviceDetail', 'serviceWorkTotal' ,'createdAt'],
fieldSelected: ['serviceName', 'serviceDetail', 'serviceWorkTotal' ,'createdAt'],
},
});
@ -1509,7 +1518,7 @@ watch(inputSearchProductAndService, async () => {
</q-td>
<q-td v-if="tbControl.groupAndType.fieldSelected.includes('createdAt')">
88585
{{dateFormat(props.row.createdAt)}}
</q-td>
@ -2320,7 +2329,7 @@ watch(inputSearchProductAndService, async () => {
margin-bottom: var(--size-2);
"
>
<div class="table__icon" :class="`icon-color-${productAndServiceTab ==='product' ? 'orange' : 'green'}`">
<div class="table__icon" :class="`icon-color-${productAndServiceTab ==='product' ? 'green' : 'orange'}`">
<q-icon
size="md"
style="scale: 0.8"
@ -2384,7 +2393,37 @@ watch(inputSearchProductAndService, async () => {
)
"
>
price
<div class="row tags-color-green q-gutter-x-md no-wrap items-center text-right ">
<div class="tags col-3 column ellipsis-2-lines " style=" min-width: 50px;">
<div class="col-4">{{$t('salePrice')}}</div>
<div class="col-4 text-weight-bold">{{ formatNumberDecimal(props.row.price || 0 , 2) }}</div>
</div>
<div class="tags col-3 column ellipsis-2-lines" style=" min-width: 50px;">
<div class="col-4">{{$t('agentPrice')}}</div>
<div class="col-4 text-weight-bold">{{ formatNumberDecimal(props.row.agentPrice || 0 , 2) }}</div>
</div>
<div class="tags col-3 column ellipsis-2-lines" style=" min-width: 50px;">
<div class="col-4">{{$t('processingPrice')}}</div>
<div class="col-4 text-weight-bold">{{ formatNumberDecimal(props.row.processingPrice || 0 , 2) }}</div>
</div>
</div>
</q-td>
<q-td
v-if="
{
product: tbControl.product.fieldSelected,
service: tbControl.service.fieldSelected,
}[productAndServiceTab].includes( 'createdAt')
"
>
{{ dateFormat(props.row.createdAt) }}
</q-td>
<q-td>
<q-btn
@ -3280,15 +3319,23 @@ watch(inputSearchProductAndService, async () => {
--_color: var(--orange-5-hsl);
}
.icon-color-green {
.icon-color-green {
--_color: var(--teal-10-hsl);
}
.tags-color-green {
--_color-tag: var(--teal-10-hsl);
}
.dark .tags-color-green {
--_color-tag: var(--teal-8-hsl);
}
.dark .icon-color-purple {
--_color: var(--violet-10-hsl);
}
.dark .icon-color-green {
.dark .icon-color-green {
--_color: var(--teal-8-hsl);
}
@ -3327,5 +3374,14 @@ watch(inputSearchProductAndService, async () => {
}
.tags {
display: inline-block;
color: hsla(var(--_color-tag) / 1);
background: hsla(var(--_color-tag) / 0.15);
border-radius: var(--radius-2);
padding-inline: var(--size-2);
}
</style>
toggleStatusGroup(props.row