瀏覽代碼

项目管理,列表显示优化:in-* 缩进改为像素,并且调整固定比例值;“展开”“收起”icon去掉class “mr-1”,改为由上级a 提供固定宽度,poj-icon padding值调整;列表table 增加 mb-5 ,然滚动条在底部有更好的显示;<legend>移进 .toolsbar

Chente 8 年之前
父節點
當前提交
b0d08157ba
共有 2 個文件被更改,包括 172 次插入18 次删除
  1. 11 7
      css/main.css
  2. 161 11
      project-management.html

+ 11 - 7
css/main.css

@@ -26,12 +26,12 @@ body {
   width:100%;
   z-index: 999
 }
-.in-1{padding-left:0rem!important}
-.in-2{padding-left:1rem!important}
-.in-3{padding-left:1.5rem!important}
-.in-4{padding-left:2rem!important}
-.in-5{padding-left:2.5rem!important}
-.in-6{padding-left:3rem!important}
+.in-1{padding-left:0px!important}
+.in-2{padding-left:21px!important}
+.in-3{padding-left:42px!important}
+.in-4{padding-left:63px!important}
+.in-5{padding-left:84px!important}
+.in-6{padding-left:105px!important}
 .main {
     position: relative;
     background: #f7f7f9;
@@ -222,9 +222,13 @@ body {
     overflow: auto;
 }
 .poj-list span.poj-icon {
-  padding-right:10px;
+  padding-right:7px;
   color:#ccc
 }
+.poj-list a.tree-open,.poj-list a.tree-close{
+  width:15px;
+  display: inline-block;
+}
 .print-toolsbar{
   padding:5px
 }

+ 161 - 11
project-management.html

@@ -110,10 +110,10 @@
                             <a href="" class="btn btn-sm">共享</a>
                             <a href="" class="btn btn-sm">协同</a>
                         </div>
+                        <legend class="m-0 pb-1">全部</legend>
                     </div>
                     <div class="poj-list">
-                        <legend>全部</legend>
-                        <table class="table table-hover table-sm">
+                        <table class="table table-hover table-sm mb-5">
                             <thead>
                                 <tr>
                                     <th width="40"></th>
@@ -125,51 +125,201 @@
                             <tbody>
                                 <tr>
                                     <td></td>
-                                    <td class="in-1"><a href="#" class="tree-open" title="收起"><i class="fa fa-minus-square-o mr-1"></i></a><i class="fa fa-folder-open-o"></i>&nbsp;XX项目文件夹</td>
+                                    <td class="in-1"><span class="poj-icon">└</span><a href="#">机械设备安装工程</a></td>
+                                    <td>2016-01-01</td>
+                                    <td>2016-01-01</td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-1"><span class="poj-icon">└</span><a href="#">机械设备安装工程2</a></td>
+                                    <td>2016-01-01</td>
+                                    <td>2016-01-01</td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-1"><a href="#" class="tree-open" title="收起"><i class="fa fa-minus-square-o"></i></a><i class="fa fa-folder-open-o"></i>&nbsp;<a href="#" class="open-sidebar">飞机生产车间</a></td>
+                                    <td></td>
+                                    <td></td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-2"><span class="ml-3 poj-icon">└</span><a href="zaojiashu.html">建筑工程1</a></td>
+                                    <td>2016-01-01</td>
+                                    <td>2016-01-01</td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-1"><span class="poj-icon">└</span><a href="#">第一层标段实例</a></td>
+                                    <td>2016-01-01</td>
+                                    <td>2016-01-01</td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-1"><a href="#" class="tree-open" title="收起"><i class="fa fa-minus-square-o"></i></a><i class="fa fa-folder-open-o"></i>&nbsp;<a href="#" class="open-sidebar">汽车生产车间</a></td>
+                                    <td></td>
+                                    <td></td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-2"><a href="#" class="tree-open" title="收起"><i class="fa fa-minus-square-o"></i></a><i class="fa fa-folder-open-o"></i>&nbsp;<a href="#" class="open-sidebar">左2号生产车间</a></td>
+                                    <td></td>
+                                    <td></td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-3"><span class="ml-3 poj-icon">└</span><a href="zaojiashu.html">建筑工程2</a></td>
+                                    <td>2016-01-01</td>
+                                    <td>2016-01-01</td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-1"><a href="#" class="tree-open" title="收起"><i class="fa fa-minus-square-o"></i></a><i class="fa fa-folder-open-o"></i>&nbsp;<a href="#" class="open-sidebar">轮船生产车间</a></td>
+                                    <td></td>
+                                    <td></td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-2"><a href="#" class="tree-open" title="收起"><i class="fa fa-minus-square-o"></i></a><i class="fa fa-folder-open-o"></i>&nbsp;<a href="#" class="open-sidebar">船体生产车间</a></td>
+                                    <td></td>
+                                    <td></td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-3"><a href="#" class="tree-open" title="收起"><i class="fa fa-minus-square-o"></i></a><i class="fa fa-folder-open-o"></i>&nbsp;<a href="#" class="open-sidebar">6号生产车间</a></td>
+                                    <td></td>
+                                    <td></td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-4"><span class="ml-3 poj-icon">└</span><a href="zaojiashu.html">建筑工程3</a></td>
+                                    <td>2016-01-01</td>
+                                    <td>2016-01-01</td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-4"><span class="ml-3 poj-icon">└</span><a href="zaojiashu.html">建筑工程4</a></td>
+                                    <td>2016-01-01</td>
+                                    <td>2016-01-01</td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-4"><span class="ml-3 poj-icon">└</span><a href="zaojiashu.html">建筑工程5</a></td>
+                                    <td>2016-01-01</td>
+                                    <td>2016-01-01</td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-3"><a href="#" class="tree-open" title="收起"><i class="fa fa-minus-square-o"></i></a><i class="fa fa-folder-open-o"></i>&nbsp;<a href="#" class="open-sidebar">6号生产车间</a></td>
+                                    <td></td>
+                                    <td></td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-4"><span class="ml-3 poj-icon">└</span><a href="zaojiashu.html">建筑工程6</a></td>
+                                    <td>2016-01-01</td>
+                                    <td>2016-01-01</td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-3"><a href="#" class="tree-open" title="收起"><i class=""></i></a><i class="fa fa-folder-open-o"></i>&nbsp;<a href="#" class="open-sidebar">7号生产车间</a></td>
+                                    <td></td>
+                                    <td></td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-3"><a href="#" class="tree-open" title="收起"><i class=""></i></a><i class="fa fa-folder-open-o"></i>&nbsp;<a href="#" class="open-sidebar">7号生产车间</a></td>
+                                    <td></td>
+                                    <td></td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-2"><a href="#" class="tree-open" title="收起"><i class="fa fa-minus-square-o"></i></a><i class="fa fa-folder-open-o"></i>&nbsp;<a href="#" class="open-sidebar">甲板生产车间</a></td>
+                                    <td></td>
+                                    <td></td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-3"><a href="#" class="tree-open" title="收起"><i class="fa fa-minus-square-o"></i></a><i class="fa fa-folder-open-o"></i>&nbsp;<a href="#" class="open-sidebar">7号生产车间</a></td>
+                                    <td></td>
+                                    <td></td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-4"><span class="ml-3 poj-icon">└</span><a href="zaojiashu.html">建筑工程7</a></td>
+                                    <td>2016-01-01</td>
+                                    <td>2016-01-01</td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-4"><span class="ml-3 poj-icon">└</span><a href="zaojiashu.html">建筑工程8</a></td>
+                                    <td>2016-01-01</td>
+                                    <td>2016-01-01</td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-1"><a href="#" class="tree-open" title="收起"><i class="fa fa-minus-square-o"></i></a><i class="fa fa-folder-open-o"></i>&nbsp;XX项目文件夹</td>
                                     <td></td>
                                     <td></td>
                                 </tr>
                                   <tr>
                                       <td></td>
-                                      <td class="in-2"><a href="#" class="tree-open" title="收起"><i class="fa fa-minus-square-o mr-1"></i></a><i class="fa fa-folder-open-o"></i>&nbsp;XX项目文件夹</td>
+                                      <td class="in-2"><a href="#" class="tree-open" title="收起"><i class="fa fa-minus-square-o"></i></a><i class="fa fa-folder-open-o"></i>&nbsp;XX项目文件夹</td>
                                       <td></td>
                                       <td></td>
                                   </tr>
                                 <tr>
                                     <td></td>
-                                    <td class="in-3"><a href="#" class="tree-open" title="收起"><i class="fa fa-minus-square-o mr-1"></i></a><i class="fa fa-folder-open-o"></i>&nbsp;XX项目文件夹</td>
+                                    <td class="in-3"><a href="#" class="tree-open" title="收起"><i class="fa fa-minus-square-o"></i></a><i class="fa fa-folder-open-o"></i>&nbsp;XX项目文件夹</td>
                                     <td></td>
                                     <td></td>
                                 </tr>
                                 <tr>
                                     <td></td>
-                                    <td class="in-4"><a href="#" class="tree-open" title="收起"><i class="fa fa-minus-square-o mr-1"></i></a><i class="fa fa-folder-open-o"></i>&nbsp;<a href="#">某某某某工厂工厂某某工厂建设某某工厂建设</a></td>
+                                    <td class="in-4"><a href="#" class="tree-open" title="收起"><i class="fa fa-minus-square-o"></i></a><i class="fa fa-folder-open-o"></i>&nbsp;<a href="#">某某某某工厂工厂某某工厂建设某某工厂建设</a></td>
                                     <td></td>
                                     <td></td>
                                 </tr>
                                 <tr>
                                     <td></td>
-                                    <td class="in-5"><a href="#" class="tree-open" title="收起"><i class="fa fa-minus-square-o mr-1"></i></a><i class="fa fa-folder-open-o"></i>&nbsp;<a href="#" class="open-sidebar">左1号生产车间(click)</a></td>
+                                    <td class="in-5"><a href="#" class="tree-open" title="收起"><i class="fa fa-minus-square-o"></i></a><i class="fa fa-folder-open-o"></i>&nbsp;<a href="#" class="open-sidebar">左1号生产车间(click)</a></td>
                                     <td></td>
                                     <td></td>
                                 </tr>
                                 <tr>
                                     <td><i class="fa fa-sort" data-toggle="tooltip" data-placement="top" title="长安拖动"></i></td>
-                                    <td class="in-6"><span class="in-3 poj-icon">└</span><a href="zaojiashu.html">建筑工程(click)</a></td>
+                                    <td class="in-6"><span class="ml-3 poj-icon">└</span><a href="zaojiashu.html">建筑工程(click)</a></td>
                                     <td>2016-01-01</td>
                                     <td>2016-01-01</td>
                                 </tr>
                                 <tr>
                                     <td></td>
-                                    <td class="in-6"><span class="in-3 poj-icon">└</span><a href="#">机械设备安装工程</a></td>
+                                    <td class="in-6"><span class="ml-3 poj-icon">└</span><a href="#">机械设备安装工程</a></td>
                                     <td>2016-01-01</td>
                                     <td>2016-01-01</td>
                                 </tr>
                                 <tr>
                                     <td></td>
                                     <td class="in-5"><a href="#" class="tree-close" title="展开"><i class="fa fa-plus-square-o  mr-1"></i></a><i class="fa fa-folder-o"></i>&nbsp;<a href="#">2号生产车间</a></td>
-                                    <td>......</td>
-                                    <td>......</td>
+                                    <td></td>
+                                    <td></td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-1"><a href="#" class="tree-close" title="展开"><i class="fa fa-plus-square-o  mr-1"></i></a><i class="fa fa-folder-o"></i>&nbsp;<a href="#">3号生产车间</a></td>
+                                    <td></td>
+                                    <td></td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-2"><a href="#" class="tree-close" title="展开"><i class="fa fa-plus-square-o  mr-1"></i></a><i class="fa fa-folder-o"></i>&nbsp;<a href="#">大炮</a></td>
+                                    <td></td>
+                                    <td></td>
+                                </tr>
+                                <tr>
+                                    <td></td>
+                                    <td class="in-2"><a href="#" class="tree-close" title="展开"><i class="fa fa-plus-square-o  mr-1"></i></a><i class="fa fa-folder-o"></i>&nbsp;<a href="#">机枪</a></td>
+                                    <td></td>
+                                    <td></td>
                                 </tr>
                             </tbody>
                         </table>