Update main sorting.

This commit is contained in:
Kasen IO 2020-05-20 18:32:59 -04:00
parent 203095a999
commit 42b82884b3
3 changed files with 154 additions and 125 deletions

View file

@ -25,11 +25,42 @@
<v-spacer></v-spacer> <v-spacer></v-spacer>
<v-btn medium color="primary" fab @click="sortTopInventory('top')"> <!-- <v-btn medium color="primary" fab @click="sortTopInventory('az')">
<v-icon> <v-icon>
mdi-ab-testing mdi-ab-testing
</v-icon> </v-icon>
</v-btn> </v-btn> -->
<v-menu bottom left>
<template v-slot:activator="{ on }">
<v-btn
large
color="primary"
v-on="on"
>
<h4>Sort</h4>
</v-btn>
</template>
<v-list color="grey darken-3">
<v-list-item
@click="sortTopInventory('az')"
>
<v-list-item-title>A-Z</v-list-item-title>
<v-list-item-action>
<v-icon large>mdi-sort-alphabetical-ascending</v-icon>
</v-list-item-action>
</v-list-item>
<v-list-item
@click="sortTopInventory('za')"
>
<v-list-item-title>Z-A</v-list-item-title>
<v-list-item-action>
<v-icon large>mdi-sort-alphabetical-descending</v-icon>
</v-list-item-action>
</v-list-item>
</v-list>
</v-menu>
</v-app-bar> </v-app-bar>
@ -668,7 +699,7 @@ export default {
], ],
}, },
}, },
appVersion: "1.3", appVersion: "2.0",
darkTheme: true, darkTheme: true,
drawer: false, drawer: false,
disabledProp: true, disabledProp: true,
@ -708,7 +739,7 @@ export default {
"name": name, "name": name,
"folder": folder, "folder": folder,
"url": url, "url": url,
"uuid": uuid "uuid": uuidToUse
}); });
if (folder !== null && folder !== "No Folder") { if (folder !== null && folder !== "No Folder") {
@ -772,10 +803,7 @@ export default {
"uuid": this.createUUID() "uuid": this.createUUID()
}); });
this.$store.commit('mutate', { this.createFolderDialogStore.data.name = null;
property: 'createFolderDialog.data.name',
with: null
});
}, },
editFolder: function(uuid) { editFolder: function(uuid) {
var findFolder = this.searchForItem(uuid); var findFolder = this.searchForItem(uuid);
@ -806,20 +834,10 @@ export default {
this.pushToItems(itemType, name, folder, url, null); this.pushToItems(itemType, name, folder, url, null);
this.$store.commit('mutate', { this.addDialogStore.data.name = null;
property: 'addDialog.data.name', this.addDialogStore.data.folder = null;
with: null this.addDialogStore.data.url = null;
});
this.$store.commit('mutate', {
property: 'addDialog.data.folder',
with: null
});
this.$store.commit('mutate', {
property: 'addDialog.data.url',
with: null
});
}, },
detectFileType: function(url) { detectFileType: function(url) {
// Attempt the pure regex route... // Attempt the pure regex route...
@ -943,10 +961,8 @@ export default {
onDragChange: function(ev) { onDragChange: function(ev) {
console.info("Drag Update.", ev); console.info("Drag Update.", ev);
}, },
sortTopInventory: function(level) { sortTopInventory: function(order) {
if (level == "top") { this.$store.commit('sortTopInventory', { "sort": order });
this.$store.commit('sortTopInventory');
}
}, },
getFolderList: function(request) { getFolderList: function(request) {
var generateList; var generateList;

View file

@ -22,7 +22,9 @@
outlined outlined
> >
<div class="handle pa-2"> <div class="handle pa-2">
<v-icon color="orange darken-2">mdi-blur-linear</v-icon> <!-- <v-icon color="orange darken-2">mdi-blur-linear</v-icon> -->
<!-- <v-icon color="orange darken-2">mdi-package-variant</v-icon> -->
<v-icon color="orange darken-2">mdi-square-medium-outline</v-icon>
</div> </div>
<v-list-item-content <v-list-item-content
class="pb-1 pt-2 pl-4" class="pb-1 pt-2 pl-4"
@ -33,80 +35,80 @@
</v-list-item-content> </v-list-item-content>
<v-menu bottom left> <v-menu bottom left>
<template v-slot:activator="{ on }"> <template v-slot:activator="{ on }">
<!-- settings.displayDensity.size >= 1 --> <!-- settings.displayDensity.size >= 1 -->
<v-btn <v-btn
:style="{backgroundColor: (getIconColor(item.type)) }" :style="{backgroundColor: (getIconColor(item.type)) }"
v-show="settings.displayDensity.size >= 1" v-show="settings.displayDensity.size >= 1"
medium medium
fab fab
dark dark
v-on="on" v-on="on"
> >
<v-icon>{{getIcon(item.type)}}</v-icon> <v-icon>{{getIcon(item.type)}}</v-icon>
</v-btn> </v-btn>
<!-- settings.displayDensity.size < 1 --> <!-- settings.displayDensity.size < 1 -->
<v-btn <v-btn
:style="{backgroundColor: (getIconColor(item.type)) }" :style="{backgroundColor: (getIconColor(item.type)) }"
v-show="settings.displayDensity.size < 1" v-show="settings.displayDensity.size < 1"
small small
fab fab
dark dark
v-on="on" v-on="on"
> >
<v-icon>{{getIcon(item.type)}}</v-icon> <v-icon>{{getIcon(item.type)}}</v-icon>
</v-btn> </v-btn>
</template> </template>
<v-list color="grey darken-3"> <v-list color="grey darken-3">
<v-list-item <v-list-item
@click="useItem(item.type, item.url)" @click="useItem(item.type, item.url)"
> >
<v-list-item-title>Use</v-list-item-title> <v-list-item-title>Use</v-list-item-title>
<v-list-item-action> <v-list-item-action>
<v-icon>mdi-play</v-icon> <v-icon>mdi-play</v-icon>
</v-list-item-action> </v-list-item-action>
</v-list-item> </v-list-item>
<v-list-item <v-list-item
@click=" @click="
editDialogStore.show = true; editDialogStore.show = true;
editDialogStore.uuid = item.uuid; editDialogStore.uuid = item.uuid;
editDialogStore.data.type = item.type.toUpperCase(); editDialogStore.data.type = item.type.toUpperCase();
editDialogStore.data.folder = null; editDialogStore.data.folder = null;
editDialogStore.data.name = item.name; editDialogStore.data.name = item.name;
editDialogStore.data.url = item.url; editDialogStore.data.url = item.url;
" "
> >
<v-list-item-title>Edit</v-list-item-title> <v-list-item-title>Edit</v-list-item-title>
<v-list-item-action> <v-list-item-action>
<v-icon>mdi-pencil</v-icon> <v-icon>mdi-pencil</v-icon>
</v-list-item-action> </v-list-item-action>
</v-list-item> </v-list-item>
<v-list-item <v-list-item
@click=" @click="
shareDialogStore.show = true; shareDialogStore.show = true;
shareDialogStore.data.url = item.url; shareDialogStore.data.url = item.url;
shareDialogStore.data.uuid = item.uuid; shareDialogStore.data.uuid = item.uuid;
" "
> >
<v-list-item-title>Share</v-list-item-title> <v-list-item-title>Share</v-list-item-title>
<v-list-item-action> <v-list-item-action>
<v-icon>mdi-share</v-icon> <v-icon>mdi-share</v-icon>
</v-list-item-action> </v-list-item-action>
</v-list-item> </v-list-item>
<v-list-item <v-list-item
@click=" @click="
removeDialogStore.show = true; removeDialogStore.show = true;
removeDialogStore.uuid = item.uuid; removeDialogStore.uuid = item.uuid;
" "
color="red darken-1" color="red darken-1"
> >
<v-list-item-title>Remove</v-list-item-title> <v-list-item-title>Remove</v-list-item-title>
<v-list-item-action> <v-list-item-action>
<v-icon>mdi-minus</v-icon> <v-icon>mdi-minus</v-icon>
</v-list-item-action> </v-list-item-action>
</v-list-item> </v-list-item>
</v-list> </v-list>
</v-menu> </v-menu>
</v-list-item> </v-list-item>
@ -224,17 +226,6 @@ export default {
}); });
}, },
}, },
createFolderDialogStore: {
get() {
return this.$store.state.createFolderDialog;
},
set(value) {
this.$store.commit('mutate', {
property: 'createFolderDialog',
with: value
});
},
},
receiveDialogStore: { receiveDialogStore: {
get() { get() {
return this.$store.state.receiveDialog; return this.$store.state.receiveDialog;

View file

@ -296,20 +296,42 @@ export const store = new Vuex.Store({
state[payload.property] = payload.with; state[payload.property] = payload.with;
console.info("Payload:", payload.property, "with:", payload.with, "state is now:", this.state); console.info("Payload:", payload.property, "with:", payload.with, "state is now:", this.state);
}, },
sortTopInventory (state) { sortTopInventory (state, payload) {
state.items.sort(function(a, b) { let { items } = state;
var nameA = a.name.toUpperCase(); // ignore upper and lowercase
var nameB = b.name.toUpperCase(); // ignore upper and lowercase if (payload.sort === "az") {
if (nameA < nameB) { state.items.sort(function(a, b) {
return -1; var nameA = a.name.toUpperCase(); // ignore upper and lowercase
} var nameB = b.name.toUpperCase(); // ignore upper and lowercase
if (nameA > nameB) { if (nameA < nameB) {
return 1; return -1;
} }
if (nameA > nameB) {
// names must be equal return 1;
return 0; }
});
// names must be equal
return 0;
});
}
if (payload.sort === "za") {
state.items.sort(function(a, b) {
var nameA = a.name.toUpperCase(); // ignore upper and lowercase
var nameB = b.name.toUpperCase(); // ignore upper and lowercase
if (nameA > nameB) {
return -1;
}
if (nameA < nameB) {
return 1;
}
// names must be equal
return 0;
});
}
Vue.set(state,'items', items);
}, },
pushToItems (state, payload) { pushToItems (state, payload) {
let { items } = state; let { items } = state;