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

fix(04): product service (unfinish)

Browse source
This commit is contained in:
puriphatt 2024-08-14 14:38:26 +07:00
parent 485e0b82b2
commit 7cfc1ddee5
4 changed files with 342 additions and 165 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -107,7 +107,7 @@ const branchFilter = selectFilterOptionRefMod(
/>
</div>
<div v-if="service" class="col-9 row q-col-gutter-md">
<div v-if="service" class="col-12 row q-col-gutter-sm">
<q-input
lazy-rules="ondemand"
id="input-service-code"

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

@ -18,46 +18,50 @@ defineEmits<{
}>();
</script>
<template>
<div class="col-3 app-text-muted">
• {{ $t(`properties`) }}
<div>
<div class="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)"
>
{{ $t(`serviceProperties`) }}
<q-btn
:disable="readonly"
dense
flat
unelevated
outline
class="q-mt-sm q-px-sm"
color="primary"
class="q-px-sm"
color="info"
@click="$emit('serviceProperties')"
>
<Icon
icon="basil:settings-adjust-solid"
width="24px"
class="q-mr-sm"
style="color: var(--brand-1)"
style="color: hsl(var(--info-bg))"
/>
{{ $t('properties') }}
{{ $t('serviceProperties') }}
</q-btn>
</div>
</div>
<div class="col-9 row">
<div
v-if="serviceAttributes.additional.length > 0"
class="col q-gutter-sm row items-center"
>
<div class="col-12 row q-px-md q-py-xs items-center surface-1 scroll">
<div
v-for="(p, index) in serviceAttributes.additional"
:key="index"
class="bordered q-px-sm surface-3"
style="border-radius: 6px"
v-if="serviceAttributes.additional.length > 0"
class="row items-center q-gutter-sm items-center"
>
{{ optionStore.mapOption(p.fieldName ?? '') }}
<div
v-for="(p, index) in serviceAttributes.additional"
:key="index"
class="bordered q-px-sm surface-3"
style="border-radius: 6px"
>
{{ optionStore.mapOption(p.fieldName ?? '') }}
</div>
</div>
</div>
<div v-else class="col flex items-center app-text-muted">
{{ $t('noProperties') }}
<div v-else class="col flex items-center app-text-muted">
{{ $t('noProperties') }}
</div>
</div>
</div>
</template>

34
src/components/ProfileBanner.vue
View file

@ -3,14 +3,15 @@ import { ref } from 'vue';
import ToggleButton from './button/ToggleButton.vue';
defineProps<{
icon?: string;
fallbackCover?: string;
color?: string;
img?: string | null;
bgColor?: string;
icon?: string;
title?: string;
caption?: string;
color?: string;
bgColor?: string;
toggleTitle?: string;
fallbackImg?: string;
fallbackCover?: string;
hideFade?: boolean;
hideActive?: boolean;
@ -67,12 +68,6 @@ const showOverlay = ref(false);
class="surface-1"
style="border-radius: 50%; border: 4px solid var(--surface-1)"
>
<!-- <div
class="avatar__status"
style="z-index: 2"
:style="`${active ? 'background-color: hsla(var(--positive-bg) / 1)' : 'background-color: hsla(var(--text-mute) / 1)'}`"
></div> -->
<q-avatar
size="6rem"
font-size="3rem"
@ -89,7 +84,26 @@ const showOverlay = ref(false);
>
<q-img id="profile-view" v-if="img" :src="img" :ratio="1">
<template #error>
<q-img
v-if="fallbackImg"
:src="fallbackImg"
:ratio="1"
style="background-color: transparent"
>
<template #error>
<div
class="full-width full-height flex items-center justify-center"
style="background-color: transparent"
:style="{
color: `${color || 'white'}`,
}"
>
<q-icon :name="icon || 'mdi-account'" />
</div>
</template>
</q-img>
<div
v-else
class="full-width full-height flex items-center justify-center"
style="background-color: transparent"
:style="{