maxime.daniels/portail-gise
2
0
Fork 0
Code Issues 9 Pull Requests Actions Packages Projects 3 Releases Wiki Activity

upgrade design

Browse Source
This commit is contained in:
LathanDevers
2026-06-25 10:50:49 +02:00
parent 323667e835
commit d83b7ad4e7
9 changed files with 226 additions and 442 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/services/VpsManager.jsx
+46 -2
View File
@@ -1,5 +1,5 @@
import { useState } from 'react';
import { Folder, ExternalLink, Play, Maximize2, Lock } from 'lucide-react';
import { Folder, ExternalLink, Play, Maximize2, Lock, Copy, Check } from 'lucide-react';
export default function VpsManager({ details, orderId, onRefresh, onAlert }) {
const [showTerminal, setShowTerminal] = useState(false);
@@ -7,11 +7,18 @@ export default function VpsManager({ details, orderId, onRefresh, onAlert }) {
const [newDomain, setNewDomain] = useState(details.domain);
const [isUpdating, setIsUpdating] = useState(false);
const [sslStatus, setSslStatus] = useState(null);
const [copiedField, setCopiedField] = useState(null);
const isInternal = details.domain && details.domain.endsWith('.gise.be');
const fileManagerUrl = isInternal ? `https://file-${details.domain}` : `http://${details.domain}:8080`;
const terminalUrl = isInternal ? `https://terminal-${details.domain}` : `http://${details.domain}:8081`;
const handleCopy = (text, field) => {
navigator.clipboard.writeText(text);
setCopiedField(field);
setTimeout(() => setCopiedField(null), 2000);
};
const handleUpdateDomain = async () => {
if (!newDomain || newDomain === details.domain) return;
setIsUpdating(true);
@@ -62,7 +69,44 @@ export default function VpsManager({ details, orderId, onRefresh, onAlert }) {
</div>
)}
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-6 mb-6">
{/* ENCART DES IDENTIFIANTS */}
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6">
<div className="bg-black/60 border border-gray-800 rounded p-3">
<span className="text-gray-500 font-bold uppercase tracking-wider block mb-2 text-[10px] flex items-center gap-1">
<Folder className="w-3 h-3" /> Accès Explorateur
</span>
<div className="flex justify-between items-center mb-1">
<span className="text-xs font-mono text-gray-400">User: <strong className="text-cyan-400">root</strong></span>
<button onClick={() => handleCopy('root', 'fileUser')} className="text-gray-500 hover:text-cyan-400 p-1">
{copiedField === 'fileUser' ? <Check className="w-3 h-3 text-cyan-400" /> : <Copy className="w-3 h-3" />}
</button>
</div>
<div className="flex justify-between items-center">
<span className="text-xs font-mono text-gray-400">Pass: <strong className="text-cyan-400">NexusGise2026!</strong></span>
<button onClick={() => handleCopy('NexusGise2026!', 'filePass')} className="text-gray-500 hover:text-cyan-400 p-1">
{copiedField === 'filePass' ? <Check className="w-3 h-3 text-cyan-400" /> : <Copy className="w-3 h-3" />}
</button>
</div>
</div>
<div className="bg-black/60 border border-gray-800 rounded p-3">
<span className="text-gray-500 font-bold uppercase tracking-wider block mb-2 text-[10px] flex items-center gap-1">
<Play className="w-3 h-3" /> Accès Console / SSH
</span>
<div className="flex justify-between items-center mb-1">
<span className="text-xs font-mono text-gray-400">User: <strong className="text-cyan-400">root</strong></span>
<button onClick={() => handleCopy('root', 'sshUser')} className="text-gray-500 hover:text-cyan-400 p-1">
{copiedField === 'sshUser' ? <Check className="w-3 h-3 text-cyan-400" /> : <Copy className="w-3 h-3" />}
</button>
</div>
<div className="flex justify-between items-center">
<span className="text-xs font-mono text-gray-400">Pass: <span className="text-gray-600 italic">Défini à l'installation</span></span>
</div>
</div>
</div>
{/* BOUTONS D'ACTIONS */}
<div className="grid grid-cols-1 md:grid-cols-2 gap-6 mb-2">
<button onClick={() => window.open(fileManagerUrl, '_blank')} className="bg-gray-950 hover:bg-gray-900 border border-gray-800 hover:border-cyan-500/50 rounded p-3 flex justify-between items-center transition group">
<span className="font-mono text-gray-300 text-sm flex items-center gap-2"><Folder className="w-4 h-4 text-cyan-500" /> Explorateur</span><ExternalLink className="w-4 h-4 text-gray-600 group-hover:text-cyan-400" />
</button>