Jonathan Druart
74be73121e
Note that we are adding an extra space for id and counter, otherwise they got removed in favor of the "simple" string. { Agreement: Agreement } replaced { Agreement: { id: ..., counter: ... } } Signed-off-by: Jonathan Field <jonathan.field@ptfs-europe.com> Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com> Signed-off-by: Kyle M Hall <kyle@bywatersolutions.com> Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>
112 lines
4 KiB
Vue
112 lines
4 KiB
Vue
<template>
|
|
<fieldset class="rows" id="agreement_user_roles">
|
|
<legend>{{ $t("Users") }}</legend>
|
|
<fieldset
|
|
class="rows"
|
|
v-for="(user_role, counter) in user_roles"
|
|
v-bind:key="counter"
|
|
>
|
|
<legend>
|
|
{{ $t("Agreement user .counter", { counter: counter + 1 }) }}
|
|
<a href="#" @click.prevent="deleteUser(counter)"
|
|
><i class="fa fa-trash"></i> {{ $t("Remove this user") }}</a
|
|
>
|
|
</legend>
|
|
<ol>
|
|
<li>
|
|
<label :for="`user_id_${counter}`">{{ $t("User") }}:</label>
|
|
<span class="user">
|
|
{{ user_role.patron_str }}
|
|
</span>
|
|
(<a
|
|
href="#"
|
|
@click="selectUser(counter)"
|
|
class="btn btn-default"
|
|
>{{ $t("Select user") }}</a
|
|
>)
|
|
</li>
|
|
<li>
|
|
<label :for="`user_role_${counter}`"
|
|
>{{ $t("Role") }}:</label
|
|
>
|
|
<select v-model="user_role.role" required>
|
|
<option value=""></option>
|
|
<option
|
|
v-for="r in av_agreement_user_roles"
|
|
:key="r.authorised_values"
|
|
:value="r.authorised_value"
|
|
:selected="
|
|
r.authorised_value == user_role.role
|
|
? true
|
|
: false
|
|
"
|
|
>
|
|
{{ r.lib }}
|
|
</option>
|
|
</select>
|
|
<span class="required">{{ $t("Required") }}</span>
|
|
</li>
|
|
</ol>
|
|
</fieldset>
|
|
<input
|
|
type="hidden"
|
|
name="selected_patron_id"
|
|
id="selected_patron_id"
|
|
/>
|
|
<a class="btn btn-default" @click="addUser"
|
|
><font-awesome-icon icon="plus" /> {{ $t("Add new user") }}</a
|
|
>
|
|
</fieldset>
|
|
</template>
|
|
|
|
<script>
|
|
import { fetchPatron } from "../../fetch"
|
|
|
|
export default {
|
|
name: 'AgreementUserRoles',
|
|
props: {
|
|
av_agreement_user_roles: Array,
|
|
user_roles: Array,
|
|
},
|
|
beforeCreate() {
|
|
this.user_roles.forEach(u => {
|
|
u.patron_str = $patron_to_html(u.patron)
|
|
})
|
|
},
|
|
methods: {
|
|
addUser() {
|
|
this.user_roles.push({
|
|
user_id: null,
|
|
role: null,
|
|
patron_str: '',
|
|
})
|
|
},
|
|
deleteUser(counter) {
|
|
this.user_roles.splice(counter, 1)
|
|
},
|
|
selectUser(counter) {
|
|
let select_user_window = window.open("/cgi-bin/koha/members/search.pl?columns=cardnumber,name,category,branch,action&selection_type=select&filter=erm_users",
|
|
'PatronPopup',
|
|
'width=740,height=450,location=yes,toolbar=no,'
|
|
+ 'scrollbars=yes,resize=yes'
|
|
)
|
|
// This is a bit dirty, the "select user" window should be rewritten and be a Vue component
|
|
// but that's not for now...
|
|
select_user_window.addEventListener('beforeunload', this.newUserSelected, false)
|
|
select_user_window.counter = counter
|
|
},
|
|
newUserSelected(e) {
|
|
let c = e.currentTarget.counter
|
|
let selected_patron_id = document.getElementById("selected_patron_id").value
|
|
let patron
|
|
// FIXME We are missing a "loading..."
|
|
fetchPatron(selected_patron_id).then((p) => {
|
|
patron = p
|
|
this.user_roles[c].patron = patron
|
|
this.user_roles[c].patron_str = $patron_to_html(patron)
|
|
this.user_roles[c].user_id = patron.patron_id
|
|
})
|
|
},
|
|
},
|
|
}
|
|
</script>
|