Skip to content
Snippets Groups Projects
Commit c5061fb4 authored by Martin Massenberg's avatar Martin Massenberg
Browse files

20240222

parent 72ddfbe8
No related branches found
No related tags found
No related merge requests found
......@@ -43,6 +43,17 @@ import "./main.pcss";
import { findTargetElementFromEvent } from "../../source/dom/events.mjs";
let data = document.getElementById('data1');
/**
* die Daten können mit dem write.mapping.transformer umformatiert werden
*/
data.setOption('write.mapping.transformer', 'call:agenorFormater');
let callbacks = {
agenorFormater: function (data) {
return data.dataset;
}};
data.setOption('write.mapping.callbacks', callbacks);
let dataset1 = document.getElementById('dataset1');
//let dataset2 = document.getElementById('dataset2');
......
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Monster-Bind mit Datasource</title>
<script src="main.mjs" type="module"></script>
</head>
<body>
<main>
<div>
<!--
Datasource mit fest definieren Daten
-->
<monster-datasource-dom id="data1">
<script id="data" type="application/json">
{
"dataset": [
{
"erpID": "",
"erpName": "",
"erpNumber": "",
"erpLastUpdate": "2020-01-16T10:27:18",
"erpCreation": "2020-01-16T10:27:18",
"archived": false,
"oid": 1000,
"orderDate": "2019-01-16T10:27:18",
"orderState": 57,
"orderLastStatusChange": "2019-01-16T10:38:53",
"customerUID": 30,
"customerNotice": "",
"billingAddressAID": 16,
"deliveryAddressAID": 16,
"deliveryNotice": "",
"paymentPID": 101,
"assigndTickets": "",
"resubmissionDate": "1970-01-01T12:00:00",
"resubmissionInfo": "",
"acquisitionPartnerID": 0,
"acquisitionInfo": "",
"acquisitionRedirect": null,
"acquisitionDate": "1970-01-01T12:00:00",
"shippingNotice": "",
"shippingDCID": 2,
"retoureRID": 0,
"companySHID": 1,
"salesmanUID": 0,
"channelOrderID": "",
"channelOrderState": "0",
"channelOrderDate": null,
"channelOrderData": {}
},
{
"erpID": "",
"erpName": "",
"erpNumber": "",
"erpLastUpdate": "2020-01-16T10:27:18",
"erpCreation": "2020-01-16T10:27:18",
"archived": false,
"oid": 1000,
"orderDate": "2019-01-16T10:27:18",
"orderState": 57,
"orderLastStatusChange": "2019-01-16T10:38:53",
"customerUID": 30,
"customerNotice": "",
"billingAddressAID": 16,
"deliveryAddressAID": 16,
"deliveryNotice": "",
"paymentPID": 101,
"assigndTickets": "",
"resubmissionDate": "1970-01-01T12:00:00",
"resubmissionInfo": "",
"acquisitionPartnerID": 0,
"acquisitionInfo": "",
"acquisitionRedirect": null,
"acquisitionDate": "1970-01-01T12:00:00",
"shippingNotice": "",
"shippingDCID": 2,
"retoureRID": 0,
"companySHID": 1,
"salesmanUID": 0,
"channelOrderID": "",
"channelOrderState": "0",
"channelOrderDate": null,
"channelOrderData": {}
},
{
"erpID": "",
"erpName": "",
"erpNumber": "",
"erpLastUpdate": "2020-01-16T10:27:18",
"erpCreation": "2020-01-16T10:27:18",
"archived": false,
"oid": 1001,
"orderDate": "2019-01-16T10:27:18",
"orderState": 57,
"orderLastStatusChange": "2019-02-16T10:38:53",
"customerUID": 30,
"customerNotice": "",
"billingAddressAID": 16,
"deliveryAddressAID": 16,
"deliveryNotice": "",
"paymentPID": 101,
"assigndTickets": "",
"resubmissionDate": "1970-01-01T12:00:00",
"resubmissionInfo": "",
"acquisitionPartnerID": 0,
"acquisitionInfo": "",
"acquisitionRedirect": null,
"acquisitionDate": "1970-01-01T12:00:00",
"shippingNotice": "",
"shippingDCID": 2,
"retoureRID": 0,
"companySHID": 1,
"salesmanUID": 0,
"channelOrderID": "",
"channelOrderState": "0",
"channelOrderDate": null,
"channelOrderData": {}
},
{
"erpID": "",
"erpName": "",
"erpNumber": "",
"erpLastUpdate": "2020-01-16T10:27:18",
"erpCreation": "2020-01-16T10:27:18",
"archived": false,
"oid": 1002,
"orderDate": "2019-01-16T10:27:18",
"orderState": 57,
"orderLastStatusChange": "2019-03-16T10:38:53",
"customerUID": 30,
"customerNotice": "",
"billingAddressAID": 16,
"deliveryAddressAID": 16,
"deliveryNotice": "",
"paymentPID": 101,
"assigndTickets": "",
"resubmissionDate": "1970-01-01T12:00:00",
"resubmissionInfo": "",
"acquisitionPartnerID": 0,
"acquisitionInfo": "",
"acquisitionRedirect": null,
"acquisitionDate": "1970-01-01T12:00:00",
"shippingNotice": "",
"shippingDCID": 2,
"retoureRID": 0,
"companySHID": 1,
"salesmanUID": 0,
"channelOrderID": "",
"channelOrderState": "0",
"channelOrderDate": null,
"channelOrderData": {}
}
],
"sys": {
"pagination": {
"currentPage": 1,
"nextOffset": 3,
"pages": 1,
"prevOffset": null,
"offset": 0,
"objectsPerPage": 20,
"total": 3
},
"message": "200 OK",
"code": 200
}
}
</script>
</monster-datasource-dom>
<h1>Bestellungen</h1>
<!--
Datatable stellt diese Daten dar
mit "data-monster-datasource-selector" wird die Datenquelle "#data1" definiert
-->
<monster-datatable id="test-datatable" data-monster-datasource-selector="#data1">
<template id="test-datatable-row">
<div data-monster-head="martin" data-monster-replace="path:test-datatable-row.martin "></div>
<div data-monster-head="OID" data-monster-mode="fixed" data-monster-sortable="oid" data-monster-replace="path:test-datatable-row.oid | tostring"></div>
<div data-monster-head="orderLastStatusChange" data-monster-replace="path:test-datatable-row.orderLastStatusChange"></div>
<div data-monster-head="customerUID" data-monster-replace="path:test-datatable-row.customerUID"></div>
<div data-monster-head="resubmissionDate" data-monster-replace="path:test-datatable-row.resubmissionDate"></div>
<div data-monster-head="billingAddressAID" data-monster-replace="path:test-datatable-row.billingAddressAID"></div>
<div data-monster-head="deliveryAddressAID" data-monster-replace="path:test-datatable-row.deliveryAddressAID"></div>
<div data-monster-head="aktion" data-alvine-role="actionHolder">
<monster-button data-alvine-role="changeButon" data-monster-attributes="data-alvine-oid path:test-datatable-row.index">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" class="bi bi-pencil-square" viewBox="0 0 16 16">
<path d="M15.502 1.94a.5.5 0 0 1 0 .706L14.459 3.69l-2-2L13.502.646a.5.5 0 0 1 .707 0l1.293 1.293zm-1.75 2.456-2-2L4.939 9.21a.5.5 0 0 0-.121.196l-.805 2.414a.25.25 0 0 0 .316.316l2.414-.805a.5.5 0 0 0 .196-.12l6.813-6.814z"></path>
<path fill-rule="evenodd" d="M1 13.5A1.5 1.5 0 0 0 2.5 15h11a1.5 1.5 0 0 0 1.5-1.5v-6a.5.5 0 0 0-1 0v6a.5.5 0 0 1-.5.5h-11a.5.5 0 0 1-.5-.5v-11a.5.5 0 0 1 .5-.5H9a.5.5 0 0 0 0-1H2.5A1.5 1.5 0 0 0 1 2.5v11z"></path>
</svg>
</monster-button>
</div>
</template>
</monster-datatable>
<h2>eine Bestellung im dataset</h2>
<monster-dataset id="test-dataset" data-monster-datasource-selector="#data1" >
<div data-monster-replace="path:data.oid ">xx</div>
<div data-monster-replace="path:data.orderState ">xx</div>
<div data-monster-replace="path:data.orderLastStatusChange ">xx</div>
<input data-monster-bind="path:data.customerUID" data-monster-attributes="value path:data.customerUID ">
</monster-dataset>
</div>
</main>
</body>
</html>
\ No newline at end of file
import "../../source/components/form/button.mjs";
import "../../source/components/datatable/datatable.mjs";
import "../../source/components/datatable/dataset.mjs";
import "../../source/components/datatable/datasource/dom.mjs";
import { findTargetElementFromEvent } from "../../source/dom/events.mjs";
document.addEventListener("monster-button-clicked", (event) => {
let changeButon = findTargetElementFromEvent(event, 'data-alvine-role', 'changeButon');
if (changeButon) {
//index des Datensatzes ermitteln
//aktuell 23.02.2024 nur über das attribute möglich
//der index steht immer hinten
let parent = changeButon.closest('[data-alvine-role="actionHolder"]')
let reference = parent.getAttribute("data-monster-insert-reference");
let index = reference.split("-")[3];
// Index sezten
dataset.setOption('mapping.index', index);
}
});
// let body = document.body;
// let updater = new Updater(
// body,
// {
// a: {
// b: "hello"
// }
// }
// );
// /**
// * Events an schalten
// */
// updater.enableEventProcessing();
// updater.run().then(() => {
// console.log('done');
// });
/**
* customElementUpdaterLinkSymbol
*
* datsource > datenquelle
*
* dataset
* const updaters = getLinkedObjects(self, customElementUpdaterLinkSymbol);
*
* proxyObserver > Updater
*
*
*
*/
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment