🎨chore: 使用 oxlint, oxfmt&格式化代码
This commit is contained in:
@@ -1,36 +1,36 @@
|
||||
<script lang="ts" setup>
|
||||
import type {PropType} from "vue";
|
||||
import type { PropType } from 'vue'
|
||||
|
||||
const emit = defineEmits(['click'])
|
||||
const props = defineProps({
|
||||
type: {
|
||||
type: String as PropType<ButtonType>,
|
||||
default: 'normal'
|
||||
default: 'normal',
|
||||
},
|
||||
attrType: {
|
||||
type: String as PropType<'button' | 'submit' | 'reset'>,
|
||||
default: 'button'
|
||||
default: 'button',
|
||||
},
|
||||
size: {
|
||||
type: String as PropType<ButtonSize>,
|
||||
default: 'base'
|
||||
default: 'base',
|
||||
},
|
||||
block: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
default: false,
|
||||
},
|
||||
icon: {
|
||||
type: String,
|
||||
default: ''
|
||||
default: '',
|
||||
},
|
||||
loading: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
default: false,
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
default: false,
|
||||
},
|
||||
})
|
||||
|
||||
const buttonTypeClass = computed(() => {
|
||||
@@ -54,21 +54,36 @@ const handleClick = (e: any) => {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<button class="w-fit flex justify-center items-center rounded-md font-bold border shadow-sm transition focus:ring-4"
|
||||
:class="{
|
||||
'w-full': block,
|
||||
'uni-button--disabled': disabled || loading,
|
||||
[buttonTypeClass]: buttonTypeClass,
|
||||
[buttonSizeClass]: buttonSizeClass,
|
||||
}" @click="handleClick" :disabled="disabled || loading" :type="attrType">
|
||||
<button
|
||||
class="w-fit flex justify-center items-center rounded-md font-bold border shadow-sm transition focus:ring-4"
|
||||
:class="{
|
||||
'w-full': block,
|
||||
'uni-button--disabled': disabled || loading,
|
||||
[buttonTypeClass]: buttonTypeClass,
|
||||
[buttonSizeClass]: buttonSizeClass,
|
||||
}"
|
||||
@click="handleClick"
|
||||
:disabled="disabled || loading"
|
||||
:type="attrType"
|
||||
>
|
||||
<Transition name="icon">
|
||||
<UniIconSpinner v-if="loading" />
|
||||
<Icon v-else-if="buttonIcon" :name="buttonIcon" :key="buttonIcon" />
|
||||
<span v-else class="mr-2">
|
||||
<slot name="icon"/>
|
||||
<Icon
|
||||
v-else-if="buttonIcon"
|
||||
:name="buttonIcon"
|
||||
:key="buttonIcon"
|
||||
/>
|
||||
<span
|
||||
v-else
|
||||
class="mr-2"
|
||||
>
|
||||
<slot name="icon" />
|
||||
</span>
|
||||
</Transition>
|
||||
<div class="flex items-center whitespace-nowrap leading-snug" :class="{ 'ml-2': buttonIcon || loading }">
|
||||
<div
|
||||
class="flex items-center whitespace-nowrap leading-snug"
|
||||
:class="{ 'ml-2': buttonIcon || loading }"
|
||||
>
|
||||
<slot />
|
||||
</div>
|
||||
</button>
|
||||
@@ -77,7 +92,7 @@ const handleClick = (e: any) => {
|
||||
<style scoped>
|
||||
.icon-enter-active,
|
||||
.icon-leave-active {
|
||||
transition: all .3s ease;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.icon-enter-from,
|
||||
|
||||
Reference in New Issue
Block a user