mirror of
http://forgejo-oa09toasww4dgii9cj3gpzda.187.127.164.61.sslip.io/iamcoolvivek007/bharath.git
synced 2026-06-11 00:06:51 +00:00
- Multi-language support (English, Hindi, Tamil, Telugu) with icon-based UI - Voice input (Web Speech API) for low-literacy users - Driver tools: Ledger, Trip Planner, Return Load, Safety, Maintenance, FASTag - Marketplace: WhatsApp share, Rate Intelligence, Classifieds, Fleet - Engagement: Gamification (XP/Levels), Challenges, Leaderboard, Referrals, Feed - Business: Invoice (GST+UPI), Reports+CSV, Notifications, Documents, Bank - Games: Rate Guesser, Route Quiz - SEO: Sitemap, public load share pages with OG tags - India utilities: vehicle validation, UPI links, toll/fuel calculator - 29 routes, 54 templates, 4 languages, 3 migration files
92 lines
4.3 KiB
Text
92 lines
4.3 KiB
Text
<% var title = t('actions.register'); %>
|
|
<%- include('../partials/header') %>
|
|
<div class="tricolor-strip"><div class="tricolor-saffron"></div><div class="tricolor-white"></div><div class="tricolor-green"></div></div>
|
|
|
|
<section class="section">
|
|
<div class="container" style="max-width:440px">
|
|
<div class="card">
|
|
<h2 class="text-center" style="margin-bottom:4px"><%= t('auth.registerTitle') %></h2>
|
|
<p class="text-center" style="color:var(--gray-700);font-size:0.8rem;margin-bottom:var(--space-lg)"><%= t('auth.registerSubtitle') %></p>
|
|
|
|
<% if (error) { %>
|
|
<div class="alert-error"><%= error %></div>
|
|
<% } %>
|
|
|
|
<form method="POST" action="/register" id="registerForm">
|
|
<div class="form-group">
|
|
<label class="form-label"><%= t('auth.yourRole') %> *</label>
|
|
<div class="role-select-grid">
|
|
<label class="role-option">
|
|
<input type="radio" name="role" value="driver" <%= role === 'driver' ? 'checked' : '' %> required>
|
|
<div class="role-option-card"><span class="role-icon">🚛</span><span><%= t('auth.driver') %></span></div>
|
|
</label>
|
|
<label class="role-option">
|
|
<input type="radio" name="role" value="shipper" <%= role === 'shipper' ? 'checked' : '' %>>
|
|
<div class="role-option-card"><span class="role-icon">📦</span><span><%= t('auth.shipper') %></span></div>
|
|
</label>
|
|
<label class="role-option">
|
|
<input type="radio" name="role" value="broker" <%= role === 'broker' ? 'checked' : '' %>>
|
|
<div class="role-option-card"><span class="role-icon">🤝</span><span><%= t('auth.broker') %></span></div>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="form-label">👤 <%= t('auth.fullName') %> *</label>
|
|
<input type="text" name="name" class="form-input" placeholder="<%= t('auth.fullName') %>" required>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="form-label" id="usernameLabel">📝 <%= t('auth.username') %> *</label>
|
|
<input type="text" name="username" class="form-input" id="usernameInput" placeholder="<%= t('auth.username') %>" required>
|
|
<small id="usernameHint" style="color:var(--gray-700);font-size:0.7rem"></small>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="form-label">📱 <%= t('auth.phone') %></label>
|
|
<input type="tel" name="phone" class="form-input" placeholder="9876543210" maxlength="10">
|
|
</div>
|
|
|
|
<div style="display:grid;grid-template-columns:1fr 1fr;gap:var(--space-md)">
|
|
<div class="form-group">
|
|
<label class="form-label">🔒 <%= t('auth.password') %> *</label>
|
|
<input type="password" name="password" class="form-input" placeholder="••••" required minlength="4">
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="form-label">🔒 <%= t('auth.confirmPassword') %> *</label>
|
|
<input type="password" name="password_confirm" class="form-input" placeholder="••••" required minlength="4">
|
|
</div>
|
|
</div>
|
|
|
|
<button type="submit" class="btn btn-cta btn-block btn-lg"><%= t('auth.registerBtn') %> →</button>
|
|
</form>
|
|
|
|
<p class="text-center" style="margin-top:var(--space-lg);font-size:0.8rem">
|
|
<%= t('auth.hasAccount') %> <a href="/login"><%= t('actions.login') %></a>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<script>
|
|
document.querySelectorAll('input[name="role"]').forEach(r => {
|
|
r.addEventListener('change', function() {
|
|
const label = document.getElementById('usernameLabel');
|
|
const input = document.getElementById('usernameInput');
|
|
const hint = document.getElementById('usernameHint');
|
|
if (this.value === 'driver') {
|
|
label.innerHTML = '🚛 <%= t("auth.vehicleNumber") %> *';
|
|
input.placeholder = 'MH31AB1234';
|
|
hint.textContent = '<%= t("auth.vehicleHint") %>';
|
|
} else {
|
|
label.innerHTML = '📝 <%= t("auth.username") %> *';
|
|
input.placeholder = '<%= t("auth.username") %>';
|
|
hint.textContent = '';
|
|
}
|
|
});
|
|
});
|
|
const checked = document.querySelector('input[name="role"]:checked');
|
|
if (checked) checked.dispatchEvent(new Event('change'));
|
|
</script>
|
|
|
|
<%- include('../partials/footer') %>
|