bagus-arie05
54 lines
1.0 KiB
Vue
54 lines
1.0 KiB
Vue
<template>
|
|
<v-snackbar v-model="showModel" :color="color" :timeout="timeout">
|
|
<span class="body-3">{{ message }}</span>
|
|
<template #actions>
|
|
<v-btn variant="text" size="small" @click="showModel = false">
|
|
{{ closeText }}
|
|
</v-btn>
|
|
</template>
|
|
</v-snackbar>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { computed } from 'vue';
|
|
|
|
const props = defineProps({
|
|
modelValue: {
|
|
type: Boolean,
|
|
required: true
|
|
},
|
|
message: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
color: {
|
|
type: String,
|
|
default: 'success'
|
|
},
|
|
timeout: {
|
|
type: Number,
|
|
default: 3000
|
|
},
|
|
closeText: {
|
|
type: String,
|
|
default: 'Tutup'
|
|
}
|
|
});
|
|
|
|
const emit = defineEmits(['update:modelValue']);
|
|
|
|
const showModel = computed({
|
|
get: () => props.modelValue,
|
|
set: (value) => emit('update:modelValue', value)
|
|
});
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
$font-family-base: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
|
|
|
.body-3 {
|
|
font-size: 14px;
|
|
line-height: 20px;
|
|
font-family: $font-family-base;
|
|
}
|
|
</style> |