+
+
+
+
+
diff --git a/components/ComponentBox/utils/dom.js b/components/ComponentBox/utils/dom.js
new file mode 100644
index 0000000000000000000000000000000000000000..9e36dba6ea7db7caadf85aca93a0a8d6bcbe2a14
--- /dev/null
+++ b/components/ComponentBox/utils/dom.js
@@ -0,0 +1,60 @@
+import { isFunction } from './fns'
+
+// 将选择器与父元素匹配
+export function matchesSelectorToParentElements (el, selector, baseNode) {
+ let node = el
+
+ const matchesSelectorFunc = [
+ 'matches',
+ 'webkitMatchesSelector',
+ 'mozMatchesSelector',
+ 'msMatchesSelector',
+ 'oMatchesSelector'
+ ].find(func => isFunction(node[func]))
+
+ if (!isFunction(node[matchesSelectorFunc])) return false
+
+ do {
+ if (node[matchesSelectorFunc](selector)) return true
+ if (node === baseNode) return false
+ node = node.parentNode
+ } while (node)
+
+ return false
+}
+
+export function getComputedSize ($el) {
+ const style = window.getComputedStyle($el)
+
+ return [
+ parseFloat(style.getPropertyValue('width'), 10),
+ parseFloat(style.getPropertyValue('height'), 10)
+ ]
+}
+// 添加事件
+export function addEvent (el, event, handler) {
+ if (!el) {
+ return
+ }
+ if (el.attachEvent) {
+ el.attachEvent('on' + event, handler)
+ } else if (el.addEventListener) {
+ el.addEventListener(event, handler, true)
+ } else {
+ el['on' + event] = handler
+ }
+}
+
+// 删除事件
+export function removeEvent (el, event, handler) {
+ if (!el) {
+ return
+ }
+ if (el.detachEvent) {
+ el.detachEvent('on' + event, handler)
+ } else if (el.removeEventListener) {
+ el.removeEventListener(event, handler, true)
+ } else {
+ el['on' + event] = null
+ }
+}
diff --git a/components/ComponentBox/utils/fns.js b/components/ComponentBox/utils/fns.js
new file mode 100644
index 0000000000000000000000000000000000000000..f8bda0b0d91a29ef97e2ad7303c86838e5e14533
--- /dev/null
+++ b/components/ComponentBox/utils/fns.js
@@ -0,0 +1,39 @@
+export function isFunction (func) {
+ return (typeof func === 'function' || Object.prototype.toString.call(func) === '[object Function]')
+}
+
+export function snapToGrid (grid, pendingX, pendingY, scale = 1) {
+ const x = Math.round((pendingX / scale) / grid[0]) * grid[0]
+ const y = Math.round((pendingY / scale) / grid[1]) * grid[1]
+
+ return [x, y]
+}
+
+export function getSize (el) {
+ const rect = el.getBoundingClientRect()
+
+ return [
+ parseInt(rect.width),
+ parseInt(rect.height)
+ ]
+}
+
+export function computeWidth (parentWidth, left, right) {
+ return parentWidth - left - right
+}
+
+export function computeHeight (parentHeight, top, bottom) {
+ return parentHeight - top - bottom
+}
+
+export function restrictToBounds (value, min, max) {
+ if (min !== null && value < min) {
+ return min
+ }
+
+ if (max !== null && max < value) {
+ return max
+ }
+
+ return value
+}
diff --git a/components/ConfigItem/index.vue b/components/ConfigItem/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..62cbd2117262a8436d5db946a27cc1fd55ae71bf
--- /dev/null
+++ b/components/ConfigItem/index.vue
@@ -0,0 +1,49 @@
+
+
+
+ {{title}}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/components/EditScreens/index.vue b/components/EditScreens/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..5653149ef66749e6cd05e5e980eff50b6d78f551
--- /dev/null
+++ b/components/EditScreens/index.vue
@@ -0,0 +1,58 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/components/Feedback/index.vue b/components/Feedback/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..5eb9762c5170783a3c177a58b29455eaecaebb84
--- /dev/null
+++ b/components/Feedback/index.vue
@@ -0,0 +1,39 @@
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/components/Layout/index.vue b/components/Layout/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..4813ca5d90dfdac3f052168a1da96e875ae5a62d
--- /dev/null
+++ b/components/Layout/index.vue
@@ -0,0 +1,62 @@
+
+
+
+
+ {{title}}
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/components/Loading/index.vue b/components/Loading/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..f51b44f0ec3f90e578c596cb02afbd6a19ec7c4a
--- /dev/null
+++ b/components/Loading/index.vue
@@ -0,0 +1,43 @@
+
+
+
+
+
+
+
+
diff --git a/components/Ruler/components/SketchRule.vue b/components/Ruler/components/SketchRule.vue
new file mode 100644
index 0000000000000000000000000000000000000000..9851005312615bdc90b8416dabd0bb3414f94ef1
--- /dev/null
+++ b/components/Ruler/components/SketchRule.vue
@@ -0,0 +1,470 @@
+
+
+
+
+
+
+ x
+ {{ Math.round(item.value) }}
+
+
+
+
+
{{ Math.round(showValue) }}
+
+
+
+
+
+
\ No newline at end of file
diff --git a/components/Ruler/index.vue b/components/Ruler/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..a0beba54cb181caa5553dd3ed8ebc7c97cc9aa83
--- /dev/null
+++ b/components/Ruler/index.vue
@@ -0,0 +1,88 @@
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/components/Size/index.vue b/components/Size/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..d94cd2ba2d8d7b9f02506d35f4bbc646ab43db98
--- /dev/null
+++ b/components/Size/index.vue
@@ -0,0 +1,113 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/components/SvgIcon/index.vue b/components/SvgIcon/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..926cd0ce6cf829ce44267ef8c0411033073c54c6
--- /dev/null
+++ b/components/SvgIcon/index.vue
@@ -0,0 +1,26 @@
+
+
+
+
+
\ No newline at end of file
diff --git a/components/Thumbnail/index.vue b/components/Thumbnail/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..e1dd18b58d5e20b36a9c7532db8d6fd6006d1246
--- /dev/null
+++ b/components/Thumbnail/index.vue
@@ -0,0 +1,63 @@
+
+