Skip to content

Commit ee92f44

Browse files
committed
🔨
1 parent 469b72a commit ee92f44

File tree

7 files changed

+190
-95
lines changed

7 files changed

+190
-95
lines changed

‎src/FileManager.vue

Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -95,14 +95,7 @@ export default {
9595
/**
9696
* todo Keyboard event
9797
*/
98-
/*
99-
window.addEventListener('keyup', (event) => {
100-
event.preventDefault();
101-
event.stopPropagation();
102-
103-
EventBus.$emit('keyMonitor', event);
104-
});
105-
*/
98+
window.addEventListener('keyup', this.keyEvent);
10699
},
107100
destroyed() {
108101
// reset state
@@ -114,6 +107,8 @@ export default {
114107
// eject interceptors
115108
HTTP.interceptors.request.eject(this.interceptorIndex.request);
116109
HTTP.interceptors.response.eject(this.interceptorIndex.response);
110+
111+
window.removeEventListener('keyup', this.keyEvent);
117112
},
118113
computed: {
119114
...mapState('fm', {
@@ -124,6 +119,12 @@ export default {
124119
}),
125120
},
126121
methods: {
122+
keyEvent(e) {
123+
e.preventDefault();
124+
e.stopPropagation();
125+
126+
EventBus.$emit('keyMonitor', e);
127+
},
127128
/**
128129
* Add axios request interceptor
129130
*/
@@ -233,7 +234,7 @@ export default {
233234
</script>
234235

235236
<style lang="scss">
236-
@import "~plyr/src/sass/plyr.scss";
237+
@import "plyr/src/sass/plyr.scss";
237238
.fm {
238239
position: relative;
239240
height: 100%;

‎src/components/blocks/Navbar.vue

Lines changed: 154 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -3,112 +3,202 @@
33
<div class="row justify-content-between">
44
<div class="col-auto">
55
<div class="btn-group" role="group">
6-
<button type="button" class="btn btn-secondary"
6+
<v-btn type="button" class="btn btn-secondary"
77
v-bind:disabled="backDisabled"
88
v-bind:title="lang.btn.back"
9-
v-on:click="historyBack()">
10-
<i class="fas fa-step-backward"/>
11-
</button>
12-
<button type="button" class="btn btn-secondary"
9+
v-on:click="historyBack()"
10+
fab
11+
tile
12+
small
13+
color="primary"
14+
elevation="1"
15+
>
16+
<v-icon>mdi-arrow-left</v-icon>
17+
</v-btn>
18+
<v-btn type="button" class="btn btn-secondary"
1319
v-bind:disabled="forwardDisabled"
1420
v-bind:title="lang.btn.forward"
15-
v-on:click="historyForward()">
16-
<i class="fas fa-step-forward"/>
17-
</button>
18-
<button type="button" class="btn btn-secondary"
21+
v-on:click="historyForward()"
22+
fab
23+
tile
24+
small
25+
color="primary"
26+
elevation="1"
27+
>
28+
<v-icon>mdi-arrow-right</v-icon>
29+
</v-btn>
30+
<v-btn type="button" class="btn btn-secondary"
1931
v-on:click="refreshAll()"
20-
v-bind:title="lang.btn.refresh">
21-
<i class="fas fa-sync-alt"/>
22-
</button>
32+
v-bind:title="lang.btn.refresh"
33+
fab
34+
tile
35+
small
36+
color="primary"
37+
elevation="1"
38+
>
39+
<v-icon>mdi-refresh</v-icon>
40+
</v-btn>
2341
</div>
2442
<div class="btn-group" role="group">
25-
<button type="button" class="btn btn-secondary"
43+
<v-btn type="button" class="btn btn-secondary"
2644
v-on:click="showModal('NewFile')"
27-
v-bind:title="lang.btn.file">
28-
<i class="far fa-file"/>
29-
</button>
30-
<button type="button" class="btn btn-secondary"
45+
v-bind:title="lang.btn.file"
46+
fab
47+
tile
48+
small
49+
color="primary"
50+
elevation="1"
51+
>
52+
<v-icon>mdi-file-outline</v-icon>
53+
</v-btn>
54+
<v-btn type="button" class="btn btn-secondary"
3155
v-on:click="showModal('NewFolder')"
32-
v-bind:title="lang.btn.folder">
33-
<i class="far fa-folder"/>
34-
</button>
35-
<button type="button" class="btn btn-secondary"
56+
v-bind:title="lang.btn.folder"
57+
fab
58+
tile
59+
small
60+
color="primary"
61+
elevation="1"
62+
>
63+
<v-icon>mdi-folder-outline</v-icon>
64+
</v-btn>
65+
<v-btn type="button" class="btn btn-secondary"
3666
disabled
3767
v-if="uploading"
38-
v-bind:title="lang.btn.upload">
39-
<i class="fas fa-upload"/>
40-
</button>
41-
<button type="button" class="btn btn-secondary"
68+
v-bind:title="lang.btn.upload"
69+
fab
70+
tile
71+
small
72+
color="primary"
73+
elevation="1"
74+
>
75+
<v-icon>mdi-upload-outline</v-icon>
76+
</v-btn>
77+
<v-btn type="button" class="btn btn-secondary"
4278
v-else
4379
v-on:click="showModal('Upload')"
44-
v-bind:title="lang.btn.upload">
45-
<i class="fas fa-upload"/>
46-
</button>
47-
<button type="button" class="btn btn-secondary"
80+
v-bind:title="lang.btn.upload"
81+
fab
82+
tile
83+
small
84+
color="primary"
85+
elevation="1"
86+
>
87+
<v-icon>mdi-upload-outline</v-icon>
88+
</v-btn>
89+
<v-btn type="button" class="btn btn-secondary"
4890
v-bind:disabled="!isAnyItemSelected"
4991
v-on:click="showModal('Delete')"
50-
v-bind:title="lang.btn.delete">
51-
<i class="fas fa-trash-alt"/>
52-
</button>
92+
v-bind:title="lang.btn.delete"
93+
fab
94+
tile
95+
small
96+
color="primary"
97+
elevation="1"
98+
>
99+
<v-icon>mdi-delete-outline</v-icon>
100+
</v-btn>
53101
</div>
54102
<div class="btn-group" role="group">
55-
<button type="button" class="btn btn-secondary"
103+
<v-btn type="button" class="btn btn-secondary"
56104
v-bind:disabled="!isAnyItemSelected"
57105
v-bind:title="lang.btn.copy"
58-
v-on:click="toClipboard('copy')">
59-
<i class="fas fa-copy"/>
60-
</button>
61-
<button type="button" class="btn btn-secondary"
106+
v-on:click="toClipboard('copy')"
107+
fab
108+
tile
109+
small
110+
color="primary"
111+
elevation="1"
112+
>
113+
<v-icon>mdi-content-copy</v-icon>
114+
</v-btn>
115+
<v-btn type="button" class="btn btn-secondary"
62116
v-bind:disabled="!isAnyItemSelected"
63117
v-bind:title="lang.btn.cut"
64-
v-on:click="toClipboard('cut')">
65-
<i class="fas fa-cut"/>
66-
</button>
67-
<button type="button" class="btn btn-secondary"
118+
v-on:click="toClipboard('cut')"
119+
fab
120+
tile
121+
small
122+
color="primary"
123+
elevation="1"
124+
>
125+
<v-icon>mdi-content-cut</v-icon>
126+
</v-btn>
127+
<v-btn type="button" class="btn btn-secondary"
68128
v-bind:disabled="!clipboardType"
69129
v-bind:title="lang.btn.paste"
70-
v-on:click="paste">
71-
<i class="fas fa-paste"/>
72-
</button>
130+
v-on:click="paste"
131+
fab
132+
tile
133+
small
134+
color="primary"
135+
elevation="1"
136+
>
137+
<v-icon>mdi-content-paste</v-icon>
138+
</v-btn>
73139
</div>
74-
<div class="btn-group" role="group">
140+
<!-- <div class="btn-group" role="group">
75141
<button type="button" class="btn btn-secondary"
76142
v-bind:title="lang.btn.hidden"
77143
v-on:click="toggleHidden">
78144
<i class="fas" v-bind:class="[hiddenFiles ? 'fa-eye': 'fa-eye-slash']"/>
79145
</button>
80-
</div>
146+
</div> -->
81147
</div>
82148
<div class="col-auto text-right">
83149
<div class="btn-group" role="group">
84-
<button type="button" class="btn btn-secondary"
150+
<v-btn type="button" class="btn btn-secondary"
85151
v-bind:class="[viewType === 'table' ? 'active' : '']"
86152
v-on:click="selectView('table')"
87-
v-bind:title="lang.btn.table">
88-
<i class="fas fa-th-list"/>
89-
</button>
90-
<button role="button" class="btn btn-secondary"
153+
v-bind:title="lang.btn.table"
154+
fab
155+
tile
156+
small
157+
color="primary"
158+
elevation="1"
159+
>
160+
<v-icon>mdi-format-list-bulleted</v-icon>
161+
</v-btn>
162+
<v-btn role="button" class="btn btn-secondary"
91163
v-bind:class="[viewType === 'grid' ? 'active' : '']"
92164
v-on:click="selectView('grid')"
93-
v-bind:title="lang.btn.grid">
94-
<i class="fas fa-th"/>
95-
</button>
165+
v-bind:title="lang.btn.grid"
166+
fab
167+
tile
168+
small
169+
color="primary"
170+
elevation="1"
171+
>
172+
<v-icon>mdi-view-grid-outline</v-icon>
173+
</v-btn>
96174
</div>
97175
<div class="btn-group" role="group">
98-
<button type="button" class="btn btn-secondary"
176+
<v-btn type="button" class="btn btn-secondary"
99177
v-bind:title="lang.btn.fullScreen"
100178
v-bind:class="{ active: fullScreen }"
101-
v-on:click="screenToggle">
102-
<i class="fas fa-expand-arrows-alt"/>
103-
</button>
179+
v-on:click="screenToggle"
180+
fab
181+
tile
182+
small
183+
color="primary"
184+
elevation="1"
185+
>
186+
<v-icon>mdi-fullscreen</v-icon>
187+
</v-btn>
104188
</div>
105-
<div class="btn-group" role="group">
106-
<button type="button" class="btn btn-secondary"
189+
<!-- <div class="btn-group" role="group">
190+
<v-btn type="button" class="btn btn-secondary"
107191
v-bind:title="lang.btn.about"
108-
v-on:click="showModal('About')">
109-
<i class="fas fa-question"/>
110-
</button>
111-
</div>
192+
v-on:click="showModal('About')"
193+
fab
194+
tile
195+
small
196+
color="primary"
197+
elevation="1"
198+
>
199+
<v-icon>mdi-help-circle-outline</v-icon>
200+
</v-btn>
201+
</div> -->
112202
</div>
113203
</div>
114204
</div>

‎src/components/manager/Breadcrumb.vue

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
<template>
22
<div class="fm-breadcrumb">
33
<nav aria-label="breadcrumb">
4-
<ol class="breadcrumb"
4+
<ol class="breadcrumb" style="height: 32px; align-items: center;"
55
v-bind:class="[manager === activeManager ? 'active-manager' : 'bg-light']">
6-
<li class="breadcrumb-item" v-on:click="selectMainDirectory">
7-
<span class="badge badge-secondary">
8-
<i class="far fa-hdd"/>
6+
<li class="breadcrumb-item" style="display: inline-flex;" v-on:click="selectMainDirectory">
7+
<span class="badge">
8+
<v-icon small>mdi-server</v-icon>
99
</span>
1010
</li>
1111
<li class="breadcrumb-item text-truncate"

‎src/components/manager/DiskList.vue

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
<template>
2-
<div class="fm-disk-list">
2+
<div class="fm-disk-list" style="display:none;">
33
<ul class="list-inline">
44
<li class="list-inline-item" v-for="(disk, index) in disks" v-bind:key="index">
55
<span class="badge"
66
v-on:click="selectDisk(disk)"
7-
v-bind:class="[disk === selectedDisk ? 'badge-secondary' : 'badge-light']">
8-
<i class="fa-fw far fa-hdd"/> {{ disk }}
7+
v-bind:class="[disk === selectedDisk ? 'badge-secondary secondary' : 'badge-light']">
8+
<v-icon small color="white">mdi-server</v-icon> {{ disk }}
99
</span>
1010
</li>
1111
</ul>

‎src/components/modals/views/Clipboard.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111
<div class="d-flex justify-content-between">
1212
<div class="w-75 text-truncate">
1313
<span>
14-
<i class="far fa-hdd"/>{{ clipboard.disk }}
14+
<v-icon small>mdi-server</v-icon>{{ clipboard.disk }}
1515
</span>
1616
</div>
1717
<div class="text-right text-muted">

‎src/components/tree/Branch.vue

Lines changed: 16 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,24 @@
11
<template>
22
<ul class="list-unstyled fm-tree-branch">
33
<li v-for="(directory, index) in subDirectories" v-bind:key="index">
4-
<p class="unselectable"
4+
<p class="unselectable" style="align-items: center; display: flex;"
55
v-bind:class="{'selected': isDirectorySelected(directory.path)}"
66
v-on:click="selectDirectory(directory.path)">
7-
<i class="far"
8-
v-if="directory.props.hasSubdirectories"
9-
v-on:click.stop="showSubdirectories(
10-
directory.path,
11-
directory.props.showSubdirectories
12-
)"
13-
v-bind:class="[arrowState(index)
14-
? 'fa-minus-square'
15-
: 'fa-plus-square'
16-
]"/>
17-
<i class="fas fa-minus fa-xs" v-else/>
7+
<v-icon
8+
style="margin-right: 6px;"
9+
v-if="directory.props.hasSubdirectories"
10+
v-on:click.stop="showSubdirectories(directory.path, directory.props.showSubdirectories)">
11+
<template v-if="arrowState(index)">
12+
mdi-minus-box-outline
13+
</template>
14+
<template v-else>
15+
mdi-plus-box-outline
16+
</template>
17+
</v-icon>
18+
<v-icon style="margin-right: 6px;" v-else>
19+
mdi-minus
20+
</v-icon>
21+
1822
{{ directory.basename }}
1923
</p>
2024

0 commit comments

Comments
 (0)