Skip to content

Commit

Permalink
Merge pull request #85 from ConductionNL/feature/PC108-114/zaak-add-rol
Browse files Browse the repository at this point in the history
finished adding rol to zaak
  • Loading branch information
SudoThijn authored Dec 12, 2024
2 parents 95e8007 + e21aabb commit a029bb8
Show file tree
Hide file tree
Showing 5 changed files with 189 additions and 28 deletions.
2 changes: 1 addition & 1 deletion src/entities/rol/rol.types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ export type TRol = {
omschrijving: string;
omschrijvingGeneriek: string;
url: string;
zaak: string;
zaak: string; // zaak id
betrokkene: string;
betrokkeneType: string;
afwijkendeNaamBetrokkene: string;
Expand Down
3 changes: 3 additions & 0 deletions src/modals/Modals.vue
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import { navigationStore } from '../store/store.js'
<WidgetZaakForm v-if="navigationStore.modal === 'widgetZaakForm'" />
<AddBerichtToZaak v-if="navigationStore.modal === 'addBerichtToZaak'" />
<AddTaakToZaak v-if="navigationStore.modal === 'addTaakToZaak'" />
<AddRolToZaak v-if="navigationStore.modal === 'addRolToZaak'" />
<!-- ==== -->
<EditZaakType />
<EditKlant />
Expand Down Expand Up @@ -43,6 +44,7 @@ import DeleteContactMoment from './contactMomenten/DeleteContactMoment.vue'
import EditMedewerker from './medewerkers/EditMedewerker.vue'
import AddBerichtToZaak from './zaken/AddBerichtToZaak.vue'
import AddTaakToZaak from './zaken/AddTaakToZaak.vue'
import AddRolToZaak from './zaken/AddRolToZaak.vue'
export default {
name: 'Modals',
Expand All @@ -63,6 +65,7 @@ export default {
EditMedewerker,
AddBerichtToZaak,
AddTaakToZaak,
AddRolToZaak,
},
}
</script>
149 changes: 149 additions & 0 deletions src/modals/zaken/AddRolToZaak.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,149 @@
<script setup>
import { zaakStore, navigationStore, rolStore } from '../../store/store.js'
</script>

<template>
<NcModal ref="modalRef"
label-id="addRolToZaak"
@close="closeModal">
<div class="modalContent">
<h2>Rol toevoegen aan {{ zaakStore.zaakItem.title }}</h2>

<div v-if="success !== null || error">
<NcNoteCard v-if="success" type="success">
<p>Rol succesvol toegevoegd aan zaak</p>
</NcNoteCard>
<NcNoteCard v-if="error" type="error">
<p>{{ error }}</p>
</NcNoteCard>
</div>

<div v-if="success === null" class="form-group">
<NcSelect v-bind="rollen"
v-model="rollen.value"
input-label="Rol"
:loading="rollenLoading"
:disabled="loading"
required />
</div>

<NcButton v-if="success === null"
:disabled="!rollen?.value || loading"
type="primary"
@click="addRolToZaak">
<template #icon>
<NcLoadingIcon v-if="loading" :size="20" />
<Plus v-if="!loading" :size="20" />
</template>
Toevoegen
</NcButton>
</div>
</NcModal>
</template>

<script>
import { NcButton, NcModal, NcLoadingIcon, NcNoteCard, NcSelect } from '@nextcloud/vue'
import { Rol } from '../../entities/index.js'
import _ from 'lodash'
import Plus from 'vue-material-design-icons/Plus.vue'
export default {
name: 'AddRolToZaak',
components: {
NcModal,
NcButton,
NcLoadingIcon,
NcNoteCard,
NcSelect,
// Icons
Plus,
},
data() {
return {
rollenLoading: false,
rollen: [],
loading: false,
success: null,
error: false,
errorCode: '',
hasUpdated: false,
}
},
mounted() {
this.fetchRollenData()
},
methods: {
closeModal() {
navigationStore.setModal(false)
},
fetchRollenData() {
this.rollenLoading = true
rolStore.refreshRollenList()
.then(({ data }) => {
this.rollen = {
options: data
// zaak is stored on the rol itself as a singular id, indicating that only rollen without a zaak can be used
.filter((rol) => !rol.zaak)
.map((rol) => ({
id: rol.id,
label: rol.title,
})),
}
})
.catch((err) => {
console.error(err)
})
.finally(() => {
this.rollenLoading = false
})
},
addRolToZaak() {
this.loading = true
this.error = false
const rolItem = rolStore.rollenList.find((rol) => rol.id === this.rollen.value.id)
if (!rolItem) {
this.error = 'something went majorly wrong'
this.loading = false
return
}
const rolItemCopy = _.cloneDeep(rolItem)
rolItemCopy.zaak = zaakStore.zaakItem.id
const newRolItem = new Rol(rolItemCopy)
rolStore.saveRol(newRolItem)
.then(({ response }) => {
this.success = response.ok
// Wait for the user to read the feedback then close the model
const self = this
setTimeout(function() {
self.success = null
self.closeModal()
}, 2000)
this.hasUpdated = false
})
.catch((err) => {
this.error = err
this.hasUpdated = false
})
.finally(() => {
this.loading = false
})
},
},
}
</script>

<style scoped>
.modalContent {
margin: var(--zaa-margin-50, 12px);
text-align: center;
}
</style>
61 changes: 35 additions & 26 deletions src/views/rollen/ZaakRollen.vue
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,8 @@ import { navigationStore, rolStore } from '../../store/store.js'

<template>
<div>
<div v-if="!loading">
<NcListItem v-for="(rollen, i) in rollenList"
<div v-if="filteredRollenList?.length">
<NcListItem v-for="(rollen, i) in filteredRollenList"
:key="`${rollen}${i}`"
:name="rollen?.omschrijving"
:active="rolStore.rolItem?.id === rollen.id"
Expand All @@ -22,21 +22,33 @@ import { navigationStore, rolStore } from '../../store/store.js'
{{ rollen?.omschrijving }}
</template>
<template #actions>
<NcActionButton @click="editRol(rollen)">
Bewerken
<NcActionButton @click="rolStore.setRolItem(rollen); navigationStore.setSelected('rollen')">
<template #icon>
<Eye :size="20" />
</template>
Bekijken
</NcActionButton>
<!-- <NcActionButton @click="rolStore.setRolItem(rollen); navigationStore.setModal('rollen')">
<template #icon>
<Pencil :size="20" />
</template>
Bewerken
</NcActionButton> -->
<NcActionButton>
Verwijderen
<template #icon>
<TrashCanOutline :size="20" />
</template>
Verwijderen van zaak
</NcActionButton>
</template>
</NcListItem>
</div>

<div v-if="!rollenList?.length && !loading">
<div v-if="!filteredRollenList?.length && !loading">
Geen rollen gevonden.
</div>

<NcLoadingIcon v-if="loading"
<NcLoadingIcon v-if="!filteredRollenList?.length && loading"
class="loadingIcon"
:size="64"
appearance="dark"
Expand Down Expand Up @@ -66,43 +78,40 @@ export default {
return {
search: '',
loading: true,
rollenList: [],
}
},
computed: {
filteredRollenList() {
return rolStore.rollenList.filter((rol) => rol.zaak === this.zaakId)
},
},
watch: {
zaakId(newVal) {
this.fetchData(newVal)
this.fetchData()
},
},
mounted() {
this.fetchData(this.zaakId)
this.fetchData()
},
methods: {
editRol(rol) {
rolStore.setRolItem(rol)
navigationStore.setModal('editRol')
},
fetchData(zaakId) {
fetchData() {
this.loading = true
fetch(
`/index.php/apps/zaakafhandelapp/api/zrc/rollen?zaak.id=${zaakId}`,
{
method: 'GET',
},
)
.then((response) => {
response.json().then((data) => {
this.rollenList = data.results
})
this.loading = false
})
.catch((err) => {
console.error(err)
rolStore.refreshRollenList()
.finally(() => {
this.loading = false
})
},
toggleRol(rol) {
// TODO: toggle rol
if (rolStore.rolItem?.id === rol.id) {
rolStore.setRolItem(null)
} else {
rolStore.setRolItem(rol)
}
},
clearText() {
this.search = ''
Expand Down
2 changes: 1 addition & 1 deletion src/views/zaken/ZaakDetails.vue
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ import { navigationStore, zaakStore } from '../../store/store.js'
</template>
Document toevoegen
</NcActionButton>
<NcActionButton @click="navigationStore.setModal('addRol')">
<NcActionButton @click="navigationStore.setModal('addRolToZaak')">
<template #icon>
<AccountPlus :size="20" />
</template>
Expand Down

0 comments on commit a029bb8

Please sign in to comment.