OpenSource/misskey
OpenSource/misskey
1
0
Fork 0
mirror of https://github.com/misskey-dev/misskey.git synced 2024-12-29 01:18:25 +01:00
Code Issues Projects Releases Packages Wiki Activity

chore(client): tweak radio component

Browse source
This commit is contained in:
syuilo 2022-07-20 19:59:50 +09:00
parent 66f1aaf5f7
commit e83dd90e07
1 changed files with 20 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

49
packages/client/src/components/form/radio.vue
View file

@ -18,34 +18,25 @@
</div>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
<script lang="ts" setup>
import { } from 'vue';
export default defineComponent({
props: {
modelValue: {
required: false,
},
value: {
required: false,
},
disabled: {
type: Boolean,
default: false,
},
},
computed: {
checked(): boolean {
return this.modelValue === this.value;
},
},
methods: {
toggle() {
if (this.disabled) return;
this.$emit('update:modelValue', this.value);
},
},
});
const props = defineProps<{
modelValue: any;
value: any;
disabled: boolean;
}>();
const emit = defineEmits<{
(ev: 'update:modelValue', value: any): void;
}>();
let checked = $computed(() => props.modelValue === props.value);
function toggle(): void {
if (props.disabled) return;
emit('update:modelValue', props.value);
}
</script>
<style lang="scss" scoped>
@ -54,13 +45,13 @@ export default defineComponent({
display: inline-block;
text-align: left;
cursor: pointer;
padding: 9px 12px;
padding: 8px 10px;
min-width: 60px;
background-color: var(--panel);
background-clip: padding-box !important;
border: solid 1px var(--panel);
border-radius: 6px;
transition: all 0.3s;
transition: all 0.2s;
> * {
user-select: none;