MisskeyDeck: スタックしたカラムを上下移動できるように
This commit is contained in:
parent
79d592b431
commit
caabdc68f3
|
@ -85,6 +85,8 @@ common:
|
|||
list: "リスト"
|
||||
swap-left: "左に移動"
|
||||
swap-right: "右に移動"
|
||||
swap-up: "上に移動"
|
||||
swap-down: "下に移動"
|
||||
remove: "カラムを削除"
|
||||
add-column: "カラムを追加"
|
||||
rename: "名前を変更"
|
||||
|
|
|
@ -3,8 +3,8 @@
|
|||
<div class="backdrop" ref="backdrop" @click="close"></div>
|
||||
<div class="popover" :class="{ hukidasi }" ref="popover">
|
||||
<template v-for="item in items">
|
||||
<div v-if="item == null"></div>
|
||||
<button v-else @click="clicked(item.onClick)" v-html="item.content"></button>
|
||||
<div v-if="item === null"></div>
|
||||
<button v-if="item" @click="clicked(item.onClick)" v-html="item.content"></button>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -111,17 +111,27 @@ export default Vue.extend({
|
|||
onClick: () => {
|
||||
this.$store.dispatch('settings/swapRightDeckColumn', this.column.id);
|
||||
}
|
||||
}, null, {
|
||||
}, this.isStacked ? {
|
||||
content: '%fa:arrow-up% %i18n:common.deck.swap-up%',
|
||||
onClick: () => {
|
||||
this.$store.dispatch('settings/swapUpDeckColumn', this.column.id);
|
||||
}
|
||||
} : undefined, this.isStacked ? {
|
||||
content: '%fa:arrow-down% %i18n:common.deck.swap-down%',
|
||||
onClick: () => {
|
||||
this.$store.dispatch('settings/swapDownDeckColumn', this.column.id);
|
||||
}
|
||||
} : undefined, null, {
|
||||
content: '%fa:window-restore R% %i18n:common.deck.stack-left%',
|
||||
onClick: () => {
|
||||
this.$store.dispatch('settings/stackLeftDeckColumn', this.column.id);
|
||||
}
|
||||
}, {
|
||||
}, this.isStacked ? {
|
||||
content: '%fa:window-restore R% %i18n:common.deck.pop-right%',
|
||||
onClick: () => {
|
||||
this.$store.dispatch('settings/popRightDeckColumn', this.column.id);
|
||||
}
|
||||
}, null, {
|
||||
} : undefined, null, {
|
||||
content: '%fa:trash-alt R% %i18n:common.deck.remove%',
|
||||
onClick: () => {
|
||||
this.$store.dispatch('settings/removeDeckColumn', this.column.id);
|
||||
|
|
|
@ -208,6 +208,34 @@ export default (os: MiOS) => new Vuex.Store({
|
|||
});
|
||||
},
|
||||
|
||||
swapUpDeckColumn(state, id) {
|
||||
const ids = state.deck.layout.find(ids => ids.indexOf(id) != -1);
|
||||
ids.some((x, i) => {
|
||||
if (x == id) {
|
||||
const up = ids[i - 1];
|
||||
if (up) {
|
||||
ids[i - 1] = id;
|
||||
ids[i] = up;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
swapDownDeckColumn(state, id) {
|
||||
const ids = state.deck.layout.find(ids => ids.indexOf(id) != -1);
|
||||
ids.some((x, i) => {
|
||||
if (x == id) {
|
||||
const down = ids[i + 1];
|
||||
if (down) {
|
||||
ids[i + 1] = id;
|
||||
ids[i] = down;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
stackLeftDeckColumn(state, id) {
|
||||
const i = state.deck.layout.findIndex(ids => ids.indexOf(id) != -1);
|
||||
state.deck.layout = state.deck.layout.map(ids => ids.filter(x => x != id));
|
||||
|
@ -288,6 +316,16 @@ export default (os: MiOS) => new Vuex.Store({
|
|||
ctx.dispatch('saveDeck');
|
||||
},
|
||||
|
||||
swapUpDeckColumn(ctx, id) {
|
||||
ctx.commit('swapUpDeckColumn', id);
|
||||
ctx.dispatch('saveDeck');
|
||||
},
|
||||
|
||||
swapDownDeckColumn(ctx, id) {
|
||||
ctx.commit('swapDownDeckColumn', id);
|
||||
ctx.dispatch('saveDeck');
|
||||
},
|
||||
|
||||
stackLeftDeckColumn(ctx, id) {
|
||||
ctx.commit('stackLeftDeckColumn', id);
|
||||
ctx.dispatch('saveDeck');
|
||||
|
|
Loading…
Reference in New Issue