FAPIBrowser_wev8.js 11.6 KB
define(['mUtil', "Component", "mService", "Form"],function(mUtil, Component, mService, Form) {
	var FBrowser = function(options) {
        var $field, $showText, $a, expand = false, _browser = {};
		
		Component.super(this, options);
		
		this.type = "FAPIBrowser";
		this.tpl = this.type + "_html";
        this.dataload = true;

		var splitChar = "||||";

		var vm = this.viewModel = {
			form : "",
			field : {
				label : "",//显示名
				name : "", //字段名
				id : "",   //字段id
				value : "",//字段值
				defaultValue: ""
			},
			apiBrowser: {
			    pageurl: "", //接口列表页面url
			    compid: "", //接口列表插件id
			    relateKey: {
			        id: "", //主键对应字段
	                name: ""//显示值对应字段
			    }
			},
			showSet: {
				type: 1,	//1 从数据库字段存取 2从接口获取
				dbfield: "",
				apiConfig: {
					api: {},
					request: {},
					response: {}
				}
			},
			detailtable: {
				isA: false	//是否是明细表字段
			},
			placeholder : "请选择",
			required : false,
			readonly : false,
			needWrap : false,
			standalone : true
		};
		
		this.beforeMount = function () {
			//主表或明细新增,并且值为空 但默认值不为空时,使用默认值代替赋值
            Form.utils.setDefaultValue(this.pageid, vm);
		};
		
		this.dbValueHasSet = false; //是否已设置表单数据值,调用this.setValueByDB()方法后修改此状态
		
		this.mounted = function(){
		    var $el = this.$el, that = this;
			$field = $el.find("input[name='fieldname_" + vm.field.name + "']");
			$showText = $el.find(".text");
			$a = $showText.parent();
			
			if(vm.readonly){//显示隐藏更多
				$el.find(".text").on("click", function() {
					if(!expand) return;
					$a.toggleClass("showall");
				});
			}else{
			    //清除
	            $el.find(".wev-clear-btn").on("click", function() {
	                _browser.setValue("", "");
	            });
	            //显示隐藏更多
	            $el.find(".wev-showall-btn").on("click", function() {
	                if(!expand) return;
	                $a.toggleClass("showall");
	                $(this).toggleClass("transform180",$a.hasClass("showall"));
	            });
	            //点击浏览按钮
	            $el.find(".search,.text,.wev-field-tip").on("click", function(e) {
	                var urlParams = {
	                    _fromBrowserPage: that.pageid,
	                    _browserCompId: that.id,
	                    _apiListId: vm.apiBrowser.compid,
	                    _dataIDKey: vm.apiBrowser.relateKey.id,
	                    _dataNameKey: vm.apiBrowser.relateKey.name,
	                    _selectListIds: $field.val()
	                };
	                var pageUrl = Object.keys(urlParams).reduce(function(prev, current) {
	                    return prev + (prev.indexOf("?") != -1 ? "&" : "?") + current + "=" + urlParams[current];
	                }, vm.apiBrowser.pageurl);
	                $u(pageUrl);
	            });
			}
			
			if(vm.field.needParseSqlValue){
			  //解析默认值,默认值sql
	            return Form.utils.parseDefaultSqlValue(vm.field.defaultValue, this.pageid, function(result){
	                vm.field.value = result;
	                //设置默认值
	                vm.field.value && that.setValue(vm.field.value, true);
	            });
			}else{
			    vm.field.value && that.setValue(vm.field.value, true);
			}
		};
		
		this.bindTrigger = function(triggers, isTrigger){
			var $container = this.$container,
				fieldid = vm.field.id;

			if (fieldid && mUtil.isObject(triggers) && triggers["field" + fieldid]) {
				var trigger = triggers["field" + fieldid];
				$field.bind("change", function () {
					Mobile_NS.readyToTrigger(trigger, $field, $container);
				});
				//默认值触发字段联动,主表新建或者是明细表添加数据时触发
				if (vm.field.value && ((vm.form.indexOf("detailtable") == -1 && !$p("billid")) || isTrigger)) {
					Mobile_NS.readyToTrigger(trigger, $field, $container);
				}
			}
		};
		
		this.getData = function(){
		    var data = mUtil.parseJSON("fieldname_" + vm.field.name, $field.val());
		    if(vm.showSet.type == 1){
		        data["fieldname_" + vm.showSet.dbfield] = $showText.html();
		    }
			return data;
		};
		
		this.getShowData = function(){
			var showData = mUtil.parseJSON(vm.field.name + "_showvalue", $showText.html());
			showData[vm.field.name] = $field.val();
			return showData;
		};
		
		this.reset = function(){
			_browser.setValue(vm.field.value, vm.field.showname);
			this.$el.find(".wev-field").removeClass("wev-required-remind");
		};
		
		this.checkRequired = function(){
			var required = vm.required && !$field.val();
			var fieldLabel = vm.field.label || mUtil.getLabel(513588, "浏览按钮");

			this.$el.find(".wev-field").toggleClass("wev-required-remind", required);
			
			return required && fieldLabel;
		};
		
		this.setRequired = function (required) {
			vm.required = required;
			this.$el.find(".wev-field").toggleClass("wev-field-required", required);
			!required && this.$el.find(".wev-field").removeClass("wev-required-remind");
		};
		
		this.getFieldNameOfDB = function(){
            if (vm.showSet.type == 1) {
                return vm.field.name + splitChar + vm.showSet.dbfield;
            }
            return vm.field.name;
        };
        
		this.setValueByDB = function(value){
			this.dbValueHasSet = true;
		    if(value || !vm.field.value) {
                vm.field.value = value;
                if (value.indexOf(splitChar) != -1) {
                    var vArr = value.split(splitChar);
                    vm.field.value = vArr[0];
                    vm.field.showname = vArr[1];
                    this.setValue({id: vArr[0], text: vArr[1]}, true);
                } else {
                    this.setValue(value, true);
                }
            }
		};
		
		this.setValue = function(value, initialize, callback){
		    mUtil.isFunction(initialize) && (callback = initialize);
			
		    //value 可以是字符串 也可以是json对象,json格式为 {id: "", text: ""}
			var idVal = value, textVal = value;
			if(!idVal) return _browser.setValue("", "", callback);
			
			if(mUtil.isObject(value)){
                idVal = value.id;
                textVal = value.text;
                _browser.setValue(idVal, textVal, initialize, callback);
                return;
            }
			
			var showFieldType = vm.showSet.type || 1;
            if(showFieldType == 1){
                _browser.setValue(idVal, textVal, initialize, callback);
            }else{
                //从接口获取值
                require(["apiHelper"], function(apiHelper){
                    apiHelper.callApi(vm.showSet.apiConfig, {SEARCH_KEY: idVal}, function(result){
                        var formats = vm.showSet.apiConfig.response.formats;
                        var dataObj = formats.DATAS ? mUtil.getKeyValue(formats.DATAS, result) : result,
                            showname = mUtil.isObject(dataObj) ? JSON.stringify(dataObj) : dataObj;
                        
                        if(initialize){
                            vm.field.showname = showname;
                        }
                        _browser.setValue(idVal, showname, initialize, callback);
                    }, function(){
                        if(initialize){
                            vm.field.showname = idVal;
                        }
                        _browser.setValue(idVal, idVal, initialize, callback);
                    });
                });
            }
		};
		
		this.text = function(){
			return $showText.text();
		};
		
		_browser.setValue = function(value, showHtml, initialize, callback){
			mUtil.isFunction(initialize) && (callback = initialize);
			
			var $el = this.$el,
				$hiddenText = this.$el.find(".hiddenText");
			var isEmpty = !value;

			$showText.html(showHtml);
			$hiddenText.html(showHtml);
			$el.find(".wev-field-tip").toggle(isEmpty);
			$el.find(".wev-clear-btn").toggle(!isEmpty);
			setTimeout(function(){
				var clientWidth = $showText[0].clientWidth,
					scrollWidth = $hiddenText[0].scrollWidth;
				
				if(!vm.readonly){
					clientWidth = clientWidth - 64;
				}
				
				expand = scrollWidth > clientWidth;
				
				!expand && $a.removeClass("showall");
				if(!vm.readonly){
					$a.parent().toggleClass("wev-expend", expand);
					$el.find(".wev-showall-btn").toggleClass("transform180",$a.hasClass("showall"));
				}
				
			},100);
			$field.val(value);
			//非初始化的时候赋值才触发change,否则可能导致编辑数据时数据被篡改
			!initialize && $field.triggerHandler("change");
			initialize && this.dbValueHasSet && mUtil.trigger('dataload', this.pageid, this.id);
			
			callback && callback.call(this);
		};
		
		_browser.getFormMecIDList = function(formid){
			return $("[data-form='" + formid + "']", this.$container).map(function(i, el) {
				return el.id && el.id.replace("NMEC_", "");
			});
	    };
	    
	    _browser.getFormData = function(){
	    	var formid = vm.form, detailformid, formData = {}, getFormFieldData = function(formMecId, detailtable){
	    		var instance = mUtil.getInstance(formMecId),
					resultData = instance.getData();

				if(!mUtil.isObject(resultData)) return;
				
				for (var key in resultData) {
					var fieldvalue = resultData[key], 
						_key = key.toLowerCase();
	
					if (instance.type != "FBrowser" && fieldvalue.length > 30) {
						fieldvalue = "";
					}
					
					if (_key.indexOf("fieldname_") != -1) {
						if(detailtable){
							_key = _key.replace("fieldname_", "fieldname_"+detailtable+"_");
						}
						formData[_key] = fieldvalue;
					}
				}
	    	};
	    	
	    	if(vm.form.indexOf("detailtable") == 0){
	    		formid = vm.form.replace("detailtable", "");
	    		detailformid = vm.form;
	    	}
	    	_browser.getFormMecIDList(formid).forEach(function(formMecId){
	    		getFormFieldData(formMecId);
	    	});
	    	//明细表
	    	if(detailformid){
	    		var detailFormInstance = mUtil.getInstance(detailformid),
	    			detailtablename = detailFormInstance.viewModel.table.name.toLowerCase();
	    		
	    		_browser.getFormMecIDList(detailformid).forEach(function(formMecId){
	    			getFormFieldData(formMecId, detailtablename);
		    	});
	    	}
	    	return formData;
		};
		
		_browser.setValue = _browser.setValue.bind(this);
		_browser.getFormMecIDList = _browser.getFormMecIDList.bind(this);
    };
    
    Mobile_NS.setAPIBrowser4SingleSelect = function(target){
        var rowData = target.rowData, 
            _fromBrowserPage = $p("_fromBrowserPage"),
            _browserCompId = $p("_browserCompId"),
            _dataIDKey = $p("_dataIDKey"), 
            _dataNameKey = $p("_dataNameKey");
        require("mUtil").getInstance(_browserCompId, _fromBrowserPage).setValue({id: rowData[_dataIDKey], text: rowData[_dataNameKey]});
        Mobile_NS.backPage();
    };
    
    Mobile_NS.setAPIBrowser4MultiSelect = function(compid){
        Mobile_NS.getListCheckedData(compid, function(datas){
            var _fromBrowserPage = $p("_fromBrowserPage"),
                _browserCompId = $p("_browserCompId"),
                _dataIDKey = $p("_dataIDKey"), 
                _dataNameKey = $p("_dataNameKey");
            var idVals = "", textVals = "";
            datas.forEach(function(data, i) {
            	if(i > 0){
            	    idVals += ",";
            	    textVals += ",";
            	}
            	idVals += data[_dataIDKey];
            	textVals += data[_dataNameKey];
            });
            require("mUtil").getInstance(_browserCompId, _fromBrowserPage).setValue({id: idVals, text: textVals});
            Mobile_NS.backPage();
        });
    };

    return Component.init(FBrowser);
});