From 6aef54a9e055cb2688a769390a91a52ae5b8cc86 Mon Sep 17 00:00:00 2001 From: syuilo Date: Mon, 19 Jul 2021 23:30:12 +0900 Subject: [PATCH 01/12] Improve component stability --- src/client/components/form/radios.vue | 7 +++++-- src/client/components/tab.vue | 2 +- src/client/components/ui/radios.vue | 7 +++++-- 3 files changed, 11 insertions(+), 5 deletions(-) diff --git a/src/client/components/form/radios.vue b/src/client/components/form/radios.vue index 4cfb7c247e..b660c37ace 100644 --- a/src/client/components/form/radios.vue +++ b/src/client/components/form/radios.vue @@ -27,7 +27,10 @@ export default defineComponent({ }, render() { const label = this.$slots.desc(); - const options = this.$slots.default(); + let options = this.$slots.default(); + + // なぜかFragmentになることがあるため + if (options.length === 1 && options[0].props == null) options = options[0].children; return h('div', { class: 'cnklmpwm _formItem' @@ -37,7 +40,7 @@ export default defineComponent({ }, label), ...options.map(option => h('button', { class: '_button _formPanel _formClickable', - key: option.props.value, + key: option.key, onClick: () => this.value = option.props.value, }, [h('span', { class: ['check', { checked: this.value === option.props.value }], diff --git a/src/client/components/tab.vue b/src/client/components/tab.vue index 5e54fc968e..3902b7f98f 100644 --- a/src/client/components/tab.vue +++ b/src/client/components/tab.vue @@ -14,7 +14,7 @@ export default defineComponent({ class: 'pxhvhrfw', }, options.map(option => withDirectives(h('button', { class: ['_button', { active: this.value === option.props.value }], - key: option.props.value, + key: option.key, disabled: this.value === option.props.value, onClick: () => { this.$emit('update:value', option.props.value); diff --git a/src/client/components/ui/radios.vue b/src/client/components/ui/radios.vue index 547e616ea5..8a62b87683 100644 --- a/src/client/components/ui/radios.vue +++ b/src/client/components/ui/radios.vue @@ -23,14 +23,17 @@ export default defineComponent({ }, render() { const label = this.$slots.desc(); - const options = this.$slots.default(); + let options = this.$slots.default(); + + // なぜかFragmentになることがあるため + if (options.length === 1 && options[0].props == null) options = options[0].children; return h('div', { class: 'novjtcto' }, [ h('div', label), ...options.map(option => h(MkRadio, { - key: option.props.value, + key: option.key, value: option.props.value, modelValue: this.value, 'onUpdate:modelValue': value => this.value = value, From f142ed91fb941b670728ddad3dad7d79726d6547 Mon Sep 17 00:00:00 2001 From: syuilo Date: Mon, 19 Jul 2021 23:30:45 +0900 Subject: [PATCH 02/12] Implement radio type for form dialog --- src/client/components/form-dialog.vue | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/src/client/components/form-dialog.vue b/src/client/components/form-dialog.vue index d6a7e39d45..e13592b488 100644 --- a/src/client/components/form-dialog.vue +++ b/src/client/components/form-dialog.vue @@ -34,6 +34,10 @@ + + + + @@ -56,6 +60,7 @@ import FormSwitch from './form/switch.vue'; import FormSelect from './form/select.vue'; import FormRange from './form/range.vue'; import FormButton from './form/button.vue'; +import FormRadios from './form/radios.vue'; export default defineComponent({ components: { @@ -67,6 +72,7 @@ export default defineComponent({ FormSelect, FormRange, FormButton, + FormRadios, }, props: { From 756b8a2a29c8adc1e2c52e80e04c3afc0dca011e Mon Sep 17 00:00:00 2001 From: syuilo Date: Mon, 19 Jul 2021 23:31:27 +0900 Subject: [PATCH 03/12] Make thickness of clock hands configuable --- src/client/components/analog-clock.vue | 20 +++++++++++++++----- src/client/widgets/clock.vue | 13 ++++++++++++- 2 files changed, 27 insertions(+), 6 deletions(-) diff --git a/src/client/components/analog-clock.vue b/src/client/components/analog-clock.vue index 8aa51898bc..32b7ebb8e3 100644 --- a/src/client/components/analog-clock.vue +++ b/src/client/components/analog-clock.vue @@ -5,7 +5,8 @@ :cy="5 - (Math.cos(angle) * (5 - graduationsPadding))" :r="i % 5 == 0 ? 0.125 : 0.05" :fill="i % 5 == 0 ? majorGraduationColor : minorGraduationColor" - :key="i"/> + :key="i" + /> + :stroke-width="thickness / 2" + /> + :stroke-width="thickness" + /> + :stroke-width="thickness" + />