【表单发布后】表单发布后的详情不可编辑

src/views/demo/onlineform/formCall/CallModal.vue

@@ -125,6 +125,7 @@
   import CallModalFormItem from './CallModalFormItem/index.vue';
   import { CardGourp } from '@/components/FormViewer/index.ts'
   import { subTableStore } from '@/store/modules/subTable';
+  import { changeCardStructure, cardNestStructure } from '@/views/demo/onlineform/util.ts';
 
   const subTableDataStore = subTableStore();
 
@@ -407,6 +408,13 @@
     }
     if (!unref(isUpdate) && unref(isDetail)) {
       getTitle.value = '详情';
+      data.tab = changeCardStructure(data.tab)
+      data.tab.forEach(itemComponent => {
+        if(itemComponent.component){
+          itemComponent.componentProps.disabled = true
+        }
+      })
+      data.tab = cardNestStructure(data.tab)
       if (Object.keys(cardValues.value).length > 0) {
         Object.keys(cardValues.value).forEach((cardItem) => {
           let cardItemKeyList = Object.keys(cardValues.value[cardItem]);

src/views/demo/onlineform/util.ts

@@ -38,4 +38,64 @@ export const cardNestStructure = (data) => {
     }
   })
   return result
-}
+}
+export const changeCardStructure = (data) => {
+  let result = [];
+  if (data && data.length > 0) {
+    data.forEach((item) => {
+      if (item.component === 'Tabs') {
+        item.componentProps.options = changeCardStructure(item.componentProps.options);
+      } else if (item.component === 'CardGroup') {
+        item.componentProps.options = changeCardStructure(item.componentProps.options);
+        item.componentProps.options.forEach((childItem) => {
+          if (childItem.pfield) {
+            result.push(childItem);
+          } else {
+            result.push({ ...childItem, ptype: 'card', pfield: item.field });
+          }
+        });
+        item.componentProps.options = [];
+      } else if (item.component === 'Grid' && item.label === '栅格布局') {
+        item.columns = changeCardStructure(item.columns);
+        item.columns.forEach((childItem) => {
+          childItem.children.forEach((col) => {
+            result.push({ ...col, ptype: 'gridlayout', pfield: item.field });
+          });
+        });
+      } else if (item.children && !item.field) {
+        item.children = changeCardStructure(item.children);
+      } else if (item.children && item.field.indexOf('use_card') === -1) {
+        item.children = changeCardStructure(item.children);
+        item.children = [];
+      } else {
+        if (['Card'].includes(item.component)) {
+          item.columns[0].children = changeCardStructure(item.columns[0].children);
+          if (item.component === 'Card' && item.columns[0].children) {
+            item.columns[0].children.forEach((childItem) => {
+              if (childItem.pfield) {
+                result.push(childItem);
+              } else {
+                result.push({ ...childItem, ptype: 'card', pfield: item.field });
+              }
+            });
+            item.columns[0].children = [];
+          }
+        } else if (item.field && item.field.indexOf('use_card') !== -1) {
+          item.children = changeCardStructure(item.children);
+          item.children.forEach((childItem) => {
+            if (childItem.pfield) {
+              result.push(childItem);
+            } else {
+              result.push({ ...childItem, ptype: 'card', pfield: item.field });
+            }
+          });
+          item.children = [];
+        }
+      }
+      result.push(item);
+    });
+    return result;
+  } else {
+    return data;
+  }
+};