diff --git a/src/components/DynamicComponent.vue b/src/components/DynamicComponent.vue
index b3762a7..d504d89 100644
--- a/src/components/DynamicComponent.vue
+++ b/src/components/DynamicComponent.vue
@@ -19,7 +19,7 @@ const props = defineProps({
});
onMounted(() => {
- console.log(props.componentData)
+ // console.log(props.componentData)
})
const componentId = computed(() => props.componentData?.id || '');
@@ -31,6 +31,9 @@ const componentClass = computed(() => props.componentData?.class || []);
const componentStyle = computed(() => props.componentData?.style || []);
const componentSlots = computed(() => props.componentData?.slots || []);
+const updateScheme=()=>{
+
+}
const handleClick = () => {
console.log(`Div with id ${componentId.value} was clicked.`);
// 你可以在这里执行更多的逻辑,例如发出一个事件或调用一个方法
diff --git a/src/components/MainView.vue b/src/components/MainView.vue
index 726e7c5..358bf9c 100644
--- a/src/components/MainView.vue
+++ b/src/components/MainView.vue
@@ -35,7 +35,8 @@
-
+ {{ store.scheme }}
+
@@ -50,14 +51,44 @@ import { useDraggable } from 'vue-draggable-plus';
import { uuid } from 'lsp-uuid';
import { IPageComponent } from '../type/IPageComponent';
import { componentScheme } from '../schemes/scheme';
+import { useSchemeStore } from '../stores/useSchemeStore'
+const baseScheme =
+{
+ "type": "AdaptivePage",
+ "name": "AdaptivePage",
+ "id": uuid(),
+ "version": "2.0",
+ "props": {},
+ "class": "",
+ "style": "",
+ "variables": {},
+ "dataSources": {},
+ "functions": {},
+ "orchestrations": {},
+ "events": {},
+ "slots": {},
+ "header": {},
+ "footer": {},
+ "children": {},
+ "meta": {}
+}
const componentsList = ref([]);
const list = ref([]);
const el2 = ref();
+const store = useSchemeStore()
+
+const initScheme = () => {
+
+ store.initScheme(baseScheme)
+}
onMounted(() => {
const loadedComponents = Object.values(componentScheme);
componentsList.value = loadedComponents;
+ initScheme();
+ // @ts-ignore
+ list.value.push(baseScheme)
});
useDraggable(el2, componentsList, {
@@ -93,17 +124,20 @@ useDraggable(el2, componentsList, {
display: flex;
flex-wrap: nowrap;
align-items: stretch;
- width: 100%; /* Ensure the container takes full width */
+ width: 100%;
+ /* Ensure the container takes full width */
}
.component-area {
flex-grow: 1;
- max-width: 72px; /* Fixed width or can be adjusted */
+ max-width: 72px;
+ /* Fixed width or can be adjusted */
}
.component-list {
flex-grow: 1;
- max-width: 250px; /* Fixed width or can be adjusted */
+ max-width: 250px;
+ /* Fixed width or can be adjusted */
}
.component-list-inner {
@@ -141,8 +175,4 @@ useDraggable(el2, componentsList, {
overflow-y: auto;
border: 1px solid black;
}
-
-.test-area {
- /* 测试区域样式 */
-}
\ No newline at end of file
diff --git a/src/components/TestComponent.vue b/src/components/TestComponent.vue
index fdac0a9..f8e0d65 100644
--- a/src/components/TestComponent.vue
+++ b/src/components/TestComponent.vue
@@ -1,7 +1,7 @@