From caa1bae4fda3d0dff54f9f31c594d4cd30e438af Mon Sep 17 00:00:00 2001
From: WangHao <43278047@qq.com>
Date: Sun, 14 Nov 2021 18:22:19 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E5=AF=BC=E8=88=AA=E7=BD=91?=
 =?UTF-8?q?=E7=9A=84=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/views/bookmark/bookmark/index.vue     | 86 ++++++++--------
 ruoyi-ui/src/views/bookmark/index/index.vue   |  2 +-
 ruoyi-ui/src/views/daohang/index/index.vue    | 98 ++++++++++++++-----
 3 files changed, 123 insertions(+), 63 deletions(-)

diff --git a/ruoyi-ui/src/views/bookmark/bookmark/index.vue b/ruoyi-ui/src/views/bookmark/bookmark/index.vue
index 8642305ee..1aebb9e0a 100644
--- a/ruoyi-ui/src/views/bookmark/bookmark/index.vue
+++ b/ruoyi-ui/src/views/bookmark/bookmark/index.vue
@@ -1382,47 +1382,7 @@
   }
 
 
-  /**滚动条美化*/
 
-  /*滚动条的宽度*/
-
-  ::-webkit-scrollbar {
-    width: 5px;
-    height: 3px;
-    /*background-color: red;*/
-  }
-
-  /*外层轨道。可以用display:none让其不显示，也可以添加背景图片，颜色改变显示效果*/
-
-  ::-webkit-scrollbar-track {
-    width: 6px;
-    background-color: transparent;
-    -webkit-border-radius: 2em;
-    -moz-border-radius: 2em;
-    border-radius: 2em;
-  }
-
-  /*滚动条的设置*/
-
-  ::-webkit-scrollbar-thumb {
-    /*设置为透明 隐藏掉*/
-    background-color: #606d71;
-    /*background-color: transparent;*/
-    background-clip: padding-box;
-    min-height: 28px;
-    -webkit-border-radius: 2em;
-    -moz-border-radius: 2em;
-    border-radius: 2em;
-
-  }
-
-  /*滚动条移上去的背景*/
-
-  ::-webkit-scrollbar-thumb:hover {
-    background-color: #7c6fff;
-  }
-
-  /*滚动条美化结束*/
 
 
   .sousuoContent {
@@ -1647,3 +1607,49 @@
 
 
 </style>
+
+<style scoped>
+
+  /**滚动条美化*/
+
+  /*滚动条的宽度*/
+
+  ::-webkit-scrollbar {
+    width: 5px;
+    height: 3px;
+    /*background-color: red;*/
+  }
+
+  /*外层轨道。可以用display:none让其不显示，也可以添加背景图片，颜色改变显示效果*/
+
+  ::-webkit-scrollbar-track {
+    width: 6px;
+    background-color: transparent;
+    -webkit-border-radius: 2em;
+    -moz-border-radius: 2em;
+    border-radius: 2em;
+  }
+
+  /*滚动条的设置*/
+
+  ::-webkit-scrollbar-thumb {
+    /*设置为透明 隐藏掉*/
+    background-color: #606d71;
+    /*background-color: transparent;*/
+    background-clip: padding-box;
+    min-height: 28px;
+    -webkit-border-radius: 2em;
+    -moz-border-radius: 2em;
+    border-radius: 2em;
+
+  }
+
+  /*滚动条移上去的背景*/
+
+  ::-webkit-scrollbar-thumb:hover {
+    background-color: #7c6fff;
+  }
+
+  /*滚动条美化结束*/
+
+</style>
diff --git a/ruoyi-ui/src/views/bookmark/index/index.vue b/ruoyi-ui/src/views/bookmark/index/index.vue
index f41125859..e702bffef 100644
--- a/ruoyi-ui/src/views/bookmark/index/index.vue
+++ b/ruoyi-ui/src/views/bookmark/index/index.vue
@@ -1603,7 +1603,7 @@
 
 
 </style>
-<style>
+<style scoped>
 
   #popupDiv {
     position: absolute;
diff --git a/ruoyi-ui/src/views/daohang/index/index.vue b/ruoyi-ui/src/views/daohang/index/index.vue
index 543cee4c2..20d7e7f9d 100644
--- a/ruoyi-ui/src/views/daohang/index/index.vue
+++ b/ruoyi-ui/src/views/daohang/index/index.vue
@@ -1,5 +1,4 @@
 <template>
-<!--  <div :style="imageStr">-->
   <div :style="imageStr">
 <!--    <div :style="imageStr"></div>-->
 
@@ -73,15 +72,12 @@
           <div class="label-title">
             <div class="title">
               <el-dropdown trigger="click">
-      <span class="el-dropdown-link menu-list" >
-        最新书签<i class="el-icon-caret-bottom el-icon--right"></i>
-      </span>
+              <span class="el-dropdown-link menu-list" >
+                最新收藏<i class="el-icon-caret-bottom el-icon--right"></i>
+                </span>
                 <el-dropdown-menu slot="dropdown">
-                  <el-dropdown-item icon="el-icon-plus">黄金糕</el-dropdown-item>
-                  <el-dropdown-item icon="el-icon-circle-plus">狮子头</el-dropdown-item>
-                  <el-dropdown-item icon="el-icon-circle-plus-outline">螺蛳粉</el-dropdown-item>
-                  <el-dropdown-item icon="el-icon-check">双皮奶</el-dropdown-item>
-                  <el-dropdown-item icon="el-icon-circle-check">蚵仔煎</el-dropdown-item>
+                  <el-dropdown-item icon="el-icon-star-off">我的星标</el-dropdown-item>
+                  <el-dropdown-item icon="el-icon-reading">稍后再读</el-dropdown-item>
                 </el-dropdown-menu>
               </el-dropdown>
             </div>
@@ -118,12 +114,21 @@
         <el-main class="mains mbl" width="500px" >
           <div class="mains-title">
             <div class="title">
-              常用导航
+              <el-dropdown trigger="click">
+              <span class="el-dropdown-link menu-list" >
+               常用导航<i class="el-icon-caret-bottom el-icon--right"></i>
+                </span>
+                <el-dropdown-menu slot="dropdown">
+                  <el-dropdown-item icon="el-icon-star-off">我的星标</el-dropdown-item>
+                  <el-dropdown-item icon="el-icon-reading">稍后再读</el-dropdown-item>
+                </el-dropdown-menu>
+              </el-dropdown>
+
             </div>
             <div class="status">
-              <span>旧故</span>
+              <span>最新</span>
               <el-divider direction="vertical"></el-divider>
-              <span>草木</span>
+              <span>热度</span>
             </div>
           </div>
           <el-divider class="mians-hr"></el-divider>
@@ -161,7 +166,43 @@
 
         <!-- 右侧-->
         <el-aside class="mains-right mbl" width="400px">
-<!--          <div :style="imageStr"></div>-->
+          <div class="label-title">
+            <div class="title">
+              <el-dropdown trigger="click">
+              <span class="el-dropdown-link menu-list" >
+                发现推荐<i class="el-icon-caret-bottom el-icon--right"></i>
+                </span>
+                <el-dropdown-menu slot="dropdown">
+                  <el-dropdown-item icon="el-icon-star-off">我的星标</el-dropdown-item>
+                  <el-dropdown-item icon="el-icon-reading">稍后再读</el-dropdown-item>
+                </el-dropdown-menu>
+              </el-dropdown>
+            </div>
+
+            <div class="status">
+              <span>最新</span>
+              <el-divider direction="vertical"></el-divider>
+              <span>热度</span>
+            </div>
+          </div>
+          <el-divider class="mians-hr"></el-divider>
+          <div class="contenList" v-infinite-scroll="load" style="overflow:auto">
+            <div v-for="o in count" :key="o" class="bookmarContext item">
+
+              <div class="bookmar-title text-lenght">
+                {{'阿达瓦发我的发我法师法师法师法师法挖的挖的挖的挖的挖的挖的挖列表内容 ' + o }}
+              </div>
+              <div class="bookmark-tag-Time">
+                <div class="b-left text-lenght">#java #php 我是个簡介</div>
+                <div class="b-center">22小时前</div>
+                <div class="b-right">
+                  <i class="el-icon-view">22</i>
+                </div>
+
+              </div>
+
+            </div>
+          </div>
         </el-aside>
 
       </el-container>
@@ -218,11 +259,18 @@
           {iconID: "7", icon: "https://movie.douban.com/", title: "豆瓣电影"},
         ],
         imageStr: {
-          backgroundImage: 'url(https://images.unsplash.com/photo-1574001412367-cf5f9756bb32?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=MnwyMTQ5NzR8MHwxfGFsbHwzfHx8fHx8MXx8MTYzNjczODIwMw)',
+          backgroundImage: 'url(https://img-operation.csdnimg.cn/csdn/silkroad/img/1633686296539.jpg)',
           width: '100%',
           height: '100%',
           backgroundRepeat: 'no-repeat',
-          backgroundSize: '100% 100%'
+          backgroundSize: '100% 100%',
+        },
+        imageStrOne: {
+          backgroundColor: '#D4D4D4',
+          width: '100%',
+          height: '100%',
+          backgroundRepeat: 'no-repeat',
+          backgroundSize: '100% 100%',
         }
       }
     },
@@ -343,7 +391,9 @@
     background:rgba(255,255,255,0.4);
 }
 
-
+  .el-divider{
+    background: rgba(255,255,255,0.2);
+}
 
 
 
@@ -384,6 +434,10 @@
   }
 
   .mains-title .status {
+    position: absolute;
+    right: 0;
+    margin-right: 11px;
+
 
   }
 
@@ -391,7 +445,6 @@
     padding: 7px 7px;
     margin-left: 10px;
     margin-right: 10px;
-    /*background-color: #ffffff;*/
 
   }
 
@@ -456,7 +509,7 @@
     width: 100%;
     display: flex;
     height: 30px;
-    color: #909AA5;
+    color: #50565c;
   }
   .bookmark-tag-Time .b-right{
 
@@ -583,8 +636,7 @@
 
   .choice {
     margin: 5px 5px 5px 5px;
-    background-color: #FFFFFF;
-
+    background:rgba(255,255,255,0.2);
   }
 
   .choice div {
@@ -680,7 +732,8 @@
 
   ::-webkit-scrollbar-track {
     width: 6px;
-    background-color: #fff;
+    /*background-color: #fff;*/
+    background:rgba(255,255,255,0.2);
     -webkit-border-radius: 2em;
     -moz-border-radius: 2em;
     border-radius: 2em;
@@ -689,7 +742,8 @@
   /*滚动条的设置*/
 
   ::-webkit-scrollbar-thumb {
-    background-color: #606d71;
+    /*background-color: #606d71;*/
+    background: rgba(218, 219, 222, 0.6);
     background-clip: padding-box;
     min-height: 28px;
     -webkit-border-radius: 2em;