Skip to content
Snippets Groups Projects
Commit 60f11dde authored by Timothee P's avatar Timothee P :sunflower:
Browse files

improve button styles, display message & guard routes

parent 15f91b52
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
src/App.vue
+ 5
− 4
View file @ 60f11dde
......@@ -120,7 +120,7 @@
</div>
<div class="desktop flex push-right-desktop">
<router-link v-if="user" to="/my_account/" class="item">
<router-link v-if="user" :to="{name: 'my_account'}" class="item">
{{ userFullname || user.username || "Utilisateur inconnu" }}
</router-link>
<div
......@@ -163,7 +163,8 @@
class="ui info message"
>
<div class="header">
<i class="info circle icon"></i> Informations
<i class="info circle icon"></i>
Informations
</div>
<ul class="list">
{{
......@@ -186,8 +187,8 @@
<footer>
<div class="ui compact text menu">
<router-link to="/mentions/" class="item">Mentions légales</router-link>
<router-link to="/aide/" class="item">Aide</router-link>
<router-link :to="{name: 'mentions'}" class="item">Mentions légales</router-link>
<router-link :to="{name: 'aide'}" class="item">Aide</router-link>
<p class="item">Version {{ PACKAGE_VERSION }}</p>
</div>
</footer>
......
src/router/index.js
+ 3
− 3
View file @ 60f11dde
......@@ -24,17 +24,17 @@ const routes = [
component: () => import(/* webpackChunkName: "login" */'../views/registration/Login.vue')
},
{
path: '/my_account/',
path: `${projectBase === 'projet' ? '': '/' + projectBase}/my_account/`,
name: 'my_account',
component: () => import('../views/My_account.vue')
},
{
path: '/mentions/',
path: `${projectBase === 'projet' ? '': '/' + projectBase}/mentions/`,
name: 'mentions',
component: () => import('../views/flatpages/with_right_menu.vue')
},
{
path: '/aide/',
path: `${projectBase === 'projet' ? '': '/' + projectBase}/aide/`,
name: 'aide',
component: () => import('../views/flatpages/Default.vue')
},
......
src/views/project/Project_detail.vue
+ 90
− 55
View file @ 60f11dde
......@@ -3,9 +3,6 @@
<div v-frag v-if="permissions && permissions.can_view_project && project">
<div id="message" class="fullwidth">
<div v-if="tempMessage" class="ui positive message">
<!-- <i class="close icon"></i> -->
<!-- <div class="header">You are eligible for a reward</div> -->
<p><i class="check icon"></i> {{ tempMessage }}</p>
</div>
</div>
......@@ -48,63 +45,83 @@
>{{ project.nb_published_features_comments }}
</div>
</div>
<div class="ten wide column">
<h1 class="ui header">
<div class="content">
{{ project.title }}
<div v-if="arraysOffline.length > 0">
{{ arraysOffline.length }} modification<span v-if="arraysOffline.length>1">s</span> en attente
<div class="ten wide column important-flex space-between">
<div>
<h1 class="ui header">
{{ project.title }}
</h1>
<div class="ui hidden divider"></div>
<div class="sub header">
{{ project.description }}
</div>
</div>
<div class="content flex flex-column-right">
<div class="flex flex-column-right">
<div class="ui icon right compact buttons flex-column-right">
<div>
<a
v-if="
user &&
permissions &&
permissions.can_view_project &&
isOffline() !== true
"
id="subscribe-button"
class="ui button button-hover-green"
data-tooltip="S'abonner au projet"
data-position="top center"
data-variation="mini"
@click="isModalOpen = true"
>
<i class="inverted grey envelope icon"></i>
</a>
<router-link
v-if="
permissions &&
permissions.can_update_project &&
isOffline() !== true
"
:to="{ name: 'project_edit', params: { slug: project.slug } }"
class="ui button button-hover-orange"
data-tooltip="Modifier le projet"
data-position="top center"
data-variation="mini"
>
<i class="inverted grey pencil alternate icon"></i>
</router-link>
</div>
<button
:disabled="isOffline()"
@click="sendOfflineFeatures()"
class="ui fluid teal icon button"
v-if="user && user.is_administrator && !isSharedProject && project.generate_share_link"
class="ui teal left labeled icon button"
@click="copyLink"
>
<i class="upload icon"></i> Envoyer au serveur
</button>
</div>
<div class="ui icon right floated compact buttons">
<a
v-if="
user &&
permissions &&
permissions.can_view_project &&
isOffline() !== true
"
id="subscribe-button"
class="ui button button-hover-green"
data-tooltip="S'abonner au projet"
data-position="top center"
data-variation="mini"
@click="isModalOpen = true"
>
<i class="inverted grey envelope icon"></i>
</a>
<router-link
v-if="
permissions &&
permissions.can_update_project &&
isOffline() !== true
"
:to="{ name: 'project_edit', params: { slug: project.slug } }"
class="ui button button-hover-orange"
data-tooltip="Modifier le projet"
data-position="top center"
data-variation="mini"
>
<i class="inverted grey pencil alternate icon"></i>
</router-link>
<button
v-if="!isSharedProject && project.generate_share_link" class="ui button teal" @click="copyLink">
<i class="ui icon clipboard"></i>
<i class="left icon share square"></i>
Copier le lien de partage
</button>
</div>
<div class="ui hidden divider"></div>
<div class="sub header">
{{ project.description }}
<div v-if="confirmMsg">
<div class="ui positive tiny-margin message">
<span>
Le lien a été copié dans le presse-papier
</span>
&nbsp;
<i class="close icon" @click="confirmMsg = ''" />
</div>
</div>
</div>
</h1>
</div>
</div>
<div v-if="arraysOffline.length > 0">
{{ arraysOffline.length }} modification<span v-if="arraysOffline.length>1">s</span> en attente
<button
:disabled="isOffline()"
@click="sendOfflineFeatures()"
class="ui fluid labeled teal icon button"
>
<i class="upload icon"></i>
Envoyer au serveur
</button>
</div>
</div>
......@@ -647,6 +664,7 @@ export default {
importMessage: null,
arraysOffline: [],
arraysOfflineErrors: [],
confirmMsg: false,
geojsonImport: [],
fileToImport: { name: "", size: 0 },
slug: this.$route.params.slug,
......@@ -804,7 +822,10 @@ export default {
return "?ver=" + Math.random();
},
getRouteUrl(url) {
return "/" + url.replace(this.$store.state.configuration.BASE_URL, ""); // remove duplicate /geocontrib
if (this.isSharedProject) {
url = url.replace("projet", "projet-partage")
}
return url.replace(this.$store.state.configuration.BASE_URL, ""); //* remove duplicate /geocontrib
},
isOffline() {
return navigator.onLine === false;
......@@ -821,6 +842,7 @@ export default {
const sharedLink = window.location.href.replace("projet", "projet-partage");
navigator.clipboard.writeText(sharedLink).then(()=> {
console.log("success")
this.confirmMsg = true;
}, () => {
console.log("failed")
}
......@@ -1030,7 +1052,6 @@ export default {
/* // ! missing style in semantic.min.css, je ne comprends pas comment... */
.ui.right.floated.button {
float: right;
margin: 0 0 0 1em;
}
.feature-type-container {
......@@ -1073,6 +1094,14 @@ export default {
.text-left {
text-align: left !important;
}
.space-between {
justify-content: space-between;
}
.flex-column-right {
flex-direction: column !important;
align-items: flex-end;
}
.import-message {
width: fit-content;
......@@ -1080,3 +1109,9 @@ export default {
color: teal;
}
</style>
<style scoped>
.ui.button, .ui.button .button, .tiny-margin {
margin: 0.1rem 0 0.1rem 0.1rem !important;
}
</style>
\ No newline at end of file
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