Proyectos de Subversion LeadersLinked - SPA

Rev

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

Rev 1437 Rev 1460
Línea 1... Línea 1...
1 
import React, { useEffect, useState } from 'react'
 1 
import React, { useEffect, useState } from 'react'
2 
import { Button, Form, Modal } from 'react-bootstrap'
 - 
 
3 
import { useDispatch, useSelector } from 'react-redux'
 2 
import { useDispatch, useSelector } from 'react-redux'
4 
import { CKEditor } from 'ckeditor4-react'
 - 
 
5 
import { CKEDITOR_OPTIONS, axios } from '../../utils'
 - 
 
6 
import { useForm } from 'react-hook-form'
 3 
import { useForm } from 'react-hook-form'
- 
 
 4 
import { CKEditor } from 'ckeditor4-react'
- 
 
 5 
import { Form } from 'react-bootstrap'
- 
 
 6 
 
- 
 
 7 
import { CKEDITOR_OPTIONS, axios } from 'utils/index'
7 
import { addNotification } from '../../redux/notification/notification.actions'
 8 
import { addNotification } from '../../redux/notification/notification.actions'
8 
import styled from 'styled-components'
 - 
 
Línea -... Línea 9...
- 
 
 9 
 
9 
 
 10 
import Modal from 'components/UI/modal/Modal'
10 
import Spinner from '../UI/Spinner'
 11 
import Spinner from 'components/UI/Spinner'
11 
import TagsInput from '../UI/TagsInput'
 12 
import TagsInput from 'components/UI/TagsInput'
12 
import FormErrorFeedback from '../UI/form/FormErrorFeedback'
 - 
 
13 
 
 - 
 
14 
const TagsContainer = styled.div`
 - 
 
15 
  padding: 0.5rem;
 - 
 
16 
  border: 1px solid var(--border-primary);
 - 
 
17 
  border-radius: var(--border-radius);
 - 
 
18 
  margin-top: 1rem;
 - 
 
Línea 19... Línea 13...
19 
`
 13 
import FormErrorFeedback from 'components/UI/form/FormErrorFeedback'
20 
 
 14 
 
21 
const QuestionModal = ({ show, url, isEdit, onClose, onComplete }) => {
 15 
const QuestionModal = ({ show, url, isEdit, onClose, onComplete }) => {
22 
  const [loading, setLoading] = useState(false)
 16 
  const [loading, setLoading] = useState(false)
Línea 135... Línea 129...
135 
      setValue('title', '')
 129 
      setValue('title', '')
136 
    }
 130 
    }
137 
  }, [show])
 131 
  }, [show])
Línea 138... Línea 132...
138 
 
 132 
 
139 
  return (
 - 
 
140 
    <Modal show={show}>
 - 
 
141 
      <Modal.Header className='pb-0'>
 133 
  return (
142 
        <Modal.Title>
 134 
    <Modal
143 
          {isEdit ? labels.edit : labels.add} {labels.question}
 - 
 
144 
        </Modal.Title>
 - 
 
145 
      </Modal.Header>
 135 
      title={`${isEdit ? labels.edit : labels.add} ${labels.question}`}
146 
      <Modal.Body>
 136 
      show={show}
147 
        {loading ? (
 137 
      onClose={onClose}
148 
          <Spinner />
 138 
      onAccept={onSubmit}
149 
        ) : (
 - 
 
150 
          <Form onSubmit={onSubmit}>
 139 
    >
151 
            <Form.Group>
 140 
      <Form.Group>
152 
              <Form.Label>{labels.title}</Form.Label>
 141 
        <Form.Label>{labels.title}</Form.Label>
153 
              <Form.Control
 142 
        <Form.Control
154 
                type='text'
 143 
          type='text'
155 
                name='title'
 144 
          name='title'
156 
                ref={register({ required: true })}
 145 
          ref={register({ required: true })}
157 
              />
 - 
 
158 
              {errors.title && (
 - 
 
159 
                <FormErrorFeedback>
 - 
 
160 
                  {labels.error_field_empty}
 - 
 
161 
                </FormErrorFeedback>
 - 
 
162 
              )}
 - 
 
163 
            </Form.Group>
 146 
        />
164 
 
 - 
 
165 
            <CKEditor
 - 
 
166 
              onChange={(e) => setValue('description', e.editor.getData())}
 - 
 
167 
              onInstanceReady={(e) =>
 - 
 
168 
                e.editor.setData(getValues('description'))
 - 
 
169 
              }
 - 
 
170 
              config={CKEDITOR_OPTIONS}
 - 
 
171 
            />
 147 
 
172 
            {errors.description && (
 148 
        {errors.title && (
173 
              <FormErrorFeedback>{labels.error_field_empty}</FormErrorFeedback>
 - 
 
174 
            )}
 - 
 
175 
 
 - 
 
176 
            <TagsContainer>
 - 
 
177 
              <TagsInput
 - 
 
178 
                suggestions={questionsCategories}
 - 
 
179 
                settedTags={currentCategories}
 - 
 
180 
                onChange={onTagsChange}
 - 
 
181 
              />
 - 
 
182 
            </TagsContainer>
 - 
 
183 
 
 - 
 
184 
            <Button className='mt-3 mr-2' variant='primary' type='submit'>
 - 
 
185 
              {labels.accept}
 - 
 
186 
            </Button>
 - 
 
187 
            <Button className='btn-secondary mt-3' onClick={onClose}>
 - 
 
188 
              {labels.cancel}
 - 
 
189 
            </Button>
 - 
 
190 
          </Form>
 149 
          <FormErrorFeedback>{labels.error_field_empty}</FormErrorFeedback>
191 
        )}
 150 
        )}
- 
 
 151 
      </Form.Group>
- 
 
 152 
 
- 
 
 153 
      <CKEditor
- 
 
 154 
        onChange={(e) => setValue('description', e.editor.getData())}
- 
 
 155 
        onInstanceReady={(e) => e.editor.setData(getValues('description'))}
- 
 
 156 
        config={CKEDITOR_OPTIONS}
- 
 
 157 
      />
- 
 
 158 
      {errors.description && (
- 
 
 159 
        <FormErrorFeedback>{labels.error_field_empty}</FormErrorFeedback>
- 
 
 160 
      )}
- 
 
 161 
 
- 
 
 162 
      <TagsInput
- 
 
 163 
        suggestions={questionsCategories}
- 
 
 164 
        settedTags={currentCategories}
- 
 
 165 
        onChange={onTagsChange}
- 
 
 166 
      />
- 
 
 167 
 
192 
      </Modal.Body>
 168 
      {loading && <Spinner />}
193 
    </Modal>
 169 
    </Modal>
194 
  )
 170 
  )
Línea 195... Línea 171...
195 
}
 171 
}