diff --git a/App/Config.php b/App/Config.php
index 69cac36..da4cb5d 100644
--- a/App/Config.php
+++ b/App/Config.php
@@ -40,6 +40,8 @@ class Config
     const SHOW_ERRORS = true;
     static public $DEBUG = false;
 
+    const ARTICLE_URL  = "/api/public/Blog/article";
+
     static  public  function Url(){
         if (true == Config::$DEBUG){
             return "/api/public/Blog/";
diff --git a/App/Controllers/Blog.php b/App/Controllers/Blog.php
index 488e2a2..9e3ef24 100644
--- a/App/Controllers/Blog.php
+++ b/App/Controllers/Blog.php
@@ -53,7 +53,6 @@ class Blog extends Controller
 
     function articleAction() {
         if(sizeof($this->querys) != 0){
-            echo '<pre>';
             $docModel = new Models\Doc();
             $commentModel = new Models\DocComment();
             $doc = $docModel->titleDoc(rawurldecode( $this->querys['title']));
diff --git a/App/Controllers/NewUi.php b/App/Controllers/NewUi.php
index 7441a84..c8e907f 100644
--- a/App/Controllers/NewUi.php
+++ b/App/Controllers/NewUi.php
@@ -21,6 +21,8 @@ class NewUi extends Controller
         $groups = $docModel->getGroups();
         $groupstype = $docModel->GetAllGroupType();
         echo  "<pre>";
+        print_r($this->route_params);
+        print_r($this->params);
         echo  "</pre>";
 
 
@@ -61,4 +63,9 @@ class NewUi extends Controller
             ]);
         }
     }
+    function articleAction(){
+        if(sizeof($this->params) < 2){
+            
+        }
+    }
 }
\ No newline at end of file
diff --git a/App/Views/blog/index.html b/App/Views/blog/index.html
index a13493b..b695231 100644
--- a/App/Views/blog/index.html
+++ b/App/Views/blog/index.html
@@ -38,7 +38,7 @@
                     <div  id="grouptabContent" class="tab-content">
                         {% for key,group_type in group_types %}
                         <div id="group_key_{{key}}" class="tab-pane"  style="background:#d4ccb0;" >
-                            <ul class="nav nav-tabs">
+                            <ul class="nav nav-tabs" style="font-size: 12px;">
                             {% for keys,types in group_type.arr %}
                             <li  style="width: 100%; background:#d4ccb0;">
                                 <a  style="background:#d4ccb0;" href="#doc_type_{{ keys }}" data-toggle="tab">
@@ -51,11 +51,11 @@
                         {% endfor %}
                     </div>
                 </div>
-                <div class="col-md-2" style="padding: 0px;" >
+                <div class="col-md-2" style="padding: 0px;" id="docs">
                     <div  id="typedocContent" class="tab-content">
                         {% for key,typedoc in typedocs %}
                         <div id="doc_type_{{typedoc.key}}" class="tab-pane"  style="background:#d4ccb0; padding: 0px;" >
-                            <ul class="nav nav-tabs">
+                            <ul class="nav nav-tabs" style="font-size: 12px;">
                                 {% for docid,doc in typedoc.arr %}
                                 <li class="active" style="width: 100%; background:#d4ccb0;">
                                     <a  style="background:#d4ccb0;">
@@ -67,6 +67,18 @@
                         {% endfor %}
                     </div>
                 </div>
+                <div class="col-md-7" style="padding: 0px;" >
+                    <div class="panel panel-default">
+                        <div class="panel-heading">面板标题</div>
+                        <div class="panel-body">
+                            <p>这是一个基本的面板内容。这是一个基本的面板内容。
+                                这是一个基本的面板内容。这是一个基本的面板内容。
+                                这是一个基本的面板内容。这是一个基本的面板内容。
+                                这是一个基本的面板内容。这是一个基本的面板内容。
+                            </p>
+                        </div>
+                    </div>
+                </div>
             </div>
         </div>
 
@@ -87,6 +99,12 @@
         if(globalposx > 250){
             $('#grouptab').fadeOut(1000);
         }
+        if(globalposx > 400){
+            $('#doctype').fadeOut(1000);
+        }
+        if(globalposx > 500){
+            $('#docs').fadeOut(1000);
+        }
     }
     $(function() {
         var defaultData = [
@@ -144,11 +162,21 @@
         data: defaultData
     })
     setInterval("startRequest()",1000);
+    $('#docs').hide();
+    $('#doctype').hide();
+
     });
+
     $(document).mousemove(function(e){
         if(e.pageX < 250){
             $('#grouptab').fadeIn(2000);
         }
+        if(e.pageX < 400){
+            $('#doctype').fadeIn(2000);
+        }
+        if(e.pageX < 500){
+            $('#docs').fadeIn(2000);
+        }
         globalposx  = e.pageX;
     });
 
diff --git a/Core/Controller.php b/Core/Controller.php
index 4d1af75..2953c9c 100644
--- a/Core/Controller.php
+++ b/Core/Controller.php
@@ -21,6 +21,7 @@ abstract class Controller
     protected  $input;
     protected  $debug = false;
     protected $query_string;
+    protected $params = [];
     /**
      * Class constructor
      *
@@ -47,6 +48,7 @@ abstract class Controller
 
         }
         $this->route_params = $route_params;
+        $this->params = explode('/',$route_params['id']);
     }
     /**
      * Magic method called when a non-existent or inaccessible method is