adata-ui 0.1.52 → 0.1.53
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/adata-ui.common.js +776 -374
- package/dist/adata-ui.common.js.map +1 -1
- package/dist/adata-ui.css +1 -1
- package/dist/adata-ui.umd.js +776 -374
- package/dist/adata-ui.umd.js.map +1 -1
- package/dist/adata-ui.umd.min.js +2 -2
- package/dist/adata-ui.umd.min.js.map +1 -1
- package/dist/img/arrow-down.72dc66a4.svg +3 -0
- package/dist/img/arrow-up.95ee7d72.svg +3 -0
- package/dist/img/dollor.7d00f847.svg +54 -0
- package/dist/img/euro.1362dfb6.svg +15 -0
- package/dist/img/ruble.c27b58e5.svg +12 -0
- package/package.json +1 -1
- package/src/App.vue +1 -1
- package/src/assets/icons/arrow-down.svg +3 -0
- package/src/assets/icons/arrow-up.svg +3 -0
- package/src/assets/icons/dollor.svg +54 -0
- package/src/assets/icons/euro.svg +15 -0
- package/src/assets/icons/ruble.svg +12 -0
- package/src/components/Checkbox/ACheckbox.vue +114 -0
- package/src/components/Checkbox/Checkbox.stories.js +15 -0
- package/src/components/Header/Header.vue +362 -130
- package/src/components/Header/InfoHeader.vue +74 -166
- package/src/components/Table/ATable.vue +117 -0
- package/src/components/Table/Table.stories.js +15 -0
- package/src/components/index.js +4 -0
- package/src/configs/profileDropDown.js +7 -0
|
@@ -1,89 +1,180 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
2
|
+
<header :class="{ sticky: isSticky }">
|
|
3
|
+
<InfoHeader
|
|
4
|
+
:weather="weather"
|
|
5
|
+
:currencies="currencies"
|
|
6
|
+
:system-message="systemMessage"
|
|
7
|
+
:requestCount="requestCount"
|
|
8
|
+
:daysRemaining="daysRemaining"
|
|
9
|
+
:is-open-notification="isOpenNotification"
|
|
10
|
+
:is-authenticated="isAuthenticated"
|
|
11
|
+
@closeNotification="closeNotification"
|
|
12
|
+
/>
|
|
13
|
+
<div class="header" :class="{ bordered: isBordered }">
|
|
14
|
+
<div class="container">
|
|
15
|
+
<div class="header__left">
|
|
16
|
+
<a class="logo" :href="main[mode]">
|
|
17
|
+
<svg
|
|
18
|
+
class="adata-logo"
|
|
19
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
20
|
+
viewBox="0 0 166 48"
|
|
21
|
+
>
|
|
22
|
+
<path
|
|
23
|
+
d="M62.926 38.22v-28h10.316c10.342 0 15.511 4.55 15.508 13.652 0 4.36-1.41 7.843-4.232 10.448-2.822 2.605-6.58 3.907-11.276 3.904l-10.316-.004zm6.56-22.868v17.752h3.248c2.839 0 5.069-.82 6.69-2.46 1.622-1.64 2.43-3.873 2.424-6.7 0-2.667-.8-4.767-2.403-6.3-1.602-1.533-3.853-2.297-6.752-2.292h-3.206zM118.5 38.22h-7.131l-2.079-6.228H98.958l-2.079 6.228h-7.093l10.598-28h7.775l10.341 28zm-10.723-11.072l-3.127-9.416a11.94 11.94 0 01-.486-2.516h-.162c-.07.83-.24 1.649-.508 2.44l-3.168 9.492h7.451zm31.833-11.796h-8.316V38.22h-6.557V15.352h-8.274v-5.136h23.147v5.136zM166 38.22h-7.143l-2.079-6.228h-10.349l-2.05 6.228h-7.106l10.598-28h7.776l10.353 28zm-10.719-11.072l-3.127-9.416a11.94 11.94 0 01-.486-2.516h-.163c-.069.83-.239 1.649-.507 2.44l-3.168 9.492h7.451zM24.553 15.252h-.163c-.069.83-.24 1.649-.507 2.44L20.715 27.2h7.45l-3.126-9.412a12.02 12.02 0 01-.486-2.536z"
|
|
24
|
+
></path>
|
|
25
|
+
<path
|
|
26
|
+
d="M44.905 0H4.99a5.091 5.091 0 00-3.528 1.406A4.71 4.71 0 000 4.8v38.4a4.71 4.71 0 001.461 3.394A5.091 5.091 0 004.99 48h39.916a5.091 5.091 0 003.528-1.406 4.71 4.71 0 001.462-3.394V4.8a4.71 4.71 0 00-1.462-3.394A5.091 5.091 0 0044.905 0zM31.737 38.26l-2.079-6.232H19.305l-2.05 6.232h-7.097l10.598-28h7.776l10.353 28h-7.148z"
|
|
27
|
+
></path>
|
|
28
|
+
</svg>
|
|
29
|
+
</a>
|
|
30
|
+
<div class="menu" v-if="headerItems.length > 0">
|
|
31
|
+
<a
|
|
32
|
+
v-for="(item, index) in headerItems"
|
|
19
33
|
:key="index"
|
|
20
34
|
class="menu__wrapper menu__items"
|
|
21
|
-
:class="{active: item.key === activeTabKey}"
|
|
35
|
+
:class="{ active: item.key === activeTabKey }"
|
|
22
36
|
:href="item[mode]"
|
|
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
|
-
|
|
37
|
+
>
|
|
38
|
+
{{ item.name }}
|
|
39
|
+
</a>
|
|
40
|
+
</div>
|
|
41
|
+
</div>
|
|
42
|
+
<div class="header__right">
|
|
43
|
+
<slot name="chooseCountry"></slot>
|
|
44
|
+
<Profile
|
|
45
|
+
:profileDropDown="profileDropDown"
|
|
46
|
+
:mode="mode"
|
|
47
|
+
:isAuthenticated="isAuthenticated"
|
|
48
|
+
:email="email"
|
|
49
|
+
:loginUrl="loginUrl"
|
|
50
|
+
:activeTabKey="activeTabKey"
|
|
51
|
+
@showBalanceModal="
|
|
52
|
+
(val) => {
|
|
53
|
+
$emit('showBalanceModal', val);
|
|
54
|
+
}
|
|
55
|
+
"
|
|
56
|
+
@setShowModal="
|
|
57
|
+
(val) => {
|
|
58
|
+
$emit('setShowModal', val);
|
|
59
|
+
}
|
|
60
|
+
"
|
|
61
|
+
@logout="$emit('logout')"
|
|
62
|
+
@setIsReplenishModal="
|
|
63
|
+
(val) => {
|
|
64
|
+
$emit('setIsReplenishModal', val);
|
|
65
|
+
}
|
|
66
|
+
"
|
|
67
|
+
/>
|
|
68
|
+
<div class="menu_mobile--switcher" @click="changeValue">
|
|
69
|
+
<!-- icon_hamburger -->
|
|
70
|
+
<svg
|
|
71
|
+
width="24"
|
|
72
|
+
height="24"
|
|
73
|
+
fill="none"
|
|
74
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
75
|
+
viewBox="0 0 24 24"
|
|
76
|
+
>
|
|
77
|
+
<path
|
|
78
|
+
fill-rule="evenodd"
|
|
79
|
+
clip-rule="evenodd"
|
|
80
|
+
d="M2 4h20v2H2V4zm0 14h20v2H2v-2zm0-7h20v2H2v-2z"
|
|
81
|
+
fill="#2C3E50"
|
|
82
|
+
></path>
|
|
83
|
+
</svg>
|
|
84
|
+
</div>
|
|
85
|
+
</div>
|
|
86
|
+
</div>
|
|
87
|
+
<MobileToggle v-slot="{ animationClass }">
|
|
88
|
+
<div
|
|
89
|
+
class="menu_mobile"
|
|
90
|
+
:class="animationClass"
|
|
91
|
+
v-show="headerItems.length > 0 && isOpen"
|
|
92
|
+
>
|
|
93
|
+
<div class="menu-wrapper">
|
|
94
|
+
<div @click.stop="changeValue" class="mobile-table-head">
|
|
95
|
+
<!-- close_hamburger -->
|
|
96
|
+
<svg
|
|
97
|
+
width="18"
|
|
98
|
+
height="18"
|
|
99
|
+
fill="none"
|
|
100
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
101
|
+
viewBox="0 0 24 24"
|
|
102
|
+
>
|
|
103
|
+
<path
|
|
104
|
+
fill-rule="evenodd"
|
|
105
|
+
clip-rule="evenodd"
|
|
106
|
+
d="M4.414 18.142L18.556 4l1.415 1.414L5.828 19.556l-1.414-1.414z"
|
|
107
|
+
fill="#2C3E50"
|
|
108
|
+
></path>
|
|
109
|
+
<path
|
|
110
|
+
fill-rule="evenodd"
|
|
111
|
+
clip-rule="evenodd"
|
|
112
|
+
d="M5.414 4l14.142 14.142-1.414 1.414L4 5.414 5.414 4z"
|
|
113
|
+
fill="#2C3E50"
|
|
114
|
+
></path>
|
|
115
|
+
</svg>
|
|
116
|
+
</div>
|
|
117
|
+
<div class="menu__link">
|
|
118
|
+
<a
|
|
119
|
+
v-for="(item, index) in headerItems"
|
|
120
|
+
:key="index"
|
|
121
|
+
class="menu_mobile-wrapper"
|
|
122
|
+
:class="{ 'active-burger-tab': item.key === activeTabKey }"
|
|
123
|
+
:href="item[mode]"
|
|
124
|
+
>
|
|
125
|
+
{{ item.name }}
|
|
126
|
+
</a>
|
|
127
|
+
</div>
|
|
128
|
+
</div>
|
|
129
|
+
<div class="menu-mobile__info">
|
|
130
|
+
<div class="menu-mobile__info-header">
|
|
131
|
+
<span>Валюта</span>
|
|
132
|
+
<span>Покупка</span>
|
|
133
|
+
<span>Продажа</span>
|
|
134
|
+
</div>
|
|
135
|
+
<div class="menu-mobile__info-body">
|
|
136
|
+
<div v-for="(currency, index) in currencies" :key="index" class="menu-mobile__info-row">
|
|
137
|
+
<div class="menu-mobile__info-column">
|
|
138
|
+
<img v-if="currency.currency === 'USD'" src="@/assets/icons/dollor.svg" alt=""/>
|
|
139
|
+
<img v-if="currency.currency === 'EUR'" src="@/assets/icons/euro.svg" alt=""/>
|
|
140
|
+
<img v-if="currency.currency === 'RUB'" src="@/assets/icons/ruble.svg" alt=""/>
|
|
141
|
+
<span>{{ currency.currency }}</span>
|
|
142
|
+
</div>
|
|
143
|
+
<div class="menu-mobile__info-column">
|
|
144
|
+
<span>{{ currency.buy }}</span>
|
|
145
|
+
<img v-if="currency.buy_state === 'DOWN'" src="@/assets/icons/arrow-down.svg" alt=""/>
|
|
146
|
+
<img v-else src="@/assets/icons/arrow-up.svg" alt=""/>
|
|
147
|
+
</div>
|
|
148
|
+
<div class="menu-mobile__info-column">
|
|
149
|
+
<span>{{ currency.sell }}</span>
|
|
150
|
+
<img v-if="currency.sell_state === 'DOWN'" src="@/assets/icons/arrow-down.svg" alt=""/>
|
|
151
|
+
<img v-else src="@/assets/icons/arrow-up.svg" alt=""/>
|
|
152
|
+
</div>
|
|
153
|
+
</div>
|
|
154
|
+
</div>
|
|
155
|
+
<div class="menu-mobile__info-footer">
|
|
156
|
+
<div class="menu-mobile__info-footer-item">
|
|
157
|
+
<span class="menu-mobile__info-footer-title">Cуточный лимит запросов:</span>
|
|
158
|
+
<span class="menu-mobile__info-footer-circle">{{ requestCount }}</span>
|
|
159
|
+
</div>
|
|
160
|
+
<div class="menu-mobile__info-footer-item">
|
|
161
|
+
<span class="menu-mobile__info-footer-title">Остаток дней:</span>
|
|
162
|
+
<span class="menu-mobile__info-footer-circle">{{ daysRemaining }}</span>
|
|
163
|
+
</div>
|
|
164
|
+
</div>
|
|
165
|
+
</div>
|
|
166
|
+
</div>
|
|
167
|
+
</MobileToggle>
|
|
168
|
+
</div>
|
|
169
|
+
</header>
|
|
79
170
|
</template>
|
|
80
171
|
|
|
81
172
|
<script>
|
|
82
|
-
import { profileDropDown } from "../../configs/profileDropDown"
|
|
173
|
+
import { profileDropDown } from "../../configs/profileDropDown";
|
|
83
174
|
|
|
84
175
|
import Profile from "./Profile";
|
|
85
176
|
import MobileToggle from "../transitions/VerticalMobileToggle";
|
|
86
|
-
import InfoHeader from "
|
|
177
|
+
import InfoHeader from "./InfoHeader";
|
|
87
178
|
|
|
88
179
|
export default {
|
|
89
180
|
components: {
|
|
@@ -96,123 +187,196 @@ export default {
|
|
|
96
187
|
type: String,
|
|
97
188
|
required: true,
|
|
98
189
|
validator: function (value) {
|
|
99
|
-
return [
|
|
100
|
-
}
|
|
190
|
+
return ["prod", "dev", "staging"].indexOf(value) !== -1;
|
|
191
|
+
},
|
|
101
192
|
},
|
|
102
193
|
isAuthenticated: {
|
|
103
194
|
type: Boolean,
|
|
104
|
-
default: false
|
|
195
|
+
default: false,
|
|
105
196
|
},
|
|
106
197
|
isBordered: {
|
|
107
198
|
type: Boolean,
|
|
108
|
-
default: false
|
|
199
|
+
default: false,
|
|
109
200
|
},
|
|
110
201
|
isSticky: {
|
|
111
202
|
type: Boolean,
|
|
112
|
-
default: false
|
|
203
|
+
default: false,
|
|
113
204
|
},
|
|
114
205
|
requestCount: {
|
|
115
206
|
type: [String, Number],
|
|
116
|
-
default: null
|
|
207
|
+
default: null,
|
|
117
208
|
},
|
|
118
209
|
daysRemaining: {
|
|
119
210
|
type: [String, Number],
|
|
120
|
-
default: null
|
|
211
|
+
default: null,
|
|
121
212
|
},
|
|
122
213
|
email: {
|
|
123
214
|
type: String,
|
|
124
|
-
default: ""
|
|
215
|
+
default: "",
|
|
125
216
|
},
|
|
126
217
|
loginUrl: {
|
|
127
218
|
type: String,
|
|
128
219
|
default: "",
|
|
129
|
-
required: true
|
|
220
|
+
required: true,
|
|
130
221
|
},
|
|
131
222
|
activeTabKey: {
|
|
132
223
|
type: String,
|
|
133
224
|
default: "",
|
|
134
|
-
required: true
|
|
225
|
+
required: true,
|
|
135
226
|
},
|
|
136
227
|
balance: {
|
|
137
228
|
type: Number,
|
|
138
|
-
default: 0
|
|
139
|
-
}
|
|
229
|
+
default: 0,
|
|
230
|
+
},
|
|
140
231
|
},
|
|
141
232
|
data() {
|
|
142
233
|
return {
|
|
143
234
|
profileDropDown,
|
|
144
235
|
main: {
|
|
145
|
-
dev:
|
|
146
|
-
prod:
|
|
147
|
-
staging:
|
|
236
|
+
dev: "https://adtdev.kz",
|
|
237
|
+
prod: "https://adata.kz",
|
|
238
|
+
staging: "https://adada.kz",
|
|
148
239
|
},
|
|
149
|
-
|
|
240
|
+
headerItems: [
|
|
150
241
|
{
|
|
151
242
|
id: 1,
|
|
152
243
|
name: "Контрагенты",
|
|
153
|
-
dev:
|
|
154
|
-
prod:
|
|
155
|
-
staging:
|
|
156
|
-
key:
|
|
244
|
+
dev: "https://pk.adtdev.kz",
|
|
245
|
+
prod: "https://pk.adata.kz",
|
|
246
|
+
staging: "https://pk.adada.kz",
|
|
247
|
+
key: "counterparty",
|
|
157
248
|
},
|
|
158
249
|
{
|
|
159
250
|
id: 2,
|
|
160
251
|
name: "Тендеры",
|
|
161
|
-
dev:
|
|
162
|
-
prod:
|
|
163
|
-
staging:
|
|
164
|
-
key:
|
|
252
|
+
dev: "https://tender.adtdev.kz",
|
|
253
|
+
prod: "https://tender.adata.kz",
|
|
254
|
+
staging: "https://tender.adada.kz",
|
|
255
|
+
key: "tenders",
|
|
165
256
|
},
|
|
166
257
|
{
|
|
167
258
|
id: 3,
|
|
168
259
|
name: "Работа",
|
|
169
|
-
dev:
|
|
170
|
-
prod:
|
|
171
|
-
staging:
|
|
172
|
-
key:
|
|
260
|
+
dev: "https://work.adtdev.kz",
|
|
261
|
+
prod: "https://work.adata.kz",
|
|
262
|
+
staging: "https://work.adada.kz",
|
|
263
|
+
key: "work",
|
|
173
264
|
},
|
|
174
265
|
{
|
|
175
266
|
id: 4,
|
|
176
267
|
name: "Штрафы",
|
|
177
|
-
dev:
|
|
178
|
-
prod:
|
|
179
|
-
staging:
|
|
180
|
-
key:
|
|
268
|
+
dev: "https://avto.adtdev.kz",
|
|
269
|
+
prod: "https://avto.adata.kz",
|
|
270
|
+
staging: "https://avto.adada.kz",
|
|
271
|
+
key: "fines",
|
|
181
272
|
},
|
|
182
273
|
{
|
|
183
274
|
id: 5,
|
|
184
275
|
name: "Маркетинг",
|
|
185
|
-
dev:
|
|
186
|
-
prod:
|
|
187
|
-
staging:
|
|
188
|
-
key:
|
|
189
|
-
}
|
|
276
|
+
dev: "https://marketing.adtdev.kz",
|
|
277
|
+
prod: "https://marketing.adata.kz",
|
|
278
|
+
staging: "https://marketing.adada.kz",
|
|
279
|
+
key: "marketing",
|
|
280
|
+
},
|
|
190
281
|
],
|
|
191
|
-
isOpen: false
|
|
282
|
+
isOpen: false,
|
|
283
|
+
weather: null,
|
|
284
|
+
currencies: null,
|
|
285
|
+
systemMessage: null,
|
|
286
|
+
timer: null,
|
|
287
|
+
isOpenNotification: false,
|
|
192
288
|
};
|
|
193
289
|
},
|
|
290
|
+
|
|
291
|
+
created() {
|
|
292
|
+
this.fetchCurrencies();
|
|
293
|
+
this.fetchWeather()
|
|
294
|
+
},
|
|
194
295
|
mounted() {
|
|
195
296
|
this.setBalance(this.balance);
|
|
297
|
+
this.timer = setTimeout(this.fetchNotification, 3000);
|
|
298
|
+
},
|
|
299
|
+
watch: {
|
|
300
|
+
balance(newBalance) {
|
|
301
|
+
this.setBalance(newBalance);
|
|
302
|
+
},
|
|
303
|
+
isOpenNotification() {
|
|
304
|
+
if(!this.isOpenNotification) {
|
|
305
|
+
clearTimeout(this.timer);
|
|
306
|
+
}
|
|
307
|
+
}
|
|
196
308
|
},
|
|
197
309
|
methods: {
|
|
310
|
+
async fetchNotification() {
|
|
311
|
+
try {
|
|
312
|
+
const response = await fetch('https://users.adtdev.kz/api/v1/system-messages/active-list/?module_name=counterparty');
|
|
313
|
+
const { data } = await response.json();
|
|
314
|
+
|
|
315
|
+
if (data.details.length) {
|
|
316
|
+
this.systemMessage = data.details[0].message;
|
|
317
|
+
this.isOpenNotification = true;
|
|
318
|
+
}
|
|
319
|
+
|
|
320
|
+
} catch(e) {
|
|
321
|
+
console.log(e.message)
|
|
322
|
+
}
|
|
323
|
+
},
|
|
324
|
+
async fetchCurrencies() {
|
|
325
|
+
try {
|
|
326
|
+
const response = await fetch('https://users.adata.kz/api/v1/information/currency');
|
|
327
|
+
const { data } = await response.json();
|
|
328
|
+
|
|
329
|
+
if(data.currencies) {
|
|
330
|
+
this.currencies = data.currencies;
|
|
331
|
+
}
|
|
332
|
+
|
|
333
|
+
} catch(e) {
|
|
334
|
+
console.log(e.message)
|
|
335
|
+
}
|
|
336
|
+
},
|
|
337
|
+
async fetchWeather() {
|
|
338
|
+
try {
|
|
339
|
+
const response = await fetch('https://users.adata.kz/api/v1/information/weather');
|
|
340
|
+
const { data } = await response.json();
|
|
341
|
+
|
|
342
|
+
if(data.cities) {
|
|
343
|
+
this.weather = data.cities;
|
|
344
|
+
}
|
|
345
|
+
|
|
346
|
+
} catch(e) {
|
|
347
|
+
console.log(e.message)
|
|
348
|
+
}
|
|
349
|
+
},
|
|
350
|
+
closeNotification(option) {
|
|
351
|
+
this.isOpenNotification = !option
|
|
352
|
+
},
|
|
198
353
|
changeValue() {
|
|
199
|
-
this.isOpen = !this.isOpen
|
|
200
|
-
this.$emit(
|
|
354
|
+
this.isOpen = !this.isOpen;
|
|
355
|
+
this.$emit("menuOpen", this.isOpen);
|
|
201
356
|
},
|
|
202
357
|
setBalance(balance) {
|
|
203
358
|
if (balance !== 0) {
|
|
204
|
-
this.profileDropDown[2].name =
|
|
359
|
+
this.profileDropDown[2].name =
|
|
360
|
+
"Текущий баланс: " + this.thousandSeparator(balance) + " ₸";
|
|
205
361
|
}
|
|
206
362
|
},
|
|
207
363
|
thousandSeparator(val) {
|
|
208
|
-
return val ?
|
|
364
|
+
return val ? val.toString().replace(/\B(?=(\d{3})+(?!\d))/g, " ") : "";
|
|
365
|
+
},
|
|
366
|
+
defineIconState(name) {
|
|
367
|
+
return name === "DOWN" ? "@/assets/icons/arrow-down.svg" : "@/assets/icons/arrow-up.svg";
|
|
368
|
+
},
|
|
369
|
+
defineIconEntity(name) {
|
|
370
|
+
switch (name) {
|
|
371
|
+
case 'USD':
|
|
372
|
+
return "@/assets/icons/dollor.svg";
|
|
373
|
+
case 'EUR':
|
|
374
|
+
return "@/assets/icons/euro.svg";
|
|
375
|
+
case 'RUB':
|
|
376
|
+
return "@/assets/icons/ruble.svg";
|
|
377
|
+
}
|
|
209
378
|
},
|
|
210
379
|
},
|
|
211
|
-
watch: {
|
|
212
|
-
balance(newBalance) {
|
|
213
|
-
this.setBalance(newBalance);
|
|
214
|
-
}
|
|
215
|
-
}
|
|
216
380
|
};
|
|
217
381
|
</script>
|
|
218
382
|
|
|
@@ -237,12 +401,12 @@ export default {
|
|
|
237
401
|
display: flex;
|
|
238
402
|
align-items: center;
|
|
239
403
|
@media (max-width: 1025px) {
|
|
240
|
-
border-bottom: 1px solid #
|
|
404
|
+
border-bottom: 1px solid #2c3e5026;
|
|
241
405
|
height: 40px;
|
|
242
406
|
}
|
|
243
407
|
|
|
244
408
|
&.bordered {
|
|
245
|
-
border-bottom: 1px solid #
|
|
409
|
+
border-bottom: 1px solid #2c3e5026;
|
|
246
410
|
}
|
|
247
411
|
|
|
248
412
|
& > .container {
|
|
@@ -301,7 +465,7 @@ export default {
|
|
|
301
465
|
}
|
|
302
466
|
|
|
303
467
|
&:hover {
|
|
304
|
-
color: #
|
|
468
|
+
color: #9da3ac;
|
|
305
469
|
cursor: pointer;
|
|
306
470
|
}
|
|
307
471
|
}
|
|
@@ -316,7 +480,7 @@ export default {
|
|
|
316
480
|
height: 26px;
|
|
317
481
|
display: block;
|
|
318
482
|
fill: #2c3e50;
|
|
319
|
-
@media(max-width: 1025px) {
|
|
483
|
+
@media (max-width: 1025px) {
|
|
320
484
|
width: 77px;
|
|
321
485
|
height: 24px;
|
|
322
486
|
}
|
|
@@ -336,7 +500,9 @@ export default {
|
|
|
336
500
|
}
|
|
337
501
|
|
|
338
502
|
@media (max-width: 1025px) {
|
|
339
|
-
display:
|
|
503
|
+
display: flex;
|
|
504
|
+
flex-direction: column;
|
|
505
|
+
justify-content: space-between;
|
|
340
506
|
.mobile-table-head {
|
|
341
507
|
padding: 11px 16px;
|
|
342
508
|
display: flex;
|
|
@@ -344,7 +510,7 @@ export default {
|
|
|
344
510
|
background: #2c3e500d;
|
|
345
511
|
}
|
|
346
512
|
&-wrapper {
|
|
347
|
-
border-top: 1px solid #
|
|
513
|
+
border-top: 1px solid #9da3ac4c;
|
|
348
514
|
padding: 14px 16px;
|
|
349
515
|
font-weight: 600;
|
|
350
516
|
font-size: 16px;
|
|
@@ -353,7 +519,7 @@ export default {
|
|
|
353
519
|
display: block;
|
|
354
520
|
|
|
355
521
|
&:last-child {
|
|
356
|
-
border-bottom: 1px solid #
|
|
522
|
+
border-bottom: 1px solid #9da3ac4c;
|
|
357
523
|
}
|
|
358
524
|
|
|
359
525
|
&.active-burger-tab {
|
|
@@ -367,6 +533,72 @@ export default {
|
|
|
367
533
|
}
|
|
368
534
|
}
|
|
369
535
|
}
|
|
536
|
+
|
|
537
|
+
.menu-mobile__info {
|
|
538
|
+
&-header {
|
|
539
|
+
background: rgba(189, 199, 206, 0.2);
|
|
540
|
+
padding: 4px 16px;
|
|
541
|
+
display: flex;
|
|
542
|
+
justify-content: space-between;
|
|
543
|
+
align-items: center;
|
|
544
|
+
span {
|
|
545
|
+
font-weight: 500;
|
|
546
|
+
font-size: 12px;
|
|
547
|
+
line-height: 20px;
|
|
548
|
+
color: #666C72;
|
|
549
|
+
}
|
|
550
|
+
}
|
|
551
|
+
&-body {
|
|
552
|
+
padding: 8px 16px 16px;
|
|
553
|
+
display: flex;
|
|
554
|
+
flex-direction: column;
|
|
555
|
+
justify-content: space-between;
|
|
556
|
+
gap: 12px;
|
|
557
|
+
}
|
|
558
|
+
&-row {
|
|
559
|
+
display: flex;
|
|
560
|
+
justify-content: space-between;
|
|
561
|
+
align-items: center;
|
|
562
|
+
}
|
|
563
|
+
&-column {
|
|
564
|
+
display: flex;
|
|
565
|
+
align-items: center;
|
|
566
|
+
gap: 8px;
|
|
567
|
+
span {
|
|
568
|
+
font-weight: 500;
|
|
569
|
+
font-size: 14px;
|
|
570
|
+
line-height: 20px;
|
|
571
|
+
color: #2C3E50;
|
|
572
|
+
}
|
|
573
|
+
}
|
|
574
|
+
&-footer {
|
|
575
|
+
background: rgba(189, 199, 206, 0.2);
|
|
576
|
+
padding: 8px 16px;
|
|
577
|
+
display: flex;
|
|
578
|
+
flex-direction: column;
|
|
579
|
+
gap: 10px;
|
|
580
|
+
&-item {
|
|
581
|
+
display: flex;
|
|
582
|
+
justify-content: space-between;
|
|
583
|
+
align-items: center;
|
|
584
|
+
}
|
|
585
|
+
&-title {
|
|
586
|
+
font-weight: 500;
|
|
587
|
+
font-size: 14px;
|
|
588
|
+
line-height: 20px;
|
|
589
|
+
color: #2C3E50;
|
|
590
|
+
}
|
|
591
|
+
&-circle {
|
|
592
|
+
color: #ffffff;
|
|
593
|
+
padding: 4px 12px;
|
|
594
|
+
background: #007AFF;
|
|
595
|
+
border-radius: 100px;
|
|
596
|
+
font-weight: 500;
|
|
597
|
+
font-size: 14px;
|
|
598
|
+
line-height: 20px;
|
|
599
|
+
}
|
|
600
|
+
}
|
|
601
|
+
}
|
|
370
602
|
}
|
|
371
603
|
|
|
372
604
|
</style>
|