Index: /branches/rel_apv_10_7/usr/click/webui/htdocs/new/src/apv/templates/monitoring/report/report/monitor.html
===================================================================
--- /branches/rel_apv_10_7/usr/click/webui/htdocs/new/src/apv/templates/monitoring/report/report/monitor.html	(revision 38493)
+++ /branches/rel_apv_10_7/usr/click/webui/htdocs/new/src/apv/templates/monitoring/report/report/monitor.html	(working copy)
@@ -24,7 +24,6 @@
                     	<template slot="label">{[gettext('Module')]}</template>
                         <el-cascader-panel 
                         :props="props"
-                        :options="options"
                         v-model="select_item"
                         ></el-cascader-panel>
                       </el-form-item>
@@ -88,25 +87,81 @@
                             {'value': 'now-1M', 'display': '1 Month'}
                         ]
                     },
-                    props: { multiple: true },
-                    options: [],
+                    props: {
+                        multiple: true,
+                        lazy: true,
+                        lazyLoad: this.getNodes,
+                    },
+                    global_level:[],
+                    cur_node:[],
                     select_item: '',
                     report_type: '',
                 }
             },
             methods: {
-                get_options: function() {
+                getNodes:function(node, resolve){
+                    const { level } = node;
                     let that = this
-                    $.ajax({
-                        headers: {
-                            "Content-Type": "application/json"
-                        },
-                        url: "/generate_items",
-                        type: "post",
-                        success: function (res) {
-                            that.options = JSON.parse(res);
+                    let ajax_node = ['slb_total','vs_report','rs_report','vh_report','rh_report']
+                    let ajax_url = ['/generate_slb_total_items','/generate_virtual_service_items','/generate_real_service_items','/generate_virtual_host_items','/generate_real_host_items']
+                    let resolve_node = function(cur_node) {
+                        if(cur_node && cur_node.length){
+                            const nodes = Array.from({ length: cur_node.length })
+                                .map((item,index) => {
+                                    if(cur_node[index].children){
+                                            return {
+                                                value: `${cur_node[index].value}`,
+                                                label: `${cur_node[index].label}`,
+                                                leaf: level >= 4
+                                            }
+                                    }else{
+                                        return {
+                                            value: `${cur_node[index].value}`,
+                                            label: `${cur_node[index].label}`,
+                                            leaf: true
+                                        }
+                                    }
+                                });
+                            // Return sub nodes by calling resolve and notify to component loading is completed
+                            resolve(nodes);
+                        }else{
+                            resolve();
                         }
-                    })
+                    }
+                    let get_options = function(url) {
+                        $.ajax({
+                            headers: {
+                                "Content-Type": "application/json"
+                            },
+                            url: url,
+                            type: "post",
+                            success: function (res) {
+                                that.global_level['level_'+level] = JSON.parse(res);
+                                that.cur_node = that.global_level['level_'+level]
+                                resolve_node(that.cur_node);
+                            }
+                        })
+                    }
+                    setTimeout(() => {
+                        if(level == 0){
+                            get_options('/generate_items')
+                        }else{
+                            let node_index = ajax_node.indexOf(node.value)
+                            if( node_index != -1 ){
+                                get_options(ajax_url[node_index])
+                            }else{
+                                let parent_level = that.global_level['level_'+(level-1)];
+                                let parent_node = parent_level.find(item => item.value == node.value)
+                                if (typeof(parent_node['children']) != "undefined") {
+                                    that.global_level['level_'+level] = parent_node['children'];
+                                } else {
+                                    that.global_level['level_'+level] = [];
+                                }
+                                that.cur_node = that.global_level['level_'+level]
+                                resolve_node(that.cur_node)
+                            }
+                        }
+                    }, 500);
                 },
                 generateReport: function() {
                     progressDlg = $HIVE.progressDlg(gettext('waiting...'));
@@ -140,7 +195,6 @@
                 },
             },
             created: function () {
-                this.get_options();
             }
         })
     })
Index: /branches/rel_apv_10_7/usr/click/webui/htdocs/new/src/djproject/urls.py
===================================================================
--- /branches/rel_apv_10_7/usr/click/webui/htdocs/new/src/djproject/urls.py	(revision 38493)
+++ /branches/rel_apv_10_7/usr/click/webui/htdocs/new/src/djproject/urls.py	(working copy)
@@ -91,6 +91,11 @@
     url(r'^get_runtime_script$', get_runtime_script),
     url(r'^register_complete$', register_complete),
     url(r'^generate_items$', generateItems),
+    url(r'^generate_slb_total_items$', generateTotalItems),
+    url(r'^generate_virtual_service_items$', generateVirtualItems),
+    url(r'^generate_real_service_items$', generateRealItems),
+    url(r'^generate_virtual_host_items$', generateVhostItems),
+    url(r'^generate_real_host_items$', generateRhostItems),
 )
 
 handler404 = 'hive.shared.custom_404_view'
Index: /branches/rel_apv_10_7/usr/click/webui/htdocs/new/src/hive/report.py
===================================================================
--- /branches/rel_apv_10_7/usr/click/webui/htdocs/new/src/hive/report.py	(revision 38493)
+++ /branches/rel_apv_10_7/usr/click/webui/htdocs/new/src/hive/report.py	(working copy)
@@ -2049,23 +2049,23 @@
         "children": [{
           "value": 'slb_total',
           "label": unicode(_('Global')),
-          "children": get_slb_total_list()
+          "children": []
         }, {
           "value": 'vs_report',
           "label": unicode(_('Virtual Service')),
-          "children": get_slb_virtual_list()
+          "children": []
         }, {
           "value": 'rs_report',
           "label": unicode(_('Real Service')),
-          "children": get_slb_real_list()
+          "children": []
         }, {
           "value": 'vh_report',
           "label": unicode(_('SSL Virtual Host')),
-          "children": get_ssl_virtual_list()
+          "children": []
         }, {
           "value": 'rh_report',
           "label": unicode(_('SSL Real Host')),
-          "children": get_ssl_real_list()
+          "children": []
         }]
     }, {
         "value": 'llb',
@@ -2088,3 +2088,19 @@
       "children": get_statistics_tcp_list(is_vs=False)
     }]
     return HttpResponse(json.dumps(item_list))
+
+def generateTotalItems(request):
+    return HttpResponse(json.dumps(get_slb_total_list()))
+
+def generateVirtualItems(request):
+    return HttpResponse(json.dumps(get_slb_virtual_list()))
+
+def generateRealItems(request):
+    return HttpResponse(json.dumps(get_slb_real_list()))
+
+def generateVhostItems(request):
+    return HttpResponse(json.dumps(get_ssl_virtual_list()))
+
+def generateRhostItems(request):
+    return HttpResponse(json.dumps(get_ssl_real_list()))
+
