Cómo mostrar el recuento total de publicaciones del usuario junto al nombre

Hola a todos, esta es mi primera publicación aquí. Me pregunto cómo el foro de Blizzard muestra el recuento total de publicaciones de un usuario además de su nombre.


He implementado algo similar en mi foro utilizando el sistema de API de Discourse como se muestra a continuación

Pero creo que hay mejores maneras de hacer esto. También estoy planeando mostrar la insignia del usuario, etc. ¿Alguien puede ayudarme con esto? Gracias.

1 me gusta

Me pregunto si existe algún sistema de plantillas/shortcodes.

¡Hola!

Si estás usando la API, creo que esta es la forma correcta.

¿Podrías compartir tu código con nosotros? Podemos ofrecerte sugerencias de mejora, si es necesario. :slight_smile:

1 me gusta

Claro

<script type="text/discourse-plugin" version="0.1">
  api.onPageChange(() => {
    // Comprueba si existe un elemento con el ID 'topic'
    if ($('#topic').length > 0) {
      // Si existe el elemento 'topic', busca el atributo 'data-user-id'
      var userId = $('#topic article').data('user-id');

      // Comprueba si existe el atributo 'data-user-id'
      if (userId !== undefined) {
        // Realiza una solicitud a la API para obtener información del usuario
        apiReq(`admin/users/${userId}.json`, 'GET')
          .then(data => {
            // Maneja los datos de la respuesta
            console.log('Número de publicaciones del usuario:', data.post_count);

            // Comprueba si el usuario tiene un valor en user_fields["1"]
            if (data.user_fields && data.user_fields["1"]) {
              // Muestra el campo de usuario dentro del primer div 'names'
              displayUserField(data.user_fields["1"]);
            }

            // Muestra el número de publicaciones dentro del primer div 'names'
            displayPostCount(data.post_count);
          })
          .catch(error => {
            // Maneja los errores
            console.error('Error en la solicitud a la API:', error);
          });
      } else {
        console.log('No se encontró el atributo data-user-id');
      }
    } else {
      console.log('No se encontró ningún elemento con el ID "topic"');
    }
  });

  // Función para mostrar el campo de usuario dentro del primer div 'names'
  function displayUserField(userFieldValue) {
    // Busca el primer div 'names'
    var firstNamesDiv = $('.names:first');

    // Crea un elemento span con las clases 'user-title'
    var userFieldSpan = $('<span></span>').addClass('user-title');
    userFieldSpan.text(userFieldValue);

    // Añade el elemento span al primer div 'names'
    firstNamesDiv.append(userFieldSpan);
  }

  // Función para mostrar el número de publicaciones dentro del primer div 'names'
  function displayPostCount(postCount) {
    // Busca el primer div 'names'
    var firstNamesDiv = $('.names:first');

    // Crea un elemento span con las clases 'user-title'
    var postCountSpan = $('<span></span>').addClass('user-title');
    postCountSpan.text(postCount + ' posts');

    // Añade el elemento span del número de publicaciones al primer div 'names'
    firstNamesDiv.append(postCountSpan);
  }

</script>

Tengo la función apiReq en otro componente

En Blizzard, muestran el recuento de publicaciones junto a los comentaristas, lo cual no pude lograr.

Entiendo, usas la API parcialmente. Definitivamente puedes mejorar este código. Dame unos minutos y volveré contigo.

2 Me gusta

Suena bien. Soy nuevo en Discourse, por eso sé muy poco al respecto.

1 me gusta

Tuve que hacer un plugin en su lugar.

Para obtener el valor de post_count al ver una publicación o la tarjeta de un usuario, es necesario serializar los datos para incluir este campo. Esto solo se puede lograr con la ayuda de un plugin y depender de las solicitudes por usuario no es una solución realista.

Pruébalo. La parte de JS está en assets si quieres echar un vistazo.
Algo específico que podrías haber pasado por alto al usar la API es la capacidad de personalizar a través de outlets.

Avísame si quieres más opciones.
No sé si debería lanzar este plugin ya que es pequeño, pero aquí va de todos modos:

5 Me gusta

Muchas gracias por el esfuerzo. Lo intentaré.
Mi plan real era lograr la siguiente característica:

  1. Mostrar el recuento de publicaciones del usuario en publicaciones y comentarios junto al avatar.
  2. Asignar un título predeterminado a todos los miembros de un grupo (por ejemplo, Administrador).
  3. Mostrar el nivel de confianza junto al avatar.
  4. Mostrar una insignia junto al avatar.
  5. Mostrar un valor de campo de usuario junto al avatar.
    Y las opciones son modificables por el administrador.
    También planeé hipervincular el recuento de publicaciones para que otros puedan hacer clic y ver la lista de publicaciones.

Aunque es un plugin pequeño, creo que vale la pena publicarlo. Puede considerar agregar nuevas funciones como se sugiere.
Gracias.

Instalé el plugin pero no funciona.

Lo probé de nuevo y funciona bien de mi lado.

¿Está activado el plugin?

1 me gusta

Ya funciona. Gracias.

Disculpe las molestias de nuevo. Después de usarlo por un tiempo, noté que no incluye temas. Hasta donde sé, un tema también es una publicación.

Temas creados es otra estadística. ¿Deseas añadir este recuento al recuento de publicaciones o añadir un nuevo texto para que tengas “temas: xx, publicaciones: yy”?

En realidad, estoy intentando obtener algo como postCount + TopicCount
simplemente quiero contar los temas como publicaciones.
También estoy intentando mostrar eso después del título del usuario (si lo tiene). Intenté modificar el código del plugin (después de bifurcarlo) pero hasta ahora no he tenido suerte.

Actualicé el plugin; avísame si te funciona.

2 Me gusta

Muchas gracias. Funcionó.

Se ve genial. ¿Es posible agregar también las reacciones totales + iconos de FA?

No puedo editar, así que acabo de instalar y probar el plugin, y está funcionando muy bien. Excepto en el móvil, donde el número total de publicaciones se muestra en el lado izquierdo del nombre. :frowning:

@David_Ghost
Puedes arreglarlo con algo de CSS:

.names.trigger-user-card > div:has(.user-post-user__container) {
    order: 2;
}
2 Me gusta