ext js layout and tree

数据

 

 

<configuration>
  <configSections>
    <section name="hibernate-configuration" type="NHibernate.Cfg.ConfigurationSectionHandler, NHibernate" />
  </configSections>

  <hibernate-configuration xmlns="urn:nhibernate-configuration-2.2">
    <session-factory>
      <property name="show_sql">true</property>
      <property name="dialect">NHibernate.Dialect.MsSql2005Dialect</property>
      <property name="connection.provider">NHibernate.Connection.DriverConnectionProvider</property>
      <property name="command_timeout">36000</property>
      <property name="connection.connection_string">
        Data Source=MINMIN\SQLEXPRESS;Initial Catalog=ZTREEDB;Integrated Security=True;
      </property>
      <mapping assembly="ZTree.Domain" />
    </session-factory>
  </hibernate-configuration>

 

<?xml version="1.0" encoding="utf-8" ?>
<hibernate-mapping xmlns="urn:nhibernate-mapping-2.2"
                   assembly="Eolande.ZTree.Domain" namespace="Eolande.ZTree.Domain">
  <class name="ZTreeDomain" table="ZTree">
    <id name="id" column="[Id]"></id>
    <property name="pId" column="[PId]"/>
    <property name="name" column="[Name]"/>
    <property name="open" column="[Open]"/>
  </class>

</hibernate-mapping>

using System;
using System.Runtime.Serialization;

namespace ZTree.Domain
{
    [Serializable]
    [DataContract]
    public partial class ZTreeDomain
    {
        [DataMember]
        public virtual int id { get; set; }
        [DataMember]
        public virtual int pId { get; set; }
        [DataMember]
        public virtual string name { get; set; }
        [DataMember]
        public virtual bool open { get; set; }

        public virtual TreeModel CopyToTreeModel()
        {
            return new TreeModel() { id = this.id, text = this.name, expanded = this.open };
        }

    }
}

 

using System;
using System.Collections.Generic;
using System.Runtime.Serialization;

namespace Eolande.ZTree.Domain
{
    [Serializable]
    [DataContract]
    public class TreeModel
    {
        public TreeModel()
        {
            children = new List<TreeModel>();
        }
        [DataMember]
        public virtual int id { get; set; }
        [DataMember]
        public virtual string text { get; set; }
        [DataMember]
        public virtual bool expanded { get; set; }
        [DataMember]
        public virtual bool leaf { get; set; }
        [DataMember]
        public virtual List<TreeModel> children { get; set; }
    }
}

 

 

using Eolande.ZTree.Domain;
using NHibernate.Cfg;
using System.Collections.Generic;
using System.Linq;
using System.Web.Http;

namespace ZTree.Web.Controllers
{
    public class ZTreeController : ApiController
    {

        public TreeModel Get()
        {
            var nhConfig = new Configuration().Configure();
            var sessionFactory = nhConfig.BuildSessionFactory();
            TreeModel root = null;

            using (var session = sessionFactory.OpenSession())
            {
                var list = session.QueryOver<ZTreeDomain>().List().ToList();
                var r = list.FirstOrDefault(x => x.pId == -1);
                root = new TreeModel() { text = "." };

                if (r != null)
                {
                    var p = r.CopyToTreeModel();
                    root.children.Add(p);
                    var childs = list.Where(x => x.pId == p.id);
                    foreach (var c in childs)
                    {
                        var m = c.CopyToTreeModel();
                        root.children.Add(m);
                        ChildNode(m, list);
                    }
                }
                return root;
            }

        }

        private void ChildNode(TreeModel root, List<ZTreeDomain> list)
        {
            var childs = list.Where(x => x.pId == root.id);
            foreach (var c in childs)
            {
                var n = c.CopyToTreeModel();
                root.children.Add(n);
                ChildNode(n, list.Where(x => x.pId == c.id).ToList());
            }
        }
    }
}

 

 

Ext.onReady(function () {

    var store = Ext.create('Ext.data.TreeStore', {
        root: {
            expanded: true
        },
        proxy: {
            type: 'ajax',
            url: 'api/ZTree/Get'
        }
    });
    var treePanel = Ext.create('Ext.tree.Panel', {
        id: 'tree-panel',
        title: 'Sample Layouts',
        region: 'north',
        split: true,
        height: 360,
        minSize: 150,
        rootVisible: false,
        autoScroll: true,
        store: store,
        listeners: {
            itemclick: function (thisTree, record, item, index, e, options) {
                console.log(item);
                if (record.get('leaf')) {
                    Ext.MessageBox.alert('YES', record.get('text'));
                }
            }
        }
    });

    var contentPanel = {
        id: 'content-panel',
        region: 'center', // this is what makes this panel into a region within the containing layout
        layout: 'card',
        margins: '2 5 5 0',
        activeItem: 0,
        border: true,
        html: '<p>content panel</p>'
    };
    var detailsPanel = {
        id: 'details-panel',
        title: 'Details',
        region: 'center',
        bodyStyle: 'padding-bottom:15px;background:#eee;',
        autoScroll: true,
        html: '<p class="details-info">When you select a layout from the tree, additional details will display here.</p>'
    };

    Ext.create('Ext.Viewport', {
        layout: 'border',
        title: 'Ext Layout Browser',
        items: [{
            layout: 'border',
            id: 'layout-browser',
            region: 'west',
            border: false,
            split: true,
            margins: '2 0 5 5',
            width: 290,
            minSize: 100,
            maxSize: 500,
            items: [treePanel, detailsPanel]
        },
            contentPanel
        ],
        renderTo: Ext.getBody()
    });

});