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

fix: product q-field

Browse source
This commit is contained in:
puriphatt 2024-06-21 08:49:20 +00:00
parent e40f62e422
commit 14c181ada5
1 changed files with 109 additions and 98 deletions
Download patch file Download diff file Expand all files Collapse all files

37
src/components/04_product-service/ฺBasicInfoProduct.vue
View file

@ -15,12 +15,11 @@ defineProps<{
</script> </script>
<template> <template>
<div class="row col-10"> <div class="col-3 app-text-muted">
<div class="col-4 app-text-muted">
• {{ $t(`formDialogTitleInformation`) }} • {{ $t(`formDialogTitleInformation`) }}
</div> </div>
<div class="col-8 row q-col-gutter-md"> <div class="col-9 row q-col-gutter-md">
<q-input <q-input
for="input-code" for="input-code"
:outlined="!readonly" :outlined="!readonly"
@ -59,7 +58,7 @@ defineProps<{
autogrow autogrow
/> />
<div class="col-12" v-if="readonly"> <!-- <div class="col-12" v-if="readonly">
<q-field <q-field
class="rounded" class="rounded"
:class="{ 'surface-2': remark !== undefined }" :class="{ 'surface-2': remark !== undefined }"
@ -84,22 +83,30 @@ defineProps<{
</div> </div>
</template> </template>
</q-field> </q-field>
</div> </div> -->
<div class="col-12" v-else> <div class="col-12">
<q-field <q-field
class="full-width q-pb-md" class="full-width"
:outlined="!readonly"
:readonly="readonly"
:borderless="readonly"
:label="$t('detail')" :label="$t('detail')"
stack-label stack-label
outlined
dense dense
> >
<q-editor <q-editor
dense dense
class="rounded full-width"
v-model="remark" v-model="remark"
min-height="5rem" min-height="5rem"
style="border: none; cursor: auto; color: black; height: 80%" class="full-width q-mt-sm q-mb-xs"
:flat="!readonly"
:readonly="readonly"
:toolbar-color="
readonly ? 'disabled' : $q.dark.isActive ? 'white' : ''
"
:toolbar-toggle-color="readonly ? 'disabled' : 'primary'"
style="cursor: auto; color: black"
/> />
</q-field> </q-field>
@ -131,11 +138,11 @@ defineProps<{
type="number" type="number"
/> />
</div> </div>
</div>
<q-separator <q-separator
v-if="separator" v-if="separator"
class="col-12 q-mt-xl q-mb-md" class="col-12 q-mb-md"
style="padding-block: 0.5px" style="padding-block: 0.5px; margin-top: 32px"
/> />
</template> </template>
@ -143,4 +150,8 @@ defineProps<{
.q-editor__toolbar { .q-editor__toolbar {
border-bottom: none !important; border-bottom: none !important;
} }
:deep(.q-editor__toolbar.row.no-wrap.scroll-x) {
background-color: var(--surface-3) !important;
}
</style> </style>