UNPKG

qwc2

Version:
932 lines (930 loc) 60.4 kB
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); } function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); } function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } } function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; } function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } } function _arrayWithHoles(r) { if (Array.isArray(r)) return r; } function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; } function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); } function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } } function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; } function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); } function _possibleConstructorReturn(t, e) { if (e && ("object" == _typeof(e) || "function" == typeof e)) return e; if (void 0 !== e) throw new TypeError("Derived constructors may only return object or undefined"); return _assertThisInitialized(t); } function _assertThisInitialized(e) { if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); return e; } function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } function _getPrototypeOf(t) { return _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function (t) { return t.__proto__ || Object.getPrototypeOf(t); }, _getPrototypeOf(t); } function _inherits(t, e) { if ("function" != typeof e && null !== e) throw new TypeError("Super expression must either be null or a function"); t.prototype = Object.create(e && e.prototype, { constructor: { value: t, writable: !0, configurable: !0 } }), Object.defineProperty(t, "prototype", { writable: !1 }), e && _setPrototypeOf(t, e); } function _setPrototypeOf(t, e) { return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) { return t.__proto__ = e, t; }, _setPrototypeOf(t, e); } function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; } function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; } function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } /** * Copyright 2016-2024 Sourcepole AG * All rights reserved. * * This source code is licensed under the BSD-style license found in the * LICENSE file in the root directory of this source tree. */ import React from 'react'; import { connect } from 'react-redux'; import axios from 'axios'; import { XMLParser } from 'fast-xml-parser'; import isEmpty from 'lodash.isempty'; import PropTypes from 'prop-types'; import { v4 as uuidv4 } from 'uuid'; import ConfigUtils from '../utils/ConfigUtils'; import { parseExpression, FeatureCache, KeyValCache } from '../utils/EditingUtils'; import LocaleUtils from '../utils/LocaleUtils'; import MiscUtils from '../utils/MiscUtils'; import EditComboField from './EditComboField'; import EditUploadField from './EditUploadField'; import Icon from './Icon'; import ButtonBar from './widgets/ButtonBar'; import DateTimeInput from './widgets/DateTimeInput'; import NumberInput from './widgets/NumberInput'; import Spinner from './widgets/Spinner'; import TextInput from './widgets/TextInput'; import './style/QtDesignerForm.css'; var FormPreprocessors = {}; /* editDataset: <mapname>.<layername> preprocessor: function(formData, feature, callback) formData: { fields: { dict of fields }, buttons: { dict of buttons }, externalFields: { dict of external fields} } feature: The feature for which the form is being displayed callback: function(formData), return the updated formData */ export function registerFormPreprocessor(editDataset, preprocessor) { FormPreprocessors[editDataset] = preprocessor; } export function removeFormPreprocessor(editDataset) { delete FormPreprocessors[editDataset]; } var hFitWidgets = ["QLabel", "QCheckBox", "QRadioButton", "Line", "QDateTimeEdit", "QDateEdit", "QTimeEdit"]; var vFitWidgets = ["QLabel", "QCheckBox", "QRadioButton", "Line", "QDateTimeEdit", "QDateEdit", "QTimeEdit", "QPushButton", "QComboBox", "QLineEdit", "QSpinBox", "QDoubleSpinBox", "QSlider"]; var QtDesignerForm = /*#__PURE__*/function (_React$Component) { function QtDesignerForm(props) { var _this; _classCallCheck(this, QtDesignerForm); _this = _callSuper(this, QtDesignerForm, [props]); _defineProperty(_this, "state", { reevaluate: 0 }); _defineProperty(_this, "renderLayout", function (layout, feature, editConfig, updateField) { var _this$props$editConfi; var nametransform = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : function (name) { return name; }; var visible = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : true; var containerClass = ""; var itemStyle = function itemStyle() { return {}; }; var sortKey = function sortKey(item, idx) { return idx; }; var containerStyle = {}; if (!layout) { return null; } else if (layout["class"] === "QGridLayout" || layout["class"] === "QFormLayout") { containerClass = "qt-designer-layout-grid"; containerStyle = { gridTemplateColumns: _this.computeLayoutColumns(layout.item).join(" "), gridTemplateRows: _this.computeLayoutRows(layout.item).join(" ") }; itemStyle = function itemStyle(item) { return { gridArea: 1 + parseInt(item.row, 10) + "/" + (1 + parseInt(item.column, 10)) + "/ span " + parseInt(item.rowspan || 1, 10) + "/ span " + parseInt(item.colspan || 1, 10) }; }; sortKey = function sortKey(item) { return item.row; }; } else if (layout["class"] === "QVBoxLayout") { containerClass = "qt-designer-layout-grid"; itemStyle = function itemStyle(item, idx) { return { gridArea: 1 + idx + "/1/ span 1/ span 1" }; }; sortKey = function sortKey(item, idx) { return idx; }; } else if (layout["class"] === "QHBoxLayout") { containerClass = "qt-designer-layout-grid"; containerStyle = { gridTemplateColumns: _this.computeLayoutColumns(layout.item, true).join(" ") }; itemStyle = function itemStyle(item, idx) { return { gridArea: "1/" + (1 + idx) + "/ span 1/ span 1" }; }; sortKey = function sortKey(item, idx) { return idx; }; } else { return null; } if (!visible) { containerStyle.display = 'none'; } if (layout.item.find(function (item) { return item.spacer && (item.spacer.property || {}).orientation === "Qt::Vertical"; })) { containerStyle.height = '100%'; } var fields = ((_this$props$editConfi = _this.props.editConfig.fields) !== null && _this$props$editConfi !== void 0 ? _this$props$editConfi : []).reduce(function (res, field) { return _objectSpread(_objectSpread({}, res), {}, _defineProperty({}, field.id, field)); }, {}); return /*#__PURE__*/React.createElement("div", { className: containerClass, key: layout.name, style: containerStyle }, layout.item.sort(function (a, b) { return sortKey(a) - sortKey(b); }).map(function (item, idx) { var child = null; if (item.widget) { child = _this.renderWidget(item.widget, feature, editConfig, fields, updateField, nametransform, false); } else if (item.layout) { child = _this.renderLayout(item.layout, feature, editConfig, updateField, nametransform); } else if (item.spacer) { child = /*#__PURE__*/React.createElement("div", null); } else { return null; } return /*#__PURE__*/React.createElement("div", { key: "i" + idx, style: itemStyle(item, idx) }, child); })); }); _defineProperty(_this, "computeLayoutColumns", function (items) { var useIndex = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; var columns = []; var hasAuto = false; var hasSpacer = items.find(function (item) { var _item$spacer; return ((_item$spacer = item.spacer) === null || _item$spacer === void 0 || (_item$spacer = _item$spacer.property) === null || _item$spacer === void 0 ? void 0 : _item$spacer.orientation) === "Qt::Horizontal"; }); items.forEach(function (item, index) { var _item$spacer2, _item$widget; var col = useIndex ? index : parseInt(item.column, 10) || 0; var colSpan = useIndex ? 1 : parseInt(item.colspan, 10) || 1; if (((_item$spacer2 = item.spacer) === null || _item$spacer2 === void 0 || (_item$spacer2 = _item$spacer2.property) === null || _item$spacer2 === void 0 ? void 0 : _item$spacer2.orientation) === "Qt::Horizontal") { columns[col] = 'auto'; hasAuto = true; } else if (!hasSpacer && !hFitWidgets.includes((_item$widget = item.widget) === null || _item$widget === void 0 ? void 0 : _item$widget["class"]) && colSpan === 1) { columns[col] = 'auto'; hasAuto = true; } else { var _columns$col; columns[col] = (_columns$col = columns[col]) !== null && _columns$col !== void 0 ? _columns$col : null; // Placeholder replaced by fit-content below } }); var fit = 'fit-content(' + Math.round(1 / columns.length * 100) + '%)'; for (var col = 0; col < columns.length; ++col) { columns[col] = hasAuto ? columns[col] || fit : 'auto'; } return columns; }); _defineProperty(_this, "computeLayoutRows", function (items) { var useIndex = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; var rows = []; var hasSpacer = items.find(function (item) { var _item$spacer3; return ((_item$spacer3 = item.spacer) === null || _item$spacer3 === void 0 || (_item$spacer3 = _item$spacer3.property) === null || _item$spacer3 === void 0 ? void 0 : _item$spacer3.orientation) === "Qt::Vertical"; }); items.forEach(function (item, index) { var _item$spacer4, _item$widget2, _item$widget2$startsW, _item$widget$layout, _item$widget3, _item$widget5; var row = useIndex ? index : parseInt(item.row, 10) || 0; var rowSpan = useIndex ? 1 : parseInt(item.rowspan, 10) || 1; if (((_item$spacer4 = item.spacer) === null || _item$spacer4 === void 0 || (_item$spacer4 = _item$spacer4.property) === null || _item$spacer4 === void 0 ? void 0 : _item$spacer4.orientation) === "Qt::Vertical" || (_item$widget2 = item.widget) !== null && _item$widget2 !== void 0 && (_item$widget2 = _item$widget2.name) !== null && _item$widget2 !== void 0 && (_item$widget2$startsW = _item$widget2.startsWith) !== null && _item$widget2$startsW !== void 0 && _item$widget2$startsW.call(_item$widget2, "nrel_")) { rows[row] = 'auto'; } else if ((_item$widget$layout = (_item$widget3 = item.widget) === null || _item$widget3 === void 0 ? void 0 : _item$widget3.layout) !== null && _item$widget$layout !== void 0 ? _item$widget$layout : item.layout) { var _item$widget4, _item$layout; rows[row] = (_item$widget4 = item.widget) !== null && _item$widget4 !== void 0 && (_item$widget4 = _item$widget4.layout) !== null && _item$widget4 !== void 0 && _item$widget4.verticalFill || (_item$layout = item.layout) !== null && _item$layout !== void 0 && _item$layout.verticalFill ? 'auto' : null; // Placeholder replaced by fit-content below } else if (!hasSpacer && !vFitWidgets.includes((_item$widget5 = item.widget) === null || _item$widget5 === void 0 ? void 0 : _item$widget5["class"]) && rowSpan === 1) { rows[row] = 'auto'; } else { var _rows$row; rows[row] = (_rows$row = rows[row]) !== null && _rows$row !== void 0 ? _rows$row : null; // Placeholder replaced by fit-content below } }); var fit = 'fit-content(' + Math.round(1 / rows.length * 100) + '%)'; for (var row = 0; row < rows.length; ++row) { rows[row] = rows[row] || fit; } return rows; }); _defineProperty(_this, "renderWidget", function (widget, feature, editConfig, fields, updateField) { var _feature$properties$w, _feature$properties; var nametransform = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : function (name) { return name; }; var isRelWidget = arguments.length > 6 ? arguments[6] : undefined; var disabled = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : false; var value = (_feature$properties$w = (_feature$properties = feature.properties) === null || _feature$properties === void 0 ? void 0 : _feature$properties[widget.name]) !== null && _feature$properties$w !== void 0 ? _feature$properties$w : ""; var prop = widget.property || {}; if (String(prop.visible) === "false") { return null; } var attr = widget.attribute || {}; var fieldname = widget.name.replace(/kvrel__/, '').split("__")[isRelWidget ? 1 : 0]; var field = fields[fieldname]; var fieldConstraints = (field === null || field === void 0 ? void 0 : field.constraints) || {}; var inputConstraints = {}; inputConstraints.readOnly = _this.props.readOnly || String(prop.readOnly) === "true" || String(prop.enabled) === "false" || fieldConstraints.readOnly === true || disabled; inputConstraints.required = !inputConstraints.readOnly && (String(prop.required) === "true" || String(fieldConstraints.required) === "true"); inputConstraints.placeholder = prop.placeholderText || fieldConstraints.placeholder || ""; var fontProps = prop.font || {}; var fontStyle = { fontWeight: String(fontProps.bold) === "true" ? "bold" : "normal", fontStyle: String(fontProps.italic) === "true" ? "italic" : "normal", textDecoration: [String(fontProps.underline) === "true" ? "underline" : "", String(fontProps.strikeout) === "true" ? "line-through" : ""].join(" "), fontSize: Math.round((fontProps.pointsize || 9) / 9 * 100) + "%", textAlign: 'left' }; if (prop.alignment) { if (prop.alignment.includes("Qt::AlignRight")) { fontStyle.textAlign = 'right'; } else if (prop.alignment.includes("Qt::AlignCenter")) { fontStyle.textAlign = 'center'; } } var elname = undefined; if (widget.name.startsWith("ext__")) { updateField = null; value = _this.state.formData.externalFields[widget.name.slice(5)]; inputConstraints.readOnly = true; } else { elname = nametransform(widget.name); } if (widget["class"] === "QLabel") { if (widget.name.startsWith("img__")) { var _feature$properties$w2, _feature$properties2; value = (_feature$properties$w2 = (_feature$properties2 = feature.properties) === null || _feature$properties2 === void 0 ? void 0 : _feature$properties2[widget.name.split("__")[1]]) !== null && _feature$properties$w2 !== void 0 ? _feature$properties$w2 : widget.property.text; return /*#__PURE__*/React.createElement("div", { className: "qt-designer-form-image" }, /*#__PURE__*/React.createElement("a", { href: value, rel: "noreferrer", target: "_blank" }, /*#__PURE__*/React.createElement("img", { src: value }))); } else if (widget.name.startsWith("ext__")) { return /*#__PURE__*/React.createElement("div", { style: fontStyle }, value); } else { var text = widget.property.fieldLabel ? _this.translateFieldName(widget.property.text, editConfig.layerName) : widget.property.text; return /*#__PURE__*/React.createElement("div", { style: fontStyle }, text); } } else if (widget["class"] === "Line") { var _widget$property; var linetype = ((_widget$property = widget.property) === null || _widget$property === void 0 ? void 0 : _widget$property.orientation) === "Qt::Vertical" ? "vline" : "hline"; return /*#__PURE__*/React.createElement("div", { className: "qt-designer-form-" + linetype }); } else if (widget["class"] === "QFrame") { if (widget.property.visibilityExpression) { var exprResult = parseExpression(widget.property.visibilityExpression, feature, editConfig, _this.props.iface, _this.props.mapPrefix, _this.props.mapCrs, function () { return _this.setState({ reevaluate: +new Date() }); }); if (exprResult === false || exprResult === 0) { return null; } } return /*#__PURE__*/React.createElement("div", { className: "qt-designer-form-container" }, /*#__PURE__*/React.createElement("div", { className: "qt-designer-form-frame" }, widget.name.startsWith("nrel__") ? _this.renderNRelation(widget) : _this.renderLayout(widget.layout, feature, editConfig, updateField, nametransform))); } else if (widget["class"] === "QGroupBox") { if (widget.property.visibilityExpression) { var _exprResult = parseExpression(widget.property.visibilityExpression, feature, editConfig, _this.props.iface, _this.props.mapPrefix, _this.props.mapCrs, function () { return _this.setState({ reevaluate: +new Date() }); }); if (_exprResult === false || _exprResult === 0) { return null; } } return /*#__PURE__*/React.createElement("div", { className: "qt-designer-form-container" }, /*#__PURE__*/React.createElement("div", { className: "qt-designer-form-frame-title", style: fontStyle }, _this.translateFormString(prop.title, editConfig.layerName)), /*#__PURE__*/React.createElement("div", { className: "qt-designer-form-frame" }, widget.name.startsWith("nrel__") ? _this.renderNRelation(widget) : _this.renderLayout(widget.layout, feature, editConfig, updateField, nametransform))); } else if (widget["class"] === "QTabWidget") { var tabwidgets = (widget.widget || []).filter(function (child) { var exprResult = parseExpression(child.property.visibilityExpression, feature, editConfig, _this.props.iface, _this.props.mapPrefix, _this.props.mapCrs, function () { return _this.setState({ reevaluate: +new Date() }); }); return exprResult !== false && exprResult !== 0; }); if (isEmpty(tabwidgets)) { return null; } var activetab = _this.state.activetabs[widget.name] || tabwidgets[0].name; var tabs = tabwidgets.map(function (tab) { return { key: tab.name, label: _this.translateFormString(tab.attribute.title, editConfig.layerName) }; }); return /*#__PURE__*/React.createElement("div", { className: "qt-designer-form-container" }, /*#__PURE__*/React.createElement(ButtonBar, { active: activetab, buttons: tabs, className: "qt-designer-form-tabbar", onClick: function onClick(key) { return _this.setState(function (state) { return { activetabs: _objectSpread(_objectSpread({}, state.activetabs), {}, _defineProperty({}, widget.name, key)) }; }); } }), /*#__PURE__*/React.createElement("div", { className: "qt-designer-form-frame" }, tabwidgets.filter(function (child) { return child.layout; }).map(function (child) { return _this.renderLayout(child.layout, feature, editConfig, updateField, nametransform, child.name === activetab); }))); } else if (widget["class"] === "QTextEdit" || widget["class"] === "QTextBrowser" || widget["class"] === "QPlainTextEdit") { var _feature$properties$w3, _feature$properties3; if (((_feature$properties$w3 = (_feature$properties3 = feature.properties) === null || _feature$properties3 === void 0 ? void 0 : _feature$properties3[widget.name]) !== null && _feature$properties$w3 !== void 0 ? _feature$properties$w3 : null) === null) { var _ConfigUtils$getConfi; value = (_ConfigUtils$getConfi = ConfigUtils.getConfigProp("editTextNullValue")) !== null && _ConfigUtils$getConfi !== void 0 ? _ConfigUtils$getConfi : ""; } if (_this.props.report) { return /*#__PURE__*/React.createElement("div", { className: "qt-designer-form-textarea" }, value); } else { var addLinkAnchors = ConfigUtils.getConfigProp("editingAddLinkAnchors") !== false; return /*#__PURE__*/React.createElement(TextInput, _extends({ addLinkAnchors: addLinkAnchors, multiline: true, name: elname, onChange: function onChange(val) { return updateField(widget.name, val); } }, inputConstraints, { style: fontStyle, value: String(value) })); } } else if (widget["class"] === "QLineEdit") { if (widget.name.endsWith("__upload")) { var _feature$properties4; var fieldId = widget.name.replace(/__upload/, ''); var uploadValue = ((_feature$properties4 = feature.properties) === null || _feature$properties4 === void 0 ? void 0 : _feature$properties4[fieldId]) || ""; var uploadElName = elname.replace(/__upload/, ''); var constraints = { accept: prop.text || "", required: inputConstraints.required }; return /*#__PURE__*/React.createElement(EditUploadField, { constraints: constraints, dataset: editConfig.editDataset, disabled: inputConstraints.readOnly, fieldId: fieldId, iface: _this.props.iface, name: uploadElName, report: _this.props.report, updateField: updateField, value: uploadValue }); } else { var _feature$properties$w4, _feature$properties5; if (fieldConstraints.prec !== undefined && typeof value === 'number') { value = value.toFixed(fieldConstraints.prec); } else if (((_feature$properties$w4 = (_feature$properties5 = feature.properties) === null || _feature$properties5 === void 0 ? void 0 : _feature$properties5[widget.name]) !== null && _feature$properties$w4 !== void 0 ? _feature$properties$w4 : null) === null) { var _ConfigUtils$getConfi2; value = (_ConfigUtils$getConfi2 = ConfigUtils.getConfigProp("editTextNullValue")) !== null && _ConfigUtils$getConfi2 !== void 0 ? _ConfigUtils$getConfi2 : ""; } if (_this.props.report) { return /*#__PURE__*/React.createElement("div", { style: fontStyle }, value || inputConstraints.placeholder); } else { var _addLinkAnchors = ConfigUtils.getConfigProp("editingAddLinkAnchors") !== false; var editTextNullValue = ConfigUtils.getConfigProp("editTextNullValue"); return /*#__PURE__*/React.createElement(TextInput, _extends({ addLinkAnchors: _addLinkAnchors, clearValue: editTextNullValue, name: elname, onChange: function onChange(val) { return updateField(widget.name, val); } }, inputConstraints, { style: fontStyle, value: String(value) })); } } } else if (widget["class"] === "QCheckBox" || widget["class"] === "QRadioButton") { var _this$props$feature$p; var type = widget["class"] === "QCheckBox" ? "checkbox" : "radio"; var inGroup = attr.buttonGroup; var checked = inGroup ? ((_this$props$feature$p = _this.props.feature.properties) === null || _this$props$feature$p === void 0 ? void 0 : _this$props$feature$p[_this.groupOrName(widget)]) === widget.name : value; return /*#__PURE__*/React.createElement("label", { style: fontStyle }, /*#__PURE__*/React.createElement("input", _extends({ checked: checked, disabled: inputConstraints.readOnly, name: nametransform(_this.groupOrName(widget)), onChange: function onChange(ev) { return updateField(_this.groupOrName(widget), inGroup ? widget.name : ev.target.checked); } }, inputConstraints, { type: type, value: widget.name })), widget.property.text); } else if (widget["class"] === "QComboBox") { var parts = widget.name.split("__"); if ((parts.length === 5 || parts.length === 6) && parts[0] === "kvrel") { var _fieldId2; // kvrel__attrname__datatable__keyfield__valuefield // kvrel__reltablename__attrname__datatable__keyfield__valuefield var count = parts.length; var _fieldId = parts.slice(1, count - 3).join("__"); value = (_fieldId2 = (feature.properties || [])[_fieldId]) !== null && _fieldId2 !== void 0 ? _fieldId2 : ""; var keyvalrel = _this.props.mapPrefix + "." + parts[count - 3] + ":" + parts[count - 2] + ":" + parts[count - 1]; var filterExpr = null; if (field !== null && field !== void 0 && field.filterExpression) { filterExpr = parseExpression(field.filterExpression, feature, editConfig, _this.props.iface, _this.props.mapPrefix, _this.props.mapCrs, function () { return _this.setState({ reevaluate: +new Date() }); }, true); } return /*#__PURE__*/React.createElement(EditComboField, { editIface: _this.props.iface, fieldId: _fieldId, filterExpr: filterExpr, key: _fieldId, keyvalrel: keyvalrel, multiSelect: widget.property.allowMulti === true || widget.allowMulti === "true", name: nametransform(_fieldId), placeholder: inputConstraints.placeholder, readOnly: inputConstraints.readOnly || fieldConstraints.readOnly, required: inputConstraints.required || fieldConstraints.required, style: fontStyle, updateField: updateField, value: value }); } else { var values = MiscUtils.ensureArray(widget.item || []).map(function (item) { var _item$property$value; return { label: item.property.text, value: (_item$property$value = item.property.value) !== null && _item$property$value !== void 0 ? _item$property$value : item.property.text }; }); return /*#__PURE__*/React.createElement(EditComboField, { editIface: _this.props.iface, fieldId: widget.name, key: widget.name, name: elname, placeholder: inputConstraints.placeholder, readOnly: inputConstraints.readOnly || inputConstraints.readOnly, required: inputConstraints.required || inputConstraints.required, style: fontStyle, updateField: updateField, value: value, values: values }); } } else if (widget["class"] === "QSpinBox" || widget["class"] === "QDoubleSpinBox" || widget["class"] === "QSlider") { var _prop$minimum, _prop$maximum, _ref, _prop$singleStep, _prop$decimals; var floatConstraint = function floatConstraint(x) { var f = parseFloat(x); return isNaN(f) ? undefined : f; }; var min = floatConstraint((_prop$minimum = prop.minimum) !== null && _prop$minimum !== void 0 ? _prop$minimum : fieldConstraints.min); var max = floatConstraint((_prop$maximum = prop.maximum) !== null && _prop$maximum !== void 0 ? _prop$maximum : fieldConstraints.max); var step = (_ref = (_prop$singleStep = prop.singleStep) !== null && _prop$singleStep !== void 0 ? _prop$singleStep : fieldConstraints.step) !== null && _ref !== void 0 ? _ref : 1; var precision = (_prop$decimals = prop.decimals) !== null && _prop$decimals !== void 0 ? _prop$decimals : 0; if (widget["class"] === "QSlider") { return /*#__PURE__*/React.createElement("input", _extends({ max: max, min: min, name: elname, onChange: function onChange(ev) { return updateField(widget.name, ev.target.value); } }, inputConstraints, { size: 5, step: step, style: fontStyle, type: "range", value: value })); } else { var _feature$properties6; return /*#__PURE__*/React.createElement(NumberInput, _extends({ decimals: precision, max: max, min: min, name: elname, onChange: function onChange(val) { return updateField(widget.name, val); } }, inputConstraints, { step: step, style: fontStyle, value: (_feature$properties6 = feature.properties) === null || _feature$properties6 === void 0 ? void 0 : _feature$properties6[widget.name] })); } } else if (widget["class"] === "QDateEdit") { var _min = prop.minimumDate ? _this.dateConstraint(prop.minimumDate) : "1600-01-01"; var _max = prop.maximumDate ? _this.dateConstraint(prop.maximumDate) : "9999-12-31"; return /*#__PURE__*/React.createElement("input", _extends({ max: _max, min: _min, name: elname, onChange: function onChange(ev) { return updateField(widget.name, ev.target.value); } }, inputConstraints, { style: fontStyle, type: "date", value: value })); } else if (widget["class"] === "QTimeEdit") { return /*#__PURE__*/React.createElement("input", _extends({ name: elname, onChange: function onChange(ev) { return updateField(widget.name, ev.target.value); } }, inputConstraints, { style: fontStyle, type: "time", value: value })); } else if (widget["class"] === "QDateTimeEdit") { var _min2 = prop.minimumDate ? _this.dateConstraint(prop.minimumDate) : "1600-01-01"; var _max2 = prop.maximumDate ? _this.dateConstraint(prop.maximumDate) : "9999-12-31"; return /*#__PURE__*/React.createElement(DateTimeInput, { maxDate: _max2, minDate: _min2, name: elname, onChange: function onChange(val) { return updateField(widget.name, val); }, readOnly: inputConstraints.readOnly, required: inputConstraints.required, style: fontStyle, value: value }); } else if (widget["class"] === "QWidget") { if (widget.name.startsWith("nrel__")) { return _this.renderNRelation(widget); } else if (widget.name.startsWith("ext__")) { return value; } else { return _this.renderLayout(widget.layout, feature, editConfig, updateField, nametransform); } } else if (widget["class"] === "QPushButton") { if (widget.name.startsWith("btn__") && widget.onClick) { return /*#__PURE__*/React.createElement("button", { className: "button", disabled: inputConstraints.readOnly, onClick: function onClick() { return widget.onClick(_this.props.setFormBusy); }, type: "button" }, widget.property.text); } else if (widget.name.startsWith("featurelink__")) { var _parts = widget.name.split("__"); // featurelink__layer__attrname // featurelink__layer__reltable__attrname if (_parts.length === 3 || _parts.length === 4) { var _feature$properties7; var layer = _parts[1]; var reltable = _parts.length === 4 ? _parts[2] : ""; var attrname = _parts.slice(2).join("__"); value = (_feature$properties7 = feature.properties) === null || _feature$properties7 === void 0 ? void 0 : _feature$properties7[attrname]; if (layer === reltable) { var index = parseInt(nametransform("").split("__")[1], 10); // Ugh.. var reldataset = _this.props.mapPrefix + "." + reltable; var displayField = attrname.split("__")[1]; if (feature.__status__ !== "empty") { var featurebuttons = [{ key: 'Edit', icon: 'editing', label: String(value !== null && value !== void 0 ? value : "") }]; return /*#__PURE__*/React.createElement("div", { className: "qt-designer-form-featurelink-buttons" }, /*#__PURE__*/React.createElement(ButtonBar, { buttons: featurebuttons, forceLabel: true, onClick: function onClick() { return _this.props.editRelationRecord('Edit', reltable, reldataset, index, displayField); } })); } else { var _featurebuttons = []; if (feature.geometry !== null) { _featurebuttons.push({ key: 'Pick', icon: 'pick', label: LocaleUtils.tr("common.pick") }); } _featurebuttons.push({ key: 'Create', icon: 'editdraw', label: LocaleUtils.tr("editing.create") }); return /*#__PURE__*/React.createElement(ButtonBar, { buttons: _featurebuttons, forceLabel: true, onClick: function onClick(action) { return _this.props.editRelationRecord(action, reltable, reldataset, index, displayField); } }); } } else { if (value !== null) { var _featurebuttons2 = [{ key: 'Edit', icon: 'editing', label: String(value !== null && value !== void 0 ? value : "") }]; return /*#__PURE__*/React.createElement("div", { className: "qt-designer-form-featurelink-buttons" }, /*#__PURE__*/React.createElement(ButtonBar, { buttons: _featurebuttons2, onClick: function onClick() { return _this.props.switchEditContext('Edit', layer, value, function (v) { return updateField(attrname, v); }, attrname); } }), /*#__PURE__*/React.createElement("button", { className: "button", onClick: function onClick() { return updateField(attrname, null); }, type: "button" }, /*#__PURE__*/React.createElement(Icon, { icon: "clear" }))); } else { var _featurebuttons3 = [{ key: 'Pick', icon: 'pick', label: LocaleUtils.tr("common.pick") }, { key: 'Create', icon: 'editdraw', label: LocaleUtils.tr("editing.create") }]; return /*#__PURE__*/React.createElement(ButtonBar, { buttons: _featurebuttons3, onClick: function onClick(action) { return _this.props.switchEditContext(action, layer, null, function (v) { return updateField(attrname, v); }, attrname); } }); } } } } } else if (widget["class"] === "QStackedWidget") { return _this.renderLayout(widget.widget[parseInt(widget.property.currentIndex, 10)].layout, feature, editConfig, updateField, nametransform); } return null; }); _defineProperty(_this, "renderNRelation", function (widget) { var _widget$property2, _editConfig$fields, _this$props$feature$r; var parts = widget.name.split("__"); if (parts.length < 3) { return null; } var disabled = String((_widget$property2 = widget.property) === null || _widget$property2 === void 0 ? void 0 : _widget$property2.enabled) === "false"; var tablename = parts[1]; var sortcol = parts[3] || null; var noreorder = parts[4] || false; var headerItems = widget.layout.item.filter(function (item) { return item.widget && item.widget.name.startsWith("header__"); }).sort(function (a, b) { return a.column - b.column; }); var widgetItems = widget.layout.item.filter(function (item) { return !item.widget || !item.widget.name.startsWith("header__"); }).sort(function (a, b) { return a.column - b.column; }); var tableFitWidgets = ["QLabel", "QCheckBox", "QRadioButton", "QDateTimeEdit", "QDateEdit", "QTimeEdit"]; var columnStyles = widgetItems.map(function (item) { return item.widget && tableFitWidgets.includes(item.widget["class"]) ? { width: '1px' } : {}; }); var editConfig = _this.props.editConfigs[_this.props.mapPrefix][tablename]; if (!editConfig) { // Relation dataset not permitted / no edit config available return null; } var relDataset = editConfig.editDataset; var fields = ((_editConfig$fields = editConfig.fields) !== null && _editConfig$fields !== void 0 ? _editConfig$fields : []).reduce(function (res, field) { return _objectSpread(_objectSpread({}, res), {}, _defineProperty({}, field.id, field)); }, {}); return /*#__PURE__*/React.createElement("div", { className: "qt-designer-widget-relation" }, /*#__PURE__*/React.createElement("div", { className: "qt-designer-widget-relation-table-container" }, !_this.props.feature.relationValues ? /*#__PURE__*/React.createElement("div", { className: "qt-designer-widget-relation-table-loading" }, /*#__PURE__*/React.createElement(Spinner, null)) : null, /*#__PURE__*/React.createElement("table", null, /*#__PURE__*/React.createElement("tbody", null, !isEmpty(headerItems) ? /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("th", null), headerItems.map(function (item) { return /*#__PURE__*/React.createElement("th", { key: item.widget.name }, item.widget.property.text); }), /*#__PURE__*/React.createElement("th", null)) : null, (((_this$props$feature$r = _this.props.feature.relationValues) === null || _this$props$feature$r === void 0 || (_this$props$feature$r = _this$props$feature$r[relDataset]) === null || _this$props$feature$r === void 0 ? void 0 : _this$props$feature$r.features) || []).map(function (feature, idx) { var updateField = function updateField(name, value) { var fieldname = name.slice(tablename.length + 2); // Strip <tablename>__ prefix _this.props.updateRelationField(relDataset, idx, fieldname, value); }; var nametransform = function nametransform(name) { return name + "__" + idx; }; var status = feature.__status__ || ""; var relFeature = _objectSpread(_objectSpread({}, feature), {}, { properties: Object.entries(feature.properties).reduce(function (res, _ref2) { var _ref3 = _slicedToArray(_ref2, 2), key = _ref3[0], value = _ref3[1]; return _objectSpread(_objectSpread({}, res), {}, _defineProperty({}, tablename + "__" + key, value)); }, {}) }); var statusIcon = null; if (status === "empty") { // Pass } else if (status === "new") { statusIcon = "new"; } else if (status) { statusIcon = "edited"; } var statusText = ""; if (feature.error) { statusIcon = "warning"; statusText = _this.buildErrMsg(feature); } var extraClass = status.startsWith("deleted") ? "qt-designer-widget-relation-record-deleted" : ""; return /*#__PURE__*/React.createElement("tr", { className: "qt-designer-widget-relation-record " + extraClass, key: relDataset + idx }, /*#__PURE__*/React.createElement("td", { className: "qt-designer-widget-relation-record-icon" }, statusIcon ? /*#__PURE__*/React.createElement(Icon, { icon: statusIcon, title: statusText }) : null), widgetItems.map(function (item, widx) { if (item.widget) { return /*#__PURE__*/React.createElement("td", { className: "qt-designer-widget-relation-row-widget", key: item.widget.name, style: columnStyles[widx] }, _this.renderWidget(item.widget, relFeature, editConfig, fields, updateField, nametransform, true, disabled)); } else if (item.spacer) { return /*#__PURE__*/React.createElement("td", { key: "spacer_" + widx }); } else { return null; } }), !_this.props.readOnly && !disabled && sortcol && !noreorder ? /*#__PURE__*/React.createElement("td", null, /*#__PURE__*/React.createElement(Icon, { icon: "chevron-up", onClick: function onClick() { return _this.props.reorderRelationRecord(relDataset, idx, -1); } }), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement(Icon, { icon: "chevron-down", onClick: function onClick() { return _this.props.reorderRelationRecord(relDataset, idx, 1); } })) : null, !_this.props.readOnly && !disabled ? /*#__PURE__*/React.createElement("td", { className: "qt-designer-widget-relation-record-icon" }, /*#__PURE__*/React.createElement(Icon, { icon: "trash", onClick: function onClick() { return _this.props.removeRelationRecord(relDataset, idx); } })) : null); })))), !_this.props.readOnly ? /*#__PURE__*/React.createElement("div", { className: "qt-designer-widget-relation-buttons" }, /*#__PURE__*/React.createElement("button", { className: "button qt-designer-widget-relation-add", disabled: !_this.props.feature.relationValues, onClick: function onClick(ev) { return _this.addRelationRecord(ev, relDataset); }, type: "button" }, LocaleUtils.tr("editing.add"))) : null, /*#__PURE__*/React.createElement("div", { className: "qt-designer-widget-relation-resize-handle", onPointerDown: _this.startRelationTableResize })); }); _defineProperty(_this, "addRelationRecord", function (ev, datasetname) { _this.setState({ relationAddPressed: ev.target }); _this.props.addRelationRecord(datasetname); }); _defineProperty(_this, "startRelationTableResize", function (ev) { var container = ev.target.parentElement.parentElement; if (!container) { return; } var startHeight = container.offsetHeight; var startMouseY = ev.clientY; var resizeInput = function resizeInput(event) { container.style.height = Math.max(30, startHeight + (event.clientY - startMouseY)) + 'px'; }; ev.view.document.body.style.userSelect = 'none'; ev.view.addEventListener("pointermove", resizeInput); ev.view.addEventListener("pointerup", function () { ev.view.document.body.style.userSelect = ''; ev.view.removeEventListener("pointermove", resizeInput); }, { once: true }); }); _defineProperty(_this, "groupOrName", function (widget) { return widget.attribute && widget.attribute.buttonGroup ? widget.attribute.buttonGroup._ : widget.name; }); _defineProperty(_this, "dateConstraint", function (constr) { return constr.year + "-" + ("0" + constr.month).slice(-2) + "-" + ("0" + constr.day).slice(-2); }); _defineProperty(_this, "parseForm", function (data) { var loadingReqId = uuidv4(); _this.setState({ loading: true, loadingReqId: loadingReqId }, function () { var parserOpts = { isArray: function isArray() { return false; }, ignoreAttributes: false, attributeNamePrefix: "" }; var json = new XMLParser(parserOpts).parse(data); var relationTables = {}; var externalFields = {}; var widgets = {}; var fields = {}; var buttons = {}; var nrels = {}; var counters = { widget: 0, layout: 0 }; _this.reformatWidget(json.ui.widget, relationTables, fields, buttons, nrels, externalFields, widgets, counters); // console.log(json); json.externalFields = externalFields; json.widgets = widgets; json.fields = fields; json.buttons = buttons; json.nrels = nrels; if (FormPreprocessors[_this.props.editConfig.editDataset]) { FormPreprocessors[_this.props.editConfig.editDataset](json, _this.props.feature, function (formData) { if (_this.state.loadingReqId === loadingReqId) { _this.setState({ formData: formData, loading: false, loadingReqId: null }); } }); } else { _this.setState({ formData: json, loading: false, loadingReqId: null }); } _this.props.setRela