Système d'association Type dactivité/Contrat PCRU (912fc4e2) · Commits · open-source / oscar

front/gulpfile.js

+1 −0

Original line number	Diff line number	Diff line
		@@ -83,6 +83,7 @@ function contratTypePCRU(cb) {
		exports.contratTypePCRU = contratTypePCRU;
		exports.contratTypePCRUWatch = function(cb){
		watch(pathModuleSrc + "ContratTypePCRU.vue", contratTypePCRU);
		watch(pathModuleSrc + "ActivityTypeTree.vue", contratTypePCRU);
		}

		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

front/src/ActivityTypeTree.vue

+24 −6

Original line number	Diff line number	Diff line
		<template>
		<div>
		<strong @click="handlerSelect">{{ tree.label}}</strong>
		<div v-if="tree.children">
		<div class="tree">

		<span @click="open = !open" v-if="tree.children.length > 0" class="open-handler">
		<i class="icon-right-dir" v-if="!open"></i>
		<i class="icon-down-dir" v-else></i>
		</span>

		<strong @click="handlerSelect" class="select-handler">{{ tree.label == 'ROOT' ? './' : tree.label }}</strong>
		<div v-if="tree.children.length > 0" class="children" v-show="open">
		<tree v-for="c in tree.children" :tree="c" :key="c.id" @select="$emit('select', $event)"></tree>
		{{ tree.children }}
		</div>
		</div>
		</template>


		<script>
		export default {
		props: {
		tree: { required: true }
		},
		components: {
		'tree': this

		data(){
		return {
		open: false
		}
		},

		methods: {

		handlerSelect() {
		@@ -22,8 +33,15 @@ export default {
		}
		},

		beforeCreate: function () {
		this.$options.components.tree = require('./ActivityTypeTree.vue').default
		},

		mounted(){
		console.log("mounted tree");
		if( this.tree.label == "ROOT" ){
		this.open = true;
		}
		}

		}

front/src/ContratTypePCRU.vue

+78 −21

Original line number	Diff line number	Diff line
		@@ -2,30 +2,38 @@
		<div id="contrattypepcru">
		<h1>Correspondance Type d'activité / Type de contrat PCRU</h1>

		<div class="overlay">
		<ajax-oscar :oscar-remote-data="remoteState"/>

		<div class="overlay" v-if="selectedPcru">
		<div class="overlay-content" v-if="oscartypes.length">
		TYPES OSCAR
		<tree :tree="oscartypes[0]"></tree>
		<a class="overlay-closer" @click="handlerClose">Fermer</a>
		<h3>Correspondance</h3>
		<p>Choississez un type d'activité correspondant dans Oscar pour les contrats PCRI
		<strong></strong> : </p>
		<tree :tree="oscartypes[0]" @select="handlerSelect"></tree>
		<button class="button button-danger" @click="handlerClose">
		Fermer
		</button>
		</div>
		</div>

		<div class="row">
		<div class="col-md-6">
		<h2>Types côté <strong>PCRU</strong></h2>
		<article class="card xs" v-for="t in pcrutypes" :key="t.id" :class="t.activitytype_id != null ? 'active' : 'disabled'">
		<article class="card xs" v-for="t in pcrutypes" :key="t.id"
		:class="t.activitytype_id != null ? 'active' : 'disabled'">
		<h3><code>[{{ t.id }}]</code>
		<strong>{{ t.label }}</strong>
		</h3>
		<div v-if="t.activitytype_id">
		Associé au activité <strong>{{ t.activitytype_label }}</strong>
		Associé au activité de type <strong>{{ t.activitytype_label }}</strong>
		</div>
		<button class="btn xs">
		<button class="btn xs" @click="handlerAssociate(t)">
		Associer à un type dans Oscar
		</button>
		</article>
		</div>
		</div>
		HOP {{ url }}
		</div>
		</template>
		<script>
		@@ -47,15 +55,10 @@ import AjaxOscar from "./remote/AjaxOscar";
		import OscarRemoteData from "./remote/OscarRemoteData";
		import Tree from "./ActivityTypeTree";


		// test
		let oscarRemoteData = new OscarRemoteData();

		function flashMessage(){
		// TODO
		}



		export default {

		components: {
		@@ -73,25 +76,79 @@ export default {
		remoterState: oscarRemoteData.state,
		configuration: null,
		oscartypes: [],
		pcrutypes: []
		pcrutypes: [],
		remoteState: oscarRemoteData.state,
		selectedPcru: null
		}
		},

		methods: {

		handlerSuccess(success){
		let datas = success.data;
		this.oscartypes = datas.activitytypes;
		this.pcrutypes = datas.pcrucontracttypes;
		/**
		* Quand l'utilisateur à selectionner un type d'activité Oscar depuis le liste proposée.
		* @param evt
		*/
		handlerSelect(evt) {
		console.log("Selection sur ", evt, 'pour', this.selectedPcru);
		let pcru = this.selectedPcru;
		let oscar = evt;
		let message = "Association des contrats '" + pcru.label + "' aux activités de recherche '" + oscar.label + "'";
		oscarRemoteData
		.setDebug(true)
		.setPendingMessage(message)
		.setErrorMessage("L'association a échouée.")
		.performPost(this.url, {
		pcru_id: pcru.id,
		oscar_id: oscar.id
		}, this.handlerAssociateSuccess);

		this.selectedPcru = null;
		},

		handlerClose(){
		console.log("CLOSE");
		this.selectedPcru = null;
		},

		handlerAssociateError(){
		console.log("handlerAssociateError", arguments);
		},

		handlerAssociateSuccess(){
		console.log("handlerAssociateSuccess", arguments);
		this.fetch();
		},

		/**
		* L'utilisateur a selection un type de contrat PCRU pour configurer l'association.
		* @param typePcru
		*/
		handlerAssociate(typePcru) {
		this.selectedPcru = typePcru;
		},

		////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		// TRAITEMENT des DONNEES

		/**
		* Chargement des données
		*/
		fetch() {
		console.log("FETCH()");
		oscarRemoteData
		.setDebug(true)
		.setPendingMessage("Chargement des types de contrat")
		.setErrorMessage("Impossible de charger la configuration")
		.setPendingMessage("Chargement des associations pour les types d'activité")
		.setErrorMessage("Erreur de chargement des associations des types activités")
		.performGet(this.url, this.handlerSuccess);
		},

		/**
		* Fin du chargement des données
		* @param success
		*/
		handlerSuccess(success) {
		let datas = success.data;
		this.oscartypes = datas.activitytypes;
		this.pcrutypes = datas.pcrucontracttypes;
		}
		},

front/src/remote/AjaxOscar.vue

+4 −2

Original line number	Diff line number	Diff line
		@@ -8,9 +8,11 @@
		<i class="icon-spinner animate-spin animate"></i> {{ oscarRemoteData.pendingMessage }}
		</div>
		<div v-if="oscarRemoteData.error" class="error-message">
		<span @click="oscarRemoteData.error = false" style="font-weight: bold; position: absolute; top: 1em; right: 1em ">x</span>
		<span @click="oscarRemoteData.error = false" style="font-weight: bold; position: absolute; top: 5em; right: 5em ">x</span>
		<i class="icon-attention-1"></i> <strong>{{ oscarRemoteData.errorMessage }} </strong> :
		<i>{{ oscarRemoteData.error }}</i>
		<code>{{ oscarRemoteData.error }}</code>
		<br>
		<a href="#" @click="oscarRemoteData.error = false" style="color: white">Fermer</a>
		</div>

		</div>

front/src/remote/OscarRemoteData.js

+9 −3

Original line number	Diff line number	Diff line
		@@ -7,7 +7,7 @@ class OscarRemoteData {
		debug: false,
		error: "",
		datas: null,
		errorMessage: "Erreur AJAX",
		errorMessage: "",
		pendingMessage: "Chargement des données"
		}
		}
		@@ -59,18 +59,20 @@ class OscarRemoteData {
		if( handlerResponse ){
		handlerResponse(response);
		} else {
		debug(' > NO handerResponse given');
		this.debug(' > NO handerResponse given');
		}
		})
		.catch(
		error => {
		this.debug(" > error ", error);
		this.debug(error);

		this.state.error = error;
		if( handlerError ){
		handlerError(error);
		}
		else {
		debug(' > NO handlerError given');
		this.debug(' > NO handlerError given');
		}
		})
		.finally( () => {
		@@ -88,8 +90,12 @@ class OscarRemoteData {
		}
		})
		.catch( error => {
		console.log(error);
		this.debug("[ERROR] " + error);
		if( handlerError ){
		handlerError(error);
		} else {
		this.state.error = error;
		}
		})
		.finally( () => {