Skip to content

Commit 6257538

Browse files
proger-coderproger-coder
committed
Initial commit
0 parents  commit 6257538

File tree

7 files changed

+133
-0
lines changed

7 files changed

+133
-0
lines changed

‎.gitignore

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
/node_modules/
2+
/desktop.ini

‎index.html

+45
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>Ecwid-Ayrat</title>
6+
<script src="https://unpkg.com/vue@next"></script>
7+
<link rel="stylesheet" href="styles.css">
8+
</head>
9+
<body>
10+
11+
<div class="items">
12+
13+
</div>
14+
15+
<div class="cart">
16+
<p class="cart-amountOfIn">7</p>
17+
<img class="cart-image" src="pics/cart.png" alt="cart image" >
18+
</div>
19+
20+
<div id="app">
21+
<div v-for="(item,i) in items">
22+
<h2>{{item.name.slice(8)}}</h2>
23+
<h3>Код товара: {{item.id}}</h3>
24+
25+
<p>Цена:{{item.price}}</p>
26+
<p v-html="item.description"></p>
27+
28+
<img :src="items[i].thumbnailUrl" alt="medium Product Photo">
29+
30+
<div v-for="(pic,i) in item.media.images" >
31+
<img :src="pic.image160pxUrl" alt="medium Product Photo" style="border:1px solid blue">
32+
</div>
33+
34+
Доступные размеры:
35+
<div v-for="size in item.options[0].choices">
36+
<p>{{size.text}}</p>
37+
</div>
38+
39+
<div class="colorDiv" :style="{backgroundColor:getMainColor(item)}"></div>
40+
</div>
41+
</div>
42+
43+
<script src="script.js"></script>
44+
</body>
45+
</html>

‎package-lock.json

+11
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎pics/EcwidCart.svg

+6
Loading

‎pics/cart.png

35.7 KB
Loading

‎script.js

+39
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
//let items = [];
2+
let itemsBox = document.querySelector('.items')
3+
4+
let storeId = 58958138;
5+
let token = 'public_7BxbJGWyDaZfSQqjVS5Ftr4jzXkS43UD';
6+
let requestURL = 'https://app.ecwid.com/api/v3/'+storeId+'/products?limit=3&token='+token;
7+
8+
let u2 = 'https://app.ecwid.com/api/v3/58958138/products?limit=3&token=public_7BxbJGWyDaZfSQqjVS5Ftr4jzXkS43UD'
9+
10+
11+
const app = Vue.createApp({
12+
data(){
13+
return{
14+
items:[],
15+
}
16+
},
17+
created(){
18+
this.getItems()
19+
},
20+
methods:{
21+
getItems(){
22+
fetch(requestURL)
23+
.then(response => response.json())
24+
.then(json => this.items = json.items)
25+
},
26+
getMainColor(item){
27+
let {red,green,blue,alpha} = item.borderInfo.dominatingColor;
28+
item.mainColor = `rgba(${red},${green},${blue},${alpha})`; //преобладающий цвет на фото
29+
return item.mainColor
30+
}
31+
},
32+
computed:{
33+
34+
}
35+
}).mount('#app');
36+
37+
fetch(u2).then(resp => resp.json()).then(jsoned => console.log(jsoned))
38+
39+

‎styles.css

+30
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
*{
2+
margin: 0;
3+
padding: 0;
4+
}
5+
6+
.cart{
7+
border: 4px solid green;
8+
display: inline-block;
9+
display: none;
10+
}
11+
.cart-image{
12+
border: 2px solid yellow;
13+
}
14+
.cart-amountOfIn{
15+
border: 1px solid deepskyblue;
16+
}
17+
18+
19+
20+
21+
22+
23+
24+
25+
26+
27+
.colorDiv{
28+
height:50px;
29+
width:50px;
30+
}

0 commit comments

Comments
 (0)