diff --git a/components-diy/diy-form.vue b/components-diy/diy-form.vue
index d2dd806..10a6974 100644
--- a/components-diy/diy-form.vue
+++ b/components-diy/diy-form.vue
@@ -14,8 +14,9 @@
:formConfig="mergedFormConfig"
ref="nsNewform"
>
-
-
+
+
{{ submitText }}
@@ -32,6 +33,20 @@ export default {
props: {
value: {
type: Object
+ },
+ // 数据源模式:
+ // 'diy'(默认):value.formComponents 是 [{ type, value }],组件内部转换为 ns-newform 期望的 [{ controller, value, val }]
+ // 'raw' :value.jsonData / value.json_data 已经是 ns-newform 期望的格式,直接透传给 ns-newform
+ // 用途:让 formdata 等"已是 ns-newform 格式"的页面也能复用本组件的 banner/tip/样式系统
+ dataMode: {
+ type: String,
+ default: 'diy',
+ validator: (v) => ['diy', 'raw'].includes(v)
+ },
+ // 是否渲染内置提交按钮。false 时由父级调用 ref 上的 verify()/getFormData() 自行实现提交
+ showSubmit: {
+ type: Boolean,
+ default: true
}
},
mixins: [DiyMinx],
@@ -47,6 +62,8 @@ export default {
'value': {
deep: true,
handler() {
+ // raw 模式:formData 由父级透传,跳过重跑 initForm(避免每次父组件 re-render 触发 ns-newform 的深拷贝 initFormData)
+ if (this.dataMode === 'raw') return;
this.initForm();
}
}
@@ -192,6 +209,11 @@ export default {
this.formComponents = [];
return;
}
+ // raw 模式:value.jsonData / value.json_data 已经是 ns-newform 期望的 [{ controller, value, val }],直接透传
+ if (this.dataMode === 'raw') {
+ this.formComponents = this.value.jsonData || this.value.json_data || [];
+ return;
+ }
var components = this.value.formComponents || this.value.form_components || [];
// 转换格式:type -> controller
this.formComponents = (components || []).map(function(item) {
@@ -203,6 +225,20 @@ export default {
});
},
+ // 暴露给父级:触发 ns-newform 校验。校验失败时 ns-newform 内部会 toast;返回 false 表示失败,返回 formData 数组表示成功
+ verify() {
+ if (this.$refs.nsNewform && this.$refs.nsNewform.verify) {
+ return this.$refs.nsNewform.verify();
+ }
+ return false;
+ },
+ // 暴露给父级:获取 ns-newform 当前的 formData 数组(含 val / option_lists / img_lists 等全部字段)
+ // 后端 /form/api/form/create 的 form_data 字段约定是 JSON.stringify 整个数组(与 form.vue 保持一致),
+ // 父级若需要 { index: val } 形式可自行 map
+ getFormData() {
+ return (this.$refs.nsNewform && this.$refs.nsNewform.formData) || [];
+ },
+
// 数字保底:undefined/空串/非数字时返回兜底值
_num(v, fb) {
if (v === '' || v === null || v === undefined) return fb;
@@ -220,21 +256,16 @@ export default {
// 提交表单
submitForm() {
var self = this;
- // 使用 ns-newform 的验证
- if (this.$refs.nsNewform && this.$refs.nsNewform.verify) {
- var verifyResult = this.$refs.nsNewform.verify();
- if (!verifyResult) {
- return;
- }
+ // 校验(同时返回 formData 数组;校验失败时 ns-newform 内部 toast 提示)
+ if (!this.verify()) {
+ return;
}
- // 获取表单数据
+ // 转为 { index: val } 提交格式(后端 /form/api/form/create 期望的紧凑结构)
var submitData = {};
- if (this.$refs.nsNewform && this.$refs.nsNewform.formData) {
- this.$refs.nsNewform.formData.forEach(function(item, index) {
- submitData[index] = item.val;
- });
- }
+ this.getFormData().forEach(function(item, index) {
+ submitData[index] = item.val;
+ });
// 提交到后端
this.$api.sendRequest({
diff --git a/pages_tool/form/form.vue b/pages_tool/form/form.vue
index 7edcab5..c352bd4 100644
--- a/pages_tool/form/form.vue
+++ b/pages_tool/form/form.vue
@@ -6,7 +6,7 @@
请填写表单所需信息
-
+
diff --git a/pages_tool/form/formdata.vue b/pages_tool/form/formdata.vue
index 7e190c7..8431cfb 100644
--- a/pages_tool/form/formdata.vue
+++ b/pages_tool/form/formdata.vue
@@ -9,7 +9,13 @@
{{ formTip }}
-
+
+
@@ -25,11 +31,11 @@