From 8e0510db508a131652ec000b751947ccaba5e789 Mon Sep 17 00:00:00 2001
From: wangjiahao <1522128093@qq.com>
Date: Mon, 20 May 2024 16:20:55 +0800
Subject: [PATCH 1/3] =?UTF-8?q?refactor(=E4=BB=AA=E8=A1=A8=E6=9D=BF):=20?=
 =?UTF-8?q?=E9=9A=90=E8=97=8F=E7=BB=84=E4=BB=B6=E6=B5=8B=E8=AF=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../data-visualization/canvas/CanvasCore.vue  |  1 +
 .../src/custom-component/component-list.ts    |  1 +
 .../independent-hang/ComponentHang.vue        | 45 ++++++++++++++
 .../independent-hang/ComponentHangPopver.vue  | 58 +++++++++++++++++++
 .../editor/editor-style/VQueryChartStyle.vue  | 11 +++-
 .../views/chart/components/editor/index.vue   |  3 +-
 .../dataease/cache/impl/DefaultCacheImpl.java |  4 +-
 7 files changed, 120 insertions(+), 3 deletions(-)
 create mode 100644 core/core-frontend/src/custom-component/independent-hang/ComponentHang.vue
 create mode 100644 core/core-frontend/src/custom-component/independent-hang/ComponentHangPopver.vue

diff --git a/core/core-frontend/src/components/data-visualization/canvas/CanvasCore.vue b/core/core-frontend/src/components/data-visualization/canvas/CanvasCore.vue
index 2e924cb860..ac6d7162b1 100644
--- a/core/core-frontend/src/components/data-visualization/canvas/CanvasCore.vue
+++ b/core/core-frontend/src/components/data-visualization/canvas/CanvasCore.vue
@@ -42,6 +42,7 @@ import PointShadow from '@/components/data-visualization/canvas/PointShadow.vue'
 import DragInfo from '@/components/visualization/common/DragInfo.vue'
 import { activeWatermark } from '@/components/watermark/watermark'
 import { personInfoApi } from '@/api/user'
+import ComponentHangPopver from '@/custom-component/independent-hang/ComponentHangPopver.vue'
 const snapshotStore = snapshotStoreWithOut()
 const dvMainStore = dvMainStoreWithOut()
 const composeStore = composeStoreWithOut()
diff --git a/core/core-frontend/src/custom-component/component-list.ts b/core/core-frontend/src/custom-component/component-list.ts
index 277b7b0fbe..33af3555eb 100644
--- a/core/core-frontend/src/custom-component/component-list.ts
+++ b/core/core-frontend/src/custom-component/component-list.ts
@@ -211,6 +211,7 @@ const list = [
     propValue: '',
     icon: 'other_text',
     innerType: 'VQuery',
+    isHang: false,
     x: 1,
     y: 1,
     sizeX: 72,
diff --git a/core/core-frontend/src/custom-component/independent-hang/ComponentHang.vue b/core/core-frontend/src/custom-component/independent-hang/ComponentHang.vue
new file mode 100644
index 0000000000..e1fe70db71
--- /dev/null
+++ b/core/core-frontend/src/custom-component/independent-hang/ComponentHang.vue
@@ -0,0 +1,45 @@
+<template>
+  <div class="hang-main" @keydown.stop @keyup.stop>
+    <div :key="index" v-for="(config, index) in hangComponentData">
+      <component
+        :is="findComponent(config['component'])"
+        :view="canvasViewInfo[config['id']]"
+        ref="component"
+        class="component"
+        :element="config"
+        :scale="deepScale"
+      />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed, toRefs } from 'vue'
+import findComponent from '@/utils/components'
+const props = defineProps({
+  hangComponentData: {
+    type: Object,
+    required: true
+  },
+  canvasViewInfo: {
+    type: Object,
+    required: true
+  },
+  scale: {
+    type: Number,
+    required: false,
+    default: 100
+  }
+})
+
+const { hangComponentData, scale } = toRefs(props)
+const deepScale = computed(() => scale.value / 100)
+</script>
+
+<style lang="less" scoped>
+.hang-main {
+  overflow: auto;
+  width: 100%;
+  height: 300px;
+}
+</style>
diff --git a/core/core-frontend/src/custom-component/independent-hang/ComponentHangPopver.vue b/core/core-frontend/src/custom-component/independent-hang/ComponentHangPopver.vue
new file mode 100644
index 0000000000..f42f75a95f
--- /dev/null
+++ b/core/core-frontend/src/custom-component/independent-hang/ComponentHangPopver.vue
@@ -0,0 +1,58 @@
+<script setup lang="ts">
+import { computed, toRefs } from 'vue'
+import ComponentHang from '@/custom-component/independent-hang/ComponentHang.vue'
+
+const props = defineProps({
+  componentData: {
+    type: Object,
+    required: true
+  },
+  canvasViewInfo: {
+    type: Object,
+    required: true
+  },
+  themes: {
+    type: String,
+    required: true,
+    default: 'dark'
+  }
+})
+
+const { componentData, canvasViewInfo } = toRefs(props)
+
+const hangComponentData = computed(() =>
+  componentData.value.filter(ele => {
+    return ele.component === 'VQuery' && ele.isHang === true
+  })
+)
+</script>
+
+<template>
+  <el-popover
+    width="300"
+    trigger="click"
+    :show-arrow="false"
+    :popper-class="'custom-popover-' + themes"
+  >
+    <template #reference>
+      <div class="reference-position">
+        <el-button style="margin-right: 16px">隐藏按钮</el-button>
+      </div>
+    </template>
+    <div>
+      <component-hang
+        :hang-component-data="hangComponentData"
+        :canvas-view-info="canvasViewInfo"
+        :scale="100"
+      >
+      </component-hang>
+    </div>
+  </el-popover>
+</template>
+<style lang="less" scoped>
+.reference-position {
+  position: absolute;
+  right: 100px;
+  top: 100px;
+}
+</style>
diff --git a/core/core-frontend/src/views/chart/components/editor/editor-style/VQueryChartStyle.vue b/core/core-frontend/src/views/chart/components/editor/editor-style/VQueryChartStyle.vue
index 08dcd0a708..5934c734f3 100644
--- a/core/core-frontend/src/views/chart/components/editor/editor-style/VQueryChartStyle.vue
+++ b/core/core-frontend/src/views/chart/components/editor/editor-style/VQueryChartStyle.vue
@@ -9,6 +9,10 @@ const state = {
 }
 
 const props = defineProps({
+  element: {
+    type: Object,
+    required: true
+  },
   chart: {
     type: Object,
     required: true
@@ -24,7 +28,7 @@ const props = defineProps({
 })
 const predefineColors = COLOR_PANEL
 
-const { chart, commonBackgroundPop } = toRefs(props)
+const { element, chart, commonBackgroundPop } = toRefs(props)
 </script>
 
 <template>
@@ -33,6 +37,11 @@ const { chart, commonBackgroundPop } = toRefs(props)
       <el-collapse v-model="state.styleActiveNames" class="style-collapse">
         <el-collapse-item :effect="themes" name="component" :title="t('visualization.module')">
           <el-form label-position="top">
+            <el-form-item class="form-item margin-bottom-8" :class="'form-item-' + themes">
+              <el-checkbox :effect="themes" v-model="element.isHang" size="small">
+                隐藏组件
+              </el-checkbox>
+            </el-form-item>
             <el-form-item class="form-item margin-bottom-8" :class="'form-item-' + themes">
               <el-checkbox
                 :effect="themes"
diff --git a/core/core-frontend/src/views/chart/components/editor/index.vue b/core/core-frontend/src/views/chart/components/editor/index.vue
index ccfc534389..5e97a167be 100644
--- a/core/core-frontend/src/views/chart/components/editor/index.vue
+++ b/core/core-frontend/src/views/chart/components/editor/index.vue
@@ -1518,9 +1518,10 @@ const drop = (ev: MouseEvent, type = 'xAxis') => {
           </el-row>
 
           <el-row style="height: calc(100vh - 110px); overflow-y: auto">
-            <div class="query-style-tab" v-if="view.type === 'VQuery'">
+            <div class="query-style-tab" v-if="view.type === 'VQuery' && curComponent">
               <div style="padding-top: 1px">
                 <VQueryChartStyle
+                  :element="curComponent"
                   :common-background-pop="curComponent?.commonBackground"
                   :chart="view"
                   :themes="themes"
diff --git a/sdk/common/src/main/java/io/dataease/cache/impl/DefaultCacheImpl.java b/sdk/common/src/main/java/io/dataease/cache/impl/DefaultCacheImpl.java
index 7dcef203cb..e474022fa7 100644
--- a/sdk/common/src/main/java/io/dataease/cache/impl/DefaultCacheImpl.java
+++ b/sdk/common/src/main/java/io/dataease/cache/impl/DefaultCacheImpl.java
@@ -93,7 +93,9 @@ public class DefaultCacheImpl implements DECacheService {
     @Override
     public void keyRemove(String cacheName, String key) {
         Cache<Object, Object> cache = cacheManager.getCache(cacheName);
-        cache.remove(key);
+        if(cache != null){
+            cache.remove(key);
+        }
     }
 
     @PostConstruct

From 32aa6c1c56a0a58032adac91fe2c82f2b7b83773 Mon Sep 17 00:00:00 2001
From: wangjiahao <1522128093@qq.com>
Date: Mon, 20 May 2024 16:59:38 +0800
Subject: [PATCH 2/3] =?UTF-8?q?refactor(=E6=95=B0=E6=8D=AE=E5=A4=A7?=
 =?UTF-8?q?=E5=B1=8F):=20=E4=BC=98=E5=8C=96=E5=A4=A7=E5=B1=8F=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6=E4=BF=AE=E6=94=B9=E5=90=8D=E7=A7=B0=E6=97=B6=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F=E4=B8=8E=E5=A4=A7=E5=B1=8F=E4=B8=8D=E5=8C=B9=E9=85=8D?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../views/chart/components/editor/index.vue   | 26 ++++++++++++++++---
 1 file changed, 23 insertions(+), 3 deletions(-)

diff --git a/core/core-frontend/src/views/chart/components/editor/index.vue b/core/core-frontend/src/views/chart/components/editor/index.vue
index 5e97a167be..c6c2332292 100644
--- a/core/core-frontend/src/views/chart/components/editor/index.vue
+++ b/core/core-frontend/src/views/chart/components/editor/index.vue
@@ -1512,9 +1512,13 @@ const drop = (ev: MouseEvent, type = 'xAxis') => {
         </div>
         <div v-if="!canvasCollapse.chartAreaCollapse" style="width: 240px" class="view-panel-row">
           <el-row class="editor-title">
-            <span class="name-area" @dblclick="editComponentName" id="component-name">{{
-              view.title
-            }}</span>
+            <span
+              class="name-area"
+              :class="{ 'component-name-dark': themes === 'dark' }"
+              @dblclick="editComponentName"
+              id="component-name"
+              >{{ view.title }}</span
+            >
           </el-row>
 
           <el-row style="height: calc(100vh - 110px); overflow-y: auto">
@@ -2890,6 +2894,7 @@ const drop = (ev: MouseEvent, type = 'xAxis') => {
   <XpackComponent ref="openHandler" jsname="L2NvbXBvbmVudC9lbWJlZGRlZC1pZnJhbWUvT3BlbkhhbmRsZXI=" />
   <Teleport v-if="componentNameEdit" :to="'#component-name'">
     <input
+      :effect="themes"
       width="100%"
       @change="onComponentNameChange"
       ref="componentNameInput"
@@ -4020,4 +4025,19 @@ span {
     height: 100%;
   }
 }
+
+.component-name-dark {
+  input {
+    position: absolute;
+    left: 0;
+    width: 100%;
+    color: @dv-canvas-main-font-color;
+    background-color: #050e21;
+    outline: none;
+    border: 1px solid #295acc;
+    border-radius: 4px;
+    padding: 0 4px;
+    height: 100%;
+  }
+}
 </style>

From 77146b7909e287e3311bd43ae9ba2ededea2ce18 Mon Sep 17 00:00:00 2001
From: wangjiahao <1522128093@qq.com>
Date: Mon, 20 May 2024 17:03:15 +0800
Subject: [PATCH 3/3] =?UTF-8?q?refactor(=E6=95=B0=E6=8D=AE=E5=A4=A7?=
 =?UTF-8?q?=E5=B1=8F):=20=E5=B1=9E=E6=80=A7=E8=AE=BE=E7=BD=AE=E5=8C=BA?=
 =?UTF-8?q?=E5=9F=9F=E6=A0=87=E9=A2=98=E8=B7=9F=E9=9A=8F=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E7=B1=BB=E5=9E=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 core/core-frontend/src/views/data-visualization/index.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/core/core-frontend/src/views/data-visualization/index.vue b/core/core-frontend/src/views/data-visualization/index.vue
index 93b1ddc04d..86063df759 100644
--- a/core/core-frontend/src/views/data-visualization/index.vue
+++ b/core/core-frontend/src/views/data-visualization/index.vue
@@ -409,7 +409,7 @@ eventBus.on('handleNew', handleNew)
       <div style="width: auto; height: 100%" ref="leftSidebarRef">
         <dv-sidebar
           v-if="commonPropertiesShow"
-          :title="'属性'"
+          :title="curComponent['name']"
           :width="240"
           :side-name="'componentProp'"
           :aside-position="'right'"