IntelligentRecognition/ah-jjsp-web/.svn/pristine/84/84823a7d42ef20fd3de06957794c92082d88d998.svn-base

/**

 @Name：layui.age Tag标签
 @Author：lih
 @License：MIT
    
 */
 
layui.define('jquery', function(exports){
  "use strict";
  
  var $ = layui.$
  ,MOD_NAME = 'tag',
  TAG_CLASS = '.tag',
  BUTTON_NEW_TAG ='button-new-tag',
  INPUT_NEW_TAG ='input-new-tag',
  TAG_ITEM ='tag-item',
  CLOSE = 'tag-close',
  DEFAULT_SKIN ='layui-btn layui-btn-primary layui-btn-sm'
  ,tag = function(){
    this.config = {
      likeHref:'../../layui/modules/tag.css',
      skin: DEFAULT_SKIN,
      tagText:'+ New Tag'
    };
    this.configs = {}
  };
  
  //全局设置
  tag.prototype.set = function(options){
    var that = this;
    $.extend(true, that.config, options);
    tag.render();
    return that;
  };
  
  //表单事件监听
  tag.prototype.on = function(events, callback){
    return layui.onevent.call(this, MOD_NAME, events, callback);
  };
  
  //外部Tag新增
  tag.prototype.add = function(filter, options){
    var tagElem = $(TAG_CLASS + '[lay-filter='+ filter +']')
    call.add(null, tagElem, options);
    call.tagAuto(filter);
    return this;
  };
  
  //外部Tag删除
  tag.prototype.delete = function(filter, layid){
    var tagElem = $(TAG_CLASS + '[lay-filter='+ filter +']')
    ,tagItemElem = tagElem.find('>.' + TAG_ITEM + '[lay-id="'+ layid +'"]');
    call.delete(null, tagItemElem);
    return this;
  };

  //基础事件体
  var call = {
    //Tag点击
    tagClick: function(e, index, tagItemElem, options){
      window.event.cancelBubble = true;
      options = options || {};
      var othis = tagItemElem || $(this)
      ,index = index || othis.index(othis)
      ,parents = othis.parents(TAG_CLASS).eq(0)
      ,filter = parents.attr('lay-filter');
      layui.event.call(this, MOD_NAME, 'click('+ filter +')', {
        elem: parents
        ,index: index
      });
    }
    //Tag新增事件
    ,add: function(e, tagElem, options){
      var  filter = tagElem.attr('lay-filter'),
           buttonNewTag = tagElem.children('.' + BUTTON_NEW_TAG),
           index = buttonNewTag.index()
          ,newTag = '<button lay-id="'+ (options.id||new Date().getTime()) +'"' +(options.attr ? ' lay-attr="'+ options.attr +'"' : '') +' type="button" class="' + TAG_ITEM  + '">'+ (options.text||'unnaming') +'</button>';
      var result = layui.event.call(this, MOD_NAME, 'add('+ filter +')', {
        elem: tagElem
        ,index: index
        ,othis: newTag
        ,valueName:options.text
      })
      if(result === false) return;
      buttonNewTag[0] ? buttonNewTag.before(newTag) : tagElem.append(newTag);
    }
    //Tag输入事件
    ,input: function(e, othis){
      var buttonNewTag = othis || $(this)
      ,parents = buttonNewTag.parents(TAG_CLASS).eq(0)
      ,filter = parents.attr('lay-filter')
      var options = tag.configs[filter] = $.extend({}, tag.config, tag.configs[filter] || {}, options);
      //标签输入框
      var inpatNewTag = $('<div class="' + INPUT_NEW_TAG + '"><input type="text" autocomplete="off" class="layui-input"></div>');
      inpatNewTag.addClass(options.skin);
      buttonNewTag.after(inpatNewTag).remove();
      inpatNewTag.children('.layui-input').on('blur', function () {
        if(this.value){
          var options = {
            text: this.value
          }
          call.add(null, parents, options);
        }
        inpatNewTag.remove();
        call.tagAuto(filter);
      }).focus();
    }
    //Tag删除
    ,delete: function(e, othis){
      window.event.cancelBubble = true;
      var tagItem = othis || $(this).parent(), index = tagItem.index()
      ,parents = tagItem.parents(TAG_CLASS).eq(0)
      ,filter = parents.attr('lay-filter');

      var result = layui.event.call(this, MOD_NAME, 'delete('+ filter +')', {
        elem: parents
        ,index: index
      })
      if(result === false) return;
      tagItem.remove()
    }
    //Tag 自适应
    ,tagAuto: function(filter){
      filter = filter || '';
      var options = filter ? tag.configs[filter] || tag.config : tag.config;
      var elemFilter = function(){
        return filter ? ('[lay-filter="' + filter +'"]') : '';
      }();
      $(TAG_CLASS + elemFilter).each(function(){
        var othis = $(this),tagItem = othis.children('.' + TAG_ITEM), buttonNewTag = othis.children('.' + BUTTON_NEW_TAG);
        tagItem.removeClass(DEFAULT_SKIN).addClass(options.skin);
        //允许关闭
        if(othis.attr('lay-allowClose') && tagItem.length){
          tagItem.each(function(){
            var li = $(this);
            if(!li.find('.'+CLOSE)[0]){
              var close = $('<i class="layui-icon layui-unselect '+ CLOSE +'">&#x1006;</i>');
              close.on('click', call.delete);
              li.append(close);
            }
          });
        }
        //允许新增标签
        if(othis.attr('lay-newTag') && buttonNewTag.length === 0){
          buttonNewTag = $('<button type="button" class="' + BUTTON_NEW_TAG + '"></button>');
          buttonNewTag.on('click', call.input);
          othis.append(buttonNewTag);
        }
        buttonNewTag.html(options.tagText);
        buttonNewTag.removeClass(DEFAULT_SKIN).addClass(options.skin);
      });
    }
  };
  
  //初始化元素操作
  tag.prototype.init = function(filter, options){
    layui.addcss(tag.config.likeHref);
    if(filter){
      tag.configs[filter] = $.extend({}, tag.config, tag.configs[filter] || {}, options);
    }
    return call.tagAuto.call(this, filter);
  };
  
  tag.prototype.render = tag.prototype.init;

  var tag = new tag(), dom = $(document);
  tag.render();

  dom.on('click', '.' + TAG_ITEM, call.tagClick); //tag 单击事件
  exports(MOD_NAME, tag);
});