Proyectos de Subversion LeadersLinked - SPA

Rev

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

Rev 3017 Rev 3018
Línea 7... Línea 7...
7 
import { updateFeed } from '@store/feed/feed.actions'
 7 
import { updateFeed } from '@store/feed/feed.actions'
8 
import { addNotification } from '@store/notification/notification.actions'
 8 
import { addNotification } from '@store/notification/notification.actions'
Línea 9... Línea 9...
9 
 
 9 
 
10 
import styles from './survey.module.scss'
 10 
import styles from './survey.module.scss'
- 
 
 11 
import Widget from '@components/UI/Widget'
Línea 11... Línea 12...
11 
import Widget from '@components/UI/Widget'
 12 
import CheckboxInput from '@components/UI/inputs/Checkbox'
12 
 
 13 
 
13 
const RadioButton = styled('div')`
 14 
const AnswerContainer = styled('div')`
14 
  display: flex;
 15 
  display: flex;
15 
  align-items: center;
 16 
  align-items: center;
16 
  gap: 0.5rem;
 17 
  gap: 0.5rem;
Línea 20... Línea 21...
20 
  cursor: pointer;
 21 
  cursor: pointer;
21 
  transition: all 200ms ease;
 22 
  transition: all 200ms ease;
22 
  position: relative;
 23 
  position: relative;
23 
  overflow: hidden;
 24 
  overflow: hidden;
24 
  margin-bottom: 0.5rem;
 25 
  margin-bottom: 0.5rem;
25 
  input {
 - 
 
26 
    margin: 0 !important;
 - 
 
27 
  }
 - 
 
28 
  label {
 - 
 
29 
    color: var(--font-color);
 - 
 
30 
    font-weight: 500;
 - 
 
31 
  }
 - 
 
32 
  &::before {
 - 
 
33 
    content: '';
 - 
 
34 
    position: absolute;
 - 
 
35 
    left: 0;
 - 
 
36 
    top: 0;
 - 
 
37 
    height: 100%;
 - 
 
38 
    width: ${(props) => (props.porcentage ? `${props.porcentage}%` : '0%')};
 - 
 
39 
    background-color: #0002;
 - 
 
40 
    z-index: 4;
 - 
 
41 
  }
 - 
 
42 
  &:hover {
 26 
  &:hover {
43 
    border-color: var(--font-color);
 27 
    border-color: var(--font-color);
44 
    text-shadow: 0 0 1px var(--font-color);
 28 
    text-shadow: 0 0 1px var(--font-color);
45 
  }
 29 
  }
46 
`
 30 
`
Línea 47... Línea -...
47 
 
 - 
 
48 
const VoteTag = styled('span')`
 - 
 
49 
  position: absolute;
 - 
 
50 
  bottom: 1rem;
 - 
 
51 
  right: 1rem;
 - 
 
52 
  color: var(--font-color) !important;
 - 
 
53 
  font-weight: 600;
 - 
 
54 
`
 - 
 
55 
 
 31 
 
56 
const SurveyForm = ({
 32 
const SurveyForm = ({
57 
  active = false,
 33 
  active = false,
58 
  question = '¿Cómo consideras el ambiente laboral?',
 34 
  question = '¿Cómo consideras el ambiente laboral?',
59 
  answers = [],
 35 
  answers = [],
60 
  votes = [],
 36 
  votes = [],
61 
  time = 0,
 37 
  time = 0,
62 
  voteUrl = '/feed/vote/d454717c-ba6f-485c-b94c-4fbb5f5bed94',
 38 
  voteUrl = '/feed/vote/d454717c-ba6f-485c-b94c-4fbb5f5bed94',
63 
  resultType = 'pu'
 39 
  resultType = 'pu'
64 
}) => {
 40 
}) => {
Línea 65... Línea 41...
65 
  const { register, handleSubmit } = useForm()
 41 
  const { control, handleSubmit } = useForm()
66 
 
 42 
 
67 
  const sendVote = handleSubmit(({ vote }) => {
 43 
  const sendVote = handleSubmit(({ vote }) => {
Línea 123... Línea 99...
123 
        <form onChange={sendVote} className={styles.survey_form}>
 99 
        <form onChange={sendVote} className={styles.survey_form}>
124 
          {answers.map((answer, index) => {
 100 
          {answers.map((answer, index) => {
125 
            if (answer === null) return null
 101 
            if (answer === null) return null
Línea 126... Línea 102...
126 
 
 102 
 
127 
            return (
 103 
            return (
128 
              <RadioButton key={answer}>
 104 
              <AnswerContainer key={answer}>
129 
                <input
 - 
 
130 
                  type='radio'
 105 
                <CheckboxInput
131 
                  name='vote'
 - 
 
132 
                  ref={register({ required: true })}
 106 
                  name='vote'
- 
 
 107 
                  value={index + 1}
- 
 
 108 
                  label={answer}
133 
                  value={index + 1}
 109 
                  control={control}
134 
                />
 - 
 
- 
 
 110 
                />
135 
                <label htmlFor={`vote-${index + 1}`}>{answer}</label>
 111 
 
136 
                {/*  {!!totalVotes && (
 112 
                {/*  {!!totalVotes && (
137 
              <span className='mb-0'>
 113 
              <span className='mb-0'>
138 
                {getPorcentage(votes[index], totalVotes)}%
 114 
                {getPorcentage(votes[index], totalVotes)}%
139 
              </span>
 115 
              </span>
140 
            )} */}
 116 
            )} */}
141 
              </RadioButton>
 117 
              </AnswerContainer>
142 
            )
 118 
            )
- 
 
 119 
          })}
143 
          })}
 120 
 
- 
 
 121 
          <Typography variant='overline'>Tiempo restante: </Typography>
- 
 
 122 
 
- 
 
 123 
          {!active && (
144 
          <span>Tiempo restante: </span>
 124 
            <Typography variant='overline'>
- 
 
 125 
              El formulario ya ha finalizado
- 
 
 126 
            </Typography>
145 
          {!active && <VoteTag>El formulario ya ha finalizado</VoteTag>}
 127 
          )}
146 
        </form>
 128 
        </form>
147 
      </Widget.Body>
 129 
      </Widget.Body>
148 
    </Widget>
 130 
    </Widget>
149 
  )
 131 
  )