replace checkBoxDiv with checkboxRadioSwitch from @nextcloud/vue

Signed-off-by: dartcafe <github@dartcafe.de>

10 files changed, 79 insertions, 51 deletions

diff --git a/src/js/components/Configuration/ConfigAccess.vue b/src/js/components/Configuration/ConfigAccess.vue
index 739d177e..234d2bb6 100644
--- a/src/js/components/Configuration/ConfigAccess.vue
+++ b/src/js/components/Configuration/ConfigAccess.vue
@@ -23,23 +23,25 @@
 <template>
 	<div>
 		<RadioGroupDiv v-model="pollAccess" :options="accessOptions" />
-		<CheckBoxDiv v-model="pollImportant"
-			class="indented"
+		<CheckboxRadioSwitch class="indented"
+			:checked.sync="pollImportant"
 			:disabled="pollAccess !== 'public'"
-			:label="t('polls', 'Relevant for all users')" />
+			type="switch">
+			{{ t('polls', 'Relevant for all users') }}
+		</CheckboxRadioSwitch>
 	</div>
 </template>
 
 <script>
 import { mapState } from 'vuex'
-import CheckBoxDiv from '../Base/CheckBoxDiv'
+import { CheckboxRadioSwitch } from '@nextcloud/vue'
 import RadioGroupDiv from '../Base/RadioGroupDiv'
 
 export default {
 	name: 'ConfigAccess',
 
 	components: {
-		CheckBoxDiv,
+		CheckboxRadioSwitch,
 		RadioGroupDiv,
 	},
 
diff --git a/src/js/components/Configuration/ConfigAdminAccess.vue b/src/js/components/Configuration/ConfigAdminAccess.vue
index 1104a694..395393b6 100644
--- a/src/js/components/Configuration/ConfigAdminAccess.vue
+++ b/src/js/components/Configuration/ConfigAdminAccess.vue
@@ -21,18 +21,26 @@
   -->
 
 <template>
-	<CheckBoxDiv v-model="adminAccess" :label="t('polls', 'Allow admins to edit this poll')" />
+	<CheckboxRadioSwitch :checked.sync="adminAccess" type="switch">
+		{{ label }}
+	</CheckboxRadioSwitch>
 </template>
 
 <script>
 import { mapState } from 'vuex'
-import CheckBoxDiv from '../Base/CheckBoxDiv'
+import { CheckboxRadioSwitch } from '@nextcloud/vue'
 
 export default {
 	name: 'ConfigAdminAccess',
 
 	components: {
-		CheckBoxDiv,
+		CheckboxRadioSwitch,
+	},
+
+	data() {
+		return {
+			label: t('polls', 'Allow admins to edit this poll'),
+		}
 	},
 
 	computed: {
@@ -42,7 +50,7 @@ export default {
 
 		adminAccess: {
 			get() {
-				return this.poll.adminAccess
+				return !!this.poll.adminAccess
 			},
 			set(value) {
 				this.$store.commit('poll/setProperty', { adminAccess: +value })
diff --git a/src/js/components/Configuration/ConfigAllowComment.vue b/src/js/components/Configuration/ConfigAllowComment.vue
index 448c8385..7982d6b1 100644
--- a/src/js/components/Configuration/ConfigAllowComment.vue
+++ b/src/js/components/Configuration/ConfigAllowComment.vue
@@ -21,18 +21,20 @@
   -->
 
 <template>
-	<CheckBoxDiv v-model="allowComment" :label="t('polls', 'Allow Comments')" />
+	<CheckboxRadioSwitch :checked.sync="allowComment" type="switch">
+		{{ t('polls', 'Allow Comments') }}
+	</CheckboxRadioSwitch>
 </template>
 
 <script>
 import { mapState } from 'vuex'
-import CheckBoxDiv from '../Base/CheckBoxDiv'
+import { CheckboxRadioSwitch } from '@nextcloud/vue'
 
 export default {
 	name: 'ConfigAllowComment',
 
 	components: {
-		CheckBoxDiv,
+		CheckboxRadioSwitch,
 	},
 
 	computed: {
@@ -42,7 +44,7 @@ export default {
 
 		allowComment: {
 			get() {
-				return this.poll.allowComment
+				return !!this.poll.allowComment
 			},
 			set(value) {
 				this.$store.commit('poll/setProperty', { allowComment: +value })
diff --git a/src/js/components/Configuration/ConfigAllowMayBe.vue b/src/js/components/Configuration/ConfigAllowMayBe.vue
index b4930968..62585625 100644
--- a/src/js/components/Configuration/ConfigAllowMayBe.vue
+++ b/src/js/components/Configuration/ConfigAllowMayBe.vue
@@ -21,18 +21,20 @@
   -->
 
 <template>
-	<CheckBoxDiv v-model="allowMaybe" :label="label" />
+	<CheckboxRadioSwitch :checked.sync="allowMaybe" type="switch">
+		{{ label }}
+	</CheckboxRadioSwitch>
 </template>
 
 <script>
 import { mapState } from 'vuex'
-import CheckBoxDiv from '../Base/CheckBoxDiv'
+import { CheckboxRadioSwitch } from '@nextcloud/vue'
 
 export default {
 	name: 'ConfigAllowMayBe',
 
 	components: {
-		CheckBoxDiv,
+		CheckboxRadioSwitch,
 	},
 
 	data() {
@@ -48,7 +50,7 @@ export default {
 
 		allowMaybe: {
 			get() {
-				return this.poll.allowMaybe
+				return !!this.poll.allowMaybe
 			},
 			set(value) {
 				this.$store.commit('poll/setProperty', { allowMaybe: +value })
diff --git a/src/js/components/Configuration/ConfigAnonymous.vue b/src/js/components/Configuration/ConfigAnonymous.vue
index dfef04b3..35c876ff 100644
--- a/src/js/components/Configuration/ConfigAnonymous.vue
+++ b/src/js/components/Configuration/ConfigAnonymous.vue
@@ -21,18 +21,20 @@
   -->
 
 <template>
-	<CheckBoxDiv v-model="anonymous" :label="t('polls', 'Anonymous poll')" />
+	<CheckboxRadioSwitch :checked.sync="anonymous" type="switch">
+		{{ t('polls', 'Anonymous poll') }}
+	</CheckboxRadioSwitch>
 </template>
 
 <script>
 import { mapState } from 'vuex'
-import CheckBoxDiv from '../Base/CheckBoxDiv'
+import { CheckboxRadioSwitch } from '@nextcloud/vue'
 
 export default {
 	name: 'ConfigAnonymous',
 
 	components: {
-		CheckBoxDiv,
+		CheckboxRadioSwitch,
 	},
 
 	computed: {
@@ -42,7 +44,7 @@ export default {
 
 		anonymous: {
 			get() {
-				return this.poll.anonymous
+				return !!this.poll.anonymous
 			},
 			set(value) {
 				this.$store.commit('poll/setProperty', { anonymous: +value })
diff --git a/src/js/components/Configuration/ConfigClosing.vue b/src/js/components/Configuration/ConfigClosing.vue
index ff05f907..36bd30f3 100644
--- a/src/js/components/Configuration/ConfigClosing.vue
+++ b/src/js/components/Configuration/ConfigClosing.vue
@@ -26,7 +26,9 @@
 			:icon="closed ? 'icon-polls-open' : 'icon-polls-closed'"
 			:title="closed ? t('polls', 'Reopen poll'): t('polls', 'Close poll')"
 			@click="toggleClosed()" />
-		<CheckBoxDiv v-show="!closed" v-model="useExpire" :label="t('polls', 'Poll closing date')" />
+		<CheckboxRadioSwitch v-show="!closed" :checked.sync="useExpire" type="switch">
+			{{ t('polls', 'Poll closing date') }}
+		</CheckboxRadioSwitch>
 		<DatetimePicker v-show="useExpire && !closed" v-model="expire" v-bind="expirationDatePicker" />
 	</div>
 </template>
@@ -34,14 +36,13 @@
 <script>
 import { mapState, mapGetters } from 'vuex'
 import moment from '@nextcloud/moment'
-import { DatetimePicker } from '@nextcloud/vue'
-import CheckBoxDiv from '../Base/CheckBoxDiv'
+import { DatetimePicker, CheckboxRadioSwitch } from '@nextcloud/vue'
 
 export default {
 	name: 'ConfigClosing',
 
 	components: {
-		CheckBoxDiv,
+		CheckboxRadioSwitch,
 		DatetimePicker,
 	},
 
@@ -88,7 +89,7 @@ export default {
 
 		useExpire: {
 			get() {
-				return this.poll.expire
+				return !!this.poll.expire
 			},
 			set(value) {
 				if (value) {
diff --git a/src/js/components/Configuration/ConfigOptionLimit.vue b/src/js/components/Configuration/ConfigOptionLimit.vue
index 74e84c76..66afcffd 100644
--- a/src/js/components/Configuration/ConfigOptionLimit.vue
+++ b/src/js/components/Configuration/ConfigOptionLimit.vue
@@ -22,30 +22,34 @@
 
 <template>
 	<div>
-		<CheckBoxDiv v-model="useOptionLimit" :label="t('polls', 'Limit yes votes per option')" />
+		<CheckboxRadioSwitch :checked.sync="useOptionLimit" type="switch">
+			{{ t('polls', 'Limit yes votes per option') }}
+		</CheckboxRadioSwitch>
 		<InputDiv v-if="optionLimit"
 			v-model="optionLimit"
 			class="selectUnit indented"
 			use-num-modifiers
 			@add="optionLimit += 1"
 			@subtract="optionLimit -= 1" />
-		<CheckBoxDiv v-if="optionLimit"
-			v-model="hideBookedUp"
+		<CheckboxRadioSwitch v-if="optionLimit"
 			class="indented"
-			:label="t('polls', 'Hide not available Options')" />
+			:checked.sync="hideBookedUp"
+			type="switch">
+			{{ t('polls', 'Hide not available Options') }}
+		</CheckboxRadioSwitch>
 	</div>
 </template>
 
 <script>
 import { mapState } from 'vuex'
-import CheckBoxDiv from '../Base/CheckBoxDiv'
+import { CheckboxRadioSwitch } from '@nextcloud/vue'
 import InputDiv from '../Base/InputDiv'
 
 export default {
 	name: 'ConfigOptionLimit',
 
 	components: {
-		CheckBoxDiv,
+		CheckboxRadioSwitch,
 		InputDiv,
 	},
 
diff --git a/src/js/components/Configuration/ConfigProposals.vue b/src/js/components/Configuration/ConfigProposals.vue
index ea19ba76..c71a5b1d 100644
--- a/src/js/components/Configuration/ConfigProposals.vue
+++ b/src/js/components/Configuration/ConfigProposals.vue
@@ -22,9 +22,15 @@
 
 <template>
 	<div>
-		<RadioGroupDiv v-model="allowProposals" :options="proposalsOptions" />
-		<CheckBoxDiv v-show="proposalsAllowed" v-model="pollExpiration" :label="t('polls', 'Proposal closing date')" />
-		<DatetimePicker v-show="pollExpiration && proposalsAllowed" v-model="pollExpire" v-bind="expirationDatePicker" />
+		<CheckboxRadioSwitch :checked.sync="allowProposals" type="switch">
+			{{ t('polls', 'Allow Proposals') }}
+		</CheckboxRadioSwitch>
+
+		<CheckboxRadioSwitch v-show="proposalsAllowed" :checked.sync="proposalExpiration" type="switch">
+			{{ t('polls', 'Proposal closing date') }}
+		</CheckboxRadioSwitch>
+
+		<DatetimePicker v-show="proposalExpiration && proposalsAllowed" v-model="pollExpire" v-bind="expirationDatePicker" />
 	</div>
 </template>
 
@@ -34,17 +40,14 @@ import { mapState, mapGetters } from 'vuex'
 import { showSuccess, showError } from '@nextcloud/dialogs'
 import { emit } from '@nextcloud/event-bus'
 import moment from '@nextcloud/moment'
-import { DatetimePicker } from '@nextcloud/vue'
-import CheckBoxDiv from '../Base/CheckBoxDiv'
-import RadioGroupDiv from '../Base/RadioGroupDiv'
+import { CheckboxRadioSwitch, DatetimePicker } from '@nextcloud/vue'
 
 export default {
 	name: 'ConfigProposals',
 
 	components: {
-		CheckBoxDiv,
+		CheckboxRadioSwitch,
 		DatetimePicker,
-		RadioGroupDiv,
 	},
 
 	data() {
@@ -66,10 +69,10 @@ export default {
 		// Add bindings
 		allowProposals: {
 			get() {
-				return this.poll.allowProposals
+				return (this.poll.allowProposals === 'allow')
 			},
 			set(value) {
-				this.writeValue({ allowProposals: value })
+				this.writeValue({ allowProposals: value ? 'allow' : 'disallow' })
 			},
 		},
 
@@ -82,9 +85,9 @@ export default {
 			},
 		},
 
-		pollExpiration: {
+		proposalExpiration: {
 			get() {
-				return this.poll.proposalsExpire
+				return !!this.poll.proposalsExpire
 			},
 			set(value) {
 				if (value) {
diff --git a/src/js/components/Configuration/ConfigUseNo.vue b/src/js/components/Configuration/ConfigUseNo.vue
index 3cfee72f..c01fb11b 100644
--- a/src/js/components/Configuration/ConfigUseNo.vue
+++ b/src/js/components/Configuration/ConfigUseNo.vue
@@ -21,18 +21,20 @@
   -->
 
 <template>
-	<CheckBoxDiv v-model="useNo" :label="label" />
+	<CheckboxRadioSwitch :checked.sync="deleteVoteOnNo" type="switch">
+		{{ label }}
+	</CheckboxRadioSwitch>
 </template>
 
 <script>
 import { mapState } from 'vuex'
-import CheckBoxDiv from '../Base/CheckBoxDiv'
+import { CheckboxRadioSwitch } from '@nextcloud/vue'
 
 export default {
 	name: 'ConfigUseNo',
 
 	components: {
-		CheckBoxDiv,
+		CheckboxRadioSwitch,
 	},
 
 	data() {
@@ -46,7 +48,7 @@ export default {
 			poll: (state) => state.poll,
 		}),
 
-		useNo: {
+		deleteVoteOnNo: {
 			get() {
 				return !this.poll.useNo
 			},
diff --git a/src/js/components/Configuration/ConfigVoteLimit.vue b/src/js/components/Configuration/ConfigVoteLimit.vue
index 4e2a812b..c3358421 100644
--- a/src/js/components/Configuration/ConfigVoteLimit.vue
+++ b/src/js/components/Configuration/ConfigVoteLimit.vue
@@ -22,7 +22,9 @@
 
 <template>
 	<div>
-		<CheckBoxDiv v-model="useVoteLimit" :label="t('polls', 'Limit yes votes per user')" />
+		<CheckboxRadioSwitch :checked.sync="useVoteLimit" type="switch">
+			{{ t('polls', 'Limit yes votes per user') }}
+		</CheckboxRadioSwitch>
 		<InputDiv v-if="voteLimit"
 			v-model="voteLimit"
 			class="selectUnit indented"
@@ -34,14 +36,14 @@
 
 <script>
 import { mapState } from 'vuex'
-import CheckBoxDiv from '../Base/CheckBoxDiv'
+import { CheckboxRadioSwitch } from '@nextcloud/vue'
 import InputDiv from '../Base/InputDiv'
 
 export default {
 	name: 'ConfigVoteLimit',
 
 	components: {
-		CheckBoxDiv,
+		CheckboxRadioSwitch,
 		InputDiv,
 	},