$Input.js 20.5 KB
Newer Older
R
roo00 已提交
1
MWF.xDesktop.requireApp("process.Xform", "$Module", null, false);
U
jsdoc  
unknown 已提交
2 3
/** @class process.$Input 组件类,此类为所有输入组件的父类
 * @hideconstructor
U
jsdoc  
unknown 已提交
4
* @extends MWF.xApplication.process.Xform.$Module
U
jsdoc  
unknown 已提交
5 6
 * @abstract
 */
U
jsodc  
unknown 已提交
7
MWF.xApplication.process.Xform.$Input = MWF.APP$Input =  new Class(
U
jsdoc  
unknown 已提交
8
    /** @lends MWF.xApplication.process.Xform.$Input# */
U
jsodc  
unknown 已提交
9
    {
R
roo00 已提交
10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28
	Implements: [Events],
	Extends: MWF.APP$Module,
	iconStyle: "personfieldIcon",
    initialize: function(node, json, form, options){
        this.node = $(node);
        this.node.store("module", this);
        this.json = json;
        this.form = form;
        this.field = true;
    },
	
	_loadUserInterface: function(){
		this._loadNode();
        if (this.json.compute === "show"){
            this._setValue(this._computeValue());
        }else{
            this._loadValue();
        }
	},
NoSubject's avatar
NoSubject 已提交
29 30 31 32 33 34 35 36 37 38 39
    _loadDomEvents: function(){
        Object.each(this.json.events, function(e, key){
            if (e.code){
                if (this.options.moduleEvents.indexOf(key)===-1){
                    (this.node.getFirst() || this.node).addEvent(key, function(event){
                        return this.form.Macro.fire(e.code, this, event);
                    }.bind(this));
                }
            }
        }.bind(this));
    },
R
roo00 已提交
40 41 42 43 44 45 46 47 48 49 50 51 52 53 54
    _loadEvents: function(){
        Object.each(this.json.events, function(e, key){
            if (e.code){
                if (this.options.moduleEvents.indexOf(key)!==-1){
                    this.addEvent(key, function(event){
                        return this.form.Macro.fire(e.code, this, event);
                    }.bind(this));
                }else{
                    (this.node.getFirst() || this.node).addEvent(key, function(event){
                        return this.form.Macro.fire(e.code, this, event);
                    }.bind(this));
                }
            }
        }.bind(this));
    },
NoSubject's avatar
NoSubject 已提交
55 56 57 58 59 60 61 62 63 64 65
    addModuleEvent: function(key, fun){
        if (this.options.moduleEvents.indexOf(key)!==-1){
            this.addEvent(key, function(event){
                return (fun) ? fun(this, event) : null;
            }.bind(this));
        }else{
            (this.node.getFirst() || this.node).addEvent(key, function(event){
                return (fun) ? fun(this, event) : null;
            }.bind(this));
        }
    },
R
roo00 已提交
66 67 68 69 70 71 72 73 74 75

    _loadNode: function(){
        if (this.readonly){
            this._loadNodeRead();
        }else{
            this._loadNodeEdit();
        }
    },
    _loadNodeRead: function(){
        this.node.empty();
76 77 78 79
        this.node.set({
            "nodeId": this.json.id,
            "MWFType": this.json.type
        });
R
roo00 已提交
80 81
    },
    loadDescription: function(){
82
        if (this.readonly || this.json.isReadonly)return;
R
roo00 已提交
83 84 85 86 87
        var v = this._getBusinessData();
        if (!v){
            if (this.json.description){
                var size = this.node.getFirst().getSize();
                var w = size.x-3;
U
unknown 已提交
88 89 90
                if( this.json.showIcon!='no' && !this.form.json.hideModuleIcon ){
                    if (COMMON.Browser.safari) w = w-20;
                }
U
jsdoc  
unknown 已提交
91 92 93 94 95

                /**
                 * 描述信息节点,select\radio\checkbox无此节点,只读情况下无此节点.
                 * @member {Element}
                 */
R
roo00 已提交
96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130
                this.descriptionNode = new Element("div", {"styles": this.form.css.descriptionNode, "text": this.json.description}).inject(this.node);
                this.descriptionNode.setStyles({
                    "width": ""+w+"px",
                    "height": ""+size.y+"px",
                    "line-height": ""+size.y+"px"
                });
                this.setDescriptionEvent();
            }
        }
    },
    setDescriptionEvent: function(){
        if (this.descriptionNode){
            this.descriptionNode.addEvents({
                "mousedown": function(){
                    this.descriptionNode.setStyle("display", "none");
                    this.clickSelect();
                }.bind(this)
            });
            this.node.getFirst().addEvents({
                "focus": function(){
                    if (this.descriptionNode) this.descriptionNode.setStyle("display", "none");
                }.bind(this),
                "blur": function(){
                    if (!this.node.getFirst().get("value")) if (this.descriptionNode)  this.descriptionNode.setStyle("display", "block");
                }.bind(this)
            });
        }
    },
    checkDescription: function(){
        if (!this.node.getFirst().get("value")){
            if (this.descriptionNode)  this.descriptionNode.setStyle("display", "block");
        }else{
            if (this.descriptionNode) this.descriptionNode.setStyle("display", "none");
        }
    },
131 132
    _resetNodeEdit: function(){
        var input = new Element("input", {
R
roo00 已提交
133 134 135 136 137 138 139 140 141
            "styles": {
                "background": "transparent",
                "width": "100%",
                "border": "0px"
            },
            "readonly": true
        });

        var node = new Element("div", {"styles": {
142 143 144 145 146
                "overflow": "hidden",
                "position": "relative",
                "margin-right": "20px",
                "padding-right": "4px"
            }}).inject(this.node, "after");
R
roo00 已提交
147 148 149
        input.inject(node);

        this.node.destroy();
150 151 152 153 154 155
        this.node = node;
    },
    _loadNodeEdit: function(){
	    if (!this.json.preprocessing) this._resetNodeEdit();
	    var input = this.node.getFirst();
        input.set(this.json.properties);
R
roo00 已提交
156 157 158 159 160 161 162 163
		this.node.set({
			"id": this.json.id,
			"MWFType": this.json.type,
			"readonly": true,
			"events": {
				"click": this.clickSelect.bind(this)
			}
		});
R
roo00 已提交
164 165 166 167 168 169 170 171 172 173
        if (this.json.showIcon!='no' && !this.form.json.hideModuleIcon ){
            this.iconNode = new Element("div", {
                "styles": this.form.css[this.iconStyle],
                "events": {
                    "click": this.clickSelect.bind(this)
                }
            }).inject(this.node, "before");
        }else if( this.form.json.nodeStyleWithhideModuleIcon ){
            this.node.setStyles(this.form.json.nodeStyleWithhideModuleIcon)
        }
R
roo00 已提交
174 175 176 177 178 179 180 181 182

        this.node.getFirst().addEvent("change", function(){
            this.validationMode();
            if (this.validation()) this._setBusinessData(this.getInputData("change"));
        }.bind(this));
	},
    _loadStyles: function(){
        if (this.json.styles) this.node.setStyles(this.json.styles);
        if (this.json.inputStyles) if (this.node.getFirst()) this.node.getFirst().setStyles(this.json.inputStyles);
183
        if (this.iconNode && this.iconNode.offsetParent !== null){
R
roo00 已提交
184 185 186 187 188 189 190 191 192 193 194 195 196 197
            var size = this.node.getSize();
            //if (!size.y){
            //    var y1 = this.node.getStyle("height");
            //    var y2 = this.node.getFirst().getStyle("height");
            //    alert(y1+"," +y2);
            //    var y = ((y1!="auto" && y1>y2) || y2=="auto") ? y1 : y2;
            //    size.y = (y=="auto") ? "auto" : y.toInt();
            //    //alert(size.y)
            //}
            this.iconNode.setStyle("height", ""+size.y+"px");
            //alert(this.iconNode.getStyle("height"))
        }
    },
    _computeValue: function(value){
198
        return (this.json.defaultValue && this.json.defaultValue.code) ? this.form.Macro.exec(this.json.defaultValue.code, this): (value || "");
R
roo00 已提交
199 200
    },
	getValue: function(){
201
        if (this.moduleValueAG) return this.moduleValueAG;
R
roo00 已提交
202 203 204 205 206
        var value = this._getBusinessData();
        if (!value) value = this._computeValue();
		return value || "";
	},
    _setValue: function(value){
207 208 209 210 211 212 213 214 215 216
	    // if (value && value.isAG){
	    //     var ag = o2.AG.all(value).then(function(v){
	    //         if (o2.typeOf(v)=="array") v = v[0];
        //         this.__setValue(v);
        //     }.bind(this));
        //     this.moduleValueAG = ag;
	    //     ag.then(function(){
        //         this.moduleValueAG = null;
        //     }.bind(this));
        // }else {
217
        if (!!value && o2.typeOf(value.then)=="function"){
218 219
            var p = o2.promiseAll(value).then(function(v){
                this.__setValue(v);
NoSubject's avatar
NoSubject 已提交
220
            }.bind(this), function(){});
221 222 223
            this.moduleValueAG = p;
            p.then(function(){
                this.moduleValueAG = null;
NoSubject's avatar
NoSubject 已提交
224 225
            }.bind(this), function(){
                this.moduleValueAG = null;
226 227
            }.bind(this));
        }else{
228
            this.moduleValueAG = null;
NoSubject's avatar
NoSubject 已提交
229
            this.__setValue(value);
230 231
        }

NoSubject's avatar
NoSubject 已提交
232
            //this.__setValue(value);
233
        // }
234 235 236 237 238 239 240 241

    },
    __setValue: function(value){
        this._setBusinessData(value);
        if (this.node.getFirst()) this.node.getFirst().set("value", value || "");
        if (this.readonly || this.json.isReadonly) this.node.set("text", value);
        this.moduleValueAG = null;
        return value;
R
roo00 已提交
242
    },
243

R
roo00 已提交
244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261
	_loadValue: function(){
        this._setValue(this.getValue());
	},
	clickSelect: function(){
	},
	_afterLoaded: function(){
//		if (this.iconNode){
////			var p = this.node.getPosition();
////			var s = this.node.getSize();
////			var is = this.iconNode.getSize();
////
////			var y = p.y;
////			var x = p.x+s.x-is.x;
//			this.iconNode.setStyles({
//				"top": "5px",
//				"left": "-18px"
//			});
//		}
262
        if (!this.readonly && !this.json.isReadonly ){
R
roo00 已提交
263 264 265 266 267 268 269 270 271
            this.loadDescription();
        }
	},
	
	getTextData: function(){
		//var value = this.node.get("value");
		//var text = this.node.get("text");
        var value = (this.node.getFirst()) ? this.node.getFirst().get("value") : this.node.get("text");
        var text = (this.node.getFirst()) ? this.node.getFirst().get("text") : this.node.get("text");
R
roo00 已提交
272
		return {"value": [value || ""] , "text": [text || value || ""]};
R
roo00 已提交
273
	},
U
unknown 已提交
274 275
    /**
     * 判断组件值是否为空.
U
jsdoc  
unknown 已提交
276 277 278 279 280
     * @example
     * if( this.form.get('subject').isEmpty() ){
     *     this.form.notice('标题不能为空', 'warn');
     * }
     * @return {Boolean} 值是否为空.
U
unknown 已提交
281
     */
U
unknown 已提交
282
    isEmpty : function(){
U
unknown 已提交
283 284
	    var data = this.getData();
	    return !data || !data.trim();
U
unknown 已提交
285
    },
U
unknown 已提交
286
    /**
U
jsdoc  
unknown 已提交
287 288 289
     * 获取组件值。该方法和 this.data.{fieldName} 在绝大部分的时候效果一样。区别如下:
     * 当使用异步函数生成器(Promise)为组件赋值的时候,getData立即获取数据,可能返回修改前的值,当Promise执行完成以后,会返回修改后的值。
     * this.data.{fieldName} 立即获取数据,可能获取到异步函数生成器,当Promise执行完成以后,会返回修改后的值。{@link https://www.yuque.com/o2oa/ixsnyt/ws07m0#EggIl|具体差异请查看链接}
U
jsdoc  
unknown 已提交
290 291
     *  @example
     * var data = this.form.get('subject').getData();
U
jsdoc  
unknown 已提交
292
     * @return 组件的数据.
U
unknown 已提交
293
     */
R
roo00 已提交
294 295
	getData: function(when){
        if (this.json.compute == "save") this._setValue(this._computeValue());
NoSubject's avatar
NoSubject 已提交
296
        return this.getInputData();
R
roo00 已提交
297 298
	},
    getInputData: function(){
NoSubject's avatar
NoSubject 已提交
299 300 301 302 303
        if (this.node.getFirst()){
            return this.node.getFirst().get("value");
        }else{
            return this._getBusinessData();
        }
R
roo00 已提交
304
    },
U
unknown 已提交
305
    /**
U
jsodc  
unknown 已提交
306
     * 重置组件的值为默认值或置空。
U
jsdoc  
unknown 已提交
307 308
     *  @example
     * this.form.get('subject').resetData();
U
unknown 已提交
309
     */
R
roo00 已提交
310 311 312
    resetData: function(){
        this.setData(this.getValue());
    },
U
unknown 已提交
313 314
    /**
     * 为控件赋值。
U
jsdoc  
unknown 已提交
315
     *  @param data{String|Number|JsonObject|Array} .
U
unknown 已提交
316
     */
R
roo00 已提交
317
	setData: function(data){
318 319 320 321 322 323 324 325 326 327
        // if (data && data.isAG){
        //     var ag = o2.AG.all(data).then(function(v){
        //         if (o2.typeOf(v)=="array") v = v[0];
        //         this.__setData(v);
        //     }.bind(this));
        //     this.moduleValueAG = ag;
        //     ag.then(function(){
        //         this.moduleValueAG = null;
        //     }.bind(this));
        // }else{
328
        if (!!data && o2.typeOf(data.then)=="function"){
329
            var p = o2.promiseAll(data).then(function(v){
NoSubject's avatar
NoSubject 已提交
330 331 332 333 334
                this.__setData(v);
                // if (this.node.getFirst() && !this.readonly && !this.json.isReadonly) {
                //     this.checkDescription();
                //     this.validationMode();
                // }
NoSubject's avatar
NoSubject 已提交
335
            }.bind(this), function(){});
336 337 338
            this.moduleValueAG = p;
            p.then(function(){
                this.moduleValueAG = null;
NoSubject's avatar
NoSubject 已提交
339 340
            }.bind(this), function(){
                this.moduleValueAG = null;
341 342
            }.bind(this));
        }else{
343
            this.moduleValueAG = null;
NoSubject's avatar
NoSubject 已提交
344 345 346 347 348
            this.__setData(data);
            // if (this.node.getFirst() && !this.readonly && !this.json.isReadonly) {
            //     this.checkDescription();
            //     this.validationMode();
            // }
349
        }
NoSubject's avatar
NoSubject 已提交
350
            //this.__setData(data);
351
        //}
R
roo00 已提交
352
	},
353 354 355 356 357 358 359 360 361 362 363 364
    __setData: function(data){
        this._setBusinessData(data);
        if (this.node.getFirst()){
            this.node.getFirst().set("value", data);
            this.checkDescription();
            this.validationMode();
        }else{
            this.node.set("text", data);
        }
        this.moduleValueAG = null;
    },

R
roo00 已提交
365 366

    createErrorNode: function(text){
R
roo00 已提交
367

R
roo00 已提交
368 369 370 371 372 373 374 375 376 377
        //var size = this.node.getFirst().getSize();
        //var w = size.x-3;
        //if (COMMON.Browser.safari) w = w-20;
        //node.setStyles({
        //    "width": ""+w+"px",
        //    "height": ""+size.y+"px",
        //    "line-height": ""+size.y+"px",
        //    "position": "absolute",
        //    "top": "0px"
        //});
R
roo00 已提交
378 379
        var node;
        if( this.form.json.errorStyle ){
U
unknown 已提交
380 381 382 383 384 385 386 387 388 389 390 391 392 393 394 395 396 397 398 399 400 401 402 403
            if( this.form.json.errorStyle.type === "notice" ){
                if( !this.form.errorNoticing ){ //如果是弹出
                    this.form.errorNoticing = true;
                    this.form.notice(text, "error", this.node, null, null, {
                        onClose : function () {
                            this.form.errorNoticing = false;
                        }.bind(this)
                    });
                }
            }else{
                node = new Element("div",{
                    "styles" : this.form.json.errorStyle.node,
                    "text": text
                });
                if( this.form.json.errorStyle.close ){
                    var closeNode = new Element("div",{
                        "styles" : this.form.json.errorStyle.close ,
                        "events": {
                            "click" : function(){
                                this.destroy();
                            }.bind(node)
                        }
                    }).inject(node);
                }
R
roo00 已提交
404
            }
R
roo00 已提交
405 406 407 408 409 410 411
        }else{
            node = new Element("div");
            var iconNode = new Element("div", {
                "styles": {
                    "width": "20px",
                    "height": "20px",
                    "float": "left",
412
                    "background": "url("+"../x_component_process_Xform/$Form/default/icon/error.png) center center no-repeat"
R
roo00 已提交
413 414 415 416 417 418 419 420 421 422 423 424 425
                }
            }).inject(node);
            var textNode = new Element("div", {
                "styles": {
                    "height": "20px",
                    "line-height": "20px",
                    "margin-left": "20px",
                    "color": "red",
                    "word-break": "keep-all"
                },
                "text": text
            }).inject(node);
        }
R
roo00 已提交
426 427 428 429 430 431 432 433 434 435 436 437 438 439 440
        return node;
    },
    notValidationMode: function(text){
        if (!this.isNotValidationMode){
            this.isNotValidationMode = true;
            this.node.store("borderStyle", this.node.getStyles("border-left", "border-right", "border-top", "border-bottom"));
            this.node.setStyle("border-color", "red");

            this.errNode = this.createErrorNode(text);
            //if (this.iconNode){
            //    this.errNode.inject(this.iconNode, "after");
            //}else{
                this.errNode.inject(this.node, "after");
            //}
            this.showNotValidationMode(this.node);
R
roo00 已提交
441 442 443 444 445 446 447

            var parentNode = this.node;
            while( parentNode.offsetParent === null ){
                parentNode = parentNode.getParent();
            }

            if (!parentNode.isIntoView()) parentNode.scrollIntoView();
R
roo00 已提交
448 449 450 451 452 453 454 455 456 457 458
        }
    },
    showNotValidationMode: function(node){
        var p = node.getParent("div");
        if (p){
            var mwftype = p.get("MWFtype") || p.get("mwftype");
            if (mwftype == "tab$Content"){
                if (p.getParent("div").getStyle("display")=="none"){
                    var contentAreaNode = p.getParent("div").getParent("div");
                    var tabAreaNode = contentAreaNode.getPrevious("div");
                    var idx = contentAreaNode.getChildren().indexOf(p.getParent("div"));
NoSubject's avatar
NoSubject 已提交
459
                    var tabNode = tabAreaNode.getLast().getFirst().getChildren()[idx];
R
roo00 已提交
460 461 462 463 464 465 466 467 468 469 470 471 472 473 474 475 476 477 478 479 480 481 482 483 484 485 486 487 488 489 490 491 492 493 494 495 496 497 498 499 500 501 502 503 504 505 506 507 508 509 510 511 512 513 514 515 516 517 518 519 520 521 522 523 524 525 526 527 528 529 530 531 532 533 534 535 536 537 538 539 540 541 542 543 544 545 546
                    tabNode.click();
                    p = tabAreaNode.getParent("div");
                }
            }
            this.showNotValidationMode(p);
        }
    },
    validationMode: function(){
        if (this.isNotValidationMode){
            this.isNotValidationMode = false;
            this.node.setStyles(this.node.retrieve("borderStyle"));
            if (this.errNode){
                this.errNode.destroy();
                this.errNode = null;
            }
        }
    },
    validationConfigItem: function(routeName, data){
        var flag = (data.status==="all") ? true: (routeName === data.decision);
        if (flag){
            var n = this.getInputData();
            var v = (data.valueType==="value") ? n : n.length;
            switch (data.operateor){
                case "isnull":
                    if (!v){
                        this.notValidationMode(data.prompt);
                        return false;
                    }
                    break;
                case "notnull":
                    if (v){
                        this.notValidationMode(data.prompt);
                        return false;
                    }
                    break;
                case "gt":
                    if (v>data.value){
                        this.notValidationMode(data.prompt);
                        return false;
                    }
                    break;
                case "lt":
                    if (v<data.value){
                        this.notValidationMode(data.prompt);
                        return false;
                    }
                    break;
                case "equal":
                    if (v==data.value){
                        this.notValidationMode(data.prompt);
                        return false;
                    }
                    break;
                case "neq":
                    if (v!=data.value){
                        this.notValidationMode(data.prompt);
                        return false;
                    }
                    break;
                case "contain":
                    if (v.indexOf(data.value)!=-1){
                        this.notValidationMode(data.prompt);
                        return false;
                    }
                    break;
                case "notcontain":
                    if (v.indexOf(data.value)==-1){
                        this.notValidationMode(data.prompt);
                        return false;
                    }
                    break;
            }
        }
        return true;
    },
    validationConfig: function(routeName, opinion){
        if (this.json.validationConfig){
            if (this.json.validationConfig.length){
                for (var i=0; i<this.json.validationConfig.length; i++) {
                    var data = this.json.validationConfig[i];
                    if (!this.validationConfigItem(routeName, data)) return false;
                }
            }
            return true;
        }
        return true;
    },
U
unknown 已提交
547 548
    /**
     * 根据组件的校验设置进行校验。
U
jsdoc  
unknown 已提交
549
     *  @param {String} routeName - 可选,路由名称.
U
jsdoc  
unknown 已提交
550 551 552 553
     *  @example
     *  if( !this.form.get('fieldName').validation() ){
     *      return false;
     *  }
U
jsdoc  
unknown 已提交
554
     *  @return {Boolean} 是否通过校验
U
unknown 已提交
555
     */
R
roo00 已提交
556
    validation: function(routeName, opinion){
R
roo00 已提交
557 558
        if (!this.readonly && !this.json.isReadonly){
            if (!this.validationConfig(routeName, opinion))  return false;
R
roo00 已提交
559

R
roo00 已提交
560 561
            if (!this.json.validation) return true;
            if (!this.json.validation.code) return true;
562 563

            this.currentRouteName = routeName;
R
roo00 已提交
564
            var flag = this.form.Macro.exec(this.json.validation.code, this);
565 566
            this.currentRouteName = "";

R
roo00 已提交
567 568 569 570 571
            if (!flag) flag = MWF.xApplication.process.Xform.LP.notValidation;
            if (flag.toString()!="true"){
                this.notValidationMode(flag);
                return false;
            }
R
roo00 已提交
572 573 574 575
        }
        return true;
    }
	
576
});