Scribd
Upload
4 views

User Stories

The document contains three HTML pages for a login portal, an admin portal, and an underwriter portal, each with their respective forms and functionalities. The login page allows users to enter their role, user ID, and password to access the admin or underwriter sections. The admin portal includes features for managing underwriters, while the underwriter portal focuses on creating vehicle insurance policies.

Uploaded by

swathin2020csbs
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
4 views

User Stories

The document contains three HTML pages for a login portal, an admin portal, and an underwriter portal, each with their respective forms and functionalities. The login page allows users to enter their role, user ID, and password to access the admin or underwriter sections. The admin portal includes features for managing underwriters, while the underwriter portal focuses on creating vehicle insurance policies.

Uploaded by

swathin2020csbs
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 18

LOGIN PORTAL

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Login Page</title>

<style>

body {

font-family: Arial, sans-serif;

background: linear-gradient(135deg, #74ebd5, #acb6e5);

display: flex;

justify-content: center;

align-items: center;

height: 100vh;

margin: 0;

.login-container {

background: white;

padding: 30px;

border-radius: 10px;

box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);

text-align: center;

width: 100%;

max-width: 350px;

.login-container h2 {

margin-bottom: 20px;
color: #333;

.form-group {

margin-bottom: 15px;

text-align: left;

.form-group label {

display: block;

margin-bottom: 5px;

font-weight: bold;

.form-group input,

.form-group select {

width: 100%;

padding: 10px;

border: 1px solid #ddd;

border-radius: 5px;

box-sizing: border-box;

.login-button {

width: 100%;

padding: 10px;

background: #4caf50;

color: white;

border: none;

border-radius: 5px;

cursor: pointer;
font-size: 16px;

.login-button:hover {

background: #45a049;

.error {

color: red;

font-size: 0.85em;

margin-top: 10px;

.login-footer {

margin-top: 20px;

font-size: 0.9em;

color: #666;

.login-footer a {

color: #4caf50;

text-decoration: none;

.login-footer a:hover {

text-decoration: underline;

</style>

</head>

<body>

<div class="login-container">
<h2>Login</h2>

<form id="loginForm">

<div class="form-group">

<label for="role">Role</label>

<select id="role" name="role" required>

<option value="">Select Role</option>

<option value="admin">Admin</option>

<option value="underwriter">Underwriter</option>

</select>

</div>

<div class="form-group">

<label for="userId">User ID</label>

<input type="text" id="userId" name="userId" placeholder="Enter User ID" required>

</div>

<div class="form-group">

<label for="password">Password</label>

<input type="password" id="password" name="password" placeholder="Enter Password"


required>

</div>

<button type="submit" class="login-button">Login</button>

<div class="error" id="error"></div>

</form>

</div>

<script>

document.getElementById('loginForm').addEventListener('submit', function(event) {

event.preventDefault();

const role = document.getElementById('role').value;

const userId = document.getElementById('userId').value;

const password = document.getElementById('password').value;


const errorDiv = document.getElementById('error');

errorDiv.textContent = '';

if (role === 'admin' && userId === 'Admin' && password === 'admin123') {

alert('Admin login successful!');

window.location.href="file:///C:/Users/SWATHI/Downloads/Admin%20code.html?
#underwriterRegistration"

// Redirect to Admin dashboard

} else if (role === 'underwriter') {

if (role === 'underwriter' && userId === 'Underwriter' && password === 'underwriter123') {

alert('Underwriter login successful!');

window.location.href="file:///C:/Users/SWATHI/Downloads/Underwriter.html"

// Redirect to Underwriter dashboard

} else {

errorDiv.textContent = 'Invalid Underwriter credentials';

} else {

errorDiv.textContent = 'Invalid Admin credentials';

});

</script>

</body>

</html>
ADMIN PORTAL

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Admin Home Page</title>

<style>

body {

font-family: Arial, sans-serif;

background-color: #f4f4f4;

margin: 0;

padding: 0;

.container {

max-width: 1200px;

margin: 20px auto;

padding: 20px;

background: #fff;

border-radius: 5px;

box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);

h1 {

text-align: center;

margin-bottom: 20px;

.action-links {
display: flex;

flex-wrap: wrap;

gap: 20px;

justify-content: center;

.action-link {

background: #007bff;

color: white;

padding: 10px 20px;

border-radius: 5px;

text-decoration: none;

font-size: 16px;

text-align: center;

.action-link:hover {

background: #0056b3;

form {

max-width: 600px;

margin: 20px auto;

background: #f9f9f9;

padding: 20px;

border-radius: 5px;

box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);

.form-group {

margin-bottom: 15px;
}

.form-group label {

display: block;

margin-bottom: 5px;

font-weight: bold;

.form-group input,

.form-group select {

width: 100%;

padding: 10px;

border: 1px solid #ccc;

border-radius: 5px;

box-sizing: border-box;

.form-group button {

width: 100%;

padding: 10px;

background: #4caf50;

color: white;

border: none;

border-radius: 5px;

cursor: pointer;

font-size: 16px;

.form-group button:hover {

background: #45a049;

}
table {

width: 100%;

border-collapse: collapse;

margin-top: 20px;

table th,

table td {

padding: 10px;

text-align: left;

border: 1px solid #ddd;

table th {

background: #007bff;

color: white;

table tr:nth-child(even) {

background: #f2f2f2;

</style>

</head>

<body>

<div class="container">

<h1>Admin Home Page</h1>

<div class="action-links">

<a href="#underwriterRegistration" class="action-link">UnderWriter Registration</a>

<a href="#searchUnderwriter" class="action-link">Search Underwriter by ID</a>


<a href="#updatePassword" class="action-link">Update UnderWriter Password</a>

<a href="#deleteUnderwriter" class="action-link">Delete UnderWriter by ID</a>

<a href="#viewAllUnderwriters" class="action-link">View All UnderWriters</a>

</div>

<!-- Underwriter Registration Form -->

<form id="underwriterRegistration">

<h2>Underwriter Registration</h2>

<div class="form-group">

<label for="underwriterId">Underwriter ID (Auto-Populated)</label>

<input type="text" id="underwriterId" value="AUTO12345" readonly>

</div>

<div class="form-group">

<label for="name">Name</label>

<input type="text" id="name" maxlength="50" placeholder="Enter Name">

</div>

<div class="form-group">

<label for="dob">Date of Birth</label>

<input type="date" id="dob">

</div>

<div class="form-group">

<label for="joiningDate">Joining Date</label>

<input type="date" id="joiningDate">

</div>

<div class="form-group">

<label for="defaultPassword">Default Password</label>

<input type="password" id="defaultPassword" placeholder="Enter Default Password">

</div>

<div class="form-group">

<button type="submit">Register Underwriter</button>

</div>
</form>

<!-- Search Underwriter by ID Form -->

<form id="searchUnderwriter">

<h2>Search Underwriter by ID</h2>

<div class="form-group">

<label for="searchId">Underwriter ID</label>

<input type="text" id="searchId" placeholder="Enter Underwriter ID">

</div>

<div class="form-group">

<button type="submit">Search</button>

</div>

</form>

<!-- Update Password Form -->

<form id="updatePassword">

<h2>Update UnderWriter Password</h2>

<div class="form-group">

<label for="updateId">Underwriter ID</label>

<input type="text" id="updateId" placeholder="Enter Underwriter ID">

</div>

<div class="form-group">

<label for="newPassword">New Password</label>

<input type="password" id="newPassword" placeholder="Enter New Password">

</div>

<div class="form-group">

<button type="submit">Update Password</button>

</div>

</form>

<!-- Delete Underwriter by ID Form -->


<form id="deleteUnderwriter">

<h2>Delete UnderWriter by ID</h2>

<div class="form-group">

<label for="deleteId">Underwriter ID</label>

<input type="text" id="deleteId" placeholder="Enter Underwriter ID">

</div>

<div class="form-group">

<button type="submit">Delete</button>

</div>

</form>

<!-- View All Underwriters Table -->

<div id="viewAllUnderwriters">

<h2>View All UnderWriters</h2>

<table>

<thead>

<tr>

<th>Underwriter ID</th>

<th>Name</th>

<th>Date of Birth</th>

<th>Joining Date</th>

</tr>

</thead>

<tbody>

<tr>

<td>U001</td>

<td>John Doe</td>

<td>1990-01-01</td>

<td>2023-01-15</td>

</tr>

<tr>
<td>U002</td>

<td>Jane Smith</td>

<td>1985-06-20</td>

<td>2022-07-10</td>

</tr>

</tbody>

</table>

</div>

</div>

</body>

</html>

UNDERWRITER PORTAL

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Underwriter - Vehicle Insurance Management</title>

<style>

body {

font-family: Arial, sans-serif;

background-color: #f4f4f4;

margin: 0;

padding: 0;

.container {
max-width: 800px;

margin: 20px auto;

padding: 20px;

background: #fff;

border-radius: 5px;

box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);

h1 {

text-align: center;

margin-bottom: 20px;

form {

display: flex;

flex-direction: column;

.form-group {

margin-bottom: 15px;

.form-group label {

display: block;

margin-bottom: 5px;

font-weight: bold;

.form-group input,

.form-group select {

width: 100%;
padding: 10px;

border: 1px solid #ccc;

border-radius: 5px;

box-sizing: border-box;

.form-group button {

width: 100%;

padding: 10px;

background: #4caf50;

color: white;

border: none;

border-radius: 5px;

cursor: pointer;

font-size: 16px;

.form-group button:hover {

background: #45a049;

</style>

</head>

<body>

<div class="container">

<h1>Vehicle Insurance Management</h1>

<form id="createInsuranceForm">

<h2>Create a New Vehicle Insurance</h2>

<div class="form-group">

<label for="vehicleNo">Vehicle No (Max 10 Characters)</label>


<input type="text" id="vehicleNo" maxlength="10" placeholder="Enter Vehicle No"
required>

</div>

<div class="form-group">

<label for="vehicleType">Vehicle Type</label>

<select id="vehicleType" required>

<option value="">Select Vehicle Type</option>

<option value="2-wheeler">2-wheeler</option>

<option value="4-wheeler">4-wheeler</option>

</select>

</div>

<div class="form-group">

<label for="customerName">Customer Name (Max 50 Characters)</label>

<input type="text" id="customerName" maxlength="50" placeholder="Enter Customer


Name" required>

</div>

<div class="form-group">

<label for="engineNo">Engine No</label>

<input type="number" id="engineNo" placeholder="Enter Engine No" required>

</div>

<div class="form-group">

<label for="chasisNo">Chasis No</label>

<input type="number" id="chasisNo" placeholder="Enter Chasis No" required>

</div>

<div class="form-group">

<label for="phoneNo">Phone No (10 Digits)</label>

<input type="tel" id="phoneNo" pattern="\d{10}" placeholder="Enter Phone No" required>


</div>

<div class="form-group">

<label for="premiumAmount">Premium Amount</label>

<input type="number" id="premiumAmount" placeholder="Enter Premium Amount"


required>

</div>

<div class="form-group">

<label for="insuranceType">Insurance Type</label>

<select id="insuranceType" required>

<option value="">Select Insurance Type</option>

<option value="Full Insurance">Full Insurance</option>

<option value="ThirdParty">ThirdParty</option>

</select>

</div>

<div class="form-group">

<label for="fromDate">From Date</label>

<input type="date" id="fromDate" required>

</div>

<div class="form-group">

<label for="toDate">To Date</label>

<input type="date" id="toDate" required>

</div>

<div class="form-group">

<button type="submit">Create Policy</button>

</div>

</form>
</div>

</body>

</html>

You might also like

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy