sileya-ai
/
vr-shopxo-uniapp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

新增自定义模式下的显示

master
于肖磊 2025-07-04 16:53:17 +08:00
parent 7e718a0dc0
commit 23300ffea5
4 changed files with 27 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
pages/form-input/components/form-input/form-input.vue
View File

@ -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 {

4
pages/form-input/components/form-input/image.vue
View File

@ -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,

30
pages/form-input/components/form-input/modules/component-show/index.vue
View File

@ -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();
},

2
pages/form-input/components/form-input/video.vue
View File

@ -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,