From 68d544d8f065e9ee5de33df268c2d99881ff1d8d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8E=E8=82=96=E7=A3=8A?= <18851179580@163.com>
Date: Wed, 16 Oct 2024 17:03:12 +0800
Subject: [PATCH] =?UTF-8?q?=E9=97=AE=E9=A2=98=E4=BF=AE=E5=A4=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/diy/carousel.vue                   | 14 +++++-----
 components/diy/data-magic.vue                 | 14 +++++++---
 components/diy/img-magic.vue                  | 27 ++++++++++++-------
 .../diy/modules/data-magic/magic-carousel.vue |  2 +-
 components/diy/title.vue                      |  6 +++--
 5 files changed, 41 insertions(+), 22 deletions(-)

diff --git a/components/diy/carousel.vue b/components/diy/carousel.vue
index 78296b91..ec02672b 100644
--- a/components/diy/carousel.vue
+++ b/components/diy/carousel.vue
@@ -1,7 +1,7 @@
 <template>
     <view class="pr" :style="style_container">
         <view class="pr" :style="style_img_container">
-            <swiper circular="true" :autoplay="form.is_roll == '1'" :interval="form.interval_time * 1000" :display-multiple-items="slides_per_group" :duration="500" :style="{ height: new_style.height * 2 + 'rpx' }" :previous-margin="previousMargin" :next-margin="nextMargin" @change="slideChange">
+            <swiper circular="true" :autoplay="form.is_roll == '1'" :interval="form.interval_time * 1000" :display-multiple-items="slides_per_group" :duration="500" :style="{ height: form.height * 2 + 'rpx' }" :previous-margin="previousMargin" :next-margin="nextMargin" @change="slideChange">
                 <block v-if="form.carousel_type == 'card'">
                     <swiper-item v-for="(item, index) in new_list" :key="index" class="flex-row align-c" :data-value="item.carousel_link.page" @tap="url_open">
                         <view class="swiper-item" :style="img_style" :class="['scale-defalt', { 'scale-1': animationData === index }]">
@@ -129,13 +129,13 @@
                 const { common_style, actived_color } = new_style;
                 // scaleToFill 对应 cover aspectFit 对应 contain  center 对应 none
                 let fit = '';
-                if (new_form.img_fit == 'cover') {
-                    fit = 'scaleToFill';
-                } else if (new_form.img_fit == 'contain') {
+                if (new_form.img_fit == 'contain') {
                     fit = 'aspectFit';
-                } else if (new_form.img_fit =='none') {
-                    fit = 'center';
-                }
+                } else if (new_form.img_fit =='fill') {
+                    fit = 'scaleToFill';
+                } else if (new_form.img_fit == 'cover') {
+                    fit = 'aspectFill';
+                } 
                 this.setData({
                     form: this.propValue.content,
                     new_style: this.propValue.style,
diff --git a/components/diy/data-magic.vue b/components/diy/data-magic.vue
index 35daeb4d..207ee43a 100644
--- a/components/diy/data-magic.vue
+++ b/components/diy/data-magic.vue
@@ -8,7 +8,7 @@
                         <view v-for="(item, index) in data_magic_list" :key="index" :style="item.data_style.background_style + content_radius + 'margin:' + spacing + ';' + ([0, 1].includes(index) ? 'width:calc(50% - ' + outer_spacing + ');height:calc(50% - ' + outer_spacing + ')' : 'width:calc((100% / 3) - ' + outer_spacing + ');height:calc(50% - ' + outer_spacing + ')')" class="style9">
                             <view class="wh-auto ht-auto"  :style="item.data_style.background_img_style">
                                 <template v-if="item.data_content.data_type == 'goods'">
-                                    <view class="wh-auto ht-auto flex-col gap-20" :style="[0, 1].includes(index) ? item.data_style.chunk_padding_data : ''">
+                                    <view class="wh-auto ht-auto flex-col" :style="'gap:'+ item.title_text_gap * 2 + 'rpx;' + ([0, 1].includes(index) ? item.data_style.chunk_padding_data : '')">
                                         <view v-if="(!isEmpty(item.data_content.heading_title) || !isEmpty(item.data_content.subtitle)) && [0, 1].includes(index)" class="flex-col gap-5 tl">
                                             <view class="ma-0 wh-auto text-line-1" :style="item.data_style.daheading_style">{{ item.data_content.heading_title || '' }}</view>
                                             <view class="ma-0 wh-auto text-line-1" :style="item.data_style.subtitle_style">{{ item.data_content.subtitle || '' }}</view>
@@ -40,7 +40,7 @@
                     <view v-for="(item, index) in data_magic_list" :key="index" class="cube-selected cr-main" :style="selected_style(item) + item.data_style.background_style + content_radius + ';margin:' + spacing + ';'">
                         <view class="wh-auto ht-auto"  :style="item.data_style.background_img_style">
                             <template v-if="item.data_content.data_type == 'goods'">
-                                <view :class="[spacing_processing(index) ? 'gap-20 wh-auto ht-auto flex-col' : 'gap-10 wh-auto ht-auto flex-col']" :style="item.data_style.chunk_padding_data">
+                                <view class="wh-auto ht-auto flex-col" :style="'gap:'+ item.title_text_gap * 2 + 'rpx;' + item.data_style.chunk_padding_data">
                                     <view v-if="!isEmpty(item.data_content.heading_title) || !isEmpty(item.data_content.subtitle)" class="flex-col gap-5 tl">
                                         <view class="ma-0 wh-auto text-line-1" :style="item.data_style.heading_style">{{ item.data_content.heading_title || '' }}</view>
                                         <view class="ma-0 wh-auto text-line-1" :style="item.data_style.subtitle_style">{{ item.data_content.subtitle || '' }}</view>
@@ -173,7 +173,15 @@
                     data_style.indicator_styles = this.indicator_style(data_style);
                     data_style.background_style = gradient_computer(data_style);
                     data_style.background_img_style = background_computer(data_style);
-
+                    let fit = '';
+                    if (data_content.img_fit == 'contain') {
+                        fit = 'aspectFit';
+                    } else if (data_content.img_fit =='fill') {
+                        fit = 'scaleToFill';
+                    } else if (data_content.img_fit == 'cover') {
+                        fit = 'aspectFill';
+                    } 
+                    data_content.fit = fit;
                     // 商品名称和价格样式
                     data_style.goods_title_style = this.goods_trends_config(data_style, 'title');
                     data_style.goods_price_style = this.goods_trends_config(data_style, 'price');
diff --git a/components/diy/img-magic.vue b/components/diy/img-magic.vue
index 347fbdc1..7aadd52b 100644
--- a/components/diy/img-magic.vue
+++ b/components/diy/img-magic.vue
@@ -20,9 +20,16 @@
                     </view>
                 </template>
                 <template v-else-if="form.style_actived == 10">
-                    <view v-for="(item, index) in form.img_magic_list" :key="index" class="cr-main" :style="img_spacing + selected_style(item)" :data-value="item.img_link.page" @tap="url_event">
-                        <image v-if="item.img.length > 0" :src="item.img[0].url" class="dis-block wh-auto" mode="widthFix" :style="content_img_radius"></image>
-                    </view>
+                    <template v-if="form.limit_size == '0'">
+                        <view v-for="(item, index) in form.img_magic_list" :key="index" class="cr-main" :style="img_spacing + selected_style(item)" :data-value="item.img_link.page" @tap="url_event">
+                            <image v-if="item.img.length > 0" :src="item.img[0].url" class="dis-block wh-auto" mode="widthFix" :style="content_img_radius"></image>
+                        </view>
+                    </template>
+                    <template v-else>
+                        <view v-for="(item, index) in form.img_magic_list" :key="index" class="cr-main" :style="img_spacing + selected_style(item) + ';height:' + form.image_height * 2 + 'rpx;'" :data-value="item.img_link.page" @tap="url_event">
+                            <image v-if="item.img.length > 0" :src="item.img[0].url" class="dis-block wh-auto ht-auto" :mode="img_fit" :style="content_img_radius"></image>
+                        </view>
+                    </template>
                 </template>
                 <template v-else>
                     <view v-for="(item, index) in form.img_magic_list" :key="index" class="cube-selected cr-main" :style="img_spacing + selected_style(item)" :data-value="item.img_link.page" @tap="url_event">
@@ -92,16 +99,18 @@
                 // 图片间距设置
                 const spacing = `${new_style.image_spacing}rpx`;
                 // scaleToFill 对应 cover aspectFit 对应 contain  center 对应 none
-                if (new_form.img_fit == 'cover') {
-                    fit = 'scaleToFill';
-                } else if (new_form.img_fit == 'contain') {
+                let fit = '';
+                if (new_content.img_fit == 'contain') {
                     fit = 'aspectFit';
-                } else if (new_form.img_fit =='none') {
-                    fit = 'center';
-                }
+                } else if (new_content.img_fit =='fill') {
+                    fit = 'scaleToFill';
+                } else if (new_content.img_fit == 'cover') {
+                    fit = 'aspectFill';
+                } 
                 const density = 4;
                 this.setData({
                     form: this.propValue.content,
+                    new_style: this.propValue.style,
                     outer_style: `width:${outer_spacing};height:${outer_spacing};margin:${outer_sx};`,
                     img_spacing: `padding:${spacing};`,
                     img_outer_spacing: new_style.image_spacing * 2 + 'rpx',
diff --git a/components/diy/modules/data-magic/magic-carousel.vue b/components/diy/modules/data-magic/magic-carousel.vue
index 1c53eedf..728b7fdc 100644
--- a/components/diy/modules/data-magic/magic-carousel.vue
+++ b/components/diy/modules/data-magic/magic-carousel.vue
@@ -3,7 +3,7 @@
         <swiper-item v-for="(item1, index1) in propValue.data_content.list" :key="index1">
             <template v-if="propType === 'img'">
                 <view :data-value="item1.carousel_link.page" @tap="url_event">
-                    <imageEmpty :propImageSrc="item1.carousel_img[0]" :propStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
+                    <imageEmpty :propImageSrc="item1.carousel_img[0]" :propStyle="propContentImgRadius" :propImgFit="propValue.data_content.fit" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
                 </view>
             </template>
             <template v-else>
diff --git a/components/diy/title.vue b/components/diy/title.vue
index 11ef978f..be98d901 100644
--- a/components/diy/title.vue
+++ b/components/diy/title.vue
@@ -5,12 +5,14 @@
                 <view class="pr flex-row" :class="title_center">
                     <view class="z-i flex-row align-c gap-10">
                         <template v-if="!isEmpty(form.img_src) && !isEmpty(form.img_src[0].url)">
-                            <image :src="form.img_src[0].url" class="title-img" mode="heightFix"></image>
+                            <view :style="{ 'height': form.img_height * 2 + 'rpx' }">
+                                <image :src="form.img_src[0].url" class="title-img" mode="aspectFit"></image>
+                            </view>
                         </template>
                         <template v-else-if="!isEmpty(form.icon_class)">
                             <iconfont :name="'icon-' + form.icon_class" :size="new_style.icon_size * 2 + 'rpx'" :color="new_style.icon_color" propContainerDisplay="flex"></iconfont>
                         </template>
-                        <view class="pr-15 nowrap" :style="title_style">{{ form.title || '标题' }}</view>
+                        <view class="pr-15 nowrap" :style="title_style">{{ form.title }}</view>
                     </view>
                     <view class="flex-row gap-10 align-c right-0 pa">
                         <template v-if="form.keyword_show == '1'">