@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/)
368 lines (336 loc) • 14 kB
JavaScript
let _ = t => t,
_t3,
_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 e, c as t, O as n, $ as a } from "./shared/organization-select.4ef0db9e.es.js";
import { S as i, M as o, B as s, p as r, s as l, l as d, t as c, r as p, g as h, a as b, b as u, $ as g, o as m, e as y } from "./shared/jsonld.76d0c1bd.es.js";
import { P as w } from "./shared/person-select.13b7a8d5.es.js";
import { D as v } from "./shared/data-table-view.a69614b6.es.js";
import { g as $ } from "./shared/utils.82cefc35.es.js";
class f extends i(e) {
constructor() {
super(), this.auth = {}, this._i18n = t(), this.lang = this._i18n.language, this.entryPointUrl = "", this.personId = "", this.person = null, this.loans = [], this.organizationId = "";
}
static get scopedElements() {
return {
"dbp-organization-select": n,
"dbp-person-select": w,
"dbp-mini-spinner": o,
"dbp-button": s,
"dbp-data-table-view": v
};
}
static get properties() {
return _extends({}, super.properties, {
lang: {
type: String
},
entryPointUrl: {
type: String,
attribute: "entry-point-url"
},
personId: {
type: String,
attribute: "person-id",
reflect: !0
},
loans: {
type: Object,
attribute: !1
},
organizationId: {
type: String,
attribute: "organization-id",
reflect: !0
},
auth: {
type: Object
}
});
}
$(e) {
return a(this._(e));
}
getLibrary() {
return this.organizationId.includes("-") ? this.organizationId.split("-")[1] : "";
}
connectedCallback() {
super.connectedCallback();
const e = this;
this.updateComplete.then(() => {
this._(this.getScopedTagName("dbp-data-table-view")).setCSSStyle('\n @media (min-width: 900px) {\n td .date-col, td .button-col {\n white-space: nowrap;\n }\n }\n \n @media (max-width: 900px) {\n td .date-col input[type="time"] {\n margin-top: 5px;\n }\n }\n\n table.dataTable thead th, table.dataTable thead td { padding: 10px; }\n .button-col > dbp-button {\n margin-right: 5px;\n margin-bottom: 5px;\n display: inline-block;\n }\n\n table.dataTable tbody tr.odd {\n background-color: var(--dbp-background);\n }\n ');
const t = e.$(this.getScopedTagName("dbp-person-select")),
n = e.$("#renew-loan-block");
t.change(function () {
e.person = a(this).data("object"), void 0 !== e.person && (e.personId = e.person["@id"], e.setAttribute("person-id", e.personId), e.dispatchEvent(new CustomEvent("change", {
detail: {
type: "person-id",
value: e.personId
}
})), e.loadTable());
}).on("unselect", function (e) {
n.hide();
});
});
}
loadTable() {
const e = this,
t = this._i18n,
n = this.entryPointUrl + this.personId + "/library-book-loans",
a = this.$("#no-loans-block"),
i = this.$("#loans-loading"),
o = this.$("#renew-loan-block");
null != this.person && "" !== this.organizationId && (o.hide(), a.hide(), i.show(), r(() => "" !== this.organizationId && (fetch(n, {
headers: {
"Content-Type": "application/ld+json",
Authorization: "Bearer " + this.auth.token
}
}).then(e => {
if (!e.ok) throw e;
return e.json();
}).then(n => {
if (e.loans = n["hydra:member"], e.loans.length > 0) {
const _n = e._("#book-loans-1");
if (null !== _n) {
const a = new Date().toISOString(),
i = [{
title: t.t("renew-loan.book")
}, {
title: t.t("book-list.book-description")
}, {
title: t.t("renew-loan.end-date")
}, null, ""];
const o = [{
targets: [3],
visible: !1
}, {
targets: [2],
orderData: [3]
}, {
targets: [3, 4],
searchable: !1
}, {
targets: [4],
sortable: !1
}, {
targets: [2, 4],
createdCell: (t, n, a, i, o) => {
let s = e.shadowRoot.createElement("div");
for (s.innerHTML = n; t.lastChild;) t.removeChild(t.lastChild);
t.append(...s.children);
}
}],
s = e.getLibrary(),
r = [];
e.loans.forEach(function (n) {
if (n.object.library !== s) return;
let i = e.getScopedTagName("dbp-button");
const o = [n.object.name, n.object.description, `<div class="date-col">\n <input data-date-id="${n["@id"]}"\n type="date" min="${d(a)}"\n value="${d(n.endTime)}">\n <input data-time-id="${n["@id"]}"\n type="time" class="hidden" value="23:59:59">\n </div>`, n.endTime, `<div class="button-col">\n <${i} data-id="${n["@id"]}" data-type="renew"\n value="Ok" name="send" type="is-small"\n title="${t.t("renew-loan.renew-loan")}" no-spinner-on-click></${i}>\n <${i} data-id="${n["@id"]}" data-type="contact" data-book-name="${n.object.name}"\n value="${t.t("renew-loan.contact-value")}" name="send" type="is-small"\n title="${t.t("renew-loan.contact-title", {
personName: $(e.person)
})}" no-spinner-on-click></${i}>\n </div>`];
r.push(o);
}), _n.set_columns(i).set_columnDefs(o).set_datatable(r);
}
o.show();
} else a.show();
i.hide();
}).catch(n => {
e.handleFetchError(n, t.t("renew-loan.error-load-loans-summary")), i.hide();
}), !0), 1e4, 100));
}
update(e) {
e.forEach((e, t) => {
"lang" === t ? (this._i18n.changeLanguage(this.lang), this.$(this.getScopedTagName("dbp-person-select")).change()) : "organizationId" === t && this.loadTable();
}), super.update(e);
}
onLanguageChanged(e) {
this.lang = e.detail.lang;
}
onDataTableClick(e) {
const t = e.composedPath(),
n = this._i18n;
let a,
i = -1;
if (t.some((e, t) => {
if (e.nodeName.toUpperCase() === this.getScopedTagName("dbp-button").toUpperCase()) return a = e, i = t, !0;
}), -1 === i) return;
if (e.preventDefault(), a.hasAttribute("disabled")) return;
const o = a.getAttribute("data-type"),
s = a.getAttribute("data-id");
switch (o) {
case "renew":
{
a.start();
const _e = this._("#book-loans-1"),
_t = _e.shadowRoot.querySelector(`input[data-date-id='${s}']`),
_i = _e.shadowRoot.querySelector(`input[data-time-id='${s}']`);
let _o = _t.value;
_i.value && (_o += "T" + _i.value);
const r = new Date(_o);
if (r < new Date()) return l({
summary: n.t("renew-loan.error-renew-loan-summary"),
body: n.t("renew-loan.error-renew-loan-date-in-past"),
type: "warning",
timeout: 5
}), void a.stop();
const p = {
endTime: r.toISOString()
},
h = this.entryPointUrl + s;
fetch(h, {
method: "PUT",
body: JSON.stringify(p),
headers: {
"Content-Type": "application/ld+json",
Authorization: "Bearer " + this.auth.token
}
}).then(e => {
if (!e.ok) throw e;
return e.json();
}).then(e => {
l({
summary: n.t("renew-loan.info-renew-loan-success-summary"),
body: n.t("renew-loan.info-renew-loan-success-body"),
type: "info",
timeout: 5
}), _t.value = d(e.endTime), _i.value = c(e.endTime);
}).catch(e => {
this.handleFetchError(e, n.t("renew-loan.error-renew-loan-summary"));
}).finally(() => {
a.stop();
});
break;
}
case "contact":
{
const _e2 = a.getAttribute("data-book-name"),
_t2 = n.t("renew-loan.contact-subject", {
bookName: _e2
});
location.href = `mailto:${this.person.email}?subject=${_t2}`;
break;
}
}
}
static get styles() {
return p(_t3 || (_t3 = _`
${0}
${0}
${0}
.hidden {
display: none;
}
#renew-loan-block {
display: none;
}
form,
table {
width: 100%;
}
#no-loans-block {
font-weight: bold;
}
`), h(), b(), u());
}
onOrgUnitCodeChanged(e) {
this.organizationId = e.detail.value;
}
render() {
const e = this._i18n;
return g(_t4 || (_t4 = _`
<form
class="${0}">
<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}"
="${0}"></dbp-organization-select>
</div>
</div>
<div class="field">
<label class="label">${0}</label>
<div class="control">
<dbp-person-select
subscribe="lang:lang,entry-point-url:entry-point-url,auth:auth"
value="${0}"
organization-id="${0}"
show-reload-button
show-details
reload-button-title="${0}"></dbp-person-select>
</div>
</div>
<dbp-mini-spinner
id="loans-loading"
text="${0}"
style="font-size: 2em; display: none;"></dbp-mini-spinner>
<div id="renew-loan-block" class="field">
<label class="label">${0}</label>
<div class="control">
<dbp-data-table-view
searching
paging
exportable
export-name="${0}"
subscribe="lang:lang"
id="book-loans-1"
="${0}"></dbp-data-table-view>
</div>
</div>
<div id="no-loans-block" style="display: none;">
${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>
`), m({
hidden: !this.isLoggedIn() || !this.hasLibraryPermissions() || this.isLoading()
}), e.t("organization-select.label"), this.organizationId, this.onOrgUnitCodeChanged, e.t("person-select.headline"), this.personId, this.organizationId, this.person ? e.t("renew-loan.button-refresh-title", {
personName: $(this.person)
}) : "", e.t("renew-loan.mini-spinner-text"), e.t("renew-loan.loans"), e.t("renew-loan.loans"), e => this.onDataTableClick(e), e.t("renew-loan.no-loans"), m({
hidden: this.isLoggedIn() || this.isLoading()
}), e.t("error-login-message"), m({
hidden: this.hasLibraryPermissions() || !this.isLoggedIn() || this.isLoading()
}), e.t("error-permission-message"), m({
hidden: !this.isLoading()
}));
}
}
y("dbp-library-renew-loan", f);
//# sourceMappingURL=dbp-library-renew-loan.js.map