Convertir le bouton Nouveau sujet en sous-menu

[Fma965]

Salut tout le monde,

Quelqu’un sait comment je peux faire pour que le bouton « Nouveau sujet » ait un sous-menu pour certaines catégories ?

Actuellement, j’ai ceci :

Mais j’espérais obtenir quelque chose comme ceci lorsque le bouton « Nouveau sujet » est cliqué :

Je peux penser à quelques façons de faire cela, mais je ne suis pas sûr de trop réfléchir. Cacher le bouton d’origine et ajouter un tout nouveau bouton avec le menu déroulant était l’une des idées que j’avais.

Voici le code actuel que j’ai, avant de le faire comme je l’ai dit, y a-t-il un moyen d’ajouter facilement une entrée de menu ?

<script type="text/x-handlebars" data-template-name="/connectors/before-create-topic-button/syncbutton">
  <button onclick="window.location.href='/w/issue-with-sync3'" class="btn-default btn btn-icon-text ember-view customnewtopicbtn" title="Create a new topic using the SYNC 3 Issue template">
    <svg class="fa d-icon d-icon-plus svg-icon svg-string" xmlns="http://www.w3.org/2000/svg">
      <use xlink:href="#plus"></use>
    </svg>
    <span class="d-button-label">New Sync Issue</span>
  </button>
</script>

Aussi, si je cache le bouton « Créer un sujet », existe-t-il une variable ou une fonction que je peux utiliser pour récupérer le lien du bouton « Nouveau sujet » ?

EDIT : ou plutôt, comment la section « Nouveau sujet » est-elle ouverte ? Je pensais que ce serait en cliquant sur le bouton correspondant à un ID ou une classe, mais il semble que ce ne soit pas le cas ?

Merci

[manuel (Manuel Kostka)]

Vous pouvez jeter un œil à ce composant de thème :

GitHub - nolosb/discourse-wizards-dropdown-button: A Discourse theme component. Adds a button with a...

Il ajoute un bouton déroulant à l’en-tête et je pourrais encore y apporter quelques modifications. Mais cela devrait donner une idée de la façon de remplacer le bouton par défaut et du fonctionnement de l’ouverture et du pré-remplissage du compositeur.

[Fma965]

Merci, cela pourrait fonctionner, je vais examiner la question.

[Fma965]

Je suppose que mon problème maintenant est de savoir comment mettre cela dans les boutons de la liste de sujets, car il semble que vous ne puissiez pas utiliser DecorateWidget avec des prises de plugin.

[manuel (Manuel Kostka)]

Ah oui, je me souviens maintenant, c’est pourquoi je ne l’ai pas publié… Je voulais encore le rendre plus flexible et proposer d’insérer le bouton à divers endroits. Mais je n’avais pas trouvé comment ajouter le widget quand il n’y a qu’une sortie de plugin. Quelqu’un connaît-il une bonne approche pour cela ?

[Fma965]

Hehe j’ai trouvé ça, mais mes compétences ne sont pas vraiment en javascript :rire: donc je ne suis pas sûr que ce soit utile

api.decorateWidget - how can I find the template's names?

You aren’t going to be able to use decorateWidget() on a plugin outlet. Try something like this: <script type="text/discourse-plugin" version="0.8.42"> const h = require("virtual-dom").h; api.createWidget("user-card-custom-field", { html(attrs) { const userCustomFields = attrs.user.custom_fields; if (userCustomFields.user_field_4) { return h('span.poster-user-field', userCustomFields.user_field_4); } } }); </script> <script type="text…

Beau travail jusqu’à présent cependant

[awesomerobot (Kris)]

Oh, j’ai fait quelque chose de similaire la semaine dernière…

Dans un thème, vous pouvez ajouter ceci à javascripts/discourse/components/new-topic-dropdown.js

import { action } from "@ember/object";
import { getOwner } from "discourse-common/lib/get-owner";
import Composer from "discourse/models/composer";
import DropdownSelectBoxComponent from "select-kit/components/dropdown-select-box";
import { computed } from "@ember/object";

export default DropdownSelectBoxComponent.extend({
  classNames: ["new-topic-dropdown"],

  selectKitOptions: {
    icons: ["plus"],
    showFullTitle: true,
    autoFilterable: false,
    filterable: false,
    showCaret: true,
    none: "topic.create",
  },

  content: computed(function () {
    const items = [
      {
        id: "new_discussion",
        name: "Nouveau sujet",
        description: "Démarrer une nouvelle discussion",
        icon: "comment",
      },
    ];

    items.push({
      id: "new_ticket",
      name: "Ticket de support",
      description: "Ouvrir une demande de support",
      icon: "tag",
    });

    return items;
  }),

  @action
  onChange(selectedAction) {
    const composerController = getOwner(this).lookup("controller:composer");

    let tags = null;
    let categoryId = this.category ? this.category.id : null;

    if (selectedAction === "new_ticket") {
      tags = "ticket";
    }

    composerController.open({
      action: Composer.CREATE_TOPIC,
      draftKey: Composer.DRAFT,
      categoryId: categoryId,
      tags: tags,
    });
  },
});

Cela ajoute les options « nouveau sujet » et « ticket de support » à un bouton déroulant… « nouveau sujet » ouvre le compositeur comme d’habitude, et « ticket de support » ouvre le compositeur avec le tag « ticket » déjà ajouté.

…puis dans javascripts/discourse/connectors/after-create-topic-button/new-topic-dropdown.hbs

{{#if currentUser}}
  {{new-topic-dropdown category=category}}
{{/if}}

…ensuite, avec un peu de CSS, vous voudrez probablement masquer le bouton par défaut :

.navigation-controls {
  #create-topic {
    display: none;
  }
}

[Fma965]

Légende absolue Merci

[system (system) A fermé ce sujet ()]

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.