Attachment #151797 for bug #33169

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




<template>
    <nav id="breadcrumbs" aria-label="Breadcrumb" class="breadcrumb">
        <ol>
            <template v-for="(item, idx) in breadcrumbs" v-bind:key="idx">
                <NavigationItem
                    v-if="idx < breadcrumbs.length - 1"
                    :item="item"
                    :params="params"
                ></NavigationItem>
                <NavigationItem
                    v-else
                    :item="{
                        ...item,
                        disabled: true,
                        path: undefined,
                        href: undefined,
                    }"
                    :params="params"
                ></NavigationItem>
            </template>
        </ol>
    </nav>
</template>

<script>
import { inject } from "vue"
import { storeToRefs } from "pinia"
import NavigationItem from "./NavigationItem.vue"
export default {
    name: "Breadcrumbs",
    setup: () => {
        const navigationStore = inject("navigationStore")
        const { breadcrumbs } = storeToRefs(navigationStore)
        const { params } = navigationStore
        return {
            breadcrumbs,
            params,
        }
    },
    components: {
        NavigationItem,
    },
}
</script>

<style>
#breadcrumbs .disabled {
    padding: 0.6em 0.3em;
    text-decoration: none;
    color: #000;
    pointer-events: none;
}
</style>




<template>
    <div v-if="initialized && sysprefs.ERMModule == 1">
        <div id="sub-header">
            <Breadcrumbs />
            <Help />
        </div>
        <div class="main container-fluid">

                </div>

                <div class="col-sm-2 col-sm-pull-10">
                    <LeftMenu
                        :title="$__('E-resource management')"
                        :condition="filterProviders"
                    ></LeftMenu>
                                <ul>
                                    <li>
                                        <router-link
                                            :to="{ name: 'AgreementsList' }"
                                        >
                                            <i class="fa fa-check-circle-o"></i>
                                            {{ $__("Agreements") }}</router-link
                                        >
                                    </li>
                                    <li>
                                        <router-link
                                            :to="{ name: 'LicensesList' }"
                                        >
                                            <i class="fa fa-gavel"></i>
                                            {{ $__("Licenses") }}</router-link
                                        >
                                    </li>
                                    <li>
                                        <router-link
                                            to="/cgi-bin/koha/erm/eholdings"
                                            class="disabled"
                                        >
                                            <i class="fa fa-crosshairs"></i>
                                            {{ $__("eHoldings") }}
                                        </router-link>
                                    </li>

                                    <li>
                                        <ul>
                                            <li
                                                v-for="provider in sysprefs.ERMProviders"
                                                :key="provider"
                                            >
                                                <router-link
                                                    v-if="provider == 'local'"
                                                    :to="`/cgi-bin/koha/erm/eholdings/local`"
                                                    class="disabled"
                                                >
                                                    <i
                                                        class="fa fa-map-marker"
                                                    ></i>
                                                    {{
                                                        $__("Local")
                                                    }}</router-link
                                                >
                                                <router-link
                                                    v-else-if="
                                                        provider == 'ebsco'
                                                    "
                                                    :to="`/cgi-bin/koha/erm/eholdings/ebsco`"
                                                    class="disabled"
                                                >
                                                    <i class="fa fa-globe"></i>
                                                    {{
                                                        $__("EBSCO")
                                                    }}</router-link
                                                >
                                                <ul>
                                                    <li>
                                                        <router-link
                                                            :to="`/cgi-bin/koha/erm/eholdings/${provider}/packages`"
                                                        >
                                                            <i
                                                                class="fa fa-archive"
                                                            ></i>
                                                            {{
                                                                $__("Packages")
                                                            }}</router-link
                                                        >
                                                    </li>
                                                    <li>
                                                        <router-link
                                                            :to="`/cgi-bin/koha/erm/eholdings/${provider}/titles`"
                                                        >
                                                            <i
                                                                class="fa fa-sort-alpha-asc"
                                                            ></i>
                                                            {{
                                                                $__("Titles")
                                                            }}</router-link
                                                        >
                                                    </li>
                                                </ul>
                                            </li>
                                        </ul>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </aside>
                </div>
            </div>
        </div>


<script>
import { inject } from "vue"
import Breadcrumbs from "../Breadcrumbs.vue"
import Help from "../Help.vue"
import LeftMenu from "../LeftMenu.vue"
import Dialog from "../Dialog.vue"
import { APIClient } from "../../fetch/api-client.js"
import "vue-select/dist/vue-select.css"
import { storeToRefs } from "pinia"

                this.initialized = true
            })
    },
    methods: {
        async filterProviders(navigationTree) {
            const eHoldings = navigationTree.find(
                element => element.path === "/cgi-bin/koha/erm/eholdings"
            )
            const providers = this.sysprefs.ERMProviders
            eHoldings.children = eHoldings.children.filter(element =>
                providers
                    .map(provider => `${eHoldings.path}/${provider}`)
                    .includes(element.path)
            )
            return navigationTree
        },
    },
    components: {
        Breadcrumbs,
        Dialog,
        Help,
        LeftMenu,
    },
}
</script>




<template>
    <aside>
        <div id="navmenu">
            <div id="navmenulist">
                <h5>{{ $__(title) }}</h5>
                <ul>
                    <NavigationItem
                        v-for="(item, key) in navigationTree"
                        v-bind:key="key"
                        :item="item"
                    ></NavigationItem>
                </ul>
            </div>
        </div>
    </aside>
</template>

<script>
import { inject } from "vue"
import NavigationItem from "./NavigationItem.vue"
export default {
    name: "LeftMenu",
    data() {
        return {
            navigationTree: this.leftNavigation,
        }
    },
    setup: () => {
        const navigationStore = inject("navigationStore")
        const { leftNavigation } = navigationStore
        return {
            leftNavigation,
        }
    },
    async beforeMount() {
        if (this.condition)
            this.navigationTree = await this.condition(this.navigationTree)
    },
    props: {
        title: String,
        condition: Function,
    },
    components: {
        NavigationItem,
    },
}
</script>

<style scoped>
#navmenulist a.router-link-active {
    font-weight: 700;
}
#menu ul ul,
#navmenulist ul ul {
    padding-left: 2em;
    font-size: 100%;
}

#navmenulist ul li a.disabled {
    color: #666;
    pointer-events: none;
    font-weight: 700;
}
#navmenulist ul li a.disabled.router-link-active {
    color: #000;
}
</style>




<template>
    <li>
        <span>
            <router-link
                v-if="item.name"
                :to="{ name: item.name, params }"
                :class="{ disabled: item.disabled }"
            >
                <template v-if="item.icon">
                    <i :class="`fa ${item.icon}`"></i>&nbsp;
                </template>
                <span v-if="item.title">{{ $__(item.title) }}</span>
            </router-link>
            <router-link
                v-else-if="item.path"
                :to="item.path"
                :class="{ disabled: item.disabled }"
            >
                <template v-if="item.icon">
                    <i :class="`fa ${item.icon}`"></i>&nbsp;
                </template>
                <span v-if="item.title">{{ $__(item.title) }}</span>
            </router-link>
            <a
                v-else-if="item.href"
                :href="item.href"
                :class="{ disabled: item.disabled }"
            >
                <template v-if="item.icon">
                    <i :class="`fa ${item.icon}`"></i>&nbsp;
                </template>
                <span v-if="item.title">{{ $__(item.title) }}</span>
            </a>
            <span v-else :class="{ disabled: item.disabled }">
                <template v-if="item.icon">
                    <i :class="`fa ${item.icon}`"></i>&nbsp;
                </template>
                <span class="item-last" v-if="item.title">{{
                    $__(item.title)
                }}</span>
            </span>
        </span>
        <ul v-if="item.children && item.children.length">
            <NavigationItem
                v-for="(item, key) in item.children"
                :item="item"
            ></NavigationItem>
        </ul>
    </li>
</template>

<script>
export default {
    name: "NavigationItem",
    props: {
        item: Object,
        params: Object,
    },
}
</script>

<style>
span.item-last {
    padding: 7px 3px;
}
</style>

Line 0 Link Here

(-)a/koha-tmpl/intranet-tmpl/prog/js/vue/i18n/index.js (+9 lines)
	1	export const $__ = (key) => {
	2	return window["__"](key);
	3	};
	4
	5	export default {
	6	install: (app, options) => {
	7	app.config.globalProperties.$__ = $__
	8	},
	9	};





import App from "../components/ERM/Main.vue";

import { routes as routesDef } from "../routes/erm";

const router = createRouter({
    history: createWebHistory(),
    linkActiveClass: "current",
    routes,
});

import { useMainStore } from "../stores/main";
import { useVendorStore } from "../stores/vendors";
import { useAVStore } from "../stores/authorised-values";
import { useERMStore } from "../stores/erm";
import { useNavigationStore } from "../stores/navigation";
import i18n from "../i18n";

const pinia = createPinia();

const mainStore = useMainStore(pinia);
const AVStore = useAVStore(pinia);
const navigationStore = useNavigationStore(pinia);
const routes = navigationStore.setRoutes(routesDef);

const router = createRouter({
    history: createWebHistory(),
    linkExactActiveClass: "current",
    routes,
});

const app = createApp(App);



app.config.unwrapInjectedRef = true;
app.provide("vendorStore", useVendorStore(pinia));
const mainStore = useMainStore(pinia);
app.provide("mainStore", mainStore);
const AVStore = useAVStore(pinia);
app.provide("AVStore", AVStore);
app.provide("navigationStore", navigationStore);
const ERMStore = useERMStore(pinia);
app.provide("ERMStore", ERMStore);



const { removeMessages } = mainStore;
router.beforeEach((to, from) => {
    navigationStore.$patch({current: to.matched, params: to.params||{}});
    removeMessages(); // This will actually flag the messages as displayed already
});
router.afterEach((to, from) => {




import { markRaw } from "vue";

import Home from "../components/ERM/Home.vue";
import AgreementsList from "../components/ERM/AgreementsList.vue";
import AgreementsShow from "../components/ERM/AgreementsShow.vue";

import LicensesShow from "../components/ERM/LicensesShow.vue";
import LicensesFormAdd from "../components/ERM/LicensesFormAdd.vue";

import { $__ } from "../i18n";
    home: {
        text: "Home", // $t("Home")
        path: "/cgi-bin/koha/mainpage.pl",
    },
    erm_home: {
        text: "E-resource management", // $t("E-resource management")
        path: "/cgi-bin/koha/erm/erm.pl",
    },
    agreements: {
        text: "Agreements", // $t("Agreements")
        path: "/cgi-bin/koha/erm/agreements",
    },
    eholdings: {
        home: {
            text: "eHoldings", // $t("eHoldings")
        },
        local: {
            home: {
                text: "Local", // $t("Local")
            },
            titles: {
                text: "Titles", // $t("Titles")
                path: "/cgi-bin/koha/erm/eholdings/local/titles",
            },
            packages: {
                text: "Packages", // $t("Packages")
                path: "/cgi-bin/koha/erm/eholdings/local/packages",
            },
        },
        ebsco: {
            home: {
                text: "EBSCO", // $t("EBSCO")
            },
            titles: {
                text: "Titles", // $t("Titles")
                path: "/cgi-bin/koha/erm/eholdings/ebsco/titles",
            },
            packages: {
                text: "Packages", // $t("Packages")
                path: "/cgi-bin/koha/erm/eholdings/ebsco/packages",
            },
        },
    },
    licenses: {
        text: "Licenses", // $t("Licenses")
        path: "/cgi-bin/koha/erm/licenses",
    },
};
const breadcrumb_paths = {
    agreements: [
        breadcrumbs.home,
        breadcrumbs.erm_home,
        breadcrumbs.agreements,
    ],
    eholdings: [
        breadcrumbs.home,
        breadcrumbs.erm_home,
        breadcrumbs.eholdings.home,
    ],
    eholdings_local: [
        breadcrumbs.home,
        breadcrumbs.erm_home,
        breadcrumbs.eholdings.home,
        breadcrumbs.eholdings.local.home,
    ],
    eholdings_ebsco: [
        breadcrumbs.home,
        breadcrumbs.erm_home,
        breadcrumbs.eholdings.home,
        breadcrumbs.eholdings.ebsco.home,
    ],
    licenses: [breadcrumbs.home, breadcrumbs.erm_home, breadcrumbs.licenses],
};

function build_breadcrumb(parent_breadcrumb, current) {
    let breadcrumb = parent_breadcrumb.flat(Infinity);
    if (current) {
        breadcrumb.push({
            text: current,
        });
    }
    return breadcrumb;
}

export const routes = [
    {
        path: "/cgi-bin/koha/mainpage.pl",
        beforeEnter(to, from, next) {
            window.location.href = "/cgi-bin/koha/mainpage.pl";
        },
    },
    {
        path: "/cgi-bin/koha/admin/background_jobs/:id",
        is_base: true,
        beforeEnter(to, from, next) {
            window.location.href =
                "/cgi-bin/koha/admin/background_jobs.pl?op=view&id=" +

    },
    {
        path: "/cgi-bin/koha/erm/erm.pl",
        is_default: true,
        is_base: true,
        title: $__('E-resource management'),
            breadcrumb: () => [breadcrumbs.home, breadcrumbs.erm_home],
        },
    },
    {
        path: "/cgi-bin/koha/erm/agreements",
        children: [
            {
                path: "",
                name: "Home",
                component: markRaw(Home),
                is_navigation_item: false,
                    breadcrumb: () => breadcrumb_paths.agreements,
                },
            },
            {
                path: "/cgi-bin/koha/erm/agreements",
                title: $__('Agreements'),
                icon: 'fa-check-circle-o',
                is_end_node: true,
                    breadcrumb: () =>
                        build_breadcrumb(
                            breadcrumb_paths.agreements,
                            "Show agreement" // $t("Show agreement")
                        ),
                },
            },
            {
                path: "add",
                name: "AgreementsFormAdd",
                component: AgreementsFormAdd,
                meta: {
                    breadcrumb: () =>
                        build_breadcrumb(
                            breadcrumb_paths.agreements,
                            "Add agreement" // $t("Add agreement")
                        ),
                },
            },
            {
                path: "edit/:agreement_id",
                name: "AgreementsFormAddEdit",
                component: AgreementsFormAdd,
                meta: {
                    breadcrumb: () =>
                        build_breadcrumb(
                            breadcrumb_paths.agreements,
                            "Edit agreement" // $t("Edit agreement")
                        ),
                },
            },
        ],
    },
    {
        path: "/cgi-bin/koha/erm/eholdings",
        meta: {
            breadcrumb: () => breadcrumb_paths.eholdings,
        },
        children: [
            {
                path: "",
                meta: {
                    breadcrumb: () => breadcrumb_paths.eholdings,
                },
            },
            {
                path: "local",
                children: [
                    {
                        path: "",
                        name: "AgreementsList",
                        component: markRaw(AgreementsList),
                        },
                    },
                    {
                        path: ":agreement_id",
                        name: "AgreementsShow",
                        component: markRaw(AgreementsShow),
                        title: $__('Show agreement'),
                                name: "EHoldingsLocalPackagesList",
                                component: EHoldingsLocalPackagesList,
                                meta: {
                                    breadcrumb: () =>
                                        build_breadcrumb([
                                            breadcrumb_paths.eholdings_local,
                                            breadcrumbs.eholdings.local
                                                .packages,
                                        ]),
                                },
                            },
                            {
                                path: ":package_id",
                                name: "EHoldingsLocalPackagesShow",
                                component: EHoldingsLocalPackagesShow,
                                meta: {
                                    breadcrumb: () =>
                                        build_breadcrumb(
                                            [
                                                breadcrumb_paths.eholdings_local,
                                                breadcrumbs.eholdings.local
                                                    .packages,
                                            ],
                                            "Show package" // $t("Show package")
                                        ),
                                },
                            },
                            {
                                path: "add",
                                name: "EHoldingsLocalPackagesFormAdd",
                                component: EHoldingsLocalPackagesFormAdd,
                                meta: {
                                    breadcrumb: () =>
                                        build_breadcrumb(
                                            [
                                                breadcrumb_paths.eholdings_local,
                                                breadcrumbs.eholdings.local
                                                    .packages,
                                            ],
                                            "Add package" // $t("Add package")
                                        ),
                                },
                            },
                            {
                                path: "edit/:package_id",
                                name: "EHoldingsLocalPackagesFormAddEdit",
                                component: EHoldingsLocalPackagesFormAdd,
                                meta: {
                                    breadcrumb: () =>
                                        build_breadcrumb(
                                            [
                                                breadcrumb_paths.eholdings_local,
                                                breadcrumbs.eholdings.local
                                                    .packages,
                                            ],
                                            "Edit package" // $t("Edit package")
                                        ),
                                },
                            },
                        ],
                    },
                    {
                        path: "add",
                        name: "AgreementsFormAdd",
                        component: markRaw(AgreementsFormAdd),
                        title: $__('Add agreement'),
                                name: "EHoldingsLocalTitlesList",
                                component: EHoldingsLocalTitlesList,
                                meta: {
                                    breadcrumb: () =>
                                        build_breadcrumb([
                                            breadcrumb_paths.eholdings_local,
                                            breadcrumbs.eholdings.local.titles,
                                        ]),
                                },
                            },
                            {
                                path: ":title_id",
                                name: "EHoldingsLocalTitlesShow",
                                component: EHoldingsLocalTitlesShow,
                                meta: {
                                    breadcrumb: () =>
                                        build_breadcrumb(
                                            [
                                                breadcrumb_paths.eholdings_local,
                                                breadcrumbs.eholdings.local
                                                    .titles,
                                            ],
                                            "Show title" // $t("Show title")
                                        ),
                                },
                            },
                            {
                                path: "add",
                                name: "EHoldingsLocalTitlesFormAdd",
                                component: EHoldingsLocalTitlesFormAdd,
                                meta: {
                                    breadcrumb: () =>
                                        build_breadcrumb(
                                            [
                                                breadcrumb_paths.eholdings_local,
                                                breadcrumbs.eholdings.local
                                                    .titles,
                                            ],
                                            "Add title" // $t("Add title")
                                        ),
                                },
                            },
                            {
                                path: "edit/:title_id",
                                name: "EHoldingsLocalTitlesFormAddEdit",
                                component: EHoldingsLocalTitlesFormAdd,
                                meta: {
                                    breadcrumb: () =>
                                        build_breadcrumb(
                                            [
                                                breadcrumb_paths.eholdings_local,
                                                breadcrumbs.eholdings.local
                                                    .titles,
                                            ],
                                            "Edit title" // $t("Edit title")
                                        ),
                                },
                            },
                            {
                                path: "import",
                                name: "EHoldingsLocalTitlesFormImport",
                                component: EHoldingsLocalTitlesFormImport,
                                meta: {
                                    breadcrumb: () =>
                                        build_breadcrumb(
                                            [
                                                breadcrumb_paths.eholdings_local,
                                                breadcrumbs.eholdings.local
                                                    .titles,
                                            ],
                                            "Import from a list" // $t("Import from a list")
                                        ),
                                },
                            },
                        ],
                    },
                    {
                        path: "edit/:agreement_id",
                        name: "AgreementsFormAddEdit",
                        component: markRaw(AgreementsFormAdd),
                        title: $__('Edit agreement'),
                            breadcrumb: () =>
                                build_breadcrumb(
                                    [
                                        breadcrumb_paths.eholdings_local,
                                        breadcrumbs.eholdings.local.titles,
                                    ],
                                    "Resource" // $t("Resource")
                                ),
                        },
                    },
                ],
            },
            {
                path: "/cgi-bin/koha/erm/licenses",
                title: $__('Licenses'),
                icon: "fa-gavel",
                is_end_node: true,
                children: [
                    {
                        path: "",
                        name: "LicensesList",
                        component: markRaw(LicensesList),
                    },
                    {
                        path: ":license_id",
                        name: "LicensesShow",
                        component: markRaw(LicensesShow),
                        title: $__('Show license'),
                    },
                    {
                        path: "add",
                        name: "LicensesFormAdd",
                        component: markRaw(LicensesFormAdd),
                        title: $__('Add license'),
                    },
                    {
                        path: "edit/:license_id",
                        name: "LicensesFormAddEdit",
                        component: markRaw(LicensesFormAdd),
                        title: $__('Edit license'),
                    },
                ],
            },
            {
                path: "/cgi-bin/koha/erm/eholdings",
                title: $__('eHoldings'),
                icon: 'fa-crosshairs',
                disabled: true,
                children: [
                    {
                        path: "local",
                        title: $__('Local'),
                        icon: "fa-map-marker",
                        disabled: true,
                        children: [
                            {
                                path: "packages",
                                title: $__('Packages'),
                                icon: "fa-archive",
                                is_end_node: true,
                                children: [
                                    {
                                        path: "",
                                        name: "EHoldingsLocalPackagesList",
                                        component: markRaw(EHoldingsLocalPackagesList),
                                    },
                                    {
                                        path: ":package_id",
                                        name: "EHoldingsLocalPackagesShow",
                                        component: markRaw(EHoldingsLocalPackagesShow),
                                        title: $__('Show package'),
                                    },
                                    {
                                        path: "add",
                                        name: "EHoldingsLocalPackagesFormAdd",
                                        component: markRaw(EHoldingsLocalPackagesFormAdd),
                                        title: $__('Add package'),
                                    },
                                    {
                                        path: "edit/:package_id",
                                        name: "EHoldingsLocalPackagesFormAddEdit",
                                        component: markRaw(EHoldingsLocalPackagesFormAdd),
                                        title: $__('Edit package'),
                                    },
                                ],
                            },
                            {
                                path: "titles",
                                title: $__('Titles'),
                                icon: "fa-sort-alpha-asc",
                                is_end_node: true,
                                children: [
                                    {
                                        path: "",
                                        name: "EHoldingsLocalTitlesList",
                                        component: markRaw(EHoldingsLocalTitlesList),
                                    },
                                    {
                                        path: ":title_id",
                                        name: "EHoldingsLocalTitlesShow",
                                        component: markRaw(EHoldingsLocalTitlesShow),
                                        title: $__('Show title'),
                                    },
                                    {
                                        path: "add",
                                        name: "EHoldingsLocalTitlesFormAdd",
                                        component: markRaw(EHoldingsLocalTitlesFormAdd),
                                        title: $__('Add title'),
                                    },
                                    {
                                        path: "edit/:title_id",
                                        name: "EHoldingsLocalTitlesFormAddEdit",
                                        component: markRaw(EHoldingsLocalTitlesFormAdd),
                                        title: $__('Edit title'),
                                    },
                                    {
                                        path: "import",
                                        name: "EHoldingsLocalTitlesFormImport",
                                        component: markRaw(EHoldingsLocalTitlesFormImport),
                                        title: $__('Import from a list'),
                                    },
                                    {
                                        path: "/cgi-bin/koha/erm/eholdings/local/resources/:resource_id",
                                        name: "EHoldingsLocalResourcesShow",
                                        component: markRaw(EHoldingsLocalResourcesShow),
                                        title: $__('Resource'),
                                    },
                                ],
                            },
                        ],
                    },
                    {
                        path: "ebsco",
                        title: $__('EBSCO'),
                        icon: 'fa-globe',
                        disabled: true,
                        children: [
                            {
                                path: "packages",
                                title: $__('Packages'),
                                icon: "fa-archive",
                                is_end_node: true,
                                children: [
                                    {
                                        path: "",
                                        name: "EHoldingsEBSCOPackagesList",
                                        component: markRaw(EHoldingsEBSCOPackagesList),
                                    },
                                    {
                                        path: ":package_id",
                                        name: "EHoldingsEBSCOPackagesShow",
                                        component: markRaw(EHoldingsEBSCOPackagesShow),
                                        title: $__('Show package'),
                                    },
                                ],
                            },
                            {
                                path: "titles",
                                title: $__('Titles'),
                                icon: "fa-sort-alpha-asc",
                                is_end_node: true,
                                children: [
                                    {
                                        path: "",
                                        name: "EHoldingsEBSCOTitlesList",
                                        component: markRaw(EHoldingsEBSCOTitlesList),
                                    },
                                    {
                                        path: ":title_id",
                                        name: "EHoldingsEBSCOTitlesShow",
                                        component: markRaw(EHoldingsEBSCOTitlesShow),
                                        title: $__('Show title'),
                                    },
                                    {
                                        path: "/cgi-bin/koha/erm/eholdings/ebsco/resources/:resource_id",
                                        name: "EHoldingsEBSCOResourcesShow",
                                        component: markRaw(EHoldingsEBSCOResourcesShow),
                                        title: $__('Resource'),
                                        is_navigation_item: false,
                                    },
                                ],
                            },
                        ],
                    },
                    {
                        path: "resources/:resource_id",
                        name: "EHoldingsEBSCOResourcesShow",
                        component: EHoldingsEBSCOResourcesShow,
                        meta: {
                            breadcrumb: () =>
                                build_breadcrumb(
                                    [
                                        breadcrumb_paths.eholdings_ebsco,
                                        breadcrumbs.eholdings.ebsco.titles,
                                    ],
                                    "Resource" // $t("Resource")
                                ),
                        },
                    },
                ],
            },
        ]
    },
    {
        path: "/cgi-bin/koha/erm/licenses",
        children: [
            {
                path: "",
                name: "LicensesList",
                component: LicensesList,
                meta: {
                    breadcrumb: () => breadcrumb_paths.licenses,
                },
            },
            {
                path: ":license_id",
                name: "LicensesShow",
                component: LicensesShow,
                meta: {
                    breadcrumb: () =>
                        build_breadcrumb(
                            breadcrumb_paths.licenses,
                            "Show license" // $t("Show license")
                        ),
                },
            },
            {
                path: "add",
                name: "LicensesFormAdd",
                component: LicensesFormAdd,
                meta: {
                    breadcrumb: () =>
                        build_breadcrumb(
                            breadcrumb_paths.licenses,
                            "Add license" // $t("Add license")
                        ),
                },
            },
            {
                path: "edit/:license_id",
                name: "LicensesFormAddEdit",
                component: LicensesFormAdd,
                meta: {
                    breadcrumb: () =>
                        build_breadcrumb(
                            breadcrumb_paths.licenses,
                            "Edit license" // $t("Edit license")
                        ),
                },
            },
        ],
    },
];




import {
    defineStore
} from "pinia";

export const useNavigationStore = defineStore("navigation", {
    state: () => ({
        routeState: {
            alt: "Home",
            href: "/cgi-bin/koha/mainpage.pl",
            is_navigation_item: false,
            is_base: true,
            children: []
        },
        current: null,
        params: {},
    }),
    actions: {
        setRoutes(routesDef) {
            if (!Array.isArray(routesDef)) {
                routesDef = [routesDef]
            }
            this.routeState.children = routesDef
            _traverseChildren(this.routeState)

            return this.navigationRoutes

            // Function declarations

            function _traverseChildren(parent) {
                if (isParent(parent)) {
                    parent.children.forEach(child => {
                        _setChildDefaults(parent, child);
                        _traverseChildren(child)
                    })
                }
            }

            function _setChildDefaults(parent, child) {
                child.parent = parent;
                if (isRoutable(child)) {
                    _setMetadata(child);
                }
                if (parent.children.length === 1 && parent.is_base) {
                    _setBaseAndNavigationDefaults(child, {
                        is_base: true,
                        is_navigation_item: false
                    });
                } else {
                    _setBaseAndNavigationDefaults(child, {
                        is_base: false,
                        is_navigation_item: true
                    });
                }
            }

            function _setBaseAndNavigationDefaults(child, {
                is_base,
                is_navigation_item
            }) {
                child.is_base = child.is_base !== undefined ? child.is_base : is_base;
                child.is_navigation_item = child.is_navigation_item !== undefined ? child.is_navigation_item : is_navigation_item;
            }

            function _setMetadata(child) {
                if (!child.meta)
                    child.meta = {};
                child.meta.self = child;
            }
        }
    },
    getters: {
        breadcrumbs() {
            if (this.current)
                return _buildFromCurrentMatches(this.current, this.routeState)

            return _getBaseElements(this.routeState)

            // Function declarations

            function _getBaseElements(parent) {
                if (!parent.is_base) return []
                let next = {}
                if (isParent(parent)) {
                    next = _defineNextElement(parent)
                }
                return [{
                    ...parent,
                    children: null
                }, ..._getBaseElements(next)]
            }

            function _defineNextElement(parent) {
                return parent.children.find(child => child.is_default) || parent.children[0];
            }

            function _buildFromCurrentMatches(currentMatches, routeState) {
                return [
                    {
                        ...routeState,
                        icon: null,
                        children: null
                    },
                    ..._mapMatches(currentMatches)
                ];
            }

            function _isBaseOrNotStub(child) {
                return child.is_base || (child.path && child.path !== '');
            }

            function _mapMatches(currentMatches) {
                return currentMatches
                    .filter((match) => _isBaseOrNotStub(match.meta.self))
                    .map((match) => ({
                        ...match.meta.self,
                        icon: null,
                        path: match.path,
                        children: null
                    }));
            }

        },
        leftNavigation() {
            return _getNavigationElements(this.routeState)

            // Function declarations

            function _getNavigationElements(parent, prevPath = '') {
                if (_isBaseAndNoChildren(parent)) return [];
                if (parent.is_base)
                    return _buildChildNavigationElements(parent).flat(Infinity)

                const builtPath = _buildPath(prevPath, parent);

                let children = []
                if (!parent.is_end_node && isParent(parent)) {
                    children = _buildChildNavigationElements(parent, builtPath)
                }

                return {
                    ...parent,
                    path: builtPath ? builtPath : parent.path,
                    children
                }
            }

            function _buildPath(prevPath, element) {
                let builtPath;

                if (isRoutable(element) && isAbsolutePath(element.path)) {
                    builtPath = element.path;
                } else {
                    if (prevPath)
                        builtPath = '' + prevPath + addSlashIfNotPresent(prevPath);
                    if (isRoutable(element))
                        builtPath = '' + builtPath + element.path;
                }

                return builtPath;
            }

            function _buildChildNavigationElements(parent, builtPath) {
                return parent.children
                    .filter(child => child.is_base || child.is_navigation_item)
                    .map(child => _getNavigationElements(child, builtPath));
            }

            function _isBaseAndNoChildren(parent) {
                return parent.is_base && (!parent.children || !parent.children.length);
            }
        },
        navigationRoutes() {
            let routes = _toRoute(this.routeState)
            return Array.isArray(routes) ? routes : [routes]

            // Function declarations

            function _toRoute(parent) {
                if (!isRoutable(parent))
                    return _getRoutableChildren(parent)
                return parent
            }

            function _getRoutableChildren(parent) {
                return parent.children
                    .map(child => _toRoute(child))
                    .flat(Infinity);
            }
        }
    }
})

function addSlashIfNotPresent(path) {
    return /\/$/.test(path) ? '' : '/';
}

function isRoutable(element) {
    return element.path !== undefined || element.name !== undefined;
}

function isParent(parent) {
    return parent.children && parent.children.length;
}

function isAbsolutePath(path) {
    return /^\//.test(path);
}

Return to bug 33169

Lines 17-44 library.add(faPlus, faMinus, faPencil, faTrash, faSpinner); Link Here

(-)a/koha-tmpl/intranet-tmpl/prog/js/vue/modules/erm.ts (-16 / +15 lines)
17		17
18	import App from "../components/ERM/Main.vue";	18	import App from "../components/ERM/Main.vue";
19		19
20	import { routes } from "../routes/erm";	20	import { routes as routesDef } from "../routes/erm";
21
22	const router = createRouter({
23	history: createWebHistory(),
24	linkActiveClass: "current",
25	routes,
26	});
27		21
28	import { useMainStore } from "../stores/main";	22	import { useMainStore } from "../stores/main";
29	import { useVendorStore } from "../stores/vendors";	23	import { useVendorStore } from "../stores/vendors";
30	import { useAVStore } from "../stores/authorised-values";	24	import { useAVStore } from "../stores/authorised-values";
31	import { useERMStore } from "../stores/erm";	25	import { useERMStore } from "../stores/erm";
		26	import { useNavigationStore } from "../stores/navigation";
		27	import i18n from "../i18n";
32		28
33	const pinia = createPinia();	29	const pinia = createPinia();
34		30
35	const i18n = {	31	const mainStore = useMainStore(pinia);
36	install: (app, options) => {	32	const AVStore = useAVStore(pinia);
37	app.config.globalProperties.$__ = key => {	33	const navigationStore = useNavigationStore(pinia);
38	return window["__"](key);	34	const routes = navigationStore.setRoutes(routesDef);
39	};	35
40	},	36	const router = createRouter({
41	};	37	history: createWebHistory(),
		38	linkExactActiveClass: "current",
		39	routes,
		40	});
42		41
43	const app = createApp(App);	42	const app = createApp(App);
44		43
Lines 51-60 const rootComponent = app Link Here
51		50
52	app.config.unwrapInjectedRef = true;	51	app.config.unwrapInjectedRef = true;
53	app.provide("vendorStore", useVendorStore(pinia));	52	app.provide("vendorStore", useVendorStore(pinia));
54	const mainStore = useMainStore(pinia);
55	app.provide("mainStore", mainStore);	53	app.provide("mainStore", mainStore);
56	const AVStore = useAVStore(pinia);
57	app.provide("AVStore", AVStore);	54	app.provide("AVStore", AVStore);
		55	app.provide("navigationStore", navigationStore);
58	const ERMStore = useERMStore(pinia);	56	const ERMStore = useERMStore(pinia);
59	app.provide("ERMStore", ERMStore);	57	app.provide("ERMStore", ERMStore);
60		58
Lines 62-67 app.mount("#erm"); Link Here
62		60
63	const { removeMessages } = mainStore;	61	const { removeMessages } = mainStore;
64	router.beforeEach((to, from) => {	62	router.beforeEach((to, from) => {
		63	navigationStore.$patch({current: to.matched, params: to.params\|\|{}});
65	removeMessages(); // This will actually flag the messages as displayed already	64	removeMessages(); // This will actually flag the messages as displayed already
66	});	65	});
67	router.afterEach((to, from) => {	66	router.afterEach((to, from) => {

Line 0 Link Here

(-)a/koha-tmpl/intranet-tmpl/prog/js/vue/components/Breadcrumbs.vue (+53 lines)
	1	<template>
	2	<nav id="breadcrumbs" aria-label="Breadcrumb" class="breadcrumb">
	3	<ol>
	4	<template v-for="(item, idx) in breadcrumbs" v-bind:key="idx">
	5	<NavigationItem
	6	v-if="idx < breadcrumbs.length - 1"
	7	:item="item"
	8	:params="params"
	9	></NavigationItem>
	10	<NavigationItem
	11	v-else
	12	:item="{
	13	...item,
	14	disabled: true,
	15	path: undefined,
	16	href: undefined,
	17	}"
	18	:params="params"
	19	></NavigationItem>
	20	</template>
	21	</ol>
	22	</nav>
	23	</template>
	24
	25	<script>
	26	import { inject } from "vue"
	27	import { storeToRefs } from "pinia"
	28	import NavigationItem from "./NavigationItem.vue"
	29	export default {
	30	name: "Breadcrumbs",
	31	setup: () => {
	32	const navigationStore = inject("navigationStore")
	33	const { breadcrumbs } = storeToRefs(navigationStore)
	34	const { params } = navigationStore
	35	return {
	36	breadcrumbs,
	37	params,
	38	}
	39	},
	40	components: {
	41	NavigationItem,
	42	},
	43	}
	44	</script>
	45
	46	<style>
	47	#breadcrumbs .disabled {
	48	padding: 0.6em 0.3em;
	49	text-decoration: none;
	50	color: #000;
	51	pointer-events: none;
	52	}
	53	</style>

Line 0 Link Here

(-)a/koha-tmpl/intranet-tmpl/prog/js/vue/components/LeftMenu.vue (+67 lines)
		1	<template>
		2	<aside>
		3	<div id="navmenu">
		4	<div id="navmenulist">
		5	<h5>{{ $__(title) }}</h5>
		6	<ul>
		7	<NavigationItem
		8	v-for="(item, key) in navigationTree"
		9	v-bind:key="key"
		10	:item="item"
		11	></NavigationItem>
		12	</ul>
		13	</div>
		14	</div>
		15	</aside>
		16	</template>
		17
		18	<script>
		19	import { inject } from "vue"
		20	import NavigationItem from "./NavigationItem.vue"
		21	export default {
		22	name: "LeftMenu",
		23	data() {
		24	return {
		25	navigationTree: this.leftNavigation,
		26	}
		27	},
		28	setup: () => {
		29	const navigationStore = inject("navigationStore")
		30	const { leftNavigation } = navigationStore
		31	return {
		32	leftNavigation,
		33	}
		34	},
		35	async beforeMount() {
		36	if (this.condition)
		37	this.navigationTree = await this.condition(this.navigationTree)
		38	},
		39	props: {
		40	title: String,
		41	condition: Function,
		42	},
		43	components: {
		44	NavigationItem,
		45	},
		46	}
		47	</script>
		48
		49	<style scoped>
		50	#navmenulist a.router-link-active {
		51	font-weight: 700;
		52	}
		53	#menu ul ul,
		54	#navmenulist ul ul {
		55	padding-left: 2em;
		56	font-size: 100%;
		57	}
		58
		59	#navmenulist ul li a.disabled {
		60	color: #666;
		61	pointer-events: none;
		62	font-weight: 700;
		63	}
		64	#navmenulist ul li a.disabled.router-link-active {
65	color: #000;
66	}
67	</style>

Line 0 Link Here

(-)a/koha-tmpl/intranet-tmpl/prog/js/vue/components/NavigationItem.vue (+66 lines)
		1	<template>
		2	<li>
		3	<span>
		4	<router-link
		5	v-if="item.name"
		6	:to="{ name: item.name, params }"
		7	:class="{ disabled: item.disabled }"
		8	>
		9	<template v-if="item.icon">
		10	<i :class="`fa ${item.icon}`"></i>
		11	</template>
		12	<span v-if="item.title">{{ $__(item.title) }}</span>
		13	</router-link>
		14	<router-link
		15	v-else-if="item.path"
		16	:to="item.path"
		17	:class="{ disabled: item.disabled }"
		18	>
		19	<template v-if="item.icon">
		20	<i :class="`fa ${item.icon}`"></i>
		21	</template>
		22	<span v-if="item.title">{{ $__(item.title) }}</span>
		23	</router-link>
		24	<a
		25	v-else-if="item.href"
		26	:href="item.href"
		27	:class="{ disabled: item.disabled }"
		28	>
		29	<template v-if="item.icon">
		30	<i :class="`fa ${item.icon}`"></i>
		31	</template>
		32	<span v-if="item.title">{{ $__(item.title) }}</span>
		33	</a>
		34	<span v-else :class="{ disabled: item.disabled }">
		35	<template v-if="item.icon">
		36	<i :class="`fa ${item.icon}`"></i>
		37	</template>
		38	<span class="item-last" v-if="item.title">{{
		39	$__(item.title)
		40	}}</span>
		41	</span>
		42	</span>
		43	<ul v-if="item.children && item.children.length">
		44	<NavigationItem
		45	v-for="(item, key) in item.children"
		46	:item="item"
		47	></NavigationItem>
		48	</ul>
		49	</li>
		50	</template>
		51
		52	<script>
		53	export default {
		54	name: "NavigationItem",
		55	props: {
		56	item: Object,
		57	params: Object,
		58	},
		59	}
		60	</script>
		61
		62	<style>
		63	span.item-last {
		64	padding: 7px 3px;
65	}
66	</style>

Lines 1-3 Link Here

(-)a/koha-tmpl/intranet-tmpl/prog/js/vue/routes/erm.js (-433 / +180 lines)
		1	import { markRaw } from "vue";
		2
1	import Home from "../components/ERM/Home.vue";	3	import Home from "../components/ERM/Home.vue";
2	import AgreementsList from "../components/ERM/AgreementsList.vue";	4	import AgreementsList from "../components/ERM/AgreementsList.vue";
3	import AgreementsShow from "../components/ERM/AgreementsShow.vue";	5	import AgreementsShow from "../components/ERM/AgreementsShow.vue";
Lines 19-118 import LicensesList from "../components/ERM/LicensesList.vue"; Link Here
19	import LicensesShow from "../components/ERM/LicensesShow.vue";	21	import LicensesShow from "../components/ERM/LicensesShow.vue";
20	import LicensesFormAdd from "../components/ERM/LicensesFormAdd.vue";	22	import LicensesFormAdd from "../components/ERM/LicensesFormAdd.vue";
21		23
22	const breadcrumbs = {	24	import { $__ } from "../i18n";
23	home: {
24	text: "Home", // $t("Home")
25	path: "/cgi-bin/koha/mainpage.pl",
26	},
27	erm_home: {
28	text: "E-resource management", // $t("E-resource management")
29	path: "/cgi-bin/koha/erm/erm.pl",
30	},
31	agreements: {
32	text: "Agreements", // $t("Agreements")
33	path: "/cgi-bin/koha/erm/agreements",
34	},
35	eholdings: {
36	home: {
37	text: "eHoldings", // $t("eHoldings")
38	},
39	local: {
40	home: {
41	text: "Local", // $t("Local")
42	},
43	titles: {
44	text: "Titles", // $t("Titles")
45	path: "/cgi-bin/koha/erm/eholdings/local/titles",
46	},
47	packages: {
48	text: "Packages", // $t("Packages")
49	path: "/cgi-bin/koha/erm/eholdings/local/packages",
50	},
51	},
52	ebsco: {
53	home: {
54	text: "EBSCO", // $t("EBSCO")
55	},
56	titles: {
57	text: "Titles", // $t("Titles")
58	path: "/cgi-bin/koha/erm/eholdings/ebsco/titles",
59	},
60	packages: {
61	text: "Packages", // $t("Packages")
62	path: "/cgi-bin/koha/erm/eholdings/ebsco/packages",
63	},
64	},
65	},
66	licenses: {
67	text: "Licenses", // $t("Licenses")
68	path: "/cgi-bin/koha/erm/licenses",
69	},
70	};
71	const breadcrumb_paths = {
72	agreements: [
73	breadcrumbs.home,
74	breadcrumbs.erm_home,
75	breadcrumbs.agreements,
76	],
77	eholdings: [
78	breadcrumbs.home,
79	breadcrumbs.erm_home,
80	breadcrumbs.eholdings.home,
81	],
82	eholdings_local: [
83	breadcrumbs.home,
84	breadcrumbs.erm_home,
85	breadcrumbs.eholdings.home,
86	breadcrumbs.eholdings.local.home,
87	],
88	eholdings_ebsco: [
89	breadcrumbs.home,
90	breadcrumbs.erm_home,
91	breadcrumbs.eholdings.home,
92	breadcrumbs.eholdings.ebsco.home,
93	],
94	licenses: [breadcrumbs.home, breadcrumbs.erm_home, breadcrumbs.licenses],
95	};
96
97	function build_breadcrumb(parent_breadcrumb, current) {
98	let breadcrumb = parent_breadcrumb.flat(Infinity);
99	if (current) {
100	breadcrumb.push({
101	text: current,
102	});
103	}
104	return breadcrumb;
105	}
106		25
107	export const routes = [	26	export const routes = [
108	{
109	path: "/cgi-bin/koha/mainpage.pl",
110	beforeEnter(to, from, next) {
111	window.location.href = "/cgi-bin/koha/mainpage.pl";
112	},
113	},
114	{	27	{
115	path: "/cgi-bin/koha/admin/background_jobs/:id",	28	path: "/cgi-bin/koha/admin/background_jobs/:id",
		29	is_base: true,
116	beforeEnter(to, from, next) {	30	beforeEnter(to, from, next) {
117	window.location.href =	31	window.location.href =
118	"/cgi-bin/koha/admin/background_jobs.pl?op=view&id=" +	32	"/cgi-bin/koha/admin/background_jobs.pl?op=view&id=" +
Lines 121-508 export const routes = [ Link Here
121	},	35	},
122	{	36	{
123	path: "/cgi-bin/koha/erm/erm.pl",	37	path: "/cgi-bin/koha/erm/erm.pl",
124	name: "Home",	38	is_default: true,
125	component: Home,	39	is_base: true,
126	meta: {	40	title: $__('E-resource management'),
127	breadcrumb: () => [breadcrumbs.home, breadcrumbs.erm_home],
128	},
129	},
130	{
131	path: "/cgi-bin/koha/erm/agreements",
132	children: [	41	children: [
133	{	42	{
134	path: "",	43	path: "",
135	name: "AgreementsList",	44	name: "Home",
136	component: AgreementsList,	45	component: markRaw(Home),
137	meta: {	46	is_navigation_item: false,
138	breadcrumb: () => breadcrumb_paths.agreements,
139	},
140	},	47	},
141	{	48	{
142	path: ":agreement_id",	49	path: "/cgi-bin/koha/erm/agreements",
143	name: "AgreementsShow",	50	title: $__('Agreements'),
144	component: AgreementsShow,	51	icon: 'fa-check-circle-o',
145	meta: {	52	is_end_node: true,
146	breadcrumb: () =>
147	build_breadcrumb(
148	breadcrumb_paths.agreements,
149	"Show agreement" // $t("Show agreement")
150	),
151	},
152	},
153	{
154	path: "add",
155	name: "AgreementsFormAdd",
156	component: AgreementsFormAdd,
157	meta: {
158	breadcrumb: () =>
159	build_breadcrumb(
160	breadcrumb_paths.agreements,
161	"Add agreement" // $t("Add agreement")
162	),
163	},
164	},
165	{
166	path: "edit/:agreement_id",
167	name: "AgreementsFormAddEdit",
168	component: AgreementsFormAdd,
169	meta: {
170	breadcrumb: () =>
171	build_breadcrumb(
172	breadcrumb_paths.agreements,
173	"Edit agreement" // $t("Edit agreement")
174	),
175	},
176	},
177	],
178	},
179	{
180	path: "/cgi-bin/koha/erm/eholdings",
181	meta: {
182	breadcrumb: () => breadcrumb_paths.eholdings,
183	},
184	children: [
185	{
186	path: "",
187	meta: {
188	breadcrumb: () => breadcrumb_paths.eholdings,
189	},
190	},
191	{
192	path: "local",
193	children: [	53	children: [
194	{	54	{
195	path: "",	55	path: "",
196	meta: {	56	name: "AgreementsList",
197	breadcrumb: () => breadcrumb_paths.eholdings_local,	57	component: markRaw(AgreementsList),
198	},
199	},	58	},
200	{	59	{
201	path: "packages",	60	path: ":agreement_id",
202	children: [	61	name: "AgreementsShow",
203	{	62	component: markRaw(AgreementsShow),
204	path: "",	63	title: $__('Show agreement'),
205	name: "EHoldingsLocalPackagesList",
206	component: EHoldingsLocalPackagesList,
207	meta: {
208	breadcrumb: () =>
209	build_breadcrumb([
210	breadcrumb_paths.eholdings_local,
211	breadcrumbs.eholdings.local
212	.packages,
213	]),
214	},
215	},
216	{
217	path: ":package_id",
218	name: "EHoldingsLocalPackagesShow",
219	component: EHoldingsLocalPackagesShow,
220	meta: {
221	breadcrumb: () =>
222	build_breadcrumb(
223	[
224	breadcrumb_paths.eholdings_local,
225	breadcrumbs.eholdings.local
226	.packages,
227	],
228	"Show package" // $t("Show package")
229	),
230	},
231	},
232	{
233	path: "add",
234	name: "EHoldingsLocalPackagesFormAdd",
235	component: EHoldingsLocalPackagesFormAdd,
236	meta: {
237	breadcrumb: () =>
238	build_breadcrumb(
239	[
240	breadcrumb_paths.eholdings_local,
241	breadcrumbs.eholdings.local
242	.packages,
243	],
244	"Add package" // $t("Add package")
245	),
246	},
247	},
248	{
249	path: "edit/:package_id",
250	name: "EHoldingsLocalPackagesFormAddEdit",
251	component: EHoldingsLocalPackagesFormAdd,
252	meta: {
253	breadcrumb: () =>
254	build_breadcrumb(
255	[
256	breadcrumb_paths.eholdings_local,
257	breadcrumbs.eholdings.local
258	.packages,
259	],
260	"Edit package" // $t("Edit package")
261	),
262	},
263	},
264	],
265	},	64	},
266	{	65	{
267	path: "titles",	66	path: "add",
268	children: [	67	name: "AgreementsFormAdd",
269	{	68	component: markRaw(AgreementsFormAdd),
270	path: "",	69	title: $__('Add agreement'),
271	name: "EHoldingsLocalTitlesList",
272	component: EHoldingsLocalTitlesList,
273	meta: {
274	breadcrumb: () =>
275	build_breadcrumb([
276	breadcrumb_paths.eholdings_local,
277	breadcrumbs.eholdings.local.titles,
278	]),
279	},
280	},
281	{
282	path: ":title_id",
283	name: "EHoldingsLocalTitlesShow",
284	component: EHoldingsLocalTitlesShow,
285	meta: {
286	breadcrumb: () =>
287	build_breadcrumb(
288	[
289	breadcrumb_paths.eholdings_local,
290	breadcrumbs.eholdings.local
291	.titles,
292	],
293	"Show title" // $t("Show title")
294	),
295	},
296	},
297	{
298	path: "add",
299	name: "EHoldingsLocalTitlesFormAdd",
300	component: EHoldingsLocalTitlesFormAdd,
301	meta: {
302	breadcrumb: () =>
303	build_breadcrumb(
304	[
305	breadcrumb_paths.eholdings_local,
306	breadcrumbs.eholdings.local
307	.titles,
308	],
309	"Add title" // $t("Add title")
310	),
311	},
312	},
313	{
314	path: "edit/:title_id",
315	name: "EHoldingsLocalTitlesFormAddEdit",
316	component: EHoldingsLocalTitlesFormAdd,
317	meta: {
318	breadcrumb: () =>
319	build_breadcrumb(
320	[
321	breadcrumb_paths.eholdings_local,
322	breadcrumbs.eholdings.local
323	.titles,
324	],
325	"Edit title" // $t("Edit title")
326	),
327	},
328	},
329	{
330	path: "import",
331	name: "EHoldingsLocalTitlesFormImport",
332	component: EHoldingsLocalTitlesFormImport,
333	meta: {
334	breadcrumb: () =>
335	build_breadcrumb(
336	[
337	breadcrumb_paths.eholdings_local,
338	breadcrumbs.eholdings.local
339	.titles,
340	],
341	"Import from a list" // $t("Import from a list")
342	),
343	},
344	},
345	],
346	},	70	},
347	{	71	{
348	path: "resources/:resource_id",	72	path: "edit/:agreement_id",
349	name: "EHoldingsLocalResourcesShow",	73	name: "AgreementsFormAddEdit",
350	component: EHoldingsLocalResourcesShow,	74	component: markRaw(AgreementsFormAdd),
351	meta: {	75	title: $__('Edit agreement'),
352	breadcrumb: () =>
353	build_breadcrumb(
354	[
355	breadcrumb_paths.eholdings_local,
356	breadcrumbs.eholdings.local.titles,
357	],
358	"Resource" // $t("Resource")
359	),
360	},
361	},	76	},
362	],	77	],
363	},	78	},
364	{	79	{
365	path: "ebsco",	80	path: "/cgi-bin/koha/erm/licenses",
		81	title: $__('Licenses'),
		82	icon: "fa-gavel",
		83	is_end_node: true,
366	children: [	84	children: [
367	{	85	{
368	path: "",	86	path: "",
369	meta: {	87	name: "LicensesList",
370	breadcrumb: () => breadcrumb_paths.eholdings_ebsco,	88	component: markRaw(LicensesList),
371	},	89	},
		90	{
		91	path: ":license_id",
		92	name: "LicensesShow",
		93	component: markRaw(LicensesShow),
		94	title: $__('Show license'),
		95	},
		96	{
		97	path: "add",
		98	name: "LicensesFormAdd",
		99	component: markRaw(LicensesFormAdd),
		100	title: $__('Add license'),
372	},	101	},
373	{	102	{
374	path: "packages",	103	path: "edit/:license_id",
		104	name: "LicensesFormAddEdit",
		105	component: markRaw(LicensesFormAdd),
		106	title: $__('Edit license'),
		107	},
		108	],
		109	},
		110	{
		111	path: "/cgi-bin/koha/erm/eholdings",
		112	title: $__('eHoldings'),
		113	icon: 'fa-crosshairs',
		114	disabled: true,
		115	children: [
		116	{
		117	path: "local",
		118	title: $__('Local'),
		119	icon: "fa-map-marker",
		120	disabled: true,
375	children: [	121	children: [
376	{	122	{
377	path: "",	123	path: "packages",
378	name: "EHoldingsEBSCOPackagesList",	124	title: $__('Packages'),
379	component: EHoldingsEBSCOPackagesList,	125	icon: "fa-archive",
380	meta: {	126	is_end_node: true,
381	breadcrumb: () =>	127	children: [
382	build_breadcrumb([	128	{
383	breadcrumb_paths.eholdings_ebsco,	129	path: "",
384	breadcrumbs.eholdings.ebsco	130	name: "EHoldingsLocalPackagesList",
385	.packages,	131	component: markRaw(EHoldingsLocalPackagesList),
386	]),	132	},
387	},	133	{
		134	path: ":package_id",
		135	name: "EHoldingsLocalPackagesShow",
		136	component: markRaw(EHoldingsLocalPackagesShow),
		137	title: $__('Show package'),
		138	},
		139	{
		140	path: "add",
		141	name: "EHoldingsLocalPackagesFormAdd",
		142	component: markRaw(EHoldingsLocalPackagesFormAdd),
		143	title: $__('Add package'),
		144	},
		145	{
		146	path: "edit/:package_id",
		147	name: "EHoldingsLocalPackagesFormAddEdit",
		148	component: markRaw(EHoldingsLocalPackagesFormAdd),
		149	title: $__('Edit package'),
		150	},
		151	],
388	},	152	},
389	{	153	{
390	path: ":package_id",	154	path: "titles",
391	name: "EHoldingsEBSCOPackagesShow",	155	title: $__('Titles'),
392	component: EHoldingsEBSCOPackagesShow,	156	icon: "fa-sort-alpha-asc",
393	meta: {	157	is_end_node: true,
394	breadcrumb: () =>	158	children: [
395	build_breadcrumb(	159	{
396	[	160	path: "",
397	breadcrumb_paths.eholdings_ebsco,	161	name: "EHoldingsLocalTitlesList",
398	breadcrumbs.eholdings.ebsco	162	component: markRaw(EHoldingsLocalTitlesList),
399	.packages,	163	},
400	],	164	{
401	"Show package" // $t("Show package")	165	path: ":title_id",
402	),	166	name: "EHoldingsLocalTitlesShow",
403	},	167	component: markRaw(EHoldingsLocalTitlesShow),
		168	title: $__('Show title'),
		169	},
		170	{
		171	path: "add",
		172	name: "EHoldingsLocalTitlesFormAdd",
		173	component: markRaw(EHoldingsLocalTitlesFormAdd),
		174	title: $__('Add title'),
		175	},
		176	{
		177	path: "edit/:title_id",
		178	name: "EHoldingsLocalTitlesFormAddEdit",
		179	component: markRaw(EHoldingsLocalTitlesFormAdd),
		180	title: $__('Edit title'),
		181	},
		182	{
		183	path: "import",
		184	name: "EHoldingsLocalTitlesFormImport",
		185	component: markRaw(EHoldingsLocalTitlesFormImport),
		186	title: $__('Import from a list'),
		187	},
		188	{
		189	path: "/cgi-bin/koha/erm/eholdings/local/resources/:resource_id",
		190	name: "EHoldingsLocalResourcesShow",
		191	component: markRaw(EHoldingsLocalResourcesShow),
		192	title: $__('Resource'),
		193	},
		194	],
404	},	195	},
405	],	196	],
406	},	197	},
407	{	198	{
408	path: "titles",	199	path: "ebsco",
		200	title: $__('EBSCO'),
		201	icon: 'fa-globe',
		202	disabled: true,
409	children: [	203	children: [
410	{	204	{
411	path: "",	205	path: "packages",
412	name: "EHoldingsEBSCOTitlesList",	206	title: $__('Packages'),
413	component: EHoldingsEBSCOTitlesList,	207	icon: "fa-archive",
414	meta: {	208	is_end_node: true,
415	breadcrumb: () =>	209	children: [
416	build_breadcrumb([	210	{
417	breadcrumb_paths.eholdings_ebsco,	211	path: "",
418	breadcrumbs.eholdings.ebsco.titles,	212	name: "EHoldingsEBSCOPackagesList",
419	]),	213	component: markRaw(EHoldingsEBSCOPackagesList),
420	},	214	},
		215	{
		216	path: ":package_id",
		217	name: "EHoldingsEBSCOPackagesShow",
		218	component: markRaw(EHoldingsEBSCOPackagesShow),
		219	title: $__('Show package'),
		220	},
		221	],
421	},	222	},
422	{	223	{
423	path: ":title_id",	224	path: "titles",
424	name: "EHoldingsEBSCOTitlesShow",	225	title: $__('Titles'),
425	component: EHoldingsEBSCOTitlesShow,	226	icon: "fa-sort-alpha-asc",
426	meta: {	227	is_end_node: true,
427	breadcrumb: () =>	228	children: [
428	build_breadcrumb(	229	{
429	[	230	path: "",
430	breadcrumb_paths.eholdings_ebsco,	231	name: "EHoldingsEBSCOTitlesList",
431	breadcrumbs.eholdings.ebsco	232	component: markRaw(EHoldingsEBSCOTitlesList),
432	.titles,	233	},
433	],	234	{
434	"Show title" // $t("Show title")	235	path: ":title_id",
435	),	236	name: "EHoldingsEBSCOTitlesShow",
436	},	237	component: markRaw(EHoldingsEBSCOTitlesShow),
		238	title: $__('Show title'),
		239	},
		240	{
		241	path: "/cgi-bin/koha/erm/eholdings/ebsco/resources/:resource_id",
		242	name: "EHoldingsEBSCOResourcesShow",
		243	component: markRaw(EHoldingsEBSCOResourcesShow),
		244	title: $__('Resource'),
		245	is_navigation_item: false,
		246	},
		247	],
437	},	248	},
438	],	249	],
439	},	250	},
440	{
441	path: "resources/:resource_id",
442	name: "EHoldingsEBSCOResourcesShow",
443	component: EHoldingsEBSCOResourcesShow,
444	meta: {
445	breadcrumb: () =>
446	build_breadcrumb(
447	[
448	breadcrumb_paths.eholdings_ebsco,
449	breadcrumbs.eholdings.ebsco.titles,
450	],
451	"Resource" // $t("Resource")
452	),
453	},
454	},
455	],	251	],
456	},	252	},
457	],	253	]
458	},
459	{
460	path: "/cgi-bin/koha/erm/licenses",
461	children: [
462	{
463	path: "",
464	name: "LicensesList",
465	component: LicensesList,
466	meta: {
467	breadcrumb: () => breadcrumb_paths.licenses,
468	},
469	},
470	{
471	path: ":license_id",
472	name: "LicensesShow",
473	component: LicensesShow,
474	meta: {
475	breadcrumb: () =>
476	build_breadcrumb(
477	breadcrumb_paths.licenses,
478	"Show license" // $t("Show license")
479	),
480	},
481	},
482	{
483	path: "add",
484	name: "LicensesFormAdd",
485	component: LicensesFormAdd,
486	meta: {
487	breadcrumb: () =>
488	build_breadcrumb(
489	breadcrumb_paths.licenses,
490	"Add license" // $t("Add license")
491	),
492	},
493	},
494	{
495	path: "edit/:license_id",
496	name: "LicensesFormAddEdit",
497	component: LicensesFormAdd,
498	meta: {
499	breadcrumb: () =>
500	build_breadcrumb(
501	breadcrumb_paths.licenses,
502	"Edit license" // $t("Edit license")
503	),
504	},
505	},
506	],
507	},	254	},
508	];	255	];

Line 0 Link Here

(-)a/koha-tmpl/intranet-tmpl/prog/js/vue/stores/navigation.js (-1 / +207 lines)
0	-	1	import {
		2	defineStore
		3	} from "pinia";
		4
		5	export const useNavigationStore = defineStore("navigation", {
		6	state: () => ({
		7	routeState: {
		8	alt: "Home",
		9	href: "/cgi-bin/koha/mainpage.pl",
		10	is_navigation_item: false,
		11	is_base: true,
		12	children: []
		13	},
		14	current: null,
		15	params: {},
		16	}),
		17	actions: {
		18	setRoutes(routesDef) {
		19	if (!Array.isArray(routesDef)) {
		20	routesDef = [routesDef]
		21	}
		22	this.routeState.children = routesDef
		23	_traverseChildren(this.routeState)
		24
		25	return this.navigationRoutes
		26
		27	// Function declarations
		28
		29	function _traverseChildren(parent) {
		30	if (isParent(parent)) {
		31	parent.children.forEach(child => {
		32	_setChildDefaults(parent, child);
		33	_traverseChildren(child)
		34	})
		35	}
		36	}
		37
		38	function _setChildDefaults(parent, child) {
		39	child.parent = parent;
		40	if (isRoutable(child)) {
		41	_setMetadata(child);
		42	}
		43	if (parent.children.length === 1 && parent.is_base) {
		44	_setBaseAndNavigationDefaults(child, {
		45	is_base: true,
		46	is_navigation_item: false
		47	});
		48	} else {
		49	_setBaseAndNavigationDefaults(child, {
		50	is_base: false,
		51	is_navigation_item: true
		52	});
		53	}
		54	}
		55
		56	function _setBaseAndNavigationDefaults(child, {
		57	is_base,
		58	is_navigation_item
		59	}) {
		60	child.is_base = child.is_base !== undefined ? child.is_base : is_base;
		61	child.is_navigation_item = child.is_navigation_item !== undefined ? child.is_navigation_item : is_navigation_item;
		62	}
		63
		64	function _setMetadata(child) {
		65	if (!child.meta)
66	child.meta = {};
67	child.meta.self = child;
68	}
69	}
70	},
71	getters: {
72	breadcrumbs() {
73	if (this.current)
74	return _buildFromCurrentMatches(this.current, this.routeState)
75
76	return _getBaseElements(this.routeState)
77
78	// Function declarations
79
80	function _getBaseElements(parent) {
81	if (!parent.is_base) return []
82	let next = {}
83	if (isParent(parent)) {
84	next = _defineNextElement(parent)
85	}
86	return [{
87	...parent,
88	children: null
89	}, ..._getBaseElements(next)]
90	}
91
92	function _defineNextElement(parent) {
93	return parent.children.find(child => child.is_default) \|\| parent.children[0];
94	}
95
96	function _buildFromCurrentMatches(currentMatches, routeState) {
97	return [
98	{
99	...routeState,
100	icon: null,
101	children: null
102	},
103	..._mapMatches(currentMatches)
104	];
105	}
106
107	function _isBaseOrNotStub(child) {
108	return child.is_base \|\| (child.path && child.path !== '');
109	}
110
111	function _mapMatches(currentMatches) {
112	return currentMatches
113	.filter((match) => _isBaseOrNotStub(match.meta.self))
114	.map((match) => ({
115	...match.meta.self,
116	icon: null,
117	path: match.path,
118	children: null
119	}));
120	}
121
122	},
123	leftNavigation() {
124	return _getNavigationElements(this.routeState)
125
126	// Function declarations
127
128	function _getNavigationElements(parent, prevPath = '') {
129	if (_isBaseAndNoChildren(parent)) return [];
130	if (parent.is_base)
131	return _buildChildNavigationElements(parent).flat(Infinity)
132
133	const builtPath = _buildPath(prevPath, parent);
134
135	let children = []
136	if (!parent.is_end_node && isParent(parent)) {
137	children = _buildChildNavigationElements(parent, builtPath)
138	}
139
140	return {
141	...parent,
142	path: builtPath ? builtPath : parent.path,
143	children
144	}
145	}
146
147	function _buildPath(prevPath, element) {
148	let builtPath;
149
150	if (isRoutable(element) && isAbsolutePath(element.path)) {
151	builtPath = element.path;
152	} else {
153	if (prevPath)
154	builtPath = '' + prevPath + addSlashIfNotPresent(prevPath);
155	if (isRoutable(element))
156	builtPath = '' + builtPath + element.path;
157	}
158
159	return builtPath;
160	}
161
162	function _buildChildNavigationElements(parent, builtPath) {
163	return parent.children
164	.filter(child => child.is_base \|\| child.is_navigation_item)
165	.map(child => _getNavigationElements(child, builtPath));
166	}
167
168	function _isBaseAndNoChildren(parent) {
169	return parent.is_base && (!parent.children \|\| !parent.children.length);
170	}
171	},
172	navigationRoutes() {
173	let routes = _toRoute(this.routeState)
174	return Array.isArray(routes) ? routes : [routes]
175
176	// Function declarations
177
178	function _toRoute(parent) {
179	if (!isRoutable(parent))
180	return _getRoutableChildren(parent)
181	return parent
182	}
183
184	function _getRoutableChildren(parent) {
185	return parent.children
186	.map(child => _toRoute(child))
187	.flat(Infinity);
188	}
189	}
190	}
191	})
192
193	function addSlashIfNotPresent(path) {
194	return /\/$/.test(path) ? '' : '/';
195	}
196
197	function isRoutable(element) {
198	return element.path !== undefined \|\| element.name !== undefined;
199	}
200
201	function isParent(parent) {
202	return parent.children && parent.children.length;
203	}
204
205	function isAbsolutePath(path) {
206	return /^\//.test(path);
207	}