npm - @kp-ui/lowcode-pc - Versions diffs - 1.0.5 → 1.0.7 - Mend

@kp-ui/lowcode-pc 1.0.5 → 1.0.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (133) hide show

package/assets/styles/style.css CHANGED Viewed

@@ -30,20 +30,20 @@
 }
 @tailwind components;
 @tailwind utilities;
-.sub-form-container[data-v-0268e409] {
+.sub-form-container[data-v-79efc207] {
   margin-bottom: 16px;
   text-align: left;
   background: #fafafa;
   border-radius: 8px;
   padding: 10px;
 }
-.sub-form-container .header-row[data-v-0268e409] {
+.sub-form-container .header-row[data-v-79efc207] {
   margin-top: 15px;
 }
-.sub-form-container .header-row[data-v-0268e409] .action-button {
+.sub-form-container .header-row[data-v-79efc207] .action-button {
   height: 35px;
 }
-.sub-form-container .sub-form-row[data-v-0268e409] {
+.sub-form-container .sub-form-row[data-v-79efc207] {
   display: flex;
   align-items: center;
   background: white;
@@ -51,22 +51,22 @@
   border-radius: 6px;
   box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
 }
-.sub-form-container .sub-form-row .row-number-span[data-v-0268e409] {
+.sub-form-container .sub-form-row .row-number-span[data-v-79efc207] {
   margin-left: 16px;
 }
-.sub-form-action-column[data-v-0268e409] {
+.sub-form-action-column[data-v-79efc207] {
   display: inline-block;
   align-items: center;
   text-align: center;
   padding: 8px;
 }
-.grid-sub-form-data-row[data-v-0268e409] {
+.grid-sub-form-data-row[data-v-79efc207] {
   display: inline-block;
   flex: 1;
   padding: 10px;
   position: relative;
 }
-.grid-sub-form-data-row[data-v-0268e409]:before, .grid-sub-form-data-row[data-v-0268e409]:after {
+.grid-sub-form-data-row[data-v-79efc207]:before, .grid-sub-form-data-row[data-v-79efc207]:after {
   content: "";
   display: inline-block;
   width: 1px;
@@ -76,16 +76,16 @@
   top: 50%;
   transform: translateY(-50%);
 }
-.grid-sub-form-data-row[data-v-0268e409]:before {
+.grid-sub-form-data-row[data-v-79efc207]:before {
   left: 0;
 }
-.grid-sub-form-data-row[data-v-0268e409]:after {
+.grid-sub-form-data-row[data-v-79efc207]:after {
   right: 0;
 }
-.grid-sub-form-data-row[data-v-0268e409] .ant-form-item {
+.grid-sub-form-data-row[data-v-79efc207] .ant-form-item {
   margin-bottom: 0;
 }
-.row-no-column[data-v-0268e409] {
+.row-no-column[data-v-79efc207] {
   display: flex;
   align-items: center;
   width: 50px;
@@ -96,7 +96,7 @@
   font-size: 14px;
   color: #666;
 }
-.action-button-column[data-v-0268e409] {
+.action-button-column[data-v-79efc207] {
   width: 140px;
 }.grid-cell[data-v-13ad810a] {
   padding: 3px;
@@ -251,17 +251,17 @@
   overflow: hidden;
   background-color: #fff;
 }
-.box-container[data-v-053bd1ae] {
+.box-container[data-v-2f18f5a7] {
   width: 100%;
   position: relative;
 }
-.tab-container .form-widget-list[data-v-1080446b] {
+.tab-container .form-widget-list[data-v-7dd195c1] {
   min-height: 28px;
 }
-.tab-container[data-v-1080446b] .ant-tabs.ant-tabs-bottom .ant-tabs-nav-wrap, .tab-container[data-v-1080446b] .ant-tabs.ant-tabs-top .ant-tabs-nav-wrap {
+.tab-container[data-v-7dd195c1] .ant-tabs.ant-tabs-bottom .ant-tabs-nav-wrap, .tab-container[data-v-7dd195c1] .ant-tabs.ant-tabs-top .ant-tabs-nav-wrap {
   padding-left: 26px;
 }
-.tab-container[data-v-1080446b] .tab-content-wrapper {
+.tab-container[data-v-7dd195c1] .tab-content-wrapper {
   min-height: 100px;
 }.drag-handler[data-v-d93fc5cc] {
   position: absolute;
@@ -344,38 +344,38 @@
 .widget-wrapper .action-buttons[data-v-f2552afd]:hover {
   background-color: #ff4d4f;
 }
-.designer-widget-list[data-v-0fdc8abe] {
+.designer-widget-list[data-v-cdfa16a0] {
   position: relative;
   display: flex;
   flex-direction: column;
 }
-.designer-widget-list.empty-list[data-v-0fdc8abe] {
+.designer-widget-list.empty-list[data-v-cdfa16a0] {
   min-height: 96px;
 }
-.designer-widget-list .empty-drop-zone[data-v-0fdc8abe] {
+.designer-widget-list .empty-drop-zone[data-v-cdfa16a0] {
   position: absolute;
   left: 0;
   width: 100%;
   z-index: 2;
 }
-.designer-widget-list[data-v-0fdc8abe] .sortable-ghost {
+.designer-widget-list[data-v-cdfa16a0] .sortable-ghost {
   z-index: 99;
 }
-.list-transition-container[data-v-0fdc8abe] {
+.list-transition-container[data-v-cdfa16a0] {
   display: flex;
   flex-direction: column;
   padding: 2px;
 }
-.transition-group-el[data-v-0fdc8abe] {
+.transition-group-el[data-v-cdfa16a0] {
   position: relative;
   padding: 1px;
 }
-.transition-group-el .sortable-ghost[data-v-0fdc8abe] {
+.transition-group-el .sortable-ghost[data-v-cdfa16a0] {
   width: 100%;
 }
 /* SortableJS 自动应用的类 */
-.ghost-placeholder[data-v-0fdc8abe] {
+.ghost-placeholder[data-v-cdfa16a0] {
   opacity: 0.5;
   background: #c8ebfb;
   border: 2px dashed var(--ant-primary-color);
@@ -383,10 +383,10 @@
   margin: 4px 0;
   border-radius: 4px;
 }
-.sortable-chosen[data-v-0fdc8abe] {
+.sortable-chosen[data-v-cdfa16a0] {
   background: #fdfdfd;
 }
-.empty-drop-zone[data-v-0fdc8abe] {
+.empty-drop-zone[data-v-cdfa16a0] {
   line-height: 1.2;
   display: flex;
   align-items: center;
@@ -404,10 +404,10 @@
   color: #999;
   font-size: 14px;
 }
-.desginer-canvas[data-v-0fdc8abe] .ant-form-item {
+.desginer-canvas[data-v-cdfa16a0] .ant-form-item {
   margin-bottom: 0;
 }/* 调试面板样式 */
-.debug-panel[data-v-10eb5e61] {
+.debug-panel[data-v-db68aa3b] {
   position: absolute;
   top: 0;
   right: 0;
@@ -422,18 +422,18 @@
   border-top-left-radius: 8px;
   border-bottom-left-radius: 8px;
 }
-.debug-panel[data-v-10eb5e61] .jv-container .jv-code {
+.debug-panel[data-v-db68aa3b] .jv-container .jv-code {
   padding: 0;
 }
-.debug-panel.collapsed[data-v-10eb5e61] {
+.debug-panel.collapsed[data-v-db68aa3b] {
   transform: translateX(400px);
 }
-.debug-panel.collapsed .debug-toggle[data-v-10eb5e61] {
+.debug-panel.collapsed .debug-toggle[data-v-db68aa3b] {
   left: -40px;
   border-radius: 8px 0 0 8px;
   width: 40px;
 }
-.debug-panel .debug-toggle[data-v-10eb5e61] {
+.debug-panel .debug-toggle[data-v-db68aa3b] {
   position: absolute;
   left: -40px;
   top: 20px;
@@ -452,20 +452,20 @@
   padding: 8px 0;
   user-select: none;
 }
-.debug-panel .debug-content[data-v-10eb5e61] {
+.debug-panel .debug-content[data-v-db68aa3b] {
   flex: 1;
   overflow: auto;
   padding: 16px;
   background-color: #f5f7fa;
 }
-.debug-panel .debug-content .debug-section[data-v-10eb5e61] {
+.debug-panel .debug-content .debug-section[data-v-db68aa3b] {
   margin-bottom: 24px;
   background-color: #fff;
   border-radius: 8px;
   padding: 16px;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
 }
-.debug-panel .debug-content .debug-section h3[data-v-10eb5e61] {
+.debug-panel .debug-content .debug-section h3[data-v-db68aa3b] {
   margin: 0 0 12px 0;
   font-size: 14px;
   font-weight: 600;
@@ -473,18 +473,18 @@
   border-bottom: 1px solid #e8e8e8;
   padding-bottom: 8px;
 }
-.debug-panel .debug-content .debug-section .empty-state[data-v-10eb5e61] {
+.debug-panel .debug-content .debug-section .empty-state[data-v-db68aa3b] {
   color: #999;
   font-size: 12px;
   text-align: center;
   padding: 20px;
 }
-.debug-panel .debug-content .debug-section .widget-list[data-v-10eb5e61] {
+.debug-panel .debug-content .debug-section .widget-list[data-v-db68aa3b] {
   display: flex;
   flex-direction: column;
   gap: 2px;
 }
-.debug-panel .debug-content .debug-section .widget-list .widget-item[data-v-10eb5e61] {
+.debug-panel .debug-content .debug-section .widget-list .widget-item[data-v-db68aa3b] {
   border: 1px solid #e8e8e8;
   border-radius: 4px;
   padding: 2px 4px;
@@ -492,12 +492,12 @@
   background-color: #fafafa;
   cursor: pointer;
 }
-.debug-panel .debug-content .debug-section .widget-list .widget-item .widget-key[data-v-10eb5e61] {
+.debug-panel .debug-content .debug-section .widget-list .widget-item .widget-key[data-v-db68aa3b] {
   font-weight: 600;
   color: var(--ant-primary-color);
   font-size: 12px;
 }
-.debug-panel .debug-content pre[data-v-10eb5e61] {
+.debug-panel .debug-content pre[data-v-db68aa3b] {
   margin: 0;
   font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
   font-size: 12px;
@@ -509,25 +509,25 @@
   color: #333;
 }
-.field-wrapper[data-v-fe290edb] {
+.field-wrapper[data-v-1e482344] {
   position: relative;
 }
-.ant-form-item[data-v-fe290edb] {
+.ant-form-item[data-v-1e482344] {
   position: relative;
   /* 隐藏Chrome浏览器中el-input数字输入框右侧的上下调整小箭头 */
 }
-.ant-form-item[data-v-fe290edb] .ant-form-item-label {
+.ant-form-item[data-v-1e482344] .ant-form-item-label {
   white-space: nowrap;
   text-overflow: ellipsis;
 }
-.ant-form-item span.custom-label[data-v-fe290edb] {
+.ant-form-item span.custom-label[data-v-1e482344] {
   display: flex;
 }
-.ant-form-item span.custom-label i[data-v-fe290edb] {
+.ant-form-item span.custom-label i[data-v-1e482344] {
   margin: 0 3px;
 }
-.ant-form-item[data-v-fe290edb] .hide-spin-button input::-webkit-outer-spin-button,
-.ant-form-item[data-v-fe290edb] .hide-spin-button input::-webkit-inner-spin-button {
+.ant-form-item[data-v-1e482344] .hide-spin-button input::-webkit-outer-spin-button,
+.ant-form-item[data-v-1e482344] .hide-spin-button input::-webkit-inner-spin-button {
   -webkit-appearance: none !important;
 }[data-v-3974eef4] .bjs-powered-by {
   display: none;
@@ -706,25 +706,25 @@
 }
 .grid-container .form-widget-list[data-v-d41dbfac] {
   min-height: 28px;
-}.top-action[data-v-d47a2444] {
+}.top-action[data-v-63f1a31d] {
   display: flex;
   gap: 8px;
   padding: 4px 0 8px;
 }
-.talbe-wrapper[data-v-d47a2444] {
+.talbe-wrapper[data-v-63f1a31d] {
   width: 100%;
 }
-.talbe-wrapper .vxe-grid[data-v-d47a2444] {
+.talbe-wrapper .vxe-grid[data-v-63f1a31d] {
   width: 100%;
 }
-.talbe-wrapper__pagination[data-v-d47a2444] {
+.talbe-wrapper__pagination[data-v-63f1a31d] {
   margin-top: 10px;
   display: flex;
   justify-content: end;
-}.tab-container .form-widget-list[data-v-3280ee5e] {
+}.tab-container .form-widget-list[data-v-149d976d] {
   min-height: 28px;
 }
-.tab-container[data-v-3280ee5e] .ant-tabs.ant-tabs-bottom .ant-tabs-nav-wrap, .tab-container[data-v-3280ee5e] .ant-tabs.ant-tabs-top .ant-tabs-nav-wrap {
+.tab-container[data-v-149d976d] .ant-tabs.ant-tabs-bottom .ant-tabs-nav-wrap, .tab-container[data-v-149d976d] .ant-tabs.ant-tabs-top .ant-tabs-nav-wrap {
   padding-left: 26px;
 }.collapse-container[data-v-eefdb1f5] {
   display: flex;

package/core/src/components/common/RenderWidgetList.vue.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import _sfc_main from "./RenderWidgetList.vue2.js";
 /* empty css                      */
 import _export_sfc from "../../../../_virtual/_plugin-vue_export-helper.js";
-const RenderWidgetList = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-0fdc8abe"]]);
+const RenderWidgetList = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-cdfa16a0"]]);
 export {
   RenderWidgetList as default
 };

package/core/src/components/common/RenderWidgetList.vue2.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { defineComponent, mergeModels, useModel, createBlock, createElementBlock, unref, openBlock, normalizeClass, withCtx, createCommentVNode, createElementVNode, createVNode, resolveDynamicComponent, Fragment, renderList } from "vue";
+import { defineComponent, mergeModels, provide, toRef, useModel, createBlock, createElementBlock, unref, openBlock, normalizeClass, withCtx, createCommentVNode, createElementVNode, createVNode, resolveDynamicComponent, Fragment, renderList } from "vue";
 import Draggable from "vuedraggable";
 import { useDesigner } from "../../hooks/useDesigner.js";
 import WidgetWrapper from "./desginer/WidgetWrapper.vue.js";
@@ -15,6 +15,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   __name: "RenderWidgetList",
   props: /* @__PURE__ */ mergeModels({
+    subFormRowIndex: {},
     isCanvas: { type: Boolean, default: false },
     allowTypes: { default: () => [] },
     notAllowTypes: { default: () => [] },
@@ -28,7 +29,17 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   }),
   emits: ["update:list"],
   setup(__props) {
-    const { designer, onDragAdd, onDragUpdate, designState, getWidget } = useDesigner();
+    const props = __props;
+    const {
+      designer,
+      onDragAdd,
+      onDragUpdate,
+      designState,
+      getWidget
+    } = useDesigner();
+    if (typeof props.subFormRowIndex === "number") {
+      provide("subFormRowIndex", toRef(props.subFormRowIndex));
+    }
     const onMove = (evt) => {
       return designer.value.checkWidgetMove(evt);
     };

package/core/src/components/common/RenderWidgetList.vue2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RenderWidgetList.vue2.js","sources":["../../../../../../core/src/components/common/RenderWidgetList.vue"],"sourcesContent":["<template>\n <template v-if=\"designState\">\n <draggable\n v-model=\"draggableList\"\n class=\"designer-widget-list list-transition-container\"\n :class=\"[{ 'empty-list': !draggableList.length }, { 'desginer-canvas': isCanvas }]\"\n tag=\"div\"\n :animation=\"200\"\n group=\"widget\"\n handle=\".drag-handler\"\n item-key=\"id\"\n :move=\"onMove\"\n :data-allow-types=\"allowTypes.join(',')\"\n :data-not-allow-types=\"notAllowTypes.join(',')\"\n @update=\"onDragUpdate\"\n @add=\"(evt: any) => onDragAdd(evt, draggableList)\"\n >\n <template #item=\"{ element: widget, index }\">\n <div :id=\"widget.id\" class=\"transition-group-el\" :data-widget-id=\"widget.id\">\n <WidgetWrapper :widget=\"widget\" :index=\"index\" v-model:list=\"draggableList\">\n <component\n :is=\"getWidget(widget)\"\n :widget=\"widget\"\n :field=\"widget\"\n :index=\"index\"\n />\n </WidgetWrapper>\n </div>\n </template>\n <template #footer>\n <div v-if=\"!draggableList.length\" class=\"empty-drop-zone\"> 拖拽组件到此处 </div>\n </template>\n </draggable>\n </template>\n <template v-else>\n <div\n v-for=\"(widget, index) in draggableList\"\n :key=\"`${widget.id}_${index}`\"\n class=\"t-overflow-hidden\"\n :id=\"widget.id\"\n >\n <component :is=\"getWidget(widget)\" :widget=\"widget\" :field=\"widget\" :index=\"index\" />\n </div>\n </template>\n</template>\n\n<script lang=\"ts\" setup>\n import draggable from 'vuedraggable';\n import { useDesigner, WidgetWrapper } from '@kp-ui/lowcode-core';\n import type { Widget, FormDesigner } from '@kp-ui/lowcode-core';\n\n defineOptions({\n inheritAttrs: false,\n name: 'RenderWidgetList'\n });\n\n const props = withDefaults(\n defineProps<{\n isCanvas?: boolean;\n allowTypes?: string[];\n notAllowTypes?: string[];\n parentWidget: Widget \| FormDesigner \| null;\n }>(),\n {\n isCanvas: false,\n allowTypes: () => [],\n notAllowTypes: () => []\n }\n );\n\n const { designer, onDragAdd, onDragUpdate, designState, getWidget } = useDesigner();\n\n const onMove = (evt: any) => {\n return designer.value.checkWidgetMove(evt);\n };\n\n const draggableList = defineModel<Widget[]>('list', {\n type: Array,\n default: []\n });\n</script>\n\n<style scoped lang=\"scss\">\n .designer-widget-list {\n position: relative;\n display: flex;\n flex-direction: column;\n // gap: 3px;\n &.empty-list {\n min-height: 96px;\n }\n .empty-drop-zone {\n position: absolute;\n // top: 5px;\n left: 0;\n width: 100%;\n z-index: 2;\n }\n :deep(.sortable-ghost) {\n z-index: 99;\n }\n }\n\n .list-transition-container {\n display: flex;\n flex-direction: column;\n padding: 2px;\n }\n\n .transition-group-el {\n position: relative;\n padding: 1px;\n .sortable-ghost {\n width: 100%;\n }\n }\n\n /* SortableJS 自动应用的类 */\n .ghost-placeholder {\n opacity: 0.5;\n background: #c8ebfb;\n border: 2px dashed var(--ant-primary-color);\n height: 40px;\n margin: 4px 0;\n border-radius: 4px;\n }\n\n .sortable-chosen {\n background: #fdfdfd;\n }\n\n .empty-drop-zone {\n line-height: 1.2;\n display: flex;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n font-size: 12px;\n margin: 2px 0;\n height: 90px;\n background: rgba(#000, 0.05);\n border: 1px dashed #d9d9d9;\n border-radius: 2px;\n display: flex;\n align-items: center;\n justify-content: center;\n color: #999;\n font-size: 14px;\n }\n .desginer-canvas {\n &:deep(.ant-form-item) {\n margin-bottom: 0;\n }\n }\n</style>\n"],"names":["_useModel","_unref","_createBlock","draggable","isCanvas","allowTypes","notAllowTypes","_withCtx","_createElementVNode","_createVNode","_resolveDynamicComponent","_createElementBlock","_openBlock","_Fragment","_renderList"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsEI~~,UAAM,~~EAAE~~,~~UAAU~~,~~WAAW~~,~~cAAc~~,~~aAAa~~,~~UAAA~~,~~IAAc~~,YAAA;~~AAEtE~~,UAAM,SAAS,CAAC,QAAa;AACzB,aAAO,SAAS,MAAM,gBAAgB,GAAG;AAAA,IAC7C;AAEA,UAAM,gBAAgBA,kBAAsB,MAG3C;;~~aA9EeC~~,MAAA,WAAA,kBACZC,YA8BYD,MAAAE,SAAA,GAAA;AAAA;oBA7BC,cAAA;AAAA,qEAAA,cAAa,QAAA;AAAA,QACtB,uBAAM,kDAAgD,CAAA,EAAA,cAAA,CAC5B,oBAAc,OAAA,wBAA+BC,KAAAA,SAAAA,CAAQ,CAAA,CAAA;AAAA,QAC/E,KAAI;AAAA,QACH,WAAW;AAAA,QACZ,OAAM;AAAA,QACN,QAAO;AAAA,QACP,YAAS;AAAA,QACR,MAAM;AAAA,QACN,oBAAkBC,KAAAA,WAAW,KAAI,GAAA;AAAA,QACjC,wBAAsBC,KAAAA,cAAc,KAAI,GAAA;AAAA,QACxC,UAAQL,MAAA,YAAA;AAAA,QACR,kCAAM,QAAaA,iBAAU,KAAK,cAAA,KAAa;AAAA,MAAA;QAErC,MAAIM,QACX,CASM,EAAA,SAVkB,QAAQ,YAAK;AAAA,UACrCC,mBASM,OAAA;AAAA,YATA,IAAI,OAAO;AAAA,YAAI,OAAM;AAAA,YAAuB,kBAAgB,OAAO;AAAA,UAAA;YACrEC,YAOgBR,MAAA,aAAA,GAAA;AAAA,cAPA;AAAA,cAAiB;AAAA,cAAsB,MAAM,cAAA;AAAA,qEAAA,cAAa,QAAA;AAAA,YAAA;+BACtE,MAKE;AAAA,8BALFC,YAKEQ,wBAJOT,MAAA,SAAA,EAAU,MAAM,CAAA,GAAA;AAAA,kBACpB;AAAA,kBACA,OAAO;AAAA,kBACP;AAAA,gBAAA;;;;;;QAKN,gBACP,MAAyE;AAAA,UAA7D,CAAA,cAAA,MAAc,uBAA1BU,mBAAyE,OAAzE,YAA0D,WAAS;;;iGAK3EC,UAAA,IAAA,GAAAD,mBAOME,UAAA,EAAA,KAAA,EAAA,GAAAC,WANwB,cAAA,OAAa,CAA/B,QAAQ,UAAK;4BADzBH,mBAOM,OAAA;AAAA,UALD,KAAG,GAAK,OAAO,EAAE,IAAI,KAAK;AAAA,UAC3B,OAAM;AAAA,UACL,IAAI,OAAO;AAAA,QAAA;wBAEZT,YAAqFQ,wBAArET,MAAA,SAAA,EAAU,MAAM,CAAA,GAAA;AAAA,YAAI;AAAA,YAAiB,OAAO;AAAA,YAAS;AAAA,UAAA;;;;;;"}
1	+ {"version":3,"file":"RenderWidgetList.vue2.js","sources":["../../../../../../core/src/components/common/RenderWidgetList.vue"],"sourcesContent":["<template>\n <template v-if=\"designState\">\n <draggable\n v-model=\"draggableList\"\n class=\"designer-widget-list list-transition-container\"\n :class=\"[{ 'empty-list': !draggableList.length }, { 'desginer-canvas': isCanvas }]\"\n tag=\"div\"\n :animation=\"200\"\n group=\"widget\"\n handle=\".drag-handler\"\n item-key=\"id\"\n :move=\"onMove\"\n :data-allow-types=\"allowTypes.join(',')\"\n :data-not-allow-types=\"notAllowTypes.join(',')\"\n @update=\"onDragUpdate\"\n @add=\"(evt: any) => onDragAdd(evt, draggableList)\"\n >\n <template #item=\"{ element: widget, index }\">\n <div :id=\"widget.id\" class=\"transition-group-el\" :data-widget-id=\"widget.id\">\n <WidgetWrapper :widget=\"widget\" :index=\"index\" v-model:list=\"draggableList\">\n <component\n :is=\"getWidget(widget)\"\n :widget=\"widget\"\n :field=\"widget\"\n :index=\"index\"\n />\n </WidgetWrapper>\n </div>\n </template>\n <template #footer>\n <div v-if=\"!draggableList.length\" class=\"empty-drop-zone\"> 拖拽组件到此处 </div>\n </template>\n </draggable>\n </template>\n <template v-else>\n <div\n v-for=\"(widget, index) in draggableList\"\n :key=\"`${widget.id}_${index}`\"\n class=\"t-overflow-hidden\"\n :id=\"widget.id\"\n >\n <component :is=\"getWidget(widget)\" :widget=\"widget\" :field=\"widget\" :index=\"index\" />\n </div>\n </template>\n</template>\n\n<script lang=\"ts\" setup>\n import draggable from 'vuedraggable';\n import { useDesigner, WidgetWrapper } from '@kp-ui/lowcode-core';\n import type { Widget, FormDesigner } from '@kp-ui/lowcode-core';\n import { onMounted, provide, toRef } from 'vue';\n\n defineOptions({\n inheritAttrs: false,\n name: 'RenderWidgetList'\n });\n\n const props = withDefaults(\n defineProps<{\n subFormRowIndex?: number \| string;\n isCanvas?: boolean;\n allowTypes?: string[];\n notAllowTypes?: string[];\n parentWidget: Widget \| FormDesigner \| null;\n }>(),\n {\n isCanvas: false,\n allowTypes: () => [],\n notAllowTypes: () => []\n }\n );\n\n const {\n isSubFormField,\n subFormRowIndex,\n designer,\n onDragAdd,\n onDragUpdate,\n designState,\n getWidget\n } = useDesigner();\n\n if (typeof props.subFormRowIndex === 'number') {\n provide('subFormRowIndex', toRef(props.subFormRowIndex));\n }\n\n const onMove = (evt: any) => {\n return designer.value.checkWidgetMove(evt);\n };\n\n const draggableList = defineModel<Widget[]>('list', {\n type: Array,\n default: []\n });\n</script>\n\n<style scoped lang=\"scss\">\n .designer-widget-list {\n position: relative;\n display: flex;\n flex-direction: column;\n // gap: 3px;\n &.empty-list {\n min-height: 96px;\n }\n .empty-drop-zone {\n position: absolute;\n // top: 5px;\n left: 0;\n width: 100%;\n z-index: 2;\n }\n :deep(.sortable-ghost) {\n z-index: 99;\n }\n }\n\n .list-transition-container {\n display: flex;\n flex-direction: column;\n padding: 2px;\n }\n\n .transition-group-el {\n position: relative;\n padding: 1px;\n .sortable-ghost {\n width: 100%;\n }\n }\n\n /* SortableJS 自动应用的类 */\n .ghost-placeholder {\n opacity: 0.5;\n background: #c8ebfb;\n border: 2px dashed var(--ant-primary-color);\n height: 40px;\n margin: 4px 0;\n border-radius: 4px;\n }\n\n .sortable-chosen {\n background: #fdfdfd;\n }\n\n .empty-drop-zone {\n line-height: 1.2;\n display: flex;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n font-size: 12px;\n margin: 2px 0;\n height: 90px;\n background: rgba(#000, 0.05);\n border: 1px dashed #d9d9d9;\n border-radius: 2px;\n display: flex;\n align-items: center;\n justify-content: center;\n color: #999;\n font-size: 14px;\n }\n .desginer-canvas {\n &:deep(.ant-form-item) {\n margin-bottom: 0;\n }\n }\n</style>\n"],"names":["_useModel","_unref","_createBlock","draggable","isCanvas","allowTypes","notAllowTypes","_withCtx","_createElementVNode","_createVNode","_resolveDynamicComponent","_createElementBlock","_openBlock","_Fragment","_renderList"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyDI,UAAM,QAAQ;AAed,UAAM;AAAA,MAGF;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA,IACA,YAAA;AAEJ,QAAI,OAAO,MAAM,oBAAoB,UAAU;AAC3C,cAAQ,mBAAmB,MAAM,MAAM,eAAe,CAAC;AAAA,IAC3D;AAEA,UAAM,SAAS,CAAC,QAAa;AACzB,aAAO,SAAS,MAAM,gBAAgB,GAAG;AAAA,IAC7C;AAEA,UAAM,gBAAgBA,kBAAsB,MAG3C;;aA5FeC,MAAA,WAAA,kBACZC,YA8BYD,MAAAE,SAAA,GAAA;AAAA;oBA7BC,cAAA;AAAA,qEAAA,cAAa,QAAA;AAAA,QACtB,uBAAM,kDAAgD,CAAA,EAAA,cAAA,CAC5B,oBAAc,OAAA,wBAA+BC,KAAAA,SAAAA,CAAQ,CAAA,CAAA;AAAA,QAC/E,KAAI;AAAA,QACH,WAAW;AAAA,QACZ,OAAM;AAAA,QACN,QAAO;AAAA,QACP,YAAS;AAAA,QACR,MAAM;AAAA,QACN,oBAAkBC,KAAAA,WAAW,KAAI,GAAA;AAAA,QACjC,wBAAsBC,KAAAA,cAAc,KAAI,GAAA;AAAA,QACxC,UAAQL,MAAA,YAAA;AAAA,QACR,kCAAM,QAAaA,iBAAU,KAAK,cAAA,KAAa;AAAA,MAAA;QAErC,MAAIM,QACX,CASM,EAAA,SAVkB,QAAQ,YAAK;AAAA,UACrCC,mBASM,OAAA;AAAA,YATA,IAAI,OAAO;AAAA,YAAI,OAAM;AAAA,YAAuB,kBAAgB,OAAO;AAAA,UAAA;YACrEC,YAOgBR,MAAA,aAAA,GAAA;AAAA,cAPA;AAAA,cAAiB;AAAA,cAAsB,MAAM,cAAA;AAAA,qEAAA,cAAa,QAAA;AAAA,YAAA;+BACtE,MAKE;AAAA,8BALFC,YAKEQ,wBAJOT,MAAA,SAAA,EAAU,MAAM,CAAA,GAAA;AAAA,kBACpB;AAAA,kBACA,OAAO;AAAA,kBACP;AAAA,gBAAA;;;;;;QAKN,gBACP,MAAyE;AAAA,UAA7D,CAAA,cAAA,MAAc,uBAA1BU,mBAAyE,OAAzE,YAA0D,WAAS;;;iGAK3EC,UAAA,IAAA,GAAAD,mBAOME,UAAA,EAAA,KAAA,EAAA,GAAAC,WANwB,cAAA,OAAa,CAA/B,QAAQ,UAAK;4BADzBH,mBAOM,OAAA;AAAA,UALD,KAAG,GAAK,OAAO,EAAE,IAAI,KAAK;AAAA,UAC3B,OAAM;AAAA,UACL,IAAI,OAAO;AAAA,QAAA;wBAEZT,YAAqFQ,wBAArET,MAAA,SAAA,EAAU,MAAM,CAAA,GAAA;AAAA,YAAI;AAAA,YAAiB,OAAO;AAAA,YAAS;AAAA,UAAA;;;;;;"}

package/core/src/components/common/render/Debugger.vue.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import _sfc_main from "./Debugger.vue2.js";
 /* empty css              */
 import _export_sfc from "../../../../../_virtual/_plugin-vue_export-helper.js";
-const Debugger = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-10eb5e61"]]);
+const Debugger = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-db68aa3b"]]);
 export {
   Debugger as default
 };

package/core/src/components/common/render/Debugger.vue2.js CHANGED Viewed

@@ -6,8 +6,6 @@ const _hoisted_3 = { class: "debug-section" };
 const _hoisted_4 = { class: "widget-list" };
 const _hoisted_5 = ["onClick"];
 const _hoisted_6 = { class: "widget-key" };
-const _hoisted_7 = { class: "debug-section" };
-const _hoisted_8 = { class: "widget-list" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "Debugger",
   props: {
@@ -22,7 +20,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const debugVisible = useModel(__props, "visible");
     const formDataModel = inject("formData", {});
     const widgetRefList = inject("refList", ref(/* @__PURE__ */ new Map()));
-    const formConfig = inject("formConfig", ref({}));
+    inject("formConfig", ref({}));
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
         class: normalizeClass(["debug-panel", { collapsed: !debugVisible.value }])
@@ -52,15 +50,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 ], 8, _hoisted_5);
               }), 128))
             ])
-          ]),
-          createElementVNode("div", _hoisted_7, [
-            _cache[2] || (_cache[2] = createElementVNode("h3", null, "FormConfig", -1)),
-            createElementVNode("div", _hoisted_8, [
-              createVNode(unref(JsonViewer), {
-                value: unref(formConfig),
-                "expand-depth": 5
-              }, null, 8, ["value"])
-            ])
           ])
         ])
       ], 2);

package/core/src/components/common/render/Debugger.vue2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Debugger.vue2.js","sources":["../../../../../../../core/src/components/common/render/Debugger.vue"],"sourcesContent":["<template>\n <div class=\"debug-panel\" :class=\"{ collapsed: !debugVisible }\">\n <div class=\"debug-toggle\" @click=\"debugVisible = !debugVisible\">\n {{ debugVisible ? '收起' : '调试' }}\n </div>\n <div class=\"debug-content\">\n <div class=\"debug-section\">\n <h3>Form Data Model</h3>\n <JsonViewer :value=\"formDataModel\" :expand-depth=\"5\" />\n </div>\n <div class=\"debug-section\">\n <h3>Widget Ref List ({{ widgetRefList.size }} widgets)</h3>\n <div class=\"widget-list\">\n <div\n v-for=\"[key, value] in widgetRefList\"\n @click=\"console.log(value)\"\n :key=\"key\"\n class=\"widget-item\"\n >\n <div class=\"widget-key\">{{ key }}</div>\n </div>\n </div>\n </div>\n <div class=\"debug-section\">\n <h3>FormConfig</h3>\n <div class=\"widget-list\">\n <JsonViewer :value=\"formConfig\" :expand-depth=\"5\" />\n </div>\n </div>\n </div>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\n import { ref, inject } from 'vue';\n import JsonViewer from 'vue-json-viewer';\n const debugVisible = defineModel('visible', {\n type: Boolean,\n default: false\n });\n\n const formDataModel = inject('formData', {});\n const widgetRefList = inject('refList', ref(new Map()));\n const formConfig = inject('formConfig', ref({}));\n</script>\n\n<style lang=\"less\" scoped>\n /* 调试面板样式 */\n .debug-panel {\n position: absolute;\n top: 0;\n right: 0;\n width: 400px;\n height: 100vh;\n background-color: #fff;\n box-shadow: -2px 0 8px rgba(0, 0, 0, 0.15);\n z-index: 9999;\n transition: transform 0.3s ease-in-out;\n display: flex;\n flex-direction: column;\n border-top-left-radius: 8px;\n border-bottom-left-radius: 8px;\n :deep(.jv-container .jv-code) {\n padding: 0;\n }\n\n &.collapsed {\n transform: translateX(400px);\n\n .debug-toggle {\n left: -40px;\n border-radius: 8px 0 0 8px;\n width: 40px;\n }\n }\n\n .debug-toggle {\n position: absolute;\n left: -40px;\n top: 20px;\n width: 40px;\n height: 40px;\n background-color: var(--ant-primary-color);\n color: #fff;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border-radius: 8px 0 0 8px;\n font-size: 12px;\n box-shadow: -2px 0 8px rgba(0, 0, 0, 0.15);\n writing-mode: vertical-lr;\n padding: 8px 0;\n user-select: none;\n }\n\n .debug-content {\n flex: 1;\n overflow: auto;\n padding: 16px;\n background-color: #f5f7fa;\n\n .debug-section {\n margin-bottom: 24px;\n background-color: #fff;\n border-radius: 8px;\n padding: 16px;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);\n\n h3 {\n margin: 0 0 12px 0;\n font-size: 14px;\n font-weight: 600;\n color: #333;\n border-bottom: 1px solid #e8e8e8;\n padding-bottom: 8px;\n }\n\n .empty-state {\n color: #999;\n font-size: 12px;\n text-align: center;\n padding: 20px;\n }\n\n .widget-list {\n display: flex;\n flex-direction: column;\n gap: 2px;\n\n .widget-item {\n border: 1px solid #e8e8e8;\n border-radius: 4px;\n padding: 2px 4px;\n line-height: 1.2;\n background-color: #fafafa;\n cursor: pointer;\n\n .widget-key {\n font-weight: 600;\n color: var(--ant-primary-color);\n font-size: 12px;\n }\n }\n }\n }\n\n pre {\n margin: 0;\n font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;\n font-size: 12px;\n white-space: pre-wrap;\n word-wrap: break-word;\n background-color: #f5f5f5;\n padding: 8px;\n border-radius: 4px;\n color: #333;\n }\n }\n }\n</style>\n"],"names":["_useModel","_createElementBlock","_normalizeClass","_createElementVNode","_createVNode","_unref","_toDisplayString","_openBlock","_Fragment","_renderList"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;~~AAoCI,UAAM,eAAeA,SAAW,SAAC,SAGhC;AAED,UAAM,gBAAgB,OAAO,YAAY,EAAE;AAC3C,UAAM,gBAAgB,OAAO,WAAW,IAAI,oBAAI,IAAA,CAAK,CAAC;~~AACtD~~,~~UAAM~~,~~aAAa,OAAO,~~cAAc,IAAI,~~CAAA~~,~~CAAE,~~CAAC;;0BA1C/CC,mBA6BM,OAAA;AAAA,QA7BD,OAAKC,eAAA,CAAC,eAAa,EAAA,WAAA,CAAuB,aAAA,OAAY,CAAA;AAAA,MAAA;QACvDC,mBAEM,OAAA;AAAA,UAFD,OAAM;AAAA,UAAgB,SAAK,OAAA,CAAA,MAAA,OAAA,CAAA,IAAA,CAAA,WAAE,aAAA,QAAY,CAAI,aAAA;AAAA,QAAA,mBAC3C,aAAA,QAAY,OAAA,IAAA,GAAA,CAAA;AAAA,QAEnBA,mBAwBM,OAxBN,YAwBM;AAAA,UAvBFA,mBAGM,OAHN,YAGM;AAAA,YAFF,OAAA,CAAA,MAAA,OAAA,CAAA,IAAAA,mBAAwB,YAApB,mBAAe,EAAA;AAAA,YACnBC,YAAuDC,MAAA,UAAA,GAAA;AAAA,cAA1C,OAAOA,MAAA,aAAA;AAAA,cAAgB,gBAAc;AAAA,YAAA;;UAEtDF,mBAYM,OAZN,YAYM;AAAA,YAXFA,mBAA2D,YAAvD,sBAAiBG,gBAAGD,qBAAc,IAAI,IAAG,aAAS,CAAA;AAAA,YACtDF,mBASM,OATN,YASM;AAAA,eARFI,UAAA,IAAA,GAAAN,mBAOMO,UAAA,MAAAC,WANqBJ,MAAA,aAAA,GAAa,CAAA,CAA5B,KAAK,KAAK,MAAA;oCADtBJ,mBAOM,OAAA;AAAA,kBALD,SAAK,CAAA,WAAE,QAAQ,IAAI,KAAK;AAAA,kBACxB;AAAA,kBACD,OAAM;AAAA,gBAAA;kBAENE,mBAAuC,OAAvC,YAAuCG,gBAAZ,GAAG,GAAA,CAAA;AAAA,gBAAA;;;;UAI1CH,mBAKM,OALN,YAKM;AAAA,YAJF,OAAA,CAAA,MAAA,OAAA,CAAA,IAAAA,mBAAmB,YAAf,cAAU,EAAA;AAAA,YACdA,mBAEM,OAFN,YAEM;AAAA,cADFC,YAAoDC,MAAA,UAAA,GAAA;AAAA,gBAAvC,OAAOA,MAAA,UAAA;AAAA,gBAAa,gBAAc;AAAA,cAAA;;;;;;;;"}
1	+ {"version":3,"file":"Debugger.vue2.js","sources":["../../../../../../../core/src/components/common/render/Debugger.vue"],"sourcesContent":["<template>\n <div class=\"debug-panel\" :class=\"{ collapsed: !debugVisible }\">\n <div class=\"debug-toggle\" @click=\"debugVisible = !debugVisible\">\n {{ debugVisible ? '收起' : '调试' }}\n </div>\n <div class=\"debug-content\">\n <div class=\"debug-section\">\n <h3>Form Data Model</h3>\n <JsonViewer :value=\"formDataModel\" :expand-depth=\"5\" />\n </div>\n <div class=\"debug-section\">\n <h3>Widget Ref List ({{ widgetRefList.size }} widgets)</h3>\n <div class=\"widget-list\">\n <div\n v-for=\"[key, value] in widgetRefList\"\n @click=\"console.log(value)\"\n :key=\"key\"\n class=\"widget-item\"\n >\n <div class=\"widget-key\">{{ key }}</div>\n </div>\n </div>\n </div>\n <!-- <div class=\"debug-section\">\n <h3>FormConfig</h3>\n <div class=\"widget-list\">\n <JsonViewer :value=\"formConfig \|\| {}\" :expand-depth=\"5\" />\n </div>\n </div> -->\n </div>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\n import { ref, inject, computed } from 'vue';\n import JsonViewer from 'vue-json-viewer';\n const debugVisible = defineModel('visible', {\n type: Boolean,\n default: false\n });\n\n const formDataModel = inject('formData', {});\n const widgetRefList = inject('refList', ref(new Map()));\n const formConfig = inject('formConfig', ref({}));\n</script>\n\n<style lang=\"less\" scoped>\n /* 调试面板样式 */\n .debug-panel {\n position: absolute;\n top: 0;\n right: 0;\n width: 400px;\n height: 100vh;\n background-color: #fff;\n box-shadow: -2px 0 8px rgba(0, 0, 0, 0.15);\n z-index: 9999;\n transition: transform 0.3s ease-in-out;\n display: flex;\n flex-direction: column;\n border-top-left-radius: 8px;\n border-bottom-left-radius: 8px;\n :deep(.jv-container .jv-code) {\n padding: 0;\n }\n\n &.collapsed {\n transform: translateX(400px);\n\n .debug-toggle {\n left: -40px;\n border-radius: 8px 0 0 8px;\n width: 40px;\n }\n }\n\n .debug-toggle {\n position: absolute;\n left: -40px;\n top: 20px;\n width: 40px;\n height: 40px;\n background-color: var(--ant-primary-color);\n color: #fff;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border-radius: 8px 0 0 8px;\n font-size: 12px;\n box-shadow: -2px 0 8px rgba(0, 0, 0, 0.15);\n writing-mode: vertical-lr;\n padding: 8px 0;\n user-select: none;\n }\n\n .debug-content {\n flex: 1;\n overflow: auto;\n padding: 16px;\n background-color: #f5f7fa;\n\n .debug-section {\n margin-bottom: 24px;\n background-color: #fff;\n border-radius: 8px;\n padding: 16px;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);\n\n h3 {\n margin: 0 0 12px 0;\n font-size: 14px;\n font-weight: 600;\n color: #333;\n border-bottom: 1px solid #e8e8e8;\n padding-bottom: 8px;\n }\n\n .empty-state {\n color: #999;\n font-size: 12px;\n text-align: center;\n padding: 20px;\n }\n\n .widget-list {\n display: flex;\n flex-direction: column;\n gap: 2px;\n\n .widget-item {\n border: 1px solid #e8e8e8;\n border-radius: 4px;\n padding: 2px 4px;\n line-height: 1.2;\n background-color: #fafafa;\n cursor: pointer;\n\n .widget-key {\n font-weight: 600;\n color: var(--ant-primary-color);\n font-size: 12px;\n }\n }\n }\n }\n\n pre {\n margin: 0;\n font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;\n font-size: 12px;\n white-space: pre-wrap;\n word-wrap: break-word;\n background-color: #f5f5f5;\n padding: 8px;\n border-radius: 4px;\n color: #333;\n }\n }\n }\n</style>\n"],"names":["_useModel","_createElementBlock","_normalizeClass","_createElementVNode","_createVNode","_unref","_toDisplayString","_openBlock","_Fragment","_renderList"],"mappings":";;;;;;;;;;;;;;;;;;;AAoCI,UAAM,eAAeA,SAAW,SAAC,SAGhC;AAED,UAAM,gBAAgB,OAAO,YAAY,EAAE;AAC3C,UAAM,gBAAgB,OAAO,WAAW,IAAI,oBAAI,IAAA,CAAK,CAAC;AACnC,WAAO,cAAc,IAAI,EAAE,CAAC;;0BA1C/CC,mBA6BM,OAAA;AAAA,QA7BD,OAAKC,eAAA,CAAC,eAAa,EAAA,WAAA,CAAuB,aAAA,OAAY,CAAA;AAAA,MAAA;QACvDC,mBAEM,OAAA;AAAA,UAFD,OAAM;AAAA,UAAgB,SAAK,OAAA,CAAA,MAAA,OAAA,CAAA,IAAA,CAAA,WAAE,aAAA,QAAY,CAAI,aAAA;AAAA,QAAA,mBAC3C,aAAA,QAAY,OAAA,IAAA,GAAA,CAAA;AAAA,QAEnBA,mBAwBM,OAxBN,YAwBM;AAAA,UAvBFA,mBAGM,OAHN,YAGM;AAAA,YAFF,OAAA,CAAA,MAAA,OAAA,CAAA,IAAAA,mBAAwB,YAApB,mBAAe,EAAA;AAAA,YACnBC,YAAuDC,MAAA,UAAA,GAAA;AAAA,cAA1C,OAAOA,MAAA,aAAA;AAAA,cAAgB,gBAAc;AAAA,YAAA;;UAEtDF,mBAYM,OAZN,YAYM;AAAA,YAXFA,mBAA2D,YAAvD,sBAAiBG,gBAAGD,qBAAc,IAAI,IAAG,aAAS,CAAA;AAAA,YACtDF,mBASM,OATN,YASM;AAAA,eARFI,UAAA,IAAA,GAAAN,mBAOMO,UAAA,MAAAC,WANqBJ,MAAA,aAAA,GAAa,CAAA,CAA5B,KAAK,KAAK,MAAA;oCADtBJ,mBAOM,OAAA;AAAA,kBALD,SAAK,CAAA,WAAE,QAAQ,IAAI,KAAK;AAAA,kBACxB;AAAA,kBACD,OAAM;AAAA,gBAAA;kBAENE,mBAAuC,OAAvC,YAAuCG,gBAAZ,GAAG,GAAA,CAAA;AAAA,gBAAA;;;;;;;;;"}

package/core/src/hooks/useAppRef.js CHANGED Viewed

@@ -26,6 +26,7 @@ function useAppRef(widgetRefList, formWidgetId) {
   };
   const registerToRefList = (widgetName) => {
     const list = isRoot ? widgetRefList == null ? void 0 : widgetRefList.value : refList.value;
+    console.log(widgetId.value);
     list.set(widgetName || widgetId.value, {
       instance,
       proxy: instance == null ? void 0 : instance.proxy,

package/core/src/hooks/useAppRef.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useAppRef.js","sources":["../../../../../core/src/hooks/useAppRef.ts"],"sourcesContent":["import { useI18n } from '@kp-ui/lowcode-core';\nimport { message } from 'ant-design-vue';\nimport { computed, getCurrentInstance, inject, ref, Ref } from 'vue';\n\nexport function useAppRef(widgetRefList?: Ref<Map<string, any>>, formWidgetId?: any) {\n const { i18nt } = useI18n();\n const isRoot = formWidgetId !== undefined;\n\n if (!isRoot) {\n formWidgetId = inject('formWidgetId', '');\n }\n\n const refList = inject<Ref<Map<string, any>>>('refList', widgetRefList \|\| ref(new Map()));\n\n const instance = getCurrentInstance();\n\n const widgetId = computed(() => instance?.exposed?.field?.options?.name as string);\n\n const initRefList = () => {\n registerToRefList();\n };\n\n const getWidgetRef = (widgetName, showError?: boolean) => {\n const list = isRoot ? (widgetRefList?.value as Map<any, any>) : refList.value;\n const foundRef = list.get(widgetName);\n if (!foundRef && !!showError) {\n message.error(i18nt('render.hint.refNotFound') + widgetName);\n }\n return foundRef;\n };\n\n /* 该方法用于组件重名检查！！ /\n const registerToRefList = (widgetName?: symbol \| string) => {\n const list = isRoot ? (widgetRefList?.value as Map<any, any>) : refList.value;\n list.set(widgetName \|\| widgetId.value, {\n instance,\n proxy: instance?.proxy,\n ...instance?.appContext.config.globalProperties,\n ...instance?.exposed\n });\n };\n\n /\n 从引用列表中注销\n */\n const unregisterFromRefList = () => {\n const widgetId = instance?.exposed?.field?.options?.name;\n refList?.value?.delete(widgetId);\n };\n\n const getFormRef = () => {\n return getWidgetRef(formWidgetId);\n };\n\n return {\n refList,\n getFormRef,\n registerToRefList,\n unregisterFromRefList,\n initRefList,\n getWidgetRef\n };\n}\n"],"names":["widgetId"],"mappings":";;;AAIO,SAAS,UAAU,eAAuC,cAAoB;AACjF,QAAM,EAAE,MAAA,IAAU,QAAA;AAClB,QAAM,SAAS,iBAAiB;AAEhC,MAAI,CAAC,QAAQ;AACT,mBAAe,OAAO,gBAAgB,EAAE;AAAA,EAC5C;AAEA,QAAM,UAAU,OAA8B,WAAW,iBAAiB,IAAI,oBAAI,IAAA,CAAK,CAAC;AAExF,QAAM,WAAW,mBAAA;AAEjB,QAAM,WAAW,SAAS,MAAA;;AAAM,kEAAU,YAAV,mBAAmB,UAAnB,mBAA0B,YAA1B,mBAAmC;AAAA,GAAc;AAEjF,QAAM,cAAc,MAAM;AACtB,sBAAA;AAAA,EACJ;AAEA,QAAM,eAAe,CAAC,YAAY,cAAwB;AACtD,UAAM,OAAO,SAAU,+CAAe,QAA0B,QAAQ;AACxE,UAAM,WAAW,KAAK,IAAI,UAAU;AACpC,QAAI,CAAC,YAAY,CAAC,CAAC,WAAW;AAC1B,cAAQ,MAAM,MAAM,yBAAyB,IAAI,UAAU;AAAA,IAC/D;AACA,WAAO;AAAA,EACX;AAGA,QAAM,oBAAoB,CAAC,eAAiC;AACxD,UAAM,OAAO,SAAU,+CAAe,QAA0B,QAAQ;AACxE,SAAK,IAAI,cAAc,SAAS,OAAO;AAAA,MACnC;AAAA,MACA,OAAO,qCAAU;AAAA,MACjB,GAAG,qCAAU,WAAW,OAAO;AAAA,MAC/B,GAAG,qCAAU;AAAA,IAAA,CAChB;AAAA,EACL;AAKA,QAAM,wBAAwB,MAAM;;AAChC,UAAMA,aAAW,sDAAU,YAAV,mBAAmB,UAAnB,mBAA0B,YAA1B,mBAAmC;AACpD,6CAAS,UAAT,mBAAgB,OAAOA;AAAAA,EAC3B;AAEA,QAAM,aAAa,MAAM;AACrB,WAAO,aAAa,YAAY;AAAA,EACpC;AAEA,SAAO;AAAA,IACH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAER;"}
1	+ {"version":3,"file":"useAppRef.js","sources":["../../../../../core/src/hooks/useAppRef.ts"],"sourcesContent":["import { useI18n } from '@kp-ui/lowcode-core';\nimport { message } from 'ant-design-vue';\nimport { computed, getCurrentInstance, inject, ref, Ref } from 'vue';\n\nexport function useAppRef(widgetRefList?: Ref<Map<string, any>>, formWidgetId?: any) {\n const { i18nt } = useI18n();\n const isRoot = formWidgetId !== undefined;\n\n if (!isRoot) {\n formWidgetId = inject('formWidgetId', '');\n }\n\n const refList = inject<Ref<Map<string, any>>>('refList', widgetRefList \|\| ref(new Map()));\n\n const instance = getCurrentInstance();\n\n const widgetId = computed(() => instance?.exposed?.field?.options?.name as string);\n\n const initRefList = () => {\n registerToRefList();\n };\n\n const getWidgetRef = (widgetName, showError?: boolean) => {\n const list = isRoot ? (widgetRefList?.value as Map<any, any>) : refList.value;\n const foundRef = list.get(widgetName);\n if (!foundRef && !!showError) {\n message.error(i18nt('render.hint.refNotFound') + widgetName);\n }\n return foundRef;\n };\n\n /* 该方法用于组件重名检查！！ /\n const registerToRefList = (widgetName?: symbol \| string) => {\n const list = isRoot ? (widgetRefList?.value as Map<any, any>) : refList.value;\n console.log(widgetId.value);\n\n list.set(widgetName \|\| widgetId.value, {\n instance,\n proxy: instance?.proxy,\n ...instance?.appContext.config.globalProperties,\n ...instance?.exposed\n });\n };\n\n /\n 从引用列表中注销\n */\n const unregisterFromRefList = () => {\n const widgetId = instance?.exposed?.field?.options?.name;\n refList?.value?.delete(widgetId);\n };\n\n const getFormRef = () => {\n return getWidgetRef(formWidgetId);\n };\n\n return {\n refList,\n getFormRef,\n registerToRefList,\n unregisterFromRefList,\n initRefList,\n getWidgetRef\n };\n}\n"],"names":["widgetId"],"mappings":";;;AAIO,SAAS,UAAU,eAAuC,cAAoB;AACjF,QAAM,EAAE,MAAA,IAAU,QAAA;AAClB,QAAM,SAAS,iBAAiB;AAEhC,MAAI,CAAC,QAAQ;AACT,mBAAe,OAAO,gBAAgB,EAAE;AAAA,EAC5C;AAEA,QAAM,UAAU,OAA8B,WAAW,iBAAiB,IAAI,oBAAI,IAAA,CAAK,CAAC;AAExF,QAAM,WAAW,mBAAA;AAEjB,QAAM,WAAW,SAAS,MAAA;;AAAM,kEAAU,YAAV,mBAAmB,UAAnB,mBAA0B,YAA1B,mBAAmC;AAAA,GAAc;AAEjF,QAAM,cAAc,MAAM;AACtB,sBAAA;AAAA,EACJ;AAEA,QAAM,eAAe,CAAC,YAAY,cAAwB;AACtD,UAAM,OAAO,SAAU,+CAAe,QAA0B,QAAQ;AACxE,UAAM,WAAW,KAAK,IAAI,UAAU;AACpC,QAAI,CAAC,YAAY,CAAC,CAAC,WAAW;AAC1B,cAAQ,MAAM,MAAM,yBAAyB,IAAI,UAAU;AAAA,IAC/D;AACA,WAAO;AAAA,EACX;AAGA,QAAM,oBAAoB,CAAC,eAAiC;AACxD,UAAM,OAAO,SAAU,+CAAe,QAA0B,QAAQ;AACxE,YAAQ,IAAI,SAAS,KAAK;AAE1B,SAAK,IAAI,cAAc,SAAS,OAAO;AAAA,MACnC;AAAA,MACA,OAAO,qCAAU;AAAA,MACjB,GAAG,qCAAU,WAAW,OAAO;AAAA,MAC/B,GAAG,qCAAU;AAAA,IAAA,CAChB;AAAA,EACL;AAKA,QAAM,wBAAwB,MAAM;;AAChC,UAAMA,aAAW,sDAAU,YAAV,mBAAmB,UAAnB,mBAA0B,YAA1B,mBAAmC;AACpD,6CAAS,UAAT,mBAAgB,OAAOA;AAAAA,EAC3B;AAEA,QAAM,aAAa,MAAM;AACrB,WAAO,aAAa,YAAY;AAAA,EACpC;AAEA,SAAO;AAAA,IACH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAER;"}

package/core/src/hooks/useDesigner.js CHANGED Viewed

@@ -7,6 +7,8 @@ function useDesigner() {
   });
   const formConfig = inject("formConfig", ref({}));
   const formData = inject("formData", ref({}));
+  const isSubFormField = inject("isSubFormField", false);
+  const subFormRowIndex = inject("subFormRowIndex", ref(0));
   const layoutType = inject("layoutType", ref(LayoutTypeEnum.PC));
   const isPc = computed(
     () => layoutType.value === LayoutTypeEnum.PC || layoutType.value === LayoutTypeEnum.H5
@@ -37,7 +39,9 @@ function useDesigner() {
     designer.value.setSelected(widget);
   };
   return {
+    isSubFormField,
     selectedWidget,
+    subFormRowIndex,
     getWidget,
     selected,
     isPc,

package/core/src/hooks/useDesigner.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useDesigner.js","sources":["../../../../../core/src/hooks/useDesigner.ts"],"sourcesContent":["import { FormConfig, Widget } from '@kp-ui/lowcode-core/src/types/schema';\nimport { FormDesigner } from '@kp-ui/lowcode-core/src/types/designer';\nimport { LayoutTypeEnum } from '@kp-ui/lowcode-core';\nimport { computed, inject, nextTick, ref, Ref, watchEffect } from 'vue';\n\nexport function useDesigner() {\n const designer = inject<Ref<FormDesigner>>('designer', ref({} as FormDesigner));\n const designState = inject('designState', false);\n const getWidget = inject('getWidget', (widget: Widget) => {});\n const formConfig = inject<Ref<FormConfig>>('formConfig', ref({} as FormConfig));\n const formData = inject('formData', ref({}));\n\n const layoutType = inject('layoutType', ref(LayoutTypeEnum.PC));\n const isPc = computed(\n () => layoutType.value === LayoutTypeEnum.PC \|\| layoutType.value === LayoutTypeEnum.H5\n );\n const isH5 = computed(() => layoutType.value === LayoutTypeEnum.H5);\n\n const isBI = computed(() => layoutType.value === LayoutTypeEnum.BI);\n\n const onDragAdd = ({ newIndex }, widgetList: Widget[]) => {\n const newWidget = widgetList[newIndex];\n if (newWidget) {\n designer.value.setSelected(newWidget);\n } else {\n designer.value.setSelected(widgetList[newIndex - 1]);\n }\n };\n\n const onDragUpdate = () => {\n designer.value.emitHistoryChange();\n };\n\n /*\n 选择子组件\n * @param widget 组件配置\n */\n const selectWidget = widget => {\n if (designState) {\n designer.value.setSelected(widget);\n }\n };\n\n const selectedWidget = computed(() => designer.value.selectedWidget);\n\n const selected = (widgetId: string) => {\n return designer.value.selectedId === widgetId;\n };\n\n const onWidgetClick = (widget: Widget) => {\n designer.value.setSelected(widget);\n };\n\n return {\n selectedWidget,\n getWidget,\n selected,\n isPc,\n isH5,\n isBI,\n designState,\n formData,\n formConfig,\n designer,\n layoutType,\n onWidgetClick,\n selectWidget,\n onDragAdd,\n onDragUpdate\n };\n}\n"],"names":[],"mappings":";;AAKO,SAAS,cAAc;AAC1B,QAAM,WAAW,OAA0B,YAAY,IAAI,CAAA,CAAkB,CAAC;AAC9E,QAAM,cAAc,OAAO,eAAe,KAAK;AAC/C,QAAM,YAAY,OAAO,aAAa,CAAC,WAAmB;AAAA,EAAC,CAAC;AAC5D,QAAM,aAAa,OAAwB,cAAc,IAAI,CAAA,CAAgB,CAAC;AAC9E,QAAM,WAAW,OAAO,YAAY,IAAI,CAAA,CAAE,CAAC;~~AAE3C~~,QAAM,aAAa,OAAO,cAAc,IAAI,eAAe,EAAE,CAAC;AAC9D,QAAM,OAAO;AAAA,IACT,MAAM,WAAW,UAAU,eAAe,MAAM,WAAW,UAAU,eAAe;AAAA,EAAA;AAExF,QAAM,OAAO,SAAS,MAAM,WAAW,UAAU,eAAe,EAAE;AAElE,QAAM,OAAO,SAAS,MAAM,WAAW,UAAU,eAAe,EAAE;AAElE,QAAM,YAAY,CAAC,EAAE,SAAA,GAAY,eAAyB;AACtD,UAAM,YAAY,WAAW,QAAQ;AACrC,QAAI,WAAW;AACX,eAAS,MAAM,YAAY,SAAS;AAAA,IACxC,OAAO;AACH,eAAS,MAAM,YAAY,WAAW,WAAW,CAAC,CAAC;AAAA,IACvD;AAAA,EACJ;AAEA,QAAM,eAAe,MAAM;AACvB,aAAS,MAAM,kBAAA;AAAA,EACnB;AAMA,QAAM,eAAe,CAAA,WAAU;AAC3B,QAAI,aAAa;AACb,eAAS,MAAM,YAAY,MAAM;AAAA,IACrC;AAAA,EACJ;AAEA,QAAM,iBAAiB,SAAS,MAAM,SAAS,MAAM,cAAc;AAEnE,QAAM,WAAW,CAAC,aAAqB;AACnC,WAAO,SAAS,MAAM,eAAe;AAAA,EACzC;AAEA,QAAM,gBAAgB,CAAC,WAAmB;AACtC,aAAS,MAAM,YAAY,MAAM;AAAA,EACrC;AAEA,SAAO;AAAA,IACH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAER;"}
1	+ {"version":3,"file":"useDesigner.js","sources":["../../../../../core/src/hooks/useDesigner.ts"],"sourcesContent":["import { FormConfig, Widget } from '@kp-ui/lowcode-core/src/types/schema';\nimport { FormDesigner } from '@kp-ui/lowcode-core/src/types/designer';\nimport { LayoutTypeEnum } from '@kp-ui/lowcode-core';\nimport { computed, inject, nextTick, ref, Ref, watchEffect } from 'vue';\n\nexport function useDesigner() {\n const designer = inject<Ref<FormDesigner>>('designer', ref({} as FormDesigner));\n const designState = inject('designState', false);\n const getWidget = inject('getWidget', (widget: Widget) => {});\n const formConfig = inject<Ref<FormConfig>>('formConfig', ref({} as FormConfig));\n const formData = inject('formData', ref({}));\n const isSubFormField = inject('isSubFormField', false);\n const subFormRowIndex = inject<Ref<number>>('subFormRowIndex', ref(0));\n const layoutType = inject('layoutType', ref(LayoutTypeEnum.PC));\n const isPc = computed(\n () => layoutType.value === LayoutTypeEnum.PC \|\| layoutType.value === LayoutTypeEnum.H5\n );\n const isH5 = computed(() => layoutType.value === LayoutTypeEnum.H5);\n\n const isBI = computed(() => layoutType.value === LayoutTypeEnum.BI);\n\n const onDragAdd = ({ newIndex }, widgetList: Widget[]) => {\n const newWidget = widgetList[newIndex];\n if (newWidget) {\n designer.value.setSelected(newWidget);\n } else {\n designer.value.setSelected(widgetList[newIndex - 1]);\n }\n };\n\n const onDragUpdate = () => {\n designer.value.emitHistoryChange();\n };\n\n /*\n 选择子组件\n * @param widget 组件配置\n */\n const selectWidget = widget => {\n if (designState) {\n designer.value.setSelected(widget);\n }\n };\n\n const selectedWidget = computed(() => designer.value.selectedWidget);\n\n const selected = (widgetId: string) => {\n return designer.value.selectedId === widgetId;\n };\n\n const onWidgetClick = (widget: Widget) => {\n designer.value.setSelected(widget);\n };\n\n return {\n isSubFormField,\n selectedWidget,\n subFormRowIndex,\n getWidget,\n selected,\n isPc,\n isH5,\n isBI,\n designState,\n formData,\n formConfig,\n designer,\n layoutType,\n onWidgetClick,\n selectWidget,\n onDragAdd,\n onDragUpdate\n };\n}\n"],"names":[],"mappings":";;AAKO,SAAS,cAAc;AAC1B,QAAM,WAAW,OAA0B,YAAY,IAAI,CAAA,CAAkB,CAAC;AAC9E,QAAM,cAAc,OAAO,eAAe,KAAK;AAC/C,QAAM,YAAY,OAAO,aAAa,CAAC,WAAmB;AAAA,EAAC,CAAC;AAC5D,QAAM,aAAa,OAAwB,cAAc,IAAI,CAAA,CAAgB,CAAC;AAC9E,QAAM,WAAW,OAAO,YAAY,IAAI,CAAA,CAAE,CAAC;AAC3C,QAAM,iBAAiB,OAAO,kBAAkB,KAAK;AACrD,QAAM,kBAAkB,OAAoB,mBAAmB,IAAI,CAAC,CAAC;AACrE,QAAM,aAAa,OAAO,cAAc,IAAI,eAAe,EAAE,CAAC;AAC9D,QAAM,OAAO;AAAA,IACT,MAAM,WAAW,UAAU,eAAe,MAAM,WAAW,UAAU,eAAe;AAAA,EAAA;AAExF,QAAM,OAAO,SAAS,MAAM,WAAW,UAAU,eAAe,EAAE;AAElE,QAAM,OAAO,SAAS,MAAM,WAAW,UAAU,eAAe,EAAE;AAElE,QAAM,YAAY,CAAC,EAAE,SAAA,GAAY,eAAyB;AACtD,UAAM,YAAY,WAAW,QAAQ;AACrC,QAAI,WAAW;AACX,eAAS,MAAM,YAAY,SAAS;AAAA,IACxC,OAAO;AACH,eAAS,MAAM,YAAY,WAAW,WAAW,CAAC,CAAC;AAAA,IACvD;AAAA,EACJ;AAEA,QAAM,eAAe,MAAM;AACvB,aAAS,MAAM,kBAAA;AAAA,EACnB;AAMA,QAAM,eAAe,CAAA,WAAU;AAC3B,QAAI,aAAa;AACb,eAAS,MAAM,YAAY,MAAM;AAAA,IACrC;AAAA,EACJ;AAEA,QAAM,iBAAiB,SAAS,MAAM,SAAS,MAAM,cAAc;AAEnE,QAAM,WAAW,CAAC,aAAqB;AACnC,WAAO,SAAS,MAAM,eAAe;AAAA,EACzC;AAEA,QAAM,gBAAgB,CAAC,WAAmB;AACtC,aAAS,MAAM,YAAY,MAAM;AAAA,EACrC;AAEA,SAAO;AAAA,IACH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAER;"}

package/core/src/hooks/useField.js CHANGED Viewed

@@ -11,6 +11,7 @@ function useField(props, isInitModelValue = true) {
   const formModel = inject("formData", ref({}));
   const getReadMode = inject("getReadMode", () => false);
   const isSubFormField = inject("isSubFormField", false);
+  const subFormRowIndex = inject("subFormRowIndex", ref(0));
   const getSubFormName = inject("getSubFormName", () => "");
   const designState = inject("designState", false);
   const { registerToRefList, getWidgetRef, getFormRef, unregisterFromRefList } = useAppRef();
@@ -107,7 +108,7 @@ function useField(props, isInitModelValue = true) {
   };
   const getPropName = computed(() => {
     if (isSubFormField && !designState) {
-      return subFormName.value + "." + props.subFormRowIndex + "." + props.field.options.name;
+      return subFormName.value + "." + subFormRowIndex.value + "." + props.field.options.name;
     } else {
       return props.field.options.name;
     }
@@ -239,7 +240,7 @@ function useField(props, isInitModelValue = true) {
       newValue,
       oldValue,
       subFormName.value,
-      props.subFormRowIndex
+      subFormRowIndex.value
     ]);
   };
   const syncUpdateFormModel = (value) => {
@@ -319,7 +320,7 @@ function useField(props, isInitModelValue = true) {
           value: val,
           oldValue: oldVal,
           subFormData: subFormData.value,
-          rowId: props.subFormRowId
+          rowId: subFormRowIndex.value
         },
         keys: ["value", "oldValue", "subFormData", "rowId"]
       });
@@ -488,6 +489,7 @@ function useField(props, isInitModelValue = true) {
     } else {
       value = typeof props.field.options.defaultValue === "undefined" ? "" : props.field.options.defaultValue;
     }
+    console.log(getPropName.value);
     dispatch("VFormRender", "fieldChange", {
       fieldName: getPropName.value,
       value: toRaw(value),
@@ -508,7 +510,7 @@ function useField(props, isInitModelValue = true) {
     unregisterFromRefList();
   });
   const defineExposed = {
-    subFormRowIndex: computed(() => props.subFormRowIndex),
+    subFormRowIndex,
     i18nt,
     options,
     proxy: instance == null ? void 0 : instance.proxy,
@@ -589,6 +591,7 @@ function useField(props, isInitModelValue = true) {
     setAppendButtonDisabled,
     focus,
     setUploadData,
+    subFormRowIndex,
     isSubFormField,
     defineExposed
   };