sso-manager-node/nodejs/views/conf.ejs

<%- include('top') %>
<script type="text/javascript">
	app.auth.forceLogin(['admin', 'app_sso_admin']);

	$(document).ready(function() {
		loadConf();
	});

	async function loadConf() {
		try {
			const data = await app.api.get('conf');
			// Populate SMTP
			if (data.smtp) {
				$('#smtp-host').val(data.smtp.host || '');
				$('#smtp-port').val(data.smtp.port || 587);
				$('#smtp-user').val(data.smtp.user || '');
				$('#smtp-pass').val(data.smtp.pass || '');
				$('#smtp-from').val(data.smtp.from || '');
				$('#smtp-secure').prop('checked', !!data.smtp.secure);
			}
			
			// Populate OAuth
			if (data.oauth) {
				$('#oauth-issuer').val(data.oauth.issuer || '');
				$('#oauth-jwtsecret').val(data.oauth.jwtSecret || '');
				if (data.oauth.token_lifetime) {
					$('#oauth-token-access').val(data.oauth.token_lifetime.access_token || 3600);
					$('#oauth-token-refresh').val(data.oauth.token_lifetime.refresh_token || 2592000);
				}
			}
		} catch (error) {
			app.messages.toast('Failed to load configuration: ' + (error.message || 'Unknown error'), 'danger');
		}
	}

	async function saveConf() {
		const btn = $('#btn-save');
		btn.prop('disabled', true).html('<i class="fas fa-spinner fa-spin"></i> Saving...');
		
		const payload = {
			smtp: {
				host: $('#smtp-host').val(),
				port: parseInt($('#smtp-port').val(), 10) || 587,
				user: $('#smtp-user').val(),
				pass: $('#smtp-pass').val(),
				from: $('#smtp-from').val(),
				secure: $('#smtp-secure').is(':checked')
			},
			oauth: {
				issuer: $('#oauth-issuer').val(),
				jwtSecret: $('#oauth-jwtsecret').val(),
				token_lifetime: {
					access_token: parseInt($('#oauth-token-access').val(), 10) || 3600,
					refresh_token: parseInt($('#oauth-token-refresh').val(), 10) || 2592000
				}
			}
		};

		try {
			await app.api.post('conf', payload);
			app.messages.toast('Configuration saved successfully! It will take effect immediately.', 'success');
		} catch (error) {
			app.messages.toast('Failed to save configuration: ' + error.message, 'danger');
		} finally {
			btn.prop('disabled', false).html('<i class="fas fa-save"></i> Save Configuration');
		}
	}
	
	function togglePassword(id) {
		const el = document.getElementById(id);
		if (el.type === 'password') {
			el.type = 'text';
		} else {
			el.type = 'password';
		}
	}
</script>

<div class="container py-4">
	<div class="row mb-4">
		<div class="col d-flex justify-content-between align-items-center">
			<div>
				<h2><i class="fas fa-cogs"></i> System Configuration</h2>
				<p class="text-muted mb-0">
					Manage runtime configuration such as SMTP settings and OAuth parameters.
					These secrets are stored securely in OpenBao Vault.
				</p>
			</div>
			<div>
				<button class="btn btn-secondary me-2" onclick="loadConf()"><i class="fas fa-undo"></i> Reset</button>
				<button id="btn-save" class="btn btn-primary" onclick="saveConf()"><i class="fas fa-save"></i> Save Configuration</button>
			</div>
		</div>
	</div>

	<div class="row">
		<div class="col-md-6 mb-4">
			<div class="card shadow-sm border-0 h-100">
				<div class="card-header bg-white border-bottom-0 pt-4 pb-0">
					<h5 class="mb-0"><i class="fas fa-envelope text-primary me-2"></i> SMTP Settings</h5>
				</div>
				<div class="card-body">
					<div class="mb-3">
						<label class="form-label">Host</label>
						<input type="text" class="form-control" id="smtp-host">
					</div>
					<div class="mb-3">
						<label class="form-label">Port</label>
						<input type="number" class="form-control" id="smtp-port">
					</div>
					<div class="mb-3">
						<label class="form-label">User</label>
						<input type="text" class="form-control" id="smtp-user">
					</div>
					<div class="mb-3">
						<label class="form-label">Password</label>
						<div class="input-group">
							<input type="password" class="form-control" id="smtp-pass">
							<button class="btn btn-outline-secondary" type="button" onclick="togglePassword('smtp-pass')"><i class="fas fa-eye"></i></button>
						</div>
					</div>
					<div class="mb-3">
						<label class="form-label">From Address</label>
						<input type="text" class="form-control" id="smtp-from">
					</div>
					<div class="form-check">
						<input class="form-check-input" type="checkbox" id="smtp-secure">
						<label class="form-check-label">Use Secure (TLS)</label>
					</div>
				</div>
			</div>
		</div>

		<div class="col-md-6 mb-4">
			<div class="card shadow-sm border-0 h-100">
				<div class="card-header bg-white border-bottom-0 pt-4 pb-0">
					<h5 class="mb-0"><i class="fas fa-key text-success me-2"></i> OAuth & JWT Settings</h5>
				</div>
				<div class="card-body">
					<div class="mb-3">
						<label class="form-label">Issuer URL</label>
						<input type="text" class="form-control" id="oauth-issuer">
					</div>
					<div class="mb-3">
						<label class="form-label">JWT Secret</label>
						<div class="input-group">
							<input type="password" class="form-control" id="oauth-jwtsecret">
							<button class="btn btn-outline-secondary" type="button" onclick="togglePassword('oauth-jwtsecret')"><i class="fas fa-eye"></i></button>
						</div>
					</div>
					<div class="mb-3">
						<label class="form-label">Access Token Lifetime (seconds)</label>
						<input type="number" class="form-control" id="oauth-token-access">
					</div>
					<div class="mb-3">
						<label class="form-label">Refresh Token Lifetime (seconds)</label>
						<input type="number" class="form-control" id="oauth-token-refresh">
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<%- include('bottom') %>