Commit e264a4e4 authored by clementbrizard's avatar clementbrizard
Browse files

Merge branch 'dev' of gitlab.utc.fr:tx-techno-num/impactometre into dev

parents d12ad659 e2f5e820
...@@ -10,9 +10,9 @@ ...@@ -10,9 +10,9 @@
<main id="main-flexbox"> <main id="main-flexbox">
<SinglePage :page="displayed_single_page" v-show="display_single_page"></SinglePage> <SinglePage :page="displayed_single_page" v-show="display_single_page"></SinglePage>
<div class="scenarios" v-show="display_scenarios"> <div class="scenarios" v-show="display_scenarios">
<Scenario title="Scenario A"></Scenario> <Scenario ref="scenario0" id=0 title="Scenario A"></Scenario>
<Scenario title="Scenario B"></Scenario> <Scenario ref="scenario1" id=1 title="Scenario B"></Scenario>
<Scenario title="Scenario C"></Scenario> <Scenario ref="scenario2" id=2 title="Scenario C"></Scenario>
</div> </div>
<ResultsDetailledView :selectedView="results_detailled_view_choice" class="scenarios" v-show="!display_scenarios" :key="re_render_results_detailled_view" /> <ResultsDetailledView :selectedView="results_detailled_view_choice" class="scenarios" v-show="!display_scenarios" :key="re_render_results_detailled_view" />
<Results /> <Results />
...@@ -43,11 +43,23 @@ export default { ...@@ -43,11 +43,23 @@ export default {
re_render_results_detailled_view: false, re_render_results_detailled_view: false,
display_single_page: false, display_single_page: false,
displayed_single_page: null, displayed_single_page: null,
activeScenarios: [],
hide_warning: false, hide_warning: false,
}; };
}, },
methods: {}, methods: {},
mounted() { mounted() {
this.$root.$on("scenario-status-update", ([scenario, value]) =>{
this.activeScenarios[scenario] = value;
this.$refs.scenario0.updateActiveScenarios(this.activeScenarios);
this.$refs.scenario1.updateActiveScenarios(this.activeScenarios);
this.$refs.scenario2.updateActiveScenarios(this.activeScenarios);
this.$refs.scenario0.reRenderCopyButtons();
this.$refs.scenario1.reRenderCopyButtons();
this.$refs.scenario2.reRenderCopyButtons();
});
this.$root.$on("show_single_page", (page) => { this.$root.$on("show_single_page", (page) => {
this.display_single_page = true; this.display_single_page = true;
this.displayed_single_page = page; this.displayed_single_page = page;
......
<svg width="66" height="67" viewBox="0 0 66 67" fill="none" xmlns="http://www.w3.org/2000/svg">
<g filter="url(#filter0_d)">
<rect x="4.5" y="3.5" width="56.0642" height="57.186" rx="9.5" stroke="black"/>
</g>
<rect x="21.5" y="19.5" width="16" height="20" rx="2.5" fill="#84BCEC" stroke="black"/>
<rect x="27.5" y="24.5" width="16" height="20" rx="2.5" fill="white" stroke="black"/>
<path d="M35.9258 34.4238H38.3047V35.4492H35.9258V38.1445H34.8359V35.4492H32.457V34.4238H34.8359V31.9336H35.9258V34.4238Z" fill="black"/>
<defs>
<filter id="filter0_d" x="0" y="0" width="65.0642" height="66.186" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/>
<feOffset dy="1"/>
<feGaussianBlur stdDeviation="2"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/>
</filter>
</defs>
</svg>
<svg width="66" height="67" viewBox="0 0 66 67" fill="none" xmlns="http://www.w3.org/2000/svg">
<g filter="url(#filter0_d)">
<rect x="4.5" y="3.5" width="56.0642" height="57.186" rx="9.5" stroke="black"/>
</g>
<rect x="21.5" y="19.5" width="16" height="20" rx="2.5" fill="#E7DC73" stroke="black"/>
<rect x="27.5" y="24.5" width="16" height="20" rx="2.5" fill="white" stroke="black"/>
<path d="M35.9258 34.4238H38.3047V35.4492H35.9258V38.1445H34.8359V35.4492H32.457V34.4238H34.8359V31.9336H35.9258V34.4238Z" fill="black"/>
<defs>
<filter id="filter0_d" x="0" y="0" width="65.0642" height="66.186" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/>
<feOffset dy="1"/>
<feGaussianBlur stdDeviation="2"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/>
</filter>
</defs>
</svg>
<svg width="66" height="67" viewBox="0 0 66 67" fill="none" xmlns="http://www.w3.org/2000/svg">
<g filter="url(#filter0_d)">
<rect x="4.5" y="3.5" width="56.0642" height="57.186" rx="9.5" stroke="black"/>
</g>
<rect x="21.5" y="19.5" width="16" height="20" rx="2.5" fill="#E97371" stroke="black"/>
<rect x="27.5" y="24.5" width="16" height="20" rx="2.5" fill="white" stroke="black"/>
<path d="M35.9258 34.4238H38.3047V35.4492H35.9258V38.1445H34.8359V35.4492H32.457V34.4238H34.8359V31.9336H35.9258V34.4238Z" fill="black"/>
<defs>
<filter id="filter0_d" x="0" y="0" width="65.0642" height="66.186" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/>
<feOffset dy="1"/>
<feGaussianBlur stdDeviation="2"/>
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/>
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/>
</filter>
</defs>
</svg>
...@@ -122,9 +122,23 @@ ...@@ -122,9 +122,23 @@
<div class="scenario-header"></div> <div class="scenario-header"></div>
<div class="scenario-body"> <div class="scenario-body">
<img <img
src="../assets/img/add_scenario_button.svg" src="../assets/img/add_scenario_button.svg"
@click.prevent="createScenario" @click.prevent="createScenario(-1)"
/> />
<div :key="componentKey">
<img v-if="activeScenarios[0]"
src="../assets/img/add_scenario_rouge.svg"
@click.prevent="createScenario(0)"
/>
<img v-if="activeScenarios[1]"
src="../assets/img/add_scenario_jaune.svg"
@click.prevent="createScenario(1)"
/>
<img v-if="activeScenarios[2]"
src="../assets/img/add_scenario_bleu.svg"
@click.prevent="createScenario(2)"
/>
</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -177,6 +191,10 @@ function initialScenario() { ...@@ -177,6 +191,10 @@ function initialScenario() {
export default { export default {
name: "Scenario", name: "Scenario",
props: { props: {
id: {
type: String,
required: true,
},
title: { title: {
type: String, type: String,
required: true, required: true,
...@@ -192,18 +210,47 @@ export default { ...@@ -192,18 +210,47 @@ export default {
software_options, software_options,
journey_options, journey_options,
scenario: {}, scenario: {},
activeScenarios: [false, false, false],
componentKey: 0,
}; };
}, },
computed: {
getScenarioData: function() {
return this.scenario
}
},
methods: { methods: {
createScenario() { createScenario(id) {
this.scenario = initialScenario(); let newScenario;
this.scenario.meetingScenario = this.title; if (id >= 0) {
this.active = true; const new_scenarios = [];
this.$root.$emit("retrieveScenariosInOrder", new_scenarios);
newScenario = JSON.parse(JSON.stringify(new_scenarios[id]));
this.scenario = newScenario;
this.scenario.meetingScenario = this.title;
this.active = true;
this.$root.$emit('scenario-status-update', [this.id, true]);
}
else {
newScenario = initialScenario();
this.scenario = newScenario;
this.scenario.meetingScenario = this.title;
this.active = true;
this.$root.$emit('scenario-status-update', [this.id, true]);
}
}, },
deleteScenario() { deleteScenario() {
this.scenario = initialScenario(); this.scenario = initialScenario();
this.scenario.meetingScenario = this.title; this.scenario.meetingScenario = this.title;
this.active = false; this.active = false;
this.$root.$emit('scenario-status-update', [this.id, false])
this.componentKey += 1;
},
updateActiveScenarios(updatedActiveScenarios) {
this.activeScenarios = updatedActiveScenarios;
},
emitUpdate(active){
this.$root.$emit('scenario-status-update', [this.id, active])
}, },
addJourney() { addJourney() {
//TODO: Add a journey only if last if not empty //TODO: Add a journey only if last if not empty
...@@ -215,18 +262,30 @@ export default { ...@@ -215,18 +262,30 @@ export default {
deleteJourney(journey) { deleteJourney(journey) {
this.scenario.journey = this.scenario.journey.filter((j) => j != journey); this.scenario.journey = this.scenario.journey.filter((j) => j != journey);
}, },
reRenderCopyButtons() {
this.componentKey += 1;
},
}, },
mounted() { mounted() {
var cookie = JSON.parse(localStorage.getItem(this.title)); var cookie = JSON.parse(localStorage.getItem(this.title));
if (cookie) { if (cookie) {
this.active = cookie[0]; this.active = cookie[0];
this.scenario = cookie[1]; this.scenario = cookie[1];
this.$nextTick(function() {
this.$root.$emit('scenario-status-update', [this.id, this.active]);
});
} }
this.$root.$on("retrieveScenarios", (data) => { this.$root.$on("retrieveScenarios", (data) => {
if (this.active) { if (this.active) {
data.push(this.scenario); data.push(this.scenario);
} }
}); });
this.$root.$on("retrieveScenariosInOrder", (data) => {
if (this.active) {
data[this.id] = this.scenario;
}
});
}, },
updated() { updated() {
localStorage.setItem( localStorage.setItem(
...@@ -440,6 +499,15 @@ export default { ...@@ -440,6 +499,15 @@ export default {
transition-timing-function: ease; transition-timing-function: ease;
width: 50px; width: 50px;
} }
.scenario-empty .scenario-body div img {
display: block;
margin-left: auto;
margin-right: auto;
margin-top: 10px;
transition-timing-function: ease;
width: 50px;
}
.scenario-empty .scenario-body img:hover { .scenario-empty .scenario-body img:hover {
transition-timing-function: ease; transition-timing-function: ease;
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment