3
0

Implement changes based on UI/UX feedback

This commit is contained in:
Jože Fortun
2023-02-23 17:20:45 +01:00
parent 316fea5cfc
commit 1483972c7e
7 changed files with 39 additions and 19 deletions
@@ -129,9 +129,11 @@ export default {
this.$root.$emit(`drill-down-recordList:${recordListUniqueID}`, prefilter)
} else {
const { title } = this.block
// Open in modal
const block = new compose.PageBlockRecordList({
title: `${dimensions} = '${name}'`,
title: title ? `${title} - "${name}"` : name,
blockID: `drillDown-${chartID}`,
options: {
moduleID,
@@ -141,11 +143,13 @@ export default {
hideRecordViewButton: false,
hideConfigureFieldsButton: false,
hideImportButton: true,
enableRecordPageNavigation: true,
selectable: true,
allowExport: true,
perPage: 14,
showTotalCount: true,
magnifyOption: 'modal',
recordDisplayOption: 'modal',
},
})
@@ -381,12 +381,16 @@
class="text-right"
@click.stop
>
<b-button-group v-if="inlineEditing">
<b-button-group
v-if="inlineEditing"
size="sm"
class="ml-auto"
>
<b-button
v-if="showCloneRecordButton"
:title="$t('recordList.record.tooltip.clone')"
variant="outline-light"
class="text-primary d-print-none border-0"
class="d-flex align-items-center text-primary d-print-none border-0"
@click="handleCloneInline(item.r)"
>
<font-awesome-icon
@@ -398,7 +402,7 @@
v-if="item.r.deletedAt"
:title="$t('recordList.record.tooltip.undelete')"
variant="outline-light"
class="border-0 text-dark d-print-none"
class="d-flex align-items-center border-0 text-dark d-print-none"
@click.prevent="handleRestoreInline(item, index)"
>
<font-awesome-icon
@@ -410,7 +414,7 @@
<b-button
v-else-if="(item.r.canDeleteRecord || item.r.recordID === '0') && !item.r.deletedAt"
variant="outline-light"
class="border-0 show-when-hovered text-danger d-print-none"
class="d-flex align-items-center border-0 show-when-hovered text-danger d-print-none"
@click.prevent="handleDeleteInline(item, index)"
>
<font-awesome-icon
@@ -419,12 +423,16 @@
</b-button>
</b-button-group>
<b-button-group v-if="!inlineEditing">
<b-button-group
v-if="!inlineEditing"
size="sm"
class="ml-auto"
>
<b-button
v-if="!options.hideRecordViewButton && item.r.canReadRecord && (options.rowViewUrl || recordPageID)"
:title="$t('recordList.record.tooltip.view')"
variant="outline-light"
class="text-primary d-print-none border-0"
class="d-flex align-items-center text-primary d-print-none border-0"
:to="{ name: options.rowViewUrl || 'page.record', params: { pageID: recordPageID, recordID: item.r.recordID }, query: null }"
>
<font-awesome-icon
@@ -437,7 +445,7 @@
:title="$t('recordList.record.tooltip.edit')"
:to="{ name: options.rowEditUrl || 'page.record.edit', params: { pageID: recordPageID, recordID: item.r.recordID }, query: null }"
variant="outline-light"
class="text-primary d-print-none border-0"
class="d-flex align-items-center text-primary d-print-none border-0"
>
<font-awesome-icon
:icon="['far', 'edit']"
@@ -449,7 +457,7 @@
:title="$t('recordList.record.tooltip.clone')"
variant="outline-light"
:to="{ name: options.rowCreateUrl || 'page.record.create', params: { pageID: recordPageID, values: item.r.values }, query: null }"
class="text-primary d-print-none border-0"
class="d-flex align-items-center text-primary d-print-none border-0"
>
<font-awesome-icon
:icon="['far', 'clone']"
@@ -460,7 +468,7 @@
v-if="!options.hideRecordReminderButton"
:title="$t('recordList.record.tooltip.reminder')"
variant="outline-light"
class="text-primary d-print-none border-0"
class="d-flex align-items-center text-primary d-print-none border-0"
@click.prevent="createReminder(item.r)"
>
<font-awesome-icon
@@ -475,7 +483,7 @@
:title="item.r.recordID"
:tooltip="$t('permissions:resources.compose.record.tooltip')"
button-variant="outline-light"
class="text-dark d-print-none border-0"
class="d-flex align-items-center text-dark d-print-none border-0"
/>
</b-button-group>
</b-td>
@@ -33,7 +33,7 @@
v-if="block.options.showRefresh"
:title="$t('general.label.refresh')"
variant="outline-light"
class="text-secondary d-print-none border-0"
class="d-flex align-items-center text-secondary d-print-none border-0"
@click="$emit('refreshBlock')"
>
<font-awesome-icon :icon="['fa', 'sync']" />
@@ -41,9 +41,9 @@
<b-button
v-if="block.options.magnifyOption"
:title="$t('general.label.magnify')"
:title="isBlockOpened ? '' : $t('general.label.magnify')"
variant="outline-light"
class="text-secondary d-print-none border-0"
class="d-flex align-items-center text-secondary d-print-none border-0"
@click="$root.$emit('magnify-page-block', isBlockOpened ? undefined : { blockID: block.blockID })"
>
<font-awesome-icon :icon="['fas', isBlockOpened ? 'times' : 'search-plus']" />
@@ -31,7 +31,7 @@
v-if="block.options.showRefresh"
:title="$t('general.label.refresh')"
variant="outline-light"
class="d-print-none border-0 text-primary"
class="d-flex align-items-center text-primary d-print-none border-0"
@click="$emit('refreshBlock')"
>
<font-awesome-icon :icon="['fa', 'sync']" />
@@ -39,9 +39,9 @@
<b-button
v-if="block.options.magnifyOption"
:title="$t('general.label.magnify')"
:title="isBlockOpened ? '' : $t('general.label.magnify')"
variant="outline-light"
class="d-print-none border-0 text-primary"
class="d-flex align-items-center text-primary d-print-none border-0"
@click="$root.$emit('magnify-page-block', isBlockOpened ? undefined : { blockID: block.blockID })"
>
<font-awesome-icon :icon="['fas', isBlockOpened ? 'times' : 'search-plus']" />
@@ -68,7 +68,7 @@ export default {
},
contentClass () {
return `${this.block && this.block.options.magnifyOption === 'fullscreen' ? 'mh-100' : ''} position-initial`
return `${this.block && this.block.options.magnifyOption === 'fullscreen' ? 'mh-100 rounded-0' : 'card'} position-initial`
},
},
@@ -270,6 +270,14 @@ input[type="search"]::-webkit-search-cancel-button {
padding-top: 0;
}
.modal-content {
&.card {
background-color: #FFF;
background-clip: border-box;
border: 0 solid rgba(0, 0, 0, 0.125);
border-radius: 1rem;
}
}
// Supporting CSS to improve print-to-PDF option
@media print {
@page {
@@ -73,7 +73,7 @@ const defaults: Readonly<Options> = Object.freeze({
hideRecordEditButton: false,
hideRecordViewButton: true,
hideRecordPermissionsButton: true,
enableRecordPageNavigation: true,
enableRecordPageNavigation: false,
allowExport: false,
perPage: 20,
recordDisplayOption: 'sameTab',