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

/**
 * power
 * @author luoyifan
 * 2018-11-22 17:32:00
 */
"use strict";
$.parser.auto = false;

(function ($) {

  function processFooter($target, item, context) {
    if (!item.hasOwnProperty('footer')) {
      return;
    }
    if ($.type(item.footer) === 'array') {
      var $toolbar = $('<div></div>');
      $target.append($toolbar);
      $toolbar = renderDispatch($toolbar, { xtype: 'toolbar', items: item.toolbar }, context);
      item.footer = $toolbar;
      return $toolbar;
    }
    if (($.type(item.footer) === 'object') || $.type(item.footer) === 'string') {
      if (!item.footer.id) {
        item.footer.id = $.yvan.createId();
      }
      var $toolbar = renderDispatch($target, item.footer, context);
      item.footer = $toolbar;
      return $toolbar;
    }
  }

  function processToolbar($target, item, context) {
    if (!item.hasOwnProperty('toolbar')) {
      return;
    }
    if ($.type(item.toolbar) === 'array') {
      var $toolbar = $('<div></div>');
      $target.append($toolbar);
      $toolbar = renderDispatch($toolbar, { xtype: 'toolbar', items: item.toolbar }, context);
      item.toolbar = $toolbar;
      return $toolbar;
    }
    if ($.type(item.toolbar) === 'object') {
      if (!item.toolbar.id) {
        item.toolbar.id = $.yvan.createId();
      }
      var $toolbar = renderDispatch($target, item.toolbar, context);
      item.toolbar = $toolbar;
      return $toolbar;
    }
  }

  function beforeRender($target, opts, context) {
    if ($.type(opts.onBeforeRender) === 'function') {
      var r = opts.onBeforeRender.apply(this, arguments);
      if (r === false) {
        return false;
      }
    }

    var funs = $.fn.power.defaults.beforeRender;
    for (var i = 0; i < funs.length; i++) {
      var fun = funs[i];
      if ($.type(fun) === 'function') {
        var r = fun.call(this, $target, opts, context);
        if (r === false) {
          return false;
        }
      }
    }

    return true;
  }

  function afterRender($target, opts, context) {
    var funs = $.fn.power.defaults.afterRender;
    for (var i = 0; i < funs.length; i++) {
      var fun = funs[i];
      if ($.type(fun) === 'function') {
        fun.apply(this, arguments);
      }
    }

    if ($.type(opts.onRender) === 'function') {
      opts.onRender.apply(this, arguments);
    }
  }

  function renderDispatch($target, item, context, parent) {
    if (!item) {
      return;
    }
    if ($.type(item) === 'array') {
      //元素是数组，用 row 隔开
      var $row = $('<div class="yvan-row"></div>');
      $target.append($row);
      renderEach($row, item, context, parent);
      return;
    }
    if ($.type(item) === 'string') {
      //元素是字符串，直接输出html
      $target.append(item);
      return;
    }
    if ($.type(item) === 'function') {
      //item 是函数
      var r = item.apply(this, context);
      renderDispatch($target, r, context);
      return;
    }

    // yvTreeGrid 专用方法
    function resizeMe() {
      var $panel = $(this).parent();
      var d = $panel.height() - 50;
      $target.css({
        "height": d + 'px'
      });
    }

    //if (item.importUrl) {
    //    //带有url, 需要 ajax 获取配置内容
    //    var $dom = $('<div></div>'); //带一个占位符
    //    $target.append($dom);
    //    $.yvan.readyJs({
    //        url: item.importUrl,
    //        success: function (data) {
    //            var vv = eval(data);
    //            var importBack = data.importUrl;
    //            //扩展到当前属性
    //            data = $.extend({}, vv(), item);
    //            if (importBack) {
    //                //配置 ajax 结果中带有 importUrl 属性，需要继续 importUrl
    //                data.importUrl = importBack;
    //            } else {
    //                delete data.importUrl;
    //            }
    //            renderDispatch($dom, data, context);
    //        }
    //    });
    //    return;
    //}

    item.xtype = item.xtype || 'textbox';

    switch (item.xtype) {
      case 'textbox':
      case 'combobox':
      case 'searchbox':
      case 'datebox':
      case 'numberbox':
      case 'combotree':
      case 'combotreegrid':
      case 'combogrid':
      case 'datetimebox':
      case 'tagbox':
      case 'yvselect':
      case 'maskedbox':
      case 'passwordbox':
      case 'filebox':
      case 'numberspinner':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        var css = 'easyui-' + item.xtype;

        //宽度计算
        if (!item.width) {
          item.span = item.span || 1;
          if (item.span === 1) {
            item.width = 280;
          } else if (item.span === 2) {
            item.width = 560;
          } else if (item.span === 3) {
            item.width = 840;
          }
        }

        //生成DOM
        var $dom = $('<input class="' + css + ' ctl_' + item.name + '" name="' + item.name + '" />');
        if(typeof(item.ff) === 'number'){
          $dom.attr('ff', item.ff)
        }
        $.yvan.fillCommonProperties($dom, item);
        $target.append($('<div class="vv"></div>').append($dom));

        if ($.inArray(item.xtype, ['textbox']) >= 0 && item.widget) {
          item.icons = [
            {
              iconCls: 'icon-clear',
              handler: widget.clear
            }, {
              iconCls: 'icon-search',
              handler: function (e) {
                widget.show(item.widget, this);
              }
            }];
        }

        if ($.inArray(item.xtype, ['textbox']) >= 0 && item.dialog) {
          item.icons = [
            {
              iconCls: 'icon-clear',
              handler: widget.clear
            }, {
              iconCls: 'icon-search',
              handler: function (e) {
                var me = this;
                $.yvan.showDialog(me, item.dialog);
              }
            }];
        }

        if (window.hasOwnProperty('shortcut')) {
          shortcut.processInput($dom, item, context);
        }

        if (parent) {
          //代入上级给的 subLabelWidth/subControlWidth
          if (parent.hasOwnProperty('subLabelWidth') && !item.hasOwnProperty('labelWidth')) {
            item.labelWidth = parent.subLabelWidth;
          }
          if (parent.hasOwnProperty('subControlWidth') && !item.hasOwnProperty('width')) {
            item.width = parent.subControlWidth;
          }
        }

        //初始化元素
        $dom[item.xtype](item);
        if(item.labelWidth!=='auto' && item.labelWrap===true){
          var labelDOM = $dom.prev();
          if(labelDOM.is('label')){
            labelDOM.css({
              'line-height': '16px',
              'white-space': 'pre-wrap'
            })
          }
        }
        if (item.xtype === 'searchbox') {
          $dom.searchbox('onSysRender');
        }
        if (item.xtype === 'maskedbox') {
          var $c = $dom.maskedbox('textbox');
          $c.css({ height: '30px', lineHeight: '30px' });
          $c.parent().css({ height: '30px' });
        }
        if (item.hasOwnProperty('maxlength') && $.type(item.maxlength) === 'number') {
          setTimeout(function () {
            if ($dom.data().hasOwnProperty('textbox')) {
              $dom.textbox('textbox').attr('maxlength', item.maxlength);
            }
          });
        }

        if (window.hasOwnProperty('shortcut')) {
          shortcut.processInputAfter($dom, item, context);
        }

        if (item.readonly) {
          //只读框，为span 增加一个 tooltip 属性
          var $span = $dom.next();
          $span.tooltip({
            position: 'bottom',
            onShow: function () {
              var value = $dom.val();
              if (!value || $.trim(value).length <= 10) {
                $(this).tooltip('destroy');

              } else {
                $(this).tooltip({
                  content: value
                }).tooltip('tip').css({
                  color: 'rgb(255, 255, 255)',
                  'background-color': 'rgb(255, 126, 0)'
                });
              }
            }
          });
        }

        if (item.xtype === 'combobox') {
          //combobox 点击后自动下拉
          $dom.next().on('click', 'input', function () {
            if (!$dom.combobox('options').readonly) {
              $dom.combobox("showPanel");
            }
          });
          item.isFirstLoad = true;
          $dom.combobox({
            onSelect: function (data) {
              if (item.onSelect && $.type(item.onSelect) === 'function') {
                item.onSelect(data);
              }
              setTimeout(function () {
                if (item.isFirstLoad && item.onValue && $.type(item.onValue) === 'function') {
                  item.onValue(data);
                }
                item.isFirstLoad = false;
              }, 100);
            }
          });
          $dom.combobox({
            onChange: function (data, value) {
              if (item.onChange && $.type(item.onChange) === 'function') {
                item.onChange(data, value);
              }
              if (item.onValue && $.type(item.onValue) === 'function') {
                item.isFirstLoad = false;
                item.onValue(data, value);
              }
            }
          });
          //.bind('focus', function () {
          //  $dom.combobox("showPanel");
          //})
          //.bind('blur', function () {
          //  $dom.combobox("hidePanel");
          //});
        }

        if (item.xtype === 'datebox') {
          //datebox 点击后自动下拉
          $dom.textbox("textbox").bind('click', function () {
            if (!$dom.datebox('options').readonly) {
              $dom.datebox("showPanel");
            }
          });
        }

        if (item.xtype === 'datetimebox') {
          //datetimebox 点击后自动下拉
          $dom.textbox("textbox").bind('click', function () {
            if (!$dom.datebox('options').readonly) {
              $dom.datebox("showPanel");
            }
          });
        }

        afterRender.call($dom[0], $target, item, context);
        return $dom;

      case 'offset':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        var $dom = $('<div class="yvan-form-offset" />');
        $.yvan.fillCommonProperties($dom, item);
        $target.append($dom);

        if (parent) {
          //代入上级给的 subLabelWidth/subControlWidth
          if (parent.hasOwnProperty('subLabelWidth') && !item.hasOwnProperty('labelWidth')) {
            $dom.css({ width: parent.subLabelWidth });
          }
        }

        afterRender.call($dom[0], $target, item, context);
        return $dom;

      case 'menu':
        var $dom = $('<ul class="dropdown-menu user-menu"></ul>');
        $.yvan.fillCommonProperties($dom, item);

        var items = $.yvan.getItems(item);
        for (var i = 0; i < items.length; i++) {
          var $item = $('<li></li>');
          var $a = '<a>' + items[i].text + '</a>';
          var $icon = '<i class="yvan-icon fa fa-wpforms"></i>';
          $item.append($a);
          $a.append($icon);
          $dom.append($item);
        }
        return $dom;

      case 'checkgroup':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        var $dom = $('<div class="vv"></div>');
        $.yvan.fillCommonProperties($dom, item);
        $target.append($dom);
        $dom.checkgroup(item);

        afterRender.call($dom[0], $target, item, context);
        return $dom;

      case 'radiogroup':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        var $dom = $('<div class="vv"></div>');
        $.yvan.fillCommonProperties($dom, item);
        $target.append($dom);
        $dom.radiogroup(item);

        afterRender.call($dom[0], $target, item, context);
        return $dom;

      case 'checkbox':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        var $dom = $('<input type="checkbox" />');
        $.yvan.fillCommonProperties($dom, item);
        if (item.hasOwnProperty('name')) {
          $dom.attr('name', item.name);
        }
        if (item.hasOwnProperty('checked')) {
          $dom.attr('checked', item.checked);
        }
        if (item.hasOwnProperty('disable')) {
          $dom.attr('disable', item.disable);
        }
        if (item.hasOwnProperty('primary')) {
          $dom.attr('primary', item.primary);
        }
        $target.append($dom);
        $dom.checkbox(item);
        afterRender.call($dom[0], $target, item, context);
        return $dom;

      case 'radiobutton':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        var $dom = $('<input type="radio" />');
        $.yvan.fillCommonProperties($dom, item);
        if (item.hasOwnProperty('name')) {
          $dom.attr('name', item.name);
        }
        if (item.hasOwnProperty('checked')) {
          $dom.attr('checked', item.checked);
        }
        if (item.hasOwnProperty('disable')) {
          $dom.attr('disable', item.disable);
        }
        $target.append($dom);
        $dom.radiobutton(item);

        afterRender.call($dom[0], $target, item, context);
        return $dom;

      case 'hidden':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        var $dom = $('<input type="hidden" name="' + item.name + '" />');
        $.yvan.fillCommonProperties($dom, item);
        $dom.data({ options: item });
        if (item.hasOwnProperty('value')) {
          $dom.val(item.value);
        }
        $target.append($dom);

        afterRender.call($dom[0], $target, item, context);
        return $dom;

      case 'dialog':
        //对话框本身不增加任何DOM元素，但要在Power级别记录Options
        if (!context.options.hasOwnProperty('dialogs')) {
          context.options.dialogs = {};
        }
        context.options.dialogs[item.dialogId] = item;
        break;

      case 'div':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        var $dom = $('<div></div>');
        $.yvan.fillCommonProperties($dom, item);
        $target.append($dom);
        renderEach($dom, $.yvan.getItems(item), context);

        afterRender.call($dom[0], $target, item, context);
        return $dom;

      case 'layout':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        //布局
        var $dom = $('<div class="easyui-layout"></div>');
        $.yvan.fillCommonProperties($dom, item);
        $target.append($dom);
        layoutRender($dom, item, context, item);

        afterRender.call($dom[0], $target, item, context);
        break;

      case 'panel':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        var $dom = $('<div class="easyui-panel" style="width:100%"></div>');
        $.yvan.fillCommonProperties($dom, item);
        $target.append($dom);
        $dom.panel($.extend({ border: false }, item));

        afterRender.call($dom[0], $target, item, context);
        return $dom;

      case 'group':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        //表单分组
        var $dom = $('<div style="padding: 5px 10px"></div>');
        $.yvan.fillCommonProperties($dom, item);
        var $group = $('<fieldset class="yvan-form-groups"></fieldset>');
        $dom.append($group);
        if (item.title) {
          $group.append($('<legend>' + item.title + '</legend>'));
        }
        $target.append($dom);
        renderEach($group, $.yvan.getItems(item), context, item);

        afterRender.call($dom[0], $target, item, context);
        return $dom;

      case 'form':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        var $dom = $('<form></form>');
        if ($.trim(item.name)) {
          $dom.attr('name', item.name);
        }
        $.yvan.fillCommonProperties($dom, item);
        $target.append($dom);

        //枚举下级所有元素
        renderEach($dom, $.yvan.getItems(item), context, item);

        afterRender.call($dom[0], $target, item, context);
        return $dom;

      case 'formgroup':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        var $dom = $('<form style="padding: 5px 10px"></form>');
        $.yvan.fillCommonProperties($dom, item);
        if ($.trim(item.name)) {
          $dom.attr('name', item.name);
        }

        var $group = $('<fieldset class="yvan-form-groups"></fieldset>');
        $dom.append($group);
        if (item.title) {
          $group.append($('<legend>' + item.title + '</legend>'));
        }

        $target.append($dom);
        renderEach($group, $.yvan.getItems(item), context, item);

        afterRender.call($dom[0], $target, item, context);
        return $dom;

      case 'toolbar':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        var $dom = $('<div class="easyui-toolbar"></div>');
        $.yvan.fillCommonProperties($dom, item);
        $target.append($dom);
        $dom.toolbar(item, context);

        afterRender.call($dom[0], $target, item, context);
        return $dom;

      case 'grid':
        if (!$.jgrid || !$.jgrid.yvanui) {
          return;
        }
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        var $dom = $.jgrid.createDom($target, item, context);
        afterRender.call($dom[0], $target, item, context);
        return $dom;

      case 'egrid':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        var $dom = $('<table></table>');
        $.yvan.fillCommonProperties($dom, item);
        $target.append($dom);
        egridProcess(item);
        $dom.edatagrid(item);
        if (window.hasOwnProperty('shortcut')) {
          shortcut.processGrid($dom, item, context);
        }

        afterRender.call($dom[0], $target, item, context);
        return $dom;

      case 'datalist':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        var $dom = $('<table class="easyui-datalist"></table>');
        $.yvan.fillCommonProperties($dom, item);
        $target.append($dom);
        $dom.datalist(item);

        afterRender.call($dom[0], $target, item, context);
        return $dom;

      case 'datagrid':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        var $dom = $('<table class="easyui-datagrid"></table>');
        $.yvan.fillCommonProperties($dom, item);
        $target.append($dom);
        processToolbar($target, item, context);
        $dom.datagrid(item);
        if (window.hasOwnProperty('shortcut')) {
          shortcut.processGrid($dom, item, context);
        }

        afterRender.call($dom[0], $target, item, context);
        return $dom;

      case 'tabs':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        var $dom = $('<div class="easyui-tabs"></div>');
        $.yvan.fillCommonProperties($dom, item);
        $target.append($dom);
        tabRender($dom, item, context, item);

        afterRender.call($dom[0], $target, item, context);
        return $dom;

      case 'tree':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        var $dom = $('<div class="easyui-tree"></div>');
        $.yvan.fillCommonProperties($dom, item);
        $target.append($dom);
        $dom.tree(item);

        afterRender.call($dom[0], $target, item, context);
        return $dom;

      case 'treegrid':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        var $dom = $('<div class="easyui-treegrid"></div>');
        $.yvan.fillCommonProperties($dom, item);
        $target.append($dom);
        $dom.treegrid(item);

        afterRender.call($dom[0], $target, item, context);
        return $dom;

      case 'propertygrid':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        var $dom = $('<table></table>');
        $.yvan.fillCommonProperties($dom, item);
        $target.append($dom);
        $dom.propertygrid(item);

        afterRender.call($dom[0], $target, item, context);
        return $dom;

      case 'button':
        if (beforeRender.call(this, $target, item, context) === false) {
          return;
        }

        var $dom = $('<a class="easyui-linkbutton"></a>');
        $.yvan.fillCommonProperties($dom, item);
        $target.append($dom);
        $dom.linkbutton(item);

        afterRender.call($dom[0], $target, item, context);
        return $dom;

      default:
        if ($.fn.power.defaults.xtype.hasOwnProperty(item.xtype)) {
          //从扩展组件中找
          if (beforeRender.call(this, $target, item, context) === false) {
            return;
          }

          var id = $.yvan.createId(item.xtype);
          $target.attr('id','super_' + id);
          var $dom = $.fn.power.defaults.xtype[item.xtype]($target, item, context, id);
          if (item.xtype === 'yvtreegrid') {
            var $panel = $target;
            if ($panel.data().hasOwnProperty('panel')) {
              $panel.panel({onResize: resizeMe});
              resizeMe.call($panel);
            }
          }
          afterRender.call($dom[0], $target, item, context);
          return $dom;

        }
        console.log('无法识别的元素类型', item.xtype);
    }
  }

  function renderEach($target, items, context, parent) {
    for (var i = 0; i < items.length; i++) {
      renderDispatch($target, items[i], context, parent);
    }
  }

  function tabRender($target, item, context) {
    var tabsOption = $.yvan.getItems(item);
    var doms = [];
    for (var i = 0; i < tabsOption.length; i++) {
      var tabOption = tabsOption[i];
      if ($.type(tabOption) === 'function') {
        tabOption = tabOption(context);
      }
      if (!tabOption) {
        continue;
      }

      if (beforeRender.call(this, $target, tabOption, context) === false) {
        continue;
      }

      var $dom = $('<div title="' + (tabOption.title || '') + '" xtype="tab"></div>');
      $dom.attr('data-options', dataOptions(tabOption, ['title', 'lazy']));
      $.yvan.fillCommonProperties($dom, tabOption);
      doms.push($dom);
      $target.append($dom);

      afterRender.call($dom[0], $target, tabOption, context);
      if (tabOption.lazy) {
        $.data($dom[0], 'lazyOption', tabOption);
      } else {
        renderEach($dom, $.yvan.getItems(tabOption), context);
      }
    }
    $target.tabs($.extend({}, item, {
      onSelect: function (title, index) {
        var $tabDom = $(this).tabs('getTab', index);
        if ($tabDom.data().hasOwnProperty('lazyOption')) {
          renderEach($tabDom, $.yvan.getItems($tabDom.data().lazyOption), context);
          delete $tabDom.data().lazyOption;
        }

        if (item.onSelect) {
          item.onSelect.apply(this, arguments);
        }

        setTimeout(function(){
          shortcut.ffApply($tabDom)
        })
      }
    }));
  }

  function layoutRender($target, opts, context) {
    //var childProp = ['height', 'width', 'split', 'border', 'title'];

    var functions = [];
    for (var name in opts) {
      if (!opts.hasOwnProperty(name)) continue;
      var value = opts[name];
      if ($.inArray(name, ['xtype', 'attr', 'itemId', 'id', 'html', 'class', 'css', 'title', 'onRender', 'onBeforeRender']) >= 0) {
        //忽略属性
        continue;
      }

      switch (name) {
        case 'north': //上面
        case 'center': //中间
        case 'west': //左边
        case 'east': //右边
        case 'south': //下面
          if (beforeRender.call(this, $target, value, context) === false) {
            continue;
          }

          var $dom = $('<div></div>');
          $dom.attr('data-options', dataOptions(value, [], {
            region: name
          }));
          $.yvan.fillCommonProperties($dom, value);
          $target.append($dom);
          $dom.attr('tabIndex', -1);
          //继续递归
          (function ($dom, $target, items, context, value) {
            functions.push(function () {
              renderEach($dom, items, context);
              afterRender.call($dom[0], $target, value, context);
            });
          })($dom, $target, $.yvan.getItems(value), context, value);
          break;

        case 'assist':
          //辅助类操作
          renderEach(null, opts[name], context);
          break;

        default:
          //renderDispatch($target, name, value);
          console.log('layout 下面只允许出现 north,center,west,east,south 属性, 未知属性:', name);
          break;
      }
    }

    $target.layout({
      fit: true
    });

    functions.forEach(function (v) {
      v();
    });

    $target.attr('tabIndex', -1);
    //$.yvan.parse($target);
  }

  function dataOptions(opts, exclude, mergeObj) {
    exclude.push('attr', 'itemId', 'id', 'html', 'class', 'css', 'xtype', 'items', 'dialog', 'attr');
    var obj = mergeObj || {};
    for (var name in opts) {
      if (!opts.hasOwnProperty(name)) continue;
      if ($.inArray(name, exclude) >= 0) {
        continue;
      }
      obj[name] = opts[name];
    }
    var json = JSON.stringify(obj);
    return json.substr(1, json.length - 2);
  }

  function printLog($e) {
    var value = $e.prop("outerHTML");
    value = value.replace(new RegExp('&quot;', 'g'), "'");
    value = value.replace(/\'([^(\')"]+)\':/g, "$1:");
    console.log(value);
  }

  function egridProcess(item) {
    if (!item.hasOwnProperty('columns'))
      return;
    for (var i = 0; i < item.columns.length; i++) {
      var cg = item.columns[i];
      if ($.type(cg) !== 'array')
        continue;
      for (var j = 0; j < cg.length; j++) {
        //如果没有定义编辑框，就退出
        if (!cg[j].hasOwnProperty('editor')) continue;
        if (!cg[j].editor.options) {
          cg[j].editor.options = {};
        }

        //默认 tooltip 在底端
        if (cg[j].editor.options.hasOwnProperty('tipPosition')) continue;
        cg[j].editor.options.tipPosition = 'top';

        //绑定onChange属性
        if ($.type(cg[j].editor.onChange) === 'function') {
          (function (vv) {
            cg[j].editor.options.onChange = function (n, o) {
              var $dg = $(this).closest("div.datagrid-view").down('egrid');
              var row = $dg.edatagrid('getEditRow');
              if ($.type(row) === 'undefined') {
                return;
              }
              vv.apply(this, [$dg, row, n, o]);
            };
          })(cg[j].editor.onChange);
        }
      }
    }
  }

  function render(target, context) {
    var opts = $.data(target, 'power').options;
    var $target = $(target);

    // if ($.type(opts.title) === 'string') {
    //     $(document).attr("title", opts.title);
    // }
    if (beforeRender.call(this, $target, opts, context) === false) {
      return;
    }

    //power 是快捷键容器
    if (window.hasOwnProperty('shortcut')) {
      shortcut.createContainer($target, context);
    }
    $target.addClass('easyui-layout');
    $.yvan.fillCommonProperties($target, opts);
    if (!$target.attr('xtype')) {
      $target.attr('xtype', 'power');
    }
    $target.html('');

    layoutRender($target, opts, context);

    afterRender.call($target[0], $target, opts, context);
    //$.yvan.parse($target);
  }

  $.fn.power = function (options, param) {
    if (typeof options === 'string') {
      var method = $.fn.power.methods[options];
      return method(this, param);
    }

    options = options || {};
    var context = $.extend({}, param);
    return this.each(function () {
      var state = $.data(this, 'power');
      if (state) {
        //扩展属性
        $.extend(state.options, options);
        context.options = state.options;
      } else {
        //新加属性
        context.options = $.extend({}, options);
        $.data(this, 'power', {
          options: context.options
        });
      }
      render(this, context);
    });
  };

  $.fn.power.methods = {
    find: function (jq, itemId) {
      return jq.find('.ctl_' + itemId);
    },
    renderDispatch: function (jq, param) {
      return renderDispatch(param.$target, param.item, param.context);
    },
    renderEach: function (jq, param) {
      return renderEach(param.$target, param.items, param.context);
    },
    processToolbar: function (jq, param) {
      return processToolbar(param.$target, param.item, param.context);
    },
    processFooter: function (jq, param) {
      return processFooter(param.$target, param.item, param.context);
    }
  };

  $.fn.power.defaults = {
    beforeRender: [],
    afterRender: [],
    xtype: {}
  };
  $.fn.power.dialogs = {
    defaults: {
      title: '未命名对话框',
      width: 300,
      height: 200,
      resizable: true,
      maximizable: true,
      collapsible: false,
      minimizable: false,
      closable: true,
      modal: true,
      inline: true
    }
  };

})(jQuery);