Merge branch 'feature/AccountList' of https://gitea.verdnatura.es/hyervoni/salix-front-mindshore into feature/AccountList

src/pages/Account/AccountCreate.vue

@@ -3,19 +3,14 @@ import { reactive, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRouter } from 'vue-router';
 
-import FormModel from 'components/FormModel.vue';
+import FormModelPopup from 'components/FormModelPopup.vue';
 import VnRow from 'components/ui/VnRow.vue';
 import VnSelect from 'src/components/common/VnSelect.vue';
 import FetchData from 'components/FetchData.vue';
-import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
-import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 
-import { useStateStore } from 'stores/useStateStore';
-
 const { t } = useI18n();
 const router = useRouter();
-const stateStore = useStateStore();
 
 const newAccountForm = reactive({
     active: true,
@@ -34,26 +29,15 @@ const redirectToAccountBasicData = (_, { id }) => {
         @on-fetch="(data) => (rolesOptions = data)"
         auto-load
     />
-    <template v-if="stateStore.isHeaderMounted()">
-        <Teleport to="#searchbar">
-            <VnSearchbar
-                data-key="AccountList"
-                url="VnUsers/preview"
-                :label="t('account.search')"
-                :info="t('account.searchInfo')"
-                custom-route-redirect-name="AccountList"
-            />
-        </Teleport>
-    </template>
-    <QPage>
-        <VnSubToolbar />
-        <FormModel
+
+    <FormModelPopup
+        :title="t('account.card.newUser')"
         url-create="VnUsers"
         model="users"
         :form-initial-data="newAccountForm"
         @on-data-saved="redirectToAccountBasicData"
     >
-            <template #form="{ data, validate }">
+        <template #form-inputs="{ data, validate }">
             <VnRow class="row q-gutter-md q-mb-md">
                 <div class="col">
                     <VnInput
@@ -117,6 +101,5 @@ const redirectToAccountBasicData = (_, { id }) => {
                 </div>
             </VnRow>
         </template>
-        </FormModel>
-    </QPage>
+    </FormModelPopup>
 </template>

src/pages/Account/AccountFilter.vue

@@ -55,7 +55,7 @@ const rolesOptions = ref([]);
             <QItem class="q-my-sm">
                 <QItemSection>
                     <VnInput
-                        :label="t('account.card.nickname')"
+                        :label="t('account.card.alias')"
                         v-model="params.nickname"
                         lazy-rules
                         is-outlined
@@ -65,7 +65,7 @@ const rolesOptions = ref([]);
             <QItem class="q-mb-sm">
                 <QItemSection>
                     <VnSelect
-                        :label="t('account.card.nickname')"
+                        :label="t('account.card.role')"
                         v-model="params.roleFk"
                         @update:model-value="searchFn()"
                         :options="rolesOptions"

src/pages/Account/AccountList.vue

@@ -1,7 +1,7 @@
 <script setup>
 import { useI18n } from 'vue-i18n';
 import { useRouter } from 'vue-router';
-import { computed } from 'vue';
+import { computed, ref } from 'vue';
 
 import VnPaginate from 'src/components/ui/VnPaginate.vue';
 import VnSearchbar from 'components/ui/VnSearchbar.vue';
@@ -9,18 +9,19 @@ import VnLv from 'src/components/ui/VnLv.vue';
 import CardList from 'src/components/ui/CardList.vue';
 import AccountSummary from './Card/AccountSummary.vue';
 import AccountFilter from './AccountFilter.vue';
+import AccountCreate from './AccountCreate.vue';
 
 import { useSummaryDialog } from 'src/composables/useSummaryDialog';
 import { useStateStore } from 'stores/useStateStore';
 import { useRole } from 'src/composables/useRole';
+import { QDialog } from 'quasar';
 
 const stateStore = useStateStore();
 const router = useRouter();
 const { t } = useI18n();
 const { viewSummary } = useSummaryDialog();
-const roleState = useRole();
-
-const isItManagement = computed(() => roleState.hasAny(['itManagement']));
+const accountCreateDialogRef = ref(null);
+const showNewUserBtn = computed(() => useRole().hasAny(['itManagement']));
 
 const filter = {
     fields: ['id', 'nickname', 'name', 'role'],
@@ -54,7 +55,7 @@ const navigate = (event, id) => {
     router.push({ path: `/account/${id}` });
 };
 
-const redirectToItemCreate = () => router.push({ name: 'AccountCreate' });
+const openCreateModal = () => accountCreateDialogRef.value.show();
 </script>
 
 <template>
@@ -126,8 +127,15 @@ const redirectToItemCreate = () => router.push({ name: 'AccountCreate' });
                 </template>
             </VnPaginate>
         </div>
-        <QPageSticky :offset="[20, 20]">
-            <QBtn @click="redirectToItemCreate()" color="primary" fab icon="add" />
+        <QDialog
+            ref="accountCreateDialogRef"
+            transition-hide="scale"
+            transition-show="scale"
+        >
+            <AccountCreate />
+        </QDialog>
+        <QPageSticky :offset="[20, 20]" v-if="showNewUserBtn">
+            <QBtn @click="openCreateModal" color="primary" fab icon="add" />
             <QTooltip class="text-no-wrap">
                 {{ t('account.card.newUser') }}
             </QTooltip>

src/pages/Account/Card/AccountDescriptor.vue

@@ -1,15 +1,10 @@
 <script setup>
-import { ref, computed, onMounted } from 'vue';
+import { ref, computed } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
-import { toDate, toPercentage } from 'src/filters';
-import { useState } from 'src/composables/useState';
 import CardDescriptor from 'components/ui/CardDescriptor.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
 import useCardDescription from 'src/composables/useCardDescription';
-import VnUserLink from 'src/components/ui/VnUserLink.vue';
-import { getUrl } from 'src/composables/getUrl';
-import AccountDescriptorMenu from './AccountDescriptorMenu.vue';
 import { useSession } from 'src/composables/useSession';
 const $props = defineProps({
     id: {
@@ -20,7 +15,6 @@ const $props = defineProps({
 });
 
 const route = useRoute();
-const state = useState();
 const { t } = useI18n();
 const salixUrl = ref();
 const { getTokenMultimedia } = useSession();
@@ -66,9 +60,6 @@ function getAccountAvatar() {
                 </QTooltip>
             </QBtn>
         </template>
-        <template #menu="{ entity }">
-            <AccountDescriptorMenu :account="entity" />
-        </template>
         <template #before>
             <QImg :src="getAccountAvatar()" class="photo">
                 <template #error>

src/pages/Account/locale/en.yml

@@ -29,11 +29,20 @@ account:
             setPassword: Set password
             disableAccount:
                 name: Disable account
-                title: La cuenta será deshabilitada
-                subtitle: ¿Seguro que quieres continuar?
-            disableUser: Disable user
-            sync: Sync
-            delete: Delete
+                title: The account will be disabled
+                subtitle: Are you sure you want to continue?
+            disableUser:
+                name: Disable user
+                title: The user will be disabled
+                subtitle: Are you sure you want to continue?
+            sync:
+                name: Sync
+                title: The account will be sync
+                subtitle: Are you sure you want to continue?
+            delete:
+                name: Delete
+                title: The account will be deleted
+                subtitle: Are you sure you want to continue?
     search: Search user
     searchInfo: You can search by id, name or nickname
     create:

src/router/modules/account.js

@@ -11,23 +11,8 @@ export default {
     component: RouterView,
     redirect: { name: 'AccountMain' },
     menus: {
-        main: [
-            'AccountList',
-            'AccountRoles',
-            'AccountAlias',
-            'AccountAccounts',
-            'AccountLdap',
-            'AccountSamba',
-            'AccountConnections',
-        ],
-        card: [
-            'AccountBasicData',
-            'AccountInheritedRoles',
-            'AccountMailForwarding',
-            'AccountMailAlias',
-            'AccountPrivileges',
-            'AccountLog',
-        ],
+        main: ['AccountList'],
+        card: [],
     },
     children: [
         {