Skip to content

Commit

Permalink
Merge branch 'feature/private-projects' into develop
Browse files Browse the repository at this point in the history
  • Loading branch information
ngeorgomanolis committed Sep 10, 2020
2 parents 4b3f34b + 032588f commit 80a24c4
Show file tree
Hide file tree
Showing 10 changed files with 363 additions and 24 deletions.
15 changes: 13 additions & 2 deletions src/App.vue
Original file line number Diff line number Diff line change
Expand Up @@ -61,6 +61,12 @@
color="#c5202e">
</loading>

<project-password-modal
:value='showProjectPassModal'
:project='project'>
</project-password-modal>


</div>

</template>
Expand All @@ -72,6 +78,7 @@ import Loading from 'vue-loading-overlay';
import GDPR from "./components/GDPR.vue";
import Footer from "./components/Footer.vue"
import Header from "./components/Header.vue"
import ProjectPasswordModal from '@/components/Common/ProjectPasswordModal'
import 'vue-loading-overlay/dist/vue-loading.css';
export default {
Expand All @@ -82,7 +89,8 @@ export default {
Loading,
GDPR,
Footer,
Header
Header,
ProjectPasswordModal
},
props : {},
computed: {
Expand All @@ -93,7 +101,10 @@ export default {
isLoadingSpinnerDisplayed: state => state.notification.isLoadingSpinnerDisplayed,
userLogged: state => state.user.logged,
userProfile: state => state.user.infos
userProfile: state => state.user.infos,
project: state => state.project.selectedProject,
showProjectPassModal : state => state.project.showProjectPassModal
}),
language: {
get() {
Expand Down
26 changes: 26 additions & 0 deletions src/api/project.js
Original file line number Diff line number Diff line change
Expand Up @@ -205,4 +205,30 @@ export default {
}
})
},
},

setPrivateProjectOptions(projectShortName){
return axios.get(process.env.BASE_ENDPOINT_URL + 'project/' + projectShortName + '/password', {
withCredentials: true,
data: {}
})
},

getAccessToProject(csrf,projectShortName,password){
return axios.post(process.env.BASE_ENDPOINT_URL + 'project/' + projectShortName + '/password', {
password:password
}, {
withCredentials: true,
headers: {
'X-CSRFToken': csrf
}
})
},

isProjectPrivate(project_id){
return axios.get(process.env.BASE_ENDPOINT_URL + 'project/' + project_id + '/private', {
withCredentials: true,
data: {}
})
},
}
16 changes: 14 additions & 2 deletions src/assets/messages.json
Original file line number Diff line number Diff line change
Expand Up @@ -795,7 +795,13 @@
"new-task-was-imported-successfully":"new task was imported successfully",
"import-the-selected-files":"Import selected files",

"modify-draft-modal-content":"This button will delete your Task Presenter design and take you back to Tasks Import (see Step 2 of the '{HowitWorks}' procedure)"
"modify-draft-modal-content":"This button will delete your Task Presenter design and take you back to Tasks Import (see Step 2 of the '{HowitWorks}' procedure)",

"private-project-title":"Private project",
"private-project-content":"This is a private project with restricted access. Please contact the project owner for more information.",
"access-denied":"Access denied",
"project-protect-with-password":"Protect project with password",
"private-c":"Private"

},
"de": {
Expand Down Expand Up @@ -1587,7 +1593,13 @@
"new-task-was-imported-successfully":"neue Aufgabe wurde erfolgreich importiert",
"import-the-selected-files":"Importieren Sie die ausgewählten Dateien",

"modify-draft-modal-content":"Diese Schaltfläche löscht Ihr Task Presenter-Design und bringt Sie zurück zum Aufgabenimport (siehe Schritt 2 der Prozedur '{HowitWorks}')."
"modify-draft-modal-content":"Diese Schaltfläche löscht Ihr Task Presenter-Design und bringt Sie zurück zum Aufgabenimport (siehe Schritt 2 der Prozedur '{HowitWorks}').",

"private-project-title":"Privates Projekt",
"private-project-content":"Das ist ein privates Projekt mit eingeschränktem Zugriff. Bitte kontaktieren Sie den Projektbesitzer für weitere Informationen",
"access-denied":"Zugriff abgelehnt",
"project-protect-with-password":"Projekt mit Passwort schützen",
"private-c":"Privat"


}
Expand Down
35 changes: 32 additions & 3 deletions src/components/Common/ProjectCard.vue
Original file line number Diff line number Diff line change
@@ -1,6 +1,11 @@
<template>
<div class="project">

<div class="project-info">
<b-badge v-if="project.restricted" variant="secondary" class='project-restricted'>
{{$t('private-c')}}
</b-badge>

<b-row class="row text-center mb-4">
<b-col class="col-image">
<!--<b-card-img-lazy v-if="project.info.thumbnail_url" :src="project.info.thumbnail_url"></b-card-img-lazy>
Expand All @@ -15,16 +20,21 @@
<p v-html="project.description"></p>
</b-col>
</b-row>
<b-button :to="{ name: 'project', params: { id: project.id } }" variant="primary">{{ buttonText }}</b-button>

<b-btn :to="{ name: 'project', params: { id: project.id } }" variant="primary">{{ buttonText }}</b-btn>

</div>

<div class="overlay"></div>
<div class="project-bg-image" :style="{ backgroundImage: 'url('+ getBaseUrl() +')' }"></div>

</div>

</template>

<script>
import { mapMutations, mapActions, mapState,mapGetters } from 'vuex'
export default {
name: 'ProjectCard',
data: () => {
Expand All @@ -36,7 +46,19 @@ export default {
project: Object,
buttonText: String
},
computed:{
...mapState('user', [
'infos',
]),
...mapGetters('user', [
'isLoggedUserOwnerOfProject',
'isLoggedUserAdmin'
]),
},
methods:{
...mapMutations('notification', [
'showError', 'showSuccess'
]),
getBaseUrl(){
if(this.project.info.thumbnail){
const base = process.env.BASE_ENDPOINT_URL
Expand Down Expand Up @@ -68,6 +90,13 @@ export default {
height: 100%;
padding: $spacing-3 $spacing-2;
.project-restricted{
position: absolute;
right: 0;
top: 0;
font-size: 20px;
}
.project-type {
display: block;
font-size: $font-size-small;
Expand Down
144 changes: 144 additions & 0 deletions src/components/Common/ProjectPasswordModal.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,144 @@
<template>

<b-modal
:visible="value"
ref="my-modal"
hide-footer
:title="$t('private-project-title')"
:ok-title="$t('submit-btn')"
:cancel-title="$t('cancel-c')"
@show="resetModal"
@ok="submitPass">
<b-form ref="form-registration" @submit.prevent="submitPass" class="mt-4">
<b-form-group
:description="$t('private-project-content')">
<b-form-input
:id="'private-project' + project.id"
type="password"
v-model="privateProjectPassword"
required
:placeholder="$t('login-input-password-placeholder')"
></b-form-input>
</b-form-group>
<b-button class="mt-3" type="submit" variant="primary"> {{$t('submit-btn')}} </b-button>
</b-form>
</b-modal>

</template>

<script>
import { mapState,mapActions,mapMutations } from 'vuex'
export default {
name: 'ProjectPasswordModal',
data: () => {
return {
privateProjectPassword:''
}
},
props: {
project:Object,
value: {
required: true
}
},
computed: {
...mapState('user', {
profile: state => state.infos
})
},
watch:{},
methods:{
...mapActions('project', [
'getAccessToProject'
]),
...mapMutations('notification', [
'showError'
]),
...mapMutations('project', [
'setProjectPassModal','setAccessForSelectedProject'
]),
submitPass(){
this.getAccessToProject({
'password':this.privateProjectPassword,
'short_name':this.project.short_name
}).then((response) => {
if (response.status == 'success'){
this.setAccessForSelectedProject({'access':true,'project_id':this.project.id})
this.setProjectPassModal(false)
this.$refs['my-modal'].hide()
this.$router.push({ name: 'project.task.presenter'})
} else {
this.showError({
title: response.status,
content: this.$t('access-denied')
})
}
})
},
resetModal() {
this.privateProjectPassword = ''
this.setProjectPassModal(false)
}
}
}
</script>

<style lang="scss" scoped>
@import '../../scss/variables.scss';
.project {
position: relative;
border-radius: $border-radius;
box-shadow: 0 4px 8px -4px rgba($black,0.2);
overflow: hidden;
}
@media only screen and (min-width: $viewport-mobile-large) {
.project {
.project-info {
padding: $spacing-4 $spacing-3;
}
.info-text {
max-width: 160px;
}
}
}
@media only screen and (min-width: $viewport-tablet-portrait) {
.project {
.info-text {
max-width: none;
}
}
}
@media only screen and (min-width: $viewport-large) {
.project {
height: 100%;
.project-info {
p {
margin-bottom: $spacing-7;
}
.btn {
position: absolute;
bottom: $spacing-4;
left: $spacing-3;
}
.row {
position: initial;
}
}
}
}
@media only screen and (min-width: $viewport-xlarge) {
}
</style>
4 changes: 2 additions & 2 deletions src/components/Project/Project.vue
Original file line number Diff line number Diff line change
Expand Up @@ -89,7 +89,7 @@
</div>

<div v-else-if="isAnonymousProject && !infos.admin">
<b-btn ref="btn-contribute" :to="{ name: 'project.task.presenter' }" variant="primary" size="lg">{{ $t('project-contribute') }} </b-btn>
<b-btn ref="btn-contribute" :to="{ name: 'project.task.presenter' }" variant="primary" size="lg">{{ $t('project-contribute') }} </b-btn>
</div>

<div v-else>
Expand All @@ -113,7 +113,7 @@
</b-modal>
</div>
<div v-else>
<b-btn ref="btn-contribute" :to="{ name: 'project.task.presenter' }" variant="primary" size="lg">{{ $t('project-contribute') }} </b-btn>
<b-btn ref="btn-contribute" :to="{ name: 'project.task.presenter' }" variant="primary" size="lg">{{ $t('project-contribute') }} </b-btn>
</div>

</div>
Expand Down
Loading

0 comments on commit 80a24c4

Please sign in to comment.