diff --git a/README.md b/README.md
index b71325f..94f78a7 100644
--- a/README.md
+++ b/README.md
@@ -1 +1,13 @@
-# utools-plugin-template
+# clipboard-manager
+
+**首次安装需要设置“跟随主程序同时启动”**
+
+轮询记录剪切板历史并保存到本地,支持文字/图片/文件。
+
+本地存储路径: `{userpath}/_utools_clipboard_manager_storage`
+
+### 快捷键
+
+`/` `Ctrl+F` / `Ctrl+L` 聚焦搜索框
+
+`Tab` 切换分类
diff --git a/public/logo.png b/public/logo.png
index 62db9f3..7327248 100644
Binary files a/public/logo.png and b/public/logo.png differ
diff --git a/public/plugin.json b/public/plugin.json
index 2af1fab..bc7d675 100644
--- a/public/plugin.json
+++ b/public/plugin.json
@@ -1,17 +1,16 @@
{
- "name": "clipboard",
"version": "1.0.0",
- "pluginName": "剪切板",
- "description": "剪切板历史,snippet,代码片段",
- "author": "inu1255",
- "homepage": "https://github.com/inu1255/utools-clipboard",
+ "pluginName": "剪贴板",
+ "description": "强大的剪贴板管理工具",
+ "author": "ZiuChen",
+ "homepage": "https://github.com/ZiuChen",
"main": "index.html",
"preload": "preload.js",
"development": {
"main": "http://localhost:8081/"
},
"logo": "logo.png",
- "platform": ["win32", "darwin", "linux"],
+ "platform": ["win32"],
"features": [
{
"code": "clipboard",
diff --git a/public/preload.js b/public/preload.js
index e664ff3..25c647e 100644
--- a/public/preload.js
+++ b/public/preload.js
@@ -1,7 +1,7 @@
// /*
-// name: powerful_clipboard_manager
+// name: clipboard_manager
// author: Github @ZiuChen
-// lastUpdate: v0.0.1 2022/08/14
+// lastUpdate: v1.0.0 2022/08/14
// desc: 监听剪贴板 读写本地文件
// */
diff --git a/src/views/Main.vue b/src/views/Main.vue
index 340be66..267d20e 100644
--- a/src/views/Main.vue
+++ b/src/views/Main.vue
@@ -13,16 +13,23 @@
-
-
- {{ tab.name }}
-
-
+
+
+
+ {{ tab.name }}
+
+
+
+
+
+
+
-
- 当前记录为空,快去复制点东西来吧
-
+ 📪 无记录
{
+ const { key, ctrlKey } = e
+ const isTab = key === 'Tab'
+ const isSearch =
+ key === '/' ||
+ (ctrlKey && (key === 'F' || key === 'f')) ||
+ (ctrlKey && (key === 'L' || key === 'l'))
+ const isExit = key === 'Escape'
+ if (isTab) {
+ const l = ['all', 'text', 'image', 'file']
+ const i = l.indexOf(this.activeTab)
+ const t = i === l.length - 1 ? l[0] : l[i + 1]
+ this.toggleNav(t)
+ } else if (isSearch) {
+ document.querySelector('input').focus()
+ } else if (isExit) {
+ this.filterText = ''
+ }
+ })
},
methods: {
toggleNav(type) {
@@ -146,9 +178,28 @@ export default {
},
updateShowList(type = this.activeTab) {
if (type === 'all') {
- this.showList = this.list.slice(0, this.GAP)
- } else {
+ if (this.filterText) {
+ // 有过滤词 则过滤掉图片
+ this.showList = this.list
+ .filter((item) => item.type !== 'image')
+ .filter((item) => item.data.indexOf(this.filterText) !== -1)
+ .slice(0, this.GAP)
+ } else {
+ // 无过滤词 直接更新
+ this.showList = this.list
+ .filter((item) => item.data.indexOf(this.filterText) !== -1)
+ .slice(0, this.GAP)
+ }
+ } else if (type === 'image') {
+ // 排除掉对图片 DataURL的筛选
this.showList = this.list.filter((item) => item.type === type).slice(0, this.GAP)
+ } else {
+ // `file`类型 在stringify的data里搜
+ // `text`类型 在data里搜
+ this.showList = this.list
+ .filter((item) => item.type === type)
+ .filter((item) => item.data.indexOf(this.filterText) !== -1)
+ .slice(0, this.GAP)
}
document.scrollingElement.scrollTop = 0
},
@@ -232,19 +283,26 @@ export default {
position: fixed;
top: 0px;
display: flex;
- justify-content: left;
+ justify-content: space-between;
align-items: center;
+ flex-direction: row;
width: 100%;
background-color: #eeeeee;
}
-.clip-switch * {
+.clip-switch-items {
+ display: flex;
+ justify-content: left;
+ align-items: center;
+ flex-direction: row;
+}
+.clip-switch .clip-switch-item {
padding: 10px 15px 10px 15px;
margin: 10px 5px 10px 10px;
cursor: pointer;
border-radius: 5px;
font-size: 14px;
}
-.clip-switch *:hover {
+.clip-switch .clip-switch-item:hover {
background-color: rgb(222, 222, 222);
transition: all 0.15s ease-in-out;
}
@@ -253,6 +311,27 @@ export default {
background-color: white;
transition: all 0.15s ease-in-out;
}
+.clip-search {
+ width: 40%;
+ margin-right: 30px;
+}
+.clip-search input {
+ width: 100%;
+ /* normalize */
+ background: none;
+ outline: none;
+ border: none;
+ /* custom */
+ color: var(--text-color);
+ background-color: white;
+ height: fit-content;
+ font-size: 15px;
+ padding: 10px;
+ border-radius: 5px;
+}
+.clip-search input::placeholder {
+ color: var(--text-color-lighter);
+}
.clip-break {
height: 55px;
}