added note to save edits using enter key

This commit is contained in:
sairaj mote 2020-08-25 18:40:13 +05:30
parent 8697cdafbc
commit 0f2d5f8bc2

View File

@ -3,6 +3,7 @@
<head> <head>
<title>FLO LogSheet</title> <title>FLO LogSheet</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style> <style>
:root { :root {
--accent-light: #20a878; --accent-light: #20a878;
@ -25,7 +26,7 @@
/* width */ /* width */
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 0.1rem; width: 0.4rem;
height: 0.2rem; height: 0.2rem;
} }
@ -36,12 +37,12 @@
/* Handle */ /* Handle */
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
background: rgba(var(--rgb-bw), 0.2); background: rgba(var(--rgb-bw), 0.4);
} }
/* Handle on hover */ /* Handle on hover */
::-webkit-scrollbar-thumb:hover { ::-webkit-scrollbar-thumb:hover {
background: rgba(var(--rgb-bw), 0.3); background: rgba(var(--rgb-bw), 0.6);
} }
body { body {
@ -65,6 +66,10 @@
z-index: 4; z-index: 4;
} }
.margin{
margin: 0.5rem;
}
#loading-screen .appName { #loading-screen .appName {
top: 8rem; top: 8rem;
position: fixed; position: fixed;
@ -356,25 +361,23 @@
position: relative; position: relative;
border-radius: 0.4rem; border-radius: 0.4rem;
} }
#main_container{
display: grid;
grid-template-columns: 16rem 1fr;
gap: 1.5rem;
padding: 1.5rem
}
#leftPanel { #leftPanel {
height: 34rem; height: 34rem;
width: 16rem;
float: left;
margin: 0 0 0 2rem;
} }
#leftPanel>div { #leftPanel>div {
height: 30rem; height: 30rem;
width: 100%;
margin: 2rem 0;
} }
#rightPanel { #rightPanel {
height: 34rem; height: 34rem;
width: 56rem;
float: right;
margin: 1.5rem 2rem 0rem 2rem;
} }
#rightPanel>nav { #rightPanel>nav {
@ -419,15 +422,20 @@
font-size: 1.1rem; font-size: 1.1rem;
} }
.horizontal-list{
display: flex;
overflow-x: auto;
max-width: 100%;
}
.horizontal-list div { .horizontal-list div {
display: inline-block; display: inline-block;
color: var(--alt-light); color: var(--alt-light);
} }
#sheet-list { #sheet-list {
width: 52rem; display: flex;
overflow-x: scroll; max-width: 100%;
white-space: nowrap; overflow-x: auto;
margin-right: 1rem; margin-right: 1rem;
} }
@ -521,7 +529,7 @@
.table-container { .table-container {
margin: 0 1rem 1rem 1rem; margin: 0 1rem 1rem 1rem;
overflow: scroll; overflow: scroll;
max-height: 19rem; max-height: 18rem;
} }
table { table {
@ -530,6 +538,7 @@
table td { table td {
padding: 0.25rem; padding: 0.25rem;
overflow-wrap: break-word;
} }
thead { thead {
@ -932,7 +941,7 @@
<button> &#x2716;</span> <button> &#x2716;</span>
</div> </div>
<section> <section id="main_container">
<div id="leftPanel"> <div id="leftPanel">
<div class="container vertical-list"> <div class="container vertical-list">
@ -957,6 +966,7 @@
<h6></h6> <h6></h6>
<p></p> <p></p>
<button id="view-group-by">Groupby</button> <button id="view-group-by">Groupby</button>
<h5 class="margin">*Press ENTER to save your edit.</h5>
</div> </div>
<form class="table-container" id="sheet-view" onsubmit="enterLog(); return false;"></form> <form class="table-container" id="sheet-view" onsubmit="enterLog(); return false;"></form>
<button type="submit" form="sheet-view" style="display: none;"></button> <button type="submit" form="sheet-view" style="display: none;"></button>
@ -1198,19 +1208,24 @@
function enterLog() { function enterLog() {
let title = document.getElementById("sheet-details").children[0].textContent; let title = document.getElementById("sheet-details").children[0].textContent;
let form = document.forms['sheet-view'] let form = document.forms['sheet-view']
form.elements.forEach(element => element.disabled = true)
if (form[0].tagName === 'INPUT') { if (form[0].tagName === 'INPUT') {
let floID = form[0].value; let floID = form[0].value;
let log = [] let log = []
for (let i = 1; i < form.length - 1; i++) for (let i = 1; i < form.length - 1; i++)
log.push(form[i].value) log.push(form[i].value)
logSheet.enterLog(title, floID, log).then(result => { logSheet.enterLog(title, floID, log).then(result => {
form.elements.forEach(element => element.disabled = false)
form.reset(); form.reset();
showMessage('Log Entry Successful') showMessage('Log Entry Successful')
let row = document.getElementById("sheet-view").getElementsByTagName("tbody")[0].insertRow(1); let row = document.getElementById("sheet-view").getElementsByTagName("tbody")[0].insertRow(1);
row.insertCell(0).textContent = floID row.insertCell(0).textContent = floID
for (let k = 0; k < log.length; k++) for (let k = 0; k < log.length; k++)
row.insertCell(k + 1).textContent = log[k] row.insertCell(k + 1).textContent = log[k]
}).catch(error => showMessage(error, "error")) }).catch(error => {
showMessage(error, "error")
form.elements.forEach(element => element.disabled = false)
})
} }
} }