[RUBY] [Rails DM] Créons une fonction de notification lorsque DM est envoyé!
[Rails DM] Créons une fonction de notification!
Étape
1: Implémentons la fonction DM
Faisons-le en référence à cet article!
2: Implémentons la fonction de notification
2-1: Créons un modèle
ruby
rails g model Notification visitor_id:integer visited_id:integer room_id:integer message_id:integer action:string checked:boolean
2-2: Lier le modèle de notification créé à l'utilisateur, à la publication et au commentaire
Association entre le modèle utilisateur et le modèle de notification
app/models/user.rb
has_many :active_notifications, class_name: 'Notification', foreign_key: 'visitor_id', dependent: :destroy
has_many :passive_notifications, class_name: 'Notification', foreign_key: 'visited_id', dependent: :destroy
Association du modèle de salle et du modèle de notification
app/models/room.rb
has_many :notifications, dependent: :destroy
Association du modèle de message et du modèle de notification
app/models/message.rb
has_many :notifications, dependent: :destroy
Association du modèle de notification avec le modèle utilisateur, salle, message
app/models/notification.rb
default_scope -> { order(created_at: :desc) }
belongs_to :room, optional: true
belongs_to :message, optional: true
belongs_to :visitor, class_name: 'User', foreign_key: 'visitor_id', optional: true
belongs_to :visited, class_name: 'User', foreign_key: 'visited_id', optional: true
2-3: Méthode de création de notification DM
messages_controller.rb
class MessagesController < ApplicationController
def create
if Entry.where(user_id: current_user.id, room_id: params[:message][:room_id]).present?
@message = Message.new(message_params)
#d'ici
@[email protected]
#Ajouter ici
if @message.save
#d'ici
@roommembernotme=Entry.where(room_id: @room.id).where.not(user_id: current_user.id)
@[email protected]_by(room_id: @room.id)
notification = current_user.active_notifications.new(
room_id: @room.id,
message_id: @message.id,
visited_id: @theid.user_id,
visitor_id: current_user.id,
action: 'dm'
)
#S'il s'agit d'un commentaire pour votre message, il sera notifié
if notification.visitor_id == notification.visited_id
notification.checked = true
end
notification.save if notification.valid?
#Ajouter ici
redirect_to "/rooms/#{@message.room_id}"
end
else
redirect_back(fallback_location: root_path)
end
end
private
def message_params
params.require(:message).permit(:user_id, :body, :room_id).merge(user_id: current_user.id)
end
end
2-4: Créer un écran de liste de notifications
terminal
rails g controller notifications index
controller/notifications_controller.rb
class NotificationsController < ApplicationController
def index
@notifications = current_user.passive_notifications
end
end
erb:views/notifications/index.html.erb
<% notifications = @notifications.where.not(visitor_id: current_user.id) %>
<% if notifications.exists? %>
<%= render notifications %>
<% else %>
<p>Il n'y a pas de notification</p>
<% end %>
erb:views/notifications/_notificastion.html.erb
<% visitor = notification.visitor %>
<% visited = notification.visited %>
<div>
<%= link_to user_path(visitor) do %>
<%= visitor.name %>Est
<% end %>
<% if notification.action=='dm' %>
Je t'ai envoyé un DM
<% end %>
</div>
prime
Affichez la liste des messages d'une manière facile à comprendre comme LINE
Tout d'abord, imaginons comment nous pouvons l'implémenter!
1: Jugez s'il s'agit d'un message envoyé par l'autre partie à partir du message envoyé par vous-même 2: appliquez un CSS différent au message envoyé par vous-même et au message envoyé par l'autre partie
Il semble qu'il puisse être implémenté dans ces 2 étapes! Le point est l'étape 1.
Comment jugez-vous? C'est tout. Il devrait y avoir une colonne user_id dans la table Message qui constitue la fonction de message. (Préexistait pour déterminer qui l'a publié) En fonction de la valeur qu'il contient, il semble que vous puissiez juger s'il s'agit d'un message envoyé par l'autre partie à partir du message envoyé par vous-même! Alors essayons-le dans le prochain chapitre!
Mettons-le en œuvre!
erb:rooms/show.html.erb
<% @messages.each do |m| %> <%#Veuillez changer les variables d'instance ici en vos propres variables d'instance!%>
<% if m.user_id == current_user.id %>
<div class="current_user">
<strong class="current_user"><%= m.body %></strong>
<small class="current_user"><%= m.user.name %>M.</small>
</div>
<% else %>
<div class="visited_user">
<strong class="visited_user"><%= m.body %></strong>
<small class="visited_user"><%= m.user.name %>M.</small>
</div>
<% end %>
<% end %>
Savez-vous ce que vous faites ci-dessus? !! Si la valeur de user_id est l'id de l'utilisateur connecté, placez la classe current_user dans la boîte de message (div). Si la valeur de user_id est l'id de l'autre utilisateur (à proprement parler, l'id est autre que l'utilisateur connecté), placez la classe visit_user dans la boîte de message (div). Nous l'avons donné!
Exemple CSS)
css
.current_user {
color: red;
text-align: right;
background-color: #fff;
width: fit-content;
margin: 10px 0 0 auto;
border-radius: 30px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
-ms-border-radius: 30px;
-o-border-radius: 30px;
box-sizing: border-box;
padding: 10px;
}
.visited_user {
color: #fff;
margin: 10px;
background-color: brown;
text-align: left;
width: fit-content;
margin: 10px auto 0 0;
border-radius:30px;
-webkit-border-radius:30px;
-moz-border-radius:30px;
-ms-border-radius:30px;
-o-border-radius:30px;
box-sizing: border-box;
padding: 10px;
}
Faire disparaître les notifications de la liste des notifications des notifications lorsqu'elles ont été lues
Tout d'abord, imaginons comment nous pouvons l'implémenter!
Hypothèse: la fonction de notification est implémentée dans le modèle de notification Les colonnes incluent id, visiteur_id, visité_id, room_id, message_id, action, vérifié, created_at, updated_at Programmé pour gérer les lectures et les non-lus dans la colonne cochée (type booléen)
1: Afficher uniquement les notifications non lues (c'est-à-dire, afficher uniquement si la colonne cochée est fausse) 2: Initialement, non lu par défaut 3: Si vous cliquez sur le lien "Marquer comme lu", vous pouvez définir la colonne cochée sur true pour la lire.
Si vous suivez les étapes ci-dessus, vous pouvez l'implémenter!
Mettons-le en œuvre!
Première étape 1
erb:_notification.html.erb
<% if notification.checked == false %> <%#← Cette ligne est importante%>
<div>
<%= link_to room_path(@roomId) do %>
<%= visitor.name %>M.
<% end %>
<% if notification.action=='dm' %>
Est toi(<%= visited.name %>M.)Envoyé DM à
<% end %>
<%= link_to 'Marquer comme lu',notification_path(notification.id),method: :put %>
</div>
<% end %> <%#← Cette ligne est importante%>
Étape 2
Étant donné que la colonne cochée est définie sur false en premier lieu, ne la modifiez pas!
rb:_notification.html.erb
class NotificationsController < ApplicationController
def index
@notifications = current_user.passive_notifications
#↓ Si vous avez quelque chose d'écrit en dessous, surtout si vous écrivez un processus qui rend la vérification vraie, supprimez cette description!
end
end
Étape 3
erb:_notification.html.erb
<% if notification.checked == false %>
<div>
<%= link_to room_path(@roomId) do %>
<%= visitor.name %>M.
<% end %>
<% if notification.action=='dm' %>
Est toi(<%= visited.name %>M.)Envoyé DM à
<% end %>
<%= link_to 'Marquer comme lu',notification_path(notification.id),method: :put %>
<%#↑ Cette ligne! !!%>
</div>
<% end %>
Appelez l'action de mise à jour du contrôleur de notification lorsque vous appuyez sur "Marquer comme lu". A ce moment, l'id de la table Notification est utilisé comme argument en tant que paramètre.
notification_controller
class NotificationsController < ApplicationController
#réduction
def update
notification=Notification.find(params[:id]) #...①
if notification.update(checked: true) #...②
redirect_to action: :index
end
end
end
Ensuite, selon (1), l'enregistrement avec l'identifiant correspondant dans la table de notification est extrait sous l'identifiant passé comme paramètre. Enfin, avec ②, définissez la valeur de la colonne cochée de l'enregistrement sur true.
Vous devriez maintenant pouvoir l'implémenter! !! !!
Article de référence
Recommended Posts