mwf.xdesktop.requireapp("process.xform", "radio", null, false);
/** @class elradio 基于element ui的单选按钮组件。
* @o2cn 单选按钮
* @example
* //可以在脚本中获取该组件
* //方法1:
* var radio = this.form.get("name"); //获取组件
* //方法2
* var radio = this.target; //在组件事件脚本中获取
* @extends mwf.xapplication.process.xform.$module
* @o2category formcomponents
* @o2range {process|cms|portal}
* @hideconstructor
* @see {@link https://element.eleme.cn/#/zh-cn/component/radio|element ui radio 单选框}
*/
mwf.xapplication.process.xform.elradio = mwf.appelradio = new class(
/** @lends mwf.xapplication.process.xform.elradio# */
{
implements: [events],
extends: mwf.appradio,
options: {
/**
* 组件加载前触发。当前组件的queryload事件还没有在form里注册,通过this.form.get("fieldid")不能获取到当前组件,需要用this.target获取当前组件。
* @event mwf.xapplication.process.xform.elradio#queryload
* @see {@link https://www.yuque.com/o2oa/ixsnyt/hm5uft#i0zts|组件事件说明}
*/
/**
* 组件加载后触发。如果选项加载为异步,则异步处理完成后触发此事件
* @event mwf.xapplication.process.xform.elradio#load
*/
/**
* 组件加载后触发.
* @event mwf.xapplication.process.xform.elradio#postload
* @see {@link https://www.yuque.com/o2oa/ixsnyt/hm5uft#i0zts|组件事件说明}
*/
"moduleevents": ["load", "queryload", "postload", "change"],
/**
* 绑定值变化时触发的事件。this.event[0]为选中的 radio label 值
* @event mwf.xapplication.process.xform.elradio#change
* @see {@link https://element.eleme.cn/#/zh-cn/component/radio|单选组件的radio-group events章节}
*/
"elevents": ["change"]
},
load: function(){
this._loadmoduleevents();
if (this.fireevent("queryload")){
this._queryloaded();
this._loaduserinterface();
}
},
_loadnode: function(){
this.node.empty();
if (this.isreadonly()){
this._loadnoderead();
if( this.json.elproperties ){
this.node.set(this.json.elproperties );
}
if (this.json.elstyles){
this.node.setstyles( this._parsestyles(this.json.elstyles) );
}
this.fireevent("postload");
if( this.moduleselectag && typeof(this.moduleselectag.then) === "function" ){
this.moduleselectag.then(function () {
this.fireevent("load");
this.isloaded = true;
}.bind(this));
}else{
this.fireevent("load");
this.isloaded = true;
}
}else{
this._loadnodeedit();
}
},
_resetnodeedit: function(){
var div = new element("div");
div.inject(this.node, "after");
this.node.destroy();
this.node = div;
},
_loadnodeedit: function(){
if (!this.json.preprocessing) this._resetnodeedit();
this.setoptions();
},
__showvalue: function(node, value, optionitems){
if (value){
var texts = "";
for (var i=0; i" : "";
}.bind(this));
html = "";
return html;
},
__setvalue: function(value){
this.modulevalueag = null;
this._setbusinessdata(value);
this.json[this.json.$id] = value;
},
__setdata: function(data){
this.modulevalueag = null;
this._setbusinessdata(data);
this.json[this.json.$id] = data;
this.validationmode();
this.fireevent("setdata");
},
_createvueapp: function(callback){
if (!this.vm){
this._loadvue(function(){
this._mountvueapp(callback);
}.bind(this));
}else{
if (callback) callback();
}
},
_loadvue: function(callback){
var flag = (o2.session.isdebugger && this.form.app.inbrowser);
var vue = flag ? "vue_develop" : "vue";
//var vuename = flag ? "vue" : "cn";
// if (!window.vue || window.vue.name!==vuename ){
// o2.loadall({"css": "../o2_lib/vue/element/index.css", "js": [vue, "elementui"]}, { "sequence": true }, callback);
// }else{
// if (callback) callback();
// }
o2.loadall({"css": "../o2_lib/vue/element/index.css", "js": [vue, "elementui"]}, { "sequence": true }, callback);
},
// _loadvue: function(callback){
// if (!window.vue){
// var vue = (o2.session.isdebugger) ? "vue_develop" : "vue";
// o2.loadall({"css": "../o2_lib/vue/element/index.css", "js": [vue, "elementui"]}, { "sequence": true }, callback);
// }else{
// if (callback) callback();
// }
// },
_mountvueapp: function(callback){
if (!this.vueapp) this.vueapp = this._createvueextend(callback);
/**
* @summary vue对象实例
* @see https://vuejs.org/
* @member {vueinstance}
*/
this.vm = new vue(this.vueapp);
this.vm.$mount(this.node);
},
_createvueextend: function(callback){
var _self = this;
return {
data: this._createvuedata(),
mounted: function(){
_self._aftermounted(this.$el);
if (callback) callback();
},
methods: {
change: function(v){
_self.validationmode();
if (_self.validation()) {
_self._setbusinessdata(v);
_self.fireevent("change");
}
}
}
};
},
_createvuedata: function(){
if (this.json.$id===this.json.id) this.form.macro.environment.data.check(this.json.$id);
this.json[this.json.$id] = this._getbusinessdata();
// if (!this.json[this.json.id]){
// this.json[this.json.id] = this._getbusinessdata();
// }
if (this.json.vuedata && this.json.vuedata.code){
var d = this.form.macro.exec(this.json.vuedata.code, this);
this.json = object.merge(d, this.json);
}
if (!this.json.textcolor) this.json.textcolor = "";
if (!this.json.fillcolor) this.json.fillcolor = "";
if (!this.json.size) this.json.size = "";
return this.json;
},
_aftermounted: function(el){
this.node = el;
this.node.set({
"id": this.json.id,
"mwftype": this.json.type
});
this._loadvuecss();
this._loaddomevents();
this._afterloaded();
this.fireevent("postload");
this.fireevent("load");
},
getinputdata: function(){
return this.json[this.json.$id];
},
_loadvuecss: function(){
if (this.stylenode){
this.node.removeclass(this.stylenode.get("id"));
}
if (this.json.vuecss && this.json.vuecss.code){
this.stylenode = this.node.loadcsstext(this.json.vuecss.code, {"notinject": true});
this.stylenode.inject(this.node, "before");
}
},
getexceldata: function( type ){
var value = this.getdata();
if( type === "value" )return value;
var options = this.getoptionsobj();
return promise.resolve(options).then(function (opts) {
var idx = opts.valuelist.indexof( value );
var text = idx > -1 ? opts.textlist[ idx ] : "";
if( !text )text = value;
return text;
});
},
setexceldata: function(d, type){
var value = d.replace(/
/g,""); //换行符
this.exceldata = value;
if( type === "value" ){
this.setdata(value, true);
}else{
var options = this.getoptionsobj();
this.moduleexcelag = promise.resolve(options).then(function (opts) {
var idx = opts.textlist.indexof( value );
var v = idx > -1 ? opts.valuelist[ idx ] : "";
value = v || value;
this.json[this.json.$id] = value;
this._setbusinessdata(value);
this.setdata(value, true);
this.moduleexcelag = null;
}.bind(this));
}
}
});
source