define(['mUtil', "Component", "wev-loading", "fieldParseHelper","i18n", "mApi/popup"],function(mUtil, Component, WevLoading, fieldHelper,i18n) {
	var HoriList = function(options) {
		var _horiList = {}, dataList = [];
		
		var dynamicParam = {};
		
		Component.super(this, options);
		
		this.type = "HoriList";
		this.tpl = this.type + "_html";
		this.css = this.type + "_css";
		this.keysOfSkipedVarParse = ['dataurl', 'imgfield', 'titlefield', 'otherfields'];
		this.dataload = true;
		this.components = {
			loading: new WevLoading({
				delay: 300,
				animation: 1
			})
		};

		var vm = this.viewModel = {
			pageSize: 10,
			normalview: {
				imgfield: {},
				titlefield: {},
				otherfields: []
			},
			options: {
				dataurl: "",
				readonly: false,		//是否只读
				inParams: [{
					paramName: "pageSize",
					paramValue: "{PAGE_SIZE}",
					isSystem: "1",
					desc: ""            //每页显示数量
				}],
				outFormat: {
					DATAS: "datas"
				}
			},
			dataload: function () { }
		};
		
		this.beforeMount = function(){
			//兼容处理
			vm.contentSource = vm.contentSource || (vm.sourceid > 0 ? 2 : 1);
		};
		
		this.mounted = function () {
			var that = this;
			//绑定单条数据点击事件
			this.$comp.on("click", "a.wev-navigate-right", function (e) {
				if (vm.options.readonly) return;

                if($(e.target).closest('.wev-file[data-docid]').length) return;

				var $ele = $(this);
				var dataIndex = $ele.closest(".wev-table-view-cell").index();
				var item = dataList[dataIndex];

				if (vm.callback && mUtil.isFunction(vm.callback.click)) {
					vm.callback.click.call(this, item);
				}
				if (vm.contentSource == 2 && vm.options.urltype == 0) {
					if (vm.layoutUrl) {
						$u(vm.layoutUrl + "&billid=" + item.id);
					} else {
						Mobile_NS.getLayoutUrl(vm.relate.modeid, 1, item.id);
					}
				}else if(item.dataurl){
					var dataurl = item.dataurl;
					if(dataurl.indexOf("javascript:") == -1){
						$u(dataurl);
					}else{
						mUtil.eval(dataurl, that.pageid);
					}
				}
			});

			if (vm.contentSource == 2 && vm.options.urltype == 0 && !vm.options.readonly) {//自动解析地址
				//解析布局url
				vm.layoutUrl = "";
				var url = mUtil.getActionUrl("service.FormComponent", { action: "resolveDefaultLayout" });
				mUtil.getJSON(url, { modelid: vm.relate.modeid, appid: vm.relate.appid, uitype: 1 }, function (result) {
					if (!result.data) return;

					vm.layoutUrl = result.data;
					require(["mApi/other"]);//TODO 预加载
				}, function (errMsg) { });
			}
			
			_horiList.refreshList(vm.dataload);
		};
		
		this.reload = function (args, callback) {
		    dynamicParam = {};
			if (mUtil.isObject(args)) {
				$.extend(dynamicParam, args);
			}
			_horiList.refreshList(callback);
		};
		
		var listTimestamp = 0;

		_horiList.refreshList = function (callback) {
			var that = this,
				loading = this.components.loading;

			loading.setRefs(this.$comp, "wev-refreshing");
			loading.show();

			_horiList.loadData(function () {
				loading.hide();
				if (mUtil.isFunction(callback)) {
					callback.call(null);
				}
                mUtil.trigger('dataload', that.pageid, that.id);
            });
		};
		
		_horiList.loadData = function(callback){
			$(".wev-no-data", this.$el).hide();
	        if (vm.contentSource == 2) {
				_horiList.loadDataFromFormmode(callback);
			} else if(vm.contentSource == 1) {
				_horiList.loadDataFromURL(callback);
			} else if(vm.contentSource == 3) {
				_horiList.loadDataFromMock(callback);
			}
		};
		
		_horiList.loadDataFromURL = function(callback){
			var that = this,actionUrl =vm.sourceurl,
				$noData = $(".wev-no-data", this.$el);
			
			var timestamp = (new Date()).valueOf();    //时间戳
	        var requestParam = {};
			var inParams = vm.options.inParams;

			listTimestamp = timestamp;

			for (var i = 0; i < inParams.length; i++) {
				var inParamObj = inParams[i];
				var paramName = inParamObj.paramName;

				requestParam[paramName] = mUtil.fmtParamValue(inParamObj.paramValue, {
					searchKey: this.searchKey,
					pageSize: vm.pageSize
				});
			}
            
            //拓展requestParam
            $.extend(true, requestParam, mUtil.getPageParam(this.pageid), dynamicParam);
            
            mUtil.ajax(actionUrl, requestParam, function (responseText) {
				if (timestamp != listTimestamp) return;
				var result = responseText;
				try {
					if (typeof responseText == 'string'){
						result = JSON.parse(responseText);
					}
				} catch (e) {
					mUtil.getLabel(5294, "列表数据转换成JSON时出现异常，数据如下：",function(msg){
						console.error(msg + "\n" + responseText);
	                });
					if (typeof (callback) == "function") { callback.call(this, false); }
					return;
				}
                
                var outFormat = vm.options.outFormat,
                	jsonDatas = result[outFormat.DATAS],
                	totalSize = parseInt(result[outFormat.TOTAL_SIZE]),
                	normalview = vm.normalview,
                	rd = {};
				var datas = jsonDatas.map(function (jd) {
					var dataurl = "javascript:void(0);";
					var urlComponents;

					if (!vm.options.readonly) {
						dataurl = mUtil.replaceValAndVarParser(vm.options.dataurl || "", jd);
					}

					urlComponents = mUtil.parseUrl(dataurl);
					return {
						dataurl: urlComponents[0],
						dataAjax: vm.dataAjax || urlComponents[1],
						formdata: urlComponents[2],
						imgFieldValue: mUtil.replaceValAndVarParser(normalview.imgfield || "", jd),
						titleFieldValue: mUtil.replaceValAndVarParser(normalview.titlefield || "", jd),
						readonly: vm.options.readonly,
						otherFieldValue: normalview.otherfields.map(function (field) {
							var rowFieldValue = mUtil.replaceValAndVarParser(field, jd);

							if (rowFieldValue.length) return rowFieldValue;
						})
					};
				});

                dataList = dataList.concat(jsonDatas);
                rd.datas = datas;
                rd.totalSize = totalSize;
                
                var templateHtml = [
	                '{@each datas as d}',
	                    '<li class="wev-table-view-cell wev-media">',
	                          '<a href="$${d.dataurl}" data-reload="true" data-formdata="${d.formdata}" class="wev-navigate-right{@if d.readonly} wev-data-readonly"{@else}" data-ignoreviewimg{@/if} data-ajax="${d.dataAjax}">',
	                              '<div class="wev-media-object">',
	                                  '$${d.imgFieldValue}',
	                              '</div>',
	                              '<div class="wev-media-body">',
	                                  '<div class="wev-nowrap">$${d.titleFieldValue}</div>',
	                                  '{@each d.otherFieldValue as row}',
	                                      '<div class="wev-nowrap">',
	                                          '$${row}',
	                                      '</div>',
	                                  '{@/each}',
	                              '</div>',
	                          '</a>',
	                    '</li>',
	                '{@/each}'    
	            ].join('');
                var html = mUtil.parseTemplate(templateHtml, rd);
                var $list = $(".wev-table-view", that.$el);
				var $newList = $(html);

				$list.html("").append($newList);
                
                require(["lazyImgHelper"]);
                
    			if(rd.totalSize <= 0){
    				$noData.show();
    			}
                
                if(mUtil.isFunction(callback)){
                	callback.call(this);
                }
                mUtil.renderVarParser(vm.needParseVar);
            });
		};
		
		_horiList.loadDataFromFormmode = function(callback){
			var timestamp = new Date().valueOf();    //时间戳

	        listTimestamp = timestamp;
	        
	        var parseFields = fieldHelper.parseFieldIds(JSON.stringify(vm));
			var reqparam = {action: "getDatas", searchid: vm.sourceid, pageSize: vm.pageSize, fieldparse: parseFields};
	        //拓展请求参数
	        $.extend(true, reqparam, dynamicParam);
	        
	        var actionUrl = mUtil.getActionUrl(this.type, reqparam, this.pageid);
	        
	        mUtil.getJSON(actionUrl, function(result){
	        	result = result.data;
	            if(timestamp != listTimestamp) return;
	            
	            _horiList.renderData(result, callback);
	        });
		};
		
		_horiList.loadDataFromMock = function(callback){
			var result = fieldHelper.convertFieldMockData(vm.mockData, 1, vm.pageSize);
			if(result && result != ""){
				_horiList.renderData(result, callback);
			}else{
				callback(false, true);
			}
		};
		
		_horiList.renderData = function(result, callback){
			var $comp = this.$comp;
			var fieldmap = result.fieldMap, listDatas = [], normalDatas = [];
			var needReplaceUrl = mUtil.containsVariables(vm.options.dataurl);
			result.datas.forEach(function(data){
				var dataItem = {};
				var dataId = data.keyvalue;
				var dataurl = "";
				if(vm.options.urltype == 1 && vm.options.dataurl){
					dataurl = needReplaceUrl ? fieldHelper.replaceVal(vm.options.dataurl, data.dataMap) : vm.options.dataurl;
					if(dataurl.indexOf("javascript:") == -1){
						if(!vm.options.isNewLayout && dataurl.indexOf("&billid=") == -1 && dataurl.indexOf("?billid=") == -1){
			    			dataurl += (dataurl.indexOf("?") == -1 ? "?" : "&") + "billid=" + dataId;
			    		}
					}
				}else{
					dataurl = "javascript:void(0);";
				}
				
				dataItem.id = dataId;
				dataItem.dataurl = dataurl;
				dataItem.dataMap = data.dataMap;
				listDatas.push(dataItem);
				
				normalDatas.push(convertShowValue(data, fieldmap, vm.normalview));
			});
			dataList = dataList.concat(listDatas);
	        var templateHtml = [
	            '{@each datas as d}',
	                '<li class="wev-table-view-cell wev-media">',
	                      '<a href="javascript:void(0);" class="wev-navigate-right{@if d.readonly} wev-data-readonly"{@else}" data-ignoreviewimg{@/if}>',
	                          '<div class="wev-media-object">',
	                              '$${d.imgFieldValue}',
	                          '</div>',
	                          '<div class="wev-media-body">',
	                              '<div class="wev-nowrap">$${d.titleFieldValue}</div>',
	                              '{@each d.otherFieldValue as row}',
	                                  '<div class="wev-nowrap">',
	                                      '{@each row as col}',
	                                          '<div class="wev-col">$${col}</div>',
	                                      '{@/each}',
	                                  '</div>',
	                              '{@/each}',
	                          '</div>',
	                      '</a>',
	                '</li>',
	            '{@/each}'    
	        ].join('');
	        
	        var html = mUtil.parseTemplate(templateHtml, {datas: normalDatas});
	        var $list = $(".wev-horitable-view", $comp);
			var $newList = $(html);
			
			$list.html("").append($newList);
	        
	        require(["lazyImgHelper"]);
	        
			if(normalDatas.length == 0){
				$(".wev-no-data", $comp).attr('data-title',i18n.NO_DATA).show();
			}
	        
			if (mUtil.isFunction(callback)) {
				callback.call(this);
			}
			mUtil.renderVarParser(vm.needParseVar);
		};
		
		function convertShowValue(billdata, fieldmap, fieldset){
			var imgfield = fieldset.imgfield, otherfields = fieldset.otherfields;
			//图片字段
			var imgDisplay = fieldHelper.isSettingValue(imgfield), imgFValue = '';
			imgDisplay && (imgFValue = fieldHelper.getFieldValue(imgfield, billdata, fieldmap, true, vm.options.readonly));
			//其他字段
			var otherFValue = [];
			if(mUtil.isArray(otherfields)){
				otherfields.forEach(function(rowfields) {
					var rowFieldValue = [];
					rowfields.forEach(function(colfield) {
						if(fieldHelper.isSettingValue(colfield)){
							var colFieldValue = fieldHelper.getFieldValue(colfield, billdata, fieldmap, false, vm.options.readonly);
							rowFieldValue.push(colFieldValue);
						}
					});
					if(rowFieldValue.length > 0){
						otherFValue.push(rowFieldValue);
					}
				});
			}
			
			return {
				id				: billdata.keyvalue,
				readonly		: vm.options.readonly,
				imgFieldDisplay	: imgDisplay,
				imgFieldValue	: imgFValue,
				titleFieldValue	: fieldHelper.getFieldValue(fieldset.titlefield, billdata, fieldmap),
				otherFieldValue	: otherFValue
			};
		}
		
		_horiList.refreshList = _horiList.refreshList.bind(this);
		_horiList.loadData = _horiList.loadData.bind(this);
		_horiList.loadDataFromURL = _horiList.loadDataFromURL.bind(this);
		_horiList.loadDataFromFormmode = _horiList.loadDataFromFormmode.bind(this);
		_horiList.loadDataFromMock = _horiList.loadDataFromMock.bind(this);
		_horiList.renderData = _horiList.renderData.bind(this);

    };

    return Component.init(HoriList);
});