Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 3476 | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 3476 Rev 3611
Línea 1... Línea 1...
1 
import React, { useState } from 'react';
 1 
import React from 'react';
2 
import { useSelector } from 'react-redux';
 2 
import { useSelector } from 'react-redux';
3 
import { IconButton, Menu, MenuItem, styled, Typography } from '@mui/material';
 - 
 
4 
import { MoreVert } from '@mui/icons-material';
 3 
import { Typography } from '@mui/material';
Línea 5... Línea 4...
5 
 
 4 
 
Línea 6... Línea 5...
6 
import { parse } from '@app/utils';
 5 
import { parse } from '@app/utils';
7 
 
 - 
 
8 
import { Card, CardContent, CardMedia } from '@shared/components';
 - 
 
9 
 
 - 
 
10 
const OptionsButton = styled(IconButton)(({ theme }) => ({
 - 
 
11 
  position: 'absolute',
 - 
 
12 
  top: theme.spacing(1),
 - 
 
13 
  right: theme.spacing(1),
 - 
 
Línea 14... Línea 6...
14 
  zIndex: 1
 6 
 
15 
}));
 7 
import { Card, CardContent, CardHeader, CardMedia, Menu } from '@shared/components';
16 
 
 8 
 
17 
export function KnowledgeCard({
 9 
export function KnowledgeCard({
18 
  knowledge: { category, description, image, title },
 10 
  knowledge: { category, description, image, title },
19 
  onClick,
 11 
  onClick,
20 
  onEdit,
 12 
  onEdit,
21 
  onDelete
 - 
 
22 
}) {
 - 
 
23 
  const labels = useSelector(({ intl }) => intl.labels);
 - 
 
24 
  const [anchorEl, setAnchorEl] = useState();
 - 
 
25 
  const open = Boolean(anchorEl);
 - 
 
26 
 
 - 
 
27 
  const handleClick = (event) => {
 - 
 
28 
    event.stopPropagation();
 - 
 
29 
    setAnchorEl(event.currentTarget);
 - 
 
30 
  };
 - 
 
31 
 
 - 
 
32 
  const handleClose = (event) => {
 - 
 
33 
    event.stopPropagation();
 - 
 
34 
    setAnchorEl(null);
 - 
 
35 
  };
 - 
 
36 
 
 - 
 
37 
  const handleMenuItemClick = (onClick, event) => {
 - 
 
38 
    event.stopPropagation();
 - 
 
Línea 39... Línea 13...
39 
    handleClose();
 13 
  onDelete
40 
    onClick();
 14 
}) {
41 
  };
 - 
 
42 
 
 15 
  const labels = useSelector(({ intl }) => intl.labels);
43 
  return (
 16 
 
44 
    <Card onClick={onClick} styles={{ cursor: 'pointer' }}>
 17 
  return (
45 
      <OptionsButton onClick={handleClick}>
 - 
 
46 
        <MoreVert />
 - 
 
47 
      </OptionsButton>
 18 
    <Card onClick={onClick} styles={{ cursor: 'pointer' }}>
48 
      <Menu
 - 
 
49 
        anchorEl={anchorEl}
 - 
 
50 
        open={open}
 19 
      <CardHeader
51 
        onClose={handleClose}
 20 
        renderAction={() => (
52 
        anchorOrigin={{
 - 
 
53 
          vertical: 'bottom',
 - 
 
54 
          horizontal: 'left'
 - 
 
55 
        }}
 21 
          <Menu>
56 
        transformOrigin={{
 22 
            <Menu.Item onClick={onEdit}>{labels.edit}</Menu.Item>
57 
          vertical: 'top',
 - 
 
58 
          horizontal: 'right'
 - 
 
59 
        }}
 - 
 
60 
      >
 - 
 
61 
        <MenuItem onClick={(event) => handleMenuItemClick(onEdit, event)}>{labels.edit}</MenuItem>
 - 
 
Línea 62... Línea 23...
62 
        <MenuItem onClick={(event) => handleMenuItemClick(onDelete, event)}>
 23 
            <Menu.Item onClick={onDelete}>{labels.delete}</Menu.Item>
Línea 63... Línea 24...
63 
          {labels.delete}
 24 
          </Menu>
64 
        </MenuItem>
 25 
        )}