ui: 页面布局优化

packages/ui-default/pages/problem_main.page.js

@@ -218,6 +218,15 @@ const page = new NamedPage(['problem_main', 'problem_category'], () => {
     ev.preventDefault();
     updateSelection();
   });
+  $('#searchForm').on('submit', () => {
+    updateSelection();
+    return false;
+  });
+  let update;
+  $('#searchForm').find('input').on('input', () => {
+    if (update) clearTimeout(update);
+    update = setTimeout(updateSelection, 500);
+  });
   $(document).on('click', 'a.pager__item', (ev) => {
     ev.preventDefault();
     pjax.request({ url: $(ev.currentTarget).attr('href') }).then(() => {

packages/ui-default/pages/problem_main.page.styl

@@ -1,10 +1,10 @@
 .page--problem_main
 .page--problem_category
   .col--checkbox
-    width: rem(60px)
+    width: rem(61px)
 
   .col--pid
-    width: rem(80px)
+    width: rem(81px)
   
   .col--status
     width: rem(140px)
@@ -108,4 +108,40 @@
   display: none
 
 .edit-mode .edit-mode-hide
-  display: none
+  display: none
+
+.data-table > tbody > tr
+  height: 40.15px
+
+.data-table > thead > tr
+  height: 54.9px
+
+.search
+  width: 100%
+  position: relative
+  display: flex
+
+.search > input
+  width: 100%
+  border: 1px solid #cccccc
+  border-right: none
+  padding: 5px
+  height: 36px
+  outline: none
+  color: #000000
+
+.search > button
+  width: 40px
+  height: 36px
+  border: 1px solid #00B4CC
+  background: #00B4CC
+  text-align: center
+  color: #fff
+  cursor: pointer
+  font-size: 20px
+
+.search > div
+  position: absolute
+  right: 50px
+  top: 8px
+  font-size: rem(17px)