+
{{bm.description}}
-
+
![]()
{{bm.urls}} ·
{{bm.createTime|changeTime}}
-
-
+
-
+
#{{item.name}}
@@ -42,14 +53,19 @@
+
+
+
+
+
+
@@ -65,6 +81,7 @@
property: null,
highlighted: null,//搜索是否高亮
sousuo:null,
+ showPattern:null,//页面展示模式
},
data: function () {
return {
@@ -77,10 +94,14 @@
}
},
mounted(){
- this.showView(this.property);
+ this.showView(this.property);
+ this.showlistView(this.showPattern);
+ // console.log("property222:"+this.property);
+ // console.log("showPattern222:"+this.showPattern);
},
updated(){
- // this.showView(this.property);
+ // this.showView(this.property);
+ //this.showlistView(this.showPattern);
},
created() {
// var that=this;
@@ -153,22 +174,52 @@
showView(e) {
var that=this;
switch (e) {
- case 0:
+ case '0':
//网页模式
that.isdescription = true;
that.noteTime = false;
that.isBookmarkIcon = true;
break;
- case 1:
+ case '1':
//便签模式
that.isdescription = false;
that.noteTime = true;
that.isBookmarkIcon = false;
break;
default:
-
+ that.isdescription = true;
+ that.noteTime = false;
+ that.isBookmarkIcon = true;
+ }
+ },
+ /**渲染模式**/
+ showlistView(e) {
+ var that=this;
+ console.log("showlistView"+e)
+ switch (e) {
+ case '0':
+ //默认模式
+ that.isdescription = true;
+ that.noteTime = false;
+ that.isBookmarkIcon = true;
+ console.log("默认模式")
+ break;
+ case '1':
+ //简洁模式
+ that.isdescription = false;
+ that.noteTime = true;
+ that.isBookmarkIcon = false;
+ console.log("简洁模式")
+ break;
+ case '2':
+ //简洁模式
+ that.isdescription = false;
+ that.noteTime = false;
+ that.isBookmarkIcon = true;
+ console.log("简洁模式2")
+ break;
+ default:
}
-
},
/**搜索高亮 开始**/
@@ -293,8 +344,8 @@
-webkit-text-overflow: ellipsis;
overflow: hidden;
position: relative;
- font-size: 1.05rem;
- font-weight: 500;
+ font-size: 0.93rem;
+ font-weight: 400;
}
.bookmark-time {
@@ -346,5 +397,23 @@
justify-content:flex-end;
align-items:center;
}
+ .book-eidt-All{
+ font-size: 14px;
+ font-weight: 600;
+ }
+ .title-url{
+ width:150px;overflow:hidden;text-overflow:ellipsis;margin-right: 10px
+ }
+
+ .main-font-color{
+ color: #b1b1b1;
+ font-size: 14px;
+ }
+ .check-bookmark{
+ position: absolute;
+ top: 0px;
+ left: 3px;
+ zoom: 120%;
+ }
diff --git a/ruoyi-ui/src/main.js b/ruoyi-ui/src/main.js
index 70d363e2b..3b2981618 100644
--- a/ruoyi-ui/src/main.js
+++ b/ruoyi-ui/src/main.js
@@ -27,6 +27,9 @@ import 'element-ui/lib/theme-chalk/index.css'
//媒体查詢
import '@/assets/styles/base.css'
+//elemntUI 自定义的主题目录
+import './assets/theme/index.css'
+
// 引入
import draggable from "vuedraggable";
diff --git a/ruoyi-ui/src/router/index.js b/ruoyi-ui/src/router/index.js
index c8c7a2c8f..81e148286 100644
--- a/ruoyi-ui/src/router/index.js
+++ b/ruoyi-ui/src/router/index.js
@@ -8,7 +8,7 @@ import Layout from '@/layout'
// 导航首页
-import bookmarkmenu from '@/views/bookmark/menu';
+// import bookmarkmenu from '@/views/bookmark/menu';
import index3 from '@/views/bookmark/index';
// import content from '../views/bookmark/content/index';
@@ -125,7 +125,7 @@ export const constantRoutes = [
}
,{
path: '/daohang',
- component: resolve => require(['../views/bookmark/menu/index.vue'], resolve),
+ component: resolve => require(['../views/daohang/index/index.vue'], resolve),
hidden: true,
},{
path: '/draggable',
diff --git a/ruoyi-ui/src/views/bookmark/bkuser/index.vue b/ruoyi-ui/src/views/bookmark/bkuser/index.vue
index 5c45920f1..6bcaad336 100644
--- a/ruoyi-ui/src/views/bookmark/bkuser/index.vue
+++ b/ruoyi-ui/src/views/bookmark/bkuser/index.vue
@@ -2,39 +2,131 @@
-
-
-
-
-
-
- 设置 · 王先生
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
-
-
+
+
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 王先生
+ 43278047
+
+
+
+
+ 设置
+
+
+
+
+
+
+
+
+ {{itme.name}}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
@@ -53,8 +145,49 @@
data: function () {
return {
property:1,
+ list:[
+ {
+ "id":1,
+ "name":"个人中心",
+ "path":"/bkindex",
+ "icon":"el-icon-user"
+ },{
+ "id":2,
+ "name":"系统设置",
+ "path":"/userSettings",
+ "icon":"el-icon-setting"
+ }
+ ,{
+ "id":3,
+ "name":"导入书签",
+ "path":"/importHtml",
+ "icon":"el-icon-upload2"
+ }
+ ,{
+ "id":4,
+ "name":"备份导出",
+ "path":"/exportHtml",
+ "icon":"el-icon-download"
+ }
+ ,{
+ "id":5,
+ "name":"更新日志",
+ "path":"/issueLog",
+ "icon":"el-icon-setting"
+ }
+ ,{
+ "id":6,
+ "name":"关于我们",
+ "path":"/aboutUs",
+ "icon":"el-icon-tickets"
+ }
+ ]
}
},
+ mounted(){
+ this.property=2;
+ // document.querySelector('body').setAttribute('style', 'background-color:#f6f5f4')
+ },
methods: {
goRouter(e){
@@ -119,11 +252,9 @@
}
},
- mounted() {
- document.querySelector('body').setAttribute('style', 'background-color:#f6f5f4')
- },
+
beforeDestroy() {
- document.querySelector('body').removeAttribute('style')
+ // document.querySelector('body').removeAttribute('style')
}
}
@@ -132,10 +263,86 @@
diff --git a/ruoyi-ui/src/views/bookmark/bkuser/tool/aboutUs.vue b/ruoyi-ui/src/views/bookmark/bkuser/tool/aboutUs.vue
index c210e79a0..fdd84500d 100644
--- a/ruoyi-ui/src/views/bookmark/bkuser/tool/aboutUs.vue
+++ b/ruoyi-ui/src/views/bookmark/bkuser/tool/aboutUs.vue
@@ -1,19 +1,12 @@
-
-
-
-
- 关于我们
-
-
+
+ 关于我们
+
-
+
+
-
-
-
-
-
-
-
-
- 个人信息
-
+
+
+ 用户配置
+
+
+
@@ -47,6 +46,9 @@
+
+ 用户配置
+
基本资料
@@ -60,9 +62,7 @@
-
-
@@ -97,5 +97,18 @@
}
};
+
diff --git a/ruoyi-ui/src/views/bookmark/bkuser/tool/exportHtml.vue b/ruoyi-ui/src/views/bookmark/bkuser/tool/exportHtml.vue
index 3647a34f3..d3ef3d62a 100644
--- a/ruoyi-ui/src/views/bookmark/bkuser/tool/exportHtml.vue
+++ b/ruoyi-ui/src/views/bookmark/bkuser/tool/exportHtml.vue
@@ -1,11 +1,10 @@
-
-
+
+ 备份/导出
+
-
- 备份/导出
-
+
@@ -43,9 +42,10 @@
-
-
+
+
+
-
diff --git a/ruoyi-ui/src/views/bookmark/bookmark/index.vue b/ruoyi-ui/src/views/bookmark/bookmark/index.vue
index 401d3c814..8642305ee 100644
--- a/ruoyi-ui/src/views/bookmark/bookmark/index.vue
+++ b/ruoyi-ui/src/views/bookmark/bookmark/index.vue
@@ -55,10 +55,13 @@
-
-
-
+
全部
+
书签
+
文本
+
图片
+
+
@@ -79,21 +82,19 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+ 默认模式
+ 简洁模式
+ 卡片模式
+
+
-
+
@@ -118,7 +119,7 @@
-
+
加载中...
没有更多了
@@ -192,10 +193,88 @@
+
+
+
+
+
+
+
+
+
+
+ {{tag.name}}
+
+
+
+ + 新增标签
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 确 定
+ 取 消
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
@@ -261,6 +340,8 @@
return {
//网页0 文本1 其他1
property:0,
+ //列表展示的模式
+ showPattern:0,
sousuo: '',
drawer: false,
// 遮罩层
@@ -269,6 +350,8 @@
title: "",
// 是否显示弹出层
open: false,
+ //是否弹窗收藏书签
+ addBookMakrUrlOpen:false,
busy: false,
showimg: false,
loading: false,
@@ -526,6 +609,15 @@
this.getBypropertyList(e);
+ },
+ /**切换显示 全部 网页 文本 其他**/
+ showPatternState(e) {
+ var that=this;
+ that.showPattern=e;
+ console.log("showPattern =" +e)
+ // //缓存状态
+ // that.$store.state.showPattern=e;
+
},
/** 转换书签菜单数据结构 */
normalizer(node) {
@@ -655,7 +747,7 @@
},
// 取消按钮
cancel() {
- this.open = false;
+ this.addBookMakrUrlOpen = false;
this.reset();
},
// 统一的表单重置
@@ -975,8 +1067,8 @@
/** 新增书签Url操作 */
addbookmarkurl: function () {
this.reset();
- this.getTreeselect();
- this.open = true;
+ // this.getTreeselect();
+ this.addBookMakrUrlOpen = true;
// getMenu(e.getAttribute("data-menuId")).then(response => {
// this.form = response.data;
@@ -986,7 +1078,9 @@
},
//关闭弹窗
closePopup: function() {
+ if (document.getElementById("popupDiv")){
document.getElementById("popupDiv").style.display = 'none';
+ }
}
},
@@ -1006,9 +1100,9 @@
/*}*/
.button-new-tag {
- margin-left: 10px;
- height: 32px;
- line-height: 30px;
+ margin-left: 5px;
+ height: 30px;
+ line-height: 28px;
padding-top: 0;
padding-bottom: 0;
}
@@ -1197,11 +1291,12 @@
.classification-click {
border-radius: 19px;
- background: #606c88; /* fallback for old browsers */
- background: -webkit-linear-gradient(to right, #3f4c6b, #606c88); /* Chrome 10-25, Safari 5.1-6 */
- background: linear-gradient(to right, #3f4c6b, #606c88); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
- color: #FFFFFF;
- box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.4)
+ /*background: #606c88; !* fallback for old browsers *!*/
+ /*background: -webkit-linear-gradient(to right, #3f4c6b, #606c88); !* Chrome 10-25, Safari 5.1-6 *!*/
+ /*background: linear-gradient(to right, #3f4c6b, #606c88); !* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ *!*/
+ background-color: #ffffff;
+ color: #a4a4a4;
+ box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.4)
}
.bookmark-list-tag {
@@ -1542,6 +1637,13 @@
color: #565656;
text-indent: 15px;
}
+.butWidth{
+ width: 100%;
+ margin-top: 10px;
+}
+ .addUrl-input{
+ margin-bottom: 13px;
+ }
diff --git a/ruoyi-ui/src/views/bookmark/ceshi/index.vue b/ruoyi-ui/src/views/bookmark/ceshi/index.vue
index 10a20e79d..4c216268e 100644
--- a/ruoyi-ui/src/views/bookmark/ceshi/index.vue
+++ b/ruoyi-ui/src/views/bookmark/ceshi/index.vue
@@ -1,21 +1,33 @@
-
-
-
-
-
- ⋮
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
![]()
+
+
标题
+
其实毛玻璃的模糊效果技术上比较简单，只是用到了 css 滤镜（filter）中的 blur 属性。但是要做一个好的毛玻璃效果，需要注意很多细节。其实毛玻璃的模糊效果技术上比较简单，只是用到了 css 滤镜（filter）中的 blur 属性。但是要做一个好的毛玻璃效果，需要注意很多细节。
+
其实毛玻璃的模糊效果技术上比较简单，只是用到了 css 滤镜（filter）中的 blur 属性。但是要做一个好的毛玻璃效果，需要注意很多细节。其实毛玻璃的模糊效果技术上比较简单，只是用到了 css 滤镜（filter）中的 blur 属性。但是要做一个好的毛玻璃效果，需要注意很多细节。
+
其实毛玻璃的模糊效果技术上比较简单，只是用到了 css 滤镜（filter）中的 blur 属性。但是要做一个好的毛玻璃效果，需要注意很多细节。其实毛玻璃的模糊效果技术上比较简单，只是用到了 css 滤镜（filter）中的 blur 属性。但是要做一个好的毛玻璃效果，需要注意很多细节。
+
其实毛玻璃的模糊效果技术上比较简单，只是用到了 css 滤镜（filter）中的 blur 属性。但是要做一个好的毛玻璃效果，需要注意很多细节。其实毛玻璃的模糊效果技术上比较简单，只是用到了 css 滤镜（filter）中的 blur 属性。但是要做一个好的毛玻璃效果，需要注意很多细节。
+
@@ -24,8 +36,18 @@
export default {
name: 'Dashboard',
+ data() {
+ return {
+ note: {
+ backgroundImage : "url('http://www.jq22.com/img/cs/500x300-9.png')",
+ backgroundRepeat:'no-repeat',
+ backgroundSize:'100% 100%',
+ },
+ imgSrc:'http://img.netbian.com/file/2020/0904/de2f77ed1090735b441ba5e4c2b460ca.jpg',
+ }
+ },
mounted () {
- this.dragControllerDiv();
+ // this.dragControllerDiv();
},
@@ -132,4 +154,46 @@
+
+ .background {
+ position: fixed;
+ }
+
+
+ .content {
+ width:800px;
+ position:relative;
+ margin:2rem auto;
+ padding:1em;
+ background:hsla(0,0%,100%,.25) border-box;
+ overflow:hidden;
+ border-radius:8px;
+ box-shadow:0 0 0 1px hsla(0,0%,100%,.3) inset,0 .5em 1em rgba(0,0,0,0.6);
+ text-shadow:0 1px 1px hsla(0,0%,100%,.3);
+ color: #ffffff;
+ }
+ .content::before {
+ content:'';
+ position:absolute;
+ top:0;
+ right:0;
+ bottom:0;
+ left:0;
+ margin:-30px;
+ z-index:-1;
+ -webkit-filter:blur(10px);
+ filter:blur(10px);
+ }
+
+
+
+ .note {
+ background: url("http://www.jq22.com/img/cs/500x300-9.png") no-repeat;
+ background-position: center;
+ height: 100%;
+ width: 100%;
+ background-size: cover;
+ position: fixed;
+ }
+
diff --git a/ruoyi-ui/src/views/bookmark/index/index.vue b/ruoyi-ui/src/views/bookmark/index/index.vue
index da0a7fa28..f41125859 100644
--- a/ruoyi-ui/src/views/bookmark/index/index.vue
+++ b/ruoyi-ui/src/views/bookmark/index/index.vue
@@ -871,7 +871,7 @@
property=0;
}
//如果当前的节点已经展开了 收缩的时候就不请求了
- if (!treeNode.open){
+ // if (!treeNode.open){
that.$router.push({
path: "/content",
query: {
@@ -880,15 +880,15 @@
t:Date.now(),
}
})
- }
+ // }
$("." + treeNode.tId + "_sz").unbind().remove();
var switchObjspan = $("#" + treeNode.tId + "_span");
var editStr = "
" + treeNode.bookmarkCount + "";
switchObjspan.after(editStr);
//展开当前菜单
- var zTree = $.fn.zTree.getZTreeObj("treeDemo");
- zTree.expandNode(treeNode);
+ // var zTree = $.fn.zTree.getZTreeObj("treeDemo");
+ // zTree.expandNode(treeNode);
// console.log("当前节点已经展开:"+treeNode.open)
diff --git a/ruoyi-ui/src/views/bookmark/menu/index.vue b/ruoyi-ui/src/views/bookmark/menu/index.vue
deleted file mode 100644
index f66aa3940..000000000
--- a/ruoyi-ui/src/views/bookmark/menu/index.vue
+++ /dev/null
@@ -1,339 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- ![]()
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
![]()
{{iconlist.title}}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/ruoyi-ui/src/views/bookmark/tag/usertag.vue b/ruoyi-ui/src/views/bookmark/tag/usertag.vue
index f290708ad..c0031ff9d 100644
--- a/ruoyi-ui/src/views/bookmark/tag/usertag.vue
+++ b/ruoyi-ui/src/views/bookmark/tag/usertag.vue
@@ -52,7 +52,7 @@
{{item.name}}
-->
# {{item.name}}
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 黄金糕
+ 狮子头
+ 螺蛳粉
+ 双皮奶
+ 蚵仔煎
+
+
+
+
+
+ 最新
+
+ 热度
+
+
+
+
+
+ {{'阿达瓦发我的发我法师法师法师法师法挖的挖的挖的挖的挖的挖的挖列表内容 ' + o }}
+
+
+
#java #php 我是个簡介
+
22小时前
+
+ 22
+
+
+
+
+
+
+
+ 常用导航
+
+
+ 旧故
+
+ 草木
+
+
+
+
+
+
+
+
![]()
+
+
+
{{item.title }}
+
我是个简介我是个简介我是个简介我是个简介我是个简介我是个简介我是个简介我是个简介我是个简介我是个简介我是个简介
+
+
+
+
+
+
+