element-tree-grid/types/index.jsx

element tree table with vue

import * as Expand from './expand';
import ElTableInjecter from './inject';
import { ElTableTreeColumnPropDefine } from "./props";
import * as util from './utils';
var RenderFolder = function (h, context, scope) {
    if (util.isNeedExpanedRow(context, scope)) {
        setTimeout(function () {
            Expand.doExpand(context, scope);
        }, 15);
    }
    return <span onClick={function (e) {
        e.preventDefault();
        Expand.doExpand(context, scope);
    }}>
    <span style={{ paddingLeft: util.paddingLeft(context, scope) }}>
      <i class={util.icon(scope, context)}></i>{" "}
      <i class={util.folderIcon(context, scope)}></i>
    </span>
    {util.renderDetail(h, context, scope)}
  </span>;
};
var RenderLeaf = function (h, context, scope) {
    return <span style={{ paddingLeft: util.paddingLeft(context, scope) }}>
    <i class={context.props.fileIcon}></i>
    {util.renderDetail(h, context, scope)}
  </span>;
};
var RenderContext = function (h, context, scope) {
    ElTableInjecter.Inject(context, scope);
    var hasChild = util.hasChild(context, scope);
    if (hasChild)
        return RenderFolder(h, context, scope);
    return RenderLeaf(h, context, scope);
};
var ElTableTreeColumn = {
    name: 'el-table-tree-column',
    functional: true,
    props: ElTableTreeColumnPropDefine,
    render: function (h, context) {
        // props will be lost when `scopedSlots` is rendering
        var attr = {};
        Object.keys(context.props).map(function (k) {
            attr[k] = context.props[k];
        });
        var attrs = { attrs: attr };
        return <el-table-column {...attrs} scopedSlots={{ default: function (scope) { return RenderContext(h, context, scope); } }}>
    </el-table-column>;
    }
};
if (typeof window !== 'undefined' && window.Vue) {
    window.Vue.component('el-table-tree-column', ElTableTreeColumn);
}
export default ElTableTreeColumn;