diff --git a/server/www/teleport/.idea/teleport.iml b/server/www/teleport/.idea/teleport.iml
index b91ebc9..9044667 100644
--- a/server/www/teleport/.idea/teleport.iml
+++ b/server/www/teleport/.idea/teleport.iml
@@ -11,7 +11,7 @@
     <content url="file://$MODULE_DIR$">
       <sourceFolder url="file://$MODULE_DIR$/app" isTestSource="false" />
     </content>
-    <orderEntry type="jdk" jdkName="Python 3.4.4 (C:\python\python34-x86\python.exe)" jdkType="Python SDK" />
+    <orderEntry type="jdk" jdkName="py" jdkType="Python SDK" />
     <orderEntry type="sourceFolder" forTests="false" />
   </component>
   <component name="TemplatesService">
diff --git a/server/www/teleport/app/eom_app/app/db.py b/server/www/teleport/app/eom_app/app/db.py
index 19530f4..0d2be09 100644
--- a/server/www/teleport/app/eom_app/app/db.py
+++ b/server/www/teleport/app/eom_app/app/db.py
@@ -57,7 +57,8 @@ class TPDatabase:
             return False
 
         # 看看数据库中是否存在指定的数据表（如果不存在，可能是一个空数据库文件），则可能是一个新安装的系统
-        ret = self.is_table_exists('{}group'.format(self._table_prefix))
+        # ret = self.query('SELECT COUNT(*) FROM `sqlite_master` WHERE `type`="table" AND `name`="{}account";'.format(self._table_prefix))
+        ret = self.is_table_exists('{}group'.format(self._table_prefix))
         if ret is None or not ret:
             log.w('database need create.\n')
             self.need_create = True
@@ -75,9 +76,9 @@ class TPDatabase:
             self.need_upgrade = True
             return True
 
-        # DO TEST
-        # self.alter_table('ts_account', [['account_id', 'id'], ['account_type', 'type']])
-
+        # DO TEST
+        # self.alter_table('ts_account', [['account_id', 'id'], ['account_type', 'type']])
+
         return True
 
     def is_table_exists(self, table_name):
@@ -158,49 +159,49 @@ class TPDatabase:
                 log.w('nothing to do.\n')
                 return False
 
-            if isinstance(table_names, str):
-                old_table_name = table_names
-                new_table_name = table_names
-            elif isinstance(table_names, list) and len(table_names) == 2:
-                old_table_name = table_names[0]
-                new_table_name = table_names[1]
-            else:
-                log.w('invalid param.\n')
-                return False
-
-            if isinstance(field_names, list):
-                for i in field_names:
-                    if not isinstance(i, list) or 2 != len(i):
-                        log.w('invalid param.\n')
-                        return False
-
-            if field_names is None:
-                # 仅数据表改名
-                return self.exec('ALTER TABLE `{}` RENAME TO `{}`;'.format(old_table_name, new_table_name))
-            else:
-                # sqlite不支持字段改名，所以需要通过临时表中转一下
-
-                # 先获取数据表的字段名列表
-                ret = self.query('SELECT * FROM `sqlite_master` WHERE `type`="table" AND `name`="{}";'.format(old_table_name))
-                log.w('-----\n')
-                log.w(ret[0][4])
-                log.w('\n')
-
-                # 先将数据表改名，成为一个临时表
-                # tmp_table_name = '{}_sqlite_tmp'.format(old_table_name)
-                # ret = self.exec('ALTER TABLE `{}` RENAME TO `{}`;'.format(old_table_name, tmp_table_name))
-                # if ret is None or not ret:
-                #     return ret
-
-            pass
-        elif self.db_source['type'] == self.DB_TYPE_MYSQL:
-            log.e('mysql not supported yet.\n')
-            return False
-        else:
-            log.e('Unknown database type.\n')
-            return False
-
-
+            if isinstance(table_names, str):
+                old_table_name = table_names
+                new_table_name = table_names
+            elif isinstance(table_names, list) and len(table_names) == 2:
+                old_table_name = table_names[0]
+                new_table_name = table_names[1]
+            else:
+                log.w('invalid param.\n')
+                return False
+
+            if isinstance(field_names, list):
+                for i in field_names:
+                    if not isinstance(i, list) or 2 != len(i):
+                        log.w('invalid param.\n')
+                        return False
+
+            if field_names is None:
+                # 仅数据表改名
+                return self.exec('ALTER TABLE `{}` RENAME TO `{}`;'.format(old_table_name, new_table_name))
+            else:
+                # sqlite不支持字段改名，所以需要通过临时表中转一下
+
+                # 先获取数据表的字段名列表
+                ret = self.query('SELECT * FROM `sqlite_master` WHERE `type`="table" AND `name`="{}";'.format(old_table_name))
+                log.w('-----\n')
+                log.w(ret[0][4])
+                log.w('\n')
+
+                # 先将数据表改名，成为一个临时表
+                # tmp_table_name = '{}_sqlite_tmp'.format(old_table_name)
+                # ret = self.exec('ALTER TABLE `{}` RENAME TO `{}`;'.format(old_table_name, tmp_table_name))
+                # if ret is None or not ret:
+                #     return ret
+
+            pass
+        elif self.db_source['type'] == self.DB_TYPE_MYSQL:
+            log.e('mysql not supported yet.\n')
+            return False
+        else:
+            log.e('Unknown database type.\n')
+            return False
+
+
 class TPDatabasePool:
     def __init__(self):
         self._locker = threading.RLock()
diff --git a/server/www/teleport/app/eom_app/controller/__init__.py b/server/www/teleport/app/eom_app/controller/__init__.py
index 7819a5c..3c17c6c 100644
--- a/server/www/teleport/app/eom_app/controller/__init__.py
+++ b/server/www/teleport/app/eom_app/controller/__init__.py
@@ -113,6 +113,8 @@ controllers = [
     (r'/set/', set.IndexHandler),
     (r'/set', set.IndexHandler),
 
-    # 通过访问一个特殊URL来停止WEB服务，仅用于开发阶段，生产系统中请删除下一行
-    (r'/EXIT-4E581FEFD7AB497D833D71A51C61D898', index.ExitHandler),
+    (r'/uidesign', index.UIDesignHandler),
+    (r'/uidesign/without-sidebar', index.UIDesignWithoutSidebarHandler),
+    (r'/uidesign/table', index.UIDesignTableHandler)
+
 ]
diff --git a/server/www/teleport/app/eom_app/controller/index.py b/server/www/teleport/app/eom_app/controller/index.py
index cf01a81..65950cb 100644
--- a/server/www/teleport/app/eom_app/controller/index.py
+++ b/server/www/teleport/app/eom_app/controller/index.py
@@ -1,15 +1,30 @@
-# -*- coding: utf-8 -*-
-import sys
-import tornado.ioloop
-from .base import TPBaseHandler, TPBaseUserAuthHandler
-
-
-class IndexHandler(TPBaseUserAuthHandler):
-    def get(self):
-        self.redirect('/host')
-
-
-class ExitHandler(TPBaseHandler):
-    def get(self):
-        self.write('exit ok')
-        tornado.ioloop.IOLoop.instance().stop()
+# -*- coding: utf-8 -*-
+import sys
+import tornado.ioloop
+from .base import TPBaseHandler, TPBaseUserAuthHandler
+
+
+class IndexHandler(TPBaseUserAuthHandler):
+    def get(self):
+        self.redirect('/host')
+
+
+class ExitHandler(TPBaseHandler):
+    def get(self):
+        self.write('exit ok')
+        tornado.ioloop.IOLoop.instance().stop()
+
+
+class UIDesignHandler(TPBaseHandler):
+    def get(self):
+        self.render('uidesign/index.mako')
+
+
+class UIDesignWithoutSidebarHandler(TPBaseHandler):
+    def get(self):
+        self.render('uidesign/without-sidebar.mako')
+
+
+class UIDesignTableHandler(TPBaseHandler):
+    def get(self):
+        self.render('uidesign/table.mako')
diff --git a/server/www/teleport/view/page_base.mako b/server/www/teleport/view/page_base.mako
index 25ef1b8..0eb2ce9 100644
--- a/server/www/teleport/view/page_base.mako
+++ b/server/www/teleport/view/page_base.mako
@@ -1,124 +1,125 @@
-<!DOCTYPE html>
-	<%!
-		page_title_ = ''
-		page_menu_ = []
-	%>
-<!--[if IE 8]> <html lang="en" class="ie8"> <![endif]-->
-<!--[if !IE]><!-->
-<html lang="zh_CN">
-<!--<![endif]-->
-<head>
-	<meta charset="utf-8"/>
-	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
-	<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport"/>
-	<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
-	<meta content="yes" name="apple-mobile-web-app-capable">
-	<meta content="black-translucent" name="apple-mobile-web-app-status-bar-style">
-	<title>${self.attr.page_title_}::TELEPORT</title>
-	<link rel="shortcut icon" href="${ static_url('favicon.png') }">
-
-	<link href="${ static_url('plugins/google-cache/open-sans.css') }" rel="stylesheet">
-	<link href="${ static_url('plugins/bootstrap/css/bootstrap.min.css') }" rel="stylesheet" type="text/css"/>
-	<link href="${ static_url('plugins/font-awesome/css/font-awesome.min.css') }" rel="stylesheet">
-	<link href="${ static_url('plugins/gritter/css/jquery.gritter.css') }" rel="stylesheet">
-
-
-	<link href="${ static_url('css/main.css') }" rel="stylesheet" type="text/css"/>
-	<%block name="extend_css"/>
-
-</head>
-<body>
-
-<!-- begin #page-container -->
-<div id="page-container" class="page-header-fixed page-sidebar-fixed">
-	<!-- begin #header -->
-	<div id="header" class="header navbar navbar-default navbar-fixed-top">
-		<div class="container-fluid">
-			<div class="brand"><a href="http://teleport.eomsoft.net" target="_blank"><span class="navbar-logo"></span></a></div>
-			<div class="breadcrumb-container">
-					<%block name="breadcrumb" />
-			</div>
-## 			<div style="float:right;padding-top:14px;margin-right: 50px"><a href="/set" id="teleport-server-ip"></a></div>
-		</div>
-	</div>
-	<!-- end #header -->
-
-
-	<!-- begin #sidebar -->
-	<div id="sidebar" class="sidebar">
-			<%include file="common/_sidebar_nav_menu.mako" />
-	</div>
-	<!-- end #sidebar -->
-
-	<!-- begin #content -->
-	<div id="content" class="content">
-		${self.body()}
-	</div>
-	<!-- end #content -->
-
-
-</div>
-<!-- end #page-container -->
-
-
-<div class="modal fade" ywl_message_box="dialog-ywl-message-box" tabindex="-1" role="dialog">
-	<div class="modal-dialog" role="document">
-		<div class="modal-content">
-			<div class="modal-header">
-				<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
-				<h4 class="modal-title" ywl-title></h4>
-			</div>
-			<div class="modal-body" ywl-content style="font-size: 20px">
-
-			</div>
-			<div class="modal-footer">
-				<input type="hidden" ywl-record-id="" ywl-row-id="">
-				<button type="button" class="btn btn-success btn-sm" ywl-btn-ok="ok"><i class="glyphicon glyphicon-ok"></i></button>
-				<button type="button" class="btn btn-danger btn-sm" data-dismiss="modal"><i class="glyphicon glyphicon-remove"></i></button>
-			</div>
-		</div>
-	</div>
-</div>
-
-	<%block name="extend_content" />
-## <script type="text/javascript" src="${ static_url('js/var.js') }"></script>
-<script type="text/javascript" src="${ static_url('plugins/underscore/underscore.js') }"></script>
-<script type="text/javascript" src="${ static_url('plugins/jquery/jquery.min.js') }"></script>
-<script type="text/javascript" src="${ static_url('plugins/jquery/ajaxfileupload.js') }"></script>
-<script type="text/javascript" src="${ static_url('plugins/bootstrap/js/bootstrap.min.js') }"></script>
-<!--[if lt IE 9]>
-<script src="${ static_url('plugins/html5shiv/html5shiv.min.js') }"></script>
-<![endif]-->
-<script type="text/javascript" src="${ static_url('js/json2.js') }"></script>
-<script type="text/javascript" src="${ static_url('plugins/gritter/js/jquery.gritter.js') }"></script>
-
-<script type="text/javascript" src="${ static_url('js/ywl_const.js') }"></script>
-<script type="text/javascript" src="${ static_url('js/ywl_common.js') }"></script>
-<script type="text/javascript" src="${ static_url('js/ywl.js') }"></script>
-<script type="text/javascript" src="${ static_url('js/ywl_assist.js') }"></script>
-<script type="text/javascript" src="${ static_url('js/ui/common.js') }"></script>
-<script type="text/javascript" src="${ static_url('js/ui/controls.js') }"></script>
-
-	<%block name="extend_js"/>
-
-
-<script type="text/javascript">
-	ywl.add_page_options({
-		## 	有些参数由后台python脚本生成到模板中，无法直接生成到js文件中，所以必须通过这种方式传递参数到js脚本中。
-        active_menu: ${self.attr.page_menu_}
-	});
-
-	$(document).ready(function () {
-		// once page ready, init ywl object.
-## 		var teleport_ip_info = "请核对您的堡垒机IP地址，当前为 " + teleport_ip;
-## 		$("#teleport-server-ip").text(teleport_ip_info);
-		ywl.init();
-	});
-
-</script>
-
-	<%block name="embed_js" />
-
-
-</body>
+<!DOCTYPE html>
+    <%!
+        page_title_ = ''
+        page_menu_ = []
+    %>
+<!--[if IE 8]> <html lang="en" class="ie8"> <![endif]-->
+<!--[if !IE]><!-->
+<html lang="zh_CN">
+<!--<![endif]-->
+<head>
+    <meta charset="utf-8"/>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
+    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport"/>
+    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
+    <meta content="yes" name="apple-mobile-web-app-capable">
+    <meta content="black-translucent" name="apple-mobile-web-app-status-bar-style">
+    <title>${self.attr.page_title_}::TELEPORT</title>
+    <link rel="shortcut icon" href="${ static_url('favicon.png') }">
+
+    <link href="${ static_url('plugins/google-cache/open-sans.css') }" rel="stylesheet">
+    <link href="${ static_url('plugins/bootstrap/css/bootstrap.min.css') }" rel="stylesheet" type="text/css"/>
+    <link href="${ static_url('plugins/font-awesome/css/font-awesome.min.css') }" rel="stylesheet">
+    <link href="${ static_url('plugins/gritter/css/jquery.gritter.css') }" rel="stylesheet">
+
+
+    <link href="${ static_url('css/main.css') }" rel="stylesheet" type="text/css"/>
+    <%block name="extend_css"/>
+
+</head>
+<body>
+
+<!-- begin #page-container -->
+<div id="page-container" class="page-header-fixed page-sidebar-fixed">
+    <!-- begin #header -->
+    <div id="header" class="header navbar navbar-default navbar-fixed-top">
+        <div class="container-fluid">
+            <div class="brand"><a href="http://teleport.eomsoft.net" target="_blank"><span class="navbar-logo"></span></a></div>
+            <div class="breadcrumb-container">
+                    <%block name="breadcrumb" />
+            </div>
+        </div>
+    </div>
+    <!-- end #header -->
+
+    <!-- begin #sidebar -->
+    <div id="sidebar" class="sidebar">
+        <%block name="sidebar_nav_menu">
+            <%include file="common/_sidebar_nav_menu.mako" />
+        </%block>
+    </div>
+    <!-- end #sidebar -->
+
+    <!-- begin #content -->
+    <div id="content" class="content">
+        ${self.body()}
+    </div>
+    <!-- end #content -->
+
+
+</div>
+<!-- end #page-container -->
+
+
+<div class="modal fade" ywl_message_box="dialog-ywl-message-box" tabindex="-1" role="dialog">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+                <h4 class="modal-title" ywl-title></h4>
+            </div>
+            <div class="modal-body" ywl-content style="font-size: 20px">
+
+            </div>
+            <div class="modal-footer">
+                <input type="hidden" ywl-record-id="" ywl-row-id="">
+                <button type="button" class="btn btn-success btn-sm" ywl-btn-ok="ok"><i class="glyphicon glyphicon-ok"></i></button>
+                <button type="button" class="btn btn-danger btn-sm" data-dismiss="modal"><i class="glyphicon glyphicon-remove"></i></button>
+            </div>
+        </div>
+    </div>
+</div>
+
+    <%block name="extend_content" />
+    ## <script type="text/javascript" src="${ static_url('js/var.js') }"></script>
+
+<script type="text/javascript" src="${ static_url('plugins/underscore/underscore.js') }"></script>
+<script type="text/javascript" src="${ static_url('plugins/jquery/jquery.min.js') }"></script>
+<script type="text/javascript" src="${ static_url('plugins/jquery/ajaxfileupload.js') }"></script>
+<script type="text/javascript" src="${ static_url('plugins/bootstrap/js/bootstrap.min.js') }"></script>
+<!--[if lt IE 9]>
+<script src="${ static_url('plugins/html5shiv/html5shiv.min.js') }"></script>
+<![endif]-->
+<script type="text/javascript" src="${ static_url('js/json2.js') }"></script>
+<script type="text/javascript" src="${ static_url('plugins/gritter/js/jquery.gritter.js') }"></script>
+
+<script type="text/javascript" src="${ static_url('js/ywl_const.js') }"></script>
+<script type="text/javascript" src="${ static_url('js/ywl_common.js') }"></script>
+<script type="text/javascript" src="${ static_url('js/ywl.js') }"></script>
+<script type="text/javascript" src="${ static_url('js/ywl_assist.js') }"></script>
+<script type="text/javascript" src="${ static_url('js/ui/common.js') }"></script>
+<script type="text/javascript" src="${ static_url('js/ui/controls.js') }"></script>
+
+    <%block name="extend_js"/>
+
+
+<script type="text/javascript">
+    ywl.add_page_options({
+        ## 	有些参数由后台python脚本生成到模板中，无法直接生成到js文件中，所以必须通过这种方式传递参数到js脚本中。
+        active_menu: ${self.attr.page_menu_}
+    });
+
+    $(document).ready(function () {
+        // once page ready, init ywl object.
+        ## 		var teleport_ip_info = "请核对您的堡垒机IP地址，当前为 " + teleport_ip;
+        ## 		$("#teleport-server-ip").text(teleport_ip_info);
+        ywl.init();
+    });
+
+</script>
+
+    <%block name="embed_js" />
+
+
+</body>
 </html>
\ No newline at end of file
diff --git a/server/www/teleport/view/test.mako b/server/www/teleport/view/test.mako
deleted file mode 100644
index 1f5ae8f..0000000
--- a/server/www/teleport/view/test.mako
+++ /dev/null
@@ -1,124 +0,0 @@
-<%!
-	page_title_ = '页面部件测试'
-	page_menu_ = ['dashboard']
-%>
-<%inherit file="page_base.mako"/>
-
-<%block name="extend_js">
-</%block>
-
-<%block name="breadcrumb">
-	<ol class="breadcrumb">
-		<li><i class="fa fa-dashboard fa-fw"></i> ${self.attr.page_title_}</li>
-	</ol>
-</%block>
-
-
-<%block name="embed_js">
-	<script type="text/javascript">
-
-
-		$(document).ready(function () {
-
-		});
-
-	</script>
-</%block>
-
-<%block name="extend_css">
-
-</%block>
-
-
-<div class="page-content">
-	<div class="box">
-		<h1>这是一级标题，This is H1.</h1>
-		<h2>这是二级标题，This is H2.</h2>
-		<h3>这是三级标题，This is H3.</h3>
-		<h4>这是四级标题，This is H4.</h4>
-		<h5>这是五级标题，This is H5.</h5>
-		<p>这是正文，this is content.</p>
-	</div>
-
-	<div class="box">
-		<div>
-			<p>徽章默认：[badge] <span class="badge">1</span></p>
-			<p>徽章尺寸：[badge] <span class="badge">比较长的文字</span>，[badge badge-sm] <span class="badge badge-sm">小尺寸</span></p>
-			<p>
-				徽章上标：[badge badge-sup] <span class="badge badge-sup">1</span>，
-				[badge badge-sm badge-sup] <span class="badge badge-sm badge-sup">1</span>，
-				[badge badge-sm badge-sup badge-danger] <span class="badge badge-sm badge-sup badge-danger">3</span>，
-				徽章配合图标：<span class="fa fa-bell fa-fw" style="font-size:16px;"></span><span class="badge badge-sm badge-sup badge-danger">3</span>
-			</p>
-			<p>
-				徽章颜色：[badge] <span class="badge">默认</span>，
-				[badge badge-info] <span class="badge badge-ignore">忽略</span>，
-				[badge badge-info] <span class="badge badge-info">信息</span>，
-				[badge badge-primary] <span class="badge badge-primary">重要</span>，
-				[badge badge-success] <span class="badge badge-success">成功</span>，
-				[badge badge-warning] <span class="badge badge-warning">警告</span>，
-				[badge badge-danger] <span class="badge badge-danger">危险（错误）</span>
-			</p>
-			<p>
-				徽章颜色（正常）：
-				<span class="badge">默认</span>
-				<span class="badge badge-ignore">忽略</span>
-				<span class="badge badge-info">信息</span>
-				<span class="badge badge-primary">重要</span>
-				<span class="badge badge-success">成功</span>
-				<span class="badge badge-warning">警告</span>
-				<span class="badge badge-danger">危险（错误）</span>
-			</p>
-			<p>
-				徽章颜色（小）：
-				<span class="badge badge-sm">默认</span>
-				<span class="badge badge-sm badge-ignore">忽略</span>
-				<span class="badge badge-sm badge-info">信息</span>
-				<span class="badge badge-sm badge-primary">重要</span>
-				<span class="badge badge-sm badge-success">成功</span>
-				<span class="badge badge-sm badge-warning">警告</span>
-				<span class="badge badge-sm badge-danger">危险（错误）</span>
-			</p>
-		</div>
-	</div>
-
-	<div class="box">
-		<div>
-			<p>标签默认：[label] <span class="label">标签文字</span></p>
-			<p>标签尺寸：[label] <span class="label">比较长的文字</span>，[label label-sm] <span class="label label-sm">小尺寸</span></p>
-			<p>
-				标签颜色：
-				[label] <span class="label">默认</span>，
-				[label label-ignore] <span class="label label-ignore">忽略</span>，
-				[label label-info] <span class="label label-info">信息</span>，
-				[label label-primary] <span class="label label-primary">重要</span>，
-				[label label-success] <span class="label label-success">成功</span>，
-				[label label-warning] <span class="label label-warning">警告</span>，
-				[label label-danger] <span class="label label-danger">危险（错误）</span>，
-			</p>
-			<p>
-				标签颜色（正常）：
-				<span class="label">默认</span>
-				<span class="label label-ignore">忽略</span>
-				<span class="label label-info">信息</span>
-				<span class="label label-primary">重要</span>
-				<span class="label label-success">成功</span>
-				<span class="label label-warning">警告</span>
-				<span class="label label-danger">危险（错误）</span>
-			</p>
-			<p>
-				标签颜色（小）：
-				<span class="label label-sm">默认</span>
-				<span class="label label-sm label-ignore">忽略</span>
-				<span class="label label-sm label-info">信息</span>
-				<span class="label label-sm label-primary">重要</span>
-				<span class="label label-sm label-success">成功</span>
-				<span class="label label-sm label-warning">警告</span>
-				<span class="label label-sm label-danger">危险（错误）</span>
-			</p>
-		</div>
-	</div>
-
-
-</div>
-
diff --git a/server/www/teleport/view/uidesign/_sidebar_nav_menu.mako b/server/www/teleport/view/uidesign/_sidebar_nav_menu.mako
new file mode 100644
index 0000000..71b6d71
--- /dev/null
+++ b/server/www/teleport/view/uidesign/_sidebar_nav_menu.mako
@@ -0,0 +1,110 @@
+<%!
+    import eom_ver
+%>
+<%
+    _sidebar = [
+	{
+		'require_type': 0,
+		'id': 'with-sidebar',
+		'link': '',
+		'name': '左侧菜单',
+		'icon': 'fa-database',
+		'sub': [
+			{
+                'require_type': 0,
+                'id': 'normal',
+                'link': '/uidesign',
+                'name': '普通页面',
+                'icon': 'fa-server',
+            },
+            {
+                'require_type': 0,
+                'id': 'user',
+                'link': '/uidesign/table',
+                'name': '表格页面',
+                'icon': 'fa-user',
+            },
+		]
+	},
+	{
+		'require_type': 0,
+		'id': 'without-sidebar',
+		'link': '/uidesign/without-sidebar',
+		'name': '无侧边菜单',
+		'icon': 'fa-database'
+	}
+]
+%>
+
+
+<!-- begin sidebar scrollbar -->
+<div class="slimScrollDiv">
+
+    <!-- begin sidebar user -->
+    <div class="nav">
+        <ul class="nav nav-profile">
+            <li>
+                <div class="image">
+                    <img src="/static/img/avatar/001.png" width="36"/>
+                </div>
+
+                <div class="dropdown">
+                    <a class="title" href="#" id="user-profile" data-target="#" data-toggle="dropdown" role="button"
+                       aria-haspopup="true" aria-expanded="false">
+                        <span class="name">${ current_user['nick_name'] }</span>
+                        <span class="role">测试用户 <i class="fa fa-caret-right"></i></span>
+                    </a>
+                    <ul class="dropdown-menu dropdown-menu-right">
+                        <li><a href="/auth/logout" id="btn-logout">退出</a></li>
+                    </ul>
+                </div>
+
+
+            </li>
+        </ul>
+    </div>
+    <!-- end sidebar user -->
+
+    <!-- begin sidebar nav -->
+    <div class="nav">
+        <ul class="nav nav-menu">
+
+            %for menu in _sidebar:
+                %if menu['require_type'] <= current_user['type']:
+                    %if 'sub' in menu and len(menu['sub']) > 0:
+                        <li id="sidebar_menu_${menu['id']}">
+                            <a href="javascript:;" onclick="ywl._sidebar_toggle_submenu('${menu['id']}');">
+                                <i class="fa ${menu['icon']} fa-fw icon"></i>
+                                <span>${menu['name']}</span>
+                                <i class="menu-caret"></i>
+                            </a>
+                            <ul class="sub-menu" id="sidebar_submenu_${menu['id']}" style="display:none;">
+                                %for sub in menu['sub']:
+                                    %if menu['require_type'] <= current_user['type']:
+                                        <li id="sidebar_menu_${menu['id']}_${sub['id']}"><a href="${sub['link']}"><span>${sub['name']}</span></a></li>
+                                    %endif
+                                %endfor
+                            </ul>
+                        </li>
+                    %else:
+                        <li id="sidebar_menu_${menu['id']}"><a href="${menu['link']}"
+                            %if 'target' in menu:
+                                                               target="${menu['target']}"
+                            %endif
+                        ><i class="fa ${menu['icon']} fa-fw icon"></i><span>${menu['name']}</span></a></li>
+                    %endif
+                %endif
+
+            %endfor
+
+        </ul>
+    </div>
+    <!-- end sidebar nav -->
+
+    <hr style="border:none;border-bottom:1px dotted #4a4a4a;margin-bottom:0;"/>
+    <div style="color:#717171;font-size:90%;margin-top:5px;"><span style="display:inline-block;width:100px;text-align: right">服务端：</span><span class="mono">v${eom_ver.TS_VER}</span></div>
+    <div style="color:#717171;font-size:90%;margin-top:5px;"><span style="display:inline-block;width:100px;text-align: right">助手：</span><span class="mono" id="tp-assist-version" req-version=${eom_ver.TP_ASSIST_REQUIRE}>v${eom_ver.TP_ASSIST_LAST_VER}</span></div>
+    <div style="color:#717171;font-size:90%;margin-top:5px;"><span style="display:inline-block;width:100px;text-align: right">当前助手：</span><span class="mono">v${eom_ver.TP_ASSIST_REQUIRE}</span></div>
+
+</div>
+<!-- end sidebar scrollbar -->
\ No newline at end of file
diff --git a/server/www/teleport/view/uidesign/index.mako b/server/www/teleport/view/uidesign/index.mako
new file mode 100644
index 0000000..443177d
--- /dev/null
+++ b/server/www/teleport/view/uidesign/index.mako
@@ -0,0 +1,126 @@
+<%!
+    page_title_ = '页面部件测试'
+    page_menu_ = ['with-sidebar', 'normal']
+%>
+<%inherit file="../page_base.mako"/>
+
+<%block name="extend_js">
+</%block>
+
+<%block name="breadcrumb">
+    <ol class="breadcrumb">
+        <li><i class="fa fa-paint-brush fa-fw"></i> ${self.attr.page_title_}</li>
+        <li>普通页面</li>
+    </ol>
+</%block>
+
+
+<%block name="embed_js">
+    <script type="text/javascript">
+        $(document).ready(function () {
+        });
+    </script>
+</%block>
+
+<%block name="extend_css">
+
+</%block>
+
+<%block name="sidebar_nav_menu">
+    <%include file="_sidebar_nav_menu.mako" />
+</%block>
+
+
+
+<div class="page-content">
+    <div class="box">
+        <h1>这是一级标题，This is H1.</h1>
+        <h2>这是二级标题，This is H2.</h2>
+        <h3>这是三级标题，This is H3.</h3>
+        <h4>这是四级标题，This is H4.</h4>
+        <h5>这是五级标题，This is H5.</h5>
+        <p>这是正文，this is content.</p>
+    </div>
+
+    <div class="box">
+        <div>
+            <p>徽章默认：[badge] <span class="badge">1</span></p>
+            <p>徽章尺寸：[badge] <span class="badge">比较长的文字</span>，[badge badge-sm] <span class="badge badge-sm">小尺寸</span></p>
+            <p>
+                徽章上标：[badge badge-sup] <span class="badge badge-sup">1</span>，
+                [badge badge-sm badge-sup] <span class="badge badge-sm badge-sup">1</span>，
+                [badge badge-sm badge-sup badge-danger] <span class="badge badge-sm badge-sup badge-danger">3</span>，
+                徽章配合图标：<span class="fa fa-bell fa-fw" style="font-size:16px;"></span><span class="badge badge-sm badge-sup badge-danger">3</span>
+            </p>
+            <p>
+                徽章颜色：[badge] <span class="badge">默认</span>，
+                [badge badge-info] <span class="badge badge-ignore">忽略</span>，
+                [badge badge-info] <span class="badge badge-info">信息</span>，
+                [badge badge-primary] <span class="badge badge-primary">重要</span>，
+                [badge badge-success] <span class="badge badge-success">成功</span>，
+                [badge badge-warning] <span class="badge badge-warning">警告</span>，
+                [badge badge-danger] <span class="badge badge-danger">危险（错误）</span>
+            </p>
+            <p>
+                徽章颜色（正常）：
+                <span class="badge">默认</span>
+                <span class="badge badge-ignore">忽略</span>
+                <span class="badge badge-info">信息</span>
+                <span class="badge badge-primary">重要</span>
+                <span class="badge badge-success">成功</span>
+                <span class="badge badge-warning">警告</span>
+                <span class="badge badge-danger">危险（错误）</span>
+            </p>
+            <p>
+                徽章颜色（小）：
+                <span class="badge badge-sm">默认</span>
+                <span class="badge badge-sm badge-ignore">忽略</span>
+                <span class="badge badge-sm badge-info">信息</span>
+                <span class="badge badge-sm badge-primary">重要</span>
+                <span class="badge badge-sm badge-success">成功</span>
+                <span class="badge badge-sm badge-warning">警告</span>
+                <span class="badge badge-sm badge-danger">危险（错误）</span>
+            </p>
+        </div>
+    </div>
+
+    <div class="box">
+        <div>
+            <p>标签默认：[label] <span class="label">标签文字</span></p>
+            <p>标签尺寸：[label] <span class="label">比较长的文字</span>，[label label-sm] <span class="label label-sm">小尺寸</span></p>
+            <p>
+                标签颜色：
+                [label] <span class="label">默认</span>，
+                [label label-ignore] <span class="label label-ignore">忽略</span>，
+                [label label-info] <span class="label label-info">信息</span>，
+                [label label-primary] <span class="label label-primary">重要</span>，
+                [label label-success] <span class="label label-success">成功</span>，
+                [label label-warning] <span class="label label-warning">警告</span>，
+                [label label-danger] <span class="label label-danger">危险（错误）</span>，
+            </p>
+            <p>
+                标签颜色（正常）：
+                <span class="label">默认</span>
+                <span class="label label-ignore">忽略</span>
+                <span class="label label-info">信息</span>
+                <span class="label label-primary">重要</span>
+                <span class="label label-success">成功</span>
+                <span class="label label-warning">警告</span>
+                <span class="label label-danger">危险（错误）</span>
+            </p>
+            <p>
+                标签颜色（小）：
+                <span class="label label-sm">默认</span>
+                <span class="label label-sm label-ignore">忽略</span>
+                <span class="label label-sm label-info">信息</span>
+                <span class="label label-sm label-primary">重要</span>
+                <span class="label label-sm label-success">成功</span>
+                <span class="label label-sm label-warning">警告</span>
+                <span class="label label-sm label-danger">危险（错误）</span>
+            </p>
+        </div>
+    </div>
+
+
+</div>
+
diff --git a/server/www/teleport/view/uidesign/table.mako b/server/www/teleport/view/uidesign/table.mako
new file mode 100644
index 0000000..1e27ffc
--- /dev/null
+++ b/server/www/teleport/view/uidesign/table.mako
@@ -0,0 +1,126 @@
+<%!
+    page_title_ = '页面部件测试'
+    page_menu_ = ['with-sidebar', 'table']
+%>
+<%inherit file="../page_base.mako"/>
+
+<%block name="extend_js">
+</%block>
+
+<%block name="breadcrumb">
+    <ol class="breadcrumb">
+        <li><i class="fa fa-paint-brush fa-fw"></i> ${self.attr.page_title_}</li>
+        <li>表格</li>
+    </ol>
+</%block>
+
+
+<%block name="embed_js">
+    <script type="text/javascript">
+        $(document).ready(function () {
+        });
+    </script>
+</%block>
+
+<%block name="extend_css">
+
+</%block>
+
+<%block name="sidebar_nav_menu">
+    <%include file="_sidebar_nav_menu.mako" />
+</%block>
+
+
+
+<div class="page-content">
+    <div class="box">
+        <h1>这是一级标题，This is H1.</h1>
+        <h2>这是二级标题，This is H2.</h2>
+        <h3>这是三级标题，This is H3.</h3>
+        <h4>这是四级标题，This is H4.</h4>
+        <h5>这是五级标题，This is H5.</h5>
+        <p>这是正文，this is content.</p>
+    </div>
+
+    <div class="box">
+        <div>
+            <p>徽章默认：[badge] <span class="badge">1</span></p>
+            <p>徽章尺寸：[badge] <span class="badge">比较长的文字</span>，[badge badge-sm] <span class="badge badge-sm">小尺寸</span></p>
+            <p>
+                徽章上标：[badge badge-sup] <span class="badge badge-sup">1</span>，
+                [badge badge-sm badge-sup] <span class="badge badge-sm badge-sup">1</span>，
+                [badge badge-sm badge-sup badge-danger] <span class="badge badge-sm badge-sup badge-danger">3</span>，
+                徽章配合图标：<span class="fa fa-bell fa-fw" style="font-size:16px;"></span><span class="badge badge-sm badge-sup badge-danger">3</span>
+            </p>
+            <p>
+                徽章颜色：[badge] <span class="badge">默认</span>，
+                [badge badge-info] <span class="badge badge-ignore">忽略</span>，
+                [badge badge-info] <span class="badge badge-info">信息</span>，
+                [badge badge-primary] <span class="badge badge-primary">重要</span>，
+                [badge badge-success] <span class="badge badge-success">成功</span>，
+                [badge badge-warning] <span class="badge badge-warning">警告</span>，
+                [badge badge-danger] <span class="badge badge-danger">危险（错误）</span>
+            </p>
+            <p>
+                徽章颜色（正常）：
+                <span class="badge">默认</span>
+                <span class="badge badge-ignore">忽略</span>
+                <span class="badge badge-info">信息</span>
+                <span class="badge badge-primary">重要</span>
+                <span class="badge badge-success">成功</span>
+                <span class="badge badge-warning">警告</span>
+                <span class="badge badge-danger">危险（错误）</span>
+            </p>
+            <p>
+                徽章颜色（小）：
+                <span class="badge badge-sm">默认</span>
+                <span class="badge badge-sm badge-ignore">忽略</span>
+                <span class="badge badge-sm badge-info">信息</span>
+                <span class="badge badge-sm badge-primary">重要</span>
+                <span class="badge badge-sm badge-success">成功</span>
+                <span class="badge badge-sm badge-warning">警告</span>
+                <span class="badge badge-sm badge-danger">危险（错误）</span>
+            </p>
+        </div>
+    </div>
+
+    <div class="box">
+        <div>
+            <p>标签默认：[label] <span class="label">标签文字</span></p>
+            <p>标签尺寸：[label] <span class="label">比较长的文字</span>，[label label-sm] <span class="label label-sm">小尺寸</span></p>
+            <p>
+                标签颜色：
+                [label] <span class="label">默认</span>，
+                [label label-ignore] <span class="label label-ignore">忽略</span>，
+                [label label-info] <span class="label label-info">信息</span>，
+                [label label-primary] <span class="label label-primary">重要</span>，
+                [label label-success] <span class="label label-success">成功</span>，
+                [label label-warning] <span class="label label-warning">警告</span>，
+                [label label-danger] <span class="label label-danger">危险（错误）</span>，
+            </p>
+            <p>
+                标签颜色（正常）：
+                <span class="label">默认</span>
+                <span class="label label-ignore">忽略</span>
+                <span class="label label-info">信息</span>
+                <span class="label label-primary">重要</span>
+                <span class="label label-success">成功</span>
+                <span class="label label-warning">警告</span>
+                <span class="label label-danger">危险（错误）</span>
+            </p>
+            <p>
+                标签颜色（小）：
+                <span class="label label-sm">默认</span>
+                <span class="label label-sm label-ignore">忽略</span>
+                <span class="label label-sm label-info">信息</span>
+                <span class="label label-sm label-primary">重要</span>
+                <span class="label label-sm label-success">成功</span>
+                <span class="label label-sm label-warning">警告</span>
+                <span class="label label-sm label-danger">危险（错误）</span>
+            </p>
+        </div>
+    </div>
+
+
+</div>
+
diff --git a/server/www/teleport/view/uidesign/without-sidebar.mako b/server/www/teleport/view/uidesign/without-sidebar.mako
new file mode 100644
index 0000000..1d95534
--- /dev/null
+++ b/server/www/teleport/view/uidesign/without-sidebar.mako
@@ -0,0 +1,119 @@
+<%!
+    page_title_ = '页面部件测试-无侧边栏'
+    page_menu_ = ['without-sidebar']
+%>
+<%inherit file="../page_no_sidebar_base.mako"/>
+
+<%block name="extend_js">
+</%block>
+
+<%block name="breadcrumb">
+    <ol class="breadcrumb">
+        <li><i class="fa fa-paint-brush fa-fw"></i> ${self.attr.page_title_}</li>
+    </ol>
+</%block>
+
+
+<%block name="embed_js">
+    <script type="text/javascript">
+        $(document).ready(function () {
+        });
+    </script>
+</%block>
+
+<%block name="extend_css">
+
+</%block>
+
+<div class="page-content">
+    <div class="box">
+        <h1>这是一级标题，This is H1.</h1>
+        <h2>这是二级标题，This is H2.</h2>
+        <h3>这是三级标题，This is H3.</h3>
+        <h4>这是四级标题，This is H4.</h4>
+        <h5>这是五级标题，This is H5.</h5>
+        <p>这是正文，this is content.</p>
+    </div>
+
+    <div class="box">
+        <div>
+            <p>徽章默认：[badge] <span class="badge">1</span></p>
+            <p>徽章尺寸：[badge] <span class="badge">比较长的文字</span>，[badge badge-sm] <span class="badge badge-sm">小尺寸</span></p>
+            <p>
+                徽章上标：[badge badge-sup] <span class="badge badge-sup">1</span>，
+                [badge badge-sm badge-sup] <span class="badge badge-sm badge-sup">1</span>，
+                [badge badge-sm badge-sup badge-danger] <span class="badge badge-sm badge-sup badge-danger">3</span>，
+                徽章配合图标：<span class="fa fa-bell fa-fw" style="font-size:16px;"></span><span class="badge badge-sm badge-sup badge-danger">3</span>
+            </p>
+            <p>
+                徽章颜色：[badge] <span class="badge">默认</span>，
+                [badge badge-info] <span class="badge badge-ignore">忽略</span>，
+                [badge badge-info] <span class="badge badge-info">信息</span>，
+                [badge badge-primary] <span class="badge badge-primary">重要</span>，
+                [badge badge-success] <span class="badge badge-success">成功</span>，
+                [badge badge-warning] <span class="badge badge-warning">警告</span>，
+                [badge badge-danger] <span class="badge badge-danger">危险（错误）</span>
+            </p>
+            <p>
+                徽章颜色（正常）：
+                <span class="badge">默认</span>
+                <span class="badge badge-ignore">忽略</span>
+                <span class="badge badge-info">信息</span>
+                <span class="badge badge-primary">重要</span>
+                <span class="badge badge-success">成功</span>
+                <span class="badge badge-warning">警告</span>
+                <span class="badge badge-danger">危险（错误）</span>
+            </p>
+            <p>
+                徽章颜色（小）：
+                <span class="badge badge-sm">默认</span>
+                <span class="badge badge-sm badge-ignore">忽略</span>
+                <span class="badge badge-sm badge-info">信息</span>
+                <span class="badge badge-sm badge-primary">重要</span>
+                <span class="badge badge-sm badge-success">成功</span>
+                <span class="badge badge-sm badge-warning">警告</span>
+                <span class="badge badge-sm badge-danger">危险（错误）</span>
+            </p>
+        </div>
+    </div>
+
+    <div class="box">
+        <div>
+            <p>标签默认：[label] <span class="label">标签文字</span></p>
+            <p>标签尺寸：[label] <span class="label">比较长的文字</span>，[label label-sm] <span class="label label-sm">小尺寸</span></p>
+            <p>
+                标签颜色：
+                [label] <span class="label">默认</span>，
+                [label label-ignore] <span class="label label-ignore">忽略</span>，
+                [label label-info] <span class="label label-info">信息</span>，
+                [label label-primary] <span class="label label-primary">重要</span>，
+                [label label-success] <span class="label label-success">成功</span>，
+                [label label-warning] <span class="label label-warning">警告</span>，
+                [label label-danger] <span class="label label-danger">危险（错误）</span>，
+            </p>
+            <p>
+                标签颜色（正常）：
+                <span class="label">默认</span>
+                <span class="label label-ignore">忽略</span>
+                <span class="label label-info">信息</span>
+                <span class="label label-primary">重要</span>
+                <span class="label label-success">成功</span>
+                <span class="label label-warning">警告</span>
+                <span class="label label-danger">危险（错误）</span>
+            </p>
+            <p>
+                标签颜色（小）：
+                <span class="label label-sm">默认</span>
+                <span class="label label-sm label-ignore">忽略</span>
+                <span class="label label-sm label-info">信息</span>
+                <span class="label label-sm label-primary">重要</span>
+                <span class="label label-sm label-success">成功</span>
+                <span class="label label-sm label-warning">警告</span>
+                <span class="label label-sm label-danger">危险（错误）</span>
+            </p>
+        </div>
+    </div>
+
+
+</div>
+