@drax/identity-vue 0.0.20 → 0.0.21

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "0.0.20",
+  "version": "0.0.21",
   "type": "module",
   "main": "./src/index.ts",
   "module": "./src/index.ts",
@@ -24,7 +24,7 @@
     "format": "prettier --write src/"
   },
   "dependencies": {
-    "@drax/common-front": "^0.0.20",
+    "@drax/common-front": "^0.0.21",
     "vue-i18n": "^9.13.1"
   },
   "peerDependencies": {
@@ -61,5 +61,5 @@
     "vue-tsc": "^2.0.11",
     "vuetify": "^3.6.4"
   },
-  "gitHead": "5d01fbe44ee689c8512d7605f4b2fe2fc94fb599"
+  "gitHead": "e69a9b3d6123e94549678dc865b9ba9ffe9816c9"
 }

package/src/combobox/PermissionCombobox.vue

@@ -3,13 +3,13 @@
 import {ref, onMounted, defineModel} from 'vue'
 import type { PropType } from 'vue'
 
-const props = defineProps({
+defineProps({
   errorMessages: {
     type: String as PropType<string | string[] | undefined>,
   }
 })
 
-const model = defineModel()
+const model = defineModel<any>()
 import {useRole} from "../composables/useRole";
 const {fetchPermissions} = useRole()
 let items = ref([])

package/src/combobox/RoleCombobox.vue

@@ -2,7 +2,7 @@
 
 import {ref, onMounted, defineModel} from 'vue'
 import type { PropType } from 'vue'
-const props = defineProps({
+defineProps({
   errorMessages: {
     type: String as PropType<string | string[] | undefined>,
   },
@@ -16,7 +16,7 @@ const props = defineProps({
   }
 })
 
-const model = defineModel()
+const model = defineModel<any>()
 import {useRole} from "../composables/useRole";
 const {fetchRole} = useRole()
 let items = ref([])

package/src/combobox/TenantCombobox.vue

@@ -2,13 +2,13 @@
 
 import {ref, onMounted, defineModel} from 'vue'
 import type { PropType } from 'vue'
-const props = defineProps({
+defineProps({
   errorMessages: {
     type: String as PropType<string | string[] | undefined>,
   }
 })
 
-const model = defineModel()
+const model = defineModel<any>()
 import {useTenant} from "../composables/useTenant";
 const {fetchTenant} = useTenant()
 let items = ref([])

package/src/components/IdentityChangeOwnPassword/IdentityChangeOwnPassword.vue

@@ -83,7 +83,7 @@ async function submitChangePassowrd() {
                     :append-inner-icon="currentPasswordVisibility ? 'mdi-eye-off': 'mdi-eye'"
                     @click:append-inner="currentPasswordVisibility = !currentPasswordVisibility"
                     autocomplete="new-password"
-                    :error-messages="$ta(inputErrors.currentPassword)"
+                    :error-messages="$ta(inputErrors?.currentPassword)"
                 ></v-text-field>
                 <div class="text-subtitle-1 text-medium-emphasis">{{ $t('user.newPassword') }}</div>
                 <v-text-field
@@ -96,7 +96,7 @@ async function submitChangePassowrd() {
                     :append-inner-icon="newPasswordVisibility ? 'mdi-eye-off': 'mdi-eye'"
                     @click:append-inner="newPasswordVisibility = !newPasswordVisibility"
                     autocomplete="new-password"
-                    :error-messages="$ta(inputErrors.newPassword)"
+                    :error-messages="$ta(inputErrors?.newPassword)"
                 ></v-text-field>
                 <div class="text-subtitle-1 text-medium-emphasis">{{ $t('user.confirmPassword') }}</div>
                 <v-text-field
@@ -109,7 +109,7 @@ async function submitChangePassowrd() {
                     :append-inner-icon="newPasswordVisibility ? 'mdi-eye-off': 'mdi-eye'"
                     @click:append-inner="newPasswordVisibility = !newPasswordVisibility"
                     autocomplete="new-password"
-                    :error-messages="$ta(inputErrors.confirmPassword)"
+                    :error-messages="$ta(inputErrors?.confirmPassword)"
                     :rules="[confirmPasswordRule]"
                 ></v-text-field>
               </v-card-text>

package/src/components/IdentityProfileAvatar/IdentityProfileAvatar.vue

@@ -3,7 +3,7 @@ import {useAuthStore} from "../../stores/auth/AuthStore.js";
 
 const emit = defineEmits(['click'])
 
-const props = defineProps({
+defineProps({
   avatarSize: {
     type: Number,
     default: 54

package/src/components/IdentityProfileDrawer/IdentityProfileDrawer.vue

@@ -5,7 +5,7 @@ import IdentityProfileView from "../IdentityProfileView/IdentityProfileView.vue"
 import IdentityChangeOwnPassword from "../../components/IdentityChangeOwnPassword/IdentityChangeOwnPassword.vue";
 
 const auth = useAuth()
-const valueModel = defineModel()
+const valueModel = defineModel<boolean>()
 const profile = ref(false)
 const changePassword = ref(false)
 
@@ -51,7 +51,7 @@ const changePassword = ref(false)
       </v-list>
     </template>
 
-    <v-dialog v-model="profile"  fullscreen :on-after-leave="changePassword=false">
+    <v-dialog v-model="profile"  fullscreen :on-after-leave="() => changePassword=false">
       <v-toolbar>
         <v-toolbar-title>
           {{$t('user.profile')}}

package/src/components/IdentityProfileView/IdentityProfileView.vue

@@ -3,9 +3,7 @@ import {useAuthStore} from "../../stores/auth/AuthStore.js";
 import IdentityProfileAvatar from "../IdentityProfileAvatar/IdentityProfileAvatar.vue";
 const emit = defineEmits(['click'])
 const authStore = useAuthStore()
-const onClick = () => {
-  emit('click')
-}
+
 </script>
 
 <template>

package/src/components/PermissionSelector/PermissionSelector.vue

@@ -3,7 +3,7 @@
 import {ref, onMounted, defineModel, computed} from 'vue'
 import type {PropType} from 'vue'
 
-const props = defineProps({
+defineProps({
   errorMessages: {
     type: String as PropType<string | string[] | undefined>,
   }
@@ -26,13 +26,12 @@ interface PermissionGroups {
 const permissionGroups = computed(() => {
   const groups = items.value.reduce((acc: PermissionGroups, permission: string) => {
     if (permission.includes(':')) {
-      const [entity, action] = permission.split(':');
+      const [entity] = permission.split(':');
       if (!acc[entity]) {
         acc[entity] = [];
       }
       acc[entity].push(permission);
     } else {
-      // Si el permiso no sigue el formato entidad:acción, lo asignamos al grupo 'general'
       const generalGroup = 'general';
       if (!acc[generalGroup]) {
         acc[generalGroup] = [];

package/src/composables/useRole.ts

@@ -1,5 +1,6 @@
 import {inject, ref} from "vue";
-import type {IRole, RoleSystem} from "@drax/identity-front";
+import  {RoleSystem} from "@drax/identity-front";
+import type {IRole, IRoleBase} from "@drax/identity-front";
 import {ClientError} from "@drax/common-front";
 import type { IClientInputError} from "@drax/common-front";
 
@@ -33,7 +34,7 @@ export function useRole() {
         return paginatedrole
     }
 
-    async function createRole(roleData: IRole) {
+    async function createRole(roleData: IRoleBase) {
         try {
             loading.value = true
             let role: IRole =  await roleSystem.createRole(roleData)
@@ -51,7 +52,7 @@ export function useRole() {
 
     }
 
-    async function editRole(id: string, roleData: IRole) {
+    async function editRole(id: string, roleData: IRoleBase) {
         try {
             loading.value = true
             let role: IRole = await roleSystem.editRole(id, roleData)

package/src/composables/useTenant.ts

@@ -1,5 +1,5 @@
 import {inject, ref} from "vue";
-import type {ITenant, TenantSystem} from "@drax/identity-front";
+import type {ITenant, ITenantBase, TenantSystem} from "@drax/identity-front";
 import {ClientError} from "@drax/common-front";
 import type { IClientInputError} from "@drax/common-front";
 
@@ -26,7 +26,7 @@ export function useTenant() {
         return paginatedtenant
     }
 
-    async function createTenant(tenantData: ITenant) {
+    async function createTenant(tenantData: ITenantBase) {
         try {
             loading.value = true
             let tenant: ITenant =  await tenantSystem.createTenant(tenantData)
@@ -44,7 +44,7 @@ export function useTenant() {
 
     }
 
-    async function editTenant(id: string, tenantData: ITenant) {
+    async function editTenant(id: string, tenantData: ITenantBase) {
         try {
             loading.value = true
             let tenant: ITenant = await tenantSystem.editTenant(id, tenantData)

package/src/composables/useUser.ts

@@ -1,5 +1,5 @@
 import {inject, ref} from "vue";
-import type {IUserPassword, UserSystem} from "@drax/identity-front";
+import type {UserSystem} from "@drax/identity-front";
 import type {IUser} from "@drax/identity-front";
 import type {IClientInputError} from "@drax/common-front";
 import {ClientError} from "@drax/common-front";

package/src/cruds/role-crud/RoleCrud.vue

@@ -2,7 +2,7 @@
 import {computed, ref} from 'vue'
 import RoleList from "./RoleList.vue";
 import {useRole} from "../../composables/useRole";
-import type {IRole} from "@drax/identity-front";
+import type {IRole, IRoleBase} from "@drax/identity-front";
 import RoleForm from "../../forms/RoleForm.vue";
 import RoleView from "../../views/RoleView.vue";
 
@@ -20,7 +20,7 @@ let dialog = ref(false);
 let dialogMode = ref<DialogMode>(null);
 let dialogTitle = ref('');
 const roleList = ref<RoleList | null>(null);
-let form = ref<IRole>({name: "", permissions: [], childRoles:[], readonly: false})
+let form = ref<IRoleBase>({name: "", permissions: [], childRoles:[], readonly: false})
 let target = ref<IRole>();
 let targetId = ref<string>('');
 let filterEnable = ref(false);
@@ -82,10 +82,14 @@ function toCreate() {
 function toEdit(item: IRole) {
   dialogMode.value = 'edit';
   dialogTitle.value = 'role.updating';
-  const {id, ...rest} = item;
-  rest.childRoles = rest.childRoles ? rest.childRoles.map(c => c.id) : []
-  targetId.value = id;
-  form.value = {...rest}
+  targetId.value = item.id;
+  form.value = {
+    name: item.name,
+    permissions: item.permissions,
+    childRoles: item.childRoles ? item.childRoles.map(c => c.id) : [],
+    readonly: item.readonly
+
+  }
   dialog.value = true;
 }
 

package/src/cruds/role-crud/RoleList.vue

@@ -1,15 +1,16 @@
 <script setup lang="ts">
 
-import {defineProps, ref} from "vue";
+import {defineProps, type Ref, ref} from "vue";
 import {useRole} from "../../composables/useRole";
 import {useAuth} from "../../composables/useAuth";
 import {useI18n} from "vue-i18n";
+import type {IRole} from "@drax/identity-front";
 
 const {hasPermission} = useAuth()
 const {paginateRole} = useRole()
 const {t} = useI18n()
 
-const props = defineProps({
+defineProps({
   filterEnable: {
     type: Boolean,
     default: false,
@@ -18,16 +19,16 @@ const props = defineProps({
 
 const itemsPerPage = ref(5)
 const page = ref(1)
-const headers = ref([
+const headers = ref<any>([
   //{title: 'ID', align: 'start', sortable: false, key: 'id'},
-  { title: t('role.name'), key: 'name', align: 'start' },
-  { title: t('role.childRoles'), key: 'childRoles', align: 'start' },
-  { title: t('role.permissions'), key: 'permissions', align: 'start' },
-  { title: t('role.readonly'), key: 'readonly', align: 'start' },
+  { title: t('role.name') as string, key: 'name', align: 'start' },
+  { title: t('role.childRoles') as string, key: 'childRoles', align: 'start' },
+  { title: t('role.permissions') as string, key: 'permissions', align: 'start' },
+  { title: t('role.readonly') as string, key: 'readonly', align: 'start' },
   { title: '', key: 'actions', align: 'end', minWidth: '150px' },
 ])
 
-const serverItems = ref([])
+const serverItems: Ref<IRole[]> = ref([]);
 const totalItems = ref(0)
 const loading = ref(false)
 const search = ref('')

package/src/cruds/tenant-crud/TenantCrud.vue

@@ -2,7 +2,7 @@
 import {computed, ref} from 'vue'
 import TenantList from "./TenantList.vue";
 import {useTenant} from "../../composables/useTenant";
-import type {ITenant} from "@drax/identity-front";
+import type {ITenant, ITenantBase} from "@drax/identity-front";
 import TenantForm from "../../forms/TenantForm.vue";
 import TenantView from "../../views/TenantView.vue";
 
@@ -20,7 +20,7 @@ let dialog = ref(false);
 let dialogMode = ref<DialogMode>(null);
 let dialogTitle = ref('');
 const tenantList = ref<TenantList | null>(null);
-let form = ref<ITenant>({name: ""})
+let form = ref<ITenantBase>({name: ""})
 let target = ref<ITenant>();
 let targetId = ref<string>('');
 let filterEnable = ref(false);
@@ -83,9 +83,10 @@ function toEdit(item: ITenant) {
   console.log('toEdit', item)
   dialogMode.value = 'edit';
   dialogTitle.value = 'tenant.updating';
-  const {id, ...rest} = item;
-  targetId.value = id;
-  form.value = {...rest}
+  targetId.value = item.id;
+  form.value = {
+    name: item.name
+  }
   dialog.value = true;
 }
 

package/src/cruds/tenant-crud/TenantList.vue

@@ -1,15 +1,16 @@
 <script setup lang="ts">
 
-import {defineProps, ref} from "vue";
+import {defineProps, type Ref, ref} from "vue";
 import {useTenant} from "../../composables/useTenant";
 import {useAuth} from "../../composables/useAuth";
 import {useI18n} from "vue-i18n";
+import type {ITenant} from "@drax/identity-front";
 
 const {hasPermission} = useAuth()
 const {paginateTenant} = useTenant()
 const {t} = useI18n()
 
-const props = defineProps({
+defineProps({
   filterEnable: {
     type: Boolean,
     default: false,
@@ -18,13 +19,12 @@ const props = defineProps({
 
 const itemsPerPage = ref(5)
 const page = ref(1)
-const headers = ref([
-  //{title: 'ID', align: 'start', sortable: false, key: 'id'},
-  { title: t('tenant.name'), key: 'name', align: 'start' },
+const headers = ref<any>([
+  { title: t('tenant.name') as string, key: 'name', align: 'start' },
   { title: '', key: 'actions', align: 'end', minWidth: '150px' },
 ])
 
-const serverItems = ref([])
+const serverItems: Ref<ITenant[]> = ref([]);
 const totalItems = ref(0)
 const loading = ref(false)
 const search = ref('')
@@ -80,8 +80,8 @@ defineExpose({
 
 
     <template v-slot:item.actions="{item}" >
-      <v-btn v-if="hasPermission('tenant:update')" :disabled="item.readonly" icon="mdi-pencil"  variant="text" color="primary" @click="$emit('toEdit', item)"></v-btn>
-      <v-btn v-if="hasPermission('tenant:delete')" :disabled="item.readonly" icon="mdi-delete" class="mr-1" variant="text" color="red" @click="$emit('toDelete', item)"></v-btn>
+      <v-btn v-if="hasPermission('tenant:update')"  icon="mdi-pencil"  variant="text" color="primary" @click="$emit('toEdit', item)"></v-btn>
+      <v-btn v-if="hasPermission('tenant:delete')"  icon="mdi-delete" class="mr-1" variant="text" color="red" @click="$emit('toDelete', item)"></v-btn>
     </template>
 
   </v-data-table-server>

package/src/cruds/user-crud/UserCrud.vue

@@ -100,11 +100,16 @@ function toEdit(item: IUser) {
   actionButtonEnable.value = true
   dialogMode.value = 'edit';
   dialogTitle.value = 'user.updating';
-  const {id, ...rest} = item;
-  targetId.value = id;
-  rest.role = rest.role ? rest.role.id : null
-  rest.tenant = rest.tenant ? rest.tenant.id : null
-  editForm.value = {...rest}
+  targetId.value = item.id;
+  editForm.value = {
+    name: item.name,
+    username: item.username,
+    email: item.email,
+    phone: item.phone,
+    role: item.role.id,
+    tenant: item.tenant.id,
+    active: item.active
+  };
   dialog.value = true;
 }
 

package/src/cruds/user-crud/UserList.vue

@@ -1,15 +1,16 @@
 <script setup lang="ts">
 
-import {ref, defineProps} from "vue";
+import {ref, defineProps, type Ref} from "vue";
 import {useUser} from "../../composables/useUser";
 import {useAuth} from "../../composables/useAuth";
 import {useI18n} from "vue-i18n";
+import type {IUser} from "@drax/identity-front";
 
 const {hasPermission} = useAuth()
 const {paginateUser} = useUser()
 const {t} = useI18n()
 
-const props = defineProps({
+defineProps({
   filterEnable: {
     type: Boolean,
     default: false,
@@ -18,18 +19,18 @@ const props = defineProps({
 
 const itemsPerPage = ref(5)
 const page = ref(1)
-const headers = ref([
+const headers = ref<any>([
   //{title: 'ID', align: 'start', sortable: false, key: 'id'},
-  { title: t('user.name'), key: 'name', align: 'start' },
-  { title: t('user.username'), key: 'username', align: 'start' },
-  { title: t('user.email'), key: 'email', align: 'start' },
-  { title: t('user.role'), key: 'role.name', align: 'start' },
-  { title: t('user.tenant'), key: 'tenant.name', align: 'start' },
-  { title: t('user.active'), key: 'active', align: 'start' },
+  { title: t('user.name') as string, key: 'name', align: 'start' },
+  { title: t('user.username') as string, key: 'username', align: 'start' },
+  { title: t('user.email') as string, key: 'email', align: 'start' },
+  { title: t('user.role') as string, key: 'role.name', align: 'start' },
+  { title: t('user.tenant') as string, key: 'tenant.name', align: 'start' },
+  { title: t('user.active') as string, key: 'active', align: 'start' },
   { title: '', key: 'actions', align: 'end', fixed:true },
 ])
 
-const serverItems = ref([])
+const serverItems: Ref<IUser[]> = ref([]);
 const totalItems = ref(0)
 const loading = ref(false)
 const search = ref('')

package/src/forms/RoleForm.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import {defineModel, type PropType} from "vue";
-import type {IRole} from "@drax/identity-front";
+import type {IRoleBase} from "@drax/identity-front";
 import {useI18nValidation} from "../composables/useI18nValidation";
 import type {IClientInputError} from "@drax/common-front";
 import PermissionSelector from "../components/PermissionSelector/PermissionSelector.vue";
@@ -8,14 +8,14 @@ import RoleCombobox from "../combobox/RoleCombobox.vue";
 
 const {$ta} = useI18nValidation()
 
-const props = defineProps({
+defineProps({
   inputErrors: {
     type: Object as PropType<IClientInputError>,
     default: () => ({name: "", permissions: "", readonly: ""})
   }
 })
 
-const form = defineModel<IRole>({
+const form = defineModel<IRoleBase>({
   type: Object,
   default: () => ({name: "", permissions: [], readonly: false})
 })

package/src/forms/TenantForm.vue

@@ -1,19 +1,19 @@
 <script setup lang="ts">
 import {defineModel, type PropType} from "vue";
-import type {ITenant} from "@drax/identity-front";
+import type {ITenantBase} from "@drax/identity-front";
 import {useI18nValidation} from "../composables/useI18nValidation";
 import type {IClientInputError} from "@drax/common-front";
 
 const {$ta} = useI18nValidation()
 
-const props = defineProps({
+defineProps({
   inputErrors: {
     type: Object as PropType<IClientInputError>,
     default: () => ({name: ""})
   }
 })
 
-const form = defineModel<ITenant>({
+const form = defineModel<ITenantBase>({
   type: Object,
   default: () => ({name: ""})
 })

package/src/forms/UserCreateForm.vue

@@ -8,7 +8,7 @@ import {useI18nValidation} from "../composables/useI18nValidation";
 
 const {$ta} = useI18nValidation()
 
-const props = defineProps({
+defineProps({
   inputErrors: {
     type: Object as PropType<IClientInputError>,
     default: () => ({name: "", username: "", password: "", email: "", phone: "", role: "", tenant: "", active: ""})

package/src/forms/UserEditForm.vue

@@ -7,7 +7,7 @@ import type {IUserUpdate} from "@drax/identity-front/src/interfaces/IUser";
 import {useI18nValidation} from "../composables/useI18nValidation";
 const {$ta} = useI18nValidation()
 
-const props = defineProps({
+defineProps({
   inputErrors: {
     type: Object as PropType<IClientInputError>,
     default: () => ({name: "", username: "", email: "", phone: "", role: "", tenant: "", active: ""})

package/src/forms/UserPasswordForm.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import {ref, defineModel, type PropType, computed} from "vue";
+import {ref, defineModel, type PropType} from "vue";
 import type {IClientInputError} from "@drax/common-front";
-import type {IUser, IUserPassword} from "@drax/identity-front";
+import type {IUserPassword} from "@drax/identity-front";
 import {useI18nValidation} from "../composables/useI18nValidation";
 import {useI18n} from "vue-i18n";
 
@@ -11,7 +11,7 @@ const {$ta} = useI18nValidation()
 let newPasswordVisibility = ref(false)
 
 
-const props = defineProps({
+defineProps({
   inputErrors: {
     type: Object as PropType<IClientInputError>,
     default: () => ({id: "", newPassword: ""})

package/src/stores/auth/AuthStore.ts

@@ -1,7 +1,7 @@
 // Utilities
 import { defineStore } from 'pinia'
 import type {IAuthUser} from "@drax/identity-front";
-import type from 'pinia-plugin-persistedstate'
+//import type from 'pinia-plugin-persistedstate'
 import {AuthHelper} from "@drax/identity-front";
 
 export const useAuthStore = defineStore('AuthStore', {

package/src/views/RoleView.vue

@@ -2,7 +2,7 @@
 import type {PropType} from "vue";
 import type {IRole} from "@drax/identity-front";
 
-const props = defineProps({
+defineProps({
   role:{
     type: Object as PropType<IRole>,
     required: true,

package/src/views/TenantView.vue

@@ -2,7 +2,7 @@
 import type {PropType} from "vue";
 import type {ITenant} from "@drax/identity-front";
 
-const props = defineProps({
+defineProps({
   tenant:{
     type: Object as PropType<ITenant>,
     required: true,

package/src/views/UserView.vue

@@ -3,7 +3,7 @@ import type {PropType} from "vue";
 import type {IUser} from "@drax/identity-front";
 import IdentityProfileAvatar from "../components/IdentityProfileAvatar/IdentityProfileAvatar.vue";
 
-const props = defineProps({
+defineProps({
   user:{
     type: Object as PropType<IUser>,
     required: true,