UNPKG

@dbp-topics/library

Version:

[GitLab Repository](https://gitlab.tugraz.at/dbp/library/library) | [npmjs package](https://www.npmjs.com/package/@dbp-topics/library) | [Unpkg CDN](https://unpkg.com/browse/@dbp-topics/library/)

404 lines (367 loc) 13.3 kB
let _ = t => t, _t2, _t4; function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } /*! * License: LGPL-2.1-or-later * Dependencies: * * @dbp-toolkit/common: LGPL-2.1-or-later * jquery: MIT * select2: MIT * @dbp-toolkit/organization-select: LGPL-2.1-or-later * @babel/runtime: MIT * i18next: MIT * @lit/reactive-element: BSD-3-Clause * lit-html: BSD-3-Clause * lit-element: BSD-3-Clause * @open-wc/dedupe-mixin: MIT * @open-wc/scoped-elements: MIT * datatables.net: MIT * datatables.net-responsive: MIT * datatables.net-responsive-dt: MIT * datatables.net-dt: MIT * jszip: (MIT OR GPL-3.0-or-later) * datatables.net-buttons-dt: MIT * datatables.net-buttons: MIT * @dbp-toolkit/data-table-view: LGPL-2.1-or-later * @dbp-toolkit/person-select: LGPL-2.1-or-later */ import { L as t, c as e, O as a, $ as i } from "./shared/organization-select.4ef0db9e.es.js"; import { S as n, M as o, B as l, r as s, g as r, a as d, b as c, $ as b, o as h, e as p } from "./shared/jsonld.76d0c1bd.es.js"; import { D as g } from "./shared/data-table-view.a69614b6.es.js"; import { g as u } from "./shared/utils.82cefc35.es.js"; class y extends n(t) { constructor() { super(), this.auth = {}, this._i18n = e(), this.lang = this._i18n.language, this.entryPointUrl = "", this.personId = "", this.person = null, this.loans = [], this.organizationId = "", this.abortController = null, this.overdueOnly = !1, this.openOnly = !1; let t = new Date(); t.setDate(t.getDate() - 1), this.analyticsUpdateDate = t.toLocaleDateString(this.lang); } static get scopedElements() { return { "dbp-organization-select": a, "dbp-mini-spinner": o, "dbp-button": l, "dbp-data-table-view": g }; } static get properties() { return _extends({}, super.properties, { lang: { type: String }, entryPointUrl: { type: String, attribute: "entry-point-url" }, organizationId: { type: String, attribute: "organization-id", reflect: !0 }, loans: { type: Object, attribute: !1 }, overdueOnly: { type: Boolean, attribute: !1 }, openOnly: { type: Boolean, attribute: !1 }, analyticsUpdateDate: { type: Object, attribute: !1 }, auth: { type: Object } }); } $(t) { return i(this._(t)); } loginCallback() { super.loginCallback(), this.loadTable(); } connectedCallback() { super.connectedCallback(), this.updateComplete.then(() => { this._(this.getScopedTagName("dbp-data-table-view")).setCSSStyle("\n table.dataTable tbody tr.odd {\n background-color: var(--dbp-background);\n }\n "), this.loadTable(); }); } update(t) { t.forEach((t, e) => { switch (e) { case "lang": this._i18n.changeLanguage(this.lang), this.buildTable(); break; case "organizationId": this.loadTable(); break; case "overdueOnly": case "openOnly": this.buildTable(); } }), super.update(t); } disconnectedCallback() { null !== this.abortController && this.abortController.abort(), super.disconnectedCallback(); } loadTable() { const t = this, e = t.$("#loan-list-block"), a = t.$("#no-loans-block"); if (e.hide(), a.hide(), !this.isLoggedIn()) return; if ("" === this.organizationId) return; const i = this.entryPointUrl + this.organizationId + "/library-book-loans", n = this.$("#loans-loading"); n.show(), null !== this.abortController && this.abortController.abort(), this.abortController = new AbortController(); const o = this.abortController.signal; console.assert(this.auth.token), fetch(i, { headers: { "Content-Type": "application/ld+json", Authorization: "Bearer " + this.auth.token }, signal: o }).then(t => { if (!t.ok) throw t; if (t.headers.has("x-analytics-update-date")) { const e = new Date(t.headers.get("x-analytics-update-date")); this.analyticsUpdateDate = e.toLocaleDateString(this.lang) + " " + e.toLocaleTimeString(this.lang); } return t.json(); }).then(e => { t.loans = e["hydra:member"], t.buildTable(), n.hide(); }).catch(e => { t.handleFetchError(e, t._i18n.t("loan-list.error-load-loans")), n.hide(); }); } buildTable() { const t = this.$("#loan-list-block"), e = this.$("#no-loans-block"), a = this, i = this._i18n; if (this.loans.length > 0) { const _e = this._("#loan-loans-1"); if (null !== _e) { const _t = [{ title: i.t("book-list.book-title") }, { title: i.t("loan-list.book-author") }, { title: i.t("book-list.book-barcode") }, { title: i.t("loan-list.borrower-name") }, { title: i.t("loan-list.start-date") }, null, { title: i.t("loan-list.due-date") }, null, { title: i.t("loan-list.return-date") }, null, { title: i.t("book-list.book-location-identifier") }, { title: i.t("book-list.book-description") }, ""]; const n = [{ targets: [4], orderData: [5] }, { targets: [5], visible: !1 }, { targets: [6], orderData: [7] }, { targets: [7], visible: !1 }, { targets: [8], orderData: [9] }, { targets: [9], visible: !1 }, { targets: [11], responsivePriority: 10001 }, { targets: [12], sortable: !1, createdCell: (t, e, i, n, o) => { let l = a.shadowRoot.createElement("div"); for (l.innerHTML = e; t.lastChild;) t.removeChild(t.lastChild); t.append(...l.children); } }], o = new Date(), l = []; this.loans.forEach(function (t) { const e = new Date(t.startTime), n = new Date(t.endTime), s = new Date(t.returnTime); if (a.openOnly && null !== t.returnTime) return; if (a.overdueOnly && (o < n || null !== t.returnTime)) return; let r = a.getScopedTagName("dbp-button"); const d = [t.object.book.title, t.object.book.author, t.object.barcode, u(t.borrower), e.toLocaleDateString("de-AT"), t.startTime, n.toLocaleDateString("de-AT"), t.endTime, null !== t.returnTime ? s.toLocaleDateString("de-AT") : "", t.returnTime, t.object.locationIdentifier, t.object.description, `<div class="button-col">\n <${r} data-id="${t["@id"]}" data-type="contact" data-book-name="${t.object.name}"\n value="${i.t("renew-loan.contact-value")}" name="send" type="is-small"\n title="${i.t("renew-loan.contact-title", { personName: u(t.borrower) })}" no-spinner-on-click></${r}>\n </div>`]; l.push(d); }), _e.set_columns(_t).set_columnDefs(n).set_datatable(l); } t.show(); } else e.show(); } static get styles() { return s(_t2 || (_t2 = _` ${0} ${0} ${0} .hidden { display: none; } #loan-list-block, #no-loans-block { display: none; } form, table { width: 100%; } #no-loans-block { font-weight: bold; } `), r(), d(), c()); } toggleOverdueOnly() { this.overdueOnly = !this.overdueOnly; } toggleOpenOnly() { this.openOnly = !this.openOnly; } onOrgUnitCodeChanged(t) { this.organizationId = t.detail.value; } onDataTableClick(t) { const e = t.composedPath(); let a, i = -1; const n = this._i18n; if (e.some((t, e) => { var _t$nodeName; if (((_t$nodeName = t.nodeName) == null ? void 0 : _t$nodeName.toUpperCase()) === this.getScopedTagName("dbp-button").toUpperCase()) return a = t, i = e, !0; }), -1 === i) return; if (t.preventDefault(), a.hasAttribute("disabled")) return; const o = a.getAttribute("data-type"), l = a.getAttribute("data-id"); switch (o) { case "contact": { a.start(); const _t3 = this.entryPointUrl + l; fetch(_t3, { headers: { "Content-Type": "application/ld+json", Authorization: "Bearer " + this.auth.token } }).then(t => { if (a.stop(), !t.ok) throw t; return t.json(); }).then(t => { const e = a.getAttribute("data-book-name"), i = n.t("renew-loan.contact-subject", { bookName: e }); location.href = `mailto:${t.borrower.email}?subject=${i}`; }).catch(t => { this.handleFetchError(t, n.t("loan-list.error-load-loan")); }); break; } } } render() { const t = this._i18n; return b(_t4 || (_t4 = _` <form class="${0}"> <div class="field"> ${0}: ${0} </div> <div class="field"> <label class="label">${0}</label> <div class="control"> <dbp-organization-select subscribe="lang:lang,entry-point-url:entry-point-url,auth:auth" context="library-manager" value="${0}" @change="${0}"></dbp-organization-select> </div> </div> <dbp-mini-spinner id="loans-loading" text="${0}" style="font-size: 2em; display: none;"></dbp-mini-spinner> <div id="loan-list-block"> <div class="field"> <label class="label"> <input type="checkbox" .checked=${0} @click=${0} .disabled=${0} /> ${0} </label> </div> <div class="field"> <label class="label"> <input type="checkbox" .checked=${0} @click=${0} /> ${0} </label> </div> <div class="field"> <label class="label">${0}</label> <div class="control"> <dbp-data-table-view searching paging exportable export-name="${0}" subscribe="lang:lang" id="loan-loans-1" @click="${0}"></dbp-data-table-view> </div> </div> </div> <div id="no-loans-block">${0}</div> </form> <div class="notification is-warning ${0}"> ${0} </div> <div class="notification is-danger ${0}"> ${0} </div> <div class="${0}"> <dbp-mini-spinner></dbp-mini-spinner> </div> `), h({ hidden: !this.isLoggedIn() || !this.hasLibraryPermissions() || this.isLoading() }), t.t("loan-list.current-state"), this.analyticsUpdateDate, t.t("organization-select.label"), this.organizationId, this.onOrgUnitCodeChanged, t.t("loan-list.mini-spinner-text"), this.openOnly, this.toggleOpenOnly, this.overdueOnly, t.t("loan-list.open-only"), this.overdueOnly, this.toggleOverdueOnly, t.t("loan-list.overdue-only"), t.t("loan-list.loans"), t.t("loan-list.export-name", { organizationCode: this.getOrganizationCode() }), t => this.onDataTableClick(t), t.t("loan-list.no-loans"), h({ hidden: this.isLoggedIn() || this.isLoading() }), t.t("error-login-message"), h({ hidden: this.hasLibraryPermissions() || !this.isLoggedIn() || this.isLoading() }), t.t("error-permission-message"), h({ hidden: !this.isLoading() })); } } p("dbp-library-loan-list", y); //# sourceMappingURL=dbp-library-loan-list.js.map