From 928ec2d5c3bc21ba446089ead6646f84079d304c Mon Sep 17 00:00:00 2001
From: pipipi-pikachu <pipipi_pikachu@163.com>
Date: Wed, 31 Mar 2021 17:01:03 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20=E6=A0=B7=E5=BC=8F=E5=92=8C=E4=BB=A3?=
 =?UTF-8?q?=E7=A0=81=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/Editor/EditorHeader/index.vue       | 38 ++++++-------------
 src/views/Editor/Toolbar/SlideStylePanel.vue  | 22 +++++------
 .../element/TableElement/CustomTextarea.vue   |  9 ++++-
 .../element/TableElement/EditableTable.vue    |  2 -
 4 files changed, 30 insertions(+), 41 deletions(-)

diff --git a/src/views/Editor/EditorHeader/index.vue b/src/views/Editor/EditorHeader/index.vue
index ffd31e40..81a9a7ce 100644
--- a/src/views/Editor/EditorHeader/index.vue
+++ b/src/views/Editor/EditorHeader/index.vue
@@ -1,10 +1,8 @@
 <template>
   <div class="editor-header">
     <div class="left">
-      <Dropdown :trigger="['click']" @visibleChange="visible => editDropdownVisible = visible">
-        <div class="menu-item" :class="['dropdown-menu', { 'active': editDropdownVisible }]">
-          <IconEdit /> <span class="text">编辑</span>
-        </div>
+      <Dropdown :trigger="['click']">
+        <div class="menu-item"><IconEdit /> <span class="text">编辑</span></div>
         <template #overlay>
           <Menu>
             <MenuItem @click="undo()">撤销</MenuItem>
@@ -16,10 +14,8 @@
           </Menu>
         </template>
       </Dropdown>
-      <Dropdown :trigger="['click']" @visibleChange="visible => screenDropdownVisible = visible">
-        <div class="menu-item" :class="['dropdown-menu', { 'active': screenDropdownVisible }]">
-          <IconPpt /> <span class="text">演示</span>
-        </div>
+      <Dropdown :trigger="['click']">
+        <div class="menu-item"><IconPpt /> <span class="text">演示</span></div>
         <template #overlay>
           <Menu>
             <MenuItem @click="enterScreeningFromStart()">从头开始</MenuItem>
@@ -27,10 +23,8 @@
           </Menu>
         </template>
       </Dropdown>
-      <Dropdown :trigger="['click']" @visibleChange="visible => helpDropdownVisible = visible">
-        <div class="menu-item" :class="['dropdown-menu', { 'active': helpDropdownVisible }]">
-          <IconHelpcenter /> <span class="text">帮助</span>
-        </div>
+      <Dropdown :trigger="['click']">
+        <div class="menu-item"><IconHelpcenter /> <span class="text">帮助</span></div>
         <template #overlay>
           <Menu>
             <MenuItem @click="openDoc()">开发文档</MenuItem>
@@ -84,10 +78,6 @@ export default defineComponent({
     const { createSlide, deleteSlide, resetSlides } = useSlideHandler()
     const { redo, undo } = useHistorySnapshot()
 
-    const editDropdownVisible = ref(false)
-    const screenDropdownVisible = ref(false)
-    const helpDropdownVisible = ref(false)
-
     const showGridLines = computed(() => store.state.showGridLines)
     const toggleGridLines = () => {
       store.commit(MutationTypes.SET_GRID_LINES_STATE, !showGridLines.value)
@@ -111,9 +101,6 @@ export default defineComponent({
       resetSlides,
       openDoc,
       hotkeyDrawerVisible,
-      editDropdownVisible,
-      screenDropdownVisible,
-      helpDropdownVisible,
     }
   },
 })
@@ -140,18 +127,15 @@ export default defineComponent({
   align-items: center;
   font-size: 13px;
   padding: 0 10px;
+  transition: background-color .2s;
   cursor: pointer;
 
+  &:hover {
+    background-color: $lightGray;
+  }
+
   .text {
     margin-left: 4px;
   }
 }
-
-.dropdown-menu {
-  transition: background-color .2s;
-
-  &.active {
-    background-color: $lightGray;
-  }
-}
 </style>
\ No newline at end of file
diff --git a/src/views/Editor/Toolbar/SlideStylePanel.vue b/src/views/Editor/Toolbar/SlideStylePanel.vue
index cf443474..9db049ea 100644
--- a/src/views/Editor/Toolbar/SlideStylePanel.vue
+++ b/src/views/Editor/Toolbar/SlideStylePanel.vue
@@ -98,6 +98,17 @@
 
     <Divider />
 
+    <div class="row">
+      <div style="flex: 2;">画布尺寸：</div>
+      <Select style="flex: 3;" :value="viewportRatio" @change="value => updateViewportRatio(value)">
+        <SelectOption :value="0.5625">宽屏 16 : 9</SelectOption>
+        <SelectOption :value="0.625">宽屏 16 ：10</SelectOption>
+        <SelectOption :value="0.75">标准 4 ：3</SelectOption>
+      </Select>
+    </div>
+
+    <Divider />
+
     <div class="title">全局主题</div>
     <div class="row">
       <div style="flex: 2;">字体：</div>
@@ -176,17 +187,6 @@
     </div>
 
     <div class="row"><Button style="flex: 1;" @click="applyThemeAllSlide()">应用主题到全部</Button></div>
-
-    <Divider />
-
-    <div class="row">
-      <div style="flex: 2;">画布尺寸：</div>
-      <Select style="flex: 3;" :value="viewportRatio" @change="value => updateViewportRatio(value)">
-        <SelectOption :value="0.5625">宽屏 16 : 9</SelectOption>
-        <SelectOption :value="0.625">宽屏 16 ：10</SelectOption>
-        <SelectOption :value="0.75">标准 4 ：3</SelectOption>
-      </Select>
-    </div>
   </div>
 </template>
 
diff --git a/src/views/components/element/TableElement/CustomTextarea.vue b/src/views/components/element/TableElement/CustomTextarea.vue
index 5f216897..c3643b8a 100644
--- a/src/views/components/element/TableElement/CustomTextarea.vue
+++ b/src/views/components/element/TableElement/CustomTextarea.vue
@@ -81,4 +81,11 @@ export default defineComponent({
     }
   },
 })
-</script>
\ No newline at end of file
+</script>
+
+<style lang="scss" scoped>
+.custom-textarea {
+  border: 0;
+  outline: 0;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/components/element/TableElement/EditableTable.vue b/src/views/components/element/TableElement/EditableTable.vue
index d13de441..f9099038 100644
--- a/src/views/components/element/TableElement/EditableTable.vue
+++ b/src/views/components/element/TableElement/EditableTable.vue
@@ -706,8 +706,6 @@ table {
   .cell-text {
     min-height: 32px;
     padding: 5px;
-    border: 0;
-    outline: 0;
     line-height: 1.5;
     user-select: none;
     cursor: text;