mirror of
https://github.com/nocodb/nocodb.git
synced 2026-05-01 05:26:53 +00:00
* chore: preps Signed-off-by: mertmit <mertmit99@gmail.com> * test: fix unit Signed-off-by: mertmit <mertmit99@gmail.com> --------- Signed-off-by: mertmit <mertmit99@gmail.com>
44 lines
1.0 KiB
Vue
44 lines
1.0 KiB
Vue
<script lang="ts" setup>
|
|
import { LoadingOutlined } from '@ant-design/icons-vue'
|
|
|
|
export interface GeneralLoaderProps {
|
|
size?: 'small' | 'medium' | 'large' | 'xlarge' | 'regular' | number
|
|
loaderClass?: string
|
|
}
|
|
|
|
const props = defineProps<GeneralLoaderProps>()
|
|
|
|
function getFontSize() {
|
|
const { size = 'medium' } = props
|
|
|
|
switch (size) {
|
|
case 'small':
|
|
return 'text-xs'
|
|
case 'medium':
|
|
return 'text-sm'
|
|
case 'large':
|
|
return 'text-xl'
|
|
case 'xlarge':
|
|
return 'text-3xl'
|
|
case 'regular':
|
|
return 'text-[16px] leading-4'
|
|
}
|
|
}
|
|
|
|
const indicator = h(LoadingOutlined, {
|
|
class: `!${getFontSize()} flex flex-row items-center !bg-inherit !hover:bg-inherit !text-inherit ${props.loaderClass || ''}}`,
|
|
style: { ...(typeof props.size === 'number' && props.size ? { fontSize: `${props.size}px` } : {}) },
|
|
spin: true,
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<a-spin class="nc-loader !flex flex-row items-center" :indicator="indicator" />
|
|
</template>
|
|
|
|
<style lang="scss" scoped>
|
|
:deep(.anticon-spin) {
|
|
@apply flex;
|
|
}
|
|
</style>
|