From 92c5d1a6e4d205f29deb927b3eead914b9b0bee2 Mon Sep 17 00:00:00 2001
From: WangHao <43278047@qq.com>
Date: Sun, 4 Oct 2020 03:09:05 +0800
Subject: [PATCH] =?UTF-8?q?=E8=A7=A3=E6=B1=BAstyle=E8=AE=BE=E7=BD=AE?=
 =?UTF-8?q?=E4=B8=BA=20scoped=E6=A0=B7=E5=BC=8F=E9=94=99=E4=BD=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ruoyi-ui/src/assets/styles/base.css           |  14 +-
 ruoyi-ui/src/router/index.js                  |  32 +++--
 .../src/views/bookmark/bookmark/index.vue     |  13 +-
 ruoyi-ui/src/views/bookmark/index/index.vue   | 126 +++++++++---------
 4 files changed, 104 insertions(+), 81 deletions(-)

diff --git a/ruoyi-ui/src/assets/styles/base.css b/ruoyi-ui/src/assets/styles/base.css
index a1aac7c86..2050a4b9d 100644
--- a/ruoyi-ui/src/assets/styles/base.css
+++ b/ruoyi-ui/src/assets/styles/base.css
@@ -6,14 +6,15 @@
   .dropdownList{
     font-size: 22px!important;
   }
+
 }
 
 
 /* ipad pro  >>lg*/
 @media screen and (max-width: 1200px) {
-  .header-listtxet{
-    display: none;
-  }
+  /*.header-listtxet{*/
+  /*  display: none;*/
+  /*}*/
   .main-right{
     width: 250px;
   }
@@ -23,13 +24,17 @@
   .sousouright-icon{
     margin-right: 18px;
   }
+  .logoname span{
+    font-size: 18px;
+  }
 
 
 }
 
 /* >>> md*/
 @media screen and (max-width: 992px) {
-  .el-dropdown-link span{
+
+  .dropdownList span{
     display: none;
   }
 
@@ -73,6 +78,7 @@
     margin-left: 0px!important;
   }
 
+
 }
 /* iphone6 7 8 plus */
 @media screen and (max-width: 414px) {
diff --git a/ruoyi-ui/src/router/index.js b/ruoyi-ui/src/router/index.js
index 24175dc68..281433596 100644
--- a/ruoyi-ui/src/router/index.js
+++ b/ruoyi-ui/src/router/index.js
@@ -33,14 +33,14 @@ import index3 from '@/views/bookmark/index';
     breadcrumb: false            // 如果设置为false，则不会在breadcrumb面包屑中显示
   }
  */
-//书签路由bookmark
-export const bookmark = [
-  {
-    path: '/index2',
-    component: bookmarkmenu,
-    hidden: true
-  },
-]
+// //书签路由bookmark
+// export const bookmark = [
+//   {
+//     path: '/index2',
+//     component: bookmarkmenu,
+//     hidden: true
+//   },
+// ]
 
 
 // 公共路由
@@ -137,15 +137,16 @@ export const constantRoutes = [
       }
     ]
   },
-  {
-    path: '/index2',
-    component: bookmarkmenu,
-
-  },
+  // {
+  //   path: '/index2',
+  //   component: bookmarkmenu,
+  //
+  // },
   {
     path: '/index3',
     component: index3,
     meta:{
+      title: '书签管理',icon:'user',
       requireAuth: false,
     },
     children: [
@@ -157,6 +158,7 @@ export const constantRoutes = [
           t:Date.now(),
         },
         meta:{
+          title: '书签页面',icon:'user',
           requireAuth: false,//加该字段,表示进入这个路由是需要登录的true
         },
       },{
@@ -164,6 +166,7 @@ export const constantRoutes = [
         name: 'UserTagAll',
         component: resolve => require(['../views/bookmark/common/UserTagAll.vue'], resolve),
         meta:{
+          title: '用户标签',icon:'user',
           requireAuth: true,//加该字段,表示进入这个路由是需要登录的true
         },
       },{
@@ -171,6 +174,7 @@ export const constantRoutes = [
         name: 'importHtml',
         component: resolve => require(['../views/bookmark/common/ImportHtml.vue'], resolve),
         meta:{
+          title: '导入书签',icon:'user',
           requireAuth: true,//加该字段,表示进入这个路由是需要登录的true
         },
       },{
@@ -178,12 +182,14 @@ export const constantRoutes = [
         name: 'ceshi',
         component: resolve => require(['../views/bookmark/ceshi/index.vue'], resolve),
         meta:{
+          title: '测试页面',icon:'user',
           requireAuth: true,//加该字段,表示进入这个路由是需要登录的true
         },
       }
     ],
 
   },
+
 ]
 
 export default new Router({
diff --git a/ruoyi-ui/src/views/bookmark/bookmark/index.vue b/ruoyi-ui/src/views/bookmark/bookmark/index.vue
index 59949a105..3d97f37f6 100644
--- a/ruoyi-ui/src/views/bookmark/bookmark/index.vue
+++ b/ruoyi-ui/src/views/bookmark/bookmark/index.vue
@@ -683,6 +683,12 @@
   .bookmarktag {
     margin-right: 5px;
   }
+  .bookmark-official {
+    float: left;
+  }
+  .info {
+    font-size: 12px;
+  }
 
   .bookmark-icon {
     float: left;
@@ -768,7 +774,7 @@
     margin-left: 4px;
     height: 18px;
     line-height: 18px;
-    margin-top: 2px;
+    margin-top: -2px;
     border-radius: 1px;
     color: #7794D8;
     background-color: #FFFFFF;
@@ -786,10 +792,13 @@
     font-weight: 600;
   }
   .bookmark-title:hover{
+
     color: #3C4DAC;
   }
   .description{
     color: #9EABB3;
+    margin-top: 5px;
+    margin-bottom: 5px;
   }
   .info-wrap{
     color: #9EABB3;
@@ -807,6 +816,8 @@
     /*超出部分隐藏*/
     font-size: 17px;
     font-weight: 600;
+    margin-top: 2px;
+    margin-bottom: 2px;
   }
 
   .description {
diff --git a/ruoyi-ui/src/views/bookmark/index/index.vue b/ruoyi-ui/src/views/bookmark/index/index.vue
index 67217f128..7244db690 100644
--- a/ruoyi-ui/src/views/bookmark/index/index.vue
+++ b/ruoyi-ui/src/views/bookmark/index/index.vue
@@ -88,26 +88,21 @@
           </div>
 
           <div class="sousou-input">
-            <el-popover
-              placement="bottom"
-              width="400"
-              trigger="click"
-              :visible-arrow="false"
-              popper-class="popover-suosou"
-            >
-
-              <div v-for="o in 4" :key="o">
-                {{'列表内容 ' + o }}
-              </div>
-
+<!--            <el-popover-->
+<!--              placement="bottom"-->
+<!--              width="400"-->
+<!--              trigger="click"-->
+<!--              :visible-arrow="false"-->
+<!--              popper-class="popover-suosou"-->
+<!--            >-->
+<!--              <div v-for="o in 4" :key="o">-->
+<!--                {{'列表内容 ' + o }}-->
+<!--              </div>-->
               <el-input slot="reference" placeholder="请输入书签名字" v-model="sousou" size="small">
                 <i slot="prefix" class="el-input__icon el-icon-search"></i>
                 <!--          <el-button slot="append" icon="el-icon-search"></el-button>-->
               </el-input>
-
-
-            </el-popover>
-
+<!--            </el-popover>-->
           </div>
 
           <div class="sousouright-icon">
@@ -115,7 +110,7 @@
             </el-badge>
           </div>
 
-          <div class="sousouright-icon">
+          <div class="sousouright-iconadd">
             <el-dropdown trigger="click" size="small" :hide-on-click="false">
               <span class="el-dropdown-link">
           <i class="el-icon-plus" style="font-size: 18px;"/>
@@ -127,8 +122,6 @@
                 <el-dropdown-item class="filter-item" icon="el-icon-plus" command="d">导入书签</el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
-
-
           </div>
 
 
@@ -287,7 +280,7 @@
 
 </template>
 <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
-
+<style scoped src="../ztree/demo.css"/>
 <script >
   // 下面的是单个Vue组件引用的外部静态文件，也可以在main.js文件中引用
   import {addBookmark} from "@/api/bookmark/bookmark";
@@ -295,9 +288,9 @@
   import {listMenu, getMenu, delMenu, addMenu, updateMenu, exportMenu} from "@/api/bookmark/menu";
   import Treeselect from "@riophae/vue-treeselect";
   import "@riophae/vue-treeselect/dist/vue-treeselect.css";
-  import "../ztree/jquery-1.4.4.min.js"
+  // import "../ztree/jquery-1.4.4.min.js"
   import "../ztree/jquery.ztree.core.js"
-  import "../ztree/demo.css"
+  // import "../ztree/demo.css"
   import "../ztree/zTreeStyle.css"
   import "../ztree/jquery.ztree.exedit.js"
   import {listMenuByUserId} from "@/api/bookmark/menu";
@@ -1590,11 +1583,12 @@
 
 
   .reminder {
-    margin-left: 27px;
     color: #878787;
-    opacity: 0.6;
-    font-size: 14px;
-    font-weight: 500;
+    opacity: 0.7;
+    font-size: 14px!important;
+    font-weight: 500!important;
+    margin-left: 27px!important;
+
   }
 
   .aside-navigation {
@@ -1650,11 +1644,13 @@
 
   .header-sousou {
     display: flex;
+    align-items: center;
+    justify-content: center;
   }
 
 
   .header-sousou input {
-    margin-top: 8px;
+    margin-top: 9px;
     border: 0px;
     background-color: #f2f2f2;
     border-radius: 0 !important;
@@ -1678,17 +1674,20 @@
 
   .sousou-input {
 
-    width: 82.5%;
-    margin-right: 15px;
+    width: 100%;
+
 
 
   }
 
   .header-list {
-    /*line-height: 50px;*/
-    margin-top: 10px;
-    /*align-content: center;*/
-    /*justify-content: center;*/
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 35px;
+    margin-top: 9px!important;
+
+
   }
 
   .header-list:hover {
@@ -1727,14 +1726,8 @@
 
 
 
-  .bookmark-official {
-    float: left;
-  }
 
-  /*.info {*/
-  /*  font-size: 12px;*/
 
-  /*}*/
 
 
 
@@ -1743,13 +1736,7 @@
 
 
   .sousouleft-switch {
-
-    width: 30px;
-    height: 30px;
-    line-height: 50px;
-    margin-top: 3px;
-    margin-right: 5px;
-
+    margin-top: 4px!important;
   }
 
   .sousouleft-switch i {
@@ -1759,26 +1746,27 @@
   }
 
   .sousou-left {
-    display: flex;
+    width: 50px!important;
+    height: 50px;
+    margin-top: 12px!important;
   }
 
-  .sousou-leftico {
-
+  .sousou-leftico  {
+    display: flex;
+    align-items: center;
+    justify-content: center;
     width: 30px;
     height: 30px;
-    border: #d1e9ff solid 1px;
-    border-radius: 5px;
-    opacity: 0.7;
-    text-align: center;
-    line-height: 30px;
-    margin-top: 9px;
-    margin-right: 12px;
+    border-radius: 3px;
+    border: 1px solid #e6e6e6 !important;
+    margin-top: 9px!important;
+
+
+  }
+  .sousou-leftico img{
 
   }
 
-  .sousou-leftico img {
-    margin-top: 5px;
-  }
 
   .filter-item:hover {
     background-color: #E5E5E5 !important;
@@ -1789,10 +1777,22 @@
 
 
   .sousouright-icon {
-    margin-right: 24px;
-    margin-top: 10px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 50px;
+    margin-top: 7px!important;
   }
 
+ .sousouright-iconadd {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 50px;
+   margin-top: 7px!important;
+  }
+
+
   .sq-dropdown {
     top: 33px !important;
     box-shadow: 0 2px 15px 0 rgba(0, 0, 0, .2) !important;
@@ -1933,9 +1933,9 @@
   }
 
   .popover-suosou {
-    width: 70% !important;
+    /*width: 85% ;*/
     top: 40px;
-    left: 72px;
+    /*left: 72px;*/
   }
   /* 拖拽相关样式 */
   /*包围div样式*/