hubl/src/html/project.html

61 lines
2.4 KiB
HTML

<div id="project" style="display: none">
<div class="page-header">
<h1>Project</h1>
</div>
<ldp-display
id="projectTitle"
set-label="number, label-separator, name"
value-label-separator="&nbsp;-&nbsp;"
data-fields="label"
bind-resource
></ldp-display>
<div id="projectDiv" style="display: none;">
<div class="container-fluid" id="projectContainer">
<div class="row">
<div class="col-md-9" id="projectLeftCol">
<div class="chat-box">
<img src=".\img\chat_image.PNG" alt="Chat box">
</div>
</div>
<div class="col-md-3" id="projectRightCol">
<ldp-display id="projectDetail" data-fields="right-panel" set-right-panel="quotation-div, income-div, nextBill" set-quotation-div="quotation, euro" set-income-div="income, euro" value-euro="&#160€"></ldp-display>
<button id="projectDivBackButton" type="button" class="btn btn-primary">Back</button>
</div>
<!-- <button id="projectDivBackButton" type="button" class="btn btn-primary"><i class="material-icons">reply</i></button> -->
</div>
</div>
</div>
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function (event) {
var projectsListElt = document.querySelector('#projectsList');
var projectsTableElt = document.querySelector('#projectsTable');
var projectDivElt = document.querySelector('#projectDiv');
var projectDetailElt = document.querySelector('#projectDetail');
var projectTitleElt = document.querySelector('#projectTitle');
var projectsListTitleElt = document.querySelector('#projectsListTitle');
projectsListElt.addEventListener('select', function (event) {
projectsTableElt.style.display = 'none';
projectsListTitleElt.style.display = 'none';
projectDivElt.style.display = 'block';
projectTitleElt.style.display ='block';
projectDetailElt.setAttribute("data-src", event.detail.resource['@id']);
projectTitleElt.setAttribute("data-src", event.detail.resource['@id']);
});
projectDivElt.addEventListener('click', function (event) {
if (event.target.id == "projectDivBackButton") {
projectDivElt.style.display = 'none';
projectTitleElt.style.display = 'none';
projectsTableElt.style.display = 'block';
projectsListTitleElt.style.display = 'block';
}
});
});
</script>
</div>