Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev 7062 Rev 7065
Línea 1... Línea 1...
1 
import React, { useEffect, useRef, useState } from 'react'
 1 
import React, { useEffect, useRef, useState } from 'react'
2 
import { useDispatch, useSelector } from 'react-redux'
 2 
import { useDispatch, useSelector } from 'react-redux'
3 
import { Card, Col, Container, Row } from 'react-bootstrap'
 3 
import { Col, Container, Row } from 'react-bootstrap'
4 
import { axios, debounce, jsonToParams } from '../../utils'
 4 
import { axios, debounce, jsonToParams } from '../../utils'
5 
import { addNotification } from '../../redux/notification/notification.actions'
 5 
import { addNotification } from '../../redux/notification/notification.actions'
6 
import styled from 'styled-components'
 6 
import styled from 'styled-components'
Línea 7... Línea 7...
7 
 
 7 
 
8 
import SearchInput from '../../components/UI/SearchInput'
 8 
import SearchInput from '../../components/UI/SearchInput'
9 
import EmptySection from '../../components/UI/EmptySection'
 9 
import EmptySection from '../../components/UI/EmptySection'
10 
import WidgetLayout from '../../components/widgets/WidgetLayout'
 10 
import WidgetLayout from '../../components/widgets/WidgetLayout'
11 
import PaginationComponent from '../../components/UI/PaginationComponent'
 11 
import PaginationComponent from '../../components/UI/PaginationComponent'
12 
import {
 - 
 
13 
  CardActions,
 - 
 
14 
  CardContent,
 - 
 
15 
  CardMedia,
 - 
 
16 
  IconButton,
 - 
 
17 
  Typography,
 - 
 
18 
} from '@mui/material'
 - 
 
19 
import { Delete, Edit } from '@mui/icons-material'
 12 
 
20 
import KnowledgeEditModal from '../../components/knowledge/KnowledgeEditModal'
 13 
import KnowledgeEditModal from '../../components/knowledge/KnowledgeEditModal'
21 
import ConfirmModal from '../../components/modals/ConfirmModal'
 14 
import ConfirmModal from '../../components/modals/ConfirmModal'
Línea 22... Línea 15...
22 
import { Link } from 'react-router-dom'
 15 
import KnowledgeItem from './KnowledgeItem'
23 
 
 16 
 
24 
const KnowledgeCategories = styled(WidgetLayout)`
 17 
const KnowledgeCategories = styled(WidgetLayout)`
25 
  padding: 1rem;
 18 
  padding: 1rem;
Línea 41... Línea 34...
41 
  display: grid;
 34 
  display: grid;
42 
  grid-template-columns: repeat(auto-fit, 250px);
 35 
  grid-template-columns: repeat(auto-fit, 250px);
43 
  gap: 1rem;
 36 
  gap: 1rem;
44 
`
 37 
`
Línea 45... Línea -...
45 
 
 - 
 
46 
const KnowledgeCard = styled(Card)`
 - 
 
47 
  background-color: var(--bg-color);
 - 
 
48 
  border-radius: var(--border-radius);
 - 
 
49 
  overflow: hidden;
 - 
 
50 
  height: fit-content;
 - 
 
51 
`
 - 
 
52 
 
 38 
 
53 
const KnowledgeSearch = styled(SearchInput)`
 39 
const KnowledgeSearch = styled(SearchInput)`
54 
  background-color: var(--bg-color);
 40 
  background-color: var(--bg-color);
Línea 55... Línea 41...
55 
`
 41 
`
Línea 224... Línea 210...
224 
            />
 210 
            />
Línea 225... Línea 211...
225 
 
 211 
 
226 
            <KnowledgeGrid className="mt-3">
 212 
            <KnowledgeGrid className="mt-3">
227 
              {knowledges.length ? (
 213 
              {knowledges.length ? (
228 
                knowledges.map((knowledge, index) => (
 214 
                knowledges.map((knowledge, index) => (
229 
                  <Item
 215 
                  <KnowledgeItem
230 
                    key={index}
 216 
                    key={index}
231 
                    {...knowledge}
 217 
                    {...knowledge}
232 
                    onEdit={editKnowledge}
 218 
                    onEdit={editKnowledge}
233 
                    onDelete={deleteKnowledge}
 219 
                    onDelete={deleteKnowledge}
Línea 270... Línea 256...
270 
      />
 256 
      />
271 
    </>
 257 
    </>
272 
  )
 258 
  )
273 
}
 259 
}
Línea 274... Línea -...
274 
 
 - 
 
275 
const Item = ({
 - 
 
276 
  link_delete,
 - 
 
277 
  link_view,
 - 
 
278 
  link_edit,
 - 
 
279 
  category,
 - 
 
280 
  description,
 - 
 
281 
  image,
 - 
 
282 
  title,
 - 
 
283 
  onEdit,
 - 
 
284 
  onDelete,
 - 
 
285 
}) => {
 - 
 
286 
  return (
 - 
 
287 
    <>
 - 
 
288 
      <KnowledgeCard>
 - 
 
289 
        <CardMedia
 - 
 
290 
          component="img"
 - 
 
291 
          height="194"
 - 
 
292 
          image={image}
 - 
 
293 
          alt={`${title} image`}
 - 
 
294 
        />
 - 
 
295 
        <CardContent>
 - 
 
296 
          <Link to={link_view}>
 - 
 
297 
            <Typography variant="h5">{title}</Typography>
 - 
 
298 
          </Link>
 - 
 
299 
          <Typography variant="subtitle1" color="text.secondary">
 - 
 
300 
            {category}
 - 
 
301 
          </Typography>
 - 
 
302 
          <Typography variant="body2" color="text.secondary">
 - 
 
303 
            {description}
 - 
 
304 
          </Typography>
 - 
 
305 
        </CardContent>
 - 
 
306 
        <CardActions disableSpacing>
 - 
 
307 
          {link_edit && (
 - 
 
308 
            <IconButton aria-label="edit" onClick={() => onEdit(link_edit)}>
 - 
 
309 
              <Edit />
 - 
 
310 
            </IconButton>
 - 
 
311 
          )}
 - 
 
312 
          {link_delete && (
 - 
 
313 
            <IconButton
 - 
 
314 
              aria-label="delete"
 - 
 
315 
              onClick={() => onDelete(link_delete)}
 - 
 
316 
            >
 - 
 
317 
              <Delete />
 - 
 
318 
            </IconButton>
 - 
 
319 
          )}
 - 
 
320 
        </CardActions>
 - 
 
321 
      </KnowledgeCard>
 - 
 
322 
    </>
 - 
 
323 
  )
 - 
 
324 
}
 - 
 
325 
 
 260