From 91471748f3d0d90d393c5f4969832e4a47135143 Mon Sep 17 00:00:00 2001
From: lhj <403133128@qq.com>
Date: Sat, 9 Nov 2024 23:18:21 +0800
Subject: [PATCH] =?UTF-8?q?fix:=E5=AE=8C=E5=96=84=E6=A0=B9=E6=8D=AEid?=
 =?UTF-8?q?=E6=9F=A5=E8=AF=A2=E5=B9=B6=E4=BF=AE=E6=94=B9=E5=AF=B9=E5=BA=94?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6=E7=9A=84=E6=95=B0=E6=8D=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 preview/views/MainView.vue             | 10 +++--
 src/schemes/components/RadioGroup.json | 43 ++++++++++++++++++++-
 src/schemes/scheme.json                | 43 ++++++++++++++++++++-
 src/schemes/scheme.ts                  | 43 ++++++++++++++++++++-
 src/stores/useSchemeStore.ts           | 52 +++++++++++++++++---------
 5 files changed, 163 insertions(+), 28 deletions(-)

diff --git a/preview/views/MainView.vue b/preview/views/MainView.vue
index 813e067..157bb7d 100644
--- a/preview/views/MainView.vue
+++ b/preview/views/MainView.vue
@@ -36,7 +36,7 @@
             @update="onPreviewUpdate"
             @stop="onPreviewStop"
         >
-          {{store.previewScheme}}
+<!--          {{store.previewScheme}}-->
           <DynamicComponent v-for="component in store.previewScheme" :key="component.id" :componentData="component">
             {{ component.id }}
           </DynamicComponent>
@@ -51,6 +51,7 @@
 </template>
 
 <script setup lang="ts">
+import {RadioGroup,Radio} from '@arco-design/web-vue'
 import {onMounted, ref, watch} from 'vue';
 import {uuid} from 'lsp-uuid';
 import {componentScheme} from "@/schemes/scheme";
@@ -58,7 +59,7 @@ import {useSchemeStore} from '@/stores/useSchemeStore';
 import {IComponent} from "@/type/IComponent";
 import DynamicComponent from "@/components/DynamicComponent.vue";
 import PropertyEditor from "@/components/PropertyEditor.vue";
-import {VueDraggable} from "vue-draggable-plus";
+import {DraggableEvent, VueDraggable} from "vue-draggable-plus";
 
 let list0 = ref([])
 
@@ -132,7 +133,7 @@ onMounted(() => {
   // @ts-ignore
 });
 
-function clone(element: Record<'name' | 'id' | 'type' | 'props' | 'class' | 'text' | 'style' | 'slots'|'visible'|'disable', IComponent>) {
+function clone(element: Record<'name' | 'id' | 'type' | 'props' | 'class' | 'text' | 'style' | 'slots'|'visible'|'disable'|'children', IComponent>) {
   console.log("clone", element)
   return {
     id: `${element.type}-${uuid()}`,
@@ -142,7 +143,7 @@ function clone(element: Record<'name' | 'id' | 'type' | 'props' | 'class' | 'tex
     class: element.class,
     designer: '',
     text: element.text,
-    children: [],
+    children: element.children||[],
     style: element.style,
     visible: element.visible,
     slots: element.slots,
@@ -154,6 +155,7 @@ function clone(element: Record<'name' | 'id' | 'type' | 'props' | 'class' | 'tex
 
 const onEnd = (event: DraggableEvent) => {
   console.log("onEnd", event)
+  store.nowComponentsData=event.clonedData
   // const {oldDraggableIndex} = obj;
   // store.previewData(store.component[oldDraggableIndex]);
   // store.nowComponentsData(store.component[oldDraggableIndex]);
diff --git a/src/schemes/components/RadioGroup.json b/src/schemes/components/RadioGroup.json
index db2e111..d8bd25e 100644
--- a/src/schemes/components/RadioGroup.json
+++ b/src/schemes/components/RadioGroup.json
@@ -4,7 +4,9 @@
   "id": "radiogroup",
   "designer": {},
   "text": "",
-  "props": {},
+  "props": {
+    "type": "button"
+  },
   "style": "",
   "class": "",
   "visible": "",
@@ -12,5 +14,42 @@
   "disable": "",
   "events": {},
   "loop": {},
-  "children": []
+  "children": [
+    {
+      "type": "Radio",
+      "name": "radio",
+      "id": "radio",
+      "designer": {},
+      "text": "广州",
+      "props": {
+        "value": "guangzhou"
+      },
+      "style": "",
+      "class": "",
+      "visible": "",
+      "slots": {},
+      "disable": "",
+      "events": {},
+      "loop": {},
+      "children": []
+    },
+    {
+      "type": "Radio",
+      "name": "radio",
+      "id": "radio",
+      "designer": {},
+      "text": "深圳",
+      "props": {
+        "value": "shenzhen"
+      },
+      "style": "",
+      "class": "",
+      "visible": "",
+      "slots": {},
+      "disable": "",
+      "events": {},
+      "loop": {},
+      "children": []
+    }
+  ]
 }
\ No newline at end of file
diff --git a/src/schemes/scheme.json b/src/schemes/scheme.json
index 254e392..63b8b36 100644
--- a/src/schemes/scheme.json
+++ b/src/schemes/scheme.json
@@ -1051,7 +1051,9 @@
     "id": "radiogroup",
     "designer": {},
     "text": "",
-    "props": {},
+    "props": {
+      "type": "button"
+    },
     "style": "",
     "class": "",
     "visible": "",
@@ -1059,7 +1061,44 @@
     "disable": "",
     "events": {},
     "loop": {},
-    "children": []
+    "children": [
+      {
+        "type": "Radio",
+        "name": "radio",
+        "id": "radio",
+        "designer": {},
+        "text": "广州",
+        "props": {
+          "value": "guangzhou"
+        },
+        "style": "",
+        "class": "",
+        "visible": "",
+        "slots": {},
+        "disable": "",
+        "events": {},
+        "loop": {},
+        "children": []
+      },
+      {
+        "type": "Radio",
+        "name": "radio",
+        "id": "radio",
+        "designer": {},
+        "text": "深圳",
+        "props": {
+          "value": "shenzhen"
+        },
+        "style": "",
+        "class": "",
+        "visible": "",
+        "slots": {},
+        "disable": "",
+        "events": {},
+        "loop": {},
+        "children": []
+      }
+    ]
   },
   "Rate": {
     "type": "Rate",
diff --git a/src/schemes/scheme.ts b/src/schemes/scheme.ts
index a66992d..1095816 100644
--- a/src/schemes/scheme.ts
+++ b/src/schemes/scheme.ts
@@ -1051,7 +1051,9 @@ export const componentScheme = {
     "id": "radiogroup",
     "designer": {},
     "text": "",
-    "props": {},
+    "props": {
+      "type": "button"
+    },
     "style": "",
     "class": "",
     "visible": "",
@@ -1059,7 +1061,44 @@ export const componentScheme = {
     "disable": "",
     "events": {},
     "loop": {},
-    "children": []
+    "children": [
+      {
+        "type": "Radio",
+        "name": "radio",
+        "id": "radio",
+        "designer": {},
+        "text": "广州",
+        "props": {
+          "value": "guangzhou"
+        },
+        "style": "",
+        "class": "",
+        "visible": "",
+        "slots": {},
+        "disable": "",
+        "events": {},
+        "loop": {},
+        "children": []
+      },
+      {
+        "type": "Radio",
+        "name": "radio",
+        "id": "radio",
+        "designer": {},
+        "text": "深圳",
+        "props": {
+          "value": "shenzhen"
+        },
+        "style": "",
+        "class": "",
+        "visible": "",
+        "slots": {},
+        "disable": "",
+        "events": {},
+        "loop": {},
+        "children": []
+      }
+    ]
   },
   "Rate": {
     "type": "Rate",
diff --git a/src/stores/useSchemeStore.ts b/src/stores/useSchemeStore.ts
index 3ee0a17..219d352 100644
--- a/src/stores/useSchemeStore.ts
+++ b/src/stores/useSchemeStore.ts
@@ -1,5 +1,8 @@
-import {defineStore} from 'pinia'
-import {IPageComponent} from '@/type/IPageComponent';
+import { defineStore } from 'pinia';
+import { IPageComponent } from '@/type/IPageComponent';
+
+// 缓存对象
+const idToObjectCache = new Map<string, IPageComponent>();
 
 function findObjectById(obj, targetId) {
     if (Array.isArray(obj)) {
@@ -27,21 +30,34 @@ export const useSchemeStore = defineStore('scheme', {
         previewScheme: [],
         nowComponentsData: {}
     }),
-    actions:
-        {
-            initPreviewScheme(value) {
-                this.previewScheme = value
-                this.nowComponentsData = value[0]
-            },
-            initComponents(value) {
-                this.components = value
-            },
-            getSchemeObj(id) {
-                return findObjectById(this.previewScheme, id)
-            },
-            updateScheme() {
-
+    actions: {
+        initPreviewScheme(value) {
+            this.previewScheme = value;
+            this.nowComponentsData = value[0];
+            // 清空缓存
+            idToObjectCache.clear();
+        },
+        initComponents(value) {
+            this.components = value;
+        },
+        getSchemeObj(id) {
+            // 检查缓存
+            if (idToObjectCache.has(id)) {
+                return idToObjectCache.get(id);
+            }
+            // 查找并缓存
+            const obj = findObjectById(this.previewScheme, id);
+            if (obj) {
+                idToObjectCache.set(id, obj);
+            }
+            return obj;
+        },
+        updateScheme(id, updates) {
+            const obj = this.getSchemeObj(id);
+            if (obj) {
+                // 更新对象属性
+                Object.assign(obj, updates);
             }
-
         }
-})
\ No newline at end of file
+    }
+});
\ No newline at end of file