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

fix(04): Service

Browse source
This commit is contained in:
puriphatt 2024-08-14 17:12:52 +07:00
parent d41a2ad010
commit 68038c5a09
5 changed files with 165 additions and 45 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/components/04_product-service/BasicInformation.vue
View file

@ -185,7 +185,7 @@ const branchFilter = selectFilterOptionRefMod(
hide-bottom-space
type="textarea"
class="col-12"
:label="$t('serviceDetail')"
:label="$t('detail')"
v-model="serviceDescription"
/>
</div>

6
src/components/04_product-service/FormServiceProperties.vue
View file

@ -18,7 +18,7 @@ defineEmits<{
}>();
</script>
<template>
<div class="full-width full-height">
<div class="column full-width full-height">
<div
class="text-weight-bold text-body1 flex items-center justify-between q-px-md q-py-sm"
style="background: hsla(var(--info-bg) / 0.1)"
@ -44,10 +44,10 @@ defineEmits<{
</q-btn>
</div>
<div class="col-12 row q-px-md q-py-xs items-center surface-1 scroll">
<div class="col scroll q-px-md q-py-sm flex items-center">
<div
v-if="serviceAttributes.additional.length > 0"
class="row items-center q-gutter-sm items-center"
class="row q-gutter-sm"
>
<div
v-for="(p, index) in serviceAttributes.additional"

27
src/components/04_product-service/FormServiceWork.vue
View file

@ -4,7 +4,7 @@ import { moveItemUp, moveItemDown, deleteItem, dialog } from 'stores/utils';
import NoData from 'components/NoData.vue';
import WorkManagementComponent from './WorkManagementComponent.vue';
import AddButton from '../button/AddButton.vue';
import { WorkItems } from 'stores/product-service/types';
const { t } = useI18n();
@ -50,19 +50,20 @@ function confirmDelete(items: unknown[], index: number) {
<template>
<div class="column col-12 full-height no-wrap">
<div
class="app-text-muted row items-start q-pb-md"
style="min-height: 40px"
>
• {{ $t(`workInformation`) }}
<q-btn
v-if="!readonly"
icon="mdi-plus"
dense
<div class="text-weight-bold text-body1 row items-center q-pb-md">
<q-icon
flat
round
padding="0"
color="primary"
size="xs"
class="q-pa-sm rounded q-mr-sm"
color="info"
name="mdi-briefcase-outline"
style="background-color: var(--surface-3)"
/>
{{ $t(`workInformation`) }}
<AddButton
v-if="!readonly"
id="btn-add-work"
icon-only
class="q-ml-sm"
@click="addWork"
/>

2
src/components/04_product-service/ServiceProperties.vue
View file

@ -230,7 +230,7 @@ function confirmDelete(items: unknown[], index: number) {
}
</script>
<template>
<div class="full-width column no-wrap">
<div class="full-width full-height column no-wrap">
<div class="row">
<q-btn-dropdown
icon="mdi-plus"

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

@ -266,16 +266,6 @@ const formDataProductService = ref<ServiceCreate>({
registeredBranchId: '',
});
const serviceTab = [
{
name: 'serviceInformation',
label: 'serviceInformation',
},
{
name: 'workInformation',
label: 'workInformation',
},
];
const hideStat = ref(false);
const tbColumn = {
@ -1054,9 +1044,10 @@ function assignFormDataProductServiceCreate() {
async function submitService() {
assignFormDataProductServiceCreate();
formDataProductService.value.image = imageProduct.value;
formDataProductService.value.productTypeId = currentIdType.value;
if (profileFileImg.value)
formDataProductService.value.image = profileFileImg.value;
if (dialogService.value) {
formDataProductService.value.productTypeId = currentIdType.value;
@ -2935,7 +2926,8 @@ watch(
? 'mdi-shopping'
: 'mdi-server-network'
"
style="color: var(--teal-10); top: 10%"
style="top: 10%"
:style="`color: var(--${productAndServiceTab === 'product' ? 'teal-10' : 'orange-5'})`"
/>
</template>
</q-img>
@ -3775,7 +3767,7 @@ watch(
:toggleTitle="$t('formDialogTitleUseStatus')"
:img="profileUrl || '/images/product-avatar-add.png'"
fallbackCover="/images/product-banner.png"
bgColor="#ebf1ee"
:bgColor="`hsla(var(--teal-${$q.dark.isActive ? '8' : '10'}-hsl)/0.15)`"
:menu="[
{
icon: 'mdi-office-building-outline',
@ -3893,7 +3885,7 @@ watch(
:toggleTitle="$t('formDialogTitleUseStatus')"
:img="profileUrl || '/images/product-avatar.png'"
fallbackCover="/images/product-banner.png"
bgColor="#ebf1ee"
:bgColor="`hsla(var(--teal-${$q.dark.isActive ? '8' : '10'}-hsl)/0.15)`"
:menu="[
{
icon: 'mdi-office-building-outline',
@ -4039,15 +4031,20 @@ watch(
useToggle
hideActive
:toggleTitle="$t('formDialogTitleUseStatus')"
:img="profileUrl || '/images/product-avatar-add.png'"
fallbackCover="/images/product-banner.png"
bgColor="#ebf1ee"
:img="profileUrl || '/images/service-avatar-add.png'"
fallbackCover="/images/service-banner.png"
:bgColor="`hsla(var(--orange-${$q.dark.isActive ? '6' : '5'}-hsl)/0.15)`"
:menu="[
{
icon: 'mdi-office-building-outline',
color: 'hsl(var(--info-bg))',
bgColor: 'var(--surface-1)',
},
{
icon: 'mdi-briefcase-outline',
color: 'hsl(var(--info-bg))',
bgColor: 'var(--surface-1)',
},
]"
@view="imageDialog = true"
@edit="refImageUpload && refImageUpload.browse()"
@ -4128,6 +4125,7 @@ watch(
<div
class="col-2 surface-1 q-mx-lg q-mb-lg rounded bordered row"
v-if="currentServiceTab === 1"
style="overflow: hidden"
>
<FormServiceProperties
v-model:service-attributes="formDataProductService.attributes"
@ -4167,10 +4165,12 @@ watch(
}
"
>
<ServiceProperties
v-model:properties-option="propertiesOption"
v-model:form-service-properties="tempValueProperties"
/>
<div class="q-pa-lg full-height">
<ServiceProperties
v-model:properties-option="propertiesOption"
v-model:form-service-properties="tempValueProperties"
/>
</div>
</DialogForm>
<!-- manage work name -->
@ -4200,7 +4200,6 @@ watch(
height="95vh"
:isEdit="infoServiceEdit"
:title="$t('service')"
:tabs-list="serviceTab"
v-model:modal="dialogServiceEdit"
:submit="
() => {
@ -4229,7 +4228,123 @@ watch(
"
:delete-data="() => deleteServiceById()"
>
<template #prepend>
<div class="q-mx-lg q-mt-lg">
<ProfileBanner
hideFade
useToggle
hideActive
:readonly="!infoServiceEdit"
:toggleTitle="$t('formDialogTitleUseStatus')"
:img="profileUrl || '/images/service-avatar-add.png'"
fallbackCover="/images/service-banner.png"
:bgColor="`hsla(var(--orange-${$q.dark.isActive ? '6' : '5'}-hsl)/0.15)`"
:menu="[
{
icon: 'mdi-office-building-outline',
color: 'hsl(var(--info-bg))',
bgColor: 'var(--surface-1)',
},
{
icon: 'mdi-briefcase-outline',
color: 'hsl(var(--info-bg))',
bgColor: 'var(--surface-1)',
},
]"
@view="imageDialog = true"
@edit="refImageUpload && refImageUpload.browse()"
/>
</div>
<div
class="col surface-1 q-mx-lg q-mt-lg q-mb-md rounded bordered scroll row relative-position"
id="group-form"
>
<div
class="col"
style="height: 100%; max-height: 100; overflow-y: auto"
v-if="$q.screen.gt.sm"
>
<div class="q-py-md q-pl-md q-pr-sm">
<q-item
v-for="v in 2"
:key="v"
dense
clickable
class="no-padding items-center rounded full-width"
:class="{ 'q-mt-xs': v > 1 }"
active-class="product-form-active"
:active="currentServiceTab === v"
@click="currentServiceTab = v"
>
<span class="full-width q-py-sm" style="padding-inline: 20px">
{{ v === 1 ? $t('serviceInformation') : $t('workInformation') }}
</span>
</q-item>
</div>
</div>
<div
class="col-12 col-md-10 q-py-md q-pr-md q-pl-sm"
id="customer-form-content"
style="height: 100%; max-height: 100%; overflow-y: auto"
>
<BasicInformation
v-if="currentServiceTab === 1"
:readonly="!infoServiceEdit"
dense
service
v-model:options-branch="branchOption"
v-model:registered-branch-id="
formDataProductService.registeredBranchId
"
v-model:service-code="formDataProductService.code"
v-model:service-description="formDataProductService.detail"
v-model:service-name-th="formDataProductService.name"
/>
<FormServiceWork
v-if="currentServiceTab === 2"
:readonly="!infoServiceEdit"
v-model:work-items="workItems"
dense
@addProduct="
async (index) => {
await fetchListOfProductIsAdd(currentIdType);
currentWorkIndex = index;
dialogTotalProduct = true;
}
"
@manage-work-name="
() => {
manageWorkNameDialog = true;
}
"
@work-properties="
(index) => {
currentWorkIndex = index;
tempValueProperties = workItems[index].attributes;
openPropertiesDialog('work');
}
"
/>
</div>
</div>
<div
class="col-2 surface-1 q-mx-lg q-mb-lg rounded bordered row"
v-if="currentServiceTab === 1"
style="overflow: hidden"
>
<FormServiceProperties
:readonly="!infoServiceEdit"
v-model:service-attributes="formDataProductService.attributes"
@service-properties="
() => {
tempValueProperties = formDataProductService.attributes;
openPropertiesDialog('service');
}
"
/>
</div>
<!-- <template #prepend>
<ProfileUpload
prefix-id="form-dialog-service"
isService
@ -4294,7 +4409,7 @@ watch(
}
"
/>
</template>
</template> -->
</DialogForm>
<q-dialog v-model="holdDialog" position="bottom">
@ -4464,13 +4579,17 @@ watch(
@save="handleImageUpload"
>
<template #error>
<div class="full-height full-width" style="background: white">
<div class="full-height full-width" style="background: var(--surface-1)">
<div
class="full-height full-width flex justify-center items-center"
style="background: #ebf1ee"
:style="`background: ${
dialogProduct || dialogProductEdit
? `hsla(var(--teal-${$q.dark.isActive ? '8' : '10'}-hsl)/0.15)`
: `hsla(var(--orange-${$q.dark.isActive ? '6' : '5'}-hsl)/0.15)`
}`"
>
<q-img
src="/images/product-avatar.png"
:src="`/images/${dialogProduct || dialogProductEdit ? 'product' : 'service'}-avatar.png`"
fit="contain"
style="height: 100%"
/>