DeforaNetworks/corteza
3
0
Fork 0
Code Activity

Adjust styles and logic of record list configurator

Browse Source
This commit is contained in:
Jože Fortun
2023-03-21 16:18:55 +01:00
parent dcf50239f1
commit 0a4ed217c4
3 changed files with 207 additions and 145 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/web/compose/src/components/PageBlocks/RecordListConfigurator.vue
+165 -123
View File
@@ -40,7 +40,7 @@
<b-form-group
v-if="recordListModule"
:label="$t('recordList.record.inlineEditorAllow')"
class="text-primary"
label-class="text-primary"
>
<c-input-checkbox
v-model="options.editable"
@@ -106,7 +106,7 @@
>
<b-form-group
:label="$t('recordList.refField.label')"
class="text-primary"
label-class="text-primary"
>
<b-form-select
v-model="options.refField"
@@ -137,7 +137,7 @@
>
<b-form-group
:label="$t('recordList.positionField.label')"
class="text-primary"
label-class="text-primary"
>
<b-form-select v-model="options.positionField">
<option :value="undefined">
@@ -165,7 +165,7 @@
<b-form-group
v-if="options.positionField"
:label="$t('recordList.record.draggable')"
class="text-primary"
label-class="text-primary"
>
<c-input-checkbox
v-model="options.draggable"
@@ -192,11 +192,12 @@
>
<b-form-group
:label="$t('recordList.record.filterHide')"
class="text-primary"
label-class="text-primary"
>
<c-input-checkbox
v-model="options.hideFiltering"
switch
invert
:labels="checkboxLabel"
/>
</b-form-group>
@@ -208,11 +209,12 @@
>
<b-form-group
:label="$t('recordList.record.prefilterHideSearch')"
class="text-primary"
label-class="text-primary"
>
<c-input-checkbox
v-model="options.hideSearch"
switch
invert
:labels="checkboxLabel"
/>
</b-form-group>
@@ -223,7 +225,7 @@
<b-col>
<b-form-group
:label="$t('recordList.record.prefilterCommand')"
class="text-primary"
label-class="text-primary"
>
<b-form-textarea
v-model="options.prefilter"
@@ -258,11 +260,12 @@
<b-col>
<b-form-group
:label="$t('recordList.record.presortHideSort')"
class="text-primary"
label-class="text-primary"
>
<c-input-checkbox
v-model="options.hideSorting"
switch
invert
:labels="checkboxLabel"
/>
</b-form-group>
@@ -273,7 +276,7 @@
<b-col>
<b-form-group
:label="$t('recordList.record.presortInputLabel')"
class="text-primary"
label-class="text-primary"
>
<c-input-presort
v-model="options.presort"
@@ -313,11 +316,12 @@
>
<b-form-group
:label="$t('recordList.record.hidePaging')"
class="text-primary"
label-class="text-primary"
>
<c-input-checkbox
v-model="options.hideSorting"
v-model="options.hidePaging"
switch
invert
:labels="checkboxLabel"
/>
</b-form-group>
@@ -332,7 +336,7 @@
horizontal
breakpoint="md"
:label="$t('recordList.record.perPage')"
class="text-primary"
label-class="text-primary"
>
<b-form-input
v-model.number="options.perPage"
@@ -344,70 +348,82 @@
</b-col>
</b-row>
<div>
<h6 class="text-primary mb-3">
{{ $t('recordList.record.pagingOptions') }}
</h6>
<b-row>
<b-col
v-if="!options.hidePaging"
cols="12"
lg="6"
<b-row>
<b-col
cols="12"
md="6"
>
<b-form-group
:label="$t('recordList.record.fullPageNavigation')"
label-class="text-primary"
>
<b-form-group
:label="$t('recordList.record.fullPageNavigation')"
class="text-primary"
>
<c-input-checkbox
v-model="options.fullPageNavigation"
switch
:labels="checkboxLabel"
data-test-id="hide-page-navigation"
/>
</b-form-group>
</b-col>
<c-input-checkbox
v-model="options.fullPageNavigation"
switch
:labels="checkboxLabel"
data-test-id="hide-page-navigation"
/>
</b-form-group>
</b-col>
<b-col
cols="12"
lg="6"
<b-col
cols="12"
md="6"
>
<b-form-group
:label="$t('recordList.record.showTotalCount')"
label-class="text-primary"
>
<b-form-group
:label="$t('recordList.enableRecordPageNavigation')"
class="text-primary"
>
<c-input-checkbox
v-model="options.enableRecordPageNavigation"
switch
:labels="checkboxLabel"
/>
</b-form-group>
</b-col>
</b-row>
</div>
<c-input-checkbox
v-model="options.showTotalCount"
data-test-id="show-total-record-count"
switch
:labels="checkboxLabel"
/>
</b-form-group>
</b-col>
</b-row>
</div>
<hr v-if="!options.editable">
<div
class="px-3"
>
<h5 class="mb-3">
{{ $t('recordList.record.newLabel') }}
{{ $t('recordList.record.recordsLabel') }}
</h5>
<b-row
class="justify-content-between"
>
<b-row>
<b-col
cols="12"
lg="4"
md="6"
>
<b-form-group
:label="$t('recordList.record.recordDisplayOptions')"
label-class="text-primary"
>
<b-form-select
v-model="options.recordDisplayOption"
:options="recordDisplayOptions"
/>
</b-form-group>
</b-col>
</b-row>
<b-row>
<b-col
cols="12"
md="6"
>
<b-form-group
:label="$t('recordList.record.hideAddButton')"
class="text-primary"
label-class="text-primary"
>
<c-input-checkbox
v-model="options.hideAddButton"
switch
invert
:labels="checkboxLabel"
/>
</b-form-group>
@@ -415,14 +431,14 @@
<b-col
cols="12"
lg="4"
md="6"
>
<b-form-group
:label="$t('recordList.record.hideImportButton')"
class="text-primary"
:label="$t('recordList.selectable')"
label-class="text-primary"
>
<c-input-checkbox
v-model="options.hideImportButton"
v-model="options.selectable"
switch
:labels="checkboxLabel"
/>
@@ -432,36 +448,110 @@
<b-col
v-if="onRecordPage"
cols="12"
lg="4"
md="6"
>
<b-form-group
:label="$t('recordList.record.linkToParent')"
class="text-primary"
label-class="text-primary"
>
<c-input-checkbox
v-model="options.linkToParent"
switch
invert
:labels="checkboxLabel"
/>
</b-form-group>
</b-col>
<b-col
cols="12"
md="6"
>
<b-form-group
:label="$t('recordList.record.hideImportButton')"
label-class="text-primary"
>
<c-input-checkbox
v-model="options.hideImportButton"
switch
invert
:labels="checkboxLabel"
/>
</b-form-group>
</b-col>
<b-col
cols="12"
md="6"
>
<b-form-group
:label="$t('recordList.export.allow')"
label-class="text-primary"
>
<c-input-checkbox
v-model="options.allowExport"
switch
:labels="checkboxLabel"
/>
</b-form-group>
</b-col>
</b-row>
</div>
<hr>
<div
class="px-3"
>
<h5 class="text-primary">
{{ $t('recordList.record.moreOptions') }}
</h5>
<b-row>
<b-col
cols="12"
lg="4"
md="6"
>
<b-form-group class="text-primary">
<b-form-group
:label="$t('recordList.enableRecordPageNavigation')"
label-class="text-primary"
>
<c-input-checkbox
v-model="options.enableRecordPageNavigation"
switch
:labels="checkboxLabel"
/>
</b-form-group>
</b-col>
<b-col
cols="12"
md="6"
>
<b-form-group
:label="$t('recordList.record.enableBulkRecordEdit')"
label-class="text-primary"
>
<c-input-checkbox
v-model="options.bulkRecordEditEnabled"
switch
:labels="checkboxLabel"
/>
</b-form-group>
</b-col>
<b-col
cols="12"
md="6"
>
<b-form-group
:label="$t('recordList.record.showDeletedRecordsOption')"
label-class="text-primary"
>
<c-input-checkbox
v-model="options.showDeletedRecordsOption"
switch
:labels="checkboxLabel"
/>
</b-form-group>
</b-col>
<b-col
cols="12"
md="6"
>
<b-form-group
:label="$t('recordList.record.buttons')"
label-class="text-primary"
>
<b-form-checkbox
v-model="options.hideRecordViewButton"
>
@@ -477,17 +567,6 @@
<b-form-checkbox v-model="options.hideRecordCloneButton">
{{ $t('recordList.hideRecordCloneButton') }}
</b-form-checkbox>
</b-form-group>
</b-col>
<b-col
cols="12"
lg="4"
>
<b-form-group class="text-primary">
<b-form-checkbox v-model="options.showDeletedRecordsOption">
{{ $t('recordList.record.showDeletedRecordsOption') }}
</b-form-checkbox>
<b-form-checkbox
v-model="options.hideRecordPermissionsButton"
@@ -500,43 +579,6 @@
</b-form-checkbox>
</b-form-group>
</b-col>
<b-col
cols="12"
lg="4"
>
<b-form-group class="text-primary">
<b-form-checkbox v-model="options.allowExport">
{{ $t('recordList.export.allow') }}
</b-form-checkbox>
<b-form-checkbox v-model="options.selectable">
{{ $t('recordList.selectable') }}
</b-form-checkbox>
<b-form-checkbox
v-if="!options.hidePaging"
v-model="options.showTotalCount"
data-test-id="show-total-record-count"
>
{{ $t('recordList.record.showTotalCount') }}
</b-form-checkbox>
</b-form-group>
</b-col>
</b-row>
<b-row>
<b-col cols="4">
<b-form-group
:label="$t('recordList.record.recordDisplayOptions')"
class="text-primary"
>
<b-form-select
v-model="options.recordDisplayOption"
:options="recordDisplayOptions"
/>
</b-form-group>
</b-col>
</b-row>
</div>
</b-tab>
lib/vue/src/components/input/CInputCheckbox.vue
+27 -8
View File
@@ -4,10 +4,7 @@
>
<span
class="mb-0 inline-block text-primary mr-2"
:class="{
'text-muted': value,
'font-weight-bold': !value,
}"
:class="noClass"
>
{{ labels.off }}
</span>
@@ -15,15 +12,14 @@
<b-form-checkbox
v-bind="$attrs"
:checked="value"
:value="!invert"
:unchecked-value="invert"
v-on="$listeners"
/>
<span
class="mb-0 inline-block strong text-primary ml-2"
:class="{
'text-muted': !value,
'font-weight-bold': value,
}"
:class="yesClass"
>
{{ labels.on }}
</span>
@@ -44,6 +40,29 @@ export default {
required: true,
default: () => ({}),
},
invert: {
type: Boolean,
default: false,
}
},
computed: {
noClass () {
const value = this.invert ? !this.value : this.value
return {
'text-muted': value,
'font-weight-bold': !value,
}
},
yesClass () {
const value = this.invert ? !this.value : this.value
return {
'text-muted': !value,
'font-weight-bold': value,
}
}
}
}
</script>
locale/en/corteza-webapp-compose/block.yaml
+15 -14
View File
@@ -257,7 +257,7 @@ recordList:
editFields: Editable module fields
export:
all: Export all records
allow: Allow records export
allow: Users will be able to export records
csv: CSV Export
dateRange: 'Select date range:'
query:
@@ -324,7 +324,7 @@ recordList:
hideRecordPermissionsButton: Hide record permissions button
hideRecordReminderButton: Hide record reminder button
hideRecordViewButton: Hide view record button
enableRecordPageNavigation: Enable record page navigation
enableRecordPageNavigation: Users will be able to navigate to previous/next record
import:
dropzoneFileAdded: '{{name}} was uploaded and is ready for import ({{count}} record)'
dropzoneFileAdded_plural: '{{name}} was uploaded and is ready for import ({{count}} records)'
@@ -390,21 +390,20 @@ recordList:
record:
draggable: Can drag & drop records to order them
fullPageNavigation: Full page navigation
hideAddButton: The button 'Add Record' is hidden
hideImportButton: The button 'Import Record' is hidden
hideAddButton: Users will be able to add new records
hideImportButton: Users will be able to import records
pagingLabel: Paging
pagingOptions: Paging Options
moreOptions: More Options
hidePaging: User will be able to use Paging
inlineEditor: Inline Options
inlineEditorAllow: Allow in-line record editing on module fields
inlineEditorFootnote: Only one inline editor with the same module can be present the same page
newLabel: New records
inlineEditorAllow: Inline record editor
recordsLabel: Records
noPermission: No permission to read record
perPage: Records per page
prefilterFootnote: Simplified SQL condition (WHERE ...) syntax is supported. Variables like {{0}}, {{1}} and {{2}} are evaluated (when available)
prefilterHideSearch: Users are able to search the record list
filterHide: Users will see a prefiltered record list
prefilterHideSearch: Users will be able to search the record list
filterHide: Users will be able to filter the list
prefilterLabel: Filtering
generalLabel: General Settings
prefilterCommand: Prefilter
@@ -417,10 +416,12 @@ recordList:
presortPlaceholder: field1 DESC, field2 ASC
showTotalCount: Show total record count
showDeletedRecordsOption: Show option to see deleted records
openInSameTab: Open records in the same tab
openInNewTab: Open records in a new tab
openInModal: Open records in a modal
openInSameTab: Open record in the same tab
openInNewTab: Open record in a new tab
openInModal: Open record in a modal
enableBulkRecordEdit: Enable bulk record edit
linkToParent: Link to parent record
buttons: Record buttons
tooltip:
clone: Clone
edit: Edit
@@ -429,12 +430,12 @@ recordList:
reminder: Reminder
view: View
permissions: Permissions
recordDisplayOptions: Record display options
recordDisplayOptions: On record click
recordPage: record page
refField:
footnote: Field that links records with the parent record
label: Parent field
selectable: Enable record selection
selectable: Users will be able to select records
selected: '{{count}} of {{total}} records selected'
sort:
tooltip: Sort column