Quelque soit votre raison, professionnelle ou privée, un système de tickets peut parfois s'avérer bien utile.
Dans le cadre du self-hosting, imaginons que vous mettiez en ligne des services que vous partagez avec la famille ou des amis. Si quelqu'un constate un problème, il peut tout simplement vous le signaler par ticket et vous de même en retour, une fois le problème réglé.
Peppermint, une solution de helpdesk entièrement open source qui espère améliorer l'expérience utilisateur des membres d'équipes qui utilisent actuellement des logiciels similaires et plus coûteux. Notre objectif est de créer un logiciel facile à utiliser tout en offrant tous les composants riches en fonctionnalités des solutions payantes.
⚡Caractéristiques
- Création de tickets: création de tickets standard avec un éditeur Markdown, permet également d'envoyer des pièces jointes.
- Un journal de l'historique des clients.
- Carnet basé sur Markdown avec des listes de tâches.
- Adaptatif : conçu pour des tailles d'écran variables, du mobile jusqu'au 4K.
- Déployez rapidement Peppermint à l'aide de Docker et PM2.
- Simple à utiliser : conçu pour être facile à utiliser avec un flux de travail logique.
L'installation
- Créez votre docker-compose.yml:
nano docker-compose.yml
- Collez ça dedans:
version: "3.1"
services:
peppermint_postgres:
container_name: peppermint_postgres
image: postgres:latest
restart: always
ports:
- 5432:5432
volumes:
- pgdata:/var/lib/postgresql/data
environment:
POSTGRES_USER: peppermint
POSTGRES_PASSWORD: 1234
POSTGRES_DB: peppermint
peppermint:
container_name: peppermint
image: pepperlabs/peppermint:latest
ports:
- 3000:3000
- 5003:5003
restart: always
depends_on:
- peppermint_postgres
healthcheck:
test: ["CMD", "sh", "-c", "wget --spider $$BASE_URL"]
interval: 30s
timeout: 10s
retries: 3
environment:
DB_USERNAME: "peppermint"
DB_PASSWORD: "1234"
DB_HOST: "peppermint_postgres"
SECRET: 'peppermint4life'
API_URL: "http://server-ip:5003" # Changez_moi
volumes:
pgdata:
Vous prendrez soin d'éditer:
- POSTGRES_PASSWORD: 1234 => changez 1234 par un mot de passe fort.
DB_PASSWORD: "1234" => à la place de 1234, indiquez le mot de passe de POSTGRES_PASSWORD - API_URL: "http://server-ip:5003" => remplacez simplement server-ip par l'ip de votre serveur ou votre domaine complet.
- On installe l'application:
docker-compose up -d
ou avec docker-compose V2
docker compose up -d
- Rendez-vous sur l'ip:port, suivant l'IP de votre serveur local:
http://ip:3000
Compte administrateur
Vous pouvez maintenant vous connecter avec le compte par défaut:
- Email address => admin@admin.com
- Password => 1234
Petit détail, il faut cliquer sur le bouton Sign In, je veux dire par là que la touche Entrée n'a aucun effet. Une fois connecté, cliquez sur Dashboard:
Vous voici à présent sur l'interface générale:
Configurer son profil
Rendez-vous en haut à droite et cliquez sur Profile:
Modifiez le Nom, l'Email et la Langue, validez avec Enregistrer et recharger.
Vu que 1234 n'est pas forcément le mot de passe idéal, je vous invite à le changer en cliquant sur Réinitialiser le mot de passe, une fois que c'est terminé, cliquez sur Update Password:
Configurer le serveur mail
Rendez-vous dans la colonne de gauche et cliquez sur Paramètres Administrateur, ensuite sur Outbound Emails:
Comme toujours je prends l'exemple de Gmail car il est populaire, n'oubliez pas de créer votre mot de passe dédié aux applications tierces si non cela ne fonctionnera pas avec votre vrai mot de passe:
Une fois que vous avez votre mot de passe, remplissez le formulaire comme indiqué ci-dessous:
Cliquez sur Update Settings:
Et pour être certain, cliquez maintenant sur Test Settings, vous devriez avoir une confirmation en haut à droite de la page, comme ceci:
Traduction des Email Templates
Nouveauté qui vient d'être implémentée, la possibilité de traduite les Email Templates, option qui se trouve dans Paramètres Administrateur, Email Templates:
Je vous propose les traductions ici pour chaque catégorie, en tout cas ce qui concerne le corps du messages. Pour le pied de page, libre à vous d'éditer de façon à ce que ça corresponde à votre site:
Cela se présente comme ci-dessous, il suffira dans la colonne en dessous de Update Template de tout effacer et de coller la traduction, n'oubliez pas de cliquer sur Update Template à chaque fois que vous avez collé la traduction.
ticket_created
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html charset=UTF-8" />
</head>
<div id="" style="display:none;overflow:hidden;line-height:1px;opacity:0;max-height:0;max-width:0">Ticket Created<div></div>
</div>
<body style="background-color:#ffffff;margin:0 auto;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif">
<table align="center" role="presentation" cellSpacing="0" cellPadding="0" border="0" width="100%" style="max-width:600px;margin:0 auto">
<tr style="width:100%">
<td>
<table style="margin-top:8px" align="center" border="0" cellPadding="0" cellSpacing="0" role="presentation" width="100%">
</table>
<h1 style="color:#1d1c1d;font-size:16px;font-weight:700;margin:10px 0;padding:0;line-height:42px">Ticket créé: {{id}}</h1>
<p style="font-size:20px;line-height:28px;margin:4px 0">
<p>Bonjour, <br>Votre ticket a maintenant été créé et enregistré.<p>
<p style="font-size:14px;margin:16px 0;color:#000">
Cordialement,
<table align="center" border="0" cellPadding="0" cellSpacing="0" role="presentation" width="100%">
<tbody>
<tr>
<td>
<a target="_blank" style="color:#b7b7b7;text-decoration:underline" href="https://docs.peppermint.sh" rel="noopener noreferrer">Documentation</a> | <a target="_blank" style="color:#b7b7b7;text-decoration:underline" href="https://discord.gg/8XFkbgKmgv" rel="noopener noreferrer">Discord</a> </a>
<p style="font-size:12px;line-height:15px;margin:16px 0;color:#b7b7b7;text-align:left">This was an automated message sent by peppermint.sh -> An open source helpdesk solution</p>
<p style="font-size:12px;line-height:15px;margin:16px 0;color:#b7b7b7;text-align:left;margin-bottom:50px">©2022 Peppermint Ticket Management, a Peppermint Labs product.<br />All rights reserved.</p>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</table>
</body>
</html>
ticket_status_changed
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html charset=UTF-8" />
</head>
<div id="" style="display:none;overflow:hidden;line-height:1px;opacity:0;max-height:0;max-width:0">Ticket Created<div></div>
</div>
<body style="background-color:#ffffff;margin:0 auto;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif">
<table align="center" role="presentation" cellSpacing="0" cellPadding="0" border="0" width="100%" style="max-width:600px;margin:0 auto">
<tr style="width:100%">
<td>
<table style="margin-top:8px" align="center" border="0" cellPadding="0" cellSpacing="0" role="presentation" width="100%">
<tbody>
<tr>
<td><img alt="Slack" src="https://raw.githubusercontent.com/Peppermint-Lab/peppermint/next/static/black-side-logo.svg" width="200" height="60" style="display:block;outline:none;border:none;text-decoration:none" /></td>
</tr>
</tbody>
</table>
<h1 style="color:#1d1c1d;font-size:16px;font-weight:700;margin:10px 0;padding:0;line-height:42px">Ticket: {{title}}</h1>
<p style="font-size:20px;line-height:28px;margin:4px 0">
<p>Votre ticket, a maintenant le statut {{status}}</p>
Cordialement,
<br>
Votre gestionnaire de ticket.
</p>
<table align="center" border="0" cellPadding="0" cellSpacing="0" role="presentation" width="100%">
<tbody>
<tr>
<td>
<a target="_blank" style="color:#b7b7b7;text-decoration:underline" href="https://docs.peppermint.sh" rel="noopener noreferrer">Documentation</a> | <a target="_blank" style="color:#b7b7b7;text-decoration:underline" href="https://discord.gg/8XFkbgKmgv" rel="noopener noreferrer">Discord</a> </a>
<p style="font-size:12px;line-height:15px;margin:16px 0;color:#b7b7b7;text-align:left">This was an automated message sent by peppermint.sh -> An open source helpdesk solution</p>
<p style="font-size:12px;line-height:15px;margin:16px 0;color:#b7b7b7;text-align:left;margin-bottom:50px">©2022 Peppermint Ticket Management, a Peppermint Labs product.<br />All rights reserved.</p>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</table>
</body>
</html>
ticket_assigned
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html charset=UTF-8" />
</head>
<div id="" style="display:none;overflow:hidden;line-height:1px;opacity:0;max-height:0;max-width:0">Ticket Created<div></div>
</div>
<body style="background-color:#ffffff;margin:0 auto;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif">
<table align="center" role="presentation" cellSpacing="0" cellPadding="0" border="0" width="100%" style="max-width:600px;margin:0 auto">
<tr style="width:100%">
<td>
<table style="margin-top:8px" align="center" border="0" cellPadding="0" cellSpacing="0" role="presentation" width="100%">
</table>
<h1 style="color:#1d1c1d;font-size:16px;font-weight:700;margin:10px 0;padding:0;line-height:42px">Billet créé</h1>
<p style="font-size:20px;line-height:28px;margin:4px 0">
<p>Bonjour, <br>Un nouveau ticket vous a été attribué.</p>
<p style="font-size:14px;margin:16px 0;color:#000">
Cordialement,
<table align="center" border="0" cellPadding="0" cellSpacing="0" role="presentation" width="100%">
<tbody>
<tr>
<td>
<a target="_blank" style="color:#b7b7b7;text-decoration:underline" href="https://docs.peppermint.sh" rel="noopener noreferrer">Documentation</a> | <a target="_blank" style="color:#b7b7b7;text-decoration:underline" href="https://discord.gg/8XFkbgKmgv" rel="noopener noreferrer">Discord</a> </a>
<p style="font-size:12px;line-height:15px;margin:16px 0;color:#b7b7b7;text-align:left">This was an automated message sent by peppermint.sh -> An open source helpdesk solution</p>
<p style="font-size:12px;line-height:15px;margin:16px 0;color:#b7b7b7;text-align:left;margin-bottom:50px">©2022 Peppermint Ticket Management, a Peppermint Labs product.<br />All rights reserved.</p>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</table>
</body>
</html>
ticket_comment
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html charset=UTF-8" />
</head>
<div id="" style="display:none;overflow:hidden;line-height:1px;opacity:0;max-height:0;max-width:0">Ticket Created<div></div>
</div>
<body style="background-color:#ffffff;margin:0 auto;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif">
<table align="center" role="presentation" cellSpacing="0" cellPadding="0" border="0" width="100%" style="max-width:600px;margin:0 auto">
<tr style="width:100%">
<td>
<table style="margin-top:8px" align="center" border="0" cellPadding="0" cellSpacing="0" role="presentation" width="100%">
</table>
<h1 style="color:#1d1c1d;font-size:16px;font-weight:700;margin:10px 0;padding:0;line-height:42px">Mise à jour des tickets pour: {{title}}</h1>
<p style="font-size:20px;line-height:28px;margin:4px 0">
<p>{{comment}}</p>
<p style="font-size:14px;margin:16px 0;color:#000">
Cordialement,
<table align="center" border="0" cellPadding="0" cellSpacing="0" role="presentation" width="100%">
<tbody>
<tr>
<td>
<a target="_blank" style="color:#b7b7b7;text-decoration:underline" href="https://docs.peppermint.sh" rel="noopener noreferrer">Documentation</a> | <a target="_blank" style="color:#b7b7b7;text-decoration:underline" href="https://discord.gg/8XFkbgKmgv" rel="noopener noreferrer">Discord</a> </a>
<p style="font-size:12px;line-height:15px;margin:16px 0;color:#b7b7b7;text-align:left">This was an automated message sent by peppermint.sh -> An open source helpdesk solution</p>
<p style="font-size:12px;line-height:15px;margin:16px 0;color:#b7b7b7;text-align:left;margin-bottom:50px">©2022 Peppermint Ticket Management, a Peppermint Labs product.<br />All rights reserved.</p>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</table>
</body>
</html>
Gestion des clients
Rendez-vous dans Paramètres Administrateur, Clients:
Soit vous avez le Guest Ticket Url, la personne n'a pas de compte mais pourra ouvrir un ticket en laissant son e-mail.
Le Portal Url, pour les personnes ayant un compte:
Et le Portail Register, pour s'enregistrer soi-même:
Configuration du proxy
Suivant vos habitudes, créer le fichier peppermint-client.conf:
peppermint-client.conf
Collez ça dedans:
server {
listen 80;
listen [::]:80;
server_name peppermint.example.com;
add_header Strict-Transport-Security "max-age=15552000; includeSubDomains" always;
location / {
proxy_pass http://127.0.0.1:3000;
proxy_next_upstream error timeout invalid_header http_500 http_502 http_503;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forward-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto https;
proxy_redirect off;
proxy_read_timeout 5m;
}
client_max_body_size 10M;
}
Redémarrez nginx:
systemctl restart nginx