Skip to content

Commit

Permalink
initial commit -- basic form
Browse files Browse the repository at this point in the history
  • Loading branch information
@katrina-cityofdetroit
katrina-cityofdetroit committed Jun 6, 2024
1 parent f1f7c48 commit 670ab91
Show file tree
Hide file tree
Showing 9 changed files with 839 additions and 0 deletions.
206 changes: 206 additions & 0 deletions index.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,206 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Demo Budget Request</title>

<!-- Bootstrap -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" crossorigin="anonymous">
<!-- CSS -->
<link rel="stylesheet" href="static/style.css">

<!-- Bootstrap JS and its dependencies (jQuery & Popper.js) -->
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.9.4/dist/umd/popper.min.js" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" crossorigin="anonymous"></script>

<!-- XLSX JS library -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"></script>

<!-- My scripts -->
<script src="static/js/main.js", type="module"></script>

</head>
<body>

<h1>FY2026 Budget Request Form</h1>

<div id="welcome-page">

<br>
<button class="btn" id="load-saved-data-btn">Start from saved data</button>
<button class="btn" id="start-over-btn">Start over</button>
</div>



<div id="position-page">
<div class="container-fluid">

<div class="row">

<!-- Main content -->
<div class="col-md-10">

<h3>Select an action item for each current position in your department.</h3>

<!-- Table content inside nested row -->
<div class="row">
<div class="col-md-12">
<div class="table-container">
<table class="table table-bordered mt-3" id="employee-table">
<thead class="thead-dark">
<tr class="no-choice-yet">
<th class="col-employee">Employee Name</th>
<th class="col-job">Job Name</th>
<th class="col-salary">FY25 Salary</th>
<th class="fte">FTEs</th>
<th class="col-fund">Fund</th>
<th class="col-appropriation">Appropriation</th>
<th class="col-cost-center">Cost Center</th>
<th class="col-actions">Action</th>
</tr>
</thead>
<tbody>
<!-- Example row with sample data -->
<!-- Repeat similar rows for more data -->
<tr class="no-choice-yet">
<td>Jane Doe</td>
<td>Assistant Director</td>
<td class="salary" data-salary="100000">$100,000</td>
<td>1.0</td>
<td>1000</td>
<td>12345</td>
<td>654321</td>
<td>
<div class="action-btns">
<button class="btn btn-delete">DELETE</button>
<button class="btn btn-supplemental">MAKE SUPPLEMENTAL</button>
<button class="btn btn-carryover">KEEP IN FY26</button>
</div>
</td>
</tr>

<tr class="no-choice-yet">
<td>John Doe</td>
<td>TASS III</td>
<td class="salary" data-salary="80000">$80,000</td>
<td>1.0</td>
<td>1000</td>
<td>12345</td>
<td>654321</td>
<td>
<div class="action-btns"></div>
<button class="btn btn-delete">DELETE</button>
<button class="btn btn-supplemental">MAKE SUPPLEMENTAL</button>
<button class="btn btn-carryover">KEEP IN FY26</button>
</div>
</td>
</tr>

<tr class="no-choice-yet">
<td>Jane Doe</td>
<td>Analyst</td>
<td class="salary" data-salary="60000">$60,000</td>
<td>1.0</td>
<td>1000</td>
<td>12345</td>
<td>654321</td>
<td>
<div class="action-btns"></div>
<button class="btn btn-delete">DELETE</button>
<button class="btn btn-supplemental">MAKE SUPPLEMENTAL</button>
<button class="btn btn-carryover">KEEP IN FY26</button>
</div>
</td>
</tr>


<tr class="no-choice-yet">
<td>Vacant</td>
<td>Administrative Assistant</td>
<td class="salary" data-salary="50000">$50,000</td>
<td>1.0</td>
<td>1000</td>
<td>12345</td>
<td>654321</td>
<td>
<div class="action-btns"></div>
<button class="btn btn-delete">DELETE</button>
<button class="btn btn-supplemental">MAKE SUPPLEMENTAL</button>
<button class="btn btn-carryover">KEEP IN FY26</button>
</div>
</td>
</tr>

<tr class="no-choice-yet">
<td>Vacant</td>
<td>Analyst II</td>
<td class="salary" data-salary="80000">$80,000</td>
<td>1.0</td>
<td>1000</td>
<td>12345</td>
<td>654321</td>
<td>
<div class="action-btns"></div>
<button class="btn btn-delete">DELETE</button>
<button class="btn btn-supplemental">MAKE SUPPLEMENTAL</button>
<button class="btn btn-carryover">KEEP IN FY26</button>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>

<!-- Buttons inside nested row -->
<div class="row">
<div class="col-md-12">
<div class="new-row">
<button class="btn btn-add">+ ADD NEW POSITION</button>
</div>
<div class="next-button-row">
<button class="btn btn-save" id="save">
<strong>Save progress</strong>
</button>
<button class="btn btn-download" id="XLSX-download">
<strong>Download Excel</strong>
</button>
<button class="btn btn-next">
<strong>>> Continue to salary adjustments</strong>
</button>
</div>
</div>
</div>

</div>

<!-- Sidebar Content -->
<div class="col-md-2" id="sidebar">
<div class="sidebar-content">
<br>
<h4>
Projected FY26 Budget
</h4>

<br>
FY25 baseline: <strong><span id="baseline">$250,000</span></strong>
<br>
FY26 target: <strong><span id="target">$240,000</span></strong>
<br>
Current spend: <strong><span id="current">$ - </span></strong>
<br>
Supplemental: <strong><span id="supps">$ - </span></strong>

</div>
</div>
</div>
</div>

</div>

</body>
</html>
Empty file added static/js/excel-export.js
View file
Empty file.
Loading

0 comments on commit 670ab91

Please sign in to comment.