/
Jumbotron.vue
111 lines (102 loc) · 3.08 KB
/
Jumbotron.vue
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
<template>
<div class="row">
<div class="jumbotron">
<div class="top">
<div id="acc" class="text-white"
@click="$router.push({name: 'Accounts'})"></div>
<input type="text"
class="text-center text-white account-name"
:value="account.name"
@blur="changeName">
<div class="burger dropdown-btn"
v-click-outside="burgerMenuClose">
<img src="/icons/menu-burger.svg" height="30"
@click="isDropdown = !isDropdown">
<ul v-show="isDropdown"
class="animated fadeIn faster dropdown dropdown-input text-black">
<li>
<a :href="exploreAddress(account.address)" target="_blanck">Account details</a>
</li>
<li @click="$router.push({name: 'Networks'})">
Change network
</li>
<li v-if="!account.hwType" @click="$router.push({name: 'Export', params: {type: 'key'}})">
Export PrivateKey
</li>
<li v-if="wallet.selectedAddress > 0" @click="removeAccount">
Remove account
</li>
<li @click="logOut">Log out</li>
</ul>
</div>
</div>
<div class="text-center text-white">
{{account.address | toAddress(addressFormat)}}
<img src="/icons/copy.svg" v-tooltip="'Copy'" class="pointer"
height="30" @click="copy(account.address)">
</div>
<div class="bottom text-center text-white">
{{account.balance | fromZil}}
<span class="currency">ZIL</span>
<br>
≈ {{account.balance | toConversion(conversionRate[currency])}}
<span class="currency">{{currency}}</span>
</div>
<div class="btns text-white">
<span @click="$router.push({name: 'Receive'})">
<img src="/icons/qr-code-white.svg" height="18">
Receive
</span>
<span @click="$router.push({name: 'Send'})">
<img src="/icons/send.svg" height="21">
Send
</span>
</div>
</div>
</div>
</template>
<script>
import { mapState } from 'vuex'
import Jazzicon from '../mixins/jazzicon'
import vClickOutside from 'v-click-outside'
import tooltip from '../directives/tooltip'
import clipboardMixin from '../mixins/clipboard'
import AccountListing from '../mixins/account-listing'
import explorer from '../mixins/explorer'
import toConversion from '../filters/to-conversion'
import fromZil from '../filters/from-zil'
export default {
name: 'Jumbotron',
components: { },
mixins: [
Jazzicon,
clipboardMixin,
AccountListing,
explorer
],
filters: { toConversion, fromZil },
directives: {
tooltip,
clickOutside: vClickOutside.directive
},
data() {
return {
isDropdown: false
};
},
computed: {
...mapState(['conversionRate']),
...mapState('Static', [
'currency'
])
},
mounted() {
this.jazziconMake(this.account.address, 'acc');
},
methods: {
burgerMenuClose() {
this.isDropdown = false;
}
}
}
</script>