-
Notifications
You must be signed in to change notification settings - Fork 0
/
app.js
84 lines (77 loc) · 2.71 KB
/
app.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
const { createApp } = Vue
createApp({
data() {
return {
title: 'Aluguel de filmes!',
products: [
{
title : 'Homem Aranha',
description: 'Filme orginal da primeira franquia',
image : 'assets/images/Spide-Man_Poster.jpg',
stars: 5
},
{
title : 'O Espetacular Homem Aranha',
description: 'Filme orginal da segunda franquia',
image : 'assets/images/espetacular-homem-aranha.jpeg',
stars: 4
},
{
title : 'Homem Aranha - De volta Pra Casa',
description: 'Filme orginal da terceira franquia - UCM',
image : 'assets/images/de-volta-ao-lar.jpeg',
stars: 5
},
{
title : 'Vingadores - Guerra Infinita',
description: 'Primeiro filme de conclusão da saga do Infinito no UCM',
image : 'assets/images/infinite-war.jpg',
stars: 5
},
{
title : 'Vingadores - Ultimato',
description: 'Segundo filme de conclusão da saga do Infinito no UCM',
image : 'assets/images/ultimato.jpg',
stars: 5
},
],
cart: [],
themePage: {
theme: 'black',
message: 'Tema Branco?',
} ,
styles: {
backgroundColor: '#1f1f1f',
color: '#fff',
transition: '1s'
}
}
},
methods: {
addCart (product) {
this.cart.push(product)
},
inCart (product) {
return this.cart.indexOf(product) != -1
},
removeCart (product) {
this.cart = this.cart.filter((prod, index) => product != prod )
},
alteraTema() {
if (this.themePage.theme == 'black') {
this.themePage.theme = 'white'
this.themePage.message = 'Tema Escuro?'
this.styles.backgroundColor = '#fff'
this.styles.color = '#1f1f1f'
return
}
if (this.themePage.theme == 'white') {
this.themePage.theme = 'black'
this.themePage.message = 'Tema Claro?'
this.styles.backgroundColor = '#1f1f1f'
this.styles.color = '#fff'
return
}
}
}
}).mount('#app')