-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
144 lines (140 loc) · 14.6 KB
/
index.html
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
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html" charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Chat-UA</title>
<link rel="stylesheet" href="./css/style.css">
</head>
<body>
<div id="container">
<div id="header">
<div id="logo">
<a href="#"><img src="./img/logo.png" alt=""></a>
</div>
<div id="headRight" class="flex">
<div id="dollar">
<img src="./img/icon_dollar.png">
<span>0.00 <img src="./img/figure7Blue.png"></span>
</div>
<div id="account">
<img src="./img/figure8.png" alt="">
<span id="accountName">Accountname <img src="./img/figure7.png"></span>
</div>
<div id="iconMiddle">
<img src="./img/alarm.png">
<span id="countAlarm">1</span>
<img src="./img/figure10.png">
<img src="./img/figure11.png">
</div>
<div id="lang">
<span>
<select>
<option value="rus">РУС</option>
<option value="eng">ENG</option>
<option value="uk">УКР</option>
</select>
</span>
<img id = "fig" src="./img/figure7Blue.png" alt="">
<!--<span>РУС</span>
<img src="./img/figure7Blue.png">-->
</div>
</div>
</div>
<div id="basic">
<div id="leftContainer">
<nav id="menuVertical">
<ul>
<li>
<a href="#" class="contact contact_active">
<div class="contact_img" title="Счета">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid" width="32" height="32" viewBox="0 0 32 32">
<path d="M28.875,6.250 C27.478,6.250 26.293,5.329 25.894,4.062 L22.625,4.062 L22.625,10.125 L30.062,10.125 L30.062,16.375 L31.937,16.375 L31.937,25.750 L30.062,25.750 L30.062,32.000 L1.937,32.000 L1.937,10.125 L9.375,10.125 L9.375,8.162 L5.019,5.608 C4.493,6.010 3.837,6.250 3.125,6.250 C1.402,6.250 -0.000,4.848 -0.000,3.125 C-0.000,1.402 1.402,-0.000 3.125,-0.000 C4.848,-0.000 6.250,1.402 6.250,3.125 C6.250,3.454 6.198,3.772 6.103,4.071 L11.250,7.088 L11.250,10.125 L15.062,10.125 L15.062,6.106 C13.796,5.707 12.875,4.522 12.875,3.125 C12.875,1.402 14.277,-0.000 16.000,-0.000 C17.723,-0.000 19.125,1.402 19.125,3.125 C19.125,4.522 18.204,5.707 16.937,6.106 L16.937,10.125 L20.750,10.125 L20.750,2.187 L25.894,2.187 C26.293,0.921 27.478,-0.000 28.875,-0.000 C30.598,-0.000 32.000,1.402 32.000,3.125 C32.000,4.848 30.598,6.250 28.875,6.250 ZM3.125,1.875 C2.436,1.875 1.875,2.436 1.875,3.125 C1.875,3.814 2.436,4.375 3.125,4.375 C3.814,4.375 4.375,3.814 4.375,3.125 C4.375,2.436 3.814,1.875 3.125,1.875 ZM30.062,18.250 L21.625,18.250 C20.074,18.250 18.812,19.512 18.812,21.062 C18.812,22.613 20.074,23.875 21.625,23.875 L30.062,23.875 L30.062,18.250 ZM17.250,3.125 C17.250,2.436 16.689,1.875 16.000,1.875 C15.311,1.875 14.750,2.436 14.750,3.125 C14.750,3.814 15.311,4.375 16.000,4.375 C16.689,4.375 17.250,3.814 17.250,3.125 ZM3.812,12.000 L3.812,30.125 L28.187,30.125 L28.187,25.750 L21.625,25.750 C19.040,25.750 16.937,23.647 16.937,21.062 C16.937,18.478 19.040,16.375 21.625,16.375 L28.187,16.375 L28.187,12.000 L3.812,12.000 ZM28.875,1.875 C28.186,1.875 27.625,2.436 27.625,3.125 C27.625,3.814 28.186,4.375 28.875,4.375 C29.564,4.375 30.125,3.814 30.125,3.125 C30.125,2.436 29.564,1.875 28.875,1.875 ZM20.687,21.062 C20.687,20.545 21.107,20.125 21.625,20.125 C22.143,20.125 22.562,20.545 22.562,21.062 C22.562,21.580 22.143,22.000 21.625,22.000 C21.107,22.000 20.687,21.580 20.687,21.062 Z" class="cls-1"/>
</svg>
</div>
<div class="contact_txt">Счета</div>
</a>
</li>
<li>
<a href="#" class="contact" v-on:click="replenish">
<div class="contact_img" title="Пополнить">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid" width="32" height="27" viewBox="0 0 32 27">
<path d="M30.623,22.996 L22.981,27.000 L12.187,27.000 C10.085,27.000 8.190,26.092 6.875,24.649 L6.875,27.000 L-0.000,27.000 L-0.000,12.001 L11.103,12.001 C12.330,12.001 13.490,12.472 14.370,13.326 L16.865,15.751 L22.562,15.751 C24.253,15.751 25.655,17.125 25.687,18.815 C25.690,18.976 25.680,19.135 25.659,19.292 L28.675,18.262 C29.462,18.020 30.294,18.162 30.957,18.652 C31.620,19.142 32.000,19.895 32.000,20.719 C32.000,21.678 31.472,22.550 30.623,22.996 ZM5.000,13.876 L1.875,13.876 L1.875,25.125 L5.000,25.125 L5.000,13.876 ZM29.843,20.160 C29.667,20.029 29.446,19.990 29.236,20.051 L23.531,22.000 L16.437,22.000 L16.437,22.000 L15.664,22.000 C15.664,22.000 15.663,22.000 15.662,22.000 C14.841,22.000 14.066,21.679 13.482,21.096 L14.807,19.770 C15.037,19.999 15.342,20.125 15.667,20.125 C15.669,20.125 15.671,20.125 15.673,20.125 L15.692,20.125 L15.702,20.125 L16.437,20.125 L22.519,20.125 C22.867,20.125 23.208,19.981 23.455,19.730 C23.692,19.489 23.818,19.176 23.812,18.851 C23.799,18.175 23.239,17.625 22.562,17.625 L16.105,17.625 L13.063,14.671 C12.535,14.158 11.839,13.876 11.103,13.876 L6.875,13.876 L6.875,19.813 C6.875,22.742 9.258,25.125 12.187,25.125 L22.519,25.125 L29.752,21.335 C29.982,21.214 30.125,20.978 30.125,20.719 C30.125,20.496 30.022,20.292 29.843,20.160 ZM17.000,6.118 L18.280,4.868 L21.094,7.615 L21.094,-0.000 L22.905,-0.000 L22.905,7.615 L25.719,4.868 L27.000,6.118 L22.000,11.000 L17.000,6.118 Z" class="cls-1"/>
</svg>
</div>
<div class="contact_txt">Пополнить</div>
</a>
</li>
<li>
<a href="#" class="contact">
<div class="contact_img" title="Перевести">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid" width="32" height="27" viewBox="0 0 32 27">
<path d="M30.623,22.995 L22.981,27.000 L12.187,27.000 C10.085,27.000 8.190,26.092 6.875,24.649 L6.875,27.000 L-0.000,27.000 L-0.000,12.001 L11.103,12.001 C12.330,12.001 13.490,12.472 14.370,13.326 L16.865,15.750 L22.562,15.750 C24.253,15.750 25.655,17.125 25.687,18.815 C25.690,18.976 25.680,19.135 25.659,19.292 L28.675,18.262 C29.462,18.020 30.294,18.162 30.957,18.652 C31.620,19.141 32.000,19.895 32.000,20.719 C32.000,21.678 31.472,22.550 30.623,22.995 ZM5.000,13.876 L1.875,13.876 L1.875,25.125 L5.000,25.125 L5.000,13.876 ZM29.843,20.160 C29.667,20.029 29.446,19.990 29.236,20.051 L23.531,22.000 L16.437,22.000 L16.437,22.000 L15.664,22.000 C15.664,22.000 15.663,22.000 15.662,22.000 C14.841,22.000 14.066,21.679 13.482,21.096 L14.807,19.770 C15.037,19.999 15.342,20.125 15.667,20.125 C15.669,20.125 15.671,20.125 15.673,20.125 L15.692,20.125 L15.702,20.125 L16.437,20.125 L22.519,20.125 C22.867,20.125 23.208,19.981 23.455,19.730 C23.692,19.489 23.818,19.176 23.812,18.851 C23.799,18.175 23.239,17.625 22.562,17.625 L16.105,17.625 L13.063,14.671 C12.535,14.158 11.839,13.876 11.103,13.876 L6.875,13.876 L6.875,19.813 C6.875,22.742 9.258,25.125 12.187,25.125 L22.519,25.125 L29.752,21.335 C29.982,21.214 30.125,20.978 30.125,20.719 C30.125,20.496 30.022,20.292 29.843,20.160 ZM22.906,3.385 L22.906,11.000 L21.095,11.000 L21.095,3.385 L18.281,6.132 L17.000,4.881 L22.000,-0.000 L27.000,4.881 L25.720,6.132 L22.906,3.385 Z" class="cls-1"/>
</svg>
</div>
<div class="contact_txt">Перевести</div>
</a>
</li>
<li>
<a href="#" class="contact">
<div class="contact_img" title="Обменять">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid" width="32" height="32" viewBox="0 0 32 32">
<path d="M25.439,16.937 L25.439,16.000 C25.439,10.783 21.216,6.561 16.000,6.561 C14.078,6.561 12.271,7.115 10.718,8.173 L12.468,9.922 L2.362,11.656 L4.096,1.550 L6.030,3.485 C8.853,1.232 12.359,-0.000 16.000,-0.000 C24.844,-0.000 32.000,7.157 32.000,16.000 L32.000,16.937 L25.439,16.937 ZM16.000,1.875 C9.735,1.875 6.271,5.838 5.941,6.047 L5.331,5.438 L4.658,9.360 L8.581,8.687 L7.915,8.022 C8.322,7.771 11.043,4.686 16.000,4.686 C21.947,4.686 26.803,9.262 27.276,15.062 L30.095,15.062 C29.622,7.793 23.583,1.875 16.000,1.875 ZM6.561,16.000 C6.561,21.217 10.783,25.439 16.000,25.439 C17.899,25.439 19.747,24.867 21.299,23.812 L19.565,22.078 L29.670,20.344 L27.936,30.449 L25.988,28.501 C23.162,30.763 19.649,32.000 16.000,32.000 C7.156,32.000 -0.000,24.842 -0.000,16.000 L-0.000,15.062 L6.561,15.062 L6.561,16.000 ZM1.905,16.937 C2.378,24.207 8.417,30.125 16.000,30.125 C22.280,30.125 25.747,26.146 26.076,25.937 L26.701,26.562 L27.374,22.640 L23.452,23.313 L24.100,23.961 C23.713,24.201 20.976,27.314 16.000,27.314 C10.052,27.314 5.197,22.737 4.724,16.937 L1.905,16.937 Z" class="cls-1"/>
</svg>
</div>
<div class="contact_txt">Обменять</div>
</a>
</li>
<li>
<a href="#" class="contact">
<div class="contact_img" title="Мерчант">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid" width="32" height="27" viewBox="0 0 32 27">
<path d="M26.151,28.250 L32.000,28.250 L32.000,30.125 L26.151,30.125 C25.764,31.216 24.722,32.000 23.500,32.000 C22.278,32.000 21.236,31.216 20.849,30.125 L18.651,30.125 C18.264,31.216 17.222,32.000 16.000,32.000 C14.778,32.000 13.736,31.216 13.349,30.125 L11.151,30.125 C10.764,31.216 9.722,32.000 8.500,32.000 C7.278,32.000 6.236,31.216 5.849,30.125 L-0.000,30.125 L-0.000,28.250 L5.849,28.250 C6.131,27.452 6.765,26.819 7.562,26.536 L7.562,21.250 L5.687,21.250 L5.687,-0.000 L26.312,-0.000 L26.312,21.250 L24.437,21.250 L24.437,26.536 C25.235,26.819 25.868,27.452 26.151,28.250 ZM18.651,28.250 L20.849,28.250 C21.132,27.452 21.765,26.819 22.562,26.536 L22.562,21.250 L16.937,21.250 L16.937,26.536 C17.735,26.819 18.368,27.452 18.651,28.250 ZM16.000,30.125 C16.517,30.125 16.937,29.704 16.937,29.187 C16.937,28.671 16.517,28.250 16.000,28.250 C15.483,28.250 15.062,28.671 15.062,29.187 C15.062,29.704 15.483,30.125 16.000,30.125 ZM11.151,28.250 L13.349,28.250 C13.632,27.452 14.265,26.819 15.062,26.536 L15.062,21.250 L9.437,21.250 L9.437,26.536 C10.235,26.819 10.868,27.452 11.151,28.250 ZM8.500,30.125 C9.017,30.125 9.437,29.704 9.437,29.187 C9.437,28.671 9.017,28.250 8.500,28.250 C7.983,28.250 7.562,28.671 7.562,29.187 C7.562,29.704 7.983,30.125 8.500,30.125 ZM24.437,1.875 L7.562,1.875 L7.562,19.375 L24.437,19.375 L24.437,1.875 ZM23.500,28.250 C22.983,28.250 22.562,28.671 22.562,29.187 C22.562,29.704 22.983,30.125 23.500,30.125 C24.017,30.125 24.437,29.704 24.437,29.187 C24.437,28.671 24.017,28.250 23.500,28.250 ZM10.375,3.750 C10.893,3.750 11.312,4.170 11.312,4.687 C11.312,5.205 10.893,5.625 10.375,5.625 C9.857,5.625 9.437,5.205 9.437,4.687 C9.437,4.170 9.857,3.750 10.375,3.750 ZM14.125,3.750 C14.643,3.750 15.062,4.170 15.062,4.687 C15.062,5.205 14.643,5.625 14.125,5.625 C13.607,5.625 13.187,5.205 13.187,4.687 C13.187,4.170 13.607,3.750 14.125,3.750 ZM22.562,5.625 L16.937,5.625 L16.937,3.750 L22.562,3.750 L22.562,5.625 ZM22.562,9.375 L16.937,9.375 L16.937,7.500 L22.562,7.500 L22.562,9.375 ZM22.562,13.125 L16.937,13.125 L16.937,11.250 L22.562,11.250 L22.562,13.125 Z" class="cls-1"/>
</svg>
</div>
<div class="contact_txt">Мерчант</div>
</a>
</li>
</ul>
</nav>
<div id="menuScroll"></div>
</div>
<div id="rightContainer">
<div id="table">
<table>
<caption>Мои транзакции</caption>
<thead>
<tr>
<th class="tdIdH">ID ЗАЯВКИ</th>
<th class="statusH">СТАТУС</th>
<th class="debetH">СУММА К ЗАЧИСЛЕНИЮ</th>
<th class="creditH">СУММА К ОПЛАТЕ</th>
<th class="detailskH">ДЕТАЛИ</th>
<th class="dateOperH">ВРЕМЯ СОЗДАНИЯ</td>
</tr>
</thead>
<tbody id="tableRecord">
<tr is="ttr"
v-for="item in tranzactions"
v-bind:tranzaction = "item"
v-bind:key = "item.id"
></tr>
</tbody>
</table>
</div>
<!--
<select>
<option>1.00</option>
<option>2.00</option>
<option>3.50</option>
</select>
<img id = "fig" src="./img/figure7Blue.png" alt="">-->
</div>
</div>
</div>
<!--<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>-->
<script type="text/javascript" src="./js/vue.js"></script>
<script type="text/javascript" src="./js/main.js"></script>
<script type="text/javascript" src="./js/tranzaction.js"></script>
</body>
</html>