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

feat: scroll inside product / service

Browse source
This commit is contained in:
Methapon2001 2024-07-08 11:15:31 +07:00
parent ff7b4d1f76
commit 37d19e8600
1 changed files with 116 additions and 121 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -1227,31 +1227,28 @@ watch(inputSearchProductAndService, async () => {
<!-- group/type --> <!-- group/type -->
<div <div
v-if="productMode === 'group' || productMode === 'type'" v-if="productMode === 'group' || productMode === 'type'"
class="surface-1 col bordered rounded q-px-md q-pt-md scroll column" class="surface-1 col bordered rounded column no-wrap"
>
<div class="row justify-between">
<div
v-if="productMode === 'type'"
class="text-h6 text-weight-bold q-mb-md"
> >
<div class="row surface-2 bordered-b q-px-md q-py-sm">
<div v-if="productMode === 'type'" class="text-h6 text-weight-bold">
{{ $t('productAndServiceType') }} {{ $t('productAndServiceType') }}
</div> </div>
<div <div
v-else-if="productMode === 'group'" v-else-if="productMode === 'group'"
class="text-h6 text-weight-bold q-mb-md" class="text-h6 text-weight-bold"
> >
{{ $t('productAndServiceAll') }} {{ $t('productAndServiceAll') }}
</div> </div>
<div <div
v-if="productMode === 'group' || productMode === 'type'" v-if="productMode === 'group' || productMode === 'type'"
class="row q-px-md q-pb-md" class="row q-ml-auto"
> >
<q-input <q-input
style="width: 300px" style="width: 300px"
outlined outlined
dense dense
:label="$t('search')" :label="$t('search')"
class="q-mr-lg" class="q-mr-sm"
:bg-color="$q.dark.isActive ? 'dark' : 'white'" :bg-color="$q.dark.isActive ? 'dark' : 'white'"
v-model="inputSearch" v-model="inputSearch"
debounce="500" debounce="500"
@ -1309,7 +1306,8 @@ watch(inputSearchProductAndService, async () => {
</div> </div>
</div> </div>
<div class="row q-col-gutter-md col scroll"> <div style="height: 100%" class="q-pa-md scroll">
<div class="row q-col-gutter-md col">
<div <div
:class="`${$q.screen.gt.sm ? 'col-3' : $q.screen.gt.xs ? 'col-6' : 'col-12'}`" :class="`${$q.screen.gt.sm ? 'col-3' : $q.screen.gt.xs ? 'col-6' : 'col-12'}`"
v-for="(v, i) in productMode === 'type' v-for="(v, i) in productMode === 'type'
@ -1407,11 +1405,7 @@ watch(inputSearchProductAndService, async () => {
drawerInfo = true; drawerInfo = true;
} }
" "
@deleteCard=" @deleteCard="deleteProductById(v.id)"
() => {
deleteProductById(v.id);
}
"
@on-click=" @on-click="
async () => { async () => {
pathGroupName = v.name; pathGroupName = v.name;
@ -1424,6 +1418,7 @@ watch(inputSearchProductAndService, async () => {
/> />
</div> </div>
</div> </div>
</div>
<div <div
v-if=" v-if="