Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev 5463 Rev 5464
Línea 13... Línea 13...
13 
  <img src="/images/icons/company.png" className="img-icon lg" />,
 13 
  <img src="/images/icons/company.png" className="img-icon lg" />,
14 
  <img src="/images/icons/groups.png" className="img-icon lg" />,
 14 
  <img src="/images/icons/groups.png" className="img-icon lg" />,
15 
  <HiOutlineTag />
 15 
  <HiOutlineTag />
16 
]
 16 
]
Línea 17... Línea -...
17 
 
 - 
 
18 
const ADD_OPTIONS = [
 17 
 
19 
  <i className="fa fa-calendar img-icon lg" />
 - 
 
Línea 20... Línea 18...
20 
]
 18 
const ADD_OPTIONS = [<i className="fa fa-calendar img-icon lg" />]
21 
 
 19 
 
22 
const NavLinks = ({ menuData, sessionLink, addNotification }) => {
 20 
const NavLinks = ({ menuData, sessionLink, addNotification }) => {
23 
  const [menuItems, setMenuItems] = useState(menuData || [])
 21 
  const [menuItems, setMenuItems] = useState(menuData || [])
Línea 65... Línea 63...
65 
      console.log(error)
 63 
      console.log(error)
66 
    }
 64 
    }
67 
  }
 65 
  }
Línea 68... Línea 66...
68 
 
 66 
 
- 
 
 67 
  const readNotification = (link_read, link_notification) => {
69 
  const readNotification = (link_read, link_notification) => {
 68 
    axios
70 
    axios.post(link_read)
 69 
      .post(link_read)
71 
      .then(({ data }) =>
 70 
      .then(({ data }) =>
72 
        data.success
 71 
        data.success
73 
          ? window.open(link_notification, '_blank').focus()
 72 
          ? window.open(link_notification, '_blank').focus()
- 
 
 73 
          : addNotification({ style: 'danger', msg: data.data })
74 
          : addNotification({ style: 'danger', msg: data.data }))
 74 
      )
Línea 75... Línea 75...
75 
  }
 75 
  }
76 
 
 76 
 
77 
  const deleteNotification = (link_delete) => {
 - 
 
78 
    axios.post(link_delete)
 77 
  const deleteNotification = (link_delete) => {
79 
      .then(({ data }) => {
 78 
    axios.post(link_delete).then(({ data }) => {
- 
 
 79 
      !data.success && addNotification({ style: 'danger', msg: data.data })
- 
 
 80 
      setNotificationsCount((prev) => prev - 1)
80 
        !data.success && addNotification({ style: 'danger', msg: data.data })
 81 
      setNotifications(
- 
 
 82 
        notifications.filter(
- 
 
 83 
          (notification) => notification.link_delete !== link_delete
81 
        setNotificationsCount(prev => prev - 1)
 84 
        )
82 
        setNotifications(notifications.filter(notification => notification.link_delete !== link_delete))
 85 
      )
83 
        addNotification({ style: 'success', msg: data.data })
 86 
      addNotification({ style: 'success', msg: data.data })
Línea 84... Línea 87...
84 
      })
 87 
    })
- 
 
 88 
  }
85 
  }
 89 
 
86 
 
 90 
  const handleNotifications = () => {
87 
  const handleNotifications = () => {
 91 
    axios
88 
    axios.get('/notifications/unreads')
 92 
      .get('/notifications/unreads')
89 
      .then(({ data }) => {
 93 
      .then(({ data }) => {
90 
        if (data.success) {
 94 
        if (data.success) {
91 
          const notifications = new Set(data.data.notifications)
 95 
          const notifications = new Set(data.data.notifications)
92 
          setNotifications([...notifications])
 96 
          setNotifications([...notifications])
93 
        }
 97 
        }
94 
      })
 98 
      })
95 
      .catch(err => {
 99 
      .catch((err) => {
96 
        addNotification({
 100 
        addNotification({
97 
          style: 'error',
 101 
          style: 'error',
Línea 110... Línea 114...
110 
    }
 114 
    }
111 
  }
 115 
  }
Línea 112... Línea 116...
112 
 
 116 
 
113 
  return (
 117 
  return (
114 
    <ul>
 118 
    <ul>
115 
      {menuItems.map((item, index) =>
 119 
      {menuItems.map((item, index) => (
116 
        <li key={index}>
 120 
        <li key={index}>
117 
          <a
 121 
          <a
118 
            href={`/${item.href}`}
 122 
            href={`/${item.href}`}
119 
            onClick={(e) => {
 123 
            onClick={(e) => {
Línea 127... Línea 131...
127 
            }}
 131 
            }}
128 
          >
 132 
          >
129 
            {ICON_OPTIONS[index]}
 133 
            {ICON_OPTIONS[index]}
130 
            <p>{item.label}</p>
 134 
            <p>{item.label}</p>
131 
          </a>
 135 
          </a>
132 
          {!!item.childs.length &&
 136 
          {!!item.childs.length && (
133 
            <nav className='navLinkDropdown'>
 137 
            <nav className="navLinkDropdown">
134 
              <ul>
 138 
              <ul>
135 
                {item.childs.map((_element, _i) =>
 139 
                {item.childs.map((_element, _i) => (
136 
                  <li key={_i}>
 140 
                  <li key={_i}>
137 
                    <a
 141 
                    <a
138 
                      href={`/${_element.href}`}
 142 
                      href={`/${_element.href}`}
139 
                      target='framename'
 143 
                      target="framename"
140 
                      onClick={(e) => {
 144 
                      onClick={(e) => {
141 
                        if (_element.childs?.length) e.preventDefault()
 145 
                        if (_element.childs?.length) e.preventDefault()
142 
                      }}>
 146 
                      }}
- 
 
 147 
                    >
143 
                      {_element.label}
 148 
                      {_element.label}
144 
                    </a>
 149 
                    </a>
145 
                    {!!_element.childs?.length &&
 150 
                    {!!_element.childs?.length && (
146 
                      <>
 151 
                      <>
147 
                        <i className="fa fa-angle-right" />
 152 
                        <i className="fa fa-angle-right" />
148 
                        <nav className='navigation-level_three'>
 153 
                        <nav className="navigation-level_three">
149 
                          <ul>
 154 
                          <ul>
150 
                            {_element.childs?.map((levelThree, index) =>
 155 
                            {_element.childs?.map((levelThree, index) => (
151 
                              <li key={index}>
 156 
                              <li key={index}>
152 
                                <a href={`/${levelThree.href}`}>
 157 
                                <a href={`/${levelThree.href}`}>
153 
                                  {levelThree.label}
 158 
                                  {levelThree.label}
154 
                                </a>
 159 
                                </a>
155 
                              </li>
 160 
                              </li>
156 
                            )}
 161 
                            ))}
157 
                          </ul>
 162 
                          </ul>
158 
                        </nav>
 163 
                        </nav>
159 
                      </>
 164 
                      </>
160 
                    }
 165 
                    )}
161 
                  </li>
 166 
                  </li>
162 
                )}
 167 
                ))}
163 
              </ul>
 168 
              </ul>
164 
            </nav>
 169 
            </nav>
165 
          }
 170 
          )}
166 
        </li>
 171 
        </li>
167 
      )}
 172 
      ))}
168 
      <li>
 173 
      <li>
169 
        <a href="/inmail">
 174 
        <a href="/inmail">
170 
          <i className="fa fa-envelope-o" />
 175 
          <i className="fa fa-envelope-o" />
171 
          <p>Inmail</p>
 176 
          <p>Inmail</p>
172 
          <span className={`badge ${totalMessages ? 'd-block' : 'd-none'}`}>
 177 
          <span className={`badge ${totalMessages ? 'd-block' : 'd-none'}`}>
173 
            {totalMessages}
 178 
            {totalMessages}
174 
          </span>
 179 
          </span>
175 
        </a>
 180 
        </a>
176 
      </li>
 181 
      </li>
177 
      <li className='d-md-none'>
 182 
      <li className="d-md-none">
178 
        <a href="/chat">
 183 
        <a href="/chat">
179 
          <i className="fa fa-comment-o" />
 184 
          <i className="fa fa-comment-o" />
180 
          <p>Chat</p>
 185 
          <p>Chat</p>
181 
          <span className="badge" />
 186 
          <span className="badge" />
182 
        </a>
 187 
        </a>
183 
      </li>
 188 
      </li>
184 
      {!!aditionalItems.length &&
 189 
      {!!aditionalItems.length && (
185 
        <li>
 190 
        <li>
186 
          <a
 - 
 
187 
            href={'#'}
 - 
 
188 
            onClick={(e) => e.preventDefault()}
 191 
          <a href={'#'} onClick={(e) => e.preventDefault()}>
189 
          >
 - 
 
190 
            <i className="fa fa-inbox img-icon lg" />
 192 
            <i className="fa fa-inbox img-icon lg" />
191 
            <p>Comunicación</p>
 193 
            <p>Comunicación</p>
192 
          </a>
 194 
          </a>
193 
          <div className="aditional_links">
 195 
          <div className="aditional_links">
194 
            <ul>
 196 
            <ul>
195 
              {aditionalItems.map((item, index) =>
 197 
              {aditionalItems.map((item, index) => (
196 
                <li key={index}>
 198 
                <li key={index}>
197 
                  <a href={`/${item.href}`}>
 199 
                  <a href={`/${item.href}`}>
198 
                    {ADD_OPTIONS[index] || null}
 200 
                    {ADD_OPTIONS[index] || null}
199 
                    <p>{item.label}</p>
 201 
                    <p>{item.label}</p>
200 
                  </a>
 202 
                  </a>
201 
                </li>
 203 
                </li>
202 
              )}
 204 
              ))}
203 
              <li>
 205 
              <li>
204 
                <a href="/notifications">
 206 
                <a href="/notifications">
205 
                  <img src="/images/icons/bell.png" className="img-icon lg" />
 207 
                  <img src="/images/icons/bell.png" className="img-icon lg" />
206 
                  <p>Notificaciones</p>
 208 
                  <p>Notificaciones</p>
207 
                  <span className={`badge ${notificationsCount ? 'd-block' : 'd-none'}`}>
 209 
                  <span className={`badge ${notificationsCount ? 'd-block' : 'd-none'}`}>
208 
                    {notificationsCount}
 210 
                    {notificationsCount}
209 
                  </span>
 211 
                  </span>
210 
                </a>
 212 
                </a>
211 
                {!!notifications.length &&
 213 
                {!!notifications.length && (
212 
                  <nav className='navigation-level_three'>
 214 
                  <nav className="navigation-level_three">
213 
                    <ul>
 215 
                    <ul>
214 
                      {[...notifications].reverse().map(element => {
 216 
                      {[...notifications].reverse().map((element) => {
215 
                        return (
 217 
                        return (
216 
                          <li key={element.message}>
 218 
                          <li key={element.message}>
217 
                            <div className="d-flex align-items-center">
 219 
                            <div className="d-flex flex-column">
218 
                              <a
 220 
                              <a
219 
                                href={element.link}
 221 
                                href={element.link}
220 
                                onClick={(e) => {
 222 
                                onClick={(e) => {
221 
                                  e.preventDefault()
 223 
                                  e.preventDefault()
222 
                                  readNotification(element.link_mark_read, element.link)
 224 
                                  readNotification(element.link_mark_read, element.link)
223 
                                }}
 225 
                                }}
224 
                              >
 226 
                              >
225 
                                {element.message}
 227 
                                {element.message}
226 
                              </a>
 228 
                              </a>
227 
                              <i className="ml-3 fa fa-trash-o cursor-pointer" onClick={() => deleteNotification(element.link_delete)} />
 229 
                              <small style={{ fontSize: '.85rem' }}>
- 
 
 230 
                                {element.time_elapsed}
- 
 
 231 
                              </small>
228 
                            </div>
 232 
                            </div>
- 
 
 233 
                            <i
229 
                            <small style={{ fontSize: '.85rem' }}>
 234 
                              className="ml-3 fa fa-trash-o cursor-pointer"
230 
                              {element.time_elapsed}
 235 
                              onClick={() => deleteNotification(element.link_delete)}
231 
                            </small>
 236 
                            />
232 
                          </li>
 237 
                          </li>
233 
                        )
 238 
                        )
234 
                      })
 239 
                      })}
235 
                      }
 - 
 
236 
                    </ul>
 240 
                    </ul>
237 
                  </nav>
 241 
                  </nav>
238 
                }
 242 
                )}
239 
              </li>
 243 
              </li>
240 
            </ul>
 244 
            </ul>
241 
          </div>
 245 
          </div>
242 
        </li>
 246 
        </li>
243 
      }
 247 
      )}
244 
    </ul>
 248 
    </ul>
245 
  )
 249 
  )
246 
}
 250 
}
Línea 247... Línea 251...
247 
 
 251