Commit 08074efd authored by 覃振观's avatar 覃振观 👶

23-12-15: 下班前提交

parent 5dfc4510
......@@ -17,26 +17,19 @@ function mapping(dataMapping, rawData) {
let entitySet = Object.entries(dataMapping);
let returnData = {};
tryForEach(entitySet,(entity) => {
let beanName = entity[0];
let beanName = entity[0], propertyNames = entity[1], entityData = rawData[beanName];
if(!isExist(rawData, beanName)) { throw {}; }
let entityData = rawData[beanName];
let propertyNames = entity[1];
if(propertyNames instanceof Array) {
// Form 时执行此逻辑
tryForEach(propertyNames,(item) => {
if(typeof item === "string") {
if(!isExist(entityData, item, beanName)) { throw {}; }
associate(entityData, item, item, beanName,mapper, returnData);
return;
} else if(item instanceof Array) {
// Grid需要单独赋值,这里不设置returnData. 页面Input有足够的映射信息,这里只记录 property: objName
tryForEach(item, (property) => {
mapper[property] = beanName;
});
return;
} else if(item instanceof Object) {
let entry = Object.entries(item)[0];
let property = entry[0];
let property = entry[0], alias = entry[1];
if(!isExist(entityData, property, beanName)) { throw {}; }
let alias = entry[1];
associate(entityData, property, alias, beanName,mapper, returnData)
} else {
console.error('The configuration of "'+item+'" in "'+beanName+'" is not recognized, and the required,' +
......@@ -44,6 +37,21 @@ function mapping(dataMapping, rawData) {
throw {};
}
});
} else if(propertyNames instanceof Object) {
// Grid 时执行此逻辑
let listMap = {}, ids = [];
entityData.forEach(rowData => {
let id = rowData[propertyNames.id];
listMap.id = rowData;
ids.push(id);
tryForEach(propertyNames.columns, (property) => {
mapper[property] = {};
mapper[property][id] = beanName;
});
})
return;
}
});
dataMapping.Mapper = mapper;
// ---------------- 暂不处理无法执行到此处的情况 ----------------
......@@ -79,7 +87,7 @@ function testTryForEach() {
}
}
var tryForEach = function(arrayObj, callback) {
const tryForEach = function(arrayObj, callback) {
try {
arrayObj.forEach(callback);
} catch { }
......@@ -107,47 +115,116 @@ function isExist(obj, property, objName) {
return true;
}
// 监听 input 管理页面显示的 Data,提交数据时,只提交修改过的 Data
/**
* 监听 input 管理页面显示的 Data。
*/
function inputEventListener() {
const inputElements = document.querySelectorAll('input');
inputElements.forEach(item => {
item.addEventListener('input', (event) => {
listenerContent(event);
});
});
}
/**
* 监听器动作: 根据 保存的映射关系,将页面元素值填入到 newData
* @param event
*/
function listenerContent(event) {
let mapper = window.dataMapping.Mapper;
let property = event.target.getAttribute('name');
let beanMapping = mapper[property];
if(!beanMapping) {
console.error("The configuration was not found in the 'dataMapping' : '"+property+"'")
}
let newData = window.dataSet.newData;
// Grid 时执行此逻辑 此处根据页面 editor 元素 Id 匹配。出现异常请检查该元素 Id 生成规则是否发生变化
if(typeof beanMapping === "string") {
debugger;
let eleId = event.currentTarget.id;
let labels = eleId.split('_');
if(labels[0].indexOf(beanMapping) < 0) {
console.error('页面配置的gridId "'+labels[0]+'" 与映射配置中的 "'+beanMapping+'" 不匹配! 注意匹配规则为: elementId.indexOf(' +
' Mapping.ArrayKey )');
} else {
newData[beanMapping][labels[2]][labels[1]] = event.target.value;
console.log('Input value changed:', event.target.value);
}
return;
}
// Form 时执行此逻辑
if(beanMapping instanceof Object) {
mappings = Object.entries(beanMapping);
let mappings = Object.entries(beanMapping);
tryForEach(mappings, (entry) => {
let beanName = entry[0];
let property = entry[1];
let newData = window.dataSet.newData;
newData[beanName][property] = event.target.value;
console.log('Input value changed:', event.target.value);
})
}
}
});
});
/**
* 添加 DOM 监听
* @param eleId 监听的 root 元素 ID
*/
function addObserver(eleId) {
observer.observe(document.querySelector(eleId), mutationConfig);
}
/**
* 监听 DOM ,为编辑框添加 Input 监听
* @type {MutationObserver}
*/
const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
if(mutation.type === 'childList') {
let addNodes = mutation.addedNodes;
if(addNodes.length === 1 && addNodes[0].nodeName === 'DIV') {
let childNodes = addNodes[0].childNodes;
if(childNodes.length === 1 && childNodes[0].nodeName === 'INPUT') {
let node = childNodes[0];
node.addEventListener('input', gridEditor)
}
}
let removeNodes = mutation.removedNodes;
if(removeNodes.length === 1 && removeNodes[0].nodeName === 'INPUT') {
let node = removeNodes[0];
node.removeEventListener('input', gridEditor);
}
}
})
})
const gridEditor = function(event) {
listenerContent(event);
}
// console.log('属性变化节点 : ' + mutation.target);
// console.log('变化属性名 : ' + mutation.attributeName);
// console.log('变化属性值 : ' + mutation.target.value);
const mutationConfig = { attributes: true, childList: true, subtree: true}
function checkUpdata() {
let rawData = window.dataSet.rawData;
let newData = window.dataSet.newData;
window.dataSet.upData = {};
let rawEntry = Object.entries(rawData);
rawEntry.forEach(raw => {
let beanName = raw[0];
let rawHash = getHashCode(JSON.stringify(rawData[beanName]));
let newHash = getHashCode(JSON.stringify(newData[beanName]));
tryForEach(rawEntry, entry => {
let beanName = entry[0];
debugger;
let raw = rawData[beanName];
let now = newData[beanName];
if(raw instanceof Array) {
debugger;
return;
} else if (raw instanceof Object) {
let rawHash = getHashCode(JSON.stringify(raw));
let newHash = getHashCode(JSON.stringify(now));
if(!(rawHash === newHash)) {
window.dataSet.upData[beanName] = newData[beanName];
}
}
})
}
......@@ -158,8 +235,20 @@ function checkUpdata() {
* @returns {*}
*/
function listeningGrid(elId, options) {
let dataMapping = window.dataMapping;
debugger;
const originalOnBeforeEdit = options.onBeforeEdit;
options.onBeforeEdit = function(editParm){
originalOnBeforeEdit.call(this, editParm);
let domIds = editParm.column.__domid.split('|');
let columnindex = editParm.column.columnindex;
let recordId = editParm.record.__id;
let rowId = domIds[0]+'|'+columnindex+'|'+recordId+'|'+domIds[2];
debugger;
}
addObserver(elId);
return UICtrl.grid(elId, options);
}
/**
......@@ -189,28 +278,3 @@ function getHashCode (str, caseSensitive) {
return (hash ^ hash2 ^ hash3 >> 3 ) & 0x7FFFFFFF;
}
}
function addObserver(eleId) {
observer.observe(document.querySelector(eleId), mutationConfig);
}
// 补充方案 监听 Value 属性
const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
if(mutation.type === 'childList') {
let addNodes = mutation.addedNodes;
if(addNodes.length == 1 && addNodes[0].nodeName === 'DIV') {
let childNodes = addNodes[0].childNodes;
if(childNodes.length == 1 && childNodes[0].nodeName === 'INPUT') {
let node = childNodes[0];
debugger;
console.log('属性变化节点 : ' + mutation.target);
console.log('变化属性名 : ' + mutation.attributeName);
console.log('变化属性值 : ' + mutation.target.value);
}
}
}
})
})
const mutationConfig = { attributes: true, childList: true, subtree: true}
\ No newline at end of file
......@@ -46,7 +46,9 @@ function faceGrid(elId, data) {
type: 'text',
required: true
}},
{ display: "油墨覆盖率(%)", name: "coverageRate", width: 120, minWidth: 60, type: "string", align: "left", editor: { type: 'text', required: true } }
{ display: "油墨覆盖率(%)", name: "coverageRate", width: 120, minWidth: 60, type: "string", align: "left", editor: { type: 'text', required: true } },
{ name: "colorId", hide: true },
{ name: "colorId" }
],
toolbar: toolbarOptions,
dataType: "local",
......@@ -58,7 +60,9 @@ function faceGrid(elId, data) {
height: 150,
onAfterEdit: function(editParm) {
// 后备方案: 表格遍历完成时
debugger;
},
onBeforeEdit : function(editParm) {
console.log('original run onBeforeEdit()');
},
onDblClickRow : function(data, rowindex, rowobj) {
......@@ -107,16 +111,19 @@ function loadDataTest() {
$('#submitForm').formSet(showData);
var fronData = {};
fronData.Rows = data.rawData.fronColors;
faceGrid("#frontFaceGrid", fronData);
faceGrid("#fronColorsGrid", fronData);
fronData.Rows = data.backColors;
faceGrid("#backFaceGrid", fronData);
faceGrid("#backColorsGrid", fronData);
inputEventListener();
});
}
// 数据映射配置
// alias 必须唯一.这里不再要求所有对象的属性名唯一 { property : alias }
// Form: 映射数据格式为elementName(alias): { objName: property }
// alias必须唯一.这里不再要求所有对象的属性名唯一 { property : alias }
// 未设 alias 情况同 { property : property }
// Form 映射数据格式为: elementName(alias): { objName: property }
// Grid: 需要监听 Grid Data 时,必须设置 唯一 id 列。
// 匹配规则 elementId.indexOf( dataMapping.ArrayKey )
// 即当前页面 ‘fronColorsGrid’.indexOf('fronColors')
var dataMapping = {
Product: [
"productId"
......@@ -136,9 +143,11 @@ var dataMapping = {
"rowNum"
, "modulus"
],
fronColors: [
[ "productFaceColorId", "coverageRate" ]
]
fronColors: {
id: "productFaceColorId",
columns: [ "productFaceColorId", "coverageRate" ]
}
}
......
......@@ -87,11 +87,11 @@
<div id="layout" style="height: 280px; display: contents;">
<div position="left" title="正面颜色" >
<div id="frontFaceGrid" style="margin: 2px;"></div>
<div id="fronColorsGrid" style="margin: 2px;"></div>
</div>
<div position="right" title="反面颜色">
<div id="backFaceGrid" style="margin: 2px;"></div>
<div id="backColorsGrid" style="margin: 2px;"></div>
</div>
</div>
......
......@@ -113,6 +113,7 @@ public class ProductApplicationImpl implements ProductApplication {
} else {
ProductFaceColor fc = new ProductFaceColor();
fc.setProductFaceColorId(111L);
fc.setColorId(1L);
ArrayList<ProductFaceColor> fronColors = new ArrayList<>();
fronColors.add(fc);
assemble.put("fronColors", fronColors);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment