From 76bd1d6499868fadbf187875044eebad76881180 Mon Sep 17 00:00:00 2001 From: Liberty Date: Tue, 15 Aug 2023 15:09:43 +0800 Subject: [PATCH 01/33] feat: add subform --- examples/views/formEditor.vue | 16 ++++++++++++- .../components/Layout/DragGable.jsx | 4 ++++ .../components/Layout/SubformLayout.jsx | 23 +++++++++++++++++++ packages/formEditor/componentsConfig.js | 11 +++++++++ packages/formEditor/locale/en.js | 3 ++- packages/formEditor/locale/zh-cn.js | 3 ++- packages/icon/svg/subform.svg | 1 + packages/theme/formEditor/SubformLayout.scss | 3 +++ packages/theme/formEditor/index.scss | 1 + packages/utils/field.js | 2 +- 10 files changed, 63 insertions(+), 4 deletions(-) create mode 100644 packages/formEditor/components/Layout/SubformLayout.jsx create mode 100644 packages/icon/svg/subform.svg create mode 100644 packages/theme/formEditor/SubformLayout.scss diff --git a/examples/views/formEditor.vue b/examples/views/formEditor.vue index 0e47131..423e591 100644 --- a/examples/views/formEditor.vue +++ b/examples/views/formEditor.vue @@ -1,9 +1,23 @@ diff --git a/packages/formEditor/components/Layout/DragGable.jsx b/packages/formEditor/components/Layout/DragGable.jsx index d21dd44..c724faa 100644 --- a/packages/formEditor/components/Layout/DragGable.jsx +++ b/packages/formEditor/components/Layout/DragGable.jsx @@ -21,6 +21,7 @@ import LayoutTabsLayout from './TabsLayout' import LayoutCollapseLayout from './CollapseLayout' import LayoutTableLayout from './TableLayout' import LayoutInlineLayout from './InlineLayout' +import LayoutSubformLayout from './SubformLayout' import Selection from '@ER/formEditor/components/Selection/selectElement.jsx' import ControlInsertionPlugin from './ControlInsertionPlugin' const dragGableWrap = defineComponent({ @@ -143,6 +144,9 @@ export default defineComponent({ case 'inline': node = () break + case 'subform': + node = () + break default: let TypeComponent = '' if (unref(isEditModel) || _.get(state.fieldsLogicState.get(element), 'visible', undefined) !== 0) { diff --git a/packages/formEditor/components/Layout/SubformLayout.jsx b/packages/formEditor/components/Layout/SubformLayout.jsx new file mode 100644 index 0000000..0501f44 --- /dev/null +++ b/packages/formEditor/components/Layout/SubformLayout.jsx @@ -0,0 +1,23 @@ +import { defineComponent, resolveComponent, watch, useAttrs, defineAsyncComponent } from 'vue' +import Selection from '@ER/formEditor/components/Selection/selectElement.jsx' +import LayoutDragGable from './DragGable.jsx' +import hooks from '@ER/hooks' +export default defineComponent({ + name: 'SubformLayout', + inheritAttrs: false, + customOptions: {}, + props: { + data: Object, + parent: Array + }, + setup (props) { + const ns = hooks.useNamespace('SubformLayout') + return () => { + return ( + +
123
+ + ) + } + } +}) diff --git a/packages/formEditor/componentsConfig.js b/packages/formEditor/componentsConfig.js index 8422e46..f86ac72 100644 --- a/packages/formEditor/componentsConfig.js +++ b/packages/formEditor/componentsConfig.js @@ -563,6 +563,17 @@ export const fieldsConfig = [ labelHidden: true, required: false } + }, + { + type: 'subform', + label: '子表单', + icon: 'subform', + id: '', + columns: [], + options: { + defaultValue: [], + accordion: false + } } ] } diff --git a/packages/formEditor/locale/en.js b/packages/formEditor/locale/en.js index cdd52e0..7758b66 100644 --- a/packages/formEditor/locale/en.js +++ b/packages/formEditor/locale/en.js @@ -33,7 +33,8 @@ export default { divider: 'Divider', container: 'Container', field: 'Basic field', - defaultField: 'Default field' + defaultField: 'Default field', + subform: 'Sub-form' }, layout: { tabsCol: 'Tab panel', diff --git a/packages/formEditor/locale/zh-cn.js b/packages/formEditor/locale/zh-cn.js index 02d9df0..d61c769 100644 --- a/packages/formEditor/locale/zh-cn.js +++ b/packages/formEditor/locale/zh-cn.js @@ -33,7 +33,8 @@ export default { divider: '分割线', container: '容器', field: '基础字段', - defaultField: '预设字段' + defaultField: '预设字段', + subform: '子表单' }, layout: { tabsCol: '标签面板', diff --git a/packages/icon/svg/subform.svg b/packages/icon/svg/subform.svg new file mode 100644 index 0000000..7d8dffe --- /dev/null +++ b/packages/icon/svg/subform.svg @@ -0,0 +1 @@ + diff --git a/packages/theme/formEditor/SubformLayout.scss b/packages/theme/formEditor/SubformLayout.scss new file mode 100644 index 0000000..0b5fc3d --- /dev/null +++ b/packages/theme/formEditor/SubformLayout.scss @@ -0,0 +1,3 @@ +@include b(SubformLayout) { + //width: 100%; +} diff --git a/packages/theme/formEditor/index.scss b/packages/theme/formEditor/index.scss index 2222462..a7ee374 100644 --- a/packages/theme/formEditor/index.scss +++ b/packages/theme/formEditor/index.scss @@ -15,6 +15,7 @@ $namespace: 'Everright-formEditor'; @import './TabsLayout'; @import './CollapseLayout'; @import './InlineLayout'; +@import './SubformLayout'; @import './DragGableLayout'; @import './SelectElement'; @import './FormTypes/Signature'; diff --git a/packages/utils/field.js b/packages/utils/field.js index 2e057ef..6aa80c4 100644 --- a/packages/utils/field.js +++ b/packages/utils/field.js @@ -20,7 +20,7 @@ const wrapElement = (element, fn) => { if (!node.key) { node.key = `${node.type}_${node.id}` } - if (/^(grid|tabs|collapse|table|divider)$/.test(node.type)) { + if (/^(grid|tabs|collapse|table|divider|subform)$/.test(node.type)) { node.style = { width: '100%' } From b4779e621d564efd329d075f812f9fdd40ad7abc Mon Sep 17 00:00:00 2001 From: Liberty Date: Sun, 20 Aug 2023 17:19:29 +0800 Subject: [PATCH 02/33] test(disassemblyData): fields and layout not separated --- .../Layout/ControlInsertionPlugin.js | 30 ++++++------- .../components/Layout/SubformLayout.jsx | 25 ++++++++++- packages/formEditor/componentsConfig.js | 5 ++- packages/formEditor/index.vue | 8 ++-- packages/utils/field.js | 28 ++++++++++-- test/disassemblyData/layoutType1.test.js | 44 +++++++++++++++++++ 6 files changed, 113 insertions(+), 27 deletions(-) create mode 100644 test/disassemblyData/layoutType1.test.js diff --git a/packages/formEditor/components/Layout/ControlInsertionPlugin.js b/packages/formEditor/components/Layout/ControlInsertionPlugin.js index 85ddd72..ede624d 100644 --- a/packages/formEditor/components/Layout/ControlInsertionPlugin.js +++ b/packages/formEditor/components/Layout/ControlInsertionPlugin.js @@ -163,7 +163,7 @@ const setBorder = (el, className) => { el.classList.add(className) } const getDragElement = (node) => { - return node.__draggable_context.element + return node.__draggable_context?.element } const setStates = (newTarget, ev, ER) => { @@ -313,14 +313,6 @@ function ControlInsertionPlugin (ER) { } ControlInsertion.prototype = { dragStart (e) { - // const { - // rootEl, - // target - // } = e - // const isBlock = _.get(e, 'sortable.options.dataSource', false) === 'block' - // if (isBlock) return false - // const targetContainer = rootEl.parentNode - // targetContainer.style.zIndex = 2 }, drop (e) { if (!prevEl || !e.activeSortable) { @@ -382,7 +374,7 @@ function ControlInsertionPlugin (ER) { const { activeSortable: { constructor: { - utils + utils: SortableUtils }, options: { dataSource @@ -413,15 +405,26 @@ function ControlInsertionPlugin (ER) { if (target.dataset.layoutType === 'grid') { return false } + const dragNode = getDragElement(dragEl) + const targetNode = getDragElement(target) + if ((!utils.checkIsField(dragNode) || dragNode.type === 'subform') && utils.checkIsInSubform(targetNode)) { + return false + } + if (target.dataset.layoutType === 'subform') { + // console.log(utils) + if (!utils.checkIsField(dragNode) || dragNode.type === 'subform') { + return false + } + } originalEvent.stopPropagation && originalEvent.stopPropagation() const direction = '' const targetContainer = el.parentNode const targetOnlyOne = targetList.length === 1 - let newTarget = utils.closest(target, this.options.draggable, sortable.el) + let newTarget = SortableUtils.closest(target, this.options.draggable, sortable.el) if (dragEl.contains(newTarget)) { return false } - if (/^(grid-col|tabs-col|td|collapse-col|root|inline)$/.test(target.dataset.layoutType)) { + if (/^(grid-col|tabs-col|td|collapse-col|root|inline|subform)$/.test(target.dataset.layoutType)) { newTarget = target const state = (newTarget.__draggable_component__ || newTarget.children[0].__draggable_component__) if (!state.list.length) { @@ -433,9 +436,6 @@ function ControlInsertionPlugin (ER) { if (/^(root|grid-col)$/.test(target.dataset.layoutType)) { const rows = el.children prevEl = lastChild(el) - // if (prevEl.contains(dragEl) && list.length === 1) { - // console.log(prevEl) - // console.log(dragEl) if (prevEl === dragEl.parentNode.parentNode && list.length === 1) { prevEl = '' return false diff --git a/packages/formEditor/components/Layout/SubformLayout.jsx b/packages/formEditor/components/Layout/SubformLayout.jsx index 0501f44..af83a0b 100644 --- a/packages/formEditor/components/Layout/SubformLayout.jsx +++ b/packages/formEditor/components/Layout/SubformLayout.jsx @@ -1,4 +1,4 @@ -import { defineComponent, resolveComponent, watch, useAttrs, defineAsyncComponent } from 'vue' +import { defineComponent, resolveComponent, watch, useAttrs, defineAsyncComponent, unref } from 'vue' import Selection from '@ER/formEditor/components/Selection/selectElement.jsx' import LayoutDragGable from './DragGable.jsx' import hooks from '@ER/hooks' @@ -12,10 +12,31 @@ export default defineComponent({ }, setup (props) { const ns = hooks.useNamespace('SubformLayout') + const { + state, + isEditModel, + isPc, + setSelection + } = hooks.useTarget() + const typeProps = hooks.useProps(state, props.data, unref(isPc)) return () => { return ( -
123
+
+ +
+ { + + } +
+ +
) } diff --git a/packages/formEditor/componentsConfig.js b/packages/formEditor/componentsConfig.js index f86ac72..67bc77f 100644 --- a/packages/formEditor/componentsConfig.js +++ b/packages/formEditor/componentsConfig.js @@ -569,10 +569,11 @@ export const fieldsConfig = [ label: '子表单', icon: 'subform', id: '', - columns: [], + list: [], options: { defaultValue: [], - accordion: false + accordion: false, + isShowLabel: true } } ] diff --git a/packages/formEditor/index.vue b/packages/formEditor/index.vue index 6a25991..49f0b2d 100644 --- a/packages/formEditor/index.vue +++ b/packages/formEditor/index.vue @@ -74,6 +74,7 @@ const state = reactive({ Namespace: 'formEditor', logic: {} }) +window.state = state const isFoldFields = ref(true) const isFoldConfig = ref(true) state.validator = (target, fn) => { @@ -318,13 +319,12 @@ provide('Everright', { }) const ns = hooks.useNamespace('Main', state.Namespace) const getData1 = () => { - return Object.assign(utils.disassemblyData1(_.cloneDeep({ + return utils.disassemblyData1(_.cloneDeep({ list: state.store, config: state.config, - data: state.data - })), { + data: state.data, logic: state.logic - }) + })) } const getData2 = () => { layout.pc = getLayoutDataByplatform('pc') diff --git a/packages/utils/field.js b/packages/utils/field.js index 6aa80c4..7944055 100644 --- a/packages/utils/field.js +++ b/packages/utils/field.js @@ -1,6 +1,6 @@ import _ from 'lodash-es' import { nanoid } from './nanoid' -const fieldsRe = /^(input|textarea|number|radio|checkbox|select|time|date|rate|switch|slider|html|cascader|uploadfile|signature|region)$/ +const fieldsRe = /^(input|textarea|number|radio|checkbox|select|time|date|rate|switch|slider|html|cascader|uploadfile|signature|region|subform)$/ const deepTraversal = (node, fn) => { fn(node) const nodes = node.list || node.rows || node.columns || node.children || [] @@ -20,7 +20,7 @@ const wrapElement = (element, fn) => { if (!node.key) { node.key = `${node.type}_${node.id}` } - if (/^(grid|tabs|collapse|table|divider|subform)$/.test(node.type)) { + if (/^(grid|tabs|collapse|table|divider)$/.test(node.type)) { node.style = { width: '100%' } @@ -88,7 +88,8 @@ const disassemblyData1 = (data) => { fields: flatNodes(data.list, excludes, (nodes, node, currentIndex) => { nodes[currentIndex] = node.id }), - data: data.data + data: data.data, + logic: data.logic } return result } @@ -106,6 +107,12 @@ const combinationData1 = (data) => { nodes[currentIndex] = cur } }) + flatNodes(data.list, excludes, (nodes, node, currentIndex) => { + const cur = _.find(data.fields, { id: node }) + if (!_.isEmpty(cur)) { + nodes[currentIndex] = cur + } + }) return result } const combinationData2 = (list, fields) => { @@ -196,6 +203,18 @@ const transferData = (lang, path, locale, options = {}) => { return result } const isNull = (e) => e === '' || e === null || e === undefined +const checkIsInSubform = (node) => { + if (!node) return false + let result = false + let parent = node.context.parent + while (parent && !result) { + if (parent.type === 'subform') { + result = true + } + parent = parent.context?.parent + } + return result +} export { syncWidthByPlatform, wrapElement, @@ -213,5 +232,6 @@ export { transferData, transferLabelPath, isNull, - repairLayout + repairLayout, + checkIsInSubform } diff --git a/test/disassemblyData/layoutType1.test.js b/test/disassemblyData/layoutType1.test.js new file mode 100644 index 0000000..0f221c2 --- /dev/null +++ b/test/disassemblyData/layoutType1.test.js @@ -0,0 +1,44 @@ +import { describe, assert, expect, test, beforeEach, beforeAll, vi } from 'vitest' +import utils from '@ER/utils' +import erGeneratorData from '@ER/formEditor/generatorData.js' +import * as erComponentsConfig from '@ER/formEditor/componentsConfig.js' +import _ from 'lodash-es' +const wrapData = (data, field) => ({ + config: {}, + logic: {}, + data: {}, + list: [ + data + ], + fields: [ + field.columns[0] + ] +}) +describe('Fields and layout not separated', () => { + beforeAll(() => { + vi.stubEnv('TESTIDTYPE', 'nanoid') + return () => { + vi.stubEnv('TESTIDTYPE', '') + } + }) + const field = erGeneratorData(erComponentsConfig.fieldsConfig[0].list[0], true, 'en') + test('disassemblyData1: Only fields without layout', async () => { + const data = wrapData(field, field) + expect(utils.combinationData1(utils.disassemblyData1(_.cloneDeep(data)))).toEqual(data) + }) + test('disassemblyData1: Grid', async () => { + const data = wrapData(erGeneratorData(erComponentsConfig.fieldsConfig[2].list[0], true, 'en'), field) + data.list[0].columns[0].columns[0].list.push(field) + expect(utils.combinationData1(utils.disassemblyData1(_.cloneDeep(data)))).toEqual(data) + }) + test('disassemblyData1: Table', async () => { + const data = wrapData(erGeneratorData(erComponentsConfig.fieldsConfig[2].list[1], true, 'en'), field) + data.list[0].columns[0].rows[0].columns[0].list.push(field) + expect(utils.combinationData1(utils.disassemblyData1(_.cloneDeep(data)))).toEqual(data) + }) + test('disassemblyData1: Tabs', async () => { + const data = wrapData(erGeneratorData(erComponentsConfig.fieldsConfig[2].list[2], true, 'en'), field) + data.list[0].columns[0].columns[0].list.push(field) + expect(utils.combinationData1(utils.disassemblyData1(_.cloneDeep(data)))).toEqual(data) + }) +}) From 49cfa51d103b843963c4f3a49f7aadf67865279a Mon Sep 17 00:00:00 2001 From: Liberty Date: Sun, 20 Aug 2023 17:40:06 +0800 Subject: [PATCH 03/33] test(disassemblyData): nested layout:Grid > Grid > field --- test/disassemblyData/layoutType1.test.js | 22 +++++++++++++++------- 1 file changed, 15 insertions(+), 7 deletions(-) diff --git a/test/disassemblyData/layoutType1.test.js b/test/disassemblyData/layoutType1.test.js index 0f221c2..641fec0 100644 --- a/test/disassemblyData/layoutType1.test.js +++ b/test/disassemblyData/layoutType1.test.js @@ -22,23 +22,31 @@ describe('Fields and layout not separated', () => { } }) const field = erGeneratorData(erComponentsConfig.fieldsConfig[0].list[0], true, 'en') - test('disassemblyData1: Only fields without layout', async () => { + test('Only fields without layout', async () => { const data = wrapData(field, field) expect(utils.combinationData1(utils.disassemblyData1(_.cloneDeep(data)))).toEqual(data) }) - test('disassemblyData1: Grid', async () => { - const data = wrapData(erGeneratorData(erComponentsConfig.fieldsConfig[2].list[0], true, 'en'), field) + test('Grid', async () => { + const data = wrapData(erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[0]), true, 'en'), field) data.list[0].columns[0].columns[0].list.push(field) expect(utils.combinationData1(utils.disassemblyData1(_.cloneDeep(data)))).toEqual(data) }) - test('disassemblyData1: Table', async () => { - const data = wrapData(erGeneratorData(erComponentsConfig.fieldsConfig[2].list[1], true, 'en'), field) + test('Table', async () => { + const data = wrapData(erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[1]), true, 'en'), field) data.list[0].columns[0].rows[0].columns[0].list.push(field) expect(utils.combinationData1(utils.disassemblyData1(_.cloneDeep(data)))).toEqual(data) }) - test('disassemblyData1: Tabs', async () => { - const data = wrapData(erGeneratorData(erComponentsConfig.fieldsConfig[2].list[2], true, 'en'), field) + test('Tabs', async () => { + const data = wrapData(erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[2]), true, 'en'), field) data.list[0].columns[0].columns[0].list.push(field) expect(utils.combinationData1(utils.disassemblyData1(_.cloneDeep(data)))).toEqual(data) }) + test('nested layout:Grid > Grid > field', async () => { + const grid0 = erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[0]), true, 'en') + const grid1 = erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[0]), true, 'en') + grid0.columns[0].columns[0].list.push(grid1) + grid1.columns[0].columns[0].list.push(field) + const data = wrapData(grid0, field) + expect(utils.combinationData1(utils.disassemblyData1(_.cloneDeep(data)))).toEqual(data) + }) }) From 06792266b2741e8876c0f4b86d080fa8111376c6 Mon Sep 17 00:00:00 2001 From: Liberty Date: Fri, 25 Aug 2023 17:00:56 +0800 Subject: [PATCH 04/33] test(disassemblyData): adjust the test case --- test/disassemblyData/layoutType1.test.js | 108 ++++++++++++++++++----- 1 file changed, 88 insertions(+), 20 deletions(-) diff --git a/test/disassemblyData/layoutType1.test.js b/test/disassemblyData/layoutType1.test.js index 641fec0..cec3b37 100644 --- a/test/disassemblyData/layoutType1.test.js +++ b/test/disassemblyData/layoutType1.test.js @@ -3,50 +3,118 @@ import utils from '@ER/utils' import erGeneratorData from '@ER/formEditor/generatorData.js' import * as erComponentsConfig from '@ER/formEditor/componentsConfig.js' import _ from 'lodash-es' -const wrapData = (data, field) => ({ - config: {}, +import { mount } from '@vue/test-utils' +import { erFormEditor } from '@ER/formEditor/index.js' +import { Plus } from '@element-plus/icons-vue' +import ElementPlus from 'element-plus' +import Vant from 'vant' +import { nextTick } from 'vue' +const wrapData = (list, field) => ({ + config: { + isSync: true, + pc: { + size: 'default', + labelPosition: 'left', + completeButton: { + text: '提交', + color: '', + backgroundColor: '' + } + }, + mobile: { + labelPosition: 'left', + completeButton: { + text: '提交', + color: '', + backgroundColor: '' + } + } + }, logic: {}, data: {}, - list: [ - data - ], + list, fields: [ field.columns[0] ] }) +const _mount = (template, data, otherObj) => mount( + { + components: { + erFormEditor + }, + template, + data, + ...otherObj + }, + { + attachTo: 'body', + global: { + components: { + Plus + }, + plugins: [ + ElementPlus, + Vant + ] + } + } +) describe('Fields and layout not separated', () => { + let wrapper = {} + const handleListener = vi.fn() + let field = {} beforeAll(() => { vi.stubEnv('TESTIDTYPE', 'nanoid') + field = erGeneratorData(erComponentsConfig.fieldsConfig[0].list[0], true, 'en') + wrapper = _mount(` + + `, () => ({ + handleListener + }) + ) return () => { vi.stubEnv('TESTIDTYPE', '') } }) - const field = erGeneratorData(erComponentsConfig.fieldsConfig[0].list[0], true, 'en') test('Only fields without layout', async () => { - const data = wrapData(field, field) - expect(utils.combinationData1(utils.disassemblyData1(_.cloneDeep(data)))).toEqual(data) + const newField = _.cloneDeep(field) + newField.columns[0] = newField.columns[0].id + const data = wrapData([newField], field) + wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) + await nextTick() + expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) }) test('Grid', async () => { - const data = wrapData(erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[0]), true, 'en'), field) - data.list[0].columns[0].columns[0].list.push(field) - expect(utils.combinationData1(utils.disassemblyData1(_.cloneDeep(data)))).toEqual(data) + const data = wrapData([erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[0]), true, 'en')], field) + data.list[0].columns[0].columns[0].list.push(field.columns[0].id) + wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) + await nextTick() + expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) }) test('Table', async () => { - const data = wrapData(erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[1]), true, 'en'), field) - data.list[0].columns[0].rows[0].columns[0].list.push(field) - expect(utils.combinationData1(utils.disassemblyData1(_.cloneDeep(data)))).toEqual(data) + const data = wrapData([erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[1]), true, 'en')], field) + data.list[0].columns[0].rows[0].columns[0].list.push(field.columns[0].id) + wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) + await nextTick() + expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) }) test('Tabs', async () => { - const data = wrapData(erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[2]), true, 'en'), field) - data.list[0].columns[0].columns[0].list.push(field) - expect(utils.combinationData1(utils.disassemblyData1(_.cloneDeep(data)))).toEqual(data) + const data = wrapData([erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[2]), true, 'en')], field) + data.list[0].columns[0].columns[0].list.push(field.columns[0].id) + wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) + await nextTick() + expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) }) test('nested layout:Grid > Grid > field', async () => { const grid0 = erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[0]), true, 'en') const grid1 = erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[0]), true, 'en') grid0.columns[0].columns[0].list.push(grid1) - grid1.columns[0].columns[0].list.push(field) - const data = wrapData(grid0, field) - expect(utils.combinationData1(utils.disassemblyData1(_.cloneDeep(data)))).toEqual(data) + grid1.columns[0].columns[0].list.push(field.columns[0].id) + const data = wrapData([grid0], field) + wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) + await nextTick() + expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) }) }) From 1d5d9dd4d303687e21b71c53d56fb2c8b790e7c8 Mon Sep 17 00:00:00 2001 From: Liberty Date: Fri, 25 Aug 2023 17:18:06 +0800 Subject: [PATCH 05/33] refactor: remove @element-plus/icons-vue --- examples/main.js | 4 ---- package.json | 1 - packages/formEditor/components/FormTypes/Uploadfile/pc.vue | 4 +++- .../Panels/Config/components/BackgroundComponent.vue | 4 +++- .../components/Panels/Config/components/DataComponent2.jsx | 4 ++-- packages/region/index.vue | 6 +++--- pnpm-lock.yaml | 3 +-- test/disassemblyData/layoutType1.test.js | 4 ---- test/erFormConfig.test.js | 4 ---- test/logic/er-form-preview/er-form-preview.test.js | 4 ---- 10 files changed, 12 insertions(+), 26 deletions(-) diff --git a/examples/main.js b/examples/main.js index 88079c9..a1250f5 100644 --- a/examples/main.js +++ b/examples/main.js @@ -1,6 +1,5 @@ import { createApp } from 'vue' import ElementPlus from 'element-plus' -import * as ElementPlusIconsVue from '@element-plus/icons-vue' import Vant, { Locale } from 'vant' import enUS from 'vant/es/locale/lang/en-US' // import '@vant/touch-emulator' @@ -14,6 +13,3 @@ app.use(router) app.use(ElementPlus) app.use(Vant) app.mount('#app') -for (const [key, component] of Object.entries(ElementPlusIconsVue)) { - app.component(key, component) -} diff --git a/package.json b/package.json index f17cff0..eac73e7 100644 --- a/package.json +++ b/package.json @@ -79,7 +79,6 @@ "@ckeditor/ckeditor5-vue": "^4.0.1", "@commitlint/cli": "^17.4.4", "@commitlint/config-conventional": "^17.4.4", - "@element-plus/icons-vue": "^2.0.10", "@vitejs/plugin-vue": "^3.2.0", "@vitejs/plugin-vue-jsx": "^2.1.1", "@vue/compiler-sfc": "^3.2.47", diff --git a/packages/formEditor/components/FormTypes/Uploadfile/pc.vue b/packages/formEditor/components/FormTypes/Uploadfile/pc.vue index fc4ae7d..5cc0800 100644 --- a/packages/formEditor/components/FormTypes/Uploadfile/pc.vue +++ b/packages/formEditor/components/FormTypes/Uploadfile/pc.vue @@ -80,7 +80,9 @@ const handleError = (error) => { :before-upload="beforeAvatarUpload" :on-error="handleError" > - + + + { :on-success="handleSuccess" :on-error="handleError" > - + + +
  • handleAction(2, index, e)} vModel={e.label}> items.splice(i, 1)} color="#fff" size={10} class={ns.e('del')}> - + handleAction(3, index, e)} color="#409eff" size={20} class={[ns.e('hide'), e.disabled && ns.e('show')]}> { - e.disabled ? : + e.disabled ? : } diff --git a/packages/region/index.vue b/packages/region/index.vue index 0af98ec..c1f4baf 100644 --- a/packages/region/index.vue +++ b/packages/region/index.vue @@ -301,7 +301,7 @@ onMounted(() => { :class="[ns.e('icon'), 'icon-circle-close']" @click.stop="handleClear" > - + { ]" @click.stop="togglePopperVisible()" > - + @@ -397,7 +397,7 @@ onMounted(() => { {{node.label}}
    • diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index feba837..40c5a02 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -10,7 +10,6 @@ specifiers: '@ckeditor/ckeditor5-vue': ^4.0.1 '@commitlint/cli': ^17.4.4 '@commitlint/config-conventional': ^17.4.4 - '@element-plus/icons-vue': ^2.0.10 '@vant/area-data': ^1.4.0 '@vant/touch-emulator': ^1.4.0 '@vitejs/plugin-vue': ^3.2.0 @@ -90,7 +89,6 @@ devDependencies: '@ckeditor/ckeditor5-vue': registry.npmmirror.com/@ckeditor/ckeditor5-vue/4.0.1 '@commitlint/cli': registry.npmmirror.com/@commitlint/cli/17.4.4 '@commitlint/config-conventional': registry.npmmirror.com/@commitlint/config-conventional/17.4.4 - '@element-plus/icons-vue': registry.npmmirror.com/@element-plus/icons-vue/2.1.0_vue@3.2.47 '@vitejs/plugin-vue': registry.npmmirror.com/@vitejs/plugin-vue/3.2.0_vite@3.2.5+vue@3.2.47 '@vitejs/plugin-vue-jsx': registry.npmmirror.com/@vitejs/plugin-vue-jsx/2.1.1_vite@3.2.5+vue@3.2.47 '@vue/compiler-sfc': registry.npmmirror.com/@vue/compiler-sfc/3.2.47 @@ -2913,6 +2911,7 @@ packages: vue: ^3.2.0 dependencies: vue: registry.npmmirror.com/vue/3.2.47 + dev: false registry.npmmirror.com/@eslint-community/eslint-utils/4.3.0_eslint@8.36.0: resolution: {integrity: sha512-v3oplH6FYCULtFuCeqyuTd9D2WKO937Dxdq+GmHOLL72TTRriLxz2VLlNfkZRsvj6PKnOPAtuT6dwrs/pA5DvA==, registry: https://registry.npm.taobao.org/, tarball: https://registry.npmmirror.com/@eslint-community/eslint-utils/-/eslint-utils-4.3.0.tgz} diff --git a/test/disassemblyData/layoutType1.test.js b/test/disassemblyData/layoutType1.test.js index cec3b37..9330c2e 100644 --- a/test/disassemblyData/layoutType1.test.js +++ b/test/disassemblyData/layoutType1.test.js @@ -5,7 +5,6 @@ import * as erComponentsConfig from '@ER/formEditor/componentsConfig.js' import _ from 'lodash-es' import { mount } from '@vue/test-utils' import { erFormEditor } from '@ER/formEditor/index.js' -import { Plus } from '@element-plus/icons-vue' import ElementPlus from 'element-plus' import Vant from 'vant' import { nextTick } from 'vue' @@ -49,9 +48,6 @@ const _mount = (template, data, otherObj) => mount( { attachTo: 'body', global: { - components: { - Plus - }, plugins: [ ElementPlus, Vant diff --git a/test/erFormConfig.test.js b/test/erFormConfig.test.js index b5f3ce3..3eb91e1 100644 --- a/test/erFormConfig.test.js +++ b/test/erFormConfig.test.js @@ -1,7 +1,6 @@ import { describe, assert, expect, test, beforeEach, vi, beforeAll, afterEach } from 'vitest' import { erComponentsConfig, erFormConfig, erGeneratorData, utils } from '@ER/formEditor/index.js' import { mount } from '@vue/test-utils' -import { Plus } from '@element-plus/icons-vue' import ElementPlus from 'element-plus' import Vant from 'vant' import { computed, nextTick, reactive, ref } from 'vue' @@ -18,9 +17,6 @@ const _mount = (template, data, otherObj) => mount( { attachTo: 'body', global: { - components: { - Plus - }, plugins: [ ElementPlus, Vant diff --git a/test/logic/er-form-preview/er-form-preview.test.js b/test/logic/er-form-preview/er-form-preview.test.js index ca90d32..b2dd6a9 100644 --- a/test/logic/er-form-preview/er-form-preview.test.js +++ b/test/logic/er-form-preview/er-form-preview.test.js @@ -3,7 +3,6 @@ import { mount, flushPromises, enableAutoUnmount } from '@vue/test-utils' import { nextTick, reactive } from 'vue' import _ from 'lodash-es' import ElementPlus from 'element-plus' -import { Plus } from '@element-plus/icons-vue' import Vant from 'vant' import { erFormPreview } from '@ER/formEditor' import previewData from './data/preview.json' @@ -20,9 +19,6 @@ const _mount = (template, data, otherObj) => mount( { attachTo: 'body', global: { - components: { - Plus - }, plugins: [ ElementPlus, Vant From ca2f85dda13c480d91cb835d8dd09911ff7d0b0b Mon Sep 17 00:00:00 2001 From: Liberty Date: Tue, 29 Aug 2023 15:59:55 +0800 Subject: [PATCH 06/33] test(disassemblyData): layoutType1|layoutType2 --- test/disassemblyData/layoutType1.test.js | 64 ++----------- test/disassemblyData/layoutType2.test.js | 112 +++++++++++++++++++++++ test/utils.js | 60 ++++++++++++ 3 files changed, 179 insertions(+), 57 deletions(-) create mode 100644 test/disassemblyData/layoutType2.test.js create mode 100644 test/utils.js diff --git a/test/disassemblyData/layoutType1.test.js b/test/disassemblyData/layoutType1.test.js index 9330c2e..ebe0dd9 100644 --- a/test/disassemblyData/layoutType1.test.js +++ b/test/disassemblyData/layoutType1.test.js @@ -1,60 +1,9 @@ import { describe, assert, expect, test, beforeEach, beforeAll, vi } from 'vitest' -import utils from '@ER/utils' import erGeneratorData from '@ER/formEditor/generatorData.js' import * as erComponentsConfig from '@ER/formEditor/componentsConfig.js' import _ from 'lodash-es' -import { mount } from '@vue/test-utils' -import { erFormEditor } from '@ER/formEditor/index.js' -import ElementPlus from 'element-plus' -import Vant from 'vant' import { nextTick } from 'vue' -const wrapData = (list, field) => ({ - config: { - isSync: true, - pc: { - size: 'default', - labelPosition: 'left', - completeButton: { - text: '提交', - color: '', - backgroundColor: '' - } - }, - mobile: { - labelPosition: 'left', - completeButton: { - text: '提交', - color: '', - backgroundColor: '' - } - } - }, - logic: {}, - data: {}, - list, - fields: [ - field.columns[0] - ] -}) -const _mount = (template, data, otherObj) => mount( - { - components: { - erFormEditor - }, - template, - data, - ...otherObj - }, - { - attachTo: 'body', - global: { - plugins: [ - ElementPlus, - Vant - ] - } - } -) +import { _mount, wrapLayoutDataByLayoutType } from '@ER-test/utils.js' describe('Fields and layout not separated', () => { let wrapper = {} const handleListener = vi.fn() @@ -65,6 +14,7 @@ describe('Fields and layout not separated', () => { wrapper = _mount(` `, () => ({ handleListener @@ -77,27 +27,27 @@ describe('Fields and layout not separated', () => { test('Only fields without layout', async () => { const newField = _.cloneDeep(field) newField.columns[0] = newField.columns[0].id - const data = wrapData([newField], field) + const data = wrapLayoutDataByLayoutType([newField], field) wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) await nextTick() expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) }) test('Grid', async () => { - const data = wrapData([erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[0]), true, 'en')], field) + const data = wrapLayoutDataByLayoutType([erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[0]), true, 'en')], field) data.list[0].columns[0].columns[0].list.push(field.columns[0].id) wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) await nextTick() expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) }) test('Table', async () => { - const data = wrapData([erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[1]), true, 'en')], field) + const data = wrapLayoutDataByLayoutType([erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[1]), true, 'en')], field) data.list[0].columns[0].rows[0].columns[0].list.push(field.columns[0].id) wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) await nextTick() expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) }) test('Tabs', async () => { - const data = wrapData([erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[2]), true, 'en')], field) + const data = wrapLayoutDataByLayoutType([erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[2]), true, 'en')], field) data.list[0].columns[0].columns[0].list.push(field.columns[0].id) wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) await nextTick() @@ -108,7 +58,7 @@ describe('Fields and layout not separated', () => { const grid1 = erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[0]), true, 'en') grid0.columns[0].columns[0].list.push(grid1) grid1.columns[0].columns[0].list.push(field.columns[0].id) - const data = wrapData([grid0], field) + const data = wrapLayoutDataByLayoutType([grid0], field) wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) await nextTick() expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) diff --git a/test/disassemblyData/layoutType2.test.js b/test/disassemblyData/layoutType2.test.js new file mode 100644 index 0000000..4bd04eb --- /dev/null +++ b/test/disassemblyData/layoutType2.test.js @@ -0,0 +1,112 @@ +import { describe, assert, expect, test, beforeEach, beforeAll, vi } from 'vitest' +import erGeneratorData from '@ER/formEditor/generatorData.js' +import * as erComponentsConfig from '@ER/formEditor/componentsConfig.js' +import _ from 'lodash-es' +import { nextTick } from 'vue' +import { _mount, wrapLayoutDataByLayoutType } from '@ER-test/utils.js' +describe('Fields and layout separated', () => { + let wrapper = {} + const handleListener = vi.fn() + let field = {} + beforeAll(() => { + vi.stubEnv('TESTIDTYPE', 'nanoid') + field = erGeneratorData(erComponentsConfig.fieldsConfig[0].list[0], true, 'en') + wrapper = _mount(` + + `, () => ({ + handleListener + }) + ) + return () => { + vi.stubEnv('TESTIDTYPE', '') + } + }) + test('Only fields without layout', async () => { + const newField = _.cloneDeep(field) + newField.columns[0] = newField.columns[0].id + const data = wrapLayoutDataByLayoutType({ + pc: [ + newField + ], + mobile: [ + newField + ] + }, field, 2) + wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) + await nextTick() + expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) + }) + test('Grid', async () => { + const newField = _.cloneDeep(field) + newField.columns[0] = newField.columns[0].id + const layout = erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[0]), true, 'en') + layout.columns[0].columns[0].list.push(newField) + const data = wrapLayoutDataByLayoutType({ + pc: [ + layout + ], + mobile: [ + layout + ] + }, field, 2) + wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) + await nextTick() + expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) + }) + test('Table', async () => { + const newField = _.cloneDeep(field) + newField.columns[0] = newField.columns[0].id + const layout = erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[1]), true, 'en') + layout.columns[0].rows[0].columns[0].list.push(newField) + const data = wrapLayoutDataByLayoutType({ + pc: [ + layout + ], + mobile: [ + layout + ] + }, field, 2) + wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) + await nextTick() + expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) + }) + test('Tabs', async () => { + const newField = _.cloneDeep(field) + newField.columns[0] = newField.columns[0].id + const layout = erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[2]), true, 'en') + layout.columns[0].columns[0].list.push(newField) + const data = wrapLayoutDataByLayoutType({ + pc: [ + layout + ], + mobile: [ + layout + ] + }, field, 2) + wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) + await nextTick() + expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) + }) + test('nested layout:Grid > Grid > field', async () => { + const newField = _.cloneDeep(field) + newField.columns[0] = newField.columns[0].id + const grid0 = erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[0]), true, 'en') + const grid1 = erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[0]), true, 'en') + grid0.columns[0].columns[0].list.push(grid1) + grid1.columns[0].columns[0].list.push(newField) + const data = wrapLayoutDataByLayoutType({ + pc: [ + grid0 + ], + mobile: [ + grid0 + ] + }, field, 2) + wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) + await nextTick() + expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) + }) +}) diff --git a/test/utils.js b/test/utils.js new file mode 100644 index 0000000..81afd83 --- /dev/null +++ b/test/utils.js @@ -0,0 +1,60 @@ +import { mount } from '@vue/test-utils' +import { erFormEditor } from '@ER/formEditor/index.js' +import ElementPlus from 'element-plus' +import Vant from 'vant' + +export const _mount = (template, data, otherObj) => mount( + { + components: { + erFormEditor + }, + template, + data, + ...otherObj + }, + { + attachTo: 'body', + global: { + plugins: [ + ElementPlus, + Vant + ] + } + } +) +export const wrapLayoutDataByLayoutType = (layout, field, layoutType = 1) => { + const result = { + config: { + isSync: true, + pc: { + size: 'default', + labelPosition: 'left', + completeButton: { + text: 'Submit', + color: '', + backgroundColor: '' + } + }, + mobile: { + labelPosition: 'left', + completeButton: { + text: 'Submit', + color: '', + backgroundColor: '' + } + } + }, + logic: {}, + data: {}, + fields: [ + field.columns[0] + ] + } + if (layoutType === 1) { + result.list = layout + } + if (layoutType === 2) { + result.layout = layout + } + return result +} From 064397e76eef97489362ae393024ec14b6ee25d3 Mon Sep 17 00:00:00 2001 From: Liberty Date: Wed, 30 Aug 2023 16:12:35 +0800 Subject: [PATCH 07/33] test(disassemblyData): sub-form --- packages/utils/field.js | 14 ++++++-------- test/disassemblyData/layoutType1.test.js | 22 +++++++++++++++++----- test/disassemblyData/layoutType2.test.js | 10 +++++----- test/utils.js | 9 +++++---- 4 files changed, 33 insertions(+), 22 deletions(-) diff --git a/packages/utils/field.js b/packages/utils/field.js index 7944055..c6d6c78 100644 --- a/packages/utils/field.js +++ b/packages/utils/field.js @@ -101,18 +101,16 @@ const combinationData1 = (data) => { fields: data.fields, logic: data.logic } - flatNodes(data.list, excludes, (nodes, node, currentIndex) => { - const cur = _.find(data.fields, { id: node }) - if (!_.isEmpty(cur)) { - nodes[currentIndex] = cur - } - }) - flatNodes(data.list, excludes, (nodes, node, currentIndex) => { + const fn = (nodes, node, currentIndex) => { const cur = _.find(data.fields, { id: node }) if (!_.isEmpty(cur)) { + if (cur.type === 'subform') { + flatNodes(cur.list, excludes, fn) + } nodes[currentIndex] = cur } - }) + } + flatNodes(data.list, excludes, fn) return result } const combinationData2 = (list, fields) => { diff --git a/test/disassemblyData/layoutType1.test.js b/test/disassemblyData/layoutType1.test.js index ebe0dd9..f1fe2bd 100644 --- a/test/disassemblyData/layoutType1.test.js +++ b/test/disassemblyData/layoutType1.test.js @@ -27,27 +27,27 @@ describe('Fields and layout not separated', () => { test('Only fields without layout', async () => { const newField = _.cloneDeep(field) newField.columns[0] = newField.columns[0].id - const data = wrapLayoutDataByLayoutType([newField], field) + const data = wrapLayoutDataByLayoutType([newField], [field.columns[0]]) wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) await nextTick() expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) }) test('Grid', async () => { - const data = wrapLayoutDataByLayoutType([erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[0]), true, 'en')], field) + const data = wrapLayoutDataByLayoutType([erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[0]), true, 'en')], [field.columns[0]]) data.list[0].columns[0].columns[0].list.push(field.columns[0].id) wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) await nextTick() expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) }) test('Table', async () => { - const data = wrapLayoutDataByLayoutType([erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[1]), true, 'en')], field) + const data = wrapLayoutDataByLayoutType([erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[1]), true, 'en')], [field.columns[0]]) data.list[0].columns[0].rows[0].columns[0].list.push(field.columns[0].id) wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) await nextTick() expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) }) test('Tabs', async () => { - const data = wrapLayoutDataByLayoutType([erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[2]), true, 'en')], field) + const data = wrapLayoutDataByLayoutType([erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[2]), true, 'en')], [field.columns[0]]) data.list[0].columns[0].columns[0].list.push(field.columns[0].id) wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) await nextTick() @@ -58,9 +58,21 @@ describe('Fields and layout not separated', () => { const grid1 = erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[0]), true, 'en') grid0.columns[0].columns[0].list.push(grid1) grid1.columns[0].columns[0].list.push(field.columns[0].id) - const data = wrapLayoutDataByLayoutType([grid0], field) + const data = wrapLayoutDataByLayoutType([grid0], [field.columns[0]]) wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) await nextTick() expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) }) + test('Sub-form', async () => { + const newField = _.cloneDeep(field) + newField.columns[0] = newField.columns[0].id + const sufForm = erGeneratorData(_.cloneDeep(erComponentsConfig.fieldsConfig[2].list[5]), true, 'en') + const list = _.cloneDeep(sufForm) + list.columns[0] = sufForm.columns[0].id + sufForm.columns[0].list.push(newField) + const data = wrapLayoutDataByLayoutType([list], [sufForm.columns[0], field.columns[0]]) + // console.log(JSON.stringify(data, '', 2)) + wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) + expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) + }) }) diff --git a/test/disassemblyData/layoutType2.test.js b/test/disassemblyData/layoutType2.test.js index 4bd04eb..96a3293 100644 --- a/test/disassemblyData/layoutType2.test.js +++ b/test/disassemblyData/layoutType2.test.js @@ -34,7 +34,7 @@ describe('Fields and layout separated', () => { mobile: [ newField ] - }, field, 2) + }, [field.columns[0]], 2) wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) await nextTick() expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) @@ -51,7 +51,7 @@ describe('Fields and layout separated', () => { mobile: [ layout ] - }, field, 2) + }, [field.columns[0]], 2) wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) await nextTick() expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) @@ -68,7 +68,7 @@ describe('Fields and layout separated', () => { mobile: [ layout ] - }, field, 2) + }, [field.columns[0]], 2) wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) await nextTick() expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) @@ -85,7 +85,7 @@ describe('Fields and layout separated', () => { mobile: [ layout ] - }, field, 2) + }, [field.columns[0]], 2) wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) await nextTick() expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) @@ -104,7 +104,7 @@ describe('Fields and layout separated', () => { mobile: [ grid0 ] - }, field, 2) + }, [field.columns[0]], 2) wrapper.findComponent({ ref: 'EReditorRef' }).vm.setData(data) await nextTick() expect(wrapper.findComponent({ ref: 'EReditorRef' }).vm.getData()).toEqual(data) diff --git a/test/utils.js b/test/utils.js index 81afd83..c7b91e3 100644 --- a/test/utils.js +++ b/test/utils.js @@ -22,7 +22,7 @@ export const _mount = (template, data, otherObj) => mount( } } ) -export const wrapLayoutDataByLayoutType = (layout, field, layoutType = 1) => { +export const wrapLayoutDataByLayoutType = (layout, fields, layoutType = 1) => { const result = { config: { isSync: true, @@ -46,9 +46,10 @@ export const wrapLayoutDataByLayoutType = (layout, field, layoutType = 1) => { }, logic: {}, data: {}, - fields: [ - field.columns[0] - ] + fields + // fields: [ + // field.columns[0] + // ] } if (layoutType === 1) { result.list = layout From ff0805730921c8458cf767834e6d47b44accd9ab Mon Sep 17 00:00:00 2001 From: Liberty Date: Wed, 30 Aug 2023 16:52:15 +0800 Subject: [PATCH 08/33] refactor: el-breadcrumb icon --- .../components/Panels/Config/index.vue | 17 ++++++++++++++--- 1 file changed, 14 insertions(+), 3 deletions(-) diff --git a/packages/formEditor/components/Panels/Config/index.vue b/packages/formEditor/components/Panels/Config/index.vue index 9ee3114..3209315 100644 --- a/packages/formEditor/components/Panels/Config/index.vue +++ b/packages/formEditor/components/Panels/Config/index.vue @@ -1,7 +1,7 @@ + + diff --git a/packages/formEditor/index.vue b/packages/formEditor/index.vue index 55ad749..d98adc7 100644 --- a/packages/formEditor/index.vue +++ b/packages/formEditor/index.vue @@ -305,18 +305,6 @@ const fireEvent = (type, data) => { data }) } -provide('Everright', { - state, - setSelection, - props, - wrapElement, - delField, - addField, - switchPlatform, - addFieldData, - canvesScrollRef, - fireEvent -}) const ns = hooks.useNamespace('Main', state.Namespace) const getData1 = () => { return utils.disassemblyData1(_.cloneDeep({ @@ -356,6 +344,7 @@ const setData1 = (data) => { }) nextTick(() => { isShow.value = true + // setSelection(state.store[0]) // restart() }) } @@ -457,6 +446,19 @@ watch(() => state.selected, (newVal) => { }) const onClickOutside = () => { } +provide('Everright', { + state, + setSelection, + props, + wrapElement, + delField, + addField, + switchPlatform, + addFieldData, + canvesScrollRef, + fireEvent, + getData +})