39 lines
908 B
Vue
39 lines
908 B
Vue
<script setup>
|
|
import { ref,onMounted } from 'vue';
|
|
import { emitter } from '~/services/Emitter';
|
|
|
|
|
|
const statusIcon = ref(null);
|
|
const statusMessage = ref(null);
|
|
|
|
emitter.on("status-bar-update", (state) => {
|
|
var preloadImage = new Image();
|
|
preloadImage.src = '/icons/Pixelarticons/black/' + state.icon + ".svg";
|
|
preloadImage.onload = function() {
|
|
statusIcon.value.src = this.src;
|
|
};
|
|
statusMessage.value.innerText = state.text;
|
|
})
|
|
|
|
onMounted(() => {
|
|
emitter.emit("status-bar-update", {text: "Hola", icon: "check"})
|
|
});
|
|
</script>
|
|
<template>
|
|
<span class="status-text">
|
|
<img class="icon" ref="statusIcon" src=""/>
|
|
<span class="status-message" ref="statusMessage"></span>
|
|
</span>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.status-text {
|
|
margin-left: 10px;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
}
|
|
|
|
.status-message {
|
|
margin-left: 5px;
|
|
}
|
|
</style> |