Comment personnaliser les routes et rendre une page personnalisée dans un plugin ?

Dans un plugin, comment puis-je personnaliser une route et ensuite rendre une page personnalisée ?

J’ai consulté ce fil de discussion : Développer des plugins Discourse - Partie 5 - Ajouter une interface d’administration - Documentation / Guide du développeur - Discourse Meta, ainsi que d’autres plugins, mais sans succès.

Mes routes personnalisées renvoient des données JSON, alors que je souhaite rendre un modèle Ember. Existe-t-il un fil de discussion qui explique ce sujet ? Merci beaucoup.

Si c’est tout ce que vous voulez faire, jetez un œil à :

Et :

Je suis bloqué ici, voici mes étapes spécifiques :

J’ai défini la route dans le fichier plugins/q/config/routes.rb :

get "/hello" => "examples#hello"

Contrôleur : plugins/q/app/controllers/quectel/examples_controller.rb

def hello
   render json: { hello: "world" }
end

Maintenant, lorsque j’accède à : localhost:4200/q/hello, il renvoie le json :

{"hello":"world"}

Comment puis-je faire pour qu’en accédant à localhost:4200/q/hello, le modèle Ember soit rendu ?

J’ai mis ce sujet en favori il y a quelque temps pour le lire plus tard : Creating Routes in Discourse and Showing Data. Je ne suis pas sûr qu’il soit à jour, mais il pourrait quand même aider.

Oui, j’ai aussi vu ce post et j’ai suivi les étapes indiquées, mais cela ne fonctionne pas, une erreur « Page introuvable » apparaît. Ensuite, j’étais perdu.

D’accord, après avoir étudié le code de plugins/discourse-subscriptions, j’ai à peu près réalisé ce que je voulais.

Accéder à /q/hello affiche le contenu du modèle personnalisé et récupère les données du backend personnalisé.

Voici mes étapes :

1. Créer un fichier de mappage de chemin plugins/quectel/assets/javascripts/discourse/quectel-route-map.js

export default function quectel() {
  this.route("q/hello"); // La route est /q/hello par défaut
};

2. Créer un fichier de route plugins/quectel/assets/javascripts/discourse/routes/q/hello.js

import Route from "@ember/routing/route";
import { ajax } from "discourse/lib/ajax";

export default class HelloRoute extends Route {
  model() {
    return ajax('/q/hello') // Demande à l'interface backend pour obtenir les données
  }
}

3. Créer un fichier de modèle frontend plugins/quectel/assets/javascripts/discourse/templates/q/hello.gjs, pour rendre les données

import QHello from '../../components/q-hello'

<template>
  <h1>q-hello</h1>
  {{!-- Rendre le composant --}}
  <QHello />
  {{!-- Rendre les données du modèle --}}
  <div>{{@model.hello}}</div>
</template>

4. Créer un fichier de contrôleur backend plugins/quectel/app/controllers/quectel/examples_controller.rb

# frozen_string_literal: true

module ::Quectel
  class ExamplesController < ::ApplicationController
    requires_plugin PLUGIN_NAME

    def hello
      render json: { hello: "hello 2333" }
    end
  end
end

5. Définir la route backend plugins/quectel/config/routes.rb

# frozen_string_literal: true

Quectel::Engine.routes.draw do
  get "/hello" => "examples#hello"
end

Discourse::Application.routes.draw { mount ::Quectel::Engine, at: "q" }

En accédant à /q/hello, vous verrez l’affichage suivant :

image1912×932 47.2 KB