fix(editor): entity performance in mutations

Novout · Oct 17, 2021 · e12523c · e12523c
1 parent d8111e4
commit e12523c
Show file tree

Hide file tree

Showing 3 changed files with 40 additions and 15 deletions.
diff --git a/src/components/editor/entity/EditorEntityShowPopover.vue b/src/components/editor/entity/EditorEntityShowPopover.vue
@@ -235,6 +235,7 @@
   import { useStore } from 'vuex'
   import { useI18n } from 'vue-i18n'
   import { useFormat } from '@/use/format'
+  import { EntityType } from '@/types/context'
 
   const store = useStore()
   const format = useFormat()
@@ -302,7 +303,7 @@
     state.adjust = false
   }
 
-  const onSwitchEntity = (type: string) => {
+  const onSwitchEntity = (type: EntityType) => {
     store.commit('context/alterInPage', {
       entity: props.entity,
       type,

diff --git a/src/store/module/context.ts b/src/store/module/context.ts
@@ -1,6 +1,11 @@
-import { ContextState, ContextStatePageContent } from '@/types/context'
+import {
+  ContextState,
+  ContextStatePageContent,
+  EntityType,
+} from '@/types/context'
 import { useEnv } from '@/use/env'
 import { useFormat } from '@/use/format'
+import { useUtils } from '../../use/utils'
 
 export default {
   namespaced: true,
@@ -38,7 +43,9 @@ export default {
 
       if (index === -1 || !index) return
 
-      state.entity.splice(index, 1)
+      state.entity = state.entity.filter(
+        (item: ContextStatePageContent) => state.entity.indexOf(item) !== index
+      )
     },
     switchInPage(state: ContextState, obj: Record<any, any>) {
       const index = state.entity.indexOf(obj.entity)
@@ -93,12 +100,14 @@ export default {
 
       if (index === -1) return
 
-      state.entity.splice(index, 0, {
+      const entity = {
         type: payload.type as string,
         raw: useEnv().emptyLine(),
         createdAt: useFormat().actually(),
         updatedAt: useFormat().actually(),
-      } as ContextStatePageContent)
+      } as ContextStatePageContent
+
+      state.entity = useUtils().array().insert(state.entity, index, entity)
     },
     newInPagePosEdit(
       state: ContextState,
@@ -110,29 +119,34 @@ export default {
 
       if (index === -1) return
 
-      state.entity.splice(index + 1, 0, {
+      const entity = {
         type: payload.type as string,
         raw: payload.raw || useEnv().emptyLine(),
         createdAt: useFormat().actually(),
         updatedAt: useFormat().actually(),
-      } as ContextStatePageContent)
+      } as ContextStatePageContent
+
+      state.entity = useUtils()
+        .array()
+        .insert(state.entity, index + 1, entity)
     },
     alterInPage(
       state: ContextState,
-      payload: Record<string, ContextStatePageContent | string>
+      payload: Record<string, ContextStatePageContent | EntityType>
     ) {
       const index = state.entity.indexOf(
         payload.entity as ContextStatePageContent
       )
 
       if (index === -1) return
 
-      state.entity.splice(index, 1, {
-        type: payload.type as string,
-        raw: (payload.entity as ContextStatePageContent).raw,
-        createdAt: useFormat().actually(),
-        updatedAt: useFormat().actually(),
-      } as ContextStatePageContent)
+      const entity = payload.entity as ContextStatePageContent
+
+      state.entity[index].type = payload.type as EntityType
+      state.entity[index].raw = entity.raw
+      state.entity[index].createdAt = useFormat().actually()
+      state.entity[index].updatedAt = useFormat().actually()
+      state.entity[index].external = entity.external || {}
     },
     insertRawInExistentEntity(
       state: ContextState,

diff --git a/src/use/utils.ts b/src/use/utils.ts
@@ -8,5 +8,15 @@ export const useUtils = () => {
     e.stopPropagation()
   }
 
-  return { delay, prevent }
+  const array = () => {
+    const insert = (arr: Array<any>, index: number, ...newItems: any) => [
+      ...arr.slice(0, index),
+      ...newItems,
+      ...arr.slice(index),
+    ]
+
+    return { insert }
+  }
+
+  return { delay, prevent, array }
 }