diff --git a/README.md b/README.md index e12dc52..10b176f 100644 --- a/README.md +++ b/README.md @@ -45,6 +45,7 @@ La configuration de variables d'environnement propres au Monitor est nécessaire | GPAO_API_URL | Non | localhost | Nom de la machine qui héberge l'API | | GPAO_API_PORT | Non | 8080 | Port de l'API vu par le monitor | | GPAO_API_PROTOCOL | Non | http | Protocole de l'API vu par le monitor | +| GPAO_ACTIVATE_MAP | Non | false | Boolean qui active ou non le volet cartographique de la GPAO sur le monitor | ## Pour les développeurs diff --git a/middlewares/job.js b/middlewares/job.js index 4df8f57..3259986 100644 --- a/middlewares/job.js +++ b/middlewares/job.js @@ -46,7 +46,8 @@ async function getJobs(req, res, next) { title: 'Action', orderable: false, data: null, - defaultContent: '', + defaultContent: '' + + ' ', }, ]); diff --git a/package.json b/package.json index 1a67173..5f6e10c 100644 --- a/package.json +++ b/package.json @@ -23,6 +23,8 @@ "ejs": "^3.0.1", "express": "^4.6.1", "express-validator": "^6.6.1", + "leaflet": "^1.9.4", + "leaflet-geoserver-request": "^1.3.0", "requests": "^0.3.0" }, "devDependencies": { diff --git a/routes/pages/index.js b/routes/pages/index.js index cc78278..490d1fd 100644 --- a/routes/pages/index.js +++ b/routes/pages/index.js @@ -17,6 +17,7 @@ router.get('/', topBar.getInfo, projects.getProjectStatus, (req, res) => { base: req.app.get('baseUrl'), api: req.app.get('apiUrl'), version: req.app.get('version'), + activateMap: req.app.get('activateMap'), }); }); @@ -32,6 +33,7 @@ router.get('/job/:id', topBar.getInfo, jobs.getJob, dependencies.getJobDependenc base: req.app.get('baseUrl'), api: req.app.get('apiUrl'), version: req.app.get('version'), + activateMap: req.app.get('activateMap'), }); }); @@ -49,6 +51,7 @@ router.get('/project/:id', topBar.getInfo, projects.getProject, projects.getJobs base: req.app.get('baseUrl'), api: req.app.get('apiUrl'), version: req.app.get('version'), + activateMap: req.app.get('activateMap'), }); }); @@ -64,6 +67,7 @@ router.get('/jobs', topBar.getInfo, jobs.getJobs, projects.getProjects, (req, re base: req.app.get('baseUrl'), api: req.app.get('apiUrl'), version: req.app.get('version'), + activateMap: req.app.get('activateMap'), }); }); @@ -77,6 +81,7 @@ router.get('/projects', topBar.getInfo, projects.getProjects, (req, res) => { base: req.app.get('baseUrl'), api: req.app.get('apiUrl'), version: req.app.get('version'), + activateMap: req.app.get('activateMap'), }); }); @@ -92,6 +97,7 @@ router.get('/sessions', topBar.getInfo, sessions.getSessions, hosts.getHosts, (r base: req.app.get('baseUrl'), api: req.app.get('apiUrl'), version: req.app.get('version'), + activateMap: req.app.get('activateMap'), }); }); @@ -105,6 +111,21 @@ router.get('/hosts', topBar.getInfo, hosts.getHosts, (req, res) => { base: req.app.get('baseUrl'), api: req.app.get('apiUrl'), version: req.app.get('version'), + activateMap: req.app.get('activateMap'), + }); +}); + +// map page +router.get('/map', topBar.getInfo, projects.getProjects, (req, res) => { + res.render('pages/map', { + topBar: req.topBar, + projects: req.projects, + jobFilter: req.query.jobFilter, + base: req.app.get('baseUrl'), + api: req.app.get('apiUrl'), + server: req.app.get('server'), + version: req.app.get('version'), + activateMap: req.app.get('activateMap'), }); }); diff --git a/serveur.js b/serveur.js index 0208bd9..815db79 100644 --- a/serveur.js +++ b/serveur.js @@ -19,6 +19,8 @@ const API_URL = process.env.GPAO_API_URL || 'localhost'; // accès api via backe const API_PROTOCOL = process.env.GPAO_API_PROTOCOL || 'http'; const API_PORT = process.env.GPAO_API_PORT || 8080; +const ACTIVATE_MAP = process.env.GPAO_ACTIVATE_MAP || false; + // Dans le cas d'un déploiement de la stack via docker les variables d'environnement: // BASE_URL, API, API_PORT, API_PROTOCOL // sont surchargées dans le docker-compose.yml. @@ -26,6 +28,7 @@ const API_PORT = process.env.GPAO_API_PORT || 8080; app.set('baseUrl', `${MONITOR_BASE_URL}`); app.set('apiUrl', `${API_PROTOCOL}://${API_URL}:${API_PORT}`); app.set('version', process.env.npm_package_version); +app.set('activateMap', `${ACTIVATE_MAP}`); // set the view engine to ejs app.set('view engine', 'ejs'); @@ -34,6 +37,8 @@ app.use('/vendor', express.static(`${__dirname}/resources/vendor`)); app.use('/css', express.static(`${__dirname}/resources/css`)); app.use('/js', express.static(`${__dirname}/resources/js`)); app.use('/chart.js', express.static(`${__dirname}/node_modules/chart.js`)); +app.use('/leaflet', express.static(`${__dirname}/node_modules/leaflet`)); +app.use('/leaflet-geoserver-request', express.static(`${__dirname}/node_modules/leaflet-geoserver-request`)); app.use('/images', express.static(`${__dirname}/resources/images`)); // use res.render to load up an ejs view file diff --git a/start.sh b/start.sh index aedf3a3..5cf7e1a 100755 --- a/start.sh +++ b/start.sh @@ -1,5 +1,6 @@ -export GPAO_API_URL=localhost -export GPAO_API_PORT=8080 +export URL_API=localhost +export API_PORT=8080 +export GPAO_ACTIVATE_MAP=true if [ "$(docker ps -aq -f name=monitor-gpao)" ]; then echo "Suppression du container monitor-gpao" diff --git a/views/pages/map.ejs b/views/pages/map.ejs new file mode 100644 index 0000000..be50814 --- /dev/null +++ b/views/pages/map.ejs @@ -0,0 +1,183 @@ + + + + + + GPAO - Map + + <%- include ("../partials/head") %> + + + + + + +
+ + <%- include ("../partials/menu/sidebar") %> + + +
+ + +
+ + +
+ + +
+

Géovisualisation des jobs

+
+ + <%- include ("../partials/menu/topbar") %> + + +
+
+ +
+ +
+ +
+ +
+ +
+ + + <%- include ("../partials/footer") %> + +
+ + +
+ + + + + + + + + + + + <%- include ("../popups/popup_job_status_info") %> + + + + + \ No newline at end of file diff --git a/views/partials/components/job_info.ejs b/views/partials/components/job_info.ejs index 3788643..5a9ba97 100644 --- a/views/partials/components/job_info.ejs +++ b/views/partials/components/job_info.ejs @@ -31,6 +31,14 @@
+
  • +
    +
    Géometrie :
    + + + +
    +
  • Date de début : <%= job.date_debut %> à <%= job.hms_debut %> (UTC)
  • Date de fin : <%= job.date_fin %> à <%= job.hms_fin %> (UTC)
  • Durée : <%= job.duree %> secondes
    • @@ -64,4 +72,14 @@ $('#tags').on('input', function(event) { validateTags('tags','btn-send') }); +// acces à la géometrie +if (<%= activateMap %> == false){ + document.getElementById("geom").style.visibility = "collapse"; +} +if ('<%= job.job_geometry %>' == ''){ + document.getElementById("geom_text").innerHTML += "Non"; + document.getElementById("geom_map").style.visibility = "hidden"; +} else { + document.getElementById("geom_text").innerHTML += "Oui"; +} \ No newline at end of file diff --git a/views/partials/head.ejs b/views/partials/head.ejs index 8e02539..dc306ce 100644 --- a/views/partials/head.ejs +++ b/views/partials/head.ejs @@ -18,6 +18,13 @@ + + + + + + + diff --git a/views/partials/menu/sidebar.ejs b/views/partials/menu/sidebar.ejs index 8a5e71f..d7ff752 100644 --- a/views/partials/menu/sidebar.ejs +++ b/views/partials/menu/sidebar.ejs @@ -20,6 +20,13 @@ Dashboard + + +
    @@ -119,4 +126,12 @@ $('#collapseUrl').collapse('hide'); } ); + + let mapItem = document.getElementById("mapItem"); + if(<%= activateMap %>){ + mapItem.style.display = "block"; + } else { + mapItem.style.display = "none"; + } + \ No newline at end of file diff --git a/views/partials/tab/jobs_tab.ejs b/views/partials/tab/jobs_tab.ejs index 78a58db..76c59aa 100644 --- a/views/partials/tab/jobs_tab.ejs +++ b/views/partials/tab/jobs_tab.ejs @@ -53,8 +53,10 @@ $(document).ready(function() { "columns": columns, "autoWidth": false, "createdRow": function( row, data, dataIndex, cells ) { - if (data.job_status !== 'failed') + if (<%= activateMap %> == false || data.job_geometry == null) $('button', cells[9])[0].style.visibility = "hidden"; + if (data.job_status !== 'failed') + $('button', cells[9])[1].style.visibility = "hidden"; }, "rowCallback": function( row, data, index ) { var job_id = $('td:eq(0)', row); @@ -98,6 +100,14 @@ $(document).ready(function() { reinitJobs({"ids":[row.data().job_id]}); } ); + $('#dataTable tbody').on('click', 'button.map_job', function () { + var tr = $(this).closest('tr'); + var row = table.row( tr ); + var job_id = row.data().job_id; + console.log(job_id) + location.href='<%= base %>/map?jobFilter='+job_id + } ); + var i = jQuery(''); i.addClass('fas fa-sync-alt fa-1x')