mirror of
https://github.com/house-of-vanity/OutFleet.git
synced 2025-10-24 01:09:08 +00:00
init rust. WIP: tls for inbounds
This commit is contained in:
Ultradesu
1314
static/admin.html
Normal file
1314
static/admin.html
Normal file
File diff suppressed because it is too large
Load Diff
@@ -1,239 +0,0 @@
|
||||
/* static/admin/css/main.css */
|
||||
|
||||
/* Bulk Action Section Styling */
|
||||
.bulk-actions-section {
|
||||
background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
|
||||
border: 1px solid #dee2e6;
|
||||
border-left: 4px solid #007cba;
|
||||
border-radius: 8px;
|
||||
padding: 20px;
|
||||
margin: 20px 0;
|
||||
box-shadow: 0 2px 4px rgba(0,0,0,0.05);
|
||||
}
|
||||
|
||||
.bulk-actions-section h3 {
|
||||
color: #007cba;
|
||||
margin-top: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.bulk-actions-section p {
|
||||
color: #6c757d;
|
||||
margin-bottom: 15px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
/* Action Button Styles */
|
||||
.server-action-btn, .bulk-action-btn {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 10px 15px;
|
||||
border-radius: 6px;
|
||||
text-decoration: none;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease;
|
||||
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.server-action-btn:before, .bulk-action-btn:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: -100%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
|
||||
transition: left 0.5s;
|
||||
}
|
||||
|
||||
.server-action-btn:hover:before, .bulk-action-btn:hover:before {
|
||||
left: 100%;
|
||||
}
|
||||
|
||||
.server-action-btn:hover, .bulk-action-btn:hover {
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.15);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* Specific button colors */
|
||||
.btn-move-clients {
|
||||
background-color: #007cba;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn-move-clients:hover {
|
||||
background-color: #005a8b !important;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn-purge-users {
|
||||
background-color: #dc3545;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn-purge-users:hover {
|
||||
background-color: #c82333 !important;
|
||||
color: white;
|
||||
}
|
||||
|
||||
/* Server list action buttons */
|
||||
.field-server_actions {
|
||||
min-width: 160px;
|
||||
}
|
||||
|
||||
.field-server_actions .server-action-btn {
|
||||
padding: 5px 8px;
|
||||
font-size: 11px;
|
||||
gap: 4px;
|
||||
margin: 2px;
|
||||
}
|
||||
|
||||
/* Server statistics section */
|
||||
.server-stats-section {
|
||||
background-color: #e8f4fd;
|
||||
border: 1px solid #bee5eb;
|
||||
border-radius: 6px;
|
||||
padding: 12px;
|
||||
margin: 15px 0;
|
||||
}
|
||||
|
||||
.server-stats-grid {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.stat-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
.stat-label {
|
||||
color: #495057;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.stat-value {
|
||||
color: #007cba;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* Tip section styling */
|
||||
.tip-section {
|
||||
background-color: rgba(255, 243, 205, 0.8);
|
||||
border-left: 4px solid #ffc107;
|
||||
border-radius: 4px;
|
||||
padding: 12px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.tip-section small {
|
||||
color: #856404;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
/* Loading states */
|
||||
.server-action-btn.loading {
|
||||
pointer-events: none;
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.server-action-btn.loading:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin: auto;
|
||||
border: 2px solid transparent;
|
||||
border-top-color: #ffffff;
|
||||
border-radius: 50%;
|
||||
animation: spin 1s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
0% { transform: rotate(0deg); }
|
||||
100% { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
/* Responsive design */
|
||||
@media (max-width: 768px) {
|
||||
.bulk-actions-section {
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.server-action-btn, .bulk-action-btn {
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.server-stats-grid {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.field-server_actions > div {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.field-server_actions .server-action-btn {
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
margin: 2px 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.bulk-actions-section h3 {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.server-action-btn, .bulk-action-btn {
|
||||
font-size: 13px;
|
||||
padding: 8px 12px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Dark mode support */
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.bulk-actions-section {
|
||||
background: linear-gradient(135deg, #2d3748 0%, #4a5568 100%);
|
||||
border-color: #4a5568;
|
||||
color: #e2e8f0;
|
||||
}
|
||||
|
||||
.bulk-actions-section h3 {
|
||||
color: #63b3ed;
|
||||
}
|
||||
|
||||
.bulk-actions-section p {
|
||||
color: #a0aec0;
|
||||
}
|
||||
|
||||
.server-stats-section {
|
||||
background-color: #2d3748;
|
||||
border-color: #4a5568;
|
||||
color: #e2e8f0;
|
||||
}
|
||||
|
||||
.stat-label {
|
||||
color: #a0aec0;
|
||||
}
|
||||
|
||||
.stat-value {
|
||||
color: #63b3ed;
|
||||
}
|
||||
}
|
||||
@@ -1,342 +0,0 @@
|
||||
/* Custom styles for VPN admin interface */
|
||||
|
||||
/* Quick action buttons in server list */
|
||||
.quick-actions .button {
|
||||
display: inline-block;
|
||||
padding: 4px 8px;
|
||||
margin: 0 2px;
|
||||
font-size: 11px;
|
||||
line-height: 1.2;
|
||||
text-decoration: none;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 3px;
|
||||
background: linear-gradient(to bottom, #f8f8f8, #e8e8e8);
|
||||
color: #333;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
min-width: 60px;
|
||||
text-align: center;
|
||||
box-shadow: 0 1px 2px rgba(0,0,0,0.1);
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.quick-actions .button:hover {
|
||||
background: linear-gradient(to bottom, #e8e8e8, #d8d8d8);
|
||||
border-color: #bbb;
|
||||
color: #000;
|
||||
text-decoration: none;
|
||||
box-shadow: 0 2px 4px rgba(0,0,0,0.15);
|
||||
}
|
||||
|
||||
.quick-actions .button:active {
|
||||
background: linear-gradient(to bottom, #d8d8d8, #e8e8e8);
|
||||
box-shadow: inset 0 1px 2px rgba(0,0,0,0.2);
|
||||
}
|
||||
|
||||
/* Sync button - blue theme */
|
||||
.quick-actions .button[href*="/sync/"] {
|
||||
background: linear-gradient(to bottom, #4a90e2, #357abd);
|
||||
border-color: #2968a3;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.quick-actions .button[href*="/sync/"]:hover {
|
||||
background: linear-gradient(to bottom, #357abd, #2968a3);
|
||||
border-color: #1f5582;
|
||||
}
|
||||
|
||||
/* Move clients button - orange theme */
|
||||
.quick-actions .button[href*="/move-clients/"] {
|
||||
background: linear-gradient(to bottom, #f39c12, #e67e22);
|
||||
border-color: #d35400;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.quick-actions .button[href*="/move-clients/"]:hover {
|
||||
background: linear-gradient(to bottom, #e67e22, #d35400);
|
||||
border-color: #bf4f36;
|
||||
}
|
||||
|
||||
/* Status indicators improvements */
|
||||
.server-status-ok {
|
||||
color: #27ae60;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.server-status-error {
|
||||
color: #e74c3c;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.server-status-warning {
|
||||
color: #f39c12;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* Better spacing for list display */
|
||||
.admin-object-tools {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
/* Improve readability of pre-formatted status */
|
||||
.changelist-results pre {
|
||||
font-size: 11px;
|
||||
margin: 0;
|
||||
padding: 2px 4px;
|
||||
background: #f8f8f8;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 3px;
|
||||
max-width: 200px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
/* Server admin compact styles */
|
||||
.server-stats {
|
||||
max-width: 120px;
|
||||
min-width: 90px;
|
||||
}
|
||||
|
||||
.server-activity {
|
||||
max-width: 140px;
|
||||
min-width: 100px;
|
||||
}
|
||||
|
||||
.server-status {
|
||||
max-width: 160px;
|
||||
min-width: 120px;
|
||||
}
|
||||
|
||||
.server-comment {
|
||||
max-width: 200px;
|
||||
min-width: 100px;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
/* Compact server display elements */
|
||||
.changelist-results .server-stats div,
|
||||
.changelist-results .server-activity div,
|
||||
.changelist-results .server-status div {
|
||||
line-height: 1.3;
|
||||
margin: 1px 0;
|
||||
}
|
||||
|
||||
/* Status indicator colors */
|
||||
.status-online {
|
||||
color: #16a34a !important;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.status-error {
|
||||
color: #dc2626 !important;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.status-warning {
|
||||
color: #f97316 !important;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.status-unavailable {
|
||||
color: #f97316 !important;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* Activity indicators */
|
||||
.activity-high {
|
||||
color: #16a34a !important;
|
||||
}
|
||||
|
||||
.activity-medium {
|
||||
color: #eab308 !important;
|
||||
}
|
||||
|
||||
.activity-low {
|
||||
color: #f97316 !important;
|
||||
}
|
||||
|
||||
.activity-none {
|
||||
color: #dc2626 !important;
|
||||
}
|
||||
|
||||
/* User stats indicators */
|
||||
.users-active {
|
||||
color: #16a34a !important;
|
||||
}
|
||||
|
||||
.users-medium {
|
||||
color: #eab308 !important;
|
||||
}
|
||||
|
||||
.users-low {
|
||||
color: #f97316 !important;
|
||||
}
|
||||
|
||||
.users-none {
|
||||
color: #9ca3af !important;
|
||||
}
|
||||
|
||||
/* Table cell width constraints for better layout */
|
||||
table.changelist-results th:nth-child(1), /* Name */
|
||||
table.changelist-results td:nth-child(1) {
|
||||
width: 180px;
|
||||
max-width: 180px;
|
||||
}
|
||||
|
||||
table.changelist-results th:nth-child(3), /* Comment */
|
||||
table.changelist-results td:nth-child(3) {
|
||||
width: 200px;
|
||||
max-width: 200px;
|
||||
}
|
||||
|
||||
table.changelist-results th:nth-child(4), /* User Stats */
|
||||
table.changelist-results td:nth-child(4) {
|
||||
width: 120px;
|
||||
max-width: 120px;
|
||||
}
|
||||
|
||||
table.changelist-results th:nth-child(5), /* Activity */
|
||||
table.changelist-results td:nth-child(5) {
|
||||
width: 140px;
|
||||
max-width: 140px;
|
||||
}
|
||||
|
||||
table.changelist-results th:nth-child(6), /* Status */
|
||||
table.changelist-results td:nth-child(6) {
|
||||
width: 160px;
|
||||
max-width: 160px;
|
||||
}
|
||||
|
||||
/* Ensure text doesn't overflow in server admin */
|
||||
.changelist-results td {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
/* Allow wrapping for multi-line server info displays */
|
||||
.changelist-results td .server-stats,
|
||||
.changelist-results td .server-activity,
|
||||
.changelist-results td .server-status {
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
/* Server type icons */
|
||||
.server-type-outline {
|
||||
color: #3b82f6;
|
||||
}
|
||||
|
||||
.server-type-wireguard {
|
||||
color: #10b981;
|
||||
}
|
||||
|
||||
/* Tooltip styles for truncated text */
|
||||
[title] {
|
||||
cursor: help;
|
||||
border-bottom: 1px dotted #999;
|
||||
}
|
||||
|
||||
/* Form improvements for move clients page */
|
||||
.form-row.field-box {
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
padding: 10px;
|
||||
margin: 10px 0;
|
||||
background: #f9f9f9;
|
||||
}
|
||||
|
||||
.form-row.field-box label {
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
display: block;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.form-row.field-box .readonly {
|
||||
padding: 5px;
|
||||
background: white;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.help {
|
||||
background: #e8f4fd;
|
||||
border: 1px solid #b8daff;
|
||||
border-radius: 4px;
|
||||
padding: 15px;
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
.help h3 {
|
||||
margin-top: 0;
|
||||
color: #0066cc;
|
||||
}
|
||||
|
||||
.help ul {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.help li {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
/* Make user statistics section wider */
|
||||
.field-user_statistics_summary {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.field-user_statistics_summary .readonly {
|
||||
max-width: none !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.field-user_statistics_summary .user-management-section {
|
||||
width: 100% !important;
|
||||
max-width: none !important;
|
||||
}
|
||||
|
||||
/* Wider fieldset for statistics */
|
||||
.wide {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.wide .form-row {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
/* Server status button styles */
|
||||
.check-status-btn {
|
||||
transition: all 0.2s ease;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.check-status-btn:hover {
|
||||
opacity: 0.8;
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
.check-status-btn:disabled {
|
||||
opacity: 0.6;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
/* Make admin tables more responsive */
|
||||
.changelist-results table {
|
||||
width: 100%;
|
||||
table-layout: auto;
|
||||
}
|
||||
|
||||
/* Improve button spacing */
|
||||
.btn-sm-custom {
|
||||
margin: 0 2px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/* Hide xray-subscriptions tab if it appears */
|
||||
#xray-subscriptions-tab,
|
||||
a[href="#xray-subscriptions-tab"],
|
||||
li:has(a[href="#xray-subscriptions-tab"]) {
|
||||
display: none !important;
|
||||
}
|
||||
@@ -1,203 +0,0 @@
|
||||
// static/admin/js/generate_uuid.js
|
||||
|
||||
function generateLink(button) {
|
||||
let row = button.closest('tr');
|
||||
let inputField = row.querySelector('input[name$="link"]');
|
||||
|
||||
if (inputField) {
|
||||
inputField.value = generateRandomString(16);
|
||||
}
|
||||
}
|
||||
|
||||
function generateRandomString(length) {
|
||||
const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
|
||||
let result = '';
|
||||
for (let i = 0; i < length; i++) {
|
||||
result += chars.charAt(Math.floor(Math.random() * chars.length));
|
||||
}
|
||||
return result;
|
||||
}
|
||||
|
||||
// OutlineServer JSON Configuration Functionality
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
|
||||
// JSON Import functionality
|
||||
const importJsonBtn = document.getElementById('import-json-btn');
|
||||
const importJsonTextarea = document.getElementById('import-json-config');
|
||||
|
||||
if (importJsonBtn && importJsonTextarea) {
|
||||
// Auto-fill on paste event
|
||||
importJsonTextarea.addEventListener('paste', function(e) {
|
||||
// Small delay to let paste complete
|
||||
setTimeout(() => {
|
||||
tryAutoFillFromJson();
|
||||
}, 100);
|
||||
});
|
||||
|
||||
// Manual import button
|
||||
importJsonBtn.addEventListener('click', function() {
|
||||
tryAutoFillFromJson();
|
||||
});
|
||||
|
||||
function tryAutoFillFromJson() {
|
||||
try {
|
||||
const jsonText = importJsonTextarea.value.trim();
|
||||
if (!jsonText) {
|
||||
alert('Please enter JSON configuration');
|
||||
return;
|
||||
}
|
||||
|
||||
const config = JSON.parse(jsonText);
|
||||
|
||||
// Validate required fields
|
||||
if (!config.apiUrl || !config.certSha256) {
|
||||
alert('Invalid JSON format. Required fields: apiUrl, certSha256');
|
||||
return;
|
||||
}
|
||||
|
||||
// Parse apiUrl to extract components
|
||||
const url = new URL(config.apiUrl);
|
||||
|
||||
// Fill form fields
|
||||
const adminUrlField = document.getElementById('id_admin_url');
|
||||
const adminCertField = document.getElementById('id_admin_access_cert');
|
||||
const clientHostnameField = document.getElementById('id_client_hostname');
|
||||
const clientPortField = document.getElementById('id_client_port');
|
||||
const nameField = document.getElementById('id_name');
|
||||
const commentField = document.getElementById('id_comment');
|
||||
|
||||
if (adminUrlField) adminUrlField.value = config.apiUrl;
|
||||
if (adminCertField) adminCertField.value = config.certSha256;
|
||||
|
||||
// Use provided hostname or extract from URL
|
||||
const hostname = config.clientHostname || config.hostnameForAccessKeys || url.hostname;
|
||||
if (clientHostnameField) clientHostnameField.value = hostname;
|
||||
|
||||
// Use provided port or extract from various sources
|
||||
const clientPort = config.clientPort || config.portForNewAccessKeys || url.port || '1257';
|
||||
if (clientPortField) clientPortField.value = clientPort;
|
||||
|
||||
// Generate server name if not provided and field is empty
|
||||
if (nameField && !nameField.value) {
|
||||
const serverName = config.serverName || config.name || `Outline-${hostname}`;
|
||||
nameField.value = serverName;
|
||||
}
|
||||
|
||||
// Fill comment if provided and field exists
|
||||
if (commentField && config.comment) {
|
||||
commentField.value = config.comment;
|
||||
}
|
||||
|
||||
// Clear the JSON input
|
||||
importJsonTextarea.value = '';
|
||||
|
||||
// Show success message
|
||||
showSuccessMessage('✅ Configuration imported successfully!');
|
||||
|
||||
} catch (error) {
|
||||
alert('Invalid JSON format: ' + error.message);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Copy to clipboard functionality
|
||||
window.copyToClipboard = function(elementId) {
|
||||
const element = document.getElementById(elementId);
|
||||
if (element) {
|
||||
const text = element.textContent || element.innerText;
|
||||
|
||||
if (navigator.clipboard && window.isSecureContext) {
|
||||
navigator.clipboard.writeText(text).then(() => {
|
||||
showCopySuccess();
|
||||
}).catch(err => {
|
||||
fallbackCopyTextToClipboard(text);
|
||||
});
|
||||
} else {
|
||||
fallbackCopyTextToClipboard(text);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
function fallbackCopyTextToClipboard(text) {
|
||||
const textArea = document.createElement('textarea');
|
||||
textArea.value = text;
|
||||
textArea.style.position = 'fixed';
|
||||
textArea.style.left = '-999999px';
|
||||
textArea.style.top = '-999999px';
|
||||
document.body.appendChild(textArea);
|
||||
textArea.focus();
|
||||
textArea.select();
|
||||
|
||||
try {
|
||||
document.execCommand('copy');
|
||||
showCopySuccess();
|
||||
} catch (err) {
|
||||
console.error('Failed to copy text: ', err);
|
||||
}
|
||||
|
||||
document.body.removeChild(textArea);
|
||||
}
|
||||
|
||||
function showCopySuccess() {
|
||||
showSuccessMessage('📋 Copied to clipboard!');
|
||||
}
|
||||
|
||||
function showSuccessMessage(message) {
|
||||
const alertHtml = `
|
||||
<div class="alert alert-success alert-dismissible" style="margin: 1rem 0;">
|
||||
${message}
|
||||
<button type="button" class="close" aria-label="Close" onclick="this.parentElement.remove()">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
`;
|
||||
|
||||
// Try to find a container for the message
|
||||
const container = document.querySelector('.card-body') || document.querySelector('#content-main');
|
||||
if (container) {
|
||||
container.insertAdjacentHTML('afterbegin', alertHtml);
|
||||
}
|
||||
|
||||
setTimeout(() => {
|
||||
const alert = document.querySelector('.alert-success');
|
||||
if (alert) alert.remove();
|
||||
}, 5000);
|
||||
}
|
||||
|
||||
// Sync server button - handle both static and dynamic buttons
|
||||
document.addEventListener('click', async function(e) {
|
||||
if (e.target && (e.target.id === 'sync-server-btn' || e.target.matches('[id="sync-server-btn"]'))) {
|
||||
const syncBtn = e.target;
|
||||
const serverId = syncBtn.dataset.serverId;
|
||||
const csrfToken = document.querySelector('[name=csrfmiddlewaretoken]').value;
|
||||
|
||||
const originalText = syncBtn.textContent;
|
||||
syncBtn.textContent = '⏳ Syncing...';
|
||||
syncBtn.disabled = true;
|
||||
|
||||
try {
|
||||
const response = await fetch(`/admin/vpn/outlineserver/${serverId}/sync/`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/x-www-form-urlencoded',
|
||||
'X-CSRFToken': csrfToken
|
||||
}
|
||||
});
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
if (data.success) {
|
||||
showSuccessMessage(`✅ ${data.message}`);
|
||||
setTimeout(() => window.location.reload(), 2000);
|
||||
} else {
|
||||
alert('Sync failed: ' + data.error);
|
||||
}
|
||||
} catch (error) {
|
||||
alert('Network error: ' + error.message);
|
||||
} finally {
|
||||
syncBtn.textContent = originalText;
|
||||
syncBtn.disabled = false;
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
@@ -1,94 +0,0 @@
|
||||
// Server status check functionality for admin
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// Add event listeners to all check status buttons
|
||||
document.querySelectorAll('.check-status-btn').forEach(button => {
|
||||
button.addEventListener('click', async function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
const serverId = this.dataset.serverId;
|
||||
const serverName = this.dataset.serverName;
|
||||
const serverType = this.dataset.serverType;
|
||||
const originalText = this.textContent;
|
||||
const originalColor = this.style.background;
|
||||
|
||||
// Show loading state
|
||||
this.textContent = '⏳ Checking...';
|
||||
this.style.background = '#6c757d';
|
||||
this.disabled = true;
|
||||
|
||||
try {
|
||||
// Try AJAX request first
|
||||
const response = await fetch(`/admin/vpn/server/${serverId}/check-status/`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/x-www-form-urlencoded',
|
||||
'X-CSRFToken': getCookie('csrftoken')
|
||||
}
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP ${response.status}: ${response.statusText}`);
|
||||
}
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
if (data.success) {
|
||||
// Update button based on status
|
||||
if (data.status === 'online') {
|
||||
this.textContent = '✅ Online';
|
||||
this.style.background = '#28a745';
|
||||
} else if (data.status === 'offline') {
|
||||
this.textContent = '❌ Offline';
|
||||
this.style.background = '#dc3545';
|
||||
} else if (data.status === 'error') {
|
||||
this.textContent = '⚠️ Error';
|
||||
this.style.background = '#fd7e14';
|
||||
} else {
|
||||
this.textContent = '❓ Unknown';
|
||||
this.style.background = '#6c757d';
|
||||
}
|
||||
|
||||
// Show additional info if available
|
||||
if (data.message) {
|
||||
this.title = data.message;
|
||||
}
|
||||
|
||||
} else {
|
||||
throw new Error(data.error || 'Failed to check status');
|
||||
}
|
||||
|
||||
} catch (error) {
|
||||
console.error('Error checking server status:', error);
|
||||
|
||||
// Fallback: show basic server info
|
||||
this.textContent = `📊 ${serverType}`;
|
||||
this.style.background = '#17a2b8';
|
||||
this.title = `Server: ${serverName} (${serverType}) - Status check failed: ${error.message}`;
|
||||
}
|
||||
|
||||
// Reset after 5 seconds in all cases
|
||||
setTimeout(() => {
|
||||
this.textContent = originalText;
|
||||
this.style.background = originalColor;
|
||||
this.title = '';
|
||||
this.disabled = false;
|
||||
}, 5000);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
// Helper function to get CSRF token
|
||||
function getCookie(name) {
|
||||
let cookieValue = null;
|
||||
if (document.cookie && document.cookie !== '') {
|
||||
const cookies = document.cookie.split(';');
|
||||
for (let i = 0; i < cookies.length; i++) {
|
||||
const cookie = cookies[i].trim();
|
||||
if (cookie.substring(0, name.length + 1) === (name + '=')) {
|
||||
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
return cookieValue;
|
||||
}
|
||||
@@ -1,289 +0,0 @@
|
||||
// Xray Inbound Auto-Fill Helper
|
||||
console.log('Xray inbound helper script loaded');
|
||||
|
||||
// Protocol configurations based on Xray documentation
|
||||
const protocolConfigs = {
|
||||
'vless': {
|
||||
port: 443,
|
||||
network: 'tcp',
|
||||
security: 'tls',
|
||||
description: 'VLESS - Lightweight protocol with UUID authentication'
|
||||
},
|
||||
'vmess': {
|
||||
port: 443,
|
||||
network: 'ws',
|
||||
security: 'tls',
|
||||
description: 'VMess - V2Ray protocol with encryption and authentication'
|
||||
},
|
||||
'trojan': {
|
||||
port: 443,
|
||||
network: 'tcp',
|
||||
security: 'tls',
|
||||
description: 'Trojan - TLS-based protocol mimicking HTTPS traffic'
|
||||
},
|
||||
'shadowsocks': {
|
||||
port: 8388,
|
||||
network: 'tcp',
|
||||
security: 'none',
|
||||
ss_method: 'aes-256-gcm',
|
||||
description: 'Shadowsocks - SOCKS5 proxy with encryption'
|
||||
}
|
||||
};
|
||||
|
||||
// Initialize when DOM is ready
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
console.log('DOM ready, initializing Xray helper');
|
||||
|
||||
// Add help text and generate buttons
|
||||
addHelpText();
|
||||
addGenerateButtons();
|
||||
|
||||
// Watch for protocol field changes
|
||||
const protocolField = document.getElementById('id_protocol');
|
||||
if (protocolField) {
|
||||
protocolField.addEventListener('change', function() {
|
||||
handleProtocolChange(this.value);
|
||||
});
|
||||
|
||||
// Auto-fill on initial load if new inbound
|
||||
if (protocolField.value && isNewInbound()) {
|
||||
handleProtocolChange(protocolField.value);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
function isNewInbound() {
|
||||
// Check if this is a new inbound (no port value set)
|
||||
const portField = document.getElementById('id_port');
|
||||
return !portField || !portField.value;
|
||||
}
|
||||
|
||||
function handleProtocolChange(protocol) {
|
||||
if (!protocol || !protocolConfigs[protocol]) {
|
||||
return;
|
||||
}
|
||||
|
||||
const config = protocolConfigs[protocol];
|
||||
|
||||
// Only auto-fill for new inbounds to avoid overwriting user data
|
||||
if (isNewInbound()) {
|
||||
console.log('Auto-filling fields for new', protocol, 'inbound');
|
||||
autoFillFields(protocol, config);
|
||||
showMessage(`Auto-filled ${protocol.toUpperCase()} configuration`, 'info');
|
||||
}
|
||||
}
|
||||
|
||||
function autoFillFields(protocol, config) {
|
||||
// Fill basic fields only if they're empty
|
||||
fillIfEmpty('id_port', config.port);
|
||||
fillIfEmpty('id_network', config.network);
|
||||
fillIfEmpty('id_security', config.security);
|
||||
|
||||
// Protocol-specific fields
|
||||
if (config.ss_method && protocol === 'shadowsocks') {
|
||||
fillIfEmpty('id_ss_method', config.ss_method);
|
||||
}
|
||||
|
||||
// Generate helpful JSON configs
|
||||
generateJsonConfigs(protocol, config);
|
||||
}
|
||||
|
||||
function fillIfEmpty(fieldId, value) {
|
||||
const field = document.getElementById(fieldId);
|
||||
if (field && !field.value && value !== undefined) {
|
||||
field.value = value;
|
||||
field.dispatchEvent(new Event('change', { bubbles: true }));
|
||||
}
|
||||
}
|
||||
|
||||
function generateJsonConfigs(protocol, config) {
|
||||
// Generate stream settings
|
||||
const streamField = document.getElementById('id_stream_settings');
|
||||
if (streamField && !streamField.value) {
|
||||
const streamSettings = getStreamSettings(protocol, config.network);
|
||||
if (streamSettings) {
|
||||
streamField.value = JSON.stringify(streamSettings, null, 2);
|
||||
}
|
||||
}
|
||||
|
||||
// Generate sniffing settings
|
||||
const sniffingField = document.getElementById('id_sniffing_settings');
|
||||
if (sniffingField && !sniffingField.value) {
|
||||
const sniffingSettings = {
|
||||
enabled: true,
|
||||
destOverride: ['http', 'tls'],
|
||||
metadataOnly: false
|
||||
};
|
||||
sniffingField.value = JSON.stringify(sniffingSettings, null, 2);
|
||||
}
|
||||
}
|
||||
|
||||
function getStreamSettings(protocol, network) {
|
||||
const settings = {};
|
||||
|
||||
switch (network) {
|
||||
case 'ws':
|
||||
settings.wsSettings = {
|
||||
path: '/ws',
|
||||
headers: {
|
||||
Host: 'example.com'
|
||||
}
|
||||
};
|
||||
break;
|
||||
case 'grpc':
|
||||
settings.grpcSettings = {
|
||||
serviceName: 'GunService'
|
||||
};
|
||||
break;
|
||||
case 'h2':
|
||||
settings.httpSettings = {
|
||||
host: ['example.com'],
|
||||
path: '/path'
|
||||
};
|
||||
break;
|
||||
case 'tcp':
|
||||
settings.tcpSettings = {
|
||||
header: {
|
||||
type: 'none'
|
||||
}
|
||||
};
|
||||
break;
|
||||
case 'kcp':
|
||||
settings.kcpSettings = {
|
||||
mtu: 1350,
|
||||
tti: 50,
|
||||
uplinkCapacity: 5,
|
||||
downlinkCapacity: 20,
|
||||
congestion: false,
|
||||
readBufferSize: 2,
|
||||
writeBufferSize: 2,
|
||||
header: {
|
||||
type: 'none'
|
||||
}
|
||||
};
|
||||
break;
|
||||
}
|
||||
|
||||
return Object.keys(settings).length > 0 ? settings : null;
|
||||
}
|
||||
|
||||
function addHelpText() {
|
||||
// Add help text to complex fields
|
||||
addFieldHelp('id_stream_settings',
|
||||
'Transport settings: TCP (none), WebSocket (path/host), gRPC (serviceName), etc. Format: JSON');
|
||||
|
||||
addFieldHelp('id_sniffing_settings',
|
||||
'Traffic sniffing for routing: enabled, destOverride ["http","tls"], metadataOnly');
|
||||
|
||||
addFieldHelp('id_tls_cert_file',
|
||||
'TLS certificate file path (required for TLS security). Example: /path/to/cert.pem');
|
||||
|
||||
addFieldHelp('id_tls_key_file',
|
||||
'TLS private key file path (required for TLS security). Example: /path/to/key.pem');
|
||||
|
||||
addFieldHelp('id_protocol',
|
||||
'VLESS: lightweight + UUID | VMess: V2Ray encrypted | Trojan: HTTPS-like | Shadowsocks: SOCKS5');
|
||||
|
||||
addFieldHelp('id_network',
|
||||
'Transport: tcp (direct), ws (WebSocket), grpc (HTTP/2), h2 (HTTP/2), kcp (mKCP)');
|
||||
|
||||
addFieldHelp('id_security',
|
||||
'Encryption: none (no TLS), tls (standard TLS), reality (advanced steganography)');
|
||||
}
|
||||
|
||||
function addFieldHelp(fieldId, helpText) {
|
||||
const field = document.getElementById(fieldId);
|
||||
if (!field) return;
|
||||
|
||||
const helpDiv = document.createElement('div');
|
||||
helpDiv.className = 'help';
|
||||
helpDiv.style.cssText = 'font-size: 11px; color: #666; margin-top: 2px; line-height: 1.3;';
|
||||
helpDiv.textContent = helpText;
|
||||
|
||||
field.parentNode.appendChild(helpDiv);
|
||||
}
|
||||
|
||||
function showMessage(message, type = 'info') {
|
||||
const messageDiv = document.createElement('div');
|
||||
messageDiv.className = `alert alert-${type}`;
|
||||
messageDiv.style.cssText = `
|
||||
position: fixed;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
z-index: 9999;
|
||||
padding: 12px 20px;
|
||||
border-radius: 4px;
|
||||
background: ${type === 'success' ? '#d4edda' : '#cce7ff'};
|
||||
border: 1px solid ${type === 'success' ? '#c3e6cb' : '#b8daff'};
|
||||
color: ${type === 'success' ? '#155724' : '#004085'};
|
||||
font-weight: 500;
|
||||
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
|
||||
`;
|
||||
messageDiv.textContent = message;
|
||||
|
||||
document.body.appendChild(messageDiv);
|
||||
|
||||
setTimeout(() => {
|
||||
messageDiv.remove();
|
||||
}, 3000);
|
||||
}
|
||||
|
||||
// Helper functions for generating values
|
||||
function generateRandomString(length = 8) {
|
||||
const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
|
||||
let result = '';
|
||||
for (let i = 0; i < length; i++) {
|
||||
result += chars.charAt(Math.floor(Math.random() * chars.length));
|
||||
}
|
||||
return result;
|
||||
}
|
||||
|
||||
function generateShortId() {
|
||||
return Math.random().toString(16).substr(2, 8);
|
||||
}
|
||||
|
||||
function suggestPort(protocol) {
|
||||
const ports = {
|
||||
'vless': [443, 8443, 2053, 2083],
|
||||
'vmess': [443, 80, 8080, 8443],
|
||||
'trojan': [443, 8443, 2087],
|
||||
'shadowsocks': [8388, 1080, 8080]
|
||||
};
|
||||
const protocolPorts = ports[protocol] || [443];
|
||||
return protocolPorts[Math.floor(Math.random() * protocolPorts.length)];
|
||||
}
|
||||
|
||||
// Add generate buttons to fields
|
||||
function addGenerateButtons() {
|
||||
console.log('Adding generate buttons');
|
||||
|
||||
// Add tag generator
|
||||
addGenerateButton('id_tag', '🎲', () => `inbound-${generateShortId()}`);
|
||||
|
||||
// Add port suggestion based on protocol
|
||||
addGenerateButton('id_port', '🎯', () => {
|
||||
const protocol = document.getElementById('id_protocol')?.value;
|
||||
return suggestPort(protocol);
|
||||
});
|
||||
}
|
||||
|
||||
function addGenerateButton(fieldId, icon, generator) {
|
||||
const field = document.getElementById(fieldId);
|
||||
if (!field || field.nextElementSibling?.classList.contains('generate-btn')) return;
|
||||
|
||||
const button = document.createElement('button');
|
||||
button.type = 'button';
|
||||
button.className = 'generate-btn btn btn-sm btn-secondary';
|
||||
button.innerHTML = icon;
|
||||
button.title = 'Generate value';
|
||||
button.style.cssText = 'margin-left: 5px; padding: 2px 6px; font-size: 12px;';
|
||||
|
||||
button.addEventListener('click', () => {
|
||||
const value = generator();
|
||||
field.value = value;
|
||||
showMessage(`Generated: ${value}`, 'success');
|
||||
field.dispatchEvent(new Event('change', { bubbles: true }));
|
||||
});
|
||||
|
||||
field.parentNode.insertBefore(button, field.nextSibling);
|
||||
}
|
||||
1289
static/index.html
Normal file
1289
static/index.html
Normal file
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user