From 4576b44c29def0b1c70d1885bd153bc6027a133a Mon Sep 17 00:00:00 2001
From: ZiuChen <457353192@qq.com>
Date: Thu, 8 Sep 2022 18:45:15 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E8=B0=83=E6=95=B4=E6=82=AC?=
 =?UTF-8?q?=E6=B5=AE=E6=8C=89=E9=92=AE=E4=BB=A3=E7=A0=81=E5=AE=9E=E7=8E=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/cpns/ClipFloatBtn.vue          | 20 +++++++++-----------
 src/style/cpns/clip-float-btn.less |  3 +++
 src/views/Main.vue                 | 12 +++++++++++-
 3 files changed, 23 insertions(+), 12 deletions(-)

diff --git a/src/cpns/ClipFloatBtn.vue b/src/cpns/ClipFloatBtn.vue
index 0499d5c..22137de 100644
--- a/src/cpns/ClipFloatBtn.vue
+++ b/src/cpns/ClipFloatBtn.vue
@@ -1,18 +1,16 @@
 <template>
-  <div class="clip-float-btn">
-    <div @click="restoreDataBase">🧭</div>
+  <div class="clip-float-btn" @click="handleBtnClick">
+    <div>{{ props.icon }}</div>
   </div>
 </template>
 
 <script setup>
-// const emit = defineEmits(['onBtnClick'])
-// const handleBtnClick = () => emit('onBtnClick')
-const restoreDataBase = () => {
-  // 清空数据库
-  const flag = window.confirm('确定要清空剪贴板记录吗?')
-  if (flag) {
-    window.db.emptyDataBase()
-    updateShowList('all')
+const emit = defineEmits(['onBtnClick'])
+const handleBtnClick = () => emit('onBtnClick')
+const props = defineProps({
+  icon: {
+    type: String,
+    default: '🌎'
   }
-}
+})
 </script>
diff --git a/src/style/cpns/clip-float-btn.less b/src/style/cpns/clip-float-btn.less
index 6587bde..cb054dc 100644
--- a/src/style/cpns/clip-float-btn.less
+++ b/src/style/cpns/clip-float-btn.less
@@ -19,4 +19,7 @@
     background-color: @primary-color;
     transition: all 0.15s;
   }
+  div {
+    margin-bottom: 5px;
+  }
 }
diff --git a/src/views/Main.vue b/src/views/Main.vue
index b5c72c1..f6da365 100644
--- a/src/views/Main.vue
+++ b/src/views/Main.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="main">
-    <ClipFloatBtn></ClipFloatBtn>
+    <ClipFloatBtn :icon="'🧭'" @onBtnClick="restoreDataBase"></ClipFloatBtn>
     <ClipFullData
       :isShow="fullDataShow"
       :fullData="fullData"
@@ -67,6 +67,15 @@ const updateShowList = (type) => {
   window.toTop()
 }
 
+const restoreDataBase = () => {
+  // 清空数据库
+  const flag = window.confirm('确定要清空剪贴板记录吗?')
+  if (flag) {
+    window.db.emptyDataBase()
+    updateShowList('all')
+  }
+}
+
 const handleNavClick = (type) => {
   updateShowList(type)
   offset.value = 0 // 重置懒加载偏移量
@@ -160,6 +169,7 @@ onMounted(() => {
       }
     } else if (ctrlKey || metaKey || isArrow || isEnter) {
       // 仅有 Ctrl时 什么也不执行 (utools模拟执行粘贴时触发)
+      e.preventDefault()
     } else {
       window.focus() // 其他键盘事件 直接聚焦搜索框
     }