View | Details | Raw Unified | Return to bug 35287
Collapse All | Expand All

(-)a/koha-tmpl/intranet-tmpl/prog/js/vue/components/AdditionalFieldsDisplay.vue (+37 lines)
Line 0 Link Here
1
<template>
2
    <fieldset
3
        v-if="additional_field_values.length"
4
        class="rows"
5
        id="additional_fields"
6
    >
7
        <legend>{{ $__("Additional fields") }}</legend>
8
        <ol>
9
            <li v-for="additional_field_value in additional_field_values">
10
                <label
11
                    :for="`additional_field_` + additional_field_value.field_id"
12
                >
13
                    {{ additional_field_value.field_label }}:
14
                </label>
15
                <span> {{ additional_field_value.value_str }} </span>
16
            </li>
17
        </ol>
18
    </fieldset>
19
</template>
20
21
<script>
22
import { inject } from "vue"
23
import { APIClient } from "../fetch/api-client.js"
24
25
export default {
26
    data() {
27
        return {
28
            fields_to_display: [],
29
        }
30
    },
31
    name: "AdditionalFieldsDisplay",
32
    props: {
33
        resource_type: String,
34
        additional_field_values: Array,
35
    },
36
}
37
</script>
(-)a/koha-tmpl/intranet-tmpl/prog/js/vue/components/AdditionalFieldsEntry.vue (+296 lines)
Line 0 Link Here
1
<template>
2
    <fieldset
3
        v-if="available_fields.length"
4
        class="rows"
5
        id="additional_fields"
6
    >
7
        <legend>{{ $__("Additional fields") }}</legend>
8
        <ol>
9
            <template v-for="available_field in available_fields">
10
                <template
11
                    v-if="
12
                        available_field.authorised_value_category_name &&
13
                        !available_field.repeatable
14
                    "
15
                >
16
                    <li>
17
                        <label
18
                            :for="
19
                                `additional_field_` +
20
                                available_field.extended_attribute_type_id
21
                            "
22
                            >{{ available_field.name }}:
23
                        </label>
24
                        <v-select
25
                            :id="
26
                                `additional_field_` +
27
                                available_field.extended_attribute_type_id
28
                            "
29
                            :name="available_field.name"
30
                            v-model="
31
                                current_additional_fields_values[
32
                                    available_field.extended_attribute_type_id
33
                                ]
34
                            "
35
                            :options="
36
                                av_options[
37
                                    available_field
38
                                        .authorised_value_category_name
39
                                ]
40
                            "
41
                        />
42
                    </li>
43
                </template>
44
                <template
45
                    v-if="
46
                        available_field.authorised_value_category_name &&
47
                        available_field.repeatable
48
                    "
49
                >
50
                    <li>
51
                        <label
52
                            :for="
53
                                `additional_field_` +
54
                                available_field.extended_attribute_type_id
55
                            "
56
                            >{{ available_field.name }}:
57
                        </label>
58
                        <v-select
59
                            :id="
60
                                `additional_field_` +
61
                                available_field.extended_attribute_type_id
62
                            "
63
                            :name="available_field.name"
64
                            :multiple="available_field.repeatable"
65
                            v-model="
66
                                current_additional_fields_values[
67
                                    available_field.extended_attribute_type_id
68
                                ]
69
                            "
70
                            :options="
71
                                av_options[
72
                                    available_field
73
                                        .authorised_value_category_name
74
                                ]
75
                            "
76
                        />
77
                    </li>
78
                </template>
79
80
                <template
81
                    v-if="!available_field.authorised_value_category_name"
82
                >
83
                    <li
84
                        v-for="current in current_additional_fields_values[
85
                            available_field.extended_attribute_type_id
86
                        ]"
87
                    >
88
                        <label
89
                            :for="
90
                                `additional_field_` +
91
                                available_field.extended_attribute_type_id
92
                            "
93
                            >{{ available_field.name }}:
94
                        </label>
95
                        <input type="text" v-model="current.value" />
96
                        <a
97
                            href="#"
98
                            class="clear_attribute"
99
                            @click="clearField(current, $event)"
100
                        >
101
                            <i class="fa fa-fw fa-trash-can"></i>
102
                            {{ $__("Clear") }}
103
                        </a>
104
                        <template v-if="available_field.repeatable">
105
                            <a
106
                                href="#"
107
                                class="clone_attribute"
108
                                @click="
109
                                    cloneField(available_field, current, $event)
110
                                "
111
                            >
112
                                <i class="fa fa-fw fa-plus"></i>
113
                                {{ $__("New") }}
114
                            </a>
115
                        </template>
116
                    </li>
117
                </template>
118
            </template>
119
        </ol>
120
    </fieldset>
121
</template>
122
123
<script>
124
import { inject } from "vue"
125
import { APIClient } from "../fetch/api-client.js"
126
127
export default {
128
    data() {
129
        return {
130
            available_fields: [],
131
            av_options: [],
132
            current_additional_fields_values: {},
133
        }
134
    },
135
    beforeCreate() {
136
        const client = APIClient.additional_fields
137
        client.additional_fields.getAll(this.resource_type).then(
138
            available_fields => {
139
                this.available_fields = available_fields
140
                this.initialized = true
141
            },
142
            error => {}
143
        )
144
    },
145
    watch: {
146
        current_additional_fields_values: {
147
            deep: true,
148
            handler(current_additional_fields_values) {
149
                this.updateParentAdditionalFieldValues(
150
                    current_additional_fields_values
151
                )
152
            },
153
        },
154
        available_fields: function (available_fields) {
155
            if (available_fields) {
156
                const client_av = APIClient.authorised_values
157
                let av_cat_array = available_fields
158
                    .map(field => field.authorised_value_category_name)
159
                    .filter(field => field)
160
161
                client_av.values
162
                    .getCategoriesWithValues([
163
                        ...new Set(
164
                            av_cat_array.map(av_cat => '"' + av_cat + '"')
165
                        ),
166
                    ]) // unique
167
                    .then(av_categories => {
168
                        av_cat_array.forEach(av_cat => {
169
                            let av_match = av_categories.find(
170
                                element => element.category_name == av_cat
171
                            )
172
                            this.av_options[av_cat] =
173
                                av_match.authorised_values.map(av => ({
174
                                    value: av.value,
175
                                    label: av.description,
176
                                }))
177
                        })
178
179
                        // Iterate on available fields
180
                        available_fields.forEach(available_field => {
181
                            // Initialize current field as empty array
182
                            this.current_additional_fields_values[
183
                                available_field.extended_attribute_type_id
184
                            ] = []
185
186
                            // Grab all existing field values of this field
187
                            let existing_field_values =
188
                                this.additional_field_values.filter(
189
                                    afv =>
190
                                        afv.field_id ==
191
                                            available_field.extended_attribute_type_id &&
192
                                        afv.value
193
                                )
194
195
                            // If there are existing field values for this field, add them to current_additional_fields_values
196
                            if (existing_field_values.length) {
197
                                existing_field_values.forEach(
198
                                    existing_field_value => {
199
                                        let label = ""
200
                                        if (
201
                                            available_field.authorised_value_category_name
202
                                        ) {
203
                                            let av_value = this.av_options[
204
                                                available_field
205
                                                    .authorised_value_category_name
206
                                            ].filter(
207
                                                av_option =>
208
                                                    av_option.value ==
209
                                                    existing_field_value.value
210
                                            )
211
                                            label = av_value.length
212
                                                ? av_value[0].label
213
                                                : ""
214
                                        }
215
                                        this.current_additional_fields_values[
216
                                            existing_field_value.field_id
217
                                        ].push({
218
                                            value: existing_field_value.value,
219
                                            label: label,
220
                                        })
221
                                    }
222
                                )
223
224
                                // Otherwise add them as empty if not AV field
225
                            } else {
226
                                if (
227
                                    !available_field.authorised_value_category_name
228
                                ) {
229
                                    this.current_additional_fields_values[
230
                                        available_field.extended_attribute_type_id
231
                                    ] = [
232
                                        {
233
                                            label: "",
234
                                            value: "",
235
                                        },
236
                                    ]
237
                                }
238
                            }
239
                        })
240
                    })
241
            }
242
        },
243
    },
244
    methods: {
245
        clearField: function (current_field, event) {
246
            event.preventDefault()
247
            current_field.value = ""
248
        },
249
        cloneField: function (available_field, current, event) {
250
            event.preventDefault()
251
            this.current_additional_fields_values[
252
                available_field.extended_attribute_type_id
253
            ].push({
254
                value: current.value,
255
                label: available_field.name,
256
            })
257
        },
258
        updateParentAdditionalFieldValues: function (
259
            current_additional_fields_values
260
        ) {
261
            let updatedAdditionalFields = []
262
            Object.keys(current_additional_fields_values).forEach(field_id => {
263
                if (
264
                    !Array.isArray(
265
                        current_additional_fields_values[field_id]
266
                    ) &&
267
                    current_additional_fields_values[field_id]
268
                ) {
269
                    current_additional_fields_values[field_id] = [
270
                        current_additional_fields_values[field_id],
271
                    ]
272
                }
273
                if (current_additional_fields_values[field_id]) {
274
                    let new_extended_attributes =
275
                        current_additional_fields_values[field_id].map(
276
                            value => ({
277
                                field_id: field_id,
278
                                value: value.value,
279
                            })
280
                        )
281
                    updatedAdditionalFields = updatedAdditionalFields.concat(
282
                        new_extended_attributes
283
                    )
284
                }
285
            })
286
287
            this.$emit("additional-fields-changed", updatedAdditionalFields)
288
        },
289
    },
290
    name: "AdditionalFieldsEntry",
291
    props: {
292
        resource_type: String,
293
        additional_field_values: Array,
294
    },
295
}
296
</script>
(-)a/koha-tmpl/intranet-tmpl/prog/js/vue/fetch/additional-fields-api-client.js (+20 lines)
Line 0 Link Here
1
import HttpClient from "./http-client";
2
3
export class AdditionalFieldsAPIClient extends HttpClient {
4
    constructor() {
5
        super({
6
            baseURL: "/api/v1/extended_attribute_types",
7
        });
8
    }
9
10
    get additional_fields() {
11
        return {
12
            getAll: resource_type =>
13
                this.get({
14
                    endpoint: "?resource_type=" + resource_type,
15
                }),
16
        };
17
    }
18
}
19
20
export default AdditionalFieldsAPIClient;
(-)a/koha-tmpl/intranet-tmpl/prog/js/vue/fetch/api-client.js (-1 / +2 lines)
Lines 1-6 Link Here
1
import ERMAPIClient from "./erm-api-client";
1
import ERMAPIClient from "./erm-api-client";
2
import PatronAPIClient from "./patron-api-client";
2
import PatronAPIClient from "./patron-api-client";
3
import AcquisitionAPIClient from "./acquisition-api-client";
3
import AcquisitionAPIClient from "./acquisition-api-client";
4
import AdditionalFieldsAPIClient from "./additional-fields-api-client";
4
import AVAPIClient from "./authorised-values-api-client";
5
import AVAPIClient from "./authorised-values-api-client";
5
import ItemAPIClient from "./item-api-client";
6
import ItemAPIClient from "./item-api-client";
6
import RecordSourcesAPIClient from "./record-sources-api-client";
7
import RecordSourcesAPIClient from "./record-sources-api-client";
Lines 11-16 export const APIClient = { Link Here
11
    erm: new ERMAPIClient(),
12
    erm: new ERMAPIClient(),
12
    patron: new PatronAPIClient(),
13
    patron: new PatronAPIClient(),
13
    acquisition: new AcquisitionAPIClient(),
14
    acquisition: new AcquisitionAPIClient(),
15
    additional_fields: new AdditionalFieldsAPIClient(),
14
    authorised_values: new AVAPIClient(),
16
    authorised_values: new AVAPIClient(),
15
    item: new ItemAPIClient(),
17
    item: new ItemAPIClient(),
16
    sysprefs: new SysprefAPIClient(),
18
    sysprefs: new SysprefAPIClient(),
17
- 

Return to bug 35287