From e7a5f5d31630ae4313dd9e53dfd2ec695f8bc4b6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=85=A8=E6=A0=88=E5=B0=8F=E5=AD=A6=E7=94=9F?=
 <1518079521@qq.com>
Date: Fri, 14 Mar 2025 18:33:34 +0800
Subject: [PATCH] up

---
 .../components/diy-form-detail/index.vue      |  90 +++---
 .../src/addon/components/diy-form/index.vue   | 297 +++++++++---------
 .../src/addon/components/diy/group/index.vue  |   1 -
 3 files changed, 193 insertions(+), 195 deletions(-)

diff --git a/uni-app/src/addon/components/diy-form-detail/index.vue b/uni-app/src/addon/components/diy-form-detail/index.vue
index b095948bf..e0e902ea6 100644
--- a/uni-app/src/addon/components/diy-form-detail/index.vue
+++ b/uni-app/src/addon/components/diy-form-detail/index.vue
@@ -6,54 +6,52 @@
     </view>
 </template>
 <script lang="ts" setup>
-    import { ref, reactive, onMounted } from 'vue';
-    import diyGroup from '@/addon/components/diy/group/index.vue'
-    import { getFormRecord } from '@/app/api/diy_form';
+import { ref, reactive, onMounted } from 'vue';
+import diyGroup from '@/addon/components/diy/group/index.vue'
+import { getFormRecord } from '@/app/api/diy_form';
 
-    const props = defineProps(['record_id','completeLayout']);
-    const emits = defineEmits(['callback'])
+const props = defineProps(['record_id', 'completeLayout']);
+const emits = defineEmits(['callback'])
+const loading = ref(true);
+const diyFormData: any = reactive({
+    global: {},
+    value: []
+})
 
-    const loading = ref(true);
+onMounted(() => {
+    getFormRecord({
+        record_id: props.record_id
+    }).then((res: any) => {
+        diyFormData.global.completeLayout = props.completeLayout || 'style-1';
+        if (res.data.recordsFieldList) {
 
-    const diyFormData: any = reactive({
-        global: {},
-        value: []
-    })
-
-    onMounted(() => {
-        getFormRecord({
-            record_id: props.record_id
-        }).then((res: any) => {
-            diyFormData.global.completeLayout = props.completeLayout || 'style-1';
-            if (res.data.recordsFieldList) {
-
-                res.data.recordsFieldList.forEach((item: any) => {
-                    let comp = {
-                        id: item.field_key,
-                        componentName: item.field_type,
-                        pageStyle: '',
-                        viewFormDetail: true, // 查看表单详情标识
-                        field: {
-                            name: item.field_name,
-                            value: item.handle_field_value,
-                            required: item.field_required,
-                            unique: item.field_unique,
-                            privacyProtection: item.privacy_protection,
-                        },
-                        margin: {
-                            top: 0,
-                            bottom: 0,
-                            both: 0
-                        }
-                    };
-                    diyFormData.value.push(comp);
-                })
-            }
-            emits('callback', res.data.recordsFieldList)
-            loading.value = false;
-        }).catch(() => {
-            loading.value = false;
-            emits('callback', [])
-        })
+            res.data.recordsFieldList.forEach((item: any) => {
+                let comp = {
+                    id: item.field_key,
+                    componentName: item.field_type,
+                    pageStyle: '',
+                    viewFormDetail: true, // 查看表单详情标识
+                    field: {
+                        name: item.field_name,
+                        value: item.handle_field_value,
+                        required: item.field_required,
+                        unique: item.field_unique,
+                        privacyProtection: item.privacy_protection,
+                    },
+                    margin: {
+                        top: 0,
+                        bottom: 0,
+                        both: 0
+                    }
+                };
+                diyFormData.value.push(comp);
+            })
+        }
+        emits('callback', res.data.recordsFieldList)
+        loading.value = false;
+    }).catch(() => {
+        loading.value = false;
+        emits('callback', [])
     })
+})
 </script>
diff --git a/uni-app/src/addon/components/diy-form/index.vue b/uni-app/src/addon/components/diy-form/index.vue
index 8ac1171ab..a32becf60 100644
--- a/uni-app/src/addon/components/diy-form/index.vue
+++ b/uni-app/src/addon/components/diy-form/index.vue
@@ -7,185 +7,186 @@
     </view>
 </template>
 <script lang="ts" setup>
-    import { ref, reactive, computed, onMounted, watch } from 'vue';
-    import { useDiyForm } from '@/hooks/useDiyForm'
-    import { deepClone,getValidTime } from '@/utils/common'
-    import diyGroup from '@/addon/components/diy/group/index.vue'
+import { ref, reactive, computed, onMounted, watch } from 'vue';
+import { useDiyForm } from '@/hooks/useDiyForm'
+import { deepClone, getValidTime } from '@/utils/common'
+import diyGroup from '@/addon/components/diy/group/index.vue'
 
-    const props = defineProps(['form_id', 'relate_id', 'storage_name', 'form_border']);
+const props = defineProps(['form_id', 'relate_id', 'storage_name', 'form_border']);
 
-    const diy = useDiyForm({
-        form_id: props.form_id,
-        needLogin: false // 不检测登录，调用业务自行处理
-    })
+const diy = useDiyForm({
+    form_id: props.form_id,
+    needLogin: false // 不检测登录，调用业务自行处理
+})
 
-    const diyGroupRef = ref(null)
+const diyGroupRef = ref(null)
 
-    const requestData = computed(() => {
-        return diy.requestData;
-    })
+const requestData = computed(() => {
+    return diy.requestData;
+})
 
-    const diyFormData: any = reactive({})
+const diyFormData: any = reactive({})
 
-    onMounted(() => {
-        diy.getData(() => {
-            diyFormData.status = diy.data.status;
-            if (diyFormData.status) {
-                diyFormData.title = diy.data.title;
-                diyFormData.global = diy.data.global;
-                if (diyFormData.global) {
-                    diyFormData.global.topStatusBar.isShow = false; // 顶部导航栏强制隐藏
-                    diyFormData.global.bottomTabBarSwitch = false; // 底部导航强制隐藏
+onMounted(() => {
+    diy.getData(() => {
+        diyFormData.status = diy.data.status;
+        if (diyFormData.status) {
+            diyFormData.title = diy.data.title;
+            diyFormData.global = diy.data.global;
+            if (diyFormData.global) {
+                diyFormData.global.topStatusBar.isShow = false; // 顶部导航栏强制隐藏
+                diyFormData.global.bottomTabBarSwitch = false; // 底部导航强制隐藏
+            }
+            let value: any = [];
+            if (props.form_border == 'none') {
+                diyFormData.global.borderControl = false;
+            }
+            // 需要过滤 组件类型，筛选出来表单，排除表单提交组件
+            diy.data.value.forEach((item: any) => {
+                if (item.componentType == 'diy_form' && item.componentName != 'FormSubmit') {
+                    value.push(item);
                 }
-                let value: any = [];
-				if(props.form_border == 'none'){
-					diyFormData.global.borderControl = false;
-				}
-                // 需要过滤 组件类型，筛选出来表单，排除表单提交组件
-                diy.data.value.forEach((item: any) => {
-                    if (item.componentType == 'diy_form' && item.componentName != 'FormSubmit') {
-                        value.push(item);
+            })
+            diyFormData.value = value;
+            diyFormData.componentRefs = null;
+            diyGroupRef.value?.refresh();
+            watchFormData();
+        }
+    })
+})
+
+const watchFormData = () => {
+    watch(
+        () => diyFormData.value,
+        (newValue, oldValue) => {
+            if (newValue) {
+                let formData: any = {
+                    validTime: getValidTime(5), // 缓存数据有效期为5分钟
+                    components: []
+                };
+                newValue.forEach((item: any) => {
+                    // 只存表单组件
+                    if (item.componentType == 'diy_form' && item.componentName != 'FormSubmit' && item.field.cache) {
+                        // 只存储表单数据，压缩存储空间
+                        let field = deepClone(item.field);
+                        // 移除不需要存储的数据
+                        delete field.remark; // 字段说明
+                        delete field.detailComponent; // 用于详情展示
+                        delete field.default; // 默认值
+                        formData.components.push({
+                            id: item.id,
+                            componentName: item.componentName,
+                            componentType: item.componentType,
+                            componentTitle: item.componentTitle,
+                            isHidden: item.isHidden,
+                            field: field
+                        })
                     }
                 })
-                diyFormData.value = value;
-                diyFormData.componentRefs = null;
-                diyGroupRef.value?.refresh();
-                watchFormData();
-            }
-        })
-    })
-
-    const watchFormData = () => {
-        watch(
-            () => diyFormData.value,
-            (newValue, oldValue) => {
-                if (newValue) {
-                    let formData: any = {
-                        validTime: getValidTime(5), // 缓存数据有效期为5分钟
-                        components: []
-                    };
-                    newValue.forEach((item: any) => {
-                        // 只存表单组件
-                        if (item.componentType == 'diy_form' && item.componentName != 'FormSubmit') {
-                            // 只存储表单数据，压缩存储空间
-                            let field = deepClone(item.field);
-                            // 移除不需要存储的数据
-                            delete field.remark; // 字段说明
-                            delete field.detailComponent; // 用于详情展示
-                            delete field.default; // 默认值
-                            formData.components.push({
-                                id: item.id,
-                                componentName: item.componentName,
-                                componentType: item.componentType,
-                                componentTitle: item.componentTitle,
-                                isHidden: item.isHidden,
-                                field: field
-                            })
-                        }
-                    })
-                    if (formData.components.length) {
-                        uni.setStorageSync('diyFormStorage_' + props.form_id, formData)
-                    }
+                if (formData.components.length) {
+                    uni.setStorageSync('diyFormStorage_' + props.form_id, formData)
                 }
-            },
-            { deep: true }
-        )
-    }
+            }
+        },
+        { deep: true }
+    )
+}
 
-    const verify = () => {
-        if(!diyFormData.status) return true;
-        if(!diyFormData.value) return true;
-        let allPass = true; // 是否全部通过验证
+const verify = () => {
+    if (!diyFormData.status) return true;
+    if (!diyFormData.value) return true;
+    let allPass = true; // 是否全部通过验证
 
-        let componentRefs = diyGroupRef.value.getFormRef().componentRefs;
+    let componentRefs = diyGroupRef.value.getFormRef().componentRefs;
 
-        // 需要过滤 组件类型，筛选出来表单
-        for (let i = 0; i < diyFormData.value.length; i++) {
-            let item = diyFormData.value[i];
-            if (item.field.required || item.field.value) {
-                let refKey = `diy${ item.componentName }Ref`;
-                let isBreak = false;
-                if (componentRefs[refKey]) {
-                    for (let k = 0; k < componentRefs[refKey].length; k++) {
-                        let compRef = componentRefs[refKey][k];
-                        let verify = compRef.verify(); // 验证表单组件数据
-                        if (verify && !verify.code) {
-                            isBreak = true;
-                            uni.showToast({
-                                title: verify.message,
-                                icon: 'none'
-                            });
-                            break;
-                        }
-
-                    }
-                    if (isBreak) {
-                        allPass = false;
+    // 需要过滤 组件类型，筛选出来表单
+    for (let i = 0; i < diyFormData.value.length; i++) {
+        let item = diyFormData.value[i];
+        if (item.field.required || item.field.value) {
+            let refKey = `diy${ item.componentName }Ref`;
+            let isBreak = false;
+            if (componentRefs[refKey]) {
+                for (let k = 0; k < componentRefs[refKey].length; k++) {
+                    let compRef = componentRefs[refKey][k];
+                    let verify = compRef.verify(); // 验证表单组件数据
+                    if (verify && !verify.code) {
+                        isBreak = true;
+                        uni.showToast({
+                            title: verify.message,
+                            icon: 'none'
+                        });
                         break;
                     }
+
+                }
+                if (isBreak) {
+                    allPass = false;
+                    break;
                 }
             }
         }
-
-        if (!allPass) return false;
-
-        const data = {
-            form_id: props.form_id,
-            value: uni.getStorageSync('diyFormStorage_' + props.form_id),
-            relate_id: props.relate_id || 0 // 关联业务id
-        }
-        if (props.storage_name) {
-            uni.setStorageSync(props.storage_name, data)
-        }
-        return allPass;
     }
 
-    // 获取数据
-    const getData = ()=> {
-        return {
-            form_id: props.form_id,
-            value: diyFormData.value,
-            relate_id: props.relate_id || 0 // 关联业务id
-        }
+    if (!allPass) return false;
+
+    const data = {
+        form_id: props.form_id,
+        value: uni.getStorageSync('diyFormStorage_' + props.form_id),
+        relate_id: props.relate_id || 0 // 关联业务id
     }
-
-    const clearStorage = (keys: any=[]) => {
-        uni.removeStorageSync('diyFormStorage_' + props.form_id)
-        if (props.storage_name) uni.removeStorageSync(props.storage_name)
-        if(keys) {
-            keys.forEach((key: any) => {
-                uni.removeStorageSync(key)
-            })
-        }
+    if (props.storage_name) {
+        uni.setStorageSync(props.storage_name, data)
     }
+    return allPass;
+}
 
-    // 监听页面隐藏
-    diy.onHide();
+// 获取数据
+const getData = () => {
+    return {
+        form_id: props.form_id,
+        value: diyFormData.value,
+        relate_id: props.relate_id || 0 // 关联业务id
+    }
+}
 
-    // 监听页面卸载
-    diy.onUnload();
+const clearStorage = (keys: any = []) => {
+    uni.removeStorageSync('diyFormStorage_' + props.form_id)
+    if (props.storage_name) uni.removeStorageSync(props.storage_name)
+    if (keys) {
+        keys.forEach((key: any) => {
+            uni.removeStorageSync(key)
+        })
+    }
+}
 
-    // 监听滚动事件
-    // diy.onPageScroll()
+// 监听页面隐藏
+diy.onHide();
 
-    defineExpose({
-        verify,
-        getData,
-        clearStorage
-    })
+// 监听页面卸载
+diy.onUnload();
+
+// 监听滚动事件
+// diy.onPageScroll()
+
+defineExpose({
+    verify,
+    getData,
+    clearStorage
+})
 
 </script>
 
 <style lang="scss">
-    .diy-template-wrap {
-        /* #ifdef MP */
-        .child-diy-template-wrap {
-            ::v-deep .diy-group {
-                > .draggable-element.top-fixed-diy {
-                    display: block !important;
-                }
+.diy-template-wrap {
+    /* #ifdef MP */
+    .child-diy-template-wrap {
+        ::v-deep .diy-group {
+            > .draggable-element.top-fixed-diy {
+                display: block !important;
             }
         }
-        /* #endif */
     }
+
+    /* #endif */
+}
 </style>
diff --git a/uni-app/src/addon/components/diy/group/index.vue b/uni-app/src/addon/components/diy/group/index.vue
index f0dd5f8b6..07c3abeea 100644
--- a/uni-app/src/addon/components/diy/group/index.vue
+++ b/uni-app/src/addon/components/diy/group/index.vue
@@ -112,7 +112,6 @@
                 <template v-if="component.componentName == 'FormFile'">
                     <diy-form-file ref="diyFormFileRef" :component="component" :global="data.global" :index="index" />
                 </template>
-
             </view>
         </view>
         <template v-if="diyStore.mode == '' && data.global && data.global.bottomTabBarSwitch">