Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 7320 | Rev 7323 | Ir a la última revisión | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 7320 Rev 7322
Línea 7... Línea 7...
7 
import TextBox from './TextBox'
 7 
import TextBox from './TextBox'
8 
import ChatList from './ChatList'
 8 
import ChatList from './ChatList'
9 
import EmptySection from '../../UI/EmptySection'
 9 
import EmptySection from '../../UI/EmptySection'
10 
import ConfirmModal from '../../modals/ConfirmModal'
 10 
import ConfirmModal from '../../modals/ConfirmModal'
11 
import ConferenceModal from '../../modals/ConferenceModal'
 11 
import ConferenceModal from '../../modals/ConferenceModal'
12 
import { Avatar, IconButton } from '@mui/material'
 12 
import { Avatar, Icon, IconButton } from '@mui/material'
13 
import { Add } from '@mui/icons-material'
 13 
import { Add, ArrowBackIos } from '@mui/icons-material'
- 
 
 14 
import SearchInput from '../../UI/SearchInput'
Línea 14... Línea 15...
14 
 
 15 
 
15 
const StyledShowOptions = styled.div`
 16 
const StyledShowOptions = styled.div`
16 
  height: 342px;
 17 
  height: 342px;
17 
  flex-direction: column;
 18 
  flex-direction: column;
Línea 39... Línea 40...
39 
      &__icon {
 40 
      &__icon {
40 
        margin-right: 0.3rem;
 41 
        margin-right: 0.3rem;
41 
      }
 42 
      }
42 
    }
 43 
    }
43 
  }
 44 
  }
44 
  .addPersonToGroupTab {
 45 
  .contact-tab {
- 
 
 46 
    align-items: center;
- 
 
 47 
    border-bottom: 1px solid #e2e2e2;
45 
    display: flex;
 48 
    display: flex;
46 
    flex-direction: column;
 49 
    flex-direction: column;
- 
 
 50 
    justify-content: space-between;
- 
 
 51 
    padding: 0.2rem 0.5rem;
47 
    &__person {
 52 
    .info {
48 
      display: flex;
 53 
      display: flex;
49 
      justify-content: space-between;
 - 
 
50 
      align-items: center;
 54 
      align-items: center;
51 
      padding: 0.2rem 0.5rem;
 55 
      gap: 0.5rem;
52 
      border-bottom: 1px solid #e2e2e2;
 - 
 
53 
    }
 56 
    }
54 
  }
 57 
  }
55 
`
 58 
`
Línea 56... Línea 59...
56 
 
 59 
 
Línea 323... Línea 326...
323 
        </li>
 326 
        </li>
324 
      </ul>
 327 
      </ul>
325 
    ),
 328 
    ),
326 
    addContacts: (
 329 
    addContacts: (
327 
      <>
 330 
      <>
328 
        {!availableContactsToAdd.length ? (
 331 
        {availableContactsToAdd.length ? (
- 
 
 332 
          <>
329 
          <EmptySection message={labels.not_contacts} />
 333 
            <IconButton onClick={() => showOptions(OPTIONS.INITIAL)}>
- 
 
 334 
              <ArrowBackIos />
330 
        ) : (
 335 
            </IconButton>
331 
          <ul>
 336 
            <ul>
332 
            {availableContactsToAdd.map(({ image, name, id }) => (
 337 
              {availableContactsToAdd.map(({ image, name, id }) => (
333 
              <li key={id}>
 338 
                <li key={id}>
334 
                <div className="addPersonToGroupTab__person">
 339 
                  <div className="contact-tab">
335 
                  <div className="d-inline-flex" style={{ gap: '5px' }}>
 340 
                    <div className="info">
336 
                    <Avatar
 341 
                      <Avatar
337 
                      src={image}
 342 
                        src={image}
338 
                      alt={`${name} profile image`}
 343 
                        alt={`${name} profile image`}
339 
                      sx={{
 344 
                        sx={{
340 
                        height: '36px',
 345 
                          height: '36px',
341 
                        width: '36px',
 346 
                          width: '36px',
342 
                      }}
 347 
                        }}
343 
                    />
 348 
                      />
344 
                    <span>{name}</span>
 349 
                      <span>{name}</span>
- 
 
 350 
                    </div>
- 
 
 351 
                    <IconButton onClick={() => handleAddPersonToGroup(id)}>
- 
 
 352 
                      <Add />
- 
 
 353 
                    </IconButton>
345 
                  </div>
 354 
                  </div>
346 
                  <IconButton onClick={() => handleAddPersonToGroup(id)}>
 - 
 
347 
                    <Add />
 355 
                </li>
348 
                  </IconButton>
 356 
              ))}
349 
                </div>
 357 
            </ul>
350 
              </li>
 358 
          </>
351 
            ))}
 359 
        ) : (
352 
          </ul>
 360 
          <EmptySection message={labels.not_contacts} />
353 
        )}
 361 
        )}
354 
      </>
 362 
      </>
355 
    ),
 363 
    ),
356 
    listContacts: (
 364 
    listContacts: (
357 
      <>
 365 
      <>
358 
        <div className="group__search">
 366 
        <IconButton onClick={() => showOptions(OPTIONS.INITIAL)}>
359 
          <SearchIcon />
 367 
          <ArrowBackIos />
360 
          <input
 368 
        </IconButton>
361 
            type="text"
 - 
 
362 
            placeholder={labels.search}
 - 
 
363 
            onChange={(e) => setSearch(e.target.value)}
 369 
        <SearchInput onChange={(e) => setSearch(e.target.value)} />
364 
          />
 - 
 
365 
        </div>
 - 
 
366 
        {filtredGroupList.length ? (
 370 
        {filtredGroupList.length ? (
- 
 
 371 
          <ul>
- 
 
 372 
            {filtredGroupList.map(
367 
          filtredGroupList.map(({ image, name, url_remove_from_group, id }) => {
 373 
              ({ image, name, url_remove_from_group, id }) => {
368 
            return (
 374 
                return (
- 
 
 375 
                  <li key={id}>
369 
              <div className="addPersonToGroupTab__person" key={id}>
 376 
                    <div className="contact-tab">
370 
                <div style={{ display: 'flex', alignItems: 'center' }}>
 377 
                      <div className="info">
371 
                  <img
 378 
                        <Avatar
- 
 
 379 
                          src={image}
372 
                    className="chat-image img-circle pull-left"
 380 
                          alt={`${name} profile image`}
373 
                    height="36"
 381 
                          sx={{
374 
                    width="36"
 382 
                            height: '36px',
375 
                    src={image}
 383 
                            width: '36px',
376 
                    alt="image-image"
 384 
                          }}
377 
                  />
 385 
                        />
378 
                  <div className="name">{name}</div>
 386 
                        <span>{name}</span>
379 
                </div>
 387 
                      </div>
380 
                {url_remove_from_group && (
 388 
                      {url_remove_from_group && (
381 
                  <span
 389 
                        <IconButton
382 
                    className="cursor-pointer"
 - 
 
383 
                    onClick={() =>
 390 
                          onClick={() =>
384 
                      handleDeletePersonFromGroup(url_remove_from_group)
 391 
                            handleDeletePersonFromGroup(url_remove_from_group)
385 
                    }
 392 
                          }
386 
                  >
 393 
                        >
387 
                    <i className="fa fa-user-times" />
 394 
                          <i className="fa fa-user-times" />
- 
 
 395 
                        </IconButton>
- 
 
 396 
                      )}
- 
 
 397 
                    </div>
388 
                  </span>
 398 
                  </li>
389 
                )}
 399 
                )
390 
              </div>
 400 
              }
391 
            )
 401 
            )}
392 
          })
 402 
          </ul>
393 
        ) : (
 403 
        ) : (
394 
          <div className="addPersonToGroupTab__person">
 - 
 
395 
            {labels.not_contacts}
 404 
          <EmptySection message={labels.not_contacts} />
396 
          </div>
 - 
 
397 
        )}
 405 
        )}
398 
      </>
 406 
      </>
399 
    ),
 407 
    ),
400 
  }
 408 
  }