Proyectos de Subversion LeadersLinked - SPA

Rev

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

Rev 3432 Rev 3677
Línea 1... Línea 1...
1 
import React, { useRef, useState } from "react";
 1 
import React, { useRef, useState } from 'react';
2 
import { axios } from "../../utils";
 2 
import { axios } from '../../utils';
3 
import { Avatar } from "@mui/material";
 3 
import { Avatar } from '@mui/material';
4 
import { useNavigate } from "react-router-dom";
 4 
import { useNavigate } from 'react-router-dom';
5 
import { addNotification } from "store/notification/notification.actions";
 5 
import { addNotification } from 'store/notification/notification.actions';
6 
import { useDispatch, useSelector } from "react-redux";
 6 
import { useDispatch, useSelector } from 'react-redux';
7 
import styled from "styled-components";
 7 
import styled from 'styled-components';
8 
 
 8 
 
9 
import Spinner from "../UI/Spinner";
 9 
import Spinner from '../UI/Spinner';
10 
import WidgetWrapper from "../widgets/WidgetLayout";
 10 
import WidgetWrapper from '../widgets/WidgetLayout';
11 
import ConfirmModal from "../modals/ConfirmModal";
 11 
import ConfirmModal from '../modals/ConfirmModal';
12 
import Button from "../UI/buttons/Buttons";
 12 
import Button from '../UI/buttons/Buttons';
Línea 13... Línea 13...
13 
 
 13 
 
14 
const StyledSpinnerContainer = styled.div`
 14 
const StyledSpinnerContainer = styled.div`
15 
  position: absolute;
 15 
  position: absolute;
16 
  left: 0;
 16 
  left: 0;
Línea 91... Línea 91...
91 
  btnAcceptTitle,
 91 
  btnAcceptTitle,
92 
  btnCancelTitle,
 92 
  btnCancelTitle,
93 
  btnEditTitle,
 93 
  btnEditTitle,
94 
  btnLeaveTitle,
 94 
  btnLeaveTitle,
95 
  btnRemoveLabel,
 95 
  btnRemoveLabel,
96 
  isTopData,
 96 
  isTopData
97 
}) => {
 97 
}) => {
98 
  const [isShowConfirmation, setIsShowConfirmation] = useState(false);
 98 
  const [isShowConfirmation, setIsShowConfirmation] = useState(false);
99 
  const [loading, setLoading] = useState(false);
 99 
  const [loading, setLoading] = useState(false);
100 
  const confirmUrl = useRef("");
 100 
  const confirmUrl = useRef('');
101 
  const labels = useSelector(({ intl }) => intl.labels);
 101 
  const labels = useSelector(({ intl }) => intl.labels);
102 
  const dispatch = useDispatch();
 102 
  const dispatch = useDispatch();
103 
  const navigate = useNavigate();
 103 
  const navigate = useNavigate();
Línea 104... Línea 104...
104 
 
 104 
 
105 
  const showConfirm = (url = "") => {
 105 
  const showConfirm = (url = '') => {
106 
    setIsShowConfirmation(true);
 106 
    setIsShowConfirmation(true);
107 
    confirmUrl.current = url;
 107 
    confirmUrl.current = url;
Línea 108... Línea 108...
108 
  };
 108 
  };
109 
 
 109 
 
110 
  const closeConfirm = () => {
 110 
  const closeConfirm = () => {
111 
    setIsShowConfirmation(false);
 111 
    setIsShowConfirmation(false);
Línea 112... Línea 112...
112 
    confirmUrl.current = "";
 112 
    confirmUrl.current = '';
113 
  };
 113 
  };
114 
 
 114 
 
115 
  const getImpersonateUrl = async (url = "") => {
 115 
  const getImpersonateUrl = async (url = '') => {
Línea 116... Línea 116...
116 
    try {
 116 
    try {
117 
      const response = await axios.get(url);
 117 
      const response = await axios.get(url);
118 
      const { data, success } = response.data;
 118 
      const { data, success } = response.data;
119 
 
 119 
 
120 
      if (success) {
 120 
      if (success) {
121 
        window.location.href = data;
 121 
        window.location.href = data;
122 
      }
 122 
      }
Línea 123... Línea 123...
123 
    } catch (error) {
 123 
    } catch (error) {
124 
      console.log(">>: error > ", error);
 124 
      console.log('>>: error > ', error);
Línea 132... Línea 132...
132 
      .then((response) => {
 132 
      .then((response) => {
133 
        const { success, data } = response.data;
 133 
        const { success, data } = response.data;
Línea 134... Línea 134...
134 
 
 134 
 
135 
        if (!success) {
 135 
        if (!success) {
136 
          const errorMessage =
 136 
          const errorMessage =
137 
            typeof data === "string"
 137 
            typeof data === 'string'
138 
              ? data
 138 
              ? data
Línea 139... Línea 139...
139 
              : "Error interno. Por favor, inténtelo de nuevo más tarde.";
 139 
              : 'Error interno. Por favor, inténtelo de nuevo más tarde.';
140 
 
 140 
 
141 
          dispatch(addNotification({ style: "danger", msg: errorMessage }));
 141 
          dispatch(addNotification({ style: 'danger', msg: errorMessage }));
Línea 142... Línea 142...
142 
          return;
 142 
          return;
143 
        }
 143 
        }
144 
 
 144 
 
145 
        if (fetchCallback) fetchCallback();
 145 
        if (fetchCallback) fetchCallback();
146 
        dispatch(addNotification({ style: "success", msg: data }));
 146 
        dispatch(addNotification({ style: 'success', msg: data }));
147 
      })
 147 
      })
148 
      .catch(() => {
 148 
      .catch(() => {
149 
        dispatch(
 149 
        dispatch(
150 
          addNotification({
 150 
          addNotification({
151 
            style: "error",
 151 
            style: 'error',
152 
            msg: "Error interno. Por favor, inténtelo de nuevo más tarde.",
 152 
            msg: 'Error interno. Por favor, inténtelo de nuevo más tarde.'
153 
          })
 153 
          })
154 
        );
 154 
        );
155 
      })
 155 
      })
156 
      .finally(() => {
 156 
      .finally(() => {
157 
        confirmUrl.current = "";
 157 
        confirmUrl.current = '';
Línea 158... Línea 158...
158 
        setLoading(false);
 158 
        setLoading(false);
Línea 166... Línea 166...
166 
      .then((response) => {
 166 
      .then((response) => {
167 
        const { data, success } = response.data;
 167 
        const { data, success } = response.data;
Línea 168... Línea 168...
168 
 
 168 
 
169 
        if (!success) {
 169 
        if (!success) {
170 
          const errorMessage =
 170 
          const errorMessage =
171 
            typeof data === "string"
 171 
            typeof data === 'string'
172 
              ? data
 172 
              ? data
Línea 173... Línea 173...
173 
              : "Error interno. Por favor, inténtelo de nuevo más tarde.";
 173 
              : 'Error interno. Por favor, inténtelo de nuevo más tarde.';
174 
 
 174 
 
175 
          dispatch(addNotification({ style: "danger", msg: errorMessage }));
 175 
          dispatch(addNotification({ style: 'danger', msg: errorMessage }));
Línea 176... Línea 176...
176 
          return;
 176 
          return;
177 
        }
 177 
        }
178 
 
 178 
 
179 
        if (fetchCallback) fetchCallback();
 179 
        if (fetchCallback) fetchCallback();
180 
        dispatch(addNotification({ style: "success", msg: data }));
 180 
        dispatch(addNotification({ style: 'success', msg: data }));
Línea 181... Línea 181...
181 
      })
 181 
      })
Línea 191... Línea 191...
191 
        if (!success) {
 191 
        if (!success) {
192 
          throw new Error(data);
 192 
          throw new Error(data);
193 
        }
 193 
        }
Línea 194... Línea 194...
194 
 
 194 
 
195 
        setTimeout(() => {
 195 
        setTimeout(() => {
196 
          window.open(data, "_backend");
 196 
          window.open(data, '_backend');
197 
        }, 0);
 197 
        }, 0);
198 
      })
 198 
      })
199 
      .catch((error) => {
 199 
      .catch((error) => {
200 
        console.log(">>: error > ", error);
 200 
        console.log('>>: error > ', error);
201 
      });
 201 
      });
Línea 202... Línea 202...
202 
  };
 202 
  };
203 
 
 203 
 
Línea 217... Línea 217...
217 
            {status && <span>{status}</span>}
 217 
            {status && <span>{status}</span>}
218 
            {isTopData && (
 218 
            {isTopData && (
219 
              <ul>
 219 
              <ul>
220 
                {link_view && (
 220 
                {link_view && (
221 
                  <li>
 221 
                  <li>
222 
                    <Button
 - 
 
223 
                      color="primary"
 - 
 
224 
                      onClick={() => navigateTo(link_view)}
 222 
                    <Button color='primary' onClick={() => navigateTo(link_view)}>
225 
                    >
 - 
 
226 
                      {btnAcceptTitle || labels.view_profile}
 223 
                      {btnAcceptTitle || labels.view_profile}
227 
                    </Button>
 224 
                    </Button>
228 
                  </li>
 225 
                  </li>
229 
                )}
 226 
                )}
230 
                {link_inmail && (
 227 
                {link_inmail && (
231 
                  <li>
 228 
                  <li>
232 
                    <Button
 - 
 
233 
                      color="secondary"
 - 
 
234 
                      onClick={() => navigateTo(link_inmail)}
 229 
                    <Button color='secondary' onClick={() => navigateTo(link_inmail)}>
235 
                    >
 - 
 
236 
                      {labels.message}
 230 
                      {labels.message}
237 
                    </Button>
 231 
                    </Button>
238 
                  </li>
 232 
                  </li>
239 
                )}
 233 
                )}
240 
              </ul>
 234 
              </ul>
241 
            )}
 235 
            )}
242 
          </StyledContent>
 236 
          </StyledContent>
243 
        </StyledHeader>
 237 
        </StyledHeader>
244 
        <Actions>
 238 
        <Actions>
245 
          {link_view && !isTopData ? (
 239 
          {link_view && !isTopData ? (
246 
            <Button color="primary" onClick={() => navigateTo(link_view)}>
 240 
            <Button color='primary' onClick={() => navigateTo(link_view)}>
247 
              {btnAcceptTitle || labels.view_profile}
 241 
              {btnAcceptTitle || labels.view_profile}
248 
            </Button>
 242 
            </Button>
249 
          ) : null}
 243 
          ) : null}
Línea 250... Línea 244...
250 
 
 244 
 
251 
          {link_edit ? (
 245 
          {link_edit ? (
252 
            <Button onClick={() => navigateTo(link_edit)} color="secondary">
 246 
            <Button onClick={() => navigateTo(link_edit)} color='secondary'>
253 
              {btnEditTitle || labels.edit}
 247 
              {btnEditTitle || labels.edit}
254 
            </Button>
 248 
            </Button>
Línea 255... Línea 249...
255 
          ) : null}
 249 
          ) : null}
256 
 
 250 
 
257 
          {link_accept ? (
 251 
          {link_accept ? (
258 
            <Button onClick={() => onConfirm(link_accept)} color="secondary">
 252 
            <Button onClick={() => onConfirm(link_accept)} color='secondary'>
259 
              {labels.accept}
 253 
              {labels.accept}
Línea 260... Línea 254...
260 
            </Button>
 254 
            </Button>
261 
          ) : null}
 255 
          ) : null}
262 
 
 256 
 
263 
          {link_inmail && !isTopData ? (
 257 
          {link_inmail && !isTopData ? (
264 
            <Button color="secondary" onClick={() => navigateTo(link_inmail)}>
 258 
            <Button color='secondary' onClick={() => navigateTo(link_inmail)}>
Línea 265... Línea 259...
265 
              {labels.message}
 259 
              {labels.message}
266 
            </Button>
 260 
            </Button>
267 
          ) : null}
 261 
          ) : null}
268 
 
 262 
 
269 
          {link_admin ? (
 263 
          {link_admin ? (
Línea 270... Línea 264...
270 
            <Button color="secondary" onClick={() => getManageUrl(link_admin)}>
 264 
            <Button color='secondary' onClick={() => getManageUrl(link_admin)}>
271 
              {labels.administrate}
 265 
              {labels.administrate}
272 
            </Button>
 266 
            </Button>
273 
          ) : null}
 267 
          ) : null}
274 
 
 268 
 
Línea 275... Línea 269...
275 
          {link_approve ? (
 269 
          {link_approve ? (
276 
            <Button color="secondary" onClick={() => onConfirm(link_approve)}>
 270 
            <Button color='secondary' onClick={() => onConfirm(link_approve)}>
277 
              {labels.approve}
 271 
              {labels.approve}
278 
            </Button>
 272 
            </Button>
279 
          ) : null}
 273 
          ) : null}
Línea 280... Línea 274...
280 
 
 274 
 
281 
          {link_unblock ? (
 275 
          {link_unblock ? (
282 
            <Button color="secondary" onClick={() => onConfirm(link_unblock)}>
 276 
            <Button color='secondary' onClick={() => onConfirm(link_unblock)}>
283 
              {labels.unblock}
 277 
              {labels.unblock}
284 
            </Button>
 278 
            </Button>
Línea 285... Línea 279...
285 
          ) : null}
 279 
          ) : null}
286 
 
 - 
 
287 
          {link_request ? (
 - 
 
288 
            <Button color="secondary" onClick={() => onConfirm(link_request)}>
 280 
 
289 
              {labels.connect}
 - 
 
290 
            </Button>
 281 
          {link_request ? (
291 
          ) : null}
 282 
            <Button color='secondary' onClick={() => onConfirm(link_request)}>
292 
 
 283 
              {labels.connect}
Línea 293... Línea 284...
293 
          {link_impersonate ? (
 284 
            </Button>
294 
            <Button
 285 
          ) : null}
295 
              color="secondary"
 286 
 
296 
              onClick={() => getImpersonateUrl(link_impersonate)}
 287 
          {link_impersonate ? (
297 
            >
 288 
            <Button color='secondary' onClick={() => getImpersonateUrl(link_impersonate)}>
Línea 298... Línea 289...
298 
              Personificar
 289 
              Personificar
299 
            </Button>
 290 
            </Button>
300 
          ) : null}
 291 
          ) : null}
301 
 
 292 
 
302 
          {link_remove ? (
 293 
          {link_remove ? (
Línea 303... Línea 294...
303 
            <Button color="info" onClick={() => showConfirm(link_remove)}>
 294 
            <Button color='info' onClick={() => showConfirm(link_remove)}>
304 
              {btnRemoveLabel}
 295 
              {btnRemoveLabel}
305 
            </Button>
 296 
            </Button>
306 
          ) : null}
 297 
          ) : null}
307 
 
 298 
 
Línea 308... Línea 299...
308 
          {link_reject ? (
 299 
          {link_reject ? (
309 
            <Button color="info" onClick={() => showConfirm(link_reject)}>
 300 
            <Button color='info' onClick={() => showConfirm(link_reject)}>
310 
              {labels.reject}
 301 
              {labels.reject}
311 
            </Button>
 302 
            </Button>
312 
          ) : null}
 303 
          ) : null}
Línea 313... Línea 304...
313 
 
 304 
 
314 
          {link_delete ? (
 305 
          {link_delete ? (
315 
            <Button color="info" onClick={() => showConfirm(link_delete)}>
 306 
            <Button color='info' onClick={() => showConfirm(link_delete)}>
316 
              {btnCancelTitle || labels.cancel}
 307 
              {btnCancelTitle || labels.cancel}
317 
            </Button>
 308 
            </Button>
Línea 318... Línea 309...
318 
          ) : null}
 309 
          ) : null}
319 
 
 310 
 
320 
          {link_unfollow ? (
 311 
          {link_unfollow ? (
321 
            <Button color="info" onClick={() => handleUnfollow(link_unfollow)}>
 312 
            <Button color='info' onClick={() => handleUnfollow(link_unfollow)}>
322 
              {labels.unfollow}
 313 
              {labels.unfollow}
Línea 323... Línea 314...
323 
            </Button>
 314 
            </Button>
324 
          ) : null}
 315 
          ) : null}
325 
 
 316 
 
326 
          {link_block ? (
 317 
          {link_block ? (
327 
            <Button color="info" onClick={() => showConfirm(link_block)}>
 318 
            <Button color='info' onClick={() => showConfirm(link_block)}>
328 
              {labels.block}
 319 
              {labels.block}
329 
            </Button>
 320 
            </Button>