Javascript 未在UI上更新bpmn属性面板的服务任务下对委托项的更改
我正在尝试修改“常规”选项卡“类型服务任务”下的“详细信息”部分 我想要什么? 我试图实现,当用户选择实现类型为JavaClass时,我会显示一个代表字段的下拉列表,而不是一个文本框,在除JavaClass之外的任何其他选择上,它都应该是文本框 稍后,我想将动态数据加载到下拉列表中 我尝试了什么? 我尝试了以下两种方法 1:编辑文件以获取另一个存储entryFactory.selectBox的变量,并且在type==类上返回模块中新创建的选择框。否则返回默认文本框Javascript 未在UI上更新bpmn属性面板的服务任务下对委托项的更改,javascript,workflow,camunda,bpmn.io,Javascript,Workflow,Camunda,Bpmn.io,我正在尝试修改“常规”选项卡“类型服务任务”下的“详细信息”部分 我想要什么? 我试图实现,当用户选择实现类型为JavaClass时,我会显示一个代表字段的下拉列表,而不是一个文本框,在除JavaClass之外的任何其他选择上,它都应该是文本框 稍后,我想将动态数据加载到下拉列表中 我尝试了什么? 我尝试了以下两种方法 1:编辑文件以获取另一个存储entryFactory.selectBox的变量,并且在type==类上返回模块中新创建的选择框。否则返回默认文本框 module.exports
module.exports = function(element, bpmnFactory, options) {
var getImplementationType = options.getImplementationType,
getBusinessObject = options.getBusinessObject;
var delegateEntrySelect = entryFactory.selectBox({
id: 'delegate',
label: 'Value',
selectOptions: [
{value:"one",name:"one"},{value:"two",name:"two"}
],
modelProperty: 'delegate',
emptyParameter: false,
get: function(element, node) {
var bo = getBusinessObject(element);
var type = getImplementationType(element);
var attr = getAttribute(type);
var label = getDelegationLabel(type);
return {
delegate: bo.get(attr),
delegationLabel: label
};
},
set: function(element, values, node) {
var bo = getBusinessObject(element);
var prop = {};
prop[attr] = values.delegate || '';
return cmdHelper.updateBusinessObject(element, bo, prop);
},
validate: function(element, values, node) {
return isDelegate(getImplementationType(element)) && !values.delegate ? { delegate: 'Must provide a value' } : {};
}
});
var delegateEntry = entryFactory.textField({
id: 'delegate',
label: 'Value',
dataValueLabel: 'delegationLabel',
modelProperty: 'delegate',
get: function(element, node) {
var bo = getBusinessObject(element);
var type = getImplementationType(element);
var attr = getAttribute(type);
var label = getDelegationLabel(type);
return {
delegate: bo.get(attr),
delegationLabel: label
};
},
set: function(element, values, node) {
var bo = getBusinessObject(element);
var type = getImplementationType(element);
var attr = getAttribute(type);
var prop = {};
prop[attr] = values.delegate || '';
return cmdHelper.updateBusinessObject(element, bo, prop);
},
validate: function(element, values, node) {
return isDelegate(getImplementationType(element)) && !values.delegate ? { delegate: 'Must provide a value' } : {};
}
});
var eleTOReturn = (getImplementationType(element) && getImplementationType(element) == "class") ? delegateEntrySelect : delegateEntry
console.log("returning ele",eleTOReturn)
return [ eleTOReturn ];
};
我在输出中得到的是:
2:同时通过了selectBox和default文本框,但在禁用条件下对其进行了区分,如
答:选择框(!isDelegate(getImplementationType(element))| |(isDelegate(getImplementationType(element))&&type!=“class”))
b:textBox(!isDelegate(getImplementationType(element))| |(isDelegate(getImplementationType(element))&&type==“class”))
在这两种情况下,JS代码都执行得很好,在第60行内的group.entries变量下可以看到相同的代码,但它们不会反映在UI上
Delegate.js代码如下所示
module.exports = function(element, bpmnFactory, options) {
var getImplementationType = options.getImplementationType,
getBusinessObject = options.getBusinessObject;
var delegateEntrySelect = entryFactory.selectBox({
id: 'delegate',
label: 'Value',
selectOptions: [
{value:"one",name:"one"},{value:"two",name:"two"}
],
modelProperty: 'delegate',
emptyParameter: false,
get: function(element, node) {
var bo = getBusinessObject(element);
var type = getImplementationType(element);
var attr = getAttribute(type);
var label = getDelegationLabel(type);
return {
delegate: bo.get(attr),
delegationLabel: label
};
},
set: function(element, values, node) {
var bo = getBusinessObject(element);
var prop = {};
prop[attr] = values.delegate || '';
return cmdHelper.updateBusinessObject(element, bo, prop);
},
validate: function(element, values, node) {
return isDelegate(getImplementationType(element)) && !values.delegate ? { delegate: 'Must provide a value' } : {};
},
disabled: function(element, node) {
var type = getImplementationType(element);
console.log("SELECT DISABLE",(!isDelegate(getImplementationType(element)) || (isDelegate(getImplementationType(element)) && type !== "class")))
return (!isDelegate(getImplementationType(element)) || (isDelegate(getImplementationType(element)) && type !== "class"));
}
});
var delegateEntry = entryFactory.textField({
id: 'delegate',
label: 'Value',
dataValueLabel: 'delegationLabel',
modelProperty: 'delegate',
get: function(element, node) {
var bo = getBusinessObject(element);
var type = getImplementationType(element);
var attr = getAttribute(type);
var label = getDelegationLabel(type);
return {
delegate: bo.get(attr),
delegationLabel: label
};
},
set: function(element, values, node) {
var bo = getBusinessObject(element);
var type = getImplementationType(element);
var attr = getAttribute(type);
var prop = {};
prop[attr] = values.delegate || '';
return cmdHelper.updateBusinessObject(element, bo, prop);
},
validate: function(element, values, node) {
return isDelegate(getImplementationType(element)) && !values.delegate ? { delegate: 'Must provide a value' } : {};
},
disabled: function(element, node) {
var type = getImplementationType(element);
console.log("TEXT DISABLE",(!isDelegate(getImplementationType(element)) || (isDelegate(getImplementationType(element)) && type === "class")))
return (!isDelegate(getImplementationType(element)) || (isDelegate(getImplementationType(element)) && type === "class"));
}
});
return [ delegateEntrySelect, delegateEntry ];
};
我在输出中得到的是
有人能帮我吗
谢谢通过在delegate.js旁边为选择框添加一个不同的文件delegateSelect.js,然后在serviceTaskDelegateProps.js中将其注册为
group.entries = group.entries.concat(delegateSelect(element, bpmnFactory, {
getBusinessObject: getBusinessObject,
getImplementationType: getImplementationType,
hideDelegateSelect: function(element, node) {
console.log(getImplementationType(element) !== 'class',"SELECT")
return getImplementationType(element) !== 'class';
}
}));
group.entries = group.entries.concat(delegate(element, bpmnFactory, {
getBusinessObject: getBusinessObject,
getImplementationType: getImplementationType,
hideDelegateText: function(element, node) {
console.log(getImplementationType(element) === 'class',"TEXT")
return getImplementationType(element) === 'class';
}
}));
在各自的委派和委派中,选择将残疾人视为
disabled: function(element, node) {
if (typeof hideDelegateText === 'function') {
return hideDelegateText.apply(delegateEntry, arguments);
}
}
disabled: function(element, node) {
if (typeof hideDelegateSelect === 'function') {
return hideDelegateSelect.apply(delegateEntrySelect, arguments);
}
}
我引用了该文件以获得此解决方案
有关详细视图,请访问
谢谢