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

(-)a/koha-tmpl/intranet-tmpl/prog/js/vue/components/FormElement.vue (-184 / +196 lines)
Lines 1-198 Link Here
1
<template>
1
<template>
2
    <label
2
    <template v-if="display">
3
        v-if="attr.label"
3
        <label
4
        :for="getElementId"
4
            v-if="attr.label"
5
        :class="{ required: attr.required }"
5
            :for="getElementId"
6
        :style="{ ...attr.style }"
6
            :class="{ required: attr.required }"
7
        >{{ attr.label }}:</label
7
            :style="{ ...attr.style }"
8
    >
8
            >{{ attr.label }}:</label
9
    <template v-if="attr.type == 'number'">
10
        <InputNumber
11
            :id="getElementId"
12
            v-model="resource[attr.name]"
13
            :placeholder="attr.placeholder || attr.label"
14
            :required="attr.required ? true : false"
15
            :size="attr.size"
16
            :maxlength="attr.maxlength"
17
            :disabled="disabled"
18
            @update:modelValue="checkForInputError()"
19
        />
20
    </template>
21
    <template v-else-if="attr.type == 'text'">
22
        <InputText
23
            :id="getElementId"
24
            v-model="resource[attr.name]"
25
            :placeholder="attr.placeholder || attr.label"
26
            :required="attr.required ? true : false"
27
            :disabled="disabled"
28
            @update:modelValue="checkForInputError()"
29
        />
30
    </template>
31
    <template v-else-if="attr.type == 'textarea'">
32
        <TextArea
33
            :id="getElementId"
34
            v-model="resource[attr.name]"
35
            :rows="attr.textAreaRows"
36
            :cols="attr.textAreaCols"
37
            :placeholder="attr.placeholder || attr.label"
38
            :required="attr.required ? true : false"
39
            :disabled="disabled"
40
            @update:modelValue="checkForInputError()"
41
        />
42
    </template>
43
    <template v-else-if="attr.type == 'checkbox'">
44
        <InputCheckbox
45
            :id="getElementId"
46
            type="checkbox"
47
            v-model="resource[attr.name]"
48
            :changeMethod="attr.onChange && attr.onChange.bind(this, resource)"
49
            :disabled="disabled"
50
        />
51
    </template>
52
    <template v-else-if="attr.type == 'radio'">
53
        <template
54
            v-for="(option, index) in attr.options"
55
            :key="`radio-option-${index}`"
56
        >
9
        >
57
            <label
10
        <template v-if="attr.type == 'number'">
58
                v-if="option.description"
11
            <InputNumber
59
                :for="attr.name + '_' + option.value"
12
                :id="getElementId"
60
                >{{ option.description }}:
13
                v-model="resource[attr.name]"
14
                :placeholder="attr.placeholder || attr.label"
15
                :required="attr.required ? true : false"
16
                :size="attr.size"
17
                :maxlength="attr.maxlength"
18
                :disabled="disabled"
19
                @update:modelValue="checkForInputError()"
20
            />
21
        </template>
22
        <template v-else-if="attr.type == 'text'">
23
            <InputText
24
                :id="getElementId"
25
                v-model="resource[attr.name]"
26
                :placeholder="attr.placeholder || attr.label"
27
                :required="attr.required ? true : false"
28
                :disabled="disabled"
29
                @update:modelValue="checkForInputError()"
30
            />
31
        </template>
32
        <template v-else-if="attr.type == 'textarea'">
33
            <TextArea
34
                :id="getElementId"
35
                v-model="resource[attr.name]"
36
                :rows="attr.textAreaRows"
37
                :cols="attr.textAreaCols"
38
                :placeholder="attr.placeholder || attr.label"
39
                :required="attr.required ? true : false"
40
                :disabled="disabled"
41
                @update:modelValue="checkForInputError()"
42
            />
43
        </template>
44
        <template v-else-if="attr.type == 'checkbox'">
45
            <InputCheckbox
46
                :id="getElementId"
47
                type="checkbox"
48
                v-model="resource[attr.name]"
49
                :changeMethod="
50
                    attr.onChange && attr.onChange.bind(this, resource)
51
                "
52
                :disabled="disabled"
53
            />
54
        </template>
55
        <template v-else-if="attr.type == 'radio'">
56
            <template
57
                v-for="(option, index) in attr.options"
58
                :key="`radio-option-${index}`"
59
            >
60
                <label
61
                    v-if="option.description"
62
                    :for="attr.name + '_' + option.value"
63
                    >{{ option.description }}:
64
                    <InputRadio
65
                        :name="attr.name"
66
                        :id="attr.name + '_' + option.value"
67
                        :value="option.value"
68
                        :checked="
69
                            (!Object.keys(resource).includes(attr.name) &&
70
                                attr.default == option.value) ||
71
                            (Object.keys(resource).includes(attr.name) &&
72
                                option.value == resource[attr.name])
73
                        "
74
                        v-model="resource[attr.name]"
75
                        @change="
76
                            attr.onChange && attr.onChange.bind(this, resource)
77
                        "
78
                    />
79
                </label>
80
            </template>
81
        </template>
82
        <template v-else-if="attr.type == 'boolean'">
83
            <label class="radio" :for="getElementId + '_yes'"
84
                >{{ $__("Yes") }}:
85
                <InputRadio
86
                    type="radio"
87
                    :name="attr.name"
88
                    :id="attr.name + '_yes'"
89
                    :value="true"
90
                    :checked="resource[attr.name] == true"
91
                    v-model="resource[attr.name]"
92
                />
93
            </label>
94
            <label class="radio" :for="getElementId + '_no'"
95
                >{{ $__("No") }}:
61
                <InputRadio
96
                <InputRadio
97
                    type="radio"
62
                    :name="attr.name"
98
                    :name="attr.name"
63
                    :id="attr.name + '_' + option.value"
99
                    :id="attr.name + '_no'"
64
                    :value="option.value"
100
                    :checked="resource[attr.name] == false"
65
                    :checked="
101
                    :value="false"
66
                        (!Object.keys(resource).includes(attr.name) &&
67
                            attr.default == option.value) ||
68
                        (Object.keys(resource).includes(attr.name) &&
69
                            option.value == resource[attr.name])
70
                    "
71
                    v-model="resource[attr.name]"
102
                    v-model="resource[attr.name]"
72
                    @change="
73
                        attr.onChange && attr.onChange.bind(this, resource)
74
                    "
75
                />
103
                />
76
            </label>
104
            </label>
77
        </template>
105
        </template>
78
    </template>
106
        <template v-else-if="attr.type == 'select'">
79
    <template v-else-if="attr.type == 'boolean'">
107
            <v-select
80
        <label class="radio" :for="getElementId + '_yes'"
108
                :id="getElementId"
81
            >{{ $__("Yes") }}:
82
            <InputRadio
83
                type="radio"
84
                :name="attr.name"
85
                :id="attr.name + '_yes'"
86
                :value="true"
87
                :checked="resource[attr.name] == true"
88
                v-model="resource[attr.name]"
109
                v-model="resource[attr.name]"
89
            />
110
                :label="attr.selectLabel"
90
        </label>
111
                :reduce="av => selectRequiredKey(av)"
91
        <label class="radio" :for="getElementId + '_no'"
112
                :options="selectOptions"
92
            >{{ $__("No") }}:
113
                :required="!resource[attr.name] && attr.required"
93
            <InputRadio
114
                :disabled="disabled"
94
                type="radio"
115
                :multiple="attr.allowMultipleChoices"
95
                :name="attr.name"
116
                @option:selected="attr.onSelected && attr.onSelected(resource)"
96
                :id="attr.name + '_no'"
117
            >
97
                :checked="resource[attr.name] == false"
118
                <template v-if="attr.required" #search="{ attributes, events }">
98
                :value="false"
119
                    <input
120
                        :required="!resource[attr.name]"
121
                        class="vs__search"
122
                        v-bind="attributes"
123
                        v-on="events"
124
                    />
125
                </template>
126
            </v-select>
127
        </template>
128
        <template v-else-if="attr.type == 'vendor'">
129
            <component
130
                :is="requiredComponent"
131
                :id="getElementId"
132
                v-bind="getComponentProps()"
133
                v-on="getEventHandlers()"
99
                v-model="resource[attr.name]"
134
                v-model="resource[attr.name]"
100
            />
135
            ></component>
101
        </label>
136
        </template>
102
    </template>
137
        <template v-else-if="attr.type == 'date'">
103
    <template v-else-if="attr.type == 'select'">
138
            <component
104
        <v-select
139
                :is="requiredComponent"
105
            :id="getElementId"
140
                :id="getElementId"
106
            v-model="resource[attr.name]"
141
                v-bind="getComponentProps()"
107
            :label="attr.selectLabel"
142
                v-on="getEventHandlers()"
108
            :reduce="av => selectRequiredKey(av)"
143
                v-model="resource[attr.name]"
109
            :options="selectOptions"
144
            ></component>
110
            :required="!resource[attr.name] && attr.required"
145
        </template>
111
            :disabled="disabled"
146
        <template v-else-if="attr.type == 'component' && attr.componentPath">
112
            :multiple="attr.allowMultipleChoices"
147
            <component
113
            @option:selected="attr.onSelected && attr.onSelected(resource)"
148
                v-if="isVModelRequired(attr.componentPath)"
149
                :is="requiredComponent"
150
                v-bind="getComponentProps()"
151
                v-model="resource[attr.name]"
152
                v-on="getEventHandlers()"
153
            ></component>
154
            <component
155
                v-else
156
                :is="requiredComponent"
157
                v-bind="getComponentProps()"
158
                v-on="getEventHandlers()"
159
            ></component>
160
        </template>
161
        <template
162
            v-else-if="attr.type == 'relationshipWidget' && attr.componentProps"
114
        >
163
        >
115
            <template v-if="attr.required" #search="{ attributes, events }">
164
            <component
116
                <input
165
                :is="requiredComponent"
117
                    :required="!resource[attr.name]"
166
                :title="attr.group ? null : attr.label"
118
                    class="vs__search"
167
                :apiClient="attr.apiClient"
119
                    v-bind="attributes"
168
                :name="attr.name"
120
                    v-on="events"
169
                v-bind="getComponentProps()"
121
                />
170
                v-on="getEventHandlers()"
122
            </template>
171
            ></component>
123
        </v-select>
172
        </template>
124
    </template>
173
        <template v-else-if="attr.type == 'relationshipSelect'">
125
    <template v-else-if="attr.type == 'vendor'">
174
            <FormRelationshipSelect
126
        <component
175
                v-bind="attr"
127
            :is="requiredComponent"
176
                :resource="resource"
128
            :id="getElementId"
177
            ></FormRelationshipSelect>
129
            v-bind="getComponentProps()"
178
        </template>
130
            v-on="getEventHandlers()"
179
        <template v-else-if="attr.type == 'additional_fields'">
131
            v-model="resource[attr.name]"
180
            <AdditionalFieldsEntry
132
        ></component>
181
                :resource="resource"
133
    </template>
182
                :additional_field_values="resource.extended_attributes"
134
    <template v-else-if="attr.type == 'date'">
183
                :extended_attributes_resource_type="
135
        <component
184
                    attr.extended_attributes_resource_type
136
            :is="requiredComponent"
185
                "
137
            :id="getElementId"
186
                @additional-fields-changed="additionalFieldsChanged"
138
            v-bind="getComponentProps()"
187
            ></AdditionalFieldsEntry>
139
            v-on="getEventHandlers()"
188
        </template>
140
            v-model="resource[attr.name]"
189
        <template v-else>
141
        ></component>
190
            <span>{{
142
    </template>
191
                $__("Programming error: unknown type %s").format(attr.type)
143
    <template v-else-if="attr.type == 'component' && attr.componentPath">
192
            }}</span>
144
        <component
193
        </template>
145
            v-if="isVModelRequired(attr.componentPath)"
194
        <ToolTip v-if="attr.toolTip" :toolTip="attr.toolTip"></ToolTip>
146
            :is="requiredComponent"
195
        <span v-if="attr.required" class="required">{{ $__("Required") }}</span>
147
            v-bind="getComponentProps()"
196
        <span style="margin-left: 5px" class="error" v-if="fieldInputError">
148
            v-model="resource[attr.name]"
197
            {{ attr.formErrorMessage }}
149
            v-on="getEventHandlers()"
198
        </span>
150
        ></component>
151
        <component
152
            v-else
153
            :is="requiredComponent"
154
            v-bind="getComponentProps()"
155
            v-on="getEventHandlers()"
156
        ></component>
157
    </template>
158
    <template
159
        v-else-if="attr.type == 'relationshipWidget' && attr.componentProps"
160
    >
161
        <component
162
            :is="requiredComponent"
163
            :title="attr.group ? null : attr.label"
164
            :apiClient="attr.apiClient"
165
            :name="attr.name"
166
            v-bind="getComponentProps()"
167
            v-on="getEventHandlers()"
168
        ></component>
169
    </template>
170
    <template v-else-if="attr.type == 'relationshipSelect'">
171
        <FormRelationshipSelect
172
            v-bind="attr"
173
            :resource="resource"
174
        ></FormRelationshipSelect>
175
    </template>
176
    <template v-else-if="attr.type == 'additional_fields'">
177
        <AdditionalFieldsEntry
178
            :resource="resource"
179
            :additional_field_values="resource.extended_attributes"
180
            :extended_attributes_resource_type="
181
                attr.extended_attributes_resource_type
182
            "
183
            @additional-fields-changed="additionalFieldsChanged"
184
        ></AdditionalFieldsEntry>
185
    </template>
186
    <template v-else>
187
        <span>{{
188
            $__("Programming error: unknown type %s").format(attr.type)
189
        }}</span>
190
    </template>
199
    </template>
191
    <ToolTip v-if="attr.toolTip" :toolTip="attr.toolTip"></ToolTip>
192
    <span v-if="attr.required" class="required">{{ $__("Required") }}</span>
193
    <span style="margin-left: 5px" class="error" v-if="fieldInputError">
194
        {{ attr.formErrorMessage }}
195
    </span>
196
</template>
200
</template>
197
201
198
<script>
202
<script>
Lines 273-279 export default { Link Here
273
                return disabledAttr || false;
277
                return disabledAttr || false;
274
            }
278
            }
275
        });
279
        });
276
280
        const display = computed(() => {
281
            const displayAttr = props.display ?? props.attr.display ?? true;
282
            if (typeof displayAttr === "function") {
283
                return displayAttr(props.resource);
284
            } else {
285
                return displayAttr || false;
286
            }
287
        });
277
        const fieldInputError = ref(false);
288
        const fieldInputError = ref(false);
278
        const checkForInputError = () => {
289
        const checkForInputError = () => {
279
            if (props.attr.formErrorHandler) {
290
            if (props.attr.formErrorHandler) {
Lines 292-297 export default { Link Here
292
            requiredComponent,
303
            requiredComponent,
293
            selectOptions,
304
            selectOptions,
294
            disabled,
305
            disabled,
306
            display,
295
            fieldInputError,
307
            fieldInputError,
296
            checkForInputError,
308
            checkForInputError,
297
        };
309
        };
(-)a/koha-tmpl/intranet-tmpl/prog/js/vue/components/SIP2/Main.vue (-4 / +16 lines)
Lines 26-38 import Breadcrumbs from "../Breadcrumbs.vue"; Link Here
26
import { storeToRefs } from "pinia";
26
import { storeToRefs } from "pinia";
27
import Help from "../Help.vue";
27
import Help from "../Help.vue";
28
import LeftMenu from "../LeftMenu.vue";
28
import LeftMenu from "../LeftMenu.vue";
29
import { APIClient } from "../../fetch/api-client.js";
29
import Dialog from "../Dialog.vue";
30
import Dialog from "../Dialog.vue";
30
import "vue-select/dist/vue-select.css";
31
import "vue-select/dist/vue-select.css";
31
32
32
export default {
33
export default {
33
    setup() {
34
    setup() {
34
        const SIP2Store = inject("SIP2Store");
35
        const SIP2Store = inject("SIP2Store");
35
        const { authorisedValues } = storeToRefs(SIP2Store);
36
        const { sysprefs, authorisedValues } = storeToRefs(SIP2Store);
36
        const { loadAuthorisedValues } = SIP2Store;
37
        const { loadAuthorisedValues } = SIP2Store;
37
38
38
        const mainStore = inject("mainStore");
39
        const mainStore = inject("mainStore");
Lines 43-51 export default { Link Here
43
44
44
        onBeforeMount(() => {
45
        onBeforeMount(() => {
45
            loading();
46
            loading();
46
            loadAuthorisedValues(authorisedValues.value, SIP2Store).then(() => {
47
            const fetchAuthorised = () => {
47
                loaded();
48
                return loadAuthorisedValues(
48
                initialized.value = true;
49
                    authorisedValues.value,
50
                    SIP2Store
51
                ).then(() => {
52
                    loaded();
53
                    initialized.value = true;
54
                });
55
            };
56
57
            const client = APIClient.sysprefs;
58
            return client.sysprefs.get("UseCashRegisters").then(result => {
59
                sysprefs.value.UseCashRegisters = result.value;
60
                return fetchAuthorised();
49
            });
61
            });
50
        });
62
        });
51
63
(-)a/koha-tmpl/intranet-tmpl/prog/js/vue/components/SIP2/SIP2AccountResource.vue (+4 lines)
Lines 20-25 export default { Link Here
20
    },
20
    },
21
    emits: ["select-resource"],
21
    emits: ["select-resource"],
22
    setup(props) {
22
    setup(props) {
23
        const SIP2Store = inject("SIP2Store");
24
        const { sysprefs } = storeToRefs(SIP2Store);
25
23
        const explodeValues = (value, delimiter) => {
26
        const explodeValues = (value, delimiter) => {
24
            if (!value) return null;
27
            if (!value) return null;
25
            return Array.isArray(value) ? value : value.split(delimiter);
28
            return Array.isArray(value) ? value : value.split(delimiter);
Lines 420-425 export default { Link Here
420
                relationshipOptionLabelAttr: "name", // attr of the related resource used for display
423
                relationshipOptionLabelAttr: "name", // attr of the related resource used for display
421
                relationshipRequiredKey: "cash_register_id",
424
                relationshipRequiredKey: "cash_register_id",
422
                hideIn: ["List"],
425
                hideIn: ["List"],
426
                display: account => sysprefs.value.UseCashRegisters == 1,
423
                group: "Details",
427
                group: "Details",
424
                toolTip: __(
428
                toolTip: __(
425
                    "Only required if system preference UseCashRegisters is enabled"
429
                    "Only required if system preference UseCashRegisters is enabled"
(-)a/koha-tmpl/intranet-tmpl/prog/js/vue/composables/base-resource.js (+1 lines)
Lines 1-6 Link Here
1
import { computed, inject, ref } from "vue";
1
import { computed, inject, ref } from "vue";
2
import { useRoute, useRouter } from "vue-router";
2
import { useRoute, useRouter } from "vue-router";
3
import { build_url } from "../composables/datatables";
3
import { build_url } from "../composables/datatables";
4
import { isRef } from "vue";
4
import { storeToRefs } from "pinia";
5
import { storeToRefs } from "pinia";
5
import {
6
import {
6
    $__,
7
    $__,
(-)a/koha-tmpl/intranet-tmpl/prog/js/vue/stores/sip2.js (-1 / +3 lines)
Lines 4-9 import { withAuthorisedValueActions } from "../composables/authorisedValues"; Link Here
4
4
5
export const useSIP2Store = defineStore("sip2", () => {
5
export const useSIP2Store = defineStore("sip2", () => {
6
    const store = reactive({
6
    const store = reactive({
7
        sysprefs: {
8
            UseCashRegisters: 0,
9
        },
7
        authorisedValues: {
10
        authorisedValues: {
8
            av_lost: "LOST",
11
            av_lost: "LOST",
9
        },
12
        },
10
- 

Return to bug 41214