yctb-SpringBoot/web/jsp/shoudan/txzj/js/ImageSlider.js

/**
 * 图片缩略滑动模块
 */
function ImageSlider(){}
ImageSlider.prototype = {
		construct: ImageSlider,
		init: function(){
			var self = this;
			
			$('.imageSlider').delegate('.imageSliderItem','click',function(){
				var sdzlmxid = $(this).attr('data-key');
				eventProxy.emit('收单资料明细选中',{
					sdzlmxid: sdzlmxid,
					displayType: buttonGroup.getDisplayType()
				});
			});
			
			$('.imageSlider').delegate('.imageSliderItem','mouseenter',function(){
				$(this).addClass('hover');
			});
			
			$('.imageSlider').delegate('.imageSliderItem','mouseleave',function(){
				$(this).removeClass('hover');
			});
			
			eventProxy.on('收单资料明细选中',function(data){
				var sdzlmxid = data['sdzlmxid'];
				var displayType = data['displayType'];
				self.selectById(sdzlmxid,displayType);
			});
			
			eventProxy.on('收单资料选中',function(data){
				var sdzlid = data['sdzlid'];
				dataUtil.querySdzl(sdzlid,function(data){
					var sdzlmxList = data['sdzlmxList'];
					var itemList = new Array();
					var imageFilePath = "/web/imageEntry?sdzlmxid=";
					for(var i=0;i<sdzlmxList.length;i++){
						var sdzlmx = sdzlmxList[i];
						itemList.push({
							key: sdzlmx['sdzlmxid'],
							value: imageFilePath+sdzlmx['sdzlmxid']
						});
					}
					self.load(itemList);
					self.flush();
				});

			});
			
			eventProxy.on('本地上传完成',function(data){
				var sdzlid = menuTree.getSelectedItem()['key'];
				dataUtil.querySdzl(sdzlid,function(data){
					var sdzlmxList = data['sdzlmxList'];
					var itemList = new Array();
					var imageFilePath = "/web/imageEntry?sdzlmxid=";
					for(var i=0;i<sdzlmxList.length;i++){
						var sdzlmx = sdzlmxList[i];
						itemList.push({
							key: sdzlmx['sdzlmxid'],
							value: imageFilePath+sdzlmx['sdzlmxid']
						});
					}
					
					self.load(itemList);
					self.flush();
				});
			});
		},
		/**
		 * 读取图片列表
		 * @param itemList
		 */
		load: function(itemList){
			this._itemList = itemList;
		},
		/**
		 * 渲染界面
		 */
		flush: function(){
			$('.imageSlider').empty();
			var itemList = this._itemList;
			for(var i=0;i<itemList.length;i++){
				var item = itemList[i];
				var key = item['key'];
				var value = item['value'];
				var element = '<li data-key="'+key+'" class="imageSliderItem"><img class="lazy" style="width:100px;height:100px;" data-original="'+value+'" /><span style="display: block;text-align: center;">'+(i+1)+'</span></li>';
				$('.imageSlider').append(element);
			}
			$(".imageSlider img.lazy").lazyload({
				threshold: 200,
				container: $('.imageSlider')
			});
		},
		/**
		 * 选择图片(通过ID)
		 * @param id
		 * @param displayStyle
		 */
		selectById: function(id,displayStyle){
			var itemList= this._itemList;
			for(var i=0;i<itemList.length;i++){
				var item = itemList[i];
				var key = item['key'];
				var value = item['value'];
				if(id == key){
					$('.imageSliderItem[data-key="'+id+'"]').addClass('selected').siblings().removeClass('selected');
					this._curItem = item;
					break;
				}
			}
			
			
		},
		/**
		 * 选择图片(通过序号)
		 * @param index
		 * @param displayStyle
		 */
		selectByIndex: function(index,displayStyle){
			
		},
		/**
		 * 获取当前选中图片
		 */
		getSelectedItem: function(){
			return this._curItem;
		}
};
var imageSlider = new ImageSlider();