Files
Website/resources/js/components/SMButton.vue
2023-01-24 15:13:03 +10:00

59 lines
1.5 KiB
Vue

<template>
<a
v-if="href.length > 0 || typeof to == 'string'"
:href="href"
:disabled="disabled"
:class="['button', 'prevent-select', classType]"
:type="buttonType">
{{ label }}
<font-awesome-icon v-if="icon" :icon="icon" />
</a>
<button
v-else-if="to == null"
:disabled="disabled"
:class="['button', 'prevent-select', classType]"
:type="buttonType">
{{ label }}
<font-awesome-icon v-if="icon" :icon="icon" />
</button>
<router-link
v-else
:to="to"
:disabled="disabled"
:class="['button', 'prevent-select', classType]">
{{ label }}
<font-awesome-icon v-if="icon" :icon="icon" />
</router-link>
</template>
<script setup lang="ts">
const props = defineProps({
label: { type: String, default: "Button", required: false },
type: { type: String, default: "primary", required: false },
icon: {
type: String,
default: "",
required: false,
},
to: {
type: [String, Object],
default: null,
required: false,
validator: (prop) => typeof prop === "object" || prop === null,
},
href: {
type: String,
default: "",
required: false,
},
disabled: {
type: Boolean,
default: false,
required: false,
},
});
const buttonType = props.type == "submit" ? "submit" : "button";
const classType = props.type == "submit" ? "primary" : props.type;
</script>