sui.js和workflow2.js內容詳解

1、

 

 

2、

 

var config=$("div[name=lwnf]").sui().getConfig()~var config = this.zoo.getConfig();等同

 

3、註冊組件

 

var zoos = {};
function register(name, com){
com.prototype = Zoo;
zoos[name.toLowerCase()] = com;
}

"com" 爲函數或者說是對象

 

註冊的組件均可以用  $(selector).sui().methodname()或者this.zoo.methodname()調取方法。

 

 

註冊組件就是對已有的封裝使用     包括各類驗證  屬性設置   

 

 

富文本編輯器  wangEdit

 

上傳編輯刪除

 

 

  sui.js

function render(data){
addBtn(data);
$.each(data, function(index, item) {
var $tr = buildTr(item);
$tableBody.append($tr);
SUI.init($.noop, $tr);
if(typeof config.onRenderRow === "function"){
config.onRenderRow.call(dom, $tr[0], item);
}
});
}

 

SUI.init($.noop, $tr);

function init(callback, context){
for(var type in zoos){
var zooDefine = $(".sui-" + type, context);
zooDefine.each(function(){
build(this);
});
}
$.type(callback)==="function"&&callback();
}

build(this);

 

function build(element, type){
if($(element).sui()){
return element;
}
if(!type){
var suitype = element.className.match(/sui-(\S+)/i);  //   / ../i  忽略大小寫  \S非空白字符  \s空白字符  match匹配正則，返回數組    
if(suitype&&suitype[1]){
type = suitype[1];
}else{
return element;
}
}
var el = create(type, element);
var isui = $(el).attr("isui");
if(!isui){
$(el).attr("sui",true);
}
var conf = el.zoo.parse(element);
el.zoo.init(conf);
$(el).on('change', function(){
var _conf = el.zoo.getConfig();
if(_conf&&_conf.mode=="editable"&&_conf.validate){
el.zoo.validate();
}
});
return el;
}

 create(type, element)

 

function create(type, dom){
type = type.toLowerCase();
var element = new zoos[type](dom);
element.zoo.type = type;
$(element).addClass('sui-component sui-'+type);   //  addclass（）方法，若是是添加多個類名（空格隔開），若是原class已經存在類名，就會被隱藏。
return element;
}

 

function register(name, com){
com.prototype = Zoo;
zoos[name.toLowerCase()] = com;
}

 

workflow2.js  

加載流程

 

設置屬性值

 

//回填數據
if(callback) callback(entity,function(data){
form.sui().setValue(data);
});

 workflow2.js中調用sui的方法

var entity = $.extend(true, {}, this.entity);
SUI.init(function(){
var workItem = _this.workflow.workItem ||{};
//初始化下一步
var activityTree = _this.workflow.activityTree;
var partis = $(".sui-participates").sui();
var morePartis = $(".sui-moreparticipates").sui();
if(partis && activityTree){
var attrs = activityTree.exts?activityTree.exts.attrs : {};
var attach = attrs.attach;
var config = partis.getConfig();
config.tree = activityTree;
config.process = workItem.processDefName;
config.processInstId = workItem.processInstID;
config.properties.attach = attach;

config.processExt = _this.workflow.processDefExt.attrs;

config.properties.opinionAtTop = attrs.opinionAtTop;

partis.setConfig(config);
}
if(morePartis && activityTree){
var attrs = activityTree.exts?activityTree.exts.attrs : {};
var attach = attrs.attach;
var config = morePartis.getConfig();
config.tree = activityTree;
config.process = workItem.processDefName;
config.processInstId = workItem.processInstID;
config.properties.attach = attach;
config.processExt = _this.workflow.processDefExt.attrs;
config.properties.opinionAtTop = attrs.opinionAtTop;
morePartis.setConfig(config);
}

if($(".sui-multiopinion").length>0){
$(".sui-multiopinion").each(function(){
var config = $(this).sui().getConfig();
config.properties.workItemId = initConfig.workItemId;
$(this).sui().setConfig(config);
});
}



//回填數據   這是調用form組件中的方法form.sui().setValue(data);

if(callback) callback(entity,function(data){
form.sui().setValue(data);
});
});

 

 

//form表單組件

 

獲取data對象的對應的屬性值

function getDataValue(data, name){
if(!name){
return;
}
var splits = name.split(".");
var temp = data;
for(var i =0; i < splits.length; i++){
var key = splits[i];
temp = temp[key];  //   獲取對象的屬性的方法有二：  1是用「.name」 2是 [name]
if(!temp){
break;
}
}
return temp;
}

回填數據的方法 ， 這是真正的回填數據，上面的只是調用。

this.setValue = function(data){ value = data; var children = []; getChildren(dom, children); $.each(children, function(i, el){ var zoo = el.zoo; var val = getDataValue(data, zoo.name); if(zoo.notForm|| typeof val ==="undefined" || val==="undefined"){ return; } zoo.setValue(val); }); }