portal-oddajanje-solar/templates/solar-pogodbe.html
2022-01-05 19:33:43 +01:00

419 lines
19 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Portal za oddajanje besedil</title>
<link rel="stylesheet" href="../static/css/header.css" type="text/css">
<link rel="stylesheet" href="../static/css/form.css" type="text/css">
<link rel="stylesheet" href="../static/css/simple-grid.css" type="text/css">
<link rel="stylesheet" href="../static/css/contracts.css" type="text/css">
</head>
<body>
<header>
<div class="logo"><a href="../"><img src="../static/image/logo-white.svg"/></a></div>
<div class="menu-items">
<a href="../logout">Odjava</a>
{% if is_institution_coordinator %}
<a href="../manage-institution">Upravljaj z institucijo</a>
{% endif %}
{% if is_admin %}
<a href="../admin">Administracijski meni</a>
{% endif %}
<a href="https://slovenscina.eu/" target="_blank">Več informacij</a>
</div>
</header>
<div class="container" style="margin-top:8rem;">
<div class="row">
<div class="col-12">
<h1 class="title">Korpus Šolar</h1>
<p class="subtitle"></p>
<div class="tab-nav">
<a href="../oddaja">Oddaja besedil</a>
<a href="../zgodovina">Zgodovina sodelovanja</a>
<a href="../pogodbe" class="active">Ekipa</a>
</div>
</div>
</div>
<!--
<div class="row">
<div class="col-12">
<h2>Oddaj pogodbo</h2>
</div>
</div>
{% if show_upload_form %}
<form action="" method="POST" id="form-pogodbe" enctype="multipart/form-data">
<div class="row">
<div class="col-6">
<div class="form-wrapper">
<input type="radio" id="sola" name="tip-pogodbe" value="sola" {% if enable_upload_school_contract %}{%else%}disabled{%endif%}>
<label for="sola">Pogodba s šolo</label>
</div>
</div>
</div>
<div class="row">
<div class="col-6">
<div class="form-wrapper">
<input type="radio" id="ucenci-starsi" name="tip-pogodbe" value="ucenci-starsi">
<label for="ucenci-starsi">Pogodba z učenci / starši</label>
</div>
</div>
</div>
<div class="row">
<div class="col-6">
<div class="form-wrapper">
<div id="dropzone-previews" class="dropzone-previews"></div>
</div>
</div>
</div>
<div class="row">
<div class="col-6">
<div class="form-wrapper">
<label for="my-dropzone">Datoteka</label>
<div id="my-dropzone" class="dropzone"></div>
</div>
</div>
<div class="col-6">
<p>lalala</p>
</div>
</div>
<div class="row">
<div class="col-6">
<button class="btn" id="btn-submit" type="submit">Oddaj pogodbo</button>
</div>
</div>
</form>
{% endif %}
-->
<!--
<div class="row">
<div class="col-12">
<h2>Oddane pogodbe</h2>
</div>
</div>
{% if contract_school %}
<div class="row">
<div class="col-6">
<div class="contract-item">
<img src="../static/image/contract.png" alt="contract" class="contract-item-icon"/>
<div class="contract-item-title">Pogodba s šolo</div>
<div class="contract-item-date">DODANO: {{contract_school.timestamp.strftime('%d. %m. %Y')}}</div>
<a href="../pogodbe-institucije/{{ contract_school.file_contract }}.pdf" class="contract-item-download">Prenesi</a>
</div>
</div>
</div>
{% endif %}
{% for item in contracts_students %}
<div class="row">
<div class="col-6">
<div class="contract-item">
<img src="../static/image/contract.svg" alt="contract" class="contract-item-icon"/>
<div class="contract-item-title">Pogodba o prenosu lastništva</div>
<div class="contract-item-date">DODANO: {{item.timestamp.strftime('%d. %m. %Y')}}</div>
<a href="../pogodbe-ucencistarsi/{{ item.file_contract }}.pdf" class="contract-item-download">Prenesi</a>
</div>
</div>
</div>
{% endfor %}
-->
<!--<div class="row">
<div class="col-12">
<h2>Sodelujoči</h2>
</div>
</div>-->
<div class="row">
<div class="col-6">
{% for collaborator in collaborators %}
<div class="team-item">
<div class="team-item-name">{{collaborator.name}}</div>
<div class="team-item-collaborations">
{% if collaborator.id in cooperation_history %}
{% if cooperation_history[collaborator.id]["coordinator"]|length > 0 %}
<div class="team-item-years">Vodenje: {% for item in cooperation_history[collaborator.id]["coordinator"] %}
{% if loop.index != 1 %}, {% endif %}
{{item[0]}}
{% endfor %}</div>
{% endif %}
{% if cooperation_history[collaborator.id]["mentor"]|length > 0 %}
<div class="team-item-years">Mentorstvo: {% for item in cooperation_history[collaborator.id]["mentor"] %}
{% if loop.index != 1 %}, {% endif %}
{{item[0]}}
{% endfor %}</div>
{% endif %}
{% if cooperation_history[collaborator.id]["other"]|length > 0 %}
<div class="team-item-years">Drugo: {% for item in cooperation_history[collaborator.id]["other"] %}
{% if loop.index != 1 %}, {% endif %}
{{item[0]}}
{% endfor %}</div>
{% endif %}
{% endif %}
</div>
</div>
{% endfor %}
</div>
</div>
<div class="row">
<div class="col-12">
<h2>Število oddaj na uporabnika</h2>
</div>
</div>
<div class="row">
<div class="col-6">
<div id="my_dataviz">
</div>
</div>
</div>
</div>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<!--
<a href="../logout">Odjavi se</a>
{% if is_institution_coordinator %}
<br><a href="../manage-institution">Upravljaj z institucijo</a>
{% endif %}
{% if is_admin %}
<br><a href="../admin">Administracijski meni</a>
{% endif %}
<br><a href="https://slovenscina.eu/" target="_blank">Več informacij</a>
<div class="bg"></div>
<div id="main-window">
<div id="rect1">
{% with messages = get_flashed_messages() %}
{% if messages %}
<div class="message-notification">
{{ messages[0] }}
</div>
<div id="contract-container" style="height: 250px;">
{% else %}
<div id="contract-container">
{% endif %}
{% endwith %}
{% if contract_school %}
<div class="contract-item">
<img src="../static/image/contract.png" alt="contract" class="contract-item-icon"/>
<div class="contract-item-title">Pogodba s šolo</div>
<div class="contract-item-data">{{contract_school.original_filename}}</div>
<div class="contract-item-data">DODANO: {{contract_school.timestamp}}</div>
<a href="../pogodbe-institucije/{{ contract_school.file_contract }}.pdf" class="contract-item-button">Prenesi</a>
</div>
</br>
{% endif %}
{% for item in contracts_students %}
<div class="contract-item">
<img src="../static/image/contract.png" alt="contract" class="contract-item-icon"/>
<div class="contract-item-title" style="font-size: 12px;">{{item.original_filename}}</div>
<div class="contract-item-data">Pogodba o prenosu lastništva</div>
<div class="contract-item-data">DODANO: {{item.timestamp}}</div>
<a href="../pogodbe-ucencistarsi/{{ item.file_contract }}.pdf" class="contract-item-button">Prenesi</a>
</div>
</br>
{% endfor %}
</div>
</br>
</br>
{% if show_upload_form %}
<div style="padding: 20px; position: absolute; top: 500px; width: 89%;">
<div class="section-desc">Oddaj pogodbo</div>
<form action="../pogodbe" method="post" enctype="multipart/form-data">
{% if enable_upload_school_contract %}
<div style="display:flex; flex-direction: row; justify-content: left; align-items: center">
<label style="width: 80%; text-align: right;" for="sola">Pogodba s šolo</label>
<input style="width: 20%;" type="radio" id="sola" name="tip-pogodbe" value="sola">
</div>
{% else %}
<div style="display:flex; flex-direction: row; justify-content: left; align-items: center">
<label style="width: 80%; text-align: right;" for="sola">Pogodba s šolo</label>
<input style="width: 20%;"type="radio" id="sola" name="tip-pogodbe" value="sola" disabled>
</div>
{% endif %}
<div style="display:flex; flex-direction: row; justify-content: left; align-items: center">
<label style="width: 80%; text-align: right;" for="ucenci-starsi">Pogodba z učenci / starši</label>
<input style="width: 20%;" type="radio" id="ucenci-starsi" name="tip-pogodbe" value="ucenci-starsi" checked>
</div>
<input style="font-size: 10px;" type="file" id="file-contract" name="file[]" multiple="">
<button style="float: right;" type="submit">Oddaj pogodbo</button>
</form>
</div>
{% endif %}
</div>
<div id="rect2" class="mock-side">
<div id="collaborators-container">
<div class="container-title">Sodelujoči</div>
<div style="overflow-y: auto;">
{% for collaborator in collaborators %}
<div class="collaborators-item">
<div class="collaborators-item-name">{{collaborator.name}}</div>
{% if collaborator.id in cooperation_history %}
{% if cooperation_history[collaborator.id]["coordinator"]|length > 0 %}
<div class="collaborators-item-years"><b>Vodenje:</b> {% for item in cooperation_history[collaborator.id]["coordinator"] %}
{% if loop.index != 1 %}, {% endif %}
{{item[0]}}
{% endfor %}</div>
{% endif %}
{% if cooperation_history[collaborator.id]["mentor"]|length > 0 %}
<div class="collaborators-item-years"><b>Mentorstvo:</b> {% for item in cooperation_history[collaborator.id]["mentor"] %}
{% if loop.index != 1 %}, {% endif %}
{{item[0]}}
{% endfor %}</div>
{% endif %}
{% if cooperation_history[collaborator.id]["other"]|length > 0 %}
<div class="collaborators-item-years"><b>Drugo:</b> {% for item in cooperation_history[collaborator.id]["other"] %}
{% if loop.index != 1 %}, {% endif %}
{{item[0]}}
{% endfor %}</div>
{% endif %}
{% endif %}
</div>
{% endfor %}
</div>
</div>
<div id="awards-container">
<div class="container-title">Sodelovanje v letih</div>
<div style="overflow-y: auto; margin: auto; width: 100%; height: 200px;">
{% if cooperation_history.keys()|length > 0 %}
{% if user_id in cooperation_history %}
{% for item in cooperation_history[user_id]['coordinator'] %}
<div style="border-bottom: 2px solid #c4c4c4; min-height: 50px; margin-bottom: 10px;">
<img src="../static/image/star.png" alt="star" style="float: left; width: 40px;"/>
<div class="collaborators-item-name"
style="float: right; width: 250px; text-align: left; margin-left: 20px;text-overflow: ellipsis; overflow: hidden; white-space: nowrap;">
{{item[1]}}
</div>
<div class="collaborators-item-name"
style="float: right; width: 250px; text-align: left; margin-left: 20px;">
{{item[0]}}
</div>
</div>
{% endfor %}
{% for item in cooperation_history[user_id]['mentor'] %}
<div style="border-bottom: 2px solid #c4c4c4; min-height: 50px; margin-bottom: 10px;">
<img src="../static/image/star.png" alt="star" style="float: left; width: 40px;"/>
<div class="collaborators-item-name"
style="float: right; width: 250px; text-align: left; margin-left: 20px;text-overflow: ellipsis; overflow: hidden; white-space: nowrap;">
{{item[1]}}
</div>
<div class="collaborators-item-name"
style="float: right; width: 250px; text-align: left; margin-left: 20px;">
{{item[0]}}
</div>
</div>
{% endfor %}
{% for item in cooperation_history[user_id]['other'] %}
<div style="border-bottom: 2px solid #c4c4c4; min-height: 50px; margin-bottom: 10px;">
<img src="../static/image/star.png" alt="star" style="float: left; width: 40px;"/>
<div class="collaborators-item-name"
style="float: right; width: 250px; text-align: left; margin-left: 20px;text-overflow: ellipsis; overflow: hidden; white-space: nowrap;">
{{item[1]}}
</div>
<div class="collaborators-item-name"
style="float: right; width: 250px; text-align: left; margin-left: 20px;">
{{item[0]}}
</div>
</div>
{% endfor %}
{% endif %}
{% endif %}
</div>
</div>
</div>
</div>-->
</body>
<script src="https://d3js.org/d3.v6.js"></script>
<style>
#my_dataviz .tick line{
visibility:hidden;
}
#my_dataviz path.domain{
visibility:hidden;
}
</style>
<script>
// set the dimensions and margins of the graph
// append the svg object to the body of the page
var data;
// Parse the Data
d3.json("/topuploads-by-user/").then(function(jsondata) {
if(Object.keys(jsondata).length < 1) {
return;
}
data = [];
console.log(Object.keys(jsondata).length);
var margin = {top: 20, right: 0, bottom: 40, left: 0};
var width = document.getElementById("my_dataviz").clientWidth - margin.left - margin.right;
var height = Object.keys(jsondata).length * 56;
var svg = d3.select("#my_dataviz")
.append("svg")
.attr("width", width + margin.left + margin.right)
.attr("height", height + margin.top + margin.bottom)
.style("overflow","visible")
.append("g")
.attr("transform",
"translate(" + margin.left + "," + margin.top + ")");
for(var key in jsondata) {
data.push({'name': key, 'value':jsondata[key]});
}
console.log(data);
// Add X axis
var x = d3.scaleLinear()
.domain([0,d3.max(data, function (d) { return d.value})])
.range([ 0, width]);
svg.append("g")
.attr("transform", "translate(0," + height + ")")
.call(d3.axisBottom(x))
.selectAll("text")
.style("text-anchor", "center");
// Y axis
var y = d3.scaleBand()
.range([ 0, data.length*56 ])
.domain(data.map(function(d) { return d.name; }))
.padding(0);
svg.append("g")
.call(d3.axisLeft(y))
.selectAll("text")
.style("text-anchor", "start")
.style("font-size", "14px")
.attr("transform", "translate(8,-36)");
//Bars
svg.selectAll("myRect")
.data(data)
.enter()
.append("rect")
.attr("x", x(0) )
.attr("y", function(d) { return y(d.name); })
.attr("width", function(d) { return x(d.value); })
.attr("height", 32 )
.attr("fill", "#006CB7");
})
</script>
</html>