diff options
author | dartcafe <github@dartcafe.de> | 2021-02-11 10:19:00 +0300 |
---|---|---|
committer | dartcafe <github@dartcafe.de> | 2021-02-11 10:19:00 +0300 |
commit | ad7e34e1dee5e706b36bd39721e5cc4a4390719d (patch) | |
tree | 2659ef41032b60afe6ce5d5421419ef85136ba7a /src/js/components/Base | |
parent | fca945331bf545c90ea330d445672b773e7c350c (diff) |
Add CheckboxDiv
Diffstat (limited to 'src/js/components/Base')
-rw-r--r-- | src/js/components/Base/CheckBoxDiv.vue | 59 |
1 files changed, 59 insertions, 0 deletions
diff --git a/src/js/components/Base/CheckBoxDiv.vue b/src/js/components/Base/CheckBoxDiv.vue new file mode 100644 index 00000000..7f62bc56 --- /dev/null +++ b/src/js/components/Base/CheckBoxDiv.vue @@ -0,0 +1,59 @@ +<!-- + - @copyright Copyright (c) 2018 René Gieling <github@dartcafe.de> + - + - @author René Gieling <github@dartcafe.de> + - + - @license GNU AGPL version 3 or any later version + - + - This program is free software: you can redistribute it and/or modify + - it under the terms of the GNU Affero General Public License as + - published by the Free Software Foundation, either version 3 of the + - License, or (at your option) any later version. + - + - This program is distributed in the hope that it will be useful, + - but WITHOUT ANY WARRANTY; without even the implied warranty of + - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + - GNU Affero General Public License for more details. + - + - You should have received a copy of the GNU Affero General Public License + - along with this program. If not, see <http://www.gnu.org/licenses/>. + - + --> + +<template lang="html"> + <div class="checkbox-div"> + <input :id="id" + :checked="value" + type="checkbox" + class="checkbox" + @click="$emit('input', $event.target.checked)"> + <label :for="id"> + <slot name="before" /> + {{ label }} + </label> + </div> +</template> + +<script> +const RandId = () => { + return Math.random().toString(36).replace(/[^a-z]+/g, '').substr(2, 10) +} + +export default { + name: 'CheckBoxDiv', + props: { + label: { + type: String, + required: true, + }, + value: { + type: [Boolean, Number], + required: true, + }, + id: { + type: String, + default: () => 'cb-' + RandId(), + }, + }, +} +</script> |