Skip to content

Commit

Permalink
Refactorizar componente App.vue para mejorar rendimiento y seguir con…
Browse files Browse the repository at this point in the history
…venciones de Vue 3
  • Loading branch information
JoaquinDecima committed Oct 23, 2024
1 parent 5447b5d commit 3bf0b62
Showing 1 changed file with 26 additions and 35 deletions.
61 changes: 26 additions & 35 deletions ui/src/App.vue
Original file line number Diff line number Diff line change
@@ -1,50 +1,41 @@
<script lang="ts">
<script lang="ts" setup>
import { onMounted, Ref, ref } from "vue";
import ClockWidget from "./components/widgets/ClockWidgert.vue";
//import background from "./assets/background.mp4";
const background = '/home/pato/.backgroud.mp4';
export default {
name: "App",
components: {
ClockWidget,
},
data() {
return {
background: '',
};
},
methods: {
async setBackground() : Promise<void> {
this.background = await (this as any).$vsk.getHome() + '/.config/vsk/background.mp4';
},
},
mounted() {
this.setBackground();
},
const background: Ref<string> = ref("/home/pato/.backgroud.mp4");
const setBackground = async (): Promise<void> => {
background.value =
(await (this as any).$vsk.getHome()) + "/.config/vsk/background.mp4";
};
onMounted(() => {
setBackground();
});
</script>

<template>
<div class="global">
<video
style="border-radius:0px;"
id="video-background"
type="video/mp4"
:src="background"
loop
autoplay
muted>
</video>
<ClockWidget />
</div>
<video
style="border-radius: 0px"
id="video-background"
type="video/mp4"
:src="background"
loop
autoplay
muted
></video>
<ClockWidget />
</div>
</template>

<style>
body,
#app,
.global {
overflow: auto;
width: 100vw;
height: 100vh;
overflow: auto;
width: 100vw;
height: 100vh;
}
</style>
</style>

0 comments on commit 3bf0b62

Please sign in to comment.