From 162a13620759c57f1ed35ba8bb0d0136943601ec Mon Sep 17 00:00:00 2001
From: ZiuChen <457353192@qq.com>
Date: Sun, 18 Sep 2022 09:03:30 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E8=AE=BE=E7=BD=AE=E9=A1=B5=E5=88=9D?=
 =?UTF-8?q?=E5=A7=8B=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue           |  7 ++++++-
 src/views/Main.vue    |  4 ++++
 src/views/Notify.vue  | 28 ----------------------------
 src/views/Setting.vue | 13 +++++++++++++
 4 files changed, 23 insertions(+), 29 deletions(-)
 delete mode 100644 src/views/Notify.vue
 create mode 100644 src/views/Setting.vue

diff --git a/src/App.vue b/src/App.vue
index 7698841..2da4bfb 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,9 +1,14 @@
 <template>
   <div class="app">
-    <Main></Main>
+    <Main @show-setting="settingShown = true" v-show="!settingShown"></Main>
+    <Setting v-show="settingShown"></Setting>
   </div>
 </template>
 
 <script setup>
+import { ref } from 'vue'
 import Main from './views/Main.vue'
+import Setting from './views/Setting.vue'
+
+const settingShown = ref(false)
 </script>
diff --git a/src/views/Main.vue b/src/views/Main.vue
index ec12496..6fd0f47 100644
--- a/src/views/Main.vue
+++ b/src/views/Main.vue
@@ -23,6 +23,7 @@
           <span class="clip-switch-btn" @click="isMultiple = !isMultiple">{{
             isMultiple ? '❌ 退出多选' : '👆'
           }}</span>
+          <span class="clip-switch-btn" v-show="!isMultiple" @click="emit('showSetting')">🎨</span>
           <span
             class="clip-switch-btn clip-search-btn"
             v-show="!isMultiple"
@@ -57,6 +58,7 @@
 
 <script setup>
 import { ref, watch, onMounted, computed, nextTick } from 'vue'
+import { ElMessageBox } from 'element-plus'
 import ClipCard from '../cpns/ClipCard.vue'
 import ClipItemList from '../cpns/ClipItemList.vue'
 import ClipFullData from '../cpns/ClipFullData.vue'
@@ -188,6 +190,8 @@ const handleDataRemove = () => {
   updateShowList(ClipSwitchRef.value.activeTab)
 }
 
+const emit = defineEmits(['showSetting'])
+
 const activeTab = ref('all')
 
 onMounted(() => {
diff --git a/src/views/Notify.vue b/src/views/Notify.vue
deleted file mode 100644
index 0fd21ef..0000000
--- a/src/views/Notify.vue
+++ /dev/null
@@ -1,28 +0,0 @@
-<template>
-  <div class="notify">
-    <ClipCard>
-      <template #header>
-        <div class="notify-header">
-          <div class="notify-header-title">通知</div>
-        </div>
-      </template>
-      <div class="notify-content">
-        <div class="notify-content-title">通知标题</div>
-        <div class="notify-content-text">通知内容</div>
-      </div>
-      <template #footer>
-        <div class="notify-footer">
-          <div class="notify-footer-btn">知道了</div>
-        </div>
-      </template>
-    </ClipCard>
-  </div>
-</template>
-
-<script setup>
-import ClipCard from '../cpns/ClipCard.vue'
-</script>
-
-<style lang="less" scoped>
-@import '../style';
-</style>
diff --git a/src/views/Setting.vue b/src/views/Setting.vue
new file mode 100644
index 0000000..a86140e
--- /dev/null
+++ b/src/views/Setting.vue
@@ -0,0 +1,13 @@
+<template>
+  <div class="setting">
+    <el-button>Setting</el-button>
+  </div>
+</template>
+
+<script setup>
+import { ElButton } from 'element-plus'
+</script>
+
+<style lang="less" scoped>
+@import '../style';
+</style>