Show option's details

This commit is contained in:
ArenMg 2021-07-30 04:20:48 +03:00
parent 19361ed96f
commit 827b891945
3 changed files with 55 additions and 10 deletions

View file

@ -0,0 +1,39 @@
<template>
<modal-layout>
<template v-slot:title>{{ choice.title }}</template>
<div class="card-image light-color valign-wrapper">
<img
v-if="choice.img"
class="category-picture"
v-bind:src="choice.img"
alt="image"
/>
</div>
<div>
<div>
<div v-html="choice.description"></div>
</div>
<div>
<a :href="choice.url" target="_blank">{{ choice.url }}</a>
</div>
</div>
<template v-slot:footer>
<button @click="close()" class="waves-effect waves-green btn-flat">
ok
</button>
</template>
</modal-layout>
</template>
<script>
module.exports = {
mixins: [VueModal],
data() {
return {
choice: false,
};
},
};
</script>

View file

@ -114,7 +114,7 @@
/> />
</button> </button>
<button @click="saveVoteMajoritaire()" class="create-vote-btn"> <button @click="saveVoteMajoritaire()" class="create-vote-btn">
<span>Créer la vote majoritaire</span> <span>Créer le vote majoritaire</span>
</button> </button>
</div> </div>
</div> </div>
@ -207,13 +207,6 @@ module.exports = {
choice_image: "", choice_image: "",
choice_url: "", choice_url: "",
}, },
{
choice_title_label: "Choix numéro 2",
choice_title: "",
choice_description: "",
choice_image: "",
choice_url: "",
},
], ],
}; };
}, },

View file

@ -33,7 +33,9 @@
</thead> </thead>
<tbody> <tbody>
<tr v-for="(choice, k) in currentTheme.choices" :key="k"> <tr v-for="(choice, k) in currentTheme.choices" :key="k">
<td>{{ choice.title }}</td> <td>
<span class="choice" @click="OpenDetail(choice)">{{ choice.title }}</span>
</td>
<td class="chek-cell-container"> <td class="chek-cell-container">
<input <input
type="checkbox" type="checkbox"
@ -97,7 +99,7 @@
<span>Valider mon choix</span> <span>Valider mon choix</span>
</button> </button>
</div> </div>
<div class="space-top"> <div v-if="!showVote" class="space-top">
<h1 class="vm-header-title">Résultat</h1> <h1 class="vm-header-title">Résultat</h1>
<div v-if="typeof currentTheme === `object`" id="chart"> <div v-if="typeof currentTheme === `object`" id="chart">
<apexchart <apexchart
@ -108,11 +110,17 @@
></apexchart> ></apexchart>
</div> </div>
</div> </div>
<template v-slot:addons>
<choice-detail-modal ref="ChoiceDetailsModal"> </choice-detail-modal>
</template>
</base-layout> </base-layout>
</div> </div>
</template> </template>
<style lang="css" scoped> <style lang="css" scoped>
.choice {
cursor: pointer;
}
.box-container { .box-container {
border: 1px solid #a1a3a1; border: 1px solid #a1a3a1;
border-radius: 10px; border-radius: 10px;
@ -363,9 +371,14 @@ module.exports = {
console.error(error); console.error(error);
} }
}, },
OpenDetail(choice = {}) {
this.$refs.ChoiceDetailsModal.choice = choice;
this.$refs.ChoiceDetailsModal.open();
},
}, },
components: { components: {
apexchart: VueApexCharts, apexchart: VueApexCharts,
"choice-detail-modal": vueLoader("components/modals/ChoiceDetailsModal"),
}, },
}; };
</script> </script>