This commit is contained in:
2020-02-19 19:56:26 +00:00
parent 7ff226fe69
commit 88636114d3

View File

@@ -77,7 +77,7 @@
</v-col> </v-col>
</v-row> </v-row>
</v-col> </v-col>
<template v-for="item in obj"> <template v-for="(item, index) in obj">
<v-col :key="item.key" cols="12" sm="6" lg="4" xl="3" px-2> <v-col :key="item.key" cols="12" sm="6" lg="4" xl="3" px-2>
<v-card> <v-card>
<v-card-title> <v-card-title>
@@ -85,6 +85,20 @@
</v-card-title> </v-card-title>
<v-card-text> <v-card-text>
<div class="d-flex justify-space-between">
<v-btn text large @click="move('start', index)"
><v-icon light Large>fa-step-backward</v-icon></v-btn
>
<v-btn text Large @click="move('left', index)"
><v-icon Large>fa-backward</v-icon></v-btn
>
<v-btn text Large @click="move('right', index)"
><v-icon Large>fa-forward</v-icon></v-btn
>
<v-btn text Large @click="move('end', index)"
><v-icon Large>fa-step-forward</v-icon></v-btn
>
</div>
<v-switch <v-switch
v-model="item.include" v-model="item.include"
:label="lt('Include')" :label="lt('Include')"
@@ -92,36 +106,24 @@
:disabled="item.sort != null || item.filter != null" :disabled="item.sort != null || item.filter != null"
@change="includeChanged(item)" @change="includeChanged(item)"
></v-switch> ></v-switch>
<div class="d-flex justify-space-between">
<v-btn text large
><v-icon light Large>fa-step-backward</v-icon></v-btn
>
<v-btn text Large
><v-icon Large>fa-backward</v-icon></v-btn
>
<v-btn text Large
><v-icon Large>fa-forward</v-icon></v-btn
>
<v-btn text Large
><v-icon Large>fa-step-forward</v-icon></v-btn
>
</div>
<template v-if="item.isSortable"> <template v-if="item.isSortable">
<div @click="toggleSort(item)" class="pl-2 pt-2"> <div @click="toggleSort(item)" class="pl-2 pt-2">
<v-icon v-if="item.sort == null" large>fa-sort</v-icon> <v-btn v-if="item.sort == null" text Large>
<v-icon <v-icon large>fa-sort</v-icon>{{ lt("Sort") }}</v-btn
>
<v-btn
v-if="item.sort != null && item.sort == '-'" v-if="item.sort != null && item.sort == '-'"
large text
>fa-sort-amount-down</v-icon Large
><v-icon large>fa-sort-amount-down</v-icon
>{{ lt("Sort") }}</v-btn
> >
<v-icon <v-btn
v-if="item.sort != null && item.sort == '+'" v-if="item.sort != null && item.sort == '+'"
large text
>fa-sort-amount-up</v-icon Large
> ><v-icon large>fa-sort-amount-up</v-icon
<label class="v-label theme--light" >{{ lt("Sort") }}</v-btn
>&nbsp;{{ lt("Sort") }}</label
> >
</div> </div>
</template> </template>
@@ -255,6 +257,34 @@ export default {
item.sort = null; item.sort = null;
} }
}, },
move: function(direction, index) {
var totalItems = this.obj.length;
var newIndex = 0;
//calculate new index
switch (direction) {
case "start":
newIndex = 0;
break;
case "left":
newIndex = index - 1;
if (newIndex < 0) {
newIndex = 0;
}
break;
case "right":
newIndex = index + 1;
if (newIndex > totalItems - 1) {
newIndex = totalItems - 1;
}
break;
case "end":
newIndex = totalItems - 1;
break;
}
this.obj.splice(newIndex, 0, this.obj.splice(index, 1)[0]);
},
form() { form() {
return window.$gz.form; return window.$gz.form;
}, },