TREE arraycollection

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
 <![CDATA[
 import mx.collections.ArrayCollection;
 import mx.events.DragEvent;
 
  public var selectedNode:Object;
  public var nodeIndex : Number;
  public var node : Object;
  public var dragNode:Object;
  public var dragName:String;
  public var nodeNames : String;
  public var drNames : XML;
  [Bindable]
  private var companyList : ArrayCollection = new ArrayCollection(
  [ {type:"department", name:"Finance", children:new ArrayCollection(
                                                        [ {type:"employee", name:"John H",children:new ArrayCollection(
                                                        [ {type:"employees", name:"YY"},
                                                          {type:"employees", name:"UU"} ] )},
                                                          {type:"employee", name:"Sam K"} ] ) },
      {type:"department", name:"Engineering", children: new ArrayCollection(
                                                       [ {type:"employee", name:"Erin M"},
                                                         {type:"employee", name:"Ann B"} ] ) },
      {type:"department", name:"Operations", children: new ArrayCollection()}
  ] );
  private function treeLabel( item:Object ) : String
   {
      
            return item.name;
   }
  private function treeClick(event :Event):void{
   selectedNode=Tree(event.target).selectedItem;
   nodeIndex=Tree(event.target).selectedIndex;
  
   node_name.text=selectedNode.name;
   node_type.text=selectedNode.type;
  
   }
   private function update(): void{
   if(selectedNode!=null){
   selectedNode.name=node_name.text;
   selectedNode.type=node_type.text;
   tree.invalidateList();
 
   }
  
   }
  private function add():void{
   var newNode:Object = {type:node_type.text, name:node_name.text};
    if(selectedNode!=null){
   
     if(selectedNode.children==null){
    selectedNode.children=new ArrayCollection()
     }    
     selectedNode.children.addItem(newNode);
   
   tree.expandChildrenOf(selectedNode,true);
   
    //staffTree.expandChildrenOf(selectedNode,true);
   }
   else{
   var nodename : String=node_name.text;
   var nodetype : String=node_type.text;
   companyList.addItem(newNode);
  
   }
  }
      private function del():void{
                    delNode(companyList,selectedNode);
                }
               
                private function delNode(arr:ArrayCollection, item: Object):void{
                    for(var i:int = 0; i  < arr.length; i++){
                        if(arr.getItemIndex(item) != -1){
                            var idx:int = arr.getItemIndex(item);
                            arr.removeItemAt(idx);
                        }else{
                            var arrC:ArrayCollection = arr[i]["children"] as ArrayCollection;
                            if(arrC !== null && arrC.length > 0){
                                delNode(arrC,item);
                            }
                        }
                    }
                }
 private function clickHander(event:Event):void{
 
  //log.debug(event.target.parent.toString());
  if ((event.target.parent is Tree)){
   selectedNode=null;
  }
 }
  public function onDragEnter(event : DragEvent) : void{
    dragNode=Tree(event.target).selectedItem;
  
  }
  //public function onDragOver(event : DragEvent) : void{
 
  public function onDragDrop(event : DragEvent) : void{
   try{
  var target:Tree = Tree(event.currentTarget);
      
        var rowIndex:int = target.calculateDropIndex(event);
        var hoverTarget:Object = target.indexToItemRenderer(rowIndex).data;
        if(hoverTarget!=null){
      //   log.debug(hoverTarget.@label+"///"+dragNode.@label);
        }
   }
   catch(error: Error){
    trace(error);
   }
      
  }
 
 ]]>
</mx:Script>
 <mx:HDividedBox width="100%" height="100%">
 <mx:Panel width="30%" height="100%" layout="absolute">
  <mx:Tree id="tree" dataProvider="{companyList}" labelFunction="treeLabel" width="100%" height="100%" itemClick="treeClick(event)" click="clickHander(event)" dragEnabled="true"
       dragMoveEnabled="true" dropEnabled="true"  dragDrop="onDragDrop(event)" dragEnter="onDragEnter(event)"/>

 </mx:Panel>
 <mx:Panel width="70%" height="100%" layout="absolute">
 <mx:VBox x="0" y="0" width="100%" height="100%">
  <mx:VBox width="100%" height="70%">
     <mx:Grid width="100%" height="100%">
      <mx:GridRow width="100%" height="100%">
       <mx:GridItem width="100%" height="100%" horizontalAlign="right">
        <mx:Label text="NODE_Type:"  />
       </mx:GridItem>
       <mx:GridItem width="100%" height="100%">
        <mx:TextInput id="node_type" />
       </mx:GridItem>
      </mx:GridRow>
      <mx:GridRow width="100%" height="100%">
       <mx:GridItem width="100%" height="100%" horizontalAlign="right">
        <mx:Label text="NODE_NAME:"/>
       </mx:GridItem>
       <mx:GridItem width="100%" height="100%">
        <mx:TextInput id="node_name"/>
       </mx:GridItem>
      </mx:GridRow>
     
      <mx:GridRow width="100%" height="100%">
       <mx:GridItem width="100%" height="100%">
       
       </mx:GridItem>
       <mx:GridItem width="100%" height="100%">       
       </mx:GridItem>
      </mx:GridRow>
     </mx:Grid>
    </mx:VBox>
    <mx:HBox width="100%" height="30%" horizontalAlign="center" verticalAlign="middle">
     <mx:Button label="Add" click="add();" />
     <mx:Button label="Delete" click="del();" />
     <mx:Button label="Update" click="update();"/>
    </mx:HBox>
   </mx:VBox>
 </mx:Panel>
 </mx:HDividedBox>
</mx:Application>