Song/xkrs_ms
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

新增支持内嵌套打开网页

Browse Source
This commit is contained in:
WangHao 2020-10-08 14:18:42 +08:00
parent f79ef13ddf
commit d6692f242b
12 changed files with 786 additions and 606 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
ruoyi-admin/src/main/java/com/ruoyi/web/controller/yunbookmark/BrowserController.java
View File

@ -9,7 +9,7 @@ import com.ruoyi.bookmark.service.ISqMenuService;
import com.ruoyi.common.core.controller.BaseController; import com.ruoyi.common.core.controller.BaseController;
import com.ruoyi.common.core.domain.AjaxResult; import com.ruoyi.common.core.domain.AjaxResult;
import com.ruoyi.common.core.domain.entity.SysUser; import com.ruoyi.common.core.domain.entity.SysUser;
import com.ruoyi.common.utils.BookmarkHtml.ImportHtml; import com.ruoyi.common.utils.bookmarkhtml.ImportHtml;
import com.ruoyi.common.utils.StringUtils; import com.ruoyi.common.utils.StringUtils;
import org.jsoup.HttpStatusException; import org.jsoup.HttpStatusException;
import org.slf4j.Logger; import org.slf4j.Logger;
@ -22,17 +22,14 @@ import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController; import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.multipart.MultipartFile; import org.springframework.web.multipart.MultipartFile;
import javax.net.ssl.SSLHandshakeException; import javax.net.ssl.SSLHandshakeException;
import java.net.MalformedURLException;
import java.net.URL; import java.net.URL;
import java.text.SimpleDateFormat;
import java.util.Date; import java.util.Date;
import java.util.List;
import java.util.Map; import java.util.Map;
import java.util.Map.Entry; import java.util.Map.Entry;
/** /**
* @Auther: Wang * @auther: Wang
* @Date: * @Date:
* 功能描述: 导入书签 导出书签 * 功能描述: 导入书签 导出书签
*/ */

2
ruoyi-admin/src/main/java/com/ruoyi/web/controller/yunbookmark/SqBookmarkController.java
View File

@ -8,7 +8,7 @@ import java.util.List;
import com.ruoyi.bookmark.domain.SqBookmark; import com.ruoyi.bookmark.domain.SqBookmark;
import com.ruoyi.bookmark.service.ISqBookmarkService; import com.ruoyi.bookmark.service.ISqBookmarkService;
import com.ruoyi.common.core.domain.entity.SysUser; import com.ruoyi.common.core.domain.entity.SysUser;
import com.ruoyi.common.utils.BookmarkHtml.ImportHtml; import com.ruoyi.common.utils.bookmarkhtml.ImportHtml;
import org.slf4j.Logger; import org.slf4j.Logger;
import org.slf4j.LoggerFactory; import org.slf4j.LoggerFactory;
import org.springframework.security.access.prepost.PreAuthorize; import org.springframework.security.access.prepost.PreAuthorize;

8
ruoyi-admin/src/main/java/com/ruoyi/web/controller/yunbookmark/SqMenuController.java
View File

@ -186,10 +186,10 @@ public class SqMenuController extends BaseController
} }
} }
// /** /**
// * 批量更新书签的数量 * 批量更新书签的数量
// */ */
//
@RequestMapping("/bookmarkcount/{menuId}") @RequestMapping("/bookmarkcount/{menuId}")
public AjaxResult bookmarkcount(@PathVariable Long menuId) public AjaxResult bookmarkcount(@PathVariable Long menuId)
{ {

2
ruoyi-admin/src/main/java/com/ruoyi/web/test/controller/BaseSpringBootTest.java
View File

@ -13,7 +13,7 @@ import org.springframework.test.context.web.WebAppConfiguration;
/** /**
* @Auther: Wang * @auther: Wang
* @Date: 2020/08/08 19:10 * @Date: 2020/08/08 19:10
* 功能描述: * 功能描述:
*/ */

2
ruoyi-common/src/main/java/com/ruoyi/common/utils/BookmarkHtml/Const.java → ruoyi-common/src/main/java/com/ruoyi/common/utils/bookmarkhtml/Const.java
View File

@ -1,4 +1,4 @@
package com.ruoyi.common.utils.BookmarkHtml; package com.ruoyi.common.utils.bookmarkhtml;
import org.springframework.stereotype.Component; import org.springframework.stereotype.Component;

3
ruoyi-common/src/main/java/com/ruoyi/common/utils/BookmarkHtml/ImportHtml.java → ruoyi-common/src/main/java/com/ruoyi/common/utils/bookmarkhtml/ImportHtml.java
View File

@ -1,4 +1,4 @@
package com.ruoyi.common.utils.BookmarkHtml; package com.ruoyi.common.utils.bookmarkhtml;
import com.ruoyi.common.utils.StringUtils; import com.ruoyi.common.utils.StringUtils;
@ -10,7 +10,6 @@ import org.jsoup.select.Elements;
import org.slf4j.Logger; import org.slf4j.Logger;
import org.slf4j.LoggerFactory; import org.slf4j.LoggerFactory;
import java.io.File;
import java.io.InputStream; import java.io.InputStream;
import java.net.MalformedURLException; import java.net.MalformedURLException;
import java.net.URL; import java.net.URL;

6
ruoyi-ui/src/assets/styles/base.css
View File

@ -2,7 +2,7 @@
@media screen and (max-width: 2920px) { @media screen and (max-width: 2920px) {
/*@media screen and (max-width: 1920px) {*/ /*@media screen and (max-width: 1920px) {*/
.sousouleft-switch{ .sousouleft-switch{
display: none; display: none!important;
} }
.dropdownList{ .dropdownList{
font-size: 22px!important; font-size: 22px!important;
@ -50,10 +50,10 @@
display: none; display: none;
} }
.sousouleft-switch{ .sousouleft-switch{
display: block; display: block!important;
} }
.sousou-leftico{ .sousou-leftico{
display: none; display: none!important;
} }
.sousouright-icon{ .sousouright-icon{

100
ruoyi-ui/src/components/BookmarkList/index.vue Normal file
View File

@ -0,0 +1,100 @@
<template>
<div>
<div v-for="bm in bookmarkList" class="bookmark" :data-id="bm.id" @click="windowurl(bm.url,bm.bookmarkId)">
<div class="bookmark-item">
<span class="title-icon">
<img :ng-src="'https://favicon.lucq.fun/?url=http://'+bm.urls"
:src="'https://favicon.lucq.fun/?url=http://'+bm.urls"
onerror="this.src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQEAYAAABPYyMiAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAgY0hSTQAAeiYAAICEAAD6AAAAgOgAAHUwAADqYAAAOpgAABdwnLpRPAAAAAZiS0dEAAAAAAAA+UO7fwAAAAlwSFlzAAAASAAAAEgARslrPgAAAmVJREFUSMftlG1IU2EUx8+5jRHzg+5OiD64WTBBjSY5ZybUJMaMiIUICUKFIGmoIIogYWKFBmtDxN1tBKIWvlS6SR+iLFDBXqSMgmzbvQ7fkAjcINmQ5u7pQwyCiOvWx/p/fPj9/5znnPM8AP+VolRTjjHhTlmZipzEk9GYao4sVaMYxXp62NgIdpLBCuLP05mZZHOYZA3p5KgMjBcUwCmw4PfVVYiBGmbW1zMzOU4QCgtTvdAeRESEyNZyJbx+dDTjVv/9YFSjSScnfabsbPYMF+AbxsYS3F5TfwPZAacpMNfUBEAljK24mMJwlLIUClTAdfwok9FXWBTtc3Phzqv7c/RWa8KnrHZM8VltbRjC92AxGkEPRpSJInjJQPpIBJoZC6nn50M19dM5J/v6/lhRxgXXDX9Qp1POcmHh2sTEQbfbvVmrUCTbr4RPaeMe8Q0eTyI36VkrW50mftjrPWCyDn9oSUuTdj4Y/1Qpl7NdzkNC98iIqsIxHdQVFaU8eWW1U1guLy1lr3Acr3O7pXi227EhDLpcCZ8UL/kK8LIYjxtDIRhEP8xGIlI8bcAKvY3FGB/zYvf81pYUL/0PvGTKoTUvjzbgCx5ZWlJq3a5lQa1Ge3yTWnp64ASYqVcUoXn3Jtja2/EpRtHj89FF8Tb25ufDOwCo8/lSL0BF/eDPzcVXeA7WDAa6J9rES1VVdJqx41JHBwCE8BgA3JU9B+3AACziMwjv7MAaPQb/wgIAnP2rDpCWtpkncjm+Ro34bWgo3FkX0O6bnARARCT6hSR6YzazXa7DfLyigo7TNtObxNb/s/oB7V8JFvW/8IQAAAAldEVYdGRhdGU6Y3JlYXRlADIwMjAtMDItMDJUMTg6MTE6NTgrMDg6MDCoc6tpAAAAJXRFWHRkYXRlOm1vZGlmeQAyMDIwLTAyLTAyVDE4OjExOjU4KzA4OjAw2S4T1QAAAGd0RVh0c3ZnOmJhc2UtdXJpAGZpbGU6Ly8vaG9tZS9hZG1pbi9pY29uLWZvbnQvdG1wL2ljb25fNWhyOG55Nmo1bWMvamluZ2RpYW5hbmxpX2tvbmd3dWppYW94aW5nX3Nob3VjYW5nLnN2Z4/vilwAAAAASUVORK5CYII='"
alt="" ng-show="bm.urls"/>
</span>
<span class="bookmark-title">
{{bm.title}}
</span>
<span class="bookmark-time">2020-10-10</span>
</div>
</div>
</div>
</template>
<script>
export default {
components: {},
props: {
bookmarkList: Array,
},
data: function () {
return {
}
},
methods: {
windowurl(A, B) {
this.$emit('on-windowurl', A, B)
}
}
}
</script>
<style scoped>
.bookmarklist {
}
.bookmark-item {
display: flex;
height: 24px;
font-size: 13px;
overflow: hidden;
}
.bookmark {
position: relative;
padding: 15px 20px;
border-top: 1px solid #e0e1e5;
overflow: hidden;
line-height: 24px;
}
.bookmark:hover {
background-color: #D4D4D4;
}
.title-icon img {
width: 15px;
height: 15px;
}
.title-icon {
display: inline-flex;
align-items: center;
}
.bookmark-title {
display: inline-block;
margin-left: 10px;
color: #393939;
flex: 1;
-webkit-flex: 1;
white-space: nowrap;
text-overflow: ellipsis;
-webkit-text-overflow: ellipsis;
overflow: hidden;
position: relative;
}
.bookmark-time {
display: block;
color: #c2c2c2;
margin-right: 10px;
}
</style>

766
ruoyi-ui/src/views/bookmark/bookmark/index.vue
View File

@ -1,217 +1,313 @@
<template> <template>
<div> <div>
<div class="filter-tbar"> <el-container class="isbookmarkContainer">
<div class="filter-classification"> <el-aside class="isBookmarkAside" >
<div class="classification " @click="showopen(0)"><span>网页</span></div> <el-header class="header-sousou">
<div class="classification" @click="showopen(1)"><span>文本</span></div> <div class="sousou-left">
<div class="classification" @click="showopen(2)"><span>其他</span></div> <div class="sousouleft-switch" @click="drawer = true"><i class="el-icon-s-unfold"/></div>
<!-- <div class="classification" @click="showopen(3)"><span>其他</span></div>--> <div class="sousou-leftico" @click="drawer = true"><img
</div> src="https://favicon.lucq.fun/?url=https://www.baidu.com"/></div>
<div class="setUpThe"> </div>
<div class="filter-content"> <div class="sousou-input">
<el-dropdown trigger="hover" size="small" @command="handleCommand"> <el-input slot="reference" @keyup.enter.native="gosousuo" placeholder="请输入要查找的关键词" v-model="sousuo"
<div class="el-dropdown-link dropdownList"> size="small">
<i class="el-icon-document-checked "></i> <span>排序</span> <i slot="prefix" class="el-input__icon el-icon-search"></i>
</div> </el-input>
<el-dropdown-menu slot="dropdown" class="filter-sort-dropdown"> </div>
<el-dropdown-item class="filter-item" command="0"><i class="el-icon-bottom"></i>按时间排序(正)
</el-dropdown-item> <div class="sousouright-icon">
<el-dropdown-item class="filter-item" command="1"><i class="el-icon-bottom"></i>按时间排序(反) <el-badge :value="5" :max="99" class="item"><i class="el-icon-message-solid" style="font-size: 17px;"></i>
</el-dropdown-item> </el-badge>
<el-dropdown-item class="filter-item" command="2"><i class="el-icon-bottom"></i>按标题A-Z排序(正) </div>
</el-dropdown-item>
<el-dropdown-item class="filter-item" command="3"><i class="el-icon-bottom"></i>按标题A-Z排序(反) <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;"/>
</span>
<el-dropdown-menu slot="dropdown" class="sq-dropdown">
<el-dropdown-item class="filter-item" icon="el-icon-plus" @click.native="addbookmarkurl">添加连接
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item class="filter-item" icon="el-icon-plus" command="b">添加文本</el-dropdown-item>
<el-dropdown-item class="filter-item" icon="el-icon-plus" command="d">导入书签</el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
</el-dropdown> </el-dropdown>
</div> </div>
<div class="filter-content">
<el-dropdown trigger="hover" size="small">
<div class="el-dropdown-link dropdownList">
<i class="el-icon-tickets "></i> <span>列表</span>
</div>
<el-dropdown-menu slot="dropdown" class="filter-sort-dropdown">
<el-dropdown-item class="filter-item"><i class="el-icon-bottom"></i>按时间排序(正)</el-dropdown-item>
<el-dropdown-item class="filter-item"><i class="el-icon-bottom"></i>按时间排序(反)</el-dropdown-item>
<el-dropdown-item class="filter-item"><i class="el-icon-bottom"></i>按字母A-Z排序</el-dropdown-item>
<el-dropdown-item class="filter-item"><i class="el-icon-bottom"></i>按字母A-Z排序</el-dropdown-item>
<el-dropdown-item class="filter-item"><i class="el-icon-bottom"></i>按网站A-Z排序</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
<!-- <div class="filter-content">--> <div class="header-list">
<!-- <el-dropdown trigger="hover" size="small">--> <!-- <el-dropdown trigger="click" size="small" :hide-on-click="false">-->
<!-- <div class="el-dropdown-link dropdownList">--> <!-- <span class="el-dropdown-link">-->
<!-- <i class="el-icon-setting "></i> <span>设置</span>--> <el-avatar :size="28"
<!-- </div>--> src="https://up.raindrop.io/collection/templates/social-media-logos-6/97social.png"></el-avatar>
<!-- <el-dropdown-menu slot="dropdown" class="filter-sort-dropdown">--> <!-- </span>-->
<!-- <el-dropdown-item class="filter-item"><i class="el-icon-bottom"></i>编辑</el-dropdown-item>--> <!-- <el-dropdown-menu slot="dropdown" class="sq-dropdown">-->
<!-- <el-dropdown-item class="filter-item"><i class="el-icon-bottom"></i>批量处理</el-dropdown-item>--> <!-- <el-dropdown-item class="filter-item" icon="el-icon-plus" command="a">外观显示</el-dropdown-item>-->
<!-- <el-dropdown-item class="filter-item"><i class="el-icon-bottom"></i>排序</el-dropdown-item>--> <!-- <el-dropdown-item class="filter-item" icon="el-icon-plus" command="b">用户中心</el-dropdown-item>-->
<!-- <el-dropdown-item class="filter-item"><i class="el-icon-bottom"></i>按网站A-Z排序</el-dropdown-item>--> <!-- <el-dropdown-item class="filter-item" icon="el-icon-plus" command="d">建议反馈</el-dropdown-item>-->
<!-- <el-dropdown-item class="filter-item" icon="el-icon-plus" command="e">退出登录</el-dropdown-item>-->
<!-- </el-dropdown-menu>--> <!-- </el-dropdown-menu>-->
<!-- </el-dropdown>--> <!-- </el-dropdown>-->
<!-- </div>--> </div>
</div> </el-header>
</div>
<div v-if="queryParams.sousuo!=''" class="sousuoContent">
<i class="el-icon-success"></i>
<!-- <span> 当前搜索的内容是:{{queryParams.sousuo}}</span>-->
<span> 共为您找到约{{total}}个结果</span>
</div>
<div class="nullbookmark" v-if="showimg">
<div class="nullbookmark-img">
</div>
<div style="color: #000000" class="nullbookmark-text">
此目录还未添加书签
</div>
</div>
<div class="bookmarklist" :style="datalist" infinite-scroll-distance="10" v-loading="loading" v-if="showbookmark"
v-infinite-scroll="load"
infinite-scroll-disabled="disabled" style="overflow:auto;" infinite-scroll-immediate="false">
<el-row>
<!-- <hr class="bookamrk-hr" v-if="!queryParams.sousuo!=''"/>--> <div class="filter-tbar">
<el-col :span="24" v-for="bm in bookmarkList"> <div class="filter-classification">
<div class="editBookamrk "> <div class="classification " @click="showopen(0)"><span>网页</span></div>
<div class="editlist"> <div class="classification" @click="showopen(1)"><span>文本</span></div>
<div> <div class="classification" @click="showopen(2)"><span>其他</span></div>
<el-button plain size="small" @click="handleUpdate(bm.bookmarkId)">修改</el-button> <!-- <div class="classification" @click="showopen(3)"><span>其他</span></div>-->
</div>
<div class="setUpThe">
<div class="filter-content">
<el-dropdown trigger="hover" size="small" @command="handleCommand">
<div class="el-dropdown-link dropdownList">
<i class="el-icon-document-checked "></i>
<!-- <span>排序</span>-->
</div>
<el-dropdown-menu slot="dropdown" class="filter-sort-dropdown">
<el-dropdown-item class="filter-item" command="0"><i class="el-icon-bottom"></i>按时间排序(正)
</el-dropdown-item>
<el-dropdown-item class="filter-item" command="1"><i class="el-icon-bottom"></i>按时间排序(反)
</el-dropdown-item>
<el-dropdown-item class="filter-item" command="2"><i class="el-icon-bottom"></i>按标题A-Z排序(正)
</el-dropdown-item>
<el-dropdown-item class="filter-item" command="3"><i class="el-icon-bottom"></i>按标题A-Z排序(反)
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div> </div>
<div> <div class="filter-content">
<el-button plain size="small" @click="handleDelete(bm.bookmarkId)">删除</el-button> <el-dropdown trigger="hover" size="small">
</div> <div class="el-dropdown-link dropdownList">
<div> <i class="el-icon-tickets "></i>
<el-button plain size="small">笔记</el-button> <!-- <span>列表</span>-->
</div> </div>
<div> <el-dropdown-menu slot="dropdown" class="filter-sort-dropdown">
<el-button plain size="small">分享</el-button> <el-dropdown-item class="filter-item"><i class="el-icon-bottom"></i>按时间排序(正)</el-dropdown-item>
<el-dropdown-item class="filter-item"><i class="el-icon-bottom"></i>按时间排序(反)</el-dropdown-item>
<el-dropdown-item class="filter-item"><i class="el-icon-bottom"></i>按字母A-Z排序</el-dropdown-item>
<el-dropdown-item class="filter-item"><i class="el-icon-bottom"></i>按字母A-Z排序</el-dropdown-item>
<el-dropdown-item class="filter-item"><i class="el-icon-bottom"></i>按网站A-Z排序</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div> </div>
<!-- <div class="filter-content">-->
<!-- <el-dropdown trigger="hover" size="small">-->
<!-- <div class="el-dropdown-link dropdownList">-->
<!-- <i class="el-icon-setting "></i> <span>设置</span>-->
<!-- </div>-->
<!-- <el-dropdown-menu slot="dropdown" class="filter-sort-dropdown">-->
<!-- <el-dropdown-item class="filter-item"><i class="el-icon-bottom"></i>编辑</el-dropdown-item>-->
<!-- <el-dropdown-item class="filter-item"><i class="el-icon-bottom"></i>批量处理</el-dropdown-item>-->
<!-- <el-dropdown-item class="filter-item"><i class="el-icon-bottom"></i>排序</el-dropdown-item>-->
<!-- <el-dropdown-item class="filter-item"><i class="el-icon-bottom"></i>按网站A-Z排序</el-dropdown-item>-->
<!-- </el-dropdown-menu>-->
<!-- </el-dropdown>-->
<!-- </div>-->
</div> </div>
</div> </div>
<div v-if="queryParams.sousuo!=''" class="sousuoContent">
<i class="el-icon-success"></i>
<!-- <span> 当前搜索的内容是:{{queryParams.sousuo}}</span>-->
<span> 共为您找到约{{total}}个结果</span>
</div>
<div class="bookmark " :data-id="bm.id" @click="windowurl(bm.url,bm.bookmarkId)"> <div class="nullbookmark" v-if="showimg">
<p class="bookmark-title" v-if="highlighted"><span v-html="highLight(bm.title,queryParams.sousuo)"/></p> <div class="nullbookmark-img">
<p class="bookmark-title" v-if="!highlighted">{{bm.title}}</p>
<div class="">
<p class="description" v-if="highlighted"><span v-html="highLight(bm.description,queryParams.sousuo)"/>
</p>
<p class="description" v-if="!highlighted">{{bm.description}}</p>
</div> </div>
<div class="info-wrap"> <div style="color: #000000" class="nullbookmark-text">
<div class="info"> 此目录还未添加书签
<div class="bookmark-icon">
<!-- <img :err-src='bm.icon' :ng-src="bm.icon" :src="bm.icon" />-->
<img :ng-src="'https://favicon.lucq.fun/?url=http://'+bm.urls"
:src="'https://favicon.lucq.fun/?url=http://'+bm.urls"
onerror="this.src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQEAYAAABPYyMiAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAgY0hSTQAAeiYAAICEAAD6AAAAgOgAAHUwAADqYAAAOpgAABdwnLpRPAAAAAZiS0dEAAAAAAAA+UO7fwAAAAlwSFlzAAAASAAAAEgARslrPgAAAmVJREFUSMftlG1IU2EUx8+5jRHzg+5OiD64WTBBjSY5ZybUJMaMiIUICUKFIGmoIIogYWKFBmtDxN1tBKIWvlS6SR+iLFDBXqSMgmzbvQ7fkAjcINmQ5u7pQwyCiOvWx/p/fPj9/5znnPM8AP+VolRTjjHhTlmZipzEk9GYao4sVaMYxXp62NgIdpLBCuLP05mZZHOYZA3p5KgMjBcUwCmw4PfVVYiBGmbW1zMzOU4QCgtTvdAeRESEyNZyJbx+dDTjVv/9YFSjSScnfabsbPYMF+AbxsYS3F5TfwPZAacpMNfUBEAljK24mMJwlLIUClTAdfwok9FXWBTtc3Phzqv7c/RWa8KnrHZM8VltbRjC92AxGkEPRpSJInjJQPpIBJoZC6nn50M19dM5J/v6/lhRxgXXDX9Qp1POcmHh2sTEQbfbvVmrUCTbr4RPaeMe8Q0eTyI36VkrW50mftjrPWCyDn9oSUuTdj4Y/1Qpl7NdzkNC98iIqsIxHdQVFaU8eWW1U1guLy1lr3Acr3O7pXi227EhDLpcCZ8UL/kK8LIYjxtDIRhEP8xGIlI8bcAKvY3FGB/zYvf81pYUL/0PvGTKoTUvjzbgCx5ZWlJq3a5lQa1Ge3yTWnp64ASYqVcUoXn3Jtja2/EpRtHj89FF8Tb25ufDOwCo8/lSL0BF/eDPzcVXeA7WDAa6J9rES1VVdJqx41JHBwCE8BgA3JU9B+3AACziMwjv7MAaPQb/wgIAnP2rDpCWtpkncjm+Ro34bWgo3FkX0O6bnARARCT6hSR6YzazXa7DfLyigo7TNtObxNb/s/oB7V8JFvW/8IQAAAAldEVYdGRhdGU6Y3JlYXRlADIwMjAtMDItMDJUMTg6MTE6NTgrMDg6MDCoc6tpAAAAJXRFWHRkYXRlOm1vZGlmeQAyMDIwLTAyLTAyVDE4OjExOjU4KzA4OjAw2S4T1QAAAGd0RVh0c3ZnOmJhc2UtdXJpAGZpbGU6Ly8vaG9tZS9hZG1pbi9pY29uLWZvbnQvdG1wL2ljb25fNWhyOG55Nmo1bWMvamluZ2RpYW5hbmxpX2tvbmd3dWppYW94aW5nX3Nob3VjYW5nLnN2Z4/vilwAAAAASUVORK5CYII='"
alt="" ng-show="bm.urls">
</div>
<div class="bookmark-official">{{bm.urls}}&nbsp;·&nbsp;</div>
<div class="bookmark-time">{{bm.createTime|changeTime}}</div>
<div class="bookmark-time" v-for="t in bm.sqTags">
<el-tag class="bookmark-list-tag" data-bookmarkId="t.bookmarkId" data-tagId="t.tagId" size="mini">
{{t.name}}
</el-tag>
</div>
</div>
</div> </div>
</div> </div>
</el-col>
</el-row> <!-- 默认展示-->
<p v-if="listloading" class="listhint"><i class="el-icon-loading"></i>加载中...</p> <!-- <div class="bookmarklist" :style="datalist" infinite-scroll-distance="10" v-loading="loading"-->
<p v-if="listnoMore" class="listhint">没有更多了</p> <!-- v-if="showbookmark"-->
</div> <!-- v-infinite-scroll="load"-->
<!-- infinite-scroll-disabled="disabled" style="overflow:auto;" infinite-scroll-immediate="false">-->
<!-- <el-row>-->
<!-- &lt;!&ndash; <hr class="bookamrk-hr" v-if="!queryParams.sousuo!=''"/>&ndash;&gt;-->
<!-- <el-col :span="24" v-for="bm in bookmarkList">-->
<!-- <div class="editBookamrk ">-->
<!-- <div class="editlist">-->
<!-- <div>-->
<!-- <el-button plain size="small" @click="handleUpdate(bm.bookmarkId)">修改</el-button>-->
<!-- </div>-->
<!-- <div>-->
<!-- <el-button plain size="small" @click="handleDelete(bm.bookmarkId)">删除</el-button>-->
<!-- </div>-->
<!-- <div>-->
<!-- <el-button plain size="small">笔记</el-button>-->
<!-- </div>-->
<!-- <div>-->
<!-- <el-button plain size="small">分享</el-button>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- 添加或修改书签管理对话框 --> <!-- <div class="bookmark " :data-id="bm.id" @click="windowurl(bm.url,bm.bookmarkId)">-->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body> <!-- <p class="bookmark-title" v-if="highlighted"><span v-html="highLight(bm.title,queryParams.sousuo)"/>-->
<el-form ref="form" :model="form" :rules="rules" label-width="80px"> <!-- </p>-->
<!-- <p class="bookmark-title" v-if="!highlighted">{{bm.title}}</p>-->
<!-- <div class="">-->
<!-- <p class="description" v-if="highlighted"><span-->
<!-- v-html="highLight(bm.description,queryParams.sousuo)"/>-->
<!-- </p>-->
<!-- <p class="description" v-if="!highlighted">{{bm.description}}</p>-->
<!-- </div>-->
<!-- <div class="info-wrap">-->
<!-- <div class="info">-->
<!-- <div class="bookmark-icon">-->
<!-- &lt;!&ndash; <img :err-src='bm.icon' :ng-src="bm.icon" :src="bm.icon" />&ndash;&gt;-->
<!-- <img :ng-src="'https://favicon.lucq.fun/?url=http://'+bm.urls"-->
<!-- :src="'https://favicon.lucq.fun/?url=http://'+bm.urls"-->
<!-- onerror="this.src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQEAYAAABPYyMiAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAgY0hSTQAAeiYAAICEAAD6AAAAgOgAAHUwAADqYAAAOpgAABdwnLpRPAAAAAZiS0dEAAAAAAAA+UO7fwAAAAlwSFlzAAAASAAAAEgARslrPgAAAmVJREFUSMftlG1IU2EUx8+5jRHzg+5OiD64WTBBjSY5ZybUJMaMiIUICUKFIGmoIIogYWKFBmtDxN1tBKIWvlS6SR+iLFDBXqSMgmzbvQ7fkAjcINmQ5u7pQwyCiOvWx/p/fPj9/5znnPM8AP+VolRTjjHhTlmZipzEk9GYao4sVaMYxXp62NgIdpLBCuLP05mZZHOYZA3p5KgMjBcUwCmw4PfVVYiBGmbW1zMzOU4QCgtTvdAeRESEyNZyJbx+dDTjVv/9YFSjSScnfabsbPYMF+AbxsYS3F5TfwPZAacpMNfUBEAljK24mMJwlLIUClTAdfwok9FXWBTtc3Phzqv7c/RWa8KnrHZM8VltbRjC92AxGkEPRpSJInjJQPpIBJoZC6nn50M19dM5J/v6/lhRxgXXDX9Qp1POcmHh2sTEQbfbvVmrUCTbr4RPaeMe8Q0eTyI36VkrW50mftjrPWCyDn9oSUuTdj4Y/1Qpl7NdzkNC98iIqsIxHdQVFaU8eWW1U1guLy1lr3Acr3O7pXi227EhDLpcCZ8UL/kK8LIYjxtDIRhEP8xGIlI8bcAKvY3FGB/zYvf81pYUL/0PvGTKoTUvjzbgCx5ZWlJq3a5lQa1Ge3yTWnp64ASYqVcUoXn3Jtja2/EpRtHj89FF8Tb25ufDOwCo8/lSL0BF/eDPzcVXeA7WDAa6J9rES1VVdJqx41JHBwCE8BgA3JU9B+3AACziMwjv7MAaPQb/wgIAnP2rDpCWtpkncjm+Ro34bWgo3FkX0O6bnARARCT6hSR6YzazXa7DfLyigo7TNtObxNb/s/oB7V8JFvW/8IQAAAAldEVYdGRhdGU6Y3JlYXRlADIwMjAtMDItMDJUMTg6MTE6NTgrMDg6MDCoc6tpAAAAJXRFWHRkYXRlOm1vZGlmeQAyMDIwLTAyLTAyVDE4OjExOjU4KzA4OjAw2S4T1QAAAGd0RVh0c3ZnOmJhc2UtdXJpAGZpbGU6Ly8vaG9tZS9hZG1pbi9pY29uLWZvbnQvdG1wL2ljb25fNWhyOG55Nmo1bWMvamluZ2RpYW5hbmxpX2tvbmd3dWppYW94aW5nX3Nob3VjYW5nLnN2Z4/vilwAAAAASUVORK5CYII='"-->
<!-- alt="" ng-show="bm.urls">-->
<!-- </div>-->
<!-- <div class="bookmark-official">{{bm.urls}}&nbsp;·&nbsp;</div>-->
<!-- <div class="bookmark-time">{{bm.createTime|changeTime}}</div>-->
<!-- <div class="bookmark-time" v-for="t in bm.sqTags">-->
<!-- <el-tag class="bookmark-list-tag" data-bookmarkId="t.bookmarkId" data-tagId="t.tagId"-->
<!-- size="mini">-->
<!-- {{t.name}}-->
<!-- </el-tag>-->
<el-form-item label="书签标题" prop="title"> <!-- </div>-->
<el-input v-model="form.title" placeholder="请输入书签标题"/>
</el-form-item>
<el-form-item label="书签地址" prop="url">
<el-input v-model="form.url" placeholder="请输入书签地址"/>
</el-form-item>
<el-form-item label="书签描述" prop="description">
<el-input v-model="form.description" type="textarea" placeholder="请输入书签描述" run dev
:autosize="{minRows: 3, maxRows:4}" :style="{width: '100%'}"></el-input>
</el-form-item>
<el-form-item label="所属目录" prop="menuId">
<el-input v-model="form.menuId" placeholder="请选择上级目录"/>
</el-form-item>
<el-form-item label="书签标签:" prop="label"> <!-- </div>-->
<el-tag <!-- </div>-->
class="bookmarktag" <!-- </div>-->
v-for="tag in form.sqTags" <!-- </el-col>-->
:key="tag.tagId"
closable
type="success"
:disable-transitions="false"
@close="taghandleClose(tag.tagId)"
v-if="tag.name!='TAGDELETE'"
>
{{tag.name}}
</el-tag>
<el-input
class="input-new-tag"
v-if="inputVisible"
v-model="inputValue"
ref="saveTagInput"
size="small"
@keyup.enter.native="handleInputConfirm"
@blur="handleInputConfirm"
>
</el-input>
<el-button v-else class="button-new-tag" size="small" @click="showInput">+ 新增标签</el-button>
</el-form-item> <!-- </el-row>-->
<!-- <p v-if="listloading" class="listhint"><i class="el-icon-loading"></i>加载中...</p>-->
<!-- <p v-if="listnoMore" class="listhint">没有更多了</p>-->
<!-- </div>-->
<!-- 三窗口展示-->
<div class="bookmarklist" :style="datalist" infinite-scroll-distance="10" v-loading="loading" v-if="showbookmark"
v-infinite-scroll="load"
infinite-scroll-disabled="disabled" style="overflow:auto;" infinite-scroll-immediate="false">
<BookmarkOne @on-windowurl="windowurl" :listloading="listloading" :loading="loading" :bookmarkList="bookmarkList"></BookmarkOne>
<p v-if="listloading" class="listhint"><i class="el-icon-loading"></i>加载中...</p>
<p v-if="listnoMore" class="listhint">没有更多了</p>
</div>
<!-- 添加或修改书签管理对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="书签标题" prop="title">
<el-input v-model="form.title" placeholder="请输入书签标题"/>
</el-form-item>
<el-form-item label="书签地址" prop="url">
<el-input v-model="form.url" placeholder="请输入书签地址"/>
</el-form-item>
<el-form-item label="书签描述" prop="description">
<el-input v-model="form.description" type="textarea" placeholder="请输入书签描述" run dev
:autosize="{minRows: 3, maxRows:4}" :style="{width: '100%'}"></el-input>
</el-form-item>
<el-form-item prop="menuId">
<div class="labelname">请选择上级目录</div>
<treeselect class="menutreeselect" v-model="form.parentId" :options="menuOptions"
:normalizer="normalizer"/>
</el-form-item>
<el-form-item label="书签标签:" prop="label">
<el-tag
class="bookmarktag"
v-for="tag in form.sqTags"
:key="tag.tagId"
closable
type="success"
:disable-transitions="false"
@close="taghandleClose(tag.tagId)"
v-if="tag.name!='TAGDELETE'"
>
{{tag.name}}
</el-tag>
<el-input
class="input-new-tag"
v-if="inputVisible"
v-model="inputValue"
ref="saveTagInput"
size="small"
@keyup.enter.native="handleInputConfirm"
@blur="handleInputConfirm"
>
</el-input>
<el-button v-else class="button-new-tag" size="small" @click="showInput">+ 新增标签</el-button>
</el-form-item>
<!-- 0公开显示 1隐藏显示 2好友显示-->
<el-form-item label="选择状态" prop="start">
<el-radio-group v-model="form.start" size="medium">
<el-radio v-for="(item, index) in bookmarkstatus" :key="index" :label="item.value"
:disabled="item.disabled">{{item.name}}
</el-radio>
</el-radio-group>
</el-form-item>
<!-- 1.未读稍后再看 2 已读 2.續看-->
<el-form-item label="选择类型" prop="type">
<el-radio-group v-model="form.type" size="medium">
<el-radio v-for="(item, index) in bookmarktype" :key="index" :label="item.value"
:disabled="item.disabled">{{item.name}}
</el-radio>
</el-radio-group>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</el-aside>
<el-main class="isBookmarkMain">
<el-header class="mianUrl-top" style="height: 50px">
<div class="mianUrl-top-left">
<i class="el-icon-folder-delete"></i>
<i class="el-icon-rank"></i>
</div>
<div class="mianUrl-top-right">
<i class="el-icon-edit-outline" @click="windowurlOpen"></i>
<i class="el-icon-position"></i>
</div>
</el-header>
<div class="mianUrl-botoom" v-loading="iframeLoading" >
<!-- webkitallowfullscreen="true" mozallowfullscreen="true" allowfullscreen="true"-->
<iframe sandbox="allow-forms allow-scripts allow-popups" class="openurl" :src="gourl" target="_self" tabindex="-1" />
</div>
</el-main>
</el-container>
<!-- 0公开显示 1隐藏显示 2好友显示-->
<el-form-item label="选择状态" prop="start">
<el-radio-group v-model="form.start" size="medium">
<el-radio v-for="(item, index) in bookmarkstatus" :key="index" :label="item.value"
:disabled="item.disabled">{{item.name}}
</el-radio>
</el-radio-group>
</el-form-item>
<!-- 1.未读稍后再看 2 已读 2.續看-->
<el-form-item label="选择类型" prop="type">
<el-radio-group v-model="form.type" size="medium">
<el-radio v-for="(item, index) in bookmarktype" :key="index" :label="item.value"
:disabled="item.disabled">{{item.name}}
</el-radio>
</el-radio-group>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div> </div>
</template> </template>
<script> <script>
import {listMenuByUserId} from "@/api/bookmark/menu";
import Treeselect from "@riophae/vue-treeselect";
import BookmarkOne from "../../../components/BookmarkList";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import { import {
selectBymenuIdUserID, selectBymenuIdUserID,
selectBydelete, selectBydelete,
@ -226,11 +322,13 @@
export default { export default {
components: { components: {
format format, Treeselect,BookmarkOne
}, },
data: function () { data: function () {
return { return {
sousuo: '',
drawer: false,
// 遮罩层 // 遮罩层
loading: true, loading: true,
// 弹出层标题 // 弹出层标题
@ -241,6 +339,7 @@
showbookmark: true, showbookmark: true,
showimg: false, showimg: false,
loading: false, loading: false,
iframeLoading:false,
queryParams: { queryParams: {
pageNum: 1, pageNum: 1,
pageSize: 15, pageSize: 15,
@ -264,6 +363,8 @@
tagcount: 0, //标签虚拟ID tagcount: 0, //标签虚拟ID
bookmarkList: [], bookmarkList: [],
urltext: '?from=yunshuqian.com',//网址域名起推广作用 urltext: '?from=yunshuqian.com',//网址域名起推广作用
// 书签菜单树选项
menuOptions: [],
// 表单参数 // 表单参数
form: {}, form: {},
// 表单校验 // 表单校验
@ -293,6 +394,10 @@
total: 0,//总条数 total: 0,//总条数
noMore: false,//是否可以滚动瀑布流 noMore: false,//是否可以滚动瀑布流
highlighted: true,//搜索是否高亮 highlighted: true,//搜索是否高亮
//点击的网址
gourl:'https://element.eleme.cn/#/zh-CN/theme',
} }
}, },
@ -376,13 +481,13 @@
/**滚动监控**/ /**滚动监控**/
load() { load() {
console.log("滚动开始") console.log("滚动开始")
var that=this; var that = this;
//判断是否加载了所有数据 //判断是否加载了所有数据
var i=that.queryParams.pageNum+1; var i = that.queryParams.pageNum + 1;
that.$set(that.queryParams,'pageNum',i) that.$set(that.queryParams, 'pageNum', i)
console.log("this.queryParams.pageNum:"+that.queryParams.pageNum) console.log("this.queryParams.pageNum:" + that.queryParams.pageNum)
var listcount = Math.ceil(that.total / 15); var listcount = Math.ceil(that.total / 15);
console.log("该目录共有页数:" +listcount) console.log("该目录共有页数:" + listcount)
if (i > listcount) { if (i > listcount) {
//加载完毕了 禁止滚动 //加载完毕了 禁止滚动
@ -402,7 +507,7 @@
this.total = response.total; this.total = response.total;
this.listloading = false this.listloading = false
console.log("请求完毕"+that.queryParams.pageNum) console.log("请求完毕" + that.queryParams.pageNum)
} else { } else {
//出错了 //出错了
//加载完毕了 禁止滚动 //加载完毕了 禁止滚动
@ -432,7 +537,17 @@
} }
} }
}, },
/** 转换书签菜单数据结构 */
normalizer(node) {
if (node.children && !node.children.length) {
delete node.children;
}
return {
id: node.menuId,
label: node.menuName,
children: node.children
};
},
/**书签编辑设置的 标签开始**/ /**书签编辑设置的 标签开始**/
taghandleClose(tag) { taghandleClose(tag) {
@ -552,7 +667,7 @@
idelete: undefined, idelete: undefined,
start: undefined, start: undefined,
createTime: undefined, createTime: undefined,
sqTags: undefined, sqTags: [],
sort: undefined, sort: undefined,
}; };
this.resetForm("form"); this.resetForm("form");
@ -600,15 +715,27 @@
this.bookmarkList = response.rows; this.bookmarkList = response.rows;
this.total = response.total; this.total = response.total;
this.loading = false; this.loading = false;
if (this.total>0){
this.gourl=this.bookmarkList[0].url;
}
} else { } else {
this.showbookmark = false; this.showbookmark = false;
this.showimg = true; this.showimg = true;
} }
}); });
}, },
windowurl(url, bookmarkId) { /**网站内打开*/
// window.open(url+this.urltext); windowurl(url,bookmarkId) {
window.open(url); var that=this;
that.iframeLoading=true;
this.gourl=url;
setTimeout(function(){
that.iframeLoading=false;
},1000);
},
/**新窗口打开*/
windowurlOpen() {
window.open(this.gourl);
}, },
/**搜索高亮 开始**/ /**搜索高亮 开始**/
@ -662,7 +789,49 @@
return htmlStr; return htmlStr;
}, },
/**搜索高亮 结束**/ /**搜索高亮 结束**/
/**搜索功能**/
gosousuo() {
var that = this;
// that.$router.push({
// path: "/content",
// query: {
// sousuo: this.sousuo,
// t:Date.now(),
// }
// })
},
/** 查询部门下拉树结构 */
getTreeselect() {
if (this.zNodes != null && this.zNodes.length != 0) {
this.menuOptions = [];
const data = {menuId: 0, menuName: '顶级菜单', children: []};
data.children = this.handleTree(this.zNodes, "menuId", "parentId");
this.menuOptions.push(data);
return;
}
listMenuByUserId().then(response => {
this.menuOptions = [];
const data = {menuId: 0, menuName: '顶级菜单', children: []};
data.children = this.handleTree(response.data, "menuId", "parentId");
this.menuOptions.push(data);
});
},
/** 新增书签Url操作 */
addbookmarkurl: function () {
this.reset();
this.getTreeselect();
this.open = true;
// getMenu(e.getAttribute("data-menuId")).then(response => {
// this.form = response.data;
// this.open = true;
// this.title = "修改书签菜单";
// });
},
}, },
@ -747,7 +916,7 @@
height: 70px; height: 70px;
position: absolute; position: absolute;
background-color: #acd7ff; background-color: #acd7ff;
/*right: 0;编辑*/ right: 0;
display: none; display: none;
} }
@ -764,11 +933,6 @@
float: left; float: left;
} }
.bookmark-hr {
background-color: #fff !important;
margin-top: 2px !important;
margin-bottom: 7px !important;
}
.editlist div { .editlist div {
margin-left: 10px; margin-left: 10px;
@ -795,7 +959,6 @@
.bookmark-icon { .bookmark-icon {
float: left; float: left;
margin-right: 5px; margin-right: 5px;
} }
.bookmark-icon img { .bookmark-icon img {
@ -804,6 +967,11 @@
} }
.filter-item:hover {
background-color: #E5E5E5 !important;
color: #000 !important;
}
.filter-tbar { .filter-tbar {
display: flex; display: flex;
position: relative; position: relative;
@ -828,10 +996,11 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
margin-right: 13px;
} }
.filter-content { .filter-content {
margin-left: 18px; margin-left: 13px;
} }
@ -892,9 +1061,13 @@
.listhint { .listhint {
width: 100%; width: 100%;
text-align: center; text-align: center;
height: 20px;
color: #808080; color: #808080;
/*background: #dcdfe682;*/ /*background: #dcdfe682;*/
font-weight: 600; font-weight: 600;
padding: 0;
margin: 0;
} }
.bookmark-title:hover { .bookmark-title:hover {
@ -928,6 +1101,8 @@
margin-bottom: 2px; margin-bottom: 2px;
} }
.description { .description {
/*设置文本框大小*/ /*设置文本框大小*/
white-space: nowrap; white-space: nowrap;
@ -942,9 +1117,7 @@
.bookmarklist { .bookmarklist {
width: 100%; width: 100%;
height: 600px;
/*background-color: #fff;*/
float: left
} }
@ -972,8 +1145,8 @@
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
/*设置为透明 隐藏掉*/ /*设置为透明 隐藏掉*/
/*background-color: #606d71;*/ background-color: #606d71;
background-color: transparent; /*background-color: transparent;*/
background-clip: padding-box; background-clip: padding-box;
min-height: 28px; min-height: 28px;
-webkit-border-radius: 2em; -webkit-border-radius: 2em;
@ -991,8 +1164,6 @@
/*滚动条美化结束*/ /*滚动条美化结束*/
.sousuoContent { .sousuoContent {
width: 100%; width: 100%;
height: 24px; height: 24px;
@ -1013,7 +1184,192 @@
/*border-bottom: 1px solid #D9D9D9;*/ /*border-bottom: 1px solid #D9D9D9;*/
} }
.bookmark2 {
height: 52px;
/*border-bottom: 1px solid #D9D9D9;*/
white-space: nowrap;
border-top:1px solid #D4D4D4 ;
}
.sousouright-icon {
display: flex;
justify-content: center;
align-items: center;
width: 50px;
margin: 0 auto;
}
.sousouright-iconadd {
display: flex;
justify-content: center;
align-items: center;
width: 50px;
}
.sq-dropdown {
top: 33px !important;
box-shadow: 0 2px 15px 0 rgba(0, 0, 0, .2) !important;
font-weight: 800 !important;
}
.sq-dropdown div {
display: none !important;
}
.sousouleft-switch {
display: flex;
align-items: center;
justify-content: center;
margin-right: 10px;
width: 30px;
height: 30px;
}
.sousouleft-switch i {
font-size: 30px !important;
opacity: 0.8;
}
.sousou-leftico {
display: flex;
align-items: center;
justify-content: center;
width: 30px;
height: 30px;
border-radius: 3px;
border: 1px solid #e6e6e6;
margin-right: 10px;
}
.sousou-leftico img {
}
.header-sousou {
display: flex;
align-items: center;
justify-content: center;
height: 50px;
padding-left: 0px;
}
.header-sousou input {
margin-top: 9px;
border: 0px;
background-color: #f2f2f2;
border-radius: 0 !important;
/*border: 1px solid #f2f2f2;*/
}
.header-sousou input:focus {
background-color: #FFFFFF !important;
border: 1px solid #C0C4CC;
}
.sousou-input {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
}
.sousou-input i {
font-size: 15px;
}
.header-list {
display: flex;
justify-content: center;
align-items: center;
width: 35px;
}
.header-list:hover {
color: #7a6df0;
}
.header-list i {
font-size: 25px;
margin-right: 2px;
}
.sousou-left {
/*width: 50px!important;*/
/*height: 50px;*/
/*margin-top: 12px!important;*/
/*background-color: red;*/
}
.isBookmarkAside{
padding: 0px;
background-color: #ffffff;
width: 400px!important;
box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
}
.isBookmarkMain{
padding: 0px;
}
.mianUrl{
padding: 0px;
color: #8F8F8F;
}
.mianUrl-top{
display: flex;
padding: 0px!important;
}
.mianUrl-top div{
width: 50%;
height: 50px;
background-color: #FFFFFF;
font-size: 22px;
color: #414141;
padding-top: 19px;
}
.mianUrl i{
display: block;
width: 30px;
height: 30px;
line-height: 30px;
text-align: center;
margin-top: 15px;
border-radius: 2px;
}
.mianUrl-top-left i{
float: left;
margin-left: 15px;
}
.mianUrl i:hover{
background-color: #F2F2F2;
}
.mianUrl-top-right i{
float: right;
margin-right: 15px;
}
.mianUrl-botoom{
height: 900px;
}
.openurl{
background-color: #ffffff;
border: 0px;
width: 100%;
height: 100%;
}
</style> </style>

19
ruoyi-ui/src/views/bookmark/common/NqEdit.vue
View File

@ -1,22 +1,17 @@
<template> <template>
<div class="home"> <div class="home">
<div CLASS="title"> <div CLASS="nqtitle">
<div class="mdui-textfield mdui-textfield-floating-label"> <div class="mdui-textfield mdui-textfield-floating-label">
<label class="mdui-textfield-label">文章标题</label> <label class="mdui-textfield-label">文章标题</label>
<input class="mdui-textfield-input" type="text" required/> <input class="mdui-textfield-input" type="text" required/>
<div class="mdui-textfield-error">文章标题不能为空</div> <div class="mdui-textfield-error">文章标题不能为空</div>
</div> </div>
<div class="mdui-textfield mdui-textfield-floating-label">
<label class="mdui-textfield-label">文章描述</label>
<input class="mdui-textfield-input" type="text" required/>
<div class="mdui-textfield-error">文章描述不能为空</div>
</div>
</div> </div>
<div class="mian" v-html="msg"> <!-- <div class="mian" v-html="msg">-->
</div> <!-- </div>-->
<div> <div>
<tinymce <tinymce
@ -26,8 +21,9 @@
@onClick="onClick" @onClick="onClick"
/> />
</div> </div>
<div STYLE="margin-top: 10px;"> <div STYLE="margin-top: 10px;margin-bottom: 10px">
<button class="mdui-btn mdui-btn-raised mdui-color-indigo-300" @click="clear">清空内容</button> <button class="mdui-btn mdui-btn-raised mdui-color-indigo-300" @click="clear">清空内容</button>
<button class="mdui-btn mdui-btn-raised mdui-color-indigo-300" @click="clear">发布</button>
<button class="mdui-btn mdui-ripple mdui-btn-raised " @click="disabled = true">禁用</button> <button class="mdui-btn mdui-ripple mdui-btn-raised " @click="disabled = true">禁用</button>
<button class="mdui-btn mdui-ripple mdui-btn-raised " @click="disabled = false">启用</button> <button class="mdui-btn mdui-ripple mdui-btn-raised " @click="disabled = false">启用</button>
</div> </div>
@ -78,7 +74,7 @@
} }
} }
</script> </script>
<style> <style scoped>
.title{ .title{
display: flex; display: flex;
} }
@ -90,7 +86,8 @@
} }
.mian{ .mian{
min-height: 100px; height: 300px;
overflow-y: auto;
width: 100%; width: 100%;
border: 1px solid #cacaca; border: 1px solid #cacaca;
background-color: #ebebeb; background-color: #ebebeb;

473
ruoyi-ui/src/views/bookmark/index/index.vue
View File

@ -18,9 +18,9 @@
<div class="main-right"> <div class="main-right">
<div class="aside-title" @click="goBookmarkList"><i class="el-icon-s-tools"></i><span>全部书签</span></div> <div class="aside-title" @click="goBookmarkList"><i class="el-icon-s-tools"></i><span>最新书签</span></div>
<div class="aside-title"><i class="el-icon-help"></i><span>发现</span></div> <!-- <div class="aside-title"><i class="el-icon-help"></i><span>发现</span></div>-->
<div class="aside-title"><i class="el-icon-s-platform"></i><span>任意门</span></div> <!-- <div class="aside-title"><i class="el-icon-s-platform"></i><span>任意门</span></div>-->
<div class="aside-title"><i class="el-icon-message-solid"></i><span>收件箱</span></div> <div class="aside-title"><i class="el-icon-message-solid"></i><span>收件箱</span></div>
<div class="reminder">我的收藏</div> <div class="reminder">我的收藏</div>
<div class="areaTree"> <div class="areaTree">
@ -58,14 +58,14 @@
</el-aside> </el-aside>
<!-- <el-footer class="aside-navigation">--> <!-- <el-footer class="aside-navigation">-->
<!-- </el-footer>--> <!-- </el-footer>-->
</transition> </transition>
<div class="isresize"> <div class="isresize" style="cursor:w-resize">
<i class="el-icon-caret-top"></i> <!-- <i class="el-icon-caret-top"></i>-->
</div> </div>
<!-- <el-drawer--> <!-- <el-drawer-->
<!-- title="我是标题"--> <!-- title="我是标题"-->
@ -83,70 +83,6 @@
<el-container class="mid"> <el-container class="mid">
<el-header class="header-sousou" style="height: 50px">
<div class="sousou-left">
<div class="sousouleft-switch" @click="drawer = true"><i class="el-icon-s-unfold"/></div>
<div class="sousou-leftico" @click="drawer = true"><img
src="https://favicon.lucq.fun/?url=https://www.baidu.com"/></div>
</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-input slot="reference" @keyup.enter.native="gosousuo" placeholder="请输入要查找的关键词" v-model="sousuo"
size="small">
<i slot="prefix" class="el-input__icon el-icon-search" style="font-size: 15px;margin-top: 7px"></i>
<!-- <el-button slot="append" icon="el-icon-search"></el-button>-->
</el-input>
<!-- </el-popover>-->
</div>
<div class="sousouright-icon">
<el-badge :value="5" :max="99" class="item"><i class="el-icon-message-solid" style="font-size: 17px;"></i>
</el-badge>
</div>
<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;"/>
</span>
<el-dropdown-menu slot="dropdown" class="sq-dropdown">
<el-dropdown-item class="filter-item" icon="el-icon-plus" @click.native="addbookmarkurl">添加连接
</el-dropdown-item>
<el-dropdown-item class="filter-item" icon="el-icon-plus" command="b">添加文本</el-dropdown-item>
<el-dropdown-item class="filter-item" icon="el-icon-plus" command="d">导入书签</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
<div class="header-list">
<el-dropdown trigger="click" size="small" :hide-on-click="false">
<span class="el-dropdown-link">
<el-avatar :size="28"
src="https://up.raindrop.io/collection/templates/social-media-logos-6/97social.png"></el-avatar>
</span>
<el-dropdown-menu slot="dropdown" class="sq-dropdown">
<el-dropdown-item class="filter-item" icon="el-icon-plus" command="a">外观显示</el-dropdown-item>
<el-dropdown-item class="filter-item" icon="el-icon-plus" command="b">用户中心</el-dropdown-item>
<el-dropdown-item class="filter-item" icon="el-icon-plus" command="d">建议反馈</el-dropdown-item>
<el-dropdown-item class="filter-item" icon="el-icon-plus" command="e">退出登录</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
</el-header>
<el-main class="bookmarkmain"> <el-main class="bookmarkmain">
<router-view :key="$route.query.t"></router-view> <router-view :key="$route.query.t"></router-view>
@ -217,82 +153,82 @@
</el-dialog> </el-dialog>
<!-- 添加链接--> <!-- &lt;!&ndash; 添加链接&ndash;&gt;-->
<!-- 添加或修改书签管理对话框 --> <!-- &lt;!&ndash; 添加或修改书签管理对话框 &ndash;&gt;-->
<el-dialog title="添加连接" :visible.sync="addopen" width="500px" append-to-body> <!-- <el-dialog title="添加连接" :visible.sync="addopen" width="500px" append-to-body>-->
<el-form ref="form" :model="form" :rules="rules" label-width="80px"> <!-- <el-form ref="form" :model="form" :rules="rules" label-width="80px">-->
<el-form-item label="书签地址" prop="url"> <!-- <el-form-item label="书签地址" prop="url">-->
<el-input v-model="form.url" placeholder="请输入书签地址"/> <!-- <el-input v-model="form.url" placeholder="请输入书签地址"/>-->
</el-form-item> <!-- </el-form-item>-->
<el-form-item label="书签标题" prop="title"> <!-- <el-form-item label="书签标题" prop="title">-->
<el-input v-model="form.title" placeholder="请输入书签标题"/> <!-- <el-input v-model="form.title" placeholder="请输入书签标题"/>-->
</el-form-item> <!-- </el-form-item>-->
<el-form-item label="书签描述" prop="description"> <!-- <el-form-item label="书签描述" prop="description">-->
<el-input v-model="form.description" type="textarea" placeholder="请输入书签描述" <!-- <el-input v-model="form.description" type="textarea" placeholder="请输入书签描述"-->
:autosize="{minRows: 3, maxRows:4}" :style="{width: '100%'}"></el-input> <!-- :autosize="{minRows: 3, maxRows:4}" :style="{width: '100%'}"></el-input>-->
</el-form-item> <!-- </el-form-item>-->
<el-form-item prop="parentId"> <!-- <el-form-item prop="parentId">-->
<div class="labelname">分类菜单</div> <!-- <div class="labelname">分类菜单</div>-->
<treeselect class="menutreeselect" v-model="form.menuId" :options="menuOptions" :normalizer="normalizer"/> <!-- <treeselect class="menutreeselect" v-model="form.menuId" :options="menuOptions" :normalizer="normalizer"/>-->
</el-form-item> <!-- </el-form-item>-->
<el-form-item label="书签标签" prop="label"> <!-- <el-form-item label="书签标签" prop="label">-->
<el-tag <!-- <el-tag-->
class="bookmarktag" <!-- class="bookmarktag"-->
v-for="tag in sqTags" <!-- v-for="tag in sqTags"-->
:key="tag.tagId" <!-- :key="tag.tagId"-->
closable <!-- closable-->
type="success" <!-- type="success"-->
:disable-transitions="false" <!-- :disable-transitions="false"-->
@close="taghandleClose(tag.tagId)" <!-- @close="taghandleClose(tag.tagId)"-->
v-if="tag.name!='TAGDELETE'" <!-- v-if="tag.name!='TAGDELETE'"-->
> <!-- >-->
{{tag.name}} <!-- {{tag.name}}-->
</el-tag> <!-- </el-tag>-->
<el-input <!-- <el-input-->
class="input-new-tag" <!-- class="input-new-tag"-->
v-if="inputVisible" <!-- v-if="inputVisible"-->
v-model="inputValue" <!-- v-model="inputValue"-->
ref="saveTagInput" <!-- ref="saveTagInput"-->
size="small" <!-- size="small"-->
@keyup.enter.native="handleInputConfirm" <!-- @keyup.enter.native="handleInputConfirm"-->
@blur="handleInputConfirm" <!-- @blur="handleInputConfirm"-->
> <!-- >-->
</el-input> <!-- </el-input>-->
<el-button v-else class="button-new-tag" size="small" @click="showInput">+ 新增标签</el-button> <!-- <el-button v-else class="button-new-tag" size="small" @click="showInput">+ 新增标签</el-button>-->
</el-form-item> <!-- </el-form-item>-->
<!-- <el-form-item label="所属目录" prop="menuId">--> <!-- &lt;!&ndash; <el-form-item label="所属目录" prop="menuId">&ndash;&gt;-->
<!-- <el-input v-model="form.menuId" placeholder="请选择上级目录" />--> <!-- &lt;!&ndash; <el-input v-model="form.menuId" placeholder="请选择上级目录" />&ndash;&gt;-->
<!-- </el-form-item>--> <!-- &lt;!&ndash; </el-form-item>&ndash;&gt;-->
<!-- 0公开显示 1隐藏显示 2好友显示--> <!-- &lt;!&ndash; 0公开显示 1隐藏显示 2好友显示&ndash;&gt;-->
<el-form-item label="选择状态" prop="start"> <!-- <el-form-item label="选择状态" prop="start">-->
<el-radio-group v-model="form.start" size="medium"> <!-- <el-radio-group v-model="form.start" size="medium">-->
<el-radio v-for="(item, index) in bookmarkstatus" :key="index" :label="item.value" <!-- <el-radio v-for="(item, index) in bookmarkstatus" :key="index" :label="item.value"-->
:disabled="item.disabled">{{item.name}} <!-- :disabled="item.disabled">{{item.name}}-->
</el-radio> <!-- </el-radio>-->
</el-radio-group> <!-- </el-radio-group>-->
</el-form-item> <!-- </el-form-item>-->
<!-- 1.未读稍后再看 2 已读 2.續看--> <!-- &lt;!&ndash; 1.未读稍后再看 2 已读 2.續看&ndash;&gt;-->
<el-form-item label="选择类型" prop="type"> <!-- <el-form-item label="选择类型" prop="type">-->
<el-radio-group v-model="form.type" size="medium"> <!-- <el-radio-group v-model="form.type" size="medium">-->
<el-radio v-for="(item, index) in bookmarktype" :key="index" :label="item.value" <!-- <el-radio v-for="(item, index) in bookmarktype" :key="index" :label="item.value"-->
:disabled="item.disabled">{{item.name}} <!-- :disabled="item.disabled">{{item.name}}-->
</el-radio> <!-- </el-radio>-->
</el-radio-group> <!-- </el-radio-group>-->
</el-form-item> <!-- </el-form-item>-->
</el-form> <!-- </el-form>-->
<div slot="footer" class="dialog-footer"> <!-- <div slot="footer" class="dialog-footer">-->
<el-button type="primary" @click="addbookmark">确 定</el-button> <!-- <el-button type="primary" @click="addbookmark">确 定</el-button>-->
<el-button @click="bookmarkcancel">取 消</el-button> <!-- <el-button @click="bookmarkcancel">取 消</el-button>-->
</div> <!-- </div>-->
</el-dialog> <!-- </el-dialog>-->
<!--背景特效--> <!--背景特效-->
<canvas id="evanyou"></canvas> <canvas id="evanyou"></canvas>
@ -428,9 +364,6 @@
height: "", height: "",
width: "", width: "",
}, },
//点击的网址
gourl:'https://element.eleme.cn/#/zh-CN/theme',
} }
}, },
@ -453,8 +386,6 @@
var that = this; var that = this;
//书签菜单 //书签菜单
that.getList(); that.getList();
window.addEventListener('resize', this.getHeight); window.addEventListener('resize', this.getHeight);
this.getHeight() this.getHeight()
}, },
@ -1015,18 +946,6 @@
/**书签编辑设置的 标签结束**/ /**书签编辑设置的 标签结束**/
/** 新增书签Url操作 */
addbookmarkurl: function () {
this.reset();
this.getTreeselect();
this.addopen = true;
// getMenu(e.getAttribute("data-menuId")).then(response => {
// this.form = response.data;
// this.open = true;
// this.title = "修改书签菜单";
// });
},
/** 提交按钮 修改和新增 */ /** 提交按钮 修改和新增 */
addbookmark: function () { addbookmark: function () {
@ -1374,17 +1293,7 @@
path: "/UserTagAll", path: "/UserTagAll",
}) })
}, },
/**搜索功能**/
gosousuo() {
var that = this;
that.$router.push({
path: "/content",
query: {
sousuo: this.sousuo,
t:Date.now(),
}
})
},
}, },
@ -1399,7 +1308,7 @@
} }
</script> </script>
<style> <style >
body { body {
@ -1567,6 +1476,10 @@
box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1); box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
} }
/*光标拖拽*/
/*.isaside{*/
/* cursor:w-resize*/
/*}*/
.aside-title { .aside-title {
height: 32px; height: 32px;
@ -1617,10 +1530,6 @@
} }
/*.logoright i:active {*/
/* background-color: #7a6df0;*/
/* color: #FFFFFF;*/
/*}*/
.reminder { .reminder {
@ -1666,8 +1575,7 @@
.bookmarkmain { .bookmarkmain {
padding-top: 0px !important; padding: 0px !important;
} }
.separator { .separator {
@ -1683,65 +1591,6 @@
margin-bottom: 3px; margin-bottom: 3px;
} }
.header-sousou {
display: flex;
align-items: center;
justify-content: center;
}
.header-sousou input {
margin-top: 9px;
border: 0px;
background-color: #f2f2f2;
border-radius: 0 !important;
/*border: 1px solid #f2f2f2;*/
}
.header-sousou input:focus {
background-color: #FFFFFF !important;
border: 1px solid #C0C4CC;
}
.header-sousou i {
font-size: 1px;
margin-top: 6px;
}
.sousou-input {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
}
.header-list {
display: flex;
justify-content: center;
align-items: center;
width: 35px;
margin-top: 9px !important;
}
.header-list:hover {
color: #7a6df0;
}
.header-list i {
font-size: 25px;
margin-right: 2px;
}
.main-label span i { .main-label span i {
margin-left: 5px; margin-left: 5px;
@ -1759,80 +1608,6 @@
margin-right: 5px; margin-right: 5px;
} }
.sousouleft-switch {
margin-top: 4px !important;
margin-right: 10px !important;
}
.sousouleft-switch i {
font-size: 30px;
opacity: 0.8;
}
.sousou-left {
/*width: 50px!important;*/
/*height: 50px;*/
/*margin-top: 12px!important;*/
/*background-color: red;*/
}
.sousou-leftico {
display: flex;
align-items: center;
justify-content: center;
width: 30px;
height: 30px;
border-radius: 3px;
border: 1px solid #e6e6e6 !important;
margin-top: 9px !important;
margin-right: 10px !important;
}
.sousou-leftico img {
}
.filter-item:hover {
background-color: #E5E5E5 !important;
color: #000 !important;
}
.sousouright-icon {
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;
font-weight: 800 !important;
}
.sq-dropdown div {
display: none !important;
}
.labelname { .labelname {
font-weight: 800; font-weight: 800;
color: rgb(0, 0, 0); color: rgb(0, 0, 0);
@ -1914,11 +1689,12 @@
padding-top: 6px !important; padding-top: 6px !important;
} }
el-aside { .isaside {
box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1); box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
} }
.main-right { .main-right {
width: 300px; width: 300px;
height: 95%; height: 95%;
@ -1950,12 +1726,7 @@
} }
.tabBar {
/*width: inherit;*/
/*overflow: hidden;*/
/*position: fixed;*/
/*bottom: 0;*/
}
.tabBarList{ .tabBarList{
display: flex; display: flex;
float: left; float: left;
@ -1992,28 +1763,29 @@
/*拖拽区div样式*/ /*拖拽区div样式*/
.isresize { .isresize {
background-color: transparent; width: 7px;
width: 10px;
font-size: 25px; font-size: 25px;
display: -webkit-flex; display: -webkit-flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
background-color: transparent; background-color: transparent;
color: transparent; color: transparent;
z-index: 1;
margin-left: -4px!important;
} }
/*拖拽区鼠标悬停样式*/ /*拖拽区鼠标悬停样式*/
.isresize:hover { /*.isresize:hover {*/
color: #a4a4a4; /* color: #a4a4a4;*/
} /*}*/
.isresize i { /*.isresize i {*/
margin-left: 2px; /* margin-left: 2px;*/
transform: rotate(90deg); /* transform: rotate(90deg);*/
width: 10px; /* width: 10px;*/
/*color: transparent;*/ /* !*color: transparent;*!*/
/*background-color: black;*/ /* !*background-color: black;*!*/
} /*}*/
.main-right { .main-right {
min-width: 250px; min-width: 250px;
@ -2041,53 +1813,12 @@
.mianUrl{
padding: 0px;
color: #8F8F8F;
}
.mianUrl-top{
display: flex;
padding: 0px!important;
}
.mianUrl-top div{
width: 50%;
height: 50px;
background-color: #FFFFFF;
font-size: 22px;
color: #414141;
}
.mianUrl i{
display: block;
width: 30px;
height: 30px;
line-height: 30px;
text-align: center;
margin-top: 15px;
border-radius: 2px;
}
.mianUrl-top-left i{
float: left;
margin-left: 15px;
}
.mianUrl i:hover{
background-color: #F2F2F2;
}
.mianUrl-top-right i{
float: right;
margin-right: 15px;
}
.mianUrl-botoom{
height: 900px;
}
.openurl{
width: 100%;
height: 100%;
}
/*.mid{*/
/* min-width: 400px!important;*/
/* max-width: 400px;*/
/*}*/
</style> </style>

4
ruoyi-yunbookmark/src/main/java/com/ruoyi/bookmark/domain/SqMenu.java
View File

@ -19,9 +19,9 @@ import java.util.Date;
public class SqMenu public class SqMenu
{ {
private static final long serialVersionUID = 1L; private static final long serialVersionUID = 1L;
/** ID */ /** ID 返回自增长主键 */
@Id @Id
@GeneratedValue(generator = "JDBC")//返回自增长主键 @GeneratedValue(generator = "JDBC")
@Column(name = "menu_id") @Column(name = "menu_id")
private Long menuId; private Long menuId;