mirror of
https://github.com/Bubka/2FAuth.git
synced 2024-11-27 02:36:06 +01:00
Complete Move to group feature
This commit is contained in:
Bubka
parent
f16b256c0b
commit
fe02bac6d6
@ -111,6 +111,7 @@ public function update(Request $request, $id)
|
||||
*/
|
||||
public function associateAccounts(Request $request)
|
||||
{
|
||||
if( $request->input('groupId') > 0 ) {
|
||||
|
||||
$twofaccounts = TwoFAccount::find($request->input('accountsIds'));
|
||||
$group = Group::FindOrFail($request->input('groupId'));
|
||||
@ -119,6 +120,16 @@ public function associateAccounts(Request $request)
|
||||
|
||||
return response()->json($group, 200);
|
||||
}
|
||||
else {
|
||||
|
||||
TwoFAccount::whereIn('id', $request->input('accountsIds'))
|
||||
->update(['group_id' => NULL]);
|
||||
|
||||
return response()->json(['message' => 'moved to null'], 200);
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div>
|
||||
<!-- Group selector -->
|
||||
<div class="container groups" v-if="showGroupSelector">
|
||||
<!-- Group switch -->
|
||||
<div class="container groups" v-if="showGroupSwitch">
|
||||
<div class="columns is-centered">
|
||||
<div class="column is-one-third-tablet is-one-quarter-desktop is-one-quarter-widescreen is-one-quarter-fullhd">
|
||||
<div class="columns is-multiline">
|
||||
@ -17,6 +17,25 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Group selector -->
|
||||
<div class="container groups with-heading" v-if="showGroupSelector">
|
||||
<div class="columns is-centered">
|
||||
<div class="column is-one-third-tablet is-one-quarter-desktop is-one-quarter-widescreen is-one-quarter-fullhd">
|
||||
<div class="columns is-multiline">
|
||||
<div class="column is-full" v-for="group in groups" :key="group.id">
|
||||
<button class="button is-fullwidth is-dark has-text-light is-outlined" :class="{ 'is-link' : moveAccountsTo === group.id}" @click="moveAccountsTo = group.id">
|
||||
<span v-if="group.id === 0">
|
||||
{{ $t('groups.no_group') }}
|
||||
</span>
|
||||
<span v-else>
|
||||
{{ group.name }}
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- show accounts list -->
|
||||
<div class="container" v-if="this.showAccounts">
|
||||
<!-- accounts -->
|
||||
@ -64,14 +83,14 @@
|
||||
<!-- </vue-pull-refresh> -->
|
||||
</div>
|
||||
<!-- header -->
|
||||
<div class="header has-background-black-ter" v-if="this.showAccounts || this.showGroupSelector">
|
||||
<div class="header has-background-black-ter" v-if="this.showAccounts || this.showGroupSwitch">
|
||||
<div class="columns is-gapless is-mobile is-centered">
|
||||
<div class="column is-three-quarters-mobile is-one-third-tablet is-one-quarter-desktop is-one-quarter-widescreen is-one-quarter-fullhd">
|
||||
<!-- toolbar -->
|
||||
<div class="toolbar has-text-centered" v-if="editMode">
|
||||
<div class="manage-buttons tags has-addons are-medium">
|
||||
<span class="tag is-dark">{{ selectedAccounts.length }} {{ $t('commons.selected') }}</span>
|
||||
<a class="tag is-link" v-if="selectedAccounts.length > 0" @click="moveAccounts">
|
||||
<a class="tag is-link" v-if="selectedAccounts.length > 0" @click="showGroupSelector = true">
|
||||
{{ $t('commons.move') }} <font-awesome-icon :icon="['fas', 'layer-group']" />
|
||||
</a>
|
||||
<a class="tag is-danger" v-if="selectedAccounts.length > 0" @click="destroyAccounts">
|
||||
@ -89,10 +108,10 @@
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- group selector -->
|
||||
<div class="group-selector has-text-centered" v-if="!editMode">
|
||||
<div class="columns" @click="toggleGroupSelector">
|
||||
<div class="column" v-if="!showGroupSelector">
|
||||
<!-- group switch toggle -->
|
||||
<div class="is-clickable has-text-centered" v-if="!editMode">
|
||||
<div class="columns" @click="toggleGroupSwitch">
|
||||
<div class="column" v-if="!showGroupSwitch">
|
||||
{{ this.activeGroupName }} ({{ this.accounts.length }})
|
||||
<font-awesome-icon :icon="['fas', 'caret-down']" />
|
||||
</div>
|
||||
@ -111,7 +130,7 @@
|
||||
<twofaccount-show ref="TwofaccountShow" ></twofaccount-show>
|
||||
</modal>
|
||||
<!-- footer -->
|
||||
<vue-footer v-if="showFooter && !showGroupSelector" :showButtons="accounts.length > 0">
|
||||
<vue-footer v-if="showFooter && !showGroupSwitch" :showButtons="accounts.length > 0">
|
||||
<!-- New item buttons -->
|
||||
<p class="control" v-if="!showUploader && !editMode">
|
||||
<a class="button is-link is-rounded is-focus" @click="showUploader = true">
|
||||
@ -141,10 +160,20 @@
|
||||
</a>
|
||||
</p>
|
||||
</vue-footer>
|
||||
<vue-footer v-if="showFooter && showGroupSelector" :showButtons="true">
|
||||
<!-- Close Group selector button -->
|
||||
<vue-footer v-if="showFooter && showGroupSwitch" :showButtons="true">
|
||||
<!-- Close Group switch button -->
|
||||
<p class="control">
|
||||
<a class="button is-dark is-rounded" @click="closeGroupSelector()">{{ $t('commons.close') }}</a>
|
||||
<a class="button is-dark is-rounded" @click="closeGroupSwitch()">{{ $t('commons.close') }}</a>
|
||||
</p>
|
||||
</vue-footer>
|
||||
<vue-footer v-if="showFooter && showGroupSelector" :showButtons="true">
|
||||
<!-- Move to selected group button -->
|
||||
<p class="control">
|
||||
<a class="button is-link is-rounded" @click="moveAccounts()">{{ $t('commons.move') }}</a>
|
||||
</p>
|
||||
<!-- Cancel button -->
|
||||
<p class="control">
|
||||
<a class="button is-dark is-rounded" @click="showGroupSelector = false">{{ $t('commons.cancel') }}</a>
|
||||
</p>
|
||||
</vue-footer>
|
||||
</div>
|
||||
@ -175,8 +204,10 @@
|
||||
editMode: this.InitialEditMode,
|
||||
showUploader: false,
|
||||
showFooter: true,
|
||||
showGroupSwitch: false,
|
||||
showGroupSelector: false,
|
||||
drag: false,
|
||||
moveAccountsTo: false,
|
||||
}
|
||||
},
|
||||
|
||||
@ -195,7 +226,7 @@
|
||||
},
|
||||
|
||||
showAccounts() {
|
||||
return this.accounts.length > 0 && !this.showUploader && !this.showGroupSelector ? true : false
|
||||
return this.accounts.length > 0 && !this.showUploader && !this.showGroupSwitch && !this.showGroupSelector ? true : false
|
||||
},
|
||||
|
||||
activeGroupName() {
|
||||
@ -323,11 +354,13 @@
|
||||
this.selectedAccounts.forEach(id => accountsIds.push(id))
|
||||
|
||||
// Backend will associate all accounts with the selected group in the same move
|
||||
await this.axios.patch('/api/group/accounts', {accountsIds: accountsIds, groupId: '3'} )
|
||||
await this.axios.patch('/api/group/accounts', {accountsIds: accountsIds, groupId: this.moveAccountsTo} )
|
||||
|
||||
// we fetch the accounts again to prevent the js collection being
|
||||
// desynchronize from the backend php collection
|
||||
this.fetchAccounts()
|
||||
this.fetchGroups()
|
||||
this.showGroupSelector = false
|
||||
|
||||
},
|
||||
|
||||
@ -355,7 +388,7 @@
|
||||
|
||||
this.$root.appSettings.activeGroup = response.data.settings.activeGroup
|
||||
|
||||
this.closeGroupSelector()
|
||||
this.closeGroupSwitch()
|
||||
|
||||
})
|
||||
.catch(error => {
|
||||
@ -366,21 +399,21 @@
|
||||
this.fetchAccounts()
|
||||
},
|
||||
|
||||
toggleGroupSelector: function(event) {
|
||||
toggleGroupSwitch: function(event) {
|
||||
|
||||
if (event) {
|
||||
this.showGroupSelector ? this.closeGroupSelector() : this.openGroupSelector()
|
||||
this.showGroupSwitch ? this.closeGroupSwitch() : this.openGroupSwitch()
|
||||
}
|
||||
},
|
||||
|
||||
openGroupSelector: function(event) {
|
||||
openGroupSwitch: function(event) {
|
||||
|
||||
this.showGroupSelector = true
|
||||
this.showGroupSwitch = true
|
||||
},
|
||||
|
||||
closeGroupSelector: function(event) {
|
||||
closeGroupSwitch: function(event) {
|
||||
|
||||
this.showGroupSelector = false
|
||||
this.showGroupSwitch = false
|
||||
},
|
||||
|
||||
setEditModeTo(state) {
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
</router-link>
|
||||
<span class="is-family-primary is-size-6 is-size-7-mobile has-text-grey">{{ group.count }} {{ $t('twofaccounts.accounts') }}</span>
|
||||
</div>
|
||||
<p class="is-size-7 is-pulled-right">
|
||||
<p class="is-size-7 is-pulled-right" v-if="groups.length > 0">
|
||||
{{ $t('groups.deleting_group_does_not_delete_accounts')}}
|
||||
</p>
|
||||
<!-- footer -->
|
||||
|
||||
@ -16,8 +16,9 @@
|
||||
'groups' => 'Groups',
|
||||
'select_accounts_to_show' => 'Select accounts to show',
|
||||
'manage_groups' => 'Manage groups',
|
||||
'manage_groups_legend' => 'You can create groups to manage your accounts the way you want. All your accounts remain visible in the pseudo group named \'All\', regardless of the group they belong to.',
|
||||
'manage_groups_legend' => 'You can create groups to organize your accounts the way you want. All accounts remain visible in the pseudo group named \'All\', regardless of the group they belong to.',
|
||||
'deleting_group_does_not_delete_accounts' => 'Deleting a group does not delete accounts',
|
||||
'no_group' => 'No group',
|
||||
'forms' => [
|
||||
'new_group' => 'New group',
|
||||
'new_name' => 'New name',
|
||||
@ -26,5 +27,4 @@
|
||||
'confirm' => [
|
||||
'delete' => 'Are you sure you want to delete this group?',
|
||||
],
|
||||
|
||||
];
|
||||
4
resources/sass/app.scss
vendored
4
resources/sass/app.scss
vendored
@ -51,10 +51,6 @@ a:hover {
|
||||
}
|
||||
}
|
||||
|
||||
.group-selector {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.group-item {
|
||||
border-bottom: 1px solid hsl(0, 0%, 21%);
|
||||
padding: 0.75rem;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user