diff --git a/src/components/FormElements/Radio.vue b/src/components/FormElements/Radio.vue index 7fcb29f6..b87ea4ca 100644 --- a/src/components/FormElements/Radio.vue +++ b/src/components/FormElements/Radio.vue @@ -2,15 +2,15 @@
-
- - + +
@@ -25,10 +25,11 @@ export default { name: 'Radio', components: {}, props: { - options: Array, // Array of available options + options: Array, // Array of objects for available options initialOption: String, // Optional default option label: String, // Form label for element description: String, // Optional description text + disabled: Boolean, // Disable all radio buttons }, data() { return { @@ -91,9 +92,12 @@ div.radio-container { cursor: pointer; border: 1px solid transparent; border-radius: var(--curve-factor); - &:hover { + &:hover:not(.wrap-disabled) { border: 1px solid var(--primary); } + &:disabled { + opacity: var(--dimming-factor); + } label.option-label, input.radio-input { cursor: pointer; text-transform: capitalize; diff --git a/src/components/InteractiveEditor/EditItem.vue b/src/components/InteractiveEditor/EditItem.vue index 65705e2f..e924f3ef 100644 --- a/src/components/InteractiveEditor/EditItem.vue +++ b/src/components/InteractiveEditor/EditItem.vue @@ -32,7 +32,7 @@ v-model="formData[index].value" :description="row.description" :label="row.title || row.name" - :options="['true', 'false']" + :options="[ ...boolRadioOptions ]" :initialOption="boolToStr(formData[index].value)" /> @@ -90,6 +90,10 @@ export default { formData: [], // Array of form fields additionalFormData: [], // Array of not-yet-used form fields item: {}, + boolRadioOptions: [ + { label: 'true', value: 'true' }, + { label: 'false', value: 'false' }, + ], }; }, props: { diff --git a/src/components/InteractiveEditor/MoveItemTo.vue b/src/components/InteractiveEditor/MoveItemTo.vue index 03196996..7a604d30 100644 --- a/src/components/InteractiveEditor/MoveItemTo.vue +++ b/src/components/InteractiveEditor/MoveItemTo.vue @@ -9,7 +9,7 @@ @@ -23,7 +23,7 @@ @@ -54,9 +54,17 @@ export default { data() { return { selectedSection: '', - operation: 'Move', - appendTo: 'End', + operation: 'move', + appendTo: 'end', modalName: `${modalNames.MOVE_ITEM_TO}-${this.itemId}`, + operationRadioOptions: [ + { label: 'Move', value: 'move' }, + { label: 'Copy', value: 'copy' }, + ], + appendToRadioOptions: [ + { label: 'Beginning', value: 'beginning' }, + { label: 'End', value: 'end' }, + ], }; }, computed: { @@ -86,7 +94,7 @@ export default { const copyPayload = { item, toSection: this.selectedSection, appendTo: this.appendTo }; this.$store.commit(StoreKeys.COPY_ITEM, copyPayload); // Remove item from previous section - if (this.operation === 'Move') { + if (this.operation === 'move') { const payload = { itemId: this.itemId, sectionName: this.currentSection }; this.$store.commit(StoreKeys.REMOVE_ITEM, payload); }