forked from opentiny/tiny-engine
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathuseCanvas.js
More file actions
160 lines (136 loc) · 3.48 KB
/
Copy pathuseCanvas.js
File metadata and controls
160 lines (136 loc) · 3.48 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
/**
* Copyright (c) 2023 - present TinyEngine Authors.
* Copyright (c) 2023 - present Huawei Cloud Computing Technologies Co., Ltd.
*
* Use of this source code is governed by an MIT-style license.
*
* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
*
*/
/* eslint-disable no-new-func */
import { reactive } from 'vue'
import { setSchema, renderApi } from '@opentiny/tiny-engine-canvas'
import { constants } from '@opentiny/tiny-engine-utils'
import useHistory from './useHistory'
const { COMPONENT_NAME } = constants
const defaultPageState = {
currentVm: null,
currentSchema: null,
currentType: null,
pageSchema: null,
properties: null,
dataSource: null,
dataSourceMap: null,
isSaved: true,
isLock: false,
isBlock: false,
nodesStatus: {},
loading: false
}
const defaultSchema = {
componentName: 'Page',
fileName: '',
css: '',
props: {},
lifeCycles: {},
children: [],
dataSource: {
list: []
},
methods: {},
bridge: {
imports: []
},
state: {},
inputs: [],
outputs: []
}
const pageState = reactive({ ...defaultPageState, loading: true })
// 重置画布数据
const resetCanvasState = async (state = {}) => {
Object.assign(pageState, defaultPageState, state)
await setSchema(pageState.pageSchema)
}
// 页面重置画布数据
const resetPageCanvasState = (state = {}) => {
state.isBlock = false
resetCanvasState(state)
useHistory().addHistory(state.pageSchema)
}
// 区块重置画布数据
const resetBlockCanvasState = async (state = {}) => {
state.isBlock = true
await resetCanvasState(state)
}
const getDefaultSchema = (componentName = 'Page', fileName = '') => ({
...defaultSchema,
componentName,
fileName
})
const setSaved = (flag = false) => {
pageState.isSaved = flag
}
// 清空画布
const clearCanvas = () => {
pageState.properties = null
const { fileName, componentName } = pageState.pageSchema || {}
resetCanvasState({
pageSchema: { ...getDefaultSchema(componentName, fileName) }
})
setSaved(false)
}
const isBlock = () => pageState.isBlock
// 初始化页面数据
const initData = (schema = { ...defaultSchema }, currentPage) => {
if (schema.componentName === COMPONENT_NAME.Block) {
resetBlockCanvasState({
pageSchema: schema,
loading: false
})
} else {
resetPageCanvasState({
pageSchema: schema,
currentPage,
loading: false
})
}
useHistory().addHistory(schema)
}
const isSaved = () => pageState.isSaved
const isLoading = () => pageState.loading
const getPageSchema = () => {
return pageState.pageSchema || {}
}
const setCurrentSchema = (schema) => {
pageState.currentSchema = schema
}
const getCurrentSchema = () => pageState.currentSchema
const clearCurrentState = () => {
pageState.currentVm = null
pageState.hoverVm = null
pageState.properties = {}
pageState.pageSchema = null
}
const getCurrentPage = () => pageState.currentPage
export default function () {
return {
pageState,
isBlock,
isSaved,
isLoading,
initData,
setSaved,
clearCanvas,
getPageSchema,
resetPageCanvasState,
resetBlockCanvasState,
clearCurrentState,
getDataSourceMap: renderApi.getDataSourceMap,
setDataSourceMap: renderApi.setDataSourceMap,
getCurrentSchema,
setCurrentSchema,
getCurrentPage
}
}