diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationRulesSummary.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationRulesSummary.vue new file mode 100644 index 0000000000..8d044089f6 --- /dev/null +++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationRulesSummary.vue @@ -0,0 +1,74 @@ + + + + + diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersFormAdd.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersFormAdd.vue index e28f824b93..ec8b940206 100644 --- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersFormAdd.vue +++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersFormAdd.vue @@ -17,399 +17,76 @@ >
-
-

{{ $__("Circulation context") }}

- +
+
+
{{ alertMessage }}
+
+
+
+ +
+
+

{{ $__("Loading rule set information...") }}

-
- {{ $__("Confirm trigger context") }} -
    -
  1. - - - - - {{ $__("Required") }} -
    2. -
  2. - - - - - {{ $__("Required") }} -
    3. -
  3. - - - - - {{ $__("Required") }} -
    4. -
-
- - {{ $__("Confirm context") }} -
-
- -
-
-
-

{{ $__("Loading context...") }}

-
-
-
{{ alertMessage }}
-
-
- - {{ $__("Add new trigger") }} - {{ " " + triggerNumber }} - - - {{ $__("Edit trigger") }} {{ " " + triggerNumber }} - -
-

- {{ - $__( - "NOTE: Delay for a given trigger can be pushed forward or backwards only within the bounds of what its two neighbouring triggers allows." - ) - }} -

-
-
    -
  1. - -
    -
    - - -
    - - -
    -
    -
    -
    2. -
  2. - -
    - - {{ $__("Yes") }} - - {{ $__("No") }} - - {{ $__("Fallback to default") }} - - ({{ - fallbackRuleSet?.[ - `overdue_${triggerNumber}_restrict` - ] === "1" - ? $__("Yes") - : $__("No") - }}) - -
    -
    3. -
-
-
-

{{ $__("Loading circulation rules...") }}

+
-
- - {{ $__("Notice for trigger") }} - {{ " " + triggerNumber }} - - - {{ $__("Edit notice for trigger") }} - {{ " " + triggerNumber }} - -
    -
  1. - - - - -
    2. -
  2. - - - - - {{ $__("Required") }} -
    3. -
-
-
-

{{ $__("Loading circulation rules...") }}

+ +
+
+
@@ -432,7 +109,10 @@ import TriggersTable from "./TriggersTable.vue"; import { inject } from "vue"; import { storeToRefs } from "pinia"; import ButtonSubmit from "../../ButtonSubmit.vue"; -import TriggerContext from "./TriggerContext.vue"; +import CirculationRulesSummary from "./CirculationRulesSummary.vue"; +import ConfirmContext from "./ConfirmContext.vue"; +import EditActions from "./EditActions.vue"; +import EditNotice from "./EditNotice.vue"; import { isEqual, cloneDeep } from "lodash"; export default { @@ -445,6 +125,7 @@ export default { setEffectiveTriggerFilteredRuleSet, updateCircRuleSets, hasConflict, + scrollToElementById, } = circRulesStore; const { letters, @@ -474,6 +155,7 @@ export default { storeInitialized, canManageAnyLibrary, logged_in_library_id, + scrollToElementById, }; }, data() { @@ -524,12 +206,16 @@ export default { next(); return; } - next(vm => vm.initializeComponent()); + next(vm => vm.initializeComponent(to)); + }, + beforeRouteUpdate(to, from, next) { + next(); + this.initializeComponent(to); }, methods: { - initializeComponent() { - const { query } = this.$route; - this.setEditMode(); + initializeComponent(route) { + const { query } = route ?? this.$route; + this.setEditMode(route); this.setContext(query); this.contextInitialized = true; this.setTriggerNumber(query.triggerNumber, this.context.library_id); @@ -688,9 +374,10 @@ export default { this.context.item_type_id = query.item_type_id ?? "*"; this.context.patron_category_id = query.patron_category_id ?? "*"; }, - setEditMode() { - this.editMode = this.$route.path.substring( - this.$route.path.lastIndexOf("/") + 1 + setEditMode(route) { + const resolvedRoute = route ?? this.$route; + this.editMode = resolvedRoute.path.substring( + resolvedRoute.path.lastIndexOf("/") + 1 ); }, setRuleSetInfo() { @@ -700,6 +387,8 @@ export default { fine: this.currentRuleSet.fine, chargeperiod: this.currentRuleSet.chargeperiod, lengthunit: this.currentRuleSet.lengthunit, + renewalsallowed: this.currentRuleSet.renewalsallowed, + auto_renew: this.currentRuleSet.auto_renew, triggerCount: this.triggerCounts[this.context.library_id], }; }, @@ -715,7 +404,7 @@ export default { setTriggerNumber(triggerNumber, library_id) { this.triggerNumber = this.editMode === "edit" - ? triggerNumber + ? parseInt(triggerNumber) : (this.triggerCounts[library_id] ?? 0) + 1; }, setFallbackRuleSet() { @@ -891,20 +580,6 @@ export default { this.ruleSetToSubmit[`overdue_${this.triggerNumber}_delay`] = null; this.setAllowSubmission(); }, - async scrollToTriggerEditForm() { - let count = 0; - // ensures that the relevant section is loaded before we attempt to scroll it into view - while ( - !document.getElementById("trigger-edit-form-general-section") && - count < 8 - ) { - await new Promise(resolve => setTimeout(resolve, 250)); - count++; - } - document - .getElementById("trigger-edit-form-general-section") - .scrollIntoView({ behavior: "smooth" }); - }, }, watch: { $route: { @@ -915,7 +590,7 @@ export default { !oldVal.fullPath.includes("add") && !oldVal.fullPath.includes("edit") && oldVal.query.triggerNumber && - newVal.query.triggerNumber !== oldVal.query.triggerNumber + newVal.query.triggerNumber != oldVal.query.triggerNumber ) { this.$router.go(0); } @@ -924,11 +599,18 @@ export default { async editMode(newValue) { if (newValue === "add" || newValue === "edit") { await this.$nextTick(); - await this.scrollToTriggerEditForm(); + await this.scrollToElementById("trigger-table-form"); } }, }, - components: { TriggersTable, ButtonSubmit, TriggerContext }, + components: { + TriggersTable, + ButtonSubmit, + CirculationRulesSummary, + ConfirmContext, + EditActions, + EditNotice, + }, }; @@ -937,103 +619,6 @@ export default { max-height: 90vh; } -form li { - display: flex; - align-items: center; -} - -.numeric-input-wrapper { - position: relative; - display: inline-block; - width: 30%; -} - -.input-with-clear { - position: relative; - display: flex; - align-items: center; - width: 100%; -} - -.numeric-input { - padding-right: 40px; /* Adjust to leave space for clear button */ - padding-left: 0.25em; - padding-top: 2px; - padding-bottom: 2px; - width: 100%; - border-radius: 4px; - border: 1px solid #ccc; - font-size: 16px; - box-sizing: border-box; - transition: border-color 0.2s ease; -} - -.clear-btn { - position: absolute; - right: 22px; /* Adjust positioning */ - fill: var(--vs-controls-color); - background-color: transparent; - border: 0; - font-size: 1.2em; - color: #333; - cursor: pointer; - z-index: 2; /* Ensure it is above the input */ -} - -.button:active:hover, -.clear-btn:active:hover { - background-color: #d4d4d4; - border-color: #8c8c8c; -} - -/* Chevron buttons container */ -.chevron-buttons { - display: flex; - flex-direction: column; - position: absolute; - right: 0px; - top: 0; - bottom: 0; - width: 16px; - padding: 0px 5px 0px 2px; - justify-content: center; - z-index: 2; -} - -/* Chevron button styles */ -.increment-btn, -.decrement-btn { - background-color: transparent; - border: 0px solid #ccc; - font-size: 10px; - padding: 0px; - cursor: pointer; - color: rgba(60, 60, 60, 0.5); - border-radius: 2px; -} - -.increment-btn:hover, -.decrement-btn:hover { - background-color: #ddd; -} - -/* Hide the native increment/decrement buttons */ -input[type="number"]::-webkit-inner-spin-button, -input[type="number"]::-webkit-outer-spin-button { - -webkit-appearance: none; - margin: 0; -} - -input[type="number"] { - -moz-appearance: textfield; /* For Firefox */ -} - -.numeric-input:focus, -.numeric-input:hover { - border-color: #007bff; /* Match focus color of v-select */ - outline: none; -} - .dialog.alert fieldset:not(.bg-danger):not(.bg-warning):not(.bg-info):not( .bg-success @@ -1057,36 +642,4 @@ input[type="number"] { .modal-body { min-height: 280px; } - -#confirm-context-list { - display: flex; - gap: 20px; - height: fit-content; -} - -#confirm-context-list li { - display: flex; - flex-direction: column; - width: 320px; -} - -#confirm-context-list .v-select { - width: 100%; -} - -#confirm-context-list label { - width: 100%; - text-align: left; - padding: 0 0 4px 10px; -} - -#confirm-context-list span { - width: 100%; - align-content: right; - padding-top: 4px; -} - -#confirm-context-list :deep(.v-select ul) { - max-height: 120px; -} diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersFormConfirmReset.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersFormConfirmReset.vue index 655f00d53d..654c88ec7f 100644 --- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersFormConfirmReset.vue +++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersFormConfirmReset.vue @@ -267,7 +267,6 @@ diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersFormConfirmTriggerDelete.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersFormConfirmTriggerDelete.vue index 1b2687b20a..ae672fb0a9 100644 --- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersFormConfirmTriggerDelete.vue +++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersFormConfirmTriggerDelete.vue @@ -41,7 +41,6 @@ diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersList.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersList.vue index 9c3d5f9c3d..24e3ef8c63 100644 --- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersList.vue +++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/CirculationTriggersList.vue @@ -256,8 +256,11 @@
-
-
+
+
  • +
    +

    {{ $__("Loading context...") }}

    +
    +
    + + {{ + isConfirming + ? $__("Confirm trigger context") + : $__("Selected trigger context") + }} + +
    +
      +
    1. + + + + + {{ + $__("Required") + }} +
      2. +
    2. + + + + + {{ + $__("Required") + }} +
      3. +
    3. + + + + + {{ + $__("Required") + }} +
      4. +
    +
    +
    + + {{ $__("Confirm context") }} +
    +
    + + + + + diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/EditActions.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/EditActions.vue new file mode 100644 index 0000000000..1f06b18c37 --- /dev/null +++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/EditActions.vue @@ -0,0 +1,257 @@ + + + + + diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/EditNotice.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/EditNotice.vue new file mode 100644 index 0000000000..ef82ae006a --- /dev/null +++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/EditNotice.vue @@ -0,0 +1,124 @@ + + + diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/Main.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/Main.vue index 62f7fa1578..b1c079f35f 100644 --- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/Main.vue +++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/Main.vue @@ -30,6 +30,7 @@ export default { setup() { const circRulesStore = inject("circRulesStore"); circRulesStore.init(default_view, logged_in_library_id); + letters.sort(circRulesStore.compareLetterNames); letters.unshift({ name: "No letter", code: "", diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/TriggerContext.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/TriggerContext.vue deleted file mode 100644 index 40281bd9bb..0000000000 --- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/TriggerContext.vue +++ /dev/null @@ -1,55 +0,0 @@ - - - - - diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/TriggersTable.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/TriggersTable.vue index bd22e70ada..bff9c65fdf 100644 --- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/TriggersTable.vue +++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/Admin/CirculationTriggers/TriggersTable.vue @@ -1,284 +1,295 @@