Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev 1 Rev 1105
Línea 1... Línea 1...
1 
import React, { useEffect, useRef } from "react";
 1 
import React, { useEffect, useRef } from "react";
2 
import { useState } from "react";
 2 
import { useState } from "react";
3 
import { connect } from "react-redux";
 3 
import { connect } from "react-redux";
4 
import styled from "styled-components";
 4 
import styled from "styled-components";
5 
import {axios} from "../../../utils";
 5 
import { axios } from "../../../utils";
6 
import CompanyFollowersHelper from "../../../shared/helpers/company-followers-helper/CompanyFollowers";
 6 
import CompanyFollowersHelper from "../../../shared/helpers/company-followers-helper/CompanyFollowers";
7 
import parse from "html-react-parser";
 7 
import parse from "html-react-parser";
8 
import { addNotification } from "../../../redux/notification/notification.actions";
 8 
import { addNotification } from "../../../redux/notification/notification.actions";
9 
import Spinner from "../../../shared/loading-spinner/Spinner";
 9 
import Spinner from "../../../shared/loading-spinner/Spinner";
10 
import { setTimelineUrl } from "../../../redux/feed/feed.actions";
 10 
import { setTimelineUrl } from "../../../redux/feed/feed.actions";
Línea 57... Línea 57...
57 
  }, []);
 57 
  }, []);
58 
  const getSuggestionCompanies = async () => {
 58 
  const getSuggestionCompanies = async () => {
59 
    try {
 59 
    try {
60 
      setLoading(true);
 60 
      setLoading(true);
61 
      const response = await axios.get(`/helpers/company-suggestion/${companyId}`);
 61 
      const response = await axios.get(`/helpers/company-suggestion/${companyId}`);
62 
      if(response.data.success)
 62 
      if (response.data.success)
63 
        setSuggestionCompanies(response.data.data)
 63 
        setSuggestionCompanies(response.data.data)
64 
    } catch (error) {
 64 
    } catch (error) {
65 
      console.log('>>: error > ', error)
 65 
      console.log('>>: error > ', error)
66 
    }finally{
 66 
    } finally {
67 
      setLoading(false)
 67 
      setLoading(false)
68 
    }
 68 
    }
69 
  }
 69 
  }
Línea 70... Línea 70...
70 
 
 70 
 
71 
  const fetchAuthorizedLinks = async () => {
 71 
  const fetchAuthorizedLinks = async () => {
72 
    setLoading(true);
 72 
    setLoading(true);
73 
    const response = await axios.get(`/company/view/${companyId}`);
 73 
    const response = await axios.get(`/company/view/${companyId}`);
74 
    const resData = response.data;
 74 
    const resData = response.data;
75 
     (resData);
 75 
    (resData);
76 
    if (resData.success) {
 76 
    if (resData.success) {
77 
      setAuthorizedLinks(resData.data);
 77 
      setAuthorizedLinks(resData.data);
78 
      setFollowers(resData.data.total_followers);
 78 
      setFollowers(resData.data.total_followers);
79 
      if (resData.data.link_unfollow) {
 79 
      if (resData.data.link_unfollow) {
Línea 103... Línea 103...
103 
        msg: "ha ocurrido un error",
 103 
        msg: "ha ocurrido un error",
104 
      });
 104 
      });
105 
    }
 105 
    }
106 
  };
 106 
  };
107 
  const changeCurrentTab = (tab) => {
 107 
  const changeCurrentTab = (tab) => {
108 
     ('>>: tab> ', tab)
 108 
    ('>>: tab> ', tab)
109 
    setCurrentTab(tab)
 109 
    setCurrentTab(tab)
110 
  }
 110 
  }
111 
  return (
 111 
  return (
112 
    <React.Fragment>
 112 
    <React.Fragment>
113 
      <section className="cover-sec">
 113 
      <section className="cover-sec">
114 
        <img
 114 
        <img
115 
          id="user-cover-img"
 115 
          id="user-cover-img"
116 
          src={`/storage/type/company-cover/code/${companyId}/${
 116 
          src={`/storage/type/company-cover/code/${companyId}/${cover ? `filename/${cover}` : ""
117 
            cover ? `filename/${cover}` : ""
 - 
 
118 
          }`}
 117 
            }`}
119 
          alt="cover-image"
 118 
          alt="cover-image"
120 
        />
 119 
        />
121 
      </section>
 120 
      </section>
122 
      <main>
 121 
      <main>
123 
        <div className="main-section">
 122 
        <div className="main-section">
Línea 128... Línea 127...
128 
                  <div className="main-left-sidebar">
 127 
                  <div className="main-left-sidebar">
129 
                    <div className="user_profile">
 128 
                    <div className="user_profile">
130 
                      <div className="user-pro-img">
 129 
                      <div className="user-pro-img">
131 
                        <img
 130 
                        <img
132 
                          id="company-img"
 131 
                          id="company-img"
133 
                          src={`/storage/type/company/code/${companyId}/${
 132 
                          src={`/storage/type/company/code/${companyId}/${image ? `filename/${image}` : ""
134 
                            image ? `filename/${image}` : ""
 - 
 
135 
                          }`}
 133 
                            }`}
136 
                          alt="profile-image"
 134 
                          alt="profile-image"
137 
                        />
 135 
                        />
138 
                      </div>
 136 
                      </div>
139 
                      {/* <!--user-pro-img end--> */}
 137 
                      {/* <!--user-pro-img end--> */}
140 
                      <div className="user_pro_status">
 138 
                      <div className="user_pro_status">
141 
                        <h1>{companyName}</h1>
 139 
                        <h1>{companyName}</h1>
142 
                        <ul className="flw-status">
 140 
                        <ul className="flw-status">
143 
                          <li>
 141 
                          <li>
144 
                            <span style={{fontSize: '1rem'}} >Seguidores</span>
 142 
                            <span style={{ fontSize: '1rem' }} >Seguidores</span>
145 
                            <b style={{fontSize: '1rem'}} id="total-followers">{followers}</b>
 143 
                            <b style={{ fontSize: '1rem' }} id="total-followers">{followers}</b>
146 
                          </li>
 144 
                          </li>
147 
                        </ul>
 145 
                        </ul>
148 
                      </div>
 146 
                      </div>
149 
                      {/* <!--user_pro_status end--> */}
 147 
                      {/* <!--user_pro_status end--> */}
150 
                      <div
 148 
                      <div
Línea 156... Línea 154...
156 
                        {
 154 
                        {
157 
                          facebook && (
 155 
                          facebook && (
158 
                            <div
 156 
                            <div
159 
                              className="col col-md col-sm"
 157 
                              className="col col-md col-sm"
160 
                            >
 158 
                            >
161 
                              <i onClick={() => window.location.href = facebook} className="cursor-pointer fa fa-facebook-square" style={{fontSize: '1.4rem'}} />
 159 
                              <i onClick={() => window.location.href = facebook} className="cursor-pointer fa fa-facebook-square" style={{ fontSize: '1.4rem' }} />
162 
                            </div>
 160 
                            </div>
163 
                          )
 161 
                          )
164 
                        }
 162 
                        }
165 
                        {
 163 
                        {
166 
                          twitter && (
 164 
                          twitter && (
167 
                            <div
 165 
                            <div
168 
                              className="col col-md col-sm"
 166 
                              className="col col-md col-sm"
169 
                            >
 167 
                            >
170 
                              <i onClick={() => window.location.href = twitter} className="cursor-pointer fa fa-twitter" style={{fontSize: '1.4rem'}} />
 168 
                              <i onClick={() => window.location.href = twitter} className="cursor-pointer fa fa-twitter" style={{ fontSize: '1.4rem' }} />
171 
                            </div>
 169 
                            </div>
172 
                          )
 170 
                          )
173 
                        }
 171 
                        }
174 
                        {
 172 
                        {
175 
                          instagram && (
 173 
                          instagram && (
176 
                            <div
 174 
                            <div
177 
                              className="col col-md col-sm"
 175 
                              className="col col-md col-sm"
178 
                            >
 176 
                            >
179 
                              <i onClick={() => window.location.href = instagram} className="fa fa-instagram cursor-pointer" style={{fontSize: '1.4rem'}} />
 177 
                              <i onClick={() => window.location.href = instagram} className="fa fa-instagram cursor-pointer" style={{ fontSize: '1.4rem' }} />
180 
                            </div>
 178 
                            </div>
181 
                          )
 179 
                          )
182 
                        }
 180 
                        }
183 
                      </div>
 181 
                      </div>
184 
                    </div>
 182 
                    </div>
Línea 196... Línea 194...
196 
                          className="row"
 194 
                          className="row"
197 
                        >
 195 
                        >
198 
                          <div
 196 
                          <div
199 
                            className="col text-right"
 197 
                            className="col text-right"
200 
                          >
 198 
                          >
201 
                              <button
 199 
                            <button
202 
                                className="btn btn-link"
 200 
                              className="btn btn-link"
203 
                                onClick={() => changeCurrentTab(TABS.FEEDS) }
 201 
                              onClick={() => changeCurrentTab(TABS.FEEDS)}
204 
                              >
 202 
                            >
205 
                                <img src="/images/ic1.png" alt="" />
 203 
                              <img src="/images/ic1.png" alt="" />
206 
                                <span className="p-2 default-link ">Ver Publicaciones</span>
 204 
                              <span className="p-2 default-link ">Ver Publicaciones</span>
207 
                              </button>
 205 
                            </button>
208 
                          </div>
 206 
                          </div>
209 
                          <div
 207 
                          <div
210 
                            className="col text-left"
 208 
                            className="col text-left"
211 
                          >
 209 
                          >
212 
                              <button
 210 
                            <button
213 
                                className="btn btn-link"
 211 
                              className="btn btn-link"
214 
                                onClick={() => changeCurrentTab(TABS.INFO) }
 212 
                              onClick={() => changeCurrentTab(TABS.INFO)}
215 
                              >
 213 
                            >
216 
                                <img src="/images/ic2.png" alt="" />
 214 
                              <img src="/images/ic2.png" alt="" />
217 
                                <span className="p-2 default-link">Ver Info</span>
 215 
                              <span className="p-2 default-link">Ver Info</span>
218 
                              </button>
 216 
                            </button>
219 
                          </div>
 217 
                          </div>
220 
                        </div>
 218 
                        </div>
221 
                      )}
 219 
                      )}
Línea 222... Línea 220...
222 
 
 220 
 
223 
                      {/* <!-- tab-feed end--> */}
 221 
                      {/* <!-- tab-feed end--> */}
224 
                    </div>
 222 
                    </div>
- 
 
 223 
                    {!initialLoading
225 
                    {!initialLoading && (
 224 
                      &&
226 
                      <React.Fragment>
 225 
                      <React.Fragment>
227 
                        {
 226 
                        {
228 
                          currentTab === TABS.FEEDS ?
 227 
                          currentTab === TABS.FEEDS
229 
                            <div
 - 
 
230 
                              className="product-feed-tab animated fadeIn"
 - 
 
231 
                              id="feed-dd"
 - 
 
232 
                              style={{
 228 
                          &&
233 
                                display:
 229 
                          <div
234 
                                  currentTab === TABS.FEEDS && isFollower
 - 
 
235 
                                    ? "block"
 - 
 
236 
                                    : "none",
 230 
                            className="product-feed-tab animated fadeIn"
237 
                              }}
 231 
                            id="feed-dd"
238 
                            >
 232 
                          >
239 
                              {/* <!--posts-section star--> */}
 233 
                            {/* <!--posts-section star--> */}
240 
                              <div className="posts-section">
 234 
                            <div className="posts-section">
241 
                                <FeedSection routeTimeline={timeline} />
 - 
 
242 
                              </div>
 - 
 
243 
                              {/* <!--posts-section end--> */}
 235 
                              <FeedSection routeTimeline={timeline} />
244 
                            </div>
 236 
                            </div>
245 
                          :
 237 
                            {/* <!--posts-section end--> */}
246 
                            <div
 - 
 
247 
                              className="product-feed-tab animated fadeIn"
 238 
                          </div>
248 
                              id="feed-dd"
 239 
                        }
249 
                              style={{
 240 
                        {
250 
                                display:
 241 
                          currentTab === TABS.INFO || !isFollower
251 
                                  currentTab === TABS.INFO || !isFollower
 242 
                          &&
252 
                                    ? "block"
 243 
                          < div
253 
                                    : "none",
 244 
                            className="product-feed-tab animated fadeIn"
254 
                              }}
 245 
                            id="feed-dd"
255 
                            >
 246 
                          >
256 
                              {!!overview && (
 247 
                            {!!overview && (
257 
                                <div className="user-profile-extended-ov">
 248 
                              <div className="user-profile-extended-ov">
258 
                                  <h3>Visión general</h3>
 249 
                                <h3>Visión general</h3>
259 
                                  <span>{parse(overview)}</span>
 250 
                                <span>{parse(overview)}</span>
260 
                                </div>
 251 
                              </div>
261 
                              )}
 252 
                            )}
262 
                              {!!locations.length && (
 253 
                            {!!locations.length && (
263 
                                <div className="user-profile-extended-ov st2">
 254 
                              <div className="user-profile-extended-ov st2">
264 
                                  <h3>Ubicación</h3>
 255 
                                <h3>Ubicación</h3>
265 
                                  <span>
 256 
                                <span>
266 
                                    {locations.map(
 257 
                                  {locations.map(
267 
                                      ({ formatted_address, is_main }, index) => (
 258 
                                    ({ formatted_address, is_main }, index) => (
268 
                                        <React.Fragment key={index}>
 259 
                                      <React.Fragment key={index}>
269 
                                          {index >= 0 ? <hr /> : ""}
 260 
                                        {index >= 0 ? <hr /> : ""}
270 
                                          <p>
 - 
 
271 
                                            {`${formatted_address} ${
 261 
                                        <p>
272 
                                              is_main === "y" ? "(Principal)" : ""
 262 
                                          {`${formatted_address} ${is_main === "y" ? "(Principal)" : ""
273 
                                            }`}
 263 
                                            }`}
274 
                                          </p>
 264 
                                        </p>
275 
                                        </React.Fragment>
 265 
                                      </React.Fragment>
276 
                                      )
 266 
                                    )
277 
                                    )}
 267 
                                  )}
278 
                                  </span>
 268 
                                </span>
279 
                                </div>
 269 
                              </div>
280 
                              )}
 270 
                            )}
281 
                              {!!industry && (
 271 
                            {!!industry && (
282 
                                <div className="user-profile-ov">
 272 
                              <div className="user-profile-ov">
283 
                                  <h3>Industria</h3>
 273 
                                <h3>Industria</h3>
284 
                                  <span>{industry}</span>
 274 
                                <span>{industry}</span>
285 
                                </div>
 275 
                              </div>
286 
                              )}
 276 
                            )}
287 
                              {!!companySize && (
 277 
                            {!!companySize && (
288 
                                <div className="user-profile-ov">
 278 
                              <div className="user-profile-ov">
289 
                                  <h3>Tamaño de la empresa</h3>
 279 
                                <h3>Tamaño de la empresa</h3>
290 
                                  <span>{companySize}</span>
 280 
                                <span>{companySize}</span>
291 
                                </div>
 281 
                              </div>
292 
                              )}
 282 
                            )}
293 
                              {!!foundationYear && (
 283 
                            {!!foundationYear && (
294 
                                <div className="user-profile-ov">
 284 
                              <div className="user-profile-ov">
295 
                                  <h3>Año de fundación</h3>
 285 
                                <h3>Año de fundación</h3>
296 
                                  <span>{foundationYear}</span>
 286 
                                <span>{foundationYear}</span>
297 
                                </div>
 287 
                              </div>
298 
                              )}
 288 
                            )}
299 
                              {!!website && (
 289 
                            {!!website && (
300 
                                <div className="user-profile-ov">
 290 
                              <div className="user-profile-ov">
301 
                                  <h3>Página web</h3>
 291 
                                <h3>Página web</h3>
302 
                                  <span>{website}</span>
 292 
                                <span>{website}</span>
303 
                                </div>
 293 
                              </div>
304 
                              )}
 294 
                            )}
305 
                            </div>
 295 
                          </div>
306 
                          }
 296 
                        }
307 
                      </React.Fragment>
 297 
                      </React.Fragment>
308 
                    )}
 298 
                    }
309 
                    {initialLoading && (
 299 
                    {initialLoading && (
310 
                      <div
 300 
                      <div
311 
                        style={{
 301 
                        style={{
312 
                          display: "flex",
 302 
                          display: "flex",
Línea 434... Línea 424...
434 
                          <Spinner />
 424 
                          <Spinner />
435 
                        </div>
 425 
                        </div>
436 
                      )}
 426 
                      )}
437 
                    </div>
 427 
                    </div>
438 
                    <div
 428 
                    <div
439 
                        className="widget suggestions full-width d-none d-md-block d-lg-block"
 429 
                      className="widget suggestions full-width d-none d-md-block d-lg-block"
440 
                        style={{
 430 
                      style={{
441 
                          height: "450px",
 431 
                        height: "450px",
442 
                          overflowY: "auto",
 432 
                        overflowY: "auto",
443 
                        }}
 433 
                      }}
444 
                      >
 434 
                    >
445 
                        <div className="sd-title">
 435 
                      <div className="sd-title">
446 
                          <h3>Empresas similares</h3>
 436 
                        <h3>Empresas similares</h3>
447 
                        </div>
 437 
                      </div>
448 
                        {/* <!--sd-title end--> */}
 438 
                      {/* <!--sd-title end--> */}
449 
                        {suggestionCompanies.length ? (
 439 
                      {suggestionCompanies.length ? (
450 
                          suggestionCompanies.map(element => {
 440 
                        suggestionCompanies.map(element => {
451 
                            return(
 441 
                          return (
452 
                              <div className="suggestion-usd" key={element.id}>
 442 
                            <div className="suggestion-usd" key={element.id}>
453 
                                <img
 443 
                              <img
454 
                                  style={{ width: "50px", height: "auto" }}
 444 
                                style={{ width: "50px", height: "auto" }}
455 
                                  src={element.image}
 445 
                                src={element.image}
456 
                                  alt=""
 446 
                                alt=""
457 
                                />
 447 
                              />
458 
                                <div
 448 
                              <div
459 
                                  className="sgt-text"
 449 
                                className="sgt-text"
460 
                                >
 450 
                              >
461 
                                  <a href={element.profile} target="_blank">
 451 
                                <a href={element.profile} target="_blank">
462 
                                    <h4 className="text-dark">{element.name}</h4>
 452 
                                  <h4 className="text-dark">{element.name}</h4>
463 
                                  </a>
 453 
                                </a>
464 
                                </div>
 - 
 
465 
                              </div>
 454 
                              </div>
- 
 
 455 
                            </div>
466 
                            )
 456 
                          )
467 
                          })
 457 
                        })
468 
                        ) : (
 458 
                      ) : (
469 
                          <div className="view-more">Sin empresas similares</div>
 459 
                        <div className="view-more">Sin empresas similares</div>
470 
                        )}
 460 
                      )}
471 
                    </div>
 461 
                    </div>
472 
                  </div>
 462 
                  </div>
473 
                  {/* <!--right-sidebar end--> */}
 463 
                  {/* <!--right-sidebar end--> */}
474 
                </div>
 464 
                </div>
475 
              </div>
 465 
              </div>
476 
            </div>
 466 
            </div>
477 
            {/* <!-- main-section-data end--> */}
 467 
            {/* <!-- main-section-data end--> */}
478 
          </div>
 468 
          </div>
479 
        </div>
 469 
        </div>
480 
      </main>
 470 
      </main>
481 
    </React.Fragment>
 471 
    </React.Fragment >
482 
  );
 472 
  );
483 
};
 473 
};
Línea 484... Línea 474...
484 
 
 474