Menu Manager ekranındaki PermissionList çağrısı düzeltildi.
This commit is contained in:
parent
837bf1e72f
commit
f317351cfe
2 changed files with 28 additions and 22 deletions
|
|
@ -19,11 +19,11 @@ import {
|
||||||
} from '@/components/ui'
|
} from '@/components/ui'
|
||||||
import { Field, FieldProps, Form, Formik } from 'formik'
|
import { Field, FieldProps, Form, Formik } from 'formik'
|
||||||
import { SelectBoxOption } from '@/shared/types'
|
import { SelectBoxOption } from '@/shared/types'
|
||||||
import { getPermissionsList } from '@/services/identity.service'
|
|
||||||
import { PermissionDefinitionRecord } from '@/proxy/admin/models'
|
import { PermissionDefinitionRecord } from '@/proxy/admin/models'
|
||||||
import * as Yup from 'yup'
|
import * as Yup from 'yup'
|
||||||
import { ExternalLink, FileText, Plus, Trash2 } from 'lucide-react'
|
import { ExternalLink, FileText, Plus, Trash2 } from 'lucide-react'
|
||||||
import { MenuDto } from '@/proxy/menus/models'
|
import { MenuDto } from '@/proxy/menus/models'
|
||||||
|
import { getPermissionsList } from '@/services/identity.service'
|
||||||
|
|
||||||
interface MenuItemComponentProps {
|
interface MenuItemComponentProps {
|
||||||
item: MenuItem
|
item: MenuItem
|
||||||
|
|
@ -32,6 +32,7 @@ interface MenuItemComponentProps {
|
||||||
children?: React.ReactNode
|
children?: React.ReactNode
|
||||||
isDragOverlay?: boolean
|
isDragOverlay?: boolean
|
||||||
refetch: () => void
|
refetch: () => void
|
||||||
|
permissions: SelectBoxOption[]
|
||||||
}
|
}
|
||||||
|
|
||||||
export const MenuItemComponent: React.FC<MenuItemComponentProps> = ({
|
export const MenuItemComponent: React.FC<MenuItemComponentProps> = ({
|
||||||
|
|
@ -41,8 +42,8 @@ export const MenuItemComponent: React.FC<MenuItemComponentProps> = ({
|
||||||
children,
|
children,
|
||||||
isDragOverlay = false,
|
isDragOverlay = false,
|
||||||
refetch,
|
refetch,
|
||||||
|
permissions,
|
||||||
}) => {
|
}) => {
|
||||||
const [permissions, setPermissions] = useState<SelectBoxOption[]>([])
|
|
||||||
const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({
|
const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({
|
||||||
id: item.id || '',
|
id: item.id || '',
|
||||||
data: {
|
data: {
|
||||||
|
|
@ -72,6 +73,8 @@ export const MenuItemComponent: React.FC<MenuItemComponentProps> = ({
|
||||||
opacity: isDragging ? 0.5 : 1,
|
opacity: isDragging ? 0.5 : 1,
|
||||||
}
|
}
|
||||||
|
|
||||||
|
console.log('Style', style)
|
||||||
|
|
||||||
const [isExpanded, setIsExpanded] = useState(true)
|
const [isExpanded, setIsExpanded] = useState(true)
|
||||||
const [isModalOpen, setIsModalOpen] = useState(false)
|
const [isModalOpen, setIsModalOpen] = useState(false)
|
||||||
const [formData, setFormData] = useState<Partial<MenuDto>>({
|
const [formData, setFormData] = useState<Partial<MenuDto>>({
|
||||||
|
|
@ -107,24 +110,6 @@ export const MenuItemComponent: React.FC<MenuItemComponentProps> = ({
|
||||||
refetch()
|
refetch()
|
||||||
}
|
}
|
||||||
|
|
||||||
const getPermissionList = async () => {
|
|
||||||
const response = await getPermissionsList()
|
|
||||||
if (response.data) {
|
|
||||||
setPermissions(
|
|
||||||
response.data.map((permission: PermissionDefinitionRecord) => ({
|
|
||||||
value: permission.name,
|
|
||||||
label: permission.name,
|
|
||||||
})),
|
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (permissions) {
|
|
||||||
getPermissionList()
|
|
||||||
}
|
|
||||||
}, [permissions])
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="select-none">
|
<div className="select-none">
|
||||||
<div
|
<div
|
||||||
|
|
|
||||||
|
|
@ -1,4 +1,4 @@
|
||||||
import React from 'react'
|
import React, { useEffect, useState } from 'react'
|
||||||
import {
|
import {
|
||||||
DndContext,
|
DndContext,
|
||||||
DragOverlay,
|
DragOverlay,
|
||||||
|
|
@ -17,6 +17,9 @@ import {
|
||||||
} from '@dnd-kit/sortable'
|
} from '@dnd-kit/sortable'
|
||||||
import { MenuItemComponent } from './MenuItemComponent'
|
import { MenuItemComponent } from './MenuItemComponent'
|
||||||
import { MenuItem } from '@/@types/menu'
|
import { MenuItem } from '@/@types/menu'
|
||||||
|
import { getPermissionsList } from '@/services/identity.service'
|
||||||
|
import { PermissionDefinitionRecord } from '@/proxy/admin/models'
|
||||||
|
import { SelectBoxOption } from '@/shared/types'
|
||||||
|
|
||||||
interface SortableMenuTreeProps {
|
interface SortableMenuTreeProps {
|
||||||
items: MenuItem[]
|
items: MenuItem[]
|
||||||
|
|
@ -31,6 +34,7 @@ export const SortableMenuTree: React.FC<SortableMenuTreeProps> = ({
|
||||||
isDesignMode,
|
isDesignMode,
|
||||||
refetch,
|
refetch,
|
||||||
}) => {
|
}) => {
|
||||||
|
const [permissions, setPermissions] = useState<SelectBoxOption[]>([])
|
||||||
const [activeItem, setActiveItem] = React.useState<MenuItem | null>(null)
|
const [activeItem, setActiveItem] = React.useState<MenuItem | null>(null)
|
||||||
|
|
||||||
const sensors = useSensors(
|
const sensors = useSensors(
|
||||||
|
|
@ -170,10 +174,26 @@ export const SortableMenuTree: React.FC<SortableMenuTreeProps> = ({
|
||||||
onItemsChange(finalItems)
|
onItemsChange(finalItems)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const fetchPermissions = async () => {
|
||||||
|
const response = await getPermissionsList()
|
||||||
|
if (response.data) {
|
||||||
|
setPermissions(
|
||||||
|
response.data.map((p: PermissionDefinitionRecord) => ({
|
||||||
|
value: p.name,
|
||||||
|
label: p.name,
|
||||||
|
})),
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
fetchPermissions()
|
||||||
|
}, [])
|
||||||
|
|
||||||
const renderMenuItem = (item: MenuItem, depth: number = 0): React.ReactNode => {
|
const renderMenuItem = (item: MenuItem, depth: number = 0): React.ReactNode => {
|
||||||
return (
|
return (
|
||||||
<div key={item.id}>
|
<div key={item.id}>
|
||||||
<MenuItemComponent item={item} isDesignMode={isDesignMode} depth={depth} refetch={refetch}>
|
<MenuItemComponent item={item} isDesignMode={isDesignMode} depth={depth} refetch={refetch} permissions={permissions}>
|
||||||
{Array.isArray(item.children) && item.children.length > 0 && (
|
{Array.isArray(item.children) && item.children.length > 0 && (
|
||||||
<SortableContext
|
<SortableContext
|
||||||
items={item.children
|
items={item.children
|
||||||
|
|
@ -208,6 +228,7 @@ export const SortableMenuTree: React.FC<SortableMenuTreeProps> = ({
|
||||||
depth={0}
|
depth={0}
|
||||||
isDragOverlay={true}
|
isDragOverlay={true}
|
||||||
refetch={refetch}
|
refetch={refetch}
|
||||||
|
permissions={permissions}
|
||||||
/>
|
/>
|
||||||
) : null}
|
) : null}
|
||||||
</DragOverlay>
|
</DragOverlay>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue