修改等比逻辑显示

master
于肖磊 2025-01-20 17:24:13 +08:00
parent cc6facb11d
commit 532756f60d
4 changed files with 19 additions and 10 deletions

View File

@ -12,8 +12,8 @@
<view class="w h flex-col" :style="'gap:'+ item.data_style.title_data_gap * 2 + 'rpx;'">
<view v-if="(!isEmpty(item.data_content.heading_title) || !isEmpty(item.data_content.subtitle)) && [0, 1].includes(index)" :class="'tl' + (item.data_style.title_line == '1' ? ' flex-row align-c' : ' flex-col')" :style="'gap:' + item.data_style.title_gap * 2 + 'rpx;'">
<template v-if="item.data_content.heading_title_type && item.data_content.heading_title_type == 'image'">
<view v-if="item.data_content.heading_title_img.length > 0" class="re oh" :style="'width:100%;height:' + (!isEmpty(item.data_style.heading_img_height) ? item.data_style.heading_img_height : 0) * 2 + 'rpx'">
<image :src="item.data_content.heading_title_img[0].url" class="wh-auto ht-auto" mode="aspectFit" />
<view v-if="item.data_content.heading_title_img.length > 0" class="re oh" :style="'width:100%;height:' + (!isEmpty(item.data_style.heading_img_height) ? item.data_style.heading_img_height * magic_scale : 0) + 'px'">
<image :src="item.data_content.heading_title_img[0].url" class="ht-auto max-w" mode="heightFix" />
</view>
</template>
<template v-else>
@ -61,8 +61,8 @@
<view class="w h flex-col" :style="'gap:'+ item.data_style.title_data_gap * 2 + 'rpx;'">
<view v-if="!isEmpty(item.data_content.heading_title) || !isEmpty(item.data_content.subtitle)" :class="'tl' + (item.data_style.title_line == '1' ? ' flex-row align-c' : ' flex-col')" :style="'gap:' + item.data_style.title_gap * 2 + 'rpx;'">
<template v-if="item.data_content.heading_title_type && item.data_content.heading_title_type == 'image'">
<view v-if="item.data_content.heading_title_img.length > 0" class="re oh" :style="'width:100%;height:' + (!isEmpty(item.data_style.heading_img_height) ? item.data_style.heading_img_height : 0) * 2 + 'rpx'">
<image :src="item.data_content.heading_title_img[0].url" class="wh-auto ht-auto" mode="aspectFit" />
<view v-if="item.data_content.heading_title_img.length > 0" class="re oh" :style="'width:100%;height:' + (!isEmpty(item.data_style.heading_img_height) ? item.data_style.heading_img_height * magic_scale : 0) + 'px'">
<image :src="item.data_content.heading_title_img[0].url" class="ht-auto max-w" mode="heightFix" />
</view>
</template>
<template v-else>
@ -204,7 +204,7 @@
magic_scale: width / 390,
div_width: sys_width,
cubeCellWidth: sys_width / density,
container_size: container_height * 2 + 'rpx',
container_size: container_height * (width / 390) + 'px',
});
},
get_data_magic_list(data, new_style) {

View File

@ -31,7 +31,7 @@
<componentDiyGoodsList v-else-if="item.key == 'goods-list'" :ref="'diy_goods_buy' + index" :propIndex="(is_immersive_style_and_general_safe_distance_value && tabs_data.length < 0) ? item.index : -1" :propDiyIndex="index" :propKey="item.id + index" :propValue="item.com_data" @goods_buy_event="goods_buy_event"></componentDiyGoodsList>
<componentDiyDataMagic v-else-if="item.key == 'data-magic'" :propOuterContainerPadding="outer_container_padding" :propIndex="(is_immersive_style_and_general_safe_distance_value && tabs_data.length < 0) ? item.index : -1" :propKey="item.id + index" :propValue="item.com_data"></componentDiyDataMagic>
<componentDiyCustom v-else-if="item.key == 'custom'" :propOuterContainerPadding="outer_container_padding" :propIndex="(is_immersive_style_and_general_safe_distance_value && tabs_data.length < 0) ? item.index : -1" :propKey="item.id + index" :propValue="item.com_data"></componentDiyCustom>
<componentDiyImgMagic v-else-if="item.key == 'img-magic'" :propIndex="(is_immersive_style_and_general_safe_distance_value && tabs_data.length < 0) ? item.index : -1" :propKey="item.id + index" :propValue="item.com_data"></componentDiyImgMagic>
<componentDiyImgMagic v-else-if="item.key == 'img-magic'" :propOuterContainerPadding="outer_container_padding" :propIndex="(is_immersive_style_and_general_safe_distance_value && tabs_data.length < 0) ? item.index : -1" :propKey="item.id + index" :propValue="item.com_data"></componentDiyImgMagic>
<componentDiyHotZone v-else-if="item.key == 'hot-zone'" :propIndex="(is_immersive_style_and_general_safe_distance_value && tabs_data.length < 0) ? item.index : -1" :propKey="item.id + index" :propValue="item.com_data"></componentDiyHotZone>
<componentDiySeckill v-else-if="item.key == 'seckill'" :propOuterContainerPadding="outer_container_padding" :propIndex="(is_immersive_style_and_general_safe_distance_value && tabs_data.length < 0) ? item.index : -1" :propKey="item.id + index" :propValue="item.com_data"></componentDiySeckill>
<!-- 插件 -->

View File

@ -111,7 +111,7 @@
</view>
</block>
<block v-else>
<swiper circular="true" :autoplay="new_style.is_roll == '1'" :interval="new_style.interval_time * 1000" :duration="500" :next-margin="new_style.rolling_fashion == 'translation' ? '-' + content_outer_spacing_magin : '0rpx'" :display-multiple-items="slides_per_group" :style="{ width: '100%', height: new_style.content_outer_height * 2 + 'rpx' }">
<swiper circular="true" :autoplay="new_style.is_roll == '1'" :interval="new_style.interval_time * 1000" :duration="500" :next-margin="new_style.rolling_fashion == 'translation' ? '-' + content_outer_spacing_magin : '0rpx'" :display-multiple-items="slides_per_group" :style="{ width: '100%', height: new_style.content_outer_height * new_scale + 'px' }">
<swiper-item v-for="(item1, index1) in shop_content_list" :key="index1">
<view class="flex-row wh-auto ht-auto" :style="onter_style">
<view v-for="(item, index) in item1.split_list" :key="index" class="pr oh" :style="layout_style" :data-index="index1" :data-split-index="index" :data-value="item.goods_url" @tap.stop="url_event">
@ -256,6 +256,7 @@
button_gradient: '',
//
img_size: '',
new_scale: 1,
};
},
watch: {
@ -335,6 +336,7 @@
new_style: new_style,
outer_class: flex + wrap + background + 'oh',
list: new_list,
new_scale: scale,
content_radius: radius_computer(new_style.shop_radius), //
content_img_radius: radius_computer(new_style.shop_img_radius), //
content_padding: padding_computer(new_style.shop_padding) + 'box-sizing: border-box;', //
@ -428,7 +430,7 @@
} else if (form.theme == '5') {
//
if (new_style.rolling_fashion != 'translation') {
size_style = `width: ${this.get_multicolumn_columns_width(new_style, form)};min-width: ${this.get_multicolumn_columns_width(new_style, form)};height: ${new_style.content_outer_height * 2 + 'rpx'};`;
size_style = `width: ${this.get_multicolumn_columns_width(new_style, form)};min-width: ${this.get_multicolumn_columns_width(new_style, form)};height: ${new_style.content_outer_height * (sys_width / 390) + 'px'};`;
} else {
size_style = `margin-right: ${ (new_style.content_outer_spacing * 2) + (shop_margin.margin_right * 2) }rpx;width: 100%;height: 100%;`;
}

View File

@ -62,7 +62,7 @@
</template>
<script>
const app = getApp();
import { common_styles_computer, common_img_computer, radius_computer, percentage_count, isEmpty, margin_computer, padding_computer, old_padding, old_margin } from '@/common/js/common/common.js';
import { common_styles_computer, common_img_computer, radius_computer, percentage_count, isEmpty, margin_computer, padding_computer, old_padding, old_margin, border_width } from '@/common/js/common/common.js';
var system = app.globalData.get_system_info(null, null, true);
var sys_width = app.globalData.window_width_handle(system.windowWidth);
export default {
@ -80,6 +80,10 @@
type: Number,
default: 1000000,
},
propOuterContainerPadding: {
type: Number,
default: 0,
}
},
data() {
return {
@ -138,6 +142,9 @@
}
const container_height = !isEmpty(new_content.container_height) ? new_content.container_height : sys_width;
const density = !isEmpty(new_content.magic_cube_density) ? new_content.magic_cube_density : 4;
const { margin_left, margin_right, padding_left, padding_right } = new_style.common_style;
const width = sys_width - margin_left - margin_right - padding_left - padding_right - border_width(new_style.common_style) - this.propOuterContainerPadding;
this.setData({
form: this.propValue.content,
new_style: this.propValue.style,
@ -148,7 +155,7 @@
style_img_container: common_img_computer(new_style.common_style, this.propIndex) + 'box-sizing: border-box;',
img_fit: fit,
div_width: sys_width,
container_size: container_height * 2 + 'rpx',
container_size: container_height * (width / 390) + 'px',
cube_cell: sys_width / density,
content_img_container: common_styles_computer(new_style) + margin_computer(new_style?.margin || old_margin) + 'box-sizing: border-box;',
content_img_style_container: common_img_computer(new_style) + padding_computer(new_style?.padding || old_padding) + 'box-sizing: border-box;',