From dc2f2d8b24d432fd05d752d61df3ee9f06d10710 Mon Sep 17 00:00:00 2001
From: xream <xream@icloud.com>
Date: Sat, 20 Apr 2024 07:45:36 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E8=8A=82=E7=82=B9=E6=93=8D=E4=BD=9C?=
 =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E6=94=B6=E8=B5=B7/=E5=B1=95=E5=BC=80?=
 =?UTF-8?q?=E6=8C=89=E9=92=AE,=20=E6=96=B9=E4=BE=BF=E5=A4=84=E7=90=86?=
 =?UTF-8?q?=E5=A4=9A=E4=B8=AA=E6=93=8D=E4=BD=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                     |  2 +-
 src/components/PreviewPanel.vue  |  1 +
 src/views/editor/ActionBlock.vue | 38 ++++++++++++++++++++++++++++++--
 3 files changed, 38 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index d07410fb8..ecb4884ae 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "sub-store-front-end",
-  "version": "2.14.219",
+  "version": "2.14.220",
   "private": true,
   "scripts": {
     "dev": "vite --host",
diff --git a/src/components/PreviewPanel.vue b/src/components/PreviewPanel.vue
index e5dfc5ffb..0a40d7431 100644
--- a/src/components/PreviewPanel.vue
+++ b/src/components/PreviewPanel.vue
@@ -225,6 +225,7 @@
           background-color: transparent;
           border: none;
           padding: 0;
+          cursor: pointer;
         }
       }
     }
diff --git a/src/views/editor/ActionBlock.vue b/src/views/editor/ActionBlock.vue
index fc280be3a..f6cc08b69 100644
--- a/src/views/editor/ActionBlock.vue
+++ b/src/views/editor/ActionBlock.vue
@@ -2,6 +2,18 @@
   <div class="form-block-wrapper">
     <div v-if="sourceType !== 'file'" class="sticky-title-wrapper actions-title-wrapper">
       <p>{{ $t(`editorPage.subConfig.actions.label`) }}</p>
+      <font-awesome-icon
+        v-if="isCollapsed"
+        @click.stop="setCollapsed(false)"
+        class="toggle fa-toggle"
+        icon="fa-solid fa-toggle-on "
+      />
+      <font-awesome-icon
+        v-else
+        @click.stop="setCollapsed(true)"
+        class="toggle fa-toggle"
+        icon="fa-solid fa-toggle-off"
+      />
       <button @click="popActionsHelp">
         <font-awesome-icon icon="fa-solid fa-circle-question" />
         {{ $t(`editorPage.subConfig.basic.nodeActionsHelp`) }}
@@ -21,7 +33,7 @@
 }" @end="drag = false" @start="drag = true" item-key="id">
       <template #item="{ element }">
         <nut-cell class="list-group-item" aria-hidden="true">
-          <div class="list-group-item-title">
+          <div :class="{ 'list-group-item-title': true, 'collapsed': isCollapsed }">
             <div class="title-text left">
               <span>{{
                 $t(`editorPage.subConfig.nodeActions['${element.type}'].label`)
@@ -47,7 +59,7 @@
               </div>
             </div>
           </div>
-          <Component :is="element.component" :type="element.type" :id="element.id" :sourceType="sourceType"/>
+          <Component v-show="!isCollapsed" :is="element.component" :type="element.type" :id="element.id" :sourceType="sourceType"/>
         </nut-cell>
       </template>
     </Draggable>
@@ -125,6 +137,7 @@ const { t } = useI18n();
 const pasteboard = ref("");
 const showPasteboard = ref(false);
 const drag = ref(true);
+const isCollapsed = ref(localStorage.getItem('actions-block-collapsed') === '1');
 const form = inject<Sub | Collection>('form');
 // 列表渲染的数据
 // 预览开关数组，数组第一项为 id，对应 list 中的同 id 项目，控制该 id 开启关闭预览
@@ -152,6 +165,14 @@ const columns = ref(items);
 // useMousePicker();
 
 
+const setCollapsed = (v) => {
+  isCollapsed.value = v;
+  if (v) {
+    localStorage.setItem('actions-block-collapsed', '1')
+  } else {
+    localStorage.removeItem('actions-block-collapsed')
+  }
+};
 const onButtonClick = (item) => {
   emit('addAction', [item]);
 };
@@ -342,6 +363,12 @@ const pop = (type: string, tipsDes: string) => {
     color: var(--comment-text-color);
     border-bottom: 1px solid var(--divider-color);
 
+    &.collapsed {
+      padding-bottom: 0;
+      margin-bottom: 0;
+      border-bottom: none;
+    }
+
     .left {
       font-size: 12px;
       font-weight: bold;
@@ -435,6 +462,13 @@ const pop = (type: string, tipsDes: string) => {
 .actions-title-wrapper {
   display: flex;
   justify-content: space-between;
+  align-items: center;
+
+  .toggle {
+    cursor: pointer;
+    margin-left: 18px;
+    margin-right: auto;
+  }
 
   button {
     background: none;