From 23300ffea5ea86dbbbaf680e36649d9504cd416a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8E=E8=82=96=E7=A3=8A?= <18851179580@163.com>
Date: Fri, 4 Jul 2025 16:53:17 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E8=87=AA=E5=AE=9A=E4=B9=89?=
 =?UTF-8?q?=E6=A8=A1=E5=BC=8F=E4=B8=8B=E7=9A=84=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/form-input/form-input.vue      | 10 ++++---
 .../components/form-input/image.vue           |  4 ++-
 .../modules/component-show/index.vue          | 30 ++++++++++---------
 .../components/form-input/video.vue           |  2 ++
 4 files changed, 27 insertions(+), 19 deletions(-)

diff --git a/pages/form-input/components/form-input/form-input.vue b/pages/form-input/components/form-input/form-input.vue
index cc9d5f51..842481ef 100644
--- a/pages/form-input/components/form-input/form-input.vue
+++ b/pages/form-input/components/form-input/form-input.vue
@@ -1,13 +1,13 @@
 <template>
-    <view class="re oh wh-auto ht-auto">
+    <view class="pr oh wh-auto ht-auto">
         <scroll-view :scroll-top="scrollTop" :scroll-y="true" :scroll-x="overall_config.type_value == 'default' ? false : true" class="scroll-box" scroll-with-animation> 
-            <view class="abs w h" :style="content_style">
+            <view :style="content_style + (overall_config.type_value == 'default' ? '' : ('width:' + overall_config.custom_width * 2 + 'rpx;'))">
                 <template v-if="!isEmpty(img_url)">
                     <image :src="img_url" mode="aspectFit" />
                 </template>
             </view>
-            <view v-if="is_show_heading_title == '1'" class="head-title flex-row bg-white" :style="heading_title_style">{{ form_name }}</view>
-            <view class="data-list bg-white">
+            <view v-if="is_show_heading_title == '1'" class="head-title flex-row bg-white" :style="heading_title_style + (overall_config.type_value == 'default' ? '' : ('width:' + overall_config.custom_width * 2 + 'rpx;'))">{{ form_name }}</view>
+            <view class="data-list bg-white" :style="overall_config.type_value == 'default' ? '' : ('width:' + overall_config.custom_width * 2 + 'rpx;height:' + overall_config.custom_height * 2 + 'rpx')">
                 <!-- 组件显示逻辑 -->
                 <component-show 
                     :propValue="filteredDiyData" 
@@ -19,6 +19,7 @@
                     :propDirection="flex_direction" 
                     :propMobile="mobile" 
                     :propComponentStyle="component_style"
+                    :propIsCustom="overall_config.type_value == 'free'"
                     @dataChange="data_change"
                     @dataCheck="data_check"
                     @dataOptionChange="data_option_change"
@@ -298,6 +299,7 @@ export default {
     word-wrap: break-word;
     font-size: 40rpx;
     padding: 16rpx 11rpx 0;
+    box-sizing: border-box;
     word-break: break-word;
 }
 .scroll-box {
diff --git a/pages/form-input/components/form-input/image.vue b/pages/form-input/components/form-input/image.vue
index d1202d20..1a641c1c 100644
--- a/pages/form-input/components/form-input/image.vue
+++ b/pages/form-input/components/form-input/image.vue
@@ -1,5 +1,5 @@
 <template>
-    <view class="form-input-image"> 
+    <view class="form-input-image" :style="img_style"> 
         <image-empty :propImageSrc="img_src" :propStyle="img_style" propErrorStyle="width: 100rpx;height: 100rpx;"></image-empty>
     </view>
 </template>
@@ -58,6 +58,8 @@
                     const { img_width, img_scale_type } = com_data;
                     const height = img_scale_type === '1' ? img_width : img_scale_type == '0' ? (img_width * 9) / 16 : (img_width * 3) / 4;
                     img_style = `width: ${ img_width * 2 }rpx;height:${ height * 2 }rpx;`
+                } else {
+                    img_style = `width: 100%;height:100%;`
                 }
                 this.setData({
                     com_data: com_data,
diff --git a/pages/form-input/components/form-input/modules/component-show/index.vue b/pages/form-input/components/form-input/modules/component-show/index.vue
index 59428d5f..a7f43a86 100644
--- a/pages/form-input/components/form-input/modules/component-show/index.vue
+++ b/pages/form-input/components/form-input/modules/component-show/index.vue
@@ -1,10 +1,8 @@
 <template>
-    <view class="wh-auto ht-auto">
-        <view v-for="(item, index) in data_list" :key="index" :class="(propDirection == 'row' ? 'row-item' : 'column-item mb-10') + (item.com_data.common_config.is_error == '1' ? ' item_error' : '')" :style="( item.key == 'auxiliary-line' ? 'border-bottom: 0rpx' : '')">
-            <!-- 左右模式 -->
-            <!-- <template v-if="propDirection == 'row'"> -->
+    <view class="wh-auto ht-auto pr">
+        <view v-for="(item, index) in data_list" :key="index" :class="(propIsCustom ? 'pa ' : (propDirection == 'row' ? 'row-item ' : 'column-item mb-10 ')) + (item.com_data.common_config.is_error == '1' ? ' item_error' : '')" :data-id="item.id" :data-location-x="item.location.x" :data-location-y="item.location.y" :style="(item.key == 'auxiliary-line' ? 'border-bottom: 0rpx; ' : '') + (propIsCustom ? ('left:' + item.location.x + 'px;top:' + item.location.y + 'px;width:' + item.com_data.com_width + 'px;height:' + item.com_data.com_height + 'px;z-index:' + (item.is_enable == '1' ? (data_list.length - 1 > 0 ? (data_list.length - 1) - index : 0) : -999) + ';') : '')">
             <view :class="'wh-auto ht-auto ' + (propDirection == 'row' ? (['video', 'img', 'upload-img', 'upload-video', 'multi-text'].includes(item.key) ? 'flex-row align-s gap-10' : 'flex-row align-b gap-10')  : 'flex-col gap-10')">
-                <view v-if="!['rich-text', 'auxiliary-line', 'upload-attachments'].includes(item.key)" class="field-label flex-row align-c gap-10" :style="propFieldLabelStyle + (propDirection == 'row' && ['upload-img', 'upload-video'].includes(item.key) ? 'padding-top: 12rpx;line-height: 120rpx;' : '') + (propDirection == 'row' && ['multi-text'].includes(item.key) ? 'padding-top: 18rpx;' : '')">
+                <view v-if="(!propIsCustom && !['rich-text', 'auxiliary-line', 'upload-attachments'].includes(item.key)) || (propIsCustom && !['img', 'video', 'auxiliary-line', 'rect', 'round'].includes(item.key))" class="field-label flex-row align-c gap-10" :style="propFieldLabelStyle + (propDirection == 'row' && ['upload-img', 'upload-video'].includes(item.key) ? 'padding-top: 12rpx;line-height: 120rpx;' : '') + (propDirection == 'row' && ['multi-text'].includes(item.key) ? 'padding-top: 18rpx;' : '')">
                     <view class="flex-row align-c" :style="propTitleStyle">{{ item.com_data.title }}<view v-if="item.com_data.is_required == '1'" class="required">*</view></view>
                     <view v-if="item.com_data.common_config.help_is_show == '1' && !isEmpty(item.com_data.common_config.help_explain)" :data-value="item.com_data.common_config.help_explain" @tap="help_icon_event">
                         <iconfont name="icon-miaosha-hdgz" :size="propHelpIconStyle" color="#999"></iconfont>
@@ -68,11 +66,11 @@
                     <view v-else-if="item.key == 'score'">
                         <component-score :propValue="item.com_data" :propKey="propKey" :propDataId="item.id" :propMobile="propMobile" :propStyle="propComponentStyle" :propDirection="propDirection" @dataCheck="data_check" @dataChange="data_change"></component-score>
                     </view>
-                    <view v-else-if="item.key == 'img'">
-                        <component-image :propValue="item.com_data" :propKey="propKey" :propDataId="item.id" :propMobile="propMobile" :propStyle="propComponentStyle" :propDirection="propDirection"></component-image>
+                    <view v-else-if="item.key == 'img'" :class="propIsCustom ? 'wh-auto ht-auto' : ''">
+                        <component-image :propValue="item.com_data" :propKey="propKey" :propDataId="item.id" :propMobile="propMobile" :propStyle="propComponentStyle" :propDirection="propDirection" :propIsCustom="propIsCustom"></component-image>
                     </view>
-                    <view v-else-if="item.key == 'video'">
-                        <component-video :propValue="item.com_data" :propKey="propKey" :propDataId="item.id" :propMobile="propMobile" :propStyle="propComponentStyle" :propDirection="propDirection"></component-video>
+                    <view v-else-if="item.key == 'video'" :class="propIsCustom ? 'wh-auto ht-auto' : ''">
+                        <component-video :propValue="item.com_data" :propKey="propKey" :propDataId="item.id" :propMobile="propMobile" :propStyle="propComponentStyle" :propDirection="propDirection" :propIsCustom="propIsCustom"></component-video>
                     </view>
                     <view v-else-if="item.key == 'text'">
                         <component-text :propValue="item.com_data" :propKey="propKey" :propDataId="item.id" :propMobile="propMobile" :propStyle="propComponentStyle" :propDirection="propDirection"></component-text>
@@ -190,6 +188,15 @@ export default {
         propComponentStyle: {
             type: String,
             default: '',
+        },
+        propIsCustom: {
+            type: Boolean,
+            default: false,
+        }
+    },
+    data() {
+        return {
+            data_list: []
         }
     },
     watch: {
@@ -203,11 +210,6 @@ export default {
            this.init();
         }
     },
-    data() {
-        return {
-            data_list: []
-        }
-    },
     mounted() {
         this.init();
     },
diff --git a/pages/form-input/components/form-input/video.vue b/pages/form-input/components/form-input/video.vue
index 2eaed4fd..55c866cd 100644
--- a/pages/form-input/components/form-input/video.vue
+++ b/pages/form-input/components/form-input/video.vue
@@ -65,6 +65,8 @@
                     const { video_width, video_scale_type } = com_data;
                     const height = video_scale_type === '1' ? video_width : video_scale_type == '0' ? (video_width * 9) / 16 : (video_width * 3) / 4;
                     video_style = `width: ${ video_width * 2 }rpx;height:${ height * 2 }rpx;`
+                } else {
+                    video_style = `width: 100%;height:100%;`
                 }
                 this.setData({
                     com_data: com_data,