Compare commits
3 Commits
a43c13991b
...
818f988c4b
| Author | SHA1 | Date | |
|---|---|---|---|
| 818f988c4b | |||
| a478f34c46 | |||
| ff8e8b946c |
2
package-lock.json
generated
2
package-lock.json
generated
@ -15,7 +15,7 @@
|
|||||||
"lsp-uuid": "^3.2.0",
|
"lsp-uuid": "^3.2.0",
|
||||||
"ts-node": "^10.9.2",
|
"ts-node": "^10.9.2",
|
||||||
"vue": "^3.2.25",
|
"vue": "^3.2.25",
|
||||||
"vue-draggable-plus": "^0.5.2"
|
"vue-draggable-plus": "^0.5.3"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@arco-design/web-vue": "^2.56.0",
|
"@arco-design/web-vue": "^2.56.0",
|
||||||
|
|||||||
@ -17,7 +17,7 @@
|
|||||||
"lsp-uuid": "^3.2.0",
|
"lsp-uuid": "^3.2.0",
|
||||||
"ts-node": "^10.9.2",
|
"ts-node": "^10.9.2",
|
||||||
"vue": "^3.2.25",
|
"vue": "^3.2.25",
|
||||||
"vue-draggable-plus": "^0.5.2"
|
"vue-draggable-plus": "^0.5.3"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@arco-design/web-vue": "^2.56.0",
|
"@arco-design/web-vue": "^2.56.0",
|
||||||
|
|||||||
@ -11,6 +11,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="flex-grow: 1; flex-shrink: 0; overflow-y: auto;">
|
<div style="flex-grow: 1; flex-shrink: 0; overflow-y: auto;">
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<div
|
<div
|
||||||
style="display: flex; flex-direction: row; width: 100%; height: 500px; overflow-y: auto; border: 1px solid black;">
|
style="display: flex; flex-direction: row; width: 100%; height: 500px; overflow-y: auto; border: 1px solid black;">
|
||||||
@ -29,6 +30,7 @@
|
|||||||
<div>
|
<div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -39,7 +41,7 @@ import { onMounted, ref } from 'vue';
|
|||||||
import NestedFunction from './NestedFunction.vue';
|
import NestedFunction from './NestedFunction.vue';
|
||||||
import DynamicComponent from './DynamicComponent.vue';
|
import DynamicComponent from './DynamicComponent.vue';
|
||||||
|
|
||||||
import { useDraggable } from 'vue-draggable-plus';
|
import { SortableEvent, useDraggable, VueDraggable } from 'vue-draggable-plus';
|
||||||
import { uuid } from 'lsp-uuid';
|
import { uuid } from 'lsp-uuid';
|
||||||
import { IComponent } from '../type/IComponent.ts';
|
import { IComponent } from '../type/IComponent.ts';
|
||||||
import { componentScheme } from '../schemes/scheme.ts';
|
import { componentScheme } from '../schemes/scheme.ts';
|
||||||
@ -48,7 +50,6 @@ const componentsList = ref<any[]>([]);
|
|||||||
|
|
||||||
|
|
||||||
const list = ref<IComponent[]>([]);
|
const list = ref<IComponent[]>([]);
|
||||||
|
|
||||||
const el2 = ref();
|
const el2 = ref();
|
||||||
|
|
||||||
|
|
||||||
@ -61,6 +62,48 @@ onMounted(() => {
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
const el = ref()
|
||||||
|
|
||||||
|
const onStart = (e: SortableEvent) => {
|
||||||
|
console.log('start', e)
|
||||||
|
}
|
||||||
|
|
||||||
|
const onEnd = (e: SortableEvent) => {
|
||||||
|
console.log('onEnd', e)
|
||||||
|
}
|
||||||
|
|
||||||
|
const onUpdate = () => {
|
||||||
|
console.log('update')
|
||||||
|
}
|
||||||
|
|
||||||
|
useDraggable(el, componentsList, {
|
||||||
|
animation: 150,
|
||||||
|
group: { name: 'designer', pull: 'clone', put: false },
|
||||||
|
sort: false,
|
||||||
|
onClone() {
|
||||||
|
console.log('clone')
|
||||||
|
},
|
||||||
|
clone(element: Record<'id' | 'name' | 'type' | 'children' | 'props' | 'text' | 'class' | 'style' | 'slots', any>) {
|
||||||
|
return {
|
||||||
|
id: `${element.id}-${uuid()}`,
|
||||||
|
name: element.name,
|
||||||
|
type: element.type,
|
||||||
|
props: element.props,
|
||||||
|
class: element.class,
|
||||||
|
designer: '',
|
||||||
|
text: element.text,
|
||||||
|
children: [],
|
||||||
|
style: element.style,
|
||||||
|
visible: "",
|
||||||
|
slots: element.slots,
|
||||||
|
disable: "",
|
||||||
|
events: {},
|
||||||
|
loop: {},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
useDraggable(el2, componentsList, {
|
useDraggable(el2, componentsList, {
|
||||||
animation: 150,
|
animation: 150,
|
||||||
group: { name: 'designer', pull: 'clone', put: false },
|
group: { name: 'designer', pull: 'clone', put: false },
|
||||||
|
|||||||
15
src/schemes/components/AdaptivePage.json
Normal file
15
src/schemes/components/AdaptivePage.json
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
{
|
||||||
|
"type": "AdaptivePage",
|
||||||
|
"version": "2.0",
|
||||||
|
"props": {},
|
||||||
|
"variables": {},
|
||||||
|
"dataSources":{},
|
||||||
|
"functions" : {},
|
||||||
|
"orchestrations" : {},
|
||||||
|
"events":{},
|
||||||
|
"slots":{},
|
||||||
|
"header":{},
|
||||||
|
"footer":{},
|
||||||
|
"children":{},
|
||||||
|
"meta":{}
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user