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

refactor: request list => meta data display

Browse source
This commit is contained in:
puriphatt 2024-11-29 16:33:50 +07:00
parent e7eb53dd57
commit 7109d626ba
3 changed files with 82 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

1
src/i18n/eng.ts
View file

@ -861,6 +861,7 @@ export default {
localEmployee: 'Local Employee',
nonLocalEmployee: 'Non Local Employee',
noWorkflowTemplate: 'A workflow template has not been selected.',
ref: 'Reference',
status: {
work: {
Pending: 'Await for order',

1
src/i18n/tha.ts
View file

@ -853,6 +853,7 @@ export default {
localEmployee: 'พนักงานในพื้นที่',
nonLocalEmployee: 'พนักงานนอกพื้นที่',
noWorkflowTemplate: 'คุณไม่ได้เลือกแม่แบบขั้นตอนการทำงาน',
ref: 'อ้างอิง',
status: {
work: {
Pending: 'รอสั่งงาน',

84
src/pages/08_request-list/RequestListView.vue
View file

@ -8,6 +8,7 @@ import DataDisplay from 'src/components/08_request-list/DataDisplay.vue';
import DocumentExpansion from './DocumentExpansion.vue';
import FormExpansion from './FormExpansion.vue';
import PropertiesExpansion from './PropertiesExpansion.vue';
import FormGroupHead from './FormGroupHead.vue';
// NOTE: Store
import { dateFormatJS } from 'src/utils/datetime';
@ -369,9 +370,9 @@ const successAll = computed(() => {
</nav>
<!-- meta data -->
<article class="surface-1 rounded q-pa-sm">
<article class="surface-1 rounded">
<div
class="text-weight-bold row items-center no-wrap"
class="text-weight-bold row items-center no-wrap q-pa-sm"
style="gap: 16px"
>
<q-img src="/images/quotation-avatar.png" width="42px" />
@ -394,10 +395,85 @@ const successAll = computed(() => {
<transition name="slide">
<section
v-if="!pageState.hideMetaData"
class="q-pt-md"
class=""
:class="{ row: $q.screen.gt.sm, column: $q.screen.lt.md }"
>
<FormGroupHead class="col-12">
{{ $t('requestList.ref') }}
</FormGroupHead>
<div
class="col-12 q-pa-sm"
:class="{
row: $q.screen.gt.sm,
'column q-gutter-y-sm': $q.screen.lt.md,
}"
>
<DataDisplay
class="col"
icon="mdi-file-document-outline"
:label="$t('requestList.quotationCode')"
:value="data.quotation.code || '-'"
/>
<DataDisplay
class="col"
icon="mdi-file-document-outline"
tooltip
:label="$t('requestList.invoiceCode')"
:value="
data.quotation?.invoice
?.map((i: Invoice) => i.code)
.join(', ') || '-'
"
/>
<DataDisplay
class="col"
icon="mdi-file-document-outline"
tooltip
:label="$t('requestList.receiptCode')"
:value="
data.quotation?.invoice
?.flatMap((i: Invoice) => i.payment?.code || [])
.join(', ') || '-'
"
/>
<div v-if="$q.screen.gt.sm" class="col"></div>
</div>
<FormGroupHead class="col-12">
{{ $t('quotation.employee') }}
</FormGroupHead>
<div
class="col-12 q-pa-sm"
:class="{
row: $q.screen.gt.sm,
'column q-gutter-y-sm': $q.screen.lt.md,
}"
>
<DataDisplay
class="col"
icon="mdi-account-settings-outline"
:label="$t('customer.employer')"
:value="
getCustomerName(data, { locale: locale, noCode: true }) ||
'-'
"
/>
<DataDisplay
class="col"
icon="mdi-account-settings-outline"
:label="$t('customer.employee')"
:value="
getEmployeeName(data, { locale: $i18n.locale }) || '-'
"
/>
<DataDisplay
class="col"
icon="mdi-passport"
:label="$t('customerEmployee.form.passportNo')"
:value="data.employee.employeePassport?.[0]?.number || '-'"
/>
<div v-if="$q.screen.gt.sm" class="col"></div>
</div>
<!-- <div
class="col q-gutter-y-md"
:class="{ column: $q.screen.gt.sm, row: $q.screen.lt.md }"
>
@ -491,7 +567,7 @@ const successAll = computed(() => {
:label="$t('flow.responsiblePerson')"
:value="'-'"
/>
</div>
</div> -->
</section>
</transition>
</article>