Pre Merge pull request !252 from 陈晨成/master-fetch-dev

Merge pull request !278 from linjy/fix-perfGain

src/utils/utils.ts

@@ -286,8 +286,7 @@ export const JSONStringify = <T>(data: T) => {
         return null
       }
       return val
-    },
+    }
-    2
   )
 }
 

src/views/chart/ContentEdit/components/EditGroup/index.vue

@@ -8,7 +8,6 @@
       :hiddenPoint="true"
       :class="animationsClass(groupData.styles.animations)"
       :style="{
-        ...useComponentStyle(groupData.attr, groupIndex),
         ...useSizeStyle(groupData.attr),
         ...getFilterStyle(groupData.styles),
         ...getTransformStyle(groupData.styles),
@@ -28,9 +27,6 @@
         :index="groupIndex"
         :item="item"
         :hiddenPoint="true"
-        :style="{
-          ...useComponentStyle(item.attr, groupIndex)
-        }"
       >
         <component
           class="edit-content-chart"
@@ -60,7 +56,7 @@ import { animationsClass, getFilterStyle, getTransformStyle, getBlendModeStyle,
 import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
 import { useContextMenu, divider } from '@/views/chart/hooks/useContextMenu.hook'
 import { useMouseHandle } from '../../hooks/useDrag.hook'
-import { useComponentStyle, useSizeStyle } from '../../hooks/useStyle.hook'
+import { useSizeStyle } from '../../hooks/useStyle.hook'
 import { EditShapeBox } from '../../components/EditShapeBox'
 
 const props = defineProps({

src/views/chart/ContentEdit/components/EditShapeBox/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="go-shape-box" :class="{ lock, hide }">
+  <div class="go-shape-box" :class="{ lock, hide }" :style="positionStyle">
     <slot></slot>
     <!-- 锚点 -->
     <template v-if="!hiddenPoint">
@@ -38,6 +38,10 @@ const props = defineProps({
   hiddenPoint: {
     type: Boolean,
     required: false
+  },
+  index: {
+    type: Number,
+    default: 0
   }
 })
 
@@ -80,6 +84,17 @@ const lock = computed(() => {
 const hide = computed(() => {
   return props.item.status.hide
 })
+
+// 位置样式
+const positionStyle = computed(() => {
+  const attr = props.item?.attr
+  if (!attr) return {}
+  return {
+    zIndex: props.index + 1,
+    left: `${attr.x}px`,
+    top: `${attr.y}px`
+  }
+})
 </script>
 
 <style lang="scss" scoped>

src/views/chart/ContentEdit/index.vue

@@ -39,7 +39,6 @@
                 :data-id="item.id"
                 :index="index"
                 :style="{
-                  ...useComponentStyle(item.attr, index),
                   ...(getBlendModeStyle(item.styles) as any),
                 }"
                 :item="item"
@@ -106,7 +105,7 @@ import { useLayout } from './hooks/useLayout.hook'
 import { useAddKeyboard } from '../hooks/useKeyboard.hook'
 import { useSync } from '../hooks/useSync.hook'
 import { dragHandle, dragoverHandle, mousedownHandleUnStop, useMouseHandle } from './hooks/useDrag.hook'
-import { useComponentStyle, useSizeStyle } from './hooks/useStyle.hook'
+import { useSizeStyle } from './hooks/useStyle.hook'
 import { useInitVChartsTheme } from '@/hooks'
 
 import { ContentBox } from '../ContentBox/index'

src/views/chart/ContentHeader/headerRightBtn/index.vue

@@ -166,7 +166,7 @@ const btnList = [
   },
   {
     key: 'preview',
-    title: () => '预览',
+    title: () => '本地预览',
     type: () => 'default',
     icon: renderIcon(BrowsersOutlineIcon),
     event: previewHandle

src/views/chart/ContentLayers/index.vue

@@ -65,7 +65,6 @@
 <script setup lang="ts">
 import { computed, ref, watch } from 'vue'
 import Draggable from 'vuedraggable'
-import cloneDeep from 'lodash/cloneDeep'
 import { ContentBox } from '../ContentBox/index'
 import { useChartLayoutStore } from '@/store/modules/chartLayoutStore/chartLayoutStore'
 import { ChartLayoutStoreEnum, LayerModeEnum } from '@/store/modules/chartLayoutStore/chartLayoutStore.d'
@@ -96,7 +95,7 @@ const layerMode = ref<LayerModeEnum>(chartLayoutStore.getLayerType)
 
 // 逆序展示
 const reverseList = computed(() => {
-  const list: Array<CreateComponentType | CreateComponentGroupType> = cloneDeep(chartEditStore.getComponentList)
+  const list: Array<CreateComponentType | CreateComponentGroupType> = [...chartEditStore.getComponentList]
   return list.reverse()
 })
 

src/views/project/items/components/ProjectItemsCard/index.vue

@@ -122,7 +122,8 @@ const selectOptions = ref([
   {
     label: renderLang('global.r_preview'),
     key: 'preview',
-    icon: renderIcon(BrowsersOutlineIcon)
+    icon: renderIcon(BrowsersOutlineIcon),
+    show: props.cardData?.release
   },
   {
     label: props.cardData?.release
@@ -136,7 +137,7 @@ const selectOptions = ref([
     key: 'delete',
     icon: renderIcon(TrashIcon)
   }
-])
+].filter(item => item.show !== false))
 
 const handleSelect = (key: string) => {
   switch (key) {