hust-epi/admin-ui/yvanui/yvanui.yvsearch.js

/**
 * yvan.yvsearch.js
 * @author luoyifan
 * 2019-07-14 11:14:00
 */
'use strict';
(function ($) {

  function init(target, context) {
    var state = $.data(target, 'yvsearch');
    var option = state.options;
    var $dom = $(target);

    option = $.extend({}, option);
    delete option.name;
    delete option.widget;
    delete option.xtype;
    delete option.required;

    var jqxOpt = {
      width: option.width,
      height: option.height,
    };
    $dom.jqxInput(jqxOpt);
    state.realValue = option.value;

    $dom.addClass('yvgrid-searchbox');
    $dom.on('click', function (event) {
      var $me = $(this);
      var width = $me.outerWidth();
      if (width - event.offsetX < 25) {
        //查询按钮
        $me.yvsearch('open', undefined, event);

      } else if (width - event.offsetX < 50) {
        //清空按钮
        $me.yvsearch('clear', event);
      }
    });

    $dom.on('mousemove', function (event) {
      var $me = $(this);
      var width = $me.outerWidth();
      if (width - event.offsetX < 20) {
        //查询按钮
        $me.removeClass('yvgrid-searchbox-hilight1');
        $me.addClass('yvgrid-searchbox-hilight2');

      } else if (width - event.offsetX < 44) {
        //清空按钮
        $me.removeClass('yvgrid-searchbox-hilight2');
        $me.addClass('yvgrid-searchbox-hilight1');

      } else {
        $me.removeClass('yvgrid-searchbox-hilight1');
        $me.removeClass('yvgrid-searchbox-hilight2');
      }

    });

    $dom.on('mouseout', function (event) {
      var $me = $(this);
      $me.removeClass('yvgrid-searchbox-hilight1');
      $me.removeClass('yvgrid-searchbox-hilight2');
    });

    $dom.on('keydown', function (event) {
      if (event.keyCode === 13) {
        $(this).yvsearch('open', undefined, event);
      }
    });

    $dom.on('blur', function (event) {
      var state = $.data(this, 'yvsearch');
      //离开焦点时，吧值还原
      if (!state.isWidgetOpen) {
        $(target).jqxInput('val', state.realValue || '');
      }
    });
  }

  $.fn.yvsearch = function (options, param) {
    if (typeof options == 'string') {
      var method = $.fn.yvsearch.methods[options];
      if (method) {
        var args = [this];
        for (var i = 1; i < arguments.length; i++) {
          args.push(arguments[i]);
        }
        return method.apply(this, args);

      } else {
        console.error('not found method:' + options);
      }
    }

    options = options || {};
    return this.each(function () {
      var state = $.data(this, 'yvsearch');
      if (state) {
        $.extend(state.options, options);
      } else {
        $.data(this, 'yvsearch', {
          options: $.extend({}, $.fn.yvsearch.defaults, options)
        });
      }
      init(this);
    });
  };

  $.fn.yvsearch.methods = {
    getQuery: function ($dom) {
      return $dom.jqxInput('val');
    },
    getValue: function ($dom) {
      var state = $.data($dom[0], 'yvsearch');
      if (!state || !state.realValue) {
        return '';
      }
      return state.realValue;
    },
    setValue: function (jq, value) {
      return jq.each(function () {
        var state = $.data(this, 'yvsearch');
        state.realValue = value;
        return $(this).jqxInput('val', value);
      });
    },
    focus: function ($dom) {
      setTimeout(function () {
        $dom.focus();
      }, 200);
    },
    confirm: function (jq, row) {
      return jq.each(function () {
        var $me = $(this);
        var state = $.data(this, 'yvsearch');
        var option = state.options;
        if ($.type(option.onChange) === 'function') {
          option.onChange.call(this, row);
        }

        option = $.extend({}, option.widget);

        $me.yvsearch('close');
        var successOpt = option['success'] || option.bind;

        if (!successOpt) {
          //没有配置，只写自己
          if (option.name && row.hasOwnProperty(option.name)) {
            $me.yvsearch('setValue', row[option.name]);
            return true;
          }
        }

        if ($.type(successOpt) === "function") {
          //是函数，调函数
          return successOpt.call(this, row);
        }

        //字符串或数组，直接调用数组
        if ($.type(successOpt) === "string") {
          successOpt = [successOpt];
        }

        var obj = {};
        if ($.type(successOpt) === 'array') {
          //数组，根据名字逐个写入
          $.each(successOpt, function (index, name) {
            obj[name] = row[name];
          });

        } else if ($.type(successOpt) === 'object') {
          //对象，根据映射关系写入
          var vs = successOpt;
          for (var prop in vs) {
            if (!vs.hasOwnProperty(prop)) continue;
            if (!row.hasOwnProperty(vs[prop])) {
              console.error('弹出框没有属性' + vs[prop], row);
              continue;
            }
            obj[prop] = row[vs[prop]];
          }
        }

        $me.up('yvgrid').yvgrid('setEditRow', obj, this);
        $me.yvsearch('saveValue');
        if ($.type(option['afterConfirm']) === 'function') {
          option['afterConfirm'](obj);
        }
      });
    },
    restore: function (jq) {
      return jq.each(function () {
        var state = $.data(this, 'yvsearch');
        $(this).jqxInput('val', state.realValue || '');
      });
    },
    clear: function (jq) {
      return jq.each(function () {
        var state = $.data(this, 'yvsearch');
        var option = state.options;
        if ($.type(option.onChange) === 'function') {
          option.onChange.call(this, {});
        }

        var widget = $.extend({}, option.widget);

        $(this).yvsearch('setValue', '');

        var obj = {};
        if ($.type(widget.clear) === "function") {
          var ret = widget.clear();
          if (!ret) {
            //没有返回任何数据, 就是纯调用
            return;
          }
          widget.clear = ret;
        }

        if ($.type(widget.clear) === "object") {
          //清空对象就是目标本身
          obj = $.extend({}, widget.clear);

        } else if ($.type(widget.clear) === "array") {
          //按数组内容清空
          $.each(widget.bind, function (index, name) {
            obj[name] = '';
          });

        } else if ($.type(widget.bind) === 'object') {
          //bind 对象，按名字清空
          for (var prop in widget.bind) {
            obj[prop] = '';
          }

        } else if ($.type(widget.bind) === 'array') {
          //按数组内容清空
          $.each(widget.bind, function (index, name) {
            obj[name] = '';
          });
        }

        //目前 yvsearch 只会出现在 yvgrid 中，只处理 yvgrid 的清空
        $(this).up('yvgrid').yvgrid('setEditRow', obj, this);
      });
    },
    close: function (jq) {
      return jq.each(function () {
        var state = $.data(this, 'yvsearch');
        if (state.dlgId) {
          $('.dlg_' + state.dlgId).window('close');
        }
      });
    },
  };

  $.fn.power.defaults.xtype.yvsearch = function ($targetDOM, option, context) {
    if (option.name) {
      var $dom = $("<input name='" + option.name + "' xtype='yvsearch' />").appendTo($targetDOM);
    } else {
      $dom = $("<input xtype='yvsearch' />").appendTo($targetDOM);
    }
    return $dom.yvsearch(option, context);
  };

  $.fn.yvsearch.defaults = {};

})(jQuery);