From a1d6f0cc95fd7ceec69b616fbfdfc05c2f514005 Mon Sep 17 00:00:00 2001 From: ZiuChen <457353192@qq.com> Date: Sun, 4 Sep 2022 10:54:35 +0800 Subject: [PATCH 1/6] =?UTF-8?q?feat:=20=E6=94=B6=E8=97=8F=E3=80=81?= =?UTF-8?q?=E5=88=86=E8=AF=8D=E3=80=81=E5=88=A0=E9=99=A4=E5=8A=9F=E8=83=BD?= =?UTF-8?q?=E5=88=9D=E5=A7=8B=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/cpns/ClipItemList.vue | 35 +++++++++++++++++++++++++++++- src/style/cpns/clip-item-list.less | 24 ++++++++++++++++++++ 2 files changed, 58 insertions(+), 1 deletion(-) diff --git a/src/cpns/ClipItemList.vue b/src/cpns/ClipItemList.vue index e2272cc..1078997 100644 --- a/src/cpns/ClipItemList.vue +++ b/src/cpns/ClipItemList.vue @@ -47,7 +47,16 @@ -
{{ index + 1 }}
+
+ +
+
+ {{ index + 1 }} +
@@ -81,6 +90,30 @@ const handleItemClick = (ev, item) => { const handleDataClick = (item) => emit('onDataChange', item) const activeIndex = ref(0) const handleMouseOver = (index) => (activeIndex.value = index) +const operation = [ + { + id: 'collect', + title: '收藏' + }, + { + id: 'big-bang', + title: '分词' + }, + { + id: 'delete', + title: '删除' + } +] +const handleOperateClick = (type) => { + switch (type) { + case 'collect': + break + case 'big-bang': + break + case 'remove': + break + } +} // 父组件中改变了引用类型的地址 故要用 getter返回 watch( () => props.showList, diff --git a/src/style/cpns/clip-item-list.less b/src/style/cpns/clip-item-list.less index a3fa096..57d9a74 100644 --- a/src/style/cpns/clip-item-list.less +++ b/src/style/cpns/clip-item-list.less @@ -70,5 +70,29 @@ color: @text-color-lighter; padding: 10px; } + .clip-operate { + display: flex; + align-items: center; + justify-content: center; + min-width: 100px; + padding: 10px; + & * { + display: flex; + align-items: center; + justify-content: center; + font-size: 13px; + color: @text-color-lighter; + background: @text-bg-color; + margin: 0px 5px; + border-radius: 5px; + width: 30px; + height: 30px; + &:hover { + color: @bg-color; + background: @primary-color; + transition: all 0.15s; + } + } + } } } From 4156c915fddd39760f8b927974672df016bcd742 Mon Sep 17 00:00:00 2001 From: ZiuChen <457353192@qq.com> Date: Sun, 4 Sep 2022 13:17:43 +0800 Subject: [PATCH 2/6] =?UTF-8?q?feat:=20=E8=B0=83=E6=95=B4=E7=95=8C?= =?UTF-8?q?=E9=9D=A2=E5=8A=A8=E7=94=BB=E7=BB=86=E8=8A=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/style/cpns/clip-item-list.less | 7 ++++++- src/style/cpns/clip-search.less | 5 ++--- src/style/cpns/clip-switch.less | 3 ++- 3 files changed, 10 insertions(+), 5 deletions(-) diff --git a/src/style/cpns/clip-item-list.less b/src/style/cpns/clip-item-list.less index 57d9a74..fc59ea7 100644 --- a/src/style/cpns/clip-item-list.less +++ b/src/style/cpns/clip-item-list.less @@ -40,6 +40,11 @@ padding: 5px 7px 5px 7px; &.clip-data-status { color: @primary-color; + &:hover { + color: @bg-color; + background-color: @primary-color; + transition: all 0.15s; + } } } } @@ -83,7 +88,7 @@ font-size: 13px; color: @text-color-lighter; background: @text-bg-color; - margin: 0px 5px; + margin: 0px 2px; border-radius: 5px; width: 30px; height: 30px; diff --git a/src/style/cpns/clip-search.less b/src/style/cpns/clip-search.less index 60c8171..e2356a8 100644 --- a/src/style/cpns/clip-search.less +++ b/src/style/cpns/clip-search.less @@ -1,8 +1,7 @@ .clip-search { - width: 40%; - margin-right: 30px; + min-width: 300px; input { - width: 100%; + width: 90%; /* normalize */ background: none; outline: none; diff --git a/src/style/cpns/clip-switch.less b/src/style/cpns/clip-switch.less index 2ff6386..39cc207 100644 --- a/src/style/cpns/clip-switch.less +++ b/src/style/cpns/clip-switch.less @@ -19,9 +19,10 @@ justify-content: left; align-items: center; flex-direction: row; + margin-left: 5px; .clip-switch-item { padding: 10px 15px 10px 15px; - margin: 10px 5px 10px 10px; + margin: 10px 5px 10px 5px; cursor: pointer; border-radius: 5px; font-size: 14px; From fcca51cd07d9c158150261950bf250b0a6b0c596 Mon Sep 17 00:00:00 2001 From: ZiuChen <457353192@qq.com> Date: Sun, 4 Sep 2022 13:28:17 +0800 Subject: [PATCH 3/6] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E5=88=A0?= =?UTF-8?q?=E9=99=A4=E5=8D=95=E6=9D=A1=E5=8E=86=E5=8F=B2=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/preload.js | 18 ++++++++++++++++-- src/cpns/ClipItemList.vue | 28 +++++++++++----------------- src/cpns/ClipSwitch.vue | 3 ++- src/views/Main.vue | 23 ++++++++++++++++++----- 4 files changed, 47 insertions(+), 25 deletions(-) diff --git a/public/preload.js b/public/preload.js index 0bd7a67..11b1f11 100644 --- a/public/preload.js +++ b/public/preload.js @@ -106,6 +106,16 @@ class DB { }) this.updateDataBaseLocal() } + removeItemViaId(id) { + for (const item of this.dataBase.data) { + if (item.id === id) { + this.dataBase.data.splice(this.dataBase.data.indexOf(item), 1) + this.updateDataBaseLocal() + return true + } + } + return false + } } const pbpaste = async () => { @@ -171,12 +181,15 @@ const paste = () => { else utools.simulateKeyboardTap('v', 'ctrl') } +const db = new DB(DBPath) +db.init() + +const remove = (item) => db.removeItemViaId(item.id) + const focus = () => document.querySelector('.clip-search input')?.focus() const toTop = () => (document.scrollingElement.scrollTop = 0) const resetNav = () => document.querySelectorAll('.clip-switch-item')[0]?.click() -const db = new DB(DBPath) -db.init() watchClipboard(db, (item) => { // 此函数不断执行 if (!item) return @@ -204,6 +217,7 @@ utools.onPluginEnter(() => { window.db = db window.copy = copy window.paste = paste +window.remove = remove window.openFile = utools.shellOpenPath window.getIcon = utools.getFileIcon window.focus = focus diff --git a/src/cpns/ClipItemList.vue b/src/cpns/ClipItemList.vue index 1078997..3cc6e80 100644 --- a/src/cpns/ClipItemList.vue +++ b/src/cpns/ClipItemList.vue @@ -75,7 +75,7 @@ const props = defineProps({ required: true } }) -const emit = defineEmits(['onDataChange']) +const emit = defineEmits(['onDataChange', 'onDataRemove']) const handleItemClick = (ev, item) => { const { button } = ev if (button === 0) { @@ -91,26 +91,20 @@ const handleDataClick = (item) => emit('onDataChange', item) const activeIndex = ref(0) const handleMouseOver = (index) => (activeIndex.value = index) const operation = [ - { - id: 'collect', - title: '收藏' - }, - { - id: 'big-bang', - title: '分词' - }, - { - id: 'delete', - title: '删除' - } + { id: 'copy', title: '复制' }, + { id: 'collect', title: '收藏' }, + { id: 'remove', title: '删除' } ] -const handleOperateClick = (type) => { - switch (type) { +const handleOperateClick = ({ id, item }) => { + switch (id) { + case 'copy': + window.copy(item) + break case 'collect': break - case 'big-bang': - break case 'remove': + window.remove(item) + emit('onDataRemove') break } } diff --git a/src/cpns/ClipSwitch.vue b/src/cpns/ClipSwitch.vue index 1962b39..3c7bdab 100644 --- a/src/cpns/ClipSwitch.vue +++ b/src/cpns/ClipSwitch.vue @@ -21,7 +21,8 @@ const tabs = ref([ { name: '📚 全部', type: 'all' }, { name: '📋 文字', type: 'text' }, { name: '⛺ 图片', type: 'image' }, - { name: '📂 文件', type: 'file' } + { name: '📂 文件', type: 'file' }, + { name: '⭐ 收藏', type: 'collect' } ]) const activeTab = ref('all') const emit = defineEmits(['onNavClick']) diff --git a/src/views/Main.vue b/src/views/Main.vue index c487d26..9576336 100644 --- a/src/views/Main.vue +++ b/src/views/Main.vue @@ -13,7 +13,12 @@
📪 无记录
- + @@ -67,6 +72,14 @@ const toggleFullData = (item) => { fullDataShow.value = !fullDataShow.value } +const ClipSwitchRef = ref() + +const handleDataRemove = () => { + // 此函数须在挂载后执行 + list.value = window.db.dataBase.data + updateShowList(ClipSwitchRef.value.activeTab) +} + const restoreDataBase = () => { // 情况数据库 const flag = window.confirm('确定要清空剪贴板记录吗?') @@ -76,11 +89,11 @@ const restoreDataBase = () => { } } -const ClipSwitchRef = ref() onMounted(() => { // 获取挂载的导航组件 Ref const activeTab = computed(() => ClipSwitchRef.value.activeTab) const toggleNav = ClipSwitchRef.value.toggleNav + const tabs = ClipSwitchRef.value.tabs // 初始化数据 list.value = window.db.dataBase.data @@ -129,9 +142,9 @@ onMounted(() => { (ctrlKey && (key === 'F' || key === 'f')) || (ctrlKey && (key === 'L' || key === 'l')) const isExit = key === 'Escape' if (isTab) { - const list = ['all', 'text', 'image', 'file'] - const index = list.indexOf(activeTab.value) - const target = index === list.length - 1 ? list[0] : list[index + 1] + const tabTypes = tabs.map((item) => item.type) + const index = tabTypes.indexOf(activeTab.value) + const target = index === tabTypes.length - 1 ? tabTypes[0] : tabTypes[index + 1] toggleNav(target) updateShowList(activeTab.value) } else if (isSearch) { From 5e07f667b70f8f4fa3748dbda615c262914c2325 Mon Sep 17 00:00:00 2001 From: ZiuChen <457353192@qq.com> Date: Sun, 4 Sep 2022 13:57:16 +0800 Subject: [PATCH 4/6] =?UTF-8?q?feat:=20=E6=94=B6=E8=97=8F=E5=8A=9F?= =?UTF-8?q?=E8=83=BD=E5=AE=8C=E6=95=B4=E5=AE=9E=E7=8E=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/cpns/ClipItemList.vue | 9 ++++++++- src/views/Main.vue | 5 ++++- 2 files changed, 12 insertions(+), 2 deletions(-) diff --git a/src/cpns/ClipItemList.vue b/src/cpns/ClipItemList.vue index 3cc6e80..ec6c039 100644 --- a/src/cpns/ClipItemList.vue +++ b/src/cpns/ClipItemList.vue @@ -49,7 +49,12 @@
@@ -101,6 +106,8 @@ const handleOperateClick = ({ id, item }) => { window.copy(item) break case 'collect': + item.collect = true // important + window.db.updateDataBaseLocal(db) break case 'remove': window.remove(item) diff --git a/src/views/Main.vue b/src/views/Main.vue index 9576336..763bc5d 100644 --- a/src/views/Main.vue +++ b/src/views/Main.vue @@ -39,7 +39,9 @@ const showList = ref([]) // 展示的数据 const updateShowList = (type) => { // 更新显示列表 showList.value = list.value - .filter((item) => (type === 'all' ? item : item.type === type)) // 是 all则返回所有 否则按照 type返回 + .filter((item) => + type === 'collect' ? item.collect === true : type === 'all' ? item : item.type === type + ) // 是 collect则返回所有收藏 否则按照 type返回 .filter((item) => (filterText.value ? item.type !== 'image' : item)) // 有过滤词 排除掉图片 DataURL .filter( (item) => @@ -48,6 +50,7 @@ const updateShowList = (type) => { : item // 无过滤词 返回全部 ) .slice(0, GAP) // 重新切分懒加载列表 + console.log(showList.value) window.toTop() } From 4290f1b6ce8ecd89bd5d48e078e7dce9f5dfb0bc Mon Sep 17 00:00:00 2001 From: ZiuChen <457353192@qq.com> Date: Sun, 4 Sep 2022 14:00:45 +0800 Subject: [PATCH 5/6] =?UTF-8?q?feat:=20=E8=B0=83=E6=95=B4operation?= =?UTF-8?q?=E9=A2=9C=E8=89=B2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/style/cpns/clip-item-list.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/style/cpns/clip-item-list.less b/src/style/cpns/clip-item-list.less index fc59ea7..97f231e 100644 --- a/src/style/cpns/clip-item-list.less +++ b/src/style/cpns/clip-item-list.less @@ -86,7 +86,7 @@ align-items: center; justify-content: center; font-size: 13px; - color: @text-color-lighter; + color: @primary-color; background: @text-bg-color; margin: 0px 2px; border-radius: 5px; From 11a3bc9f0d04a63f262d1af6c653a3237bcdb3f9 Mon Sep 17 00:00:00 2001 From: ZiuChen <457353192@qq.com> Date: Sun, 4 Sep 2022 14:06:58 +0800 Subject: [PATCH 6/6] =?UTF-8?q?feat:=20=E8=B0=83=E6=95=B4=E6=B8=85?= =?UTF-8?q?=E7=A9=BA=E6=90=9C=E7=B4=A2=E6=A1=86=E6=8C=89=E9=92=AE=E6=A0=B7?= =?UTF-8?q?=E5=BC=8F=20=E8=B0=83=E6=95=B4fulldata=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/style/cpns/clip-full-data.less | 2 +- src/style/cpns/clip-search.less | 4 ++-- src/views/Main.vue | 1 - 3 files changed, 3 insertions(+), 4 deletions(-) diff --git a/src/style/cpns/clip-full-data.less b/src/style/cpns/clip-full-data.less index d2bd479..d7eb858 100644 --- a/src/style/cpns/clip-full-data.less +++ b/src/style/cpns/clip-full-data.less @@ -3,7 +3,7 @@ position: fixed; top: 0; height: 100%; - width: 60%; + width: 70%; color: @text-color; background: @bg-color; padding: 0px 20px 0px 20px; diff --git a/src/style/cpns/clip-search.less b/src/style/cpns/clip-search.less index e2356a8..fcc8ba1 100644 --- a/src/style/cpns/clip-search.less +++ b/src/style/cpns/clip-search.less @@ -19,7 +19,7 @@ } .clip-search-suffix { text-align: center; - position: absolute; + position: fixed; right: 20px; top: 18px; font-size: 13px; @@ -27,7 +27,7 @@ width: 20px; height: 20px; background-color: @nav-bg-color; - border-radius: 20px; + border-radius: 5px; cursor: pointer; &:hover { background-color: @nav-hover-bg-color; diff --git a/src/views/Main.vue b/src/views/Main.vue index 763bc5d..f2ffe42 100644 --- a/src/views/Main.vue +++ b/src/views/Main.vue @@ -50,7 +50,6 @@ const updateShowList = (type) => { : item // 无过滤词 返回全部 ) .slice(0, GAP) // 重新切分懒加载列表 - console.log(showList.value) window.toTop() }