修改组件传参数

master
于肖磊 2024-09-26 09:59:23 +08:00
parent 35a6a514fe
commit e9b03b307f
33 changed files with 224 additions and 223 deletions

View File

@ -948,7 +948,9 @@
.gap-2 {
gap: 4rpx;
}
.gap-3 {
gap: 6rpx;
}
.gap-4 {
gap: 8rpx;
}
@ -972,7 +974,35 @@
.gap-16 {
gap: 32rpx;
}
.gap-20 {
gap: 40rpx;
}
.pr-4 {
padding: 8rpx;
}
.pr-15 {
padding-right: 30rpx;
}
.plr-11 {
padding-left: 22rpx;
padding-right: 22rpx;
}
.ptb-5 {
padding-top: 10rpx;
padding-bottom: 10rpx;
}
.ptb-15 {
padding-top: 30rpx;
padding-bottom: 30rpx;
}
.mlr-10 {
margin-left: 20rpx;
margin-right: 20rpx;
}
/**
* font-size
*/

View File

@ -61,7 +61,7 @@
import { common_styles_computer, padding_computer, radius_computer, get_math } from '@/common/js/common/common.js';
export default {
props: {
value: {
propValue: {
type: Object,
default: () => {},
},
@ -119,8 +119,8 @@
},
methods: {
init() {
const new_content = this.value.content || {};
const new_style = this.value.style || {};
const new_content = this.propValue.content || {};
const new_style = this.propValue.style || {};
this.setData({
//
data_list:

View File

@ -1,9 +1,9 @@
<template>
<!-- 文章列表 -->
<view class="overflow-unset" :style="style_container">
<componentDiyModulesTabsView :value="article_tabs" :is-top="top_up == '1'" @tabs-click="tabs_click_event"></componentDiyModulesTabsView>
<componentDiyModulesTabsView :propValue="article_tabs" :is-top="top_up == '1'" @tabs-click="tabs_click_event"></componentDiyModulesTabsView>
<view class="padding-top oh">
<componentDiyArticleList :key="key" :value="article_tabs" :is-common-style="false"></componentDiyArticleList>
<componentDiyArticleList :key="key" :propValue="article_tabs" :is-common-style="false"></componentDiyArticleList>
</view>
</view>
</template>
@ -14,7 +14,7 @@
import componentDiyArticleList from '@/components/diy/article-list';
export default {
props: {
value: {
proppropValue: {
type: Object,
default: () => {},
},
@ -41,9 +41,9 @@
},
methods: {
init() {
const new_content = this.value.content || {};
const new_style = this.value.style || {};
let new_data = JSON.parse(JSON.stringify(this.value));
const new_content = this.propValue.content || {};
const new_style = this.propValue.style || {};
let new_data = JSON.parse(JSON.stringify(this.propValue));
this.top_up = new_content.tabs_top_up;
new_data.content.theme = new_data.content.article_theme;
new_data.content.data_type = new_data.content.tabs_list[0].data_type;
@ -63,7 +63,7 @@
});
},
tabs_click_event(index) {
let new_data = JSON.parse(JSON.stringify(this.value));
let new_data = JSON.parse(JSON.stringify(this.propValue));
new_data.content.theme = new_data.content.article_theme;
new_data.content.data_type = new_data.content.tabs_list[index].data_type;
new_data.content.category = new_data.content.tabs_list[index].category;

View File

@ -11,7 +11,7 @@
} from '@/common/js/common/common.js';
export default {
props: {
value: {
propValue: {
type: Object,
default: () => {
return {};
@ -27,20 +27,20 @@
created() {
this.init();
},
methods: {
init() {
const {
height
} = this.value.content;
const {
line_color,
common_style
} = this.value.style;
this.setData({
style: `height: ${height * 2 }rpx;background: ${line_color || 'transparent'};`,
style_container: common_styles_computer(common_style)
});
}
methods: {
init() {
const {
height
} = this.propValue.content;
const {
line_color,
common_style
} = this.propValue.style;
this.setData({
style: `height: ${height * 2 }rpx;background: ${line_color || 'transparent'};`,
style_container: common_styles_computer(common_style)
});
}
},
};
</script>

View File

@ -9,7 +9,7 @@
import { common_styles_computer } from '@/common/js/common/common.js';
export default {
props: {
value: {
propValue: {
type: Object,
default: () => ({}),
},
@ -25,8 +25,8 @@
},
methods: {
init() {
const new_content = this.value.content || {};
const new_style = this.value.style || {};
const new_content = this.propValue.content || {};
const new_style = this.propValue.style || {};
let border_content = `border-bottom-style: ${new_content?.styles || 'solid'};`;
let border_style = `border-bottom-width: ${new_style.line_width * 2 || 2}rpx; border-bottom-color: ${new_style.line_color || 'rgba(204, 204, 204, 1)'};`;
this.setData({

View File

@ -63,7 +63,7 @@
imageEmpty,
},
props: {
value: {
propValue: {
type: Object,
default: () => {
return {};
@ -105,8 +105,8 @@
},
created() {
this.setData({
form: this.value.content,
new_style: this.value.style,
form: this.propValue.content,
new_style: this.propValue.style,
});
this.init();
},

View File

@ -158,12 +158,12 @@
</template>
<script>
const app = getApp();
const app = getApp();
var tabbar_pages = app.globalData.app_tabbar_pages();
import { common_styles_computer, gradient_computer } from '@/common/js/common/common.js';
export default {
props: {
value: {
propValue: {
type: Object,
default: () => ({}),
},
@ -195,8 +195,8 @@
},
methods: {
init() {
const new_content = this.value.content || {};
const new_style = this.value.style || {};
const new_content = this.propValue.content || {};
const new_style = this.propValue.style || {};
const temp_theme = new_content.theme;
//
const new_background = gradient_computer(

View File

@ -3,16 +3,16 @@
<view class="wh-auto ht-auto pr">
<view v-for="item in form.custom_list" :key="item.id" class="main-content" :style="{'left': get_percentage_count(item.location.x, div_width) , 'top': get_percentage_count(item.location.y, div_height), 'width': get_percentage_count(item.com_data.com_width, div_width), 'height': get_percentage_count(item.com_data.com_height, div_height)}">
<template v-if="item.key == 'text'">
<model-text :key="item.com_data" :value="item.com_data" :source-list="form.data_source_content" @url_open="url_open"></model-text>
<model-text :key="item.com_data" :propValue="item.com_data" :sourceList="form.data_source_content" @url_open="url_open"></model-text>
</template>
<template v-else-if="item.key == 'img'">
<model-image :key="item.com_data" :value="item.com_data" :source-list="form.data_source_content" @url_open="url_open"></model-image>
<model-image :key="item.com_data" :propValue="item.com_data" :sourceList="form.data_source_content" @url_open="url_open"></model-image>
</template>
<template v-else-if="item.key == 'auxiliary-line'">
<model-lines :key="item.com_data" :value="item.com_data" :source-list="form.data_source_content"></model-lines>
<model-lines :key="item.com_data" :propValue="item.com_data" :sourceList="form.data_source_content"></model-lines>
</template>
<template v-else-if="item.key == 'icon'">
<model-icon :key="item.com_data" :value="item.com_data" :source-list="form.data_source_content" @url_open="url_open"></model-icon>
<model-icon :key="item.com_data" :propValue="item.com_data" :sourceList="form.data_source_content" @url_open="url_open"></model-icon>
</template>
</view>
</view>
@ -37,7 +37,7 @@
modelIcon
},
props: {
value: {
propValue: {
type: Object,
default: () => {
return {};
@ -63,8 +63,8 @@
},
created() {
this.setData({
form: this.value.content,
new_style: this.value.style,
form: this.propValue.content,
new_style: this.propValue.style,
});
this.init();
},

View File

@ -12,12 +12,12 @@
<view class="ma-0 wh-auto text-line-1" :style="item.data_style.subtitle_style">{{ item.data_content.subtitle || '' }}</view>
</view>
<view class="wh-auto ht-auto">
<magic-carousel :value="item" :content-img-radius="content_img_radius" :actived="form.style_actived" type="product" @carousel_change="carousel_change($event, index)"></magic-carousel>
<magic-carousel :propValue="item" :contentImgRadius="content_img_radius" :actived="form.style_actived" type="product" @carousel_change="carousel_change($event, index)"></magic-carousel>
</view>
</view>
</template>
<template v-else>
<magic-carousel :value="item" :content-img-radius="content_img_radius" type="img" :actived="form.style_actived" @carousel_change="carousel_change($event, index)"></magic-carousel>
<magic-carousel :propValue="item" :contentImgRadius="content_img_radius" type="img" :actived="form.style_actived" @carousel_change="carousel_change($event, index)"></magic-carousel>
</template>
<view v-if="item.data_style.is_show == '1' && item.data_content.list.length > 1" :class="{'dot-center': item.data_style.indicator_location == 'center', 'dot-right': item.data_style.indicator_location == 'flex-end' }" class="dot flex-row pa" :style="{'bottom': item.data_style.indicator_bottom * 2 +'rpx'}">
<template v-if="item.data_style.indicator_style == 'num'">
@ -41,12 +41,12 @@
<view class="ma-0 wh-auto text-line-1" :style="item.data_style.subtitle_style">{{ item.data_content.subtitle || '' }}</view>
</view>
<view class="wh-auto ht-auto">
<magic-carousel :value="item" :content-img-radius="content_img_radius" type="product" :actived="form.style_actived" @carousel_change="carousel_change($event, index)"></magic-carousel>
<magic-carousel :propValue="item" :contentImgRadius="content_img_radius" type="product" :actived="form.style_actived" @carousel_change="carousel_change($event, index)"></magic-carousel>
</view>
</view>
</template>
<template v-else>
<magic-carousel :value="item" :content-img-radius="content_img_radius" type="img" :actived="form.style_actived" @carousel_change="carousel_change($event, index)"></magic-carousel>
<magic-carousel :propValue="item" :contentImgRadius="content_img_radius" type="img" :actived="form.style_actived" @carousel_change="carousel_change($event, index)"></magic-carousel>
</template>
<view v-if="item.data_style.is_show == '1' && item.data_content.list.length > 1" :class="{'dot-center': item.data_style.indicator_location == 'center', 'dot-right': item.data_style.indicator_location == 'flex-end' }" class="dot flex-row pa" :style="{'bottom': item.data_style.indicator_bottom * 2 +'rpx'}">
<template v-if="item.data_style.indicator_style == 'num'">
@ -75,7 +75,7 @@
magicCarousel,
},
props: {
value: {
propValue: {
type: Object,
default: () => ({}),
},
@ -148,8 +148,8 @@
},
created() {
this.setData({
form: this.value.content,
new_style: this.value.style,
form: this.propValue.content,
new_style: this.propValue.style,
});
this.init();
},

View File

@ -2,40 +2,40 @@
<view class="ht-auto min-ht">
<!-- 头部小程序兼容 -->
<view class="pr header-content">
<componentDiyHeader :key="key" :value="header_data.com_data"></componentDiyHeader>
<componentDiyHeader :key="key" :propValue="header_data.com_data"></componentDiyHeader>
</view>
<view class="pr" :style="diy_content_style">
<view v-for="(item, index) in tabs_data" :key="index">
<componentDiyTabs v-if="item.key == 'tabs'" :value="item.com_data" :key="key" @tabs-click="tabs_click_event"></componentDiyTabs>
<componentDiyTabsCarousel v-else-if="item.key == 'tabs-carousel'" :value="item.com_data" :key="key + index" @tabs-click="tabs_click_event"></componentDiyTabsCarousel>
<componentDiyTabs v-if="item.key == 'tabs'" :propValue="item.com_data" :key="key" @tabs-click="tabs_click_event"></componentDiyTabs>
<componentDiyTabsCarousel v-else-if="item.key == 'tabs-carousel'" :propValue="item.com_data" :key="key + index" @tabs-click="tabs_click_event"></componentDiyTabsCarousel>
</view>
<view v-if="is_tabs_type" class="diy-content">
<template v-if="diy_data.length > 0">
<view v-for="(item, index) in diy_data" :key="index" :style="{ 'margin-top': -(item.com_data.style.common_style.floating_up * 2 || 0) + 'rpx' }">
<!-- 基础组件 -->
<componentDiySearch v-if="item.key == 'search'" :value="item.com_data"></componentDiySearch>
<componentDiyCarousel v-else-if="item.key == 'carousel'" :value="item.com_data"></componentDiyCarousel>
<componentDiyNavGroup v-else-if="item.key == 'nav-group'" :value="item.com_data"></componentDiyNavGroup>
<componentDiyUserInfo v-else-if="item.key == 'user-info'" :value="item.com_data"></componentDiyUserInfo>
<componentDiyNotice v-else-if="item.key == 'notice'" :value="item.com_data"></componentDiyNotice>
<componentDiyVideo v-else-if="item.key == 'video'" :value="item.com_data"></componentDiyVideo>
<componentDiyArticleList v-else-if="item.key == 'article-list'" :value="item.com_data"></componentDiyArticleList>
<componentDiyArticleTabs v-else-if="item.key == 'article-tabs'" :value="item.com_data"></componentDiyArticleTabs>
<componentDiyGoodsTabs v-else-if="item.key == 'goods-tabs'" :value="item.com_data"></componentDiyGoodsTabs>
<componentDiyGoodsList v-else-if="item.key == 'goods-list'" :value="item.com_data"></componentDiyGoodsList>
<componentDiyDataMagic v-else-if="item.key == 'data-magic'" :value="item.com_data"></componentDiyDataMagic>
<componentDiyCustom v-else-if="item.key == 'custom'" :value="item.com_data"></componentDiyCustom>
<componentDiyImgMagic v-else-if="item.key == 'img-magic'" :value="item.com_data"></componentDiyImgMagic>
<componentDiyHotZone v-else-if="item.key == 'hot-zone'" :value="item.com_data"></componentDiyHotZone>
<componentDiySeckill v-else-if="item.key == 'seckill'" :value="item.com_data"></componentDiySeckill>
<componentDiySearch v-if="item.key == 'search'" :propValue="item.com_data"></componentDiySearch>
<componentDiyCarousel v-else-if="item.key == 'carousel'" :propValue="item.com_data"></componentDiyCarousel>
<componentDiyNavGroup v-else-if="item.key == 'nav-group'" :propValue="item.com_data"></componentDiyNavGroup>
<componentDiyUserInfo v-else-if="item.key == 'user-info'" :propValue="item.com_data"></componentDiyUserInfo>
<componentDiyNotice v-else-if="item.key == 'notice'" :propValue="item.com_data"></componentDiyNotice>
<componentDiyVideo v-else-if="item.key == 'video'" :propValue="item.com_data"></componentDiyVideo>
<componentDiyArticleList v-else-if="item.key == 'article-list'" :propValue="item.com_data"></componentDiyArticleList>
<componentDiyArticleTabs v-else-if="item.key == 'article-tabs'" :propValue="item.com_data"></componentDiyArticleTabs>
<componentDiyGoodsTabs v-else-if="item.key == 'goods-tabs'" :propValue="item.com_data"></componentDiyGoodsTabs>
<componentDiyGoodsList v-else-if="item.key == 'goods-list'" :propValue="item.com_data"></componentDiyGoodsList>
<componentDiyDataMagic v-else-if="item.key == 'data-magic'" :propValue="item.com_data"></componentDiyDataMagic>
<componentDiyCustom v-else-if="item.key == 'custom'" :propValue="item.com_data"></componentDiyCustom>
<componentDiyImgMagic v-else-if="item.key == 'img-magic'" :propValue="item.com_data"></componentDiyImgMagic>
<componentDiyHotZone v-else-if="item.key == 'hot-zone'" :propValue="item.com_data"></componentDiyHotZone>
<componentDiySeckill v-else-if="item.key == 'seckill'" :propValue="item.com_data"></componentDiySeckill>
<!-- 插件 -->
<componentDiyCoupon v-else-if="item.key == 'coupon'" :value="item.com_data"></componentDiyCoupon>
<componentDiyCoupon v-else-if="item.key == 'coupon'" :propValue="item.com_data"></componentDiyCoupon>
<!-- 工具组件 -->
<componentDiyFloatWindow v-else-if="item.key == 'float-window'" :value="item.com_data"></componentDiyFloatWindow>
<componentDiyTitle v-else-if="item.key == 'text-title'" :value="item.com_data"></componentDiyTitle>
<componentDiyAuxiliaryLine v-else-if="item.key == 'row-line'" :value="item.com_data"></componentDiyAuxiliaryLine>
<componentDiyRichText v-else-if="item.key == 'rich-text'" :value="item.com_data"></componentDiyRichText>
<componentDiyAuxiliaryBlank v-else-if="item.key == 'auxiliary-blank'" :value="item.com_data"></componentDiyAuxiliaryBlank>
<componentDiyFloatWindow v-else-if="item.key == 'float-window'" :propValue="item.com_data"></componentDiyFloatWindow>
<componentDiyTitle v-else-if="item.key == 'text-title'" :propValue="item.com_data"></componentDiyTitle>
<componentDiyAuxiliaryLine v-else-if="item.key == 'row-line'" :propValue="item.com_data"></componentDiyAuxiliaryLine>
<componentDiyRichText v-else-if="item.key == 'rich-text'" :propValue="item.com_data"></componentDiyRichText>
<componentDiyAuxiliaryBlank v-else-if="item.key == 'auxiliary-blank'" :propValue="item.com_data"></componentDiyAuxiliaryBlank>
</view>
</template>
</view>

View File

@ -21,7 +21,7 @@
imageEmpty,
},
props: {
value: {
propValue: {
type: Object,
default: () => {
return {};
@ -38,14 +38,14 @@
},
created() {
this.setData({
form: this.value.content,
new_style: this.value.style,
form: this.propValue.content,
new_style: this.propValue.style,
});
this.init();
},
methods: {
init() {
const { float_style, float_style_color, display_location, offset_number } = this.value.style;
const { float_style, float_style_color, display_location, offset_number } = this.propValue.style;
let location = `right: 20rpx;`;
if (display_location == 'left') {
location = `left: 20rpx;`;

View File

@ -56,9 +56,9 @@
</view>
<view v-if="form.is_shop_show == '1'" class="pr" :data-index="index" @tap.stop="goods_button_event">
<block v-if="form.shop_type == 'text'">
<view class="plr-11 ptb-3 round" :style="button_style + ('color:' + new_style.shop_button_text_color)">{{ form.shop_button_text }}</view>
<view class="plr-11 padding-vertical-xs round" :style="button_style + ('color:' + new_style.shop_button_text_color)">{{ form.shop_button_text }}</view>
</block>
<view v-else class="round plr-6 ptb-5" :style="button_gradient">
<view v-else class="round padding-horizontal-sm ptb-5" :style="button_gradient">
<iconfont :name="'icon-' + (!isEmpty(form.shop_button_icon_class) ? form.shop_button_icon_class : 'cart')" :color="new_style.shop_icon_color" :size="new_style.shop_icon_size * 2 + 'rpx'"></iconfont>
</view>
<view v-if="form.shop_button_effect == '1'" class="cart-badge-icon pa badge-style">
@ -86,9 +86,9 @@
</view>
<view v-if="form.is_shop_show == '1'" :data-index="index" @tap.stop="goods_button_event">
<block v-if="form.shop_type == 'text'">
<view class="plr-11 ptb-3 round" :style="button_style + ('color:' + new_style.shop_button_text_color)">{{ form.shop_button_text }}</view>
<view class="plr-11 padding-vertical-xs round" :style="button_style + ('color:' + new_style.shop_button_text_color)">{{ form.shop_button_text }}</view>
</block>
<view v-else class="round plr-6 ptb-5" :style="button_gradient">
<view v-else class="round padding-horizontal-sm ptb-5" :style="button_gradient">
<iconfont :name="'icon-' + (!isEmpty(form.shop_button_icon_class) ? form.shop_button_icon_class : 'cart')" :color="new_style.shop_icon_color" :size="new_style.shop_icon_size * 2 + 'rpx'"></iconfont>
</view>
<view v-if="form.shop_button_effect == '1'" class="cart-badge-icon pa badge-style">
@ -138,9 +138,9 @@
</view>
<view v-if="form.is_shop_show == '1'" :data-index="index1" :data-split-index="index" @tap.stop="goods_button_event">
<block v-if="form.shop_type == 'text'">
<view class="plr-11 ptb-3 round" :style="button_style + ('color:' + new_style.shop_button_text_color)">{{ form.shop_button_text }}</view>
<view class="plr-11 padding-vertical-xs round" :style="button_style + ('color:' + new_style.shop_button_text_color)">{{ form.shop_button_text }}</view>
</block>
<view v-else class="round plr-6 ptb-5" :style="button_gradient">
<view v-else class="round padding-horizontal-sm ptb-5" :style="button_gradient">
<iconfont :name="'icon-' + (!isEmpty(form.shop_button_icon_class) ? form.shop_button_icon_class : 'cart')" :color="new_style.shop_icon_color" :size="new_style.shop_icon_size * 2 + 'rpx'"></iconfont>
</view>
<view v-if="form.shop_button_effect == '1'" class="cart-badge-icon pa badge-style">
@ -177,7 +177,7 @@
componentCartParaCurve,
},
props: {
value: {
propValue: {
type: Object,
default: () => {
return {};
@ -227,8 +227,8 @@
},
created() {
this.setData({
form: this.value.content,
new_style: this.value.style,
form: this.propValue.content,
new_style: this.propValue.style,
});
this.init();
},
@ -513,33 +513,6 @@
min-height: 208rpx;
height: 100%;
}
.plr-11 {
padding-left: 22rpx;
padding-right: 22rpx;
}
.ptb-3 {
padding-top: 6rpx;
padding-bottom: 6rpx;
}
.plr-6 {
padding-left: 12rpx;
padding-right: 12rpx;
}
.ptb-5 {
padding-top: 10rpx;
padding-bottom: 10rpx;
}
.ptb-15 {
padding-top: 30rpx;
padding-bottom: 30rpx;
}
.mlr-10 {
margin-left: 20rpx;
margin-right: 20rpx;
}
.gap-20 {
gap: 40rpx;
}
.original-price-left {
width: 20rpx;
height: 28rpx;

View File

@ -1,8 +1,8 @@
<template>
<view class="overflow-unset" :style="style_container">
<componentDiyModulesTabsView :value="goods_tabs" :is-top="top_up == '1'" @tabs-click="tabs_click_event"></componentDiyModulesTabsView>
<componentDiyModulesTabsView :propValue="goods_tabs" :is-top="top_up == '1'" @tabs-click="tabs_click_event"></componentDiyModulesTabsView>
<view class="padding-top oh">
<componentGoodsList :key="key" :value="goods_tabs" :is-common-style="false"></componentGoodsList>
<componentGoodsList :key="key" :propValue="goods_tabs" :is-common-style="false"></componentGoodsList>
</view>
</view>
</template>
@ -17,7 +17,7 @@
componentGoodsList,
},
props: {
value: {
propValue: {
type: Object,
default: () => {
return {};
@ -37,9 +37,9 @@
},
methods: {
init() {
const new_content = this.value.content || {};
const new_style = this.value.style || {};
let new_data = JSON.parse(JSON.stringify(this.value));
const new_content = this.propValue.content || {};
const new_style = this.propValue.style || {};
let new_data = JSON.parse(JSON.stringify(this.propValue));
this.top_up = new_content.tabs_top_up;
//
new_data.content.data_type = new_data.content.tabs_list[0].data_type;
@ -56,7 +56,7 @@
});
},
tabs_click_event(index) {
let new_data = JSON.parse(JSON.stringify(this.value));
let new_data = JSON.parse(JSON.stringify(this.propValue));
new_data.content.data_type = new_data.content.tabs_list[index].data_type;
new_data.content.category = new_data.content.tabs_list[index].category;
new_data.content.brand = new_data.content.tabs_list[index].brand;

View File

@ -58,7 +58,7 @@
// #endif
export default {
props: {
value: {
propValue: {
type: Object,
default: () => ({}),
},
@ -88,15 +88,15 @@
};
},
created() {
if ((this.value || null) !== null) {
if ((this.propValue || null) !== null) {
this.init();
}
},
methods: {
isEmpty,
init() {
const new_content = this.value.content || {};
const new_style = this.value.style || {};
const new_content = this.propValue.content || {};
const new_style = this.propValue.style || {};
let new_roll_style = '';
const { header_background_img, header_background_img_style, header_background_color_list, header_background_direction, header_background_type } = new_style;
if (header_background_type === 'color_image') {
@ -116,7 +116,7 @@
menuButtonInfo = `max-width:calc(100% - ${custom.width + 30}px);`;
// #endif
this.setData({
form: this.value,
form: this.propValue,
position: new_style.up_slide_display == '1' ? 'position:fixed;' : 'position:relative;',
roll_style: new_roll_style,
text_style: `font-weight:${new_style.header_background_title_typeface}; font-size: ${new_style.header_background_title_size * 2}rpx; color: ${new_style.header_background_title_color};`,

View File

@ -13,7 +13,7 @@
import { common_styles_computer } from '@/common/js/common/common.js';
export default {
props: {
value: {
propValue: {
type: Object,
default: () => ({}),
},
@ -40,8 +40,8 @@
},
methods: {
init() {
const new_content = this.value.content || {};
const new_style = this.value.style || {};
const new_content = this.propValue.content || {};
const new_style = this.propValue.style || {};
this.setData({
img: new_content.img[0].url,
img_width: new_content.hot.img_width || 1,

View File

@ -34,7 +34,7 @@
// var height = app.globalData.window_height_handle(system);
export default {
props: {
value: {
propValue: {
type: Object,
default: () => ({}),
},
@ -60,8 +60,8 @@
},
methods: {
init() {
const new_content = this.value.content || {};
const new_style = this.value.style || {};
const new_content = this.propValue.content || {};
const new_style = this.propValue.style || {};
//
const outer_spacing = `calc(100% + ${new_style.image_spacing * 2}rpx)`;
const outer_sx = `-${new_style.image_spacing}rpx`;
@ -69,7 +69,7 @@
const spacing = `${new_style.image_spacing}rpx`;
const density = 4;
this.setData({
form: this.value.content,
form: this.propValue.content,
outer_style: `width:${outer_spacing};height:${outer_spacing};margin:${outer_sx}`,
img_spacing: `padding:${spacing}`,
content_img_radius: radius_computer(new_style),

View File

@ -8,7 +8,7 @@
export default {
props: {
value: {
propValue: {
type: Object,
default: () => {
return {};
@ -30,7 +30,7 @@
},
created() {
this.setData({
form: this.value,
form: this.propValue,
});
this.init();
},

View File

@ -11,7 +11,7 @@
imageEmpty,
},
props: {
value: {
propValue: {
type: Object,
default: () => {
return {};
@ -35,7 +35,7 @@
},
created() {
this.setData({
form: this.value,
form: this.propValue,
});
this.init();
},

View File

@ -4,7 +4,7 @@
<script>
export default {
props: {
value: {
propValue: {
type: Object,
default: () => {
return {};
@ -20,7 +20,7 @@
},
created() {
this.setData({
form: this.value,
form: this.propValue,
});
this.init();
},

View File

@ -15,7 +15,7 @@
export default {
props: {
value: {
propValue: {
type: Object,
default: () => {
return {};
@ -39,7 +39,7 @@
},
created() {
this.setData({
form: this.value,
form: this.propValue,
});
this.init();
},

View File

@ -24,7 +24,7 @@
productListShow,
},
props: {
value: {
propValue: {
type: Object,
default: () => ({}),
},

View File

@ -96,7 +96,7 @@
imageEmpty,
},
props: {
value: {
propValue: {
type: Array,
default: () => [],
},

View File

@ -52,7 +52,7 @@
// #endif
export default {
props: {
value: {
propValue: {
type: Object,
default: () => {},
},
@ -111,8 +111,8 @@
methods: {
isEmpty,
init() {
const new_content = this.value.content || {};
const new_style = this.value.style || {};
const new_content = this.propValue.content || {};
const new_style = this.propValue.style || {};
const new_tabs_check = this.tabs_check_computer(new_style);
const new_icon = {
more_icon_class: new_style.more_icon_class,

View File

@ -35,7 +35,7 @@
imageEmpty,
},
props: {
value: {
propValue: {
type: Object,
default: () => {
return {};
@ -58,8 +58,8 @@
},
created() {
this.setData({
form: this.value.content,
new_style: this.value.style,
form: this.propValue.content,
new_style: this.propValue.style,
});
},
mounted() {

View File

@ -59,7 +59,7 @@
import { background_computer, common_styles_computer, get_math, gradient_computer, gradient_handle, radius_computer } from '@/common/js/common/common.js';
export default {
props: {
value: {
propValue: {
type: Object,
default: () => ({}),
},
@ -99,8 +99,8 @@
},
methods: {
init() {
const new_content = this.value.content || {};
const new_style = this.value.style || {};
const new_content = this.propValue.content || {};
const new_style = this.propValue.style || {};
//
const { container_color_list, container_direction, container_background_img_style, container_background_img } = new_style;
const temp_obj = {

View File

@ -9,7 +9,7 @@
import { common_styles_computer } from '@/common/js/common/common.js';
export default {
props: {
value: {
propValue: {
type: Object,
default: () => ({}),
},
@ -25,8 +25,8 @@
},
methods: {
init() {
const new_content = this.value.content || {};
const new_style = this.value.style || {};
const new_content = this.propValue.content || {};
const new_style = this.propValue.style || {};
this.setData({
content: new_content.html,
style_container: common_styles_computer(new_style.common_style),

View File

@ -37,7 +37,7 @@
import { background_computer, common_styles_computer, gradient_computer, radius_computer, isEmpty } from '@/common/js/common/common.js';
export default {
props: {
value: {
propValue: {
type: Object,
default: () => {
return {};
@ -61,8 +61,8 @@
},
created() {
this.setData({
form: this.value.content,
new_style: this.value.style,
form: this.propValue.content,
new_style: this.propValue.style,
});
this.init();
},

View File

@ -7,7 +7,7 @@
<image-empty v-if="form.title_type == 'image'" :image-src="form.title_src[0]" img_fit="heightFix" error-style="width:42rpx; height: 20rpx;"></image-empty>
<text v-else :style="{ color: new_style.title_color, 'font-size': new_style.title_size * 2 + 'rpx', 'line-height': '42rpx', 'font-weight': 600 }">{{ form.title_text }}</text>
</view>
<view v-if="form.theme == '1'" class="plr-6 cr-white">|</view>
<view v-if="form.theme == '1'" class="padding-horizontal-sm cr-white">|</view>
<view v-if="intervalId != undefined" class="flex-row align-c gap-4">
<text class="text-size-xss" :style="{ color: new_style.end_text_color }">{{ seckill_time.time_first_text }}</text>
<view class="flex-row gap-3 jc-c align-c" :style="[form.theme == '4' ? time_bg + 'padding: 6rpx 8rpx;border-radius: 22rpx;' : '']">
@ -84,9 +84,9 @@
</view>
<view v-if="form.is_shop_show == '1'">
<template v-if="form.shop_type == 'text'">
<view class="plr-11 ptb-3 round cr-white" :style="button_style + 'color:' + new_style.shop_button_text_color">{{ form.shop_button_text }}</view>
<view class="plr-11 padding-vertical-xs round cr-white" :style="button_style + 'color:' + new_style.shop_button_text_color">{{ form.shop_button_text }}</view>
</template>
<view v-else class="round plr-6 ptb-5" :styles="button_gradient">
<view v-else class="round padding-horizontal-sm ptb-5" :styles="button_gradient">
<iconfont :name="'icon-' + (!isEmpty(form.shop_button_icon_class) ? form.shop_button_icon_class : 'cart')" :color="new_style.shop_icon_color" :size="new_style.shop_icon_size * 2 + 'rpx'"></iconfont>
</view>
</view>
@ -147,9 +147,9 @@
</view>
<view v-if="form.is_shop_show == '1'">
<template v-if="form.shop_type == 'text'">
<view class="plr-11 ptb-3 round cr-white" :style="button_style + 'color:' + new_style.shop_button_text_color">{{ form.shop_button_text }}</view>
<view class="plr-11 padding-vertical-xs round cr-white" :style="button_style + 'color:' + new_style.shop_button_text_color">{{ form.shop_button_text }}</view>
</template>
<view v-else class="round plr-6 ptb-5" :styles="button_gradient">
<view v-else class="round padding-horizontal-sm ptb-5" :styles="button_gradient">
<iconfont :name="'icon-' + (!isEmpty(form.shop_button_icon_class) ? form.shop_button_icon_class : 'cart')" :color="new_style.shop_icon_color" :size="new_style.shop_icon_size * 2 + 'rpx'"></iconfont>
</view>
</view>
@ -172,7 +172,7 @@
imageEmpty,
},
props: {
value: {
propValue: {
type: Object,
default: () => {
return {};
@ -232,8 +232,8 @@
},
created() {
this.setData({
form: this.value.content,
new_style: this.value.style,
form: this.propValue.content,
new_style: this.propValue.style,
});
this.init();
},
@ -548,42 +548,9 @@
.original-price {
text-decoration-line: line-through;
}
.plr-11 {
padding-left: 22rpx;
padding-right: 22rpx;
}
.ptb-3 {
padding-top: 6rpx;
padding-bottom: 6rpx;
}
.plr-6 {
padding-left: 12rpx;
padding-right: 12rpx;
}
.ptb-5 {
padding-top: 10rpx;
padding-bottom: 10rpx;
}
.ptb-15 {
padding-top: 30rpx;
padding-bottom: 30rpx;
}
.mlr-10 {
margin-left: 20rpx;
margin-right: 20rpx;
}
.pr-4 {
margin-right: 8rpx;
}
.size-11 {
font-size: 22rpx;
}
.gap-20 {
gap: 40rpx;
}
.gap-3 {
gap: 6rpx;
}
.corner-marker {
position: absolute;
padding: 2rpx 20rpx;

View File

@ -15,7 +15,7 @@
componentDiycarousel
},
props: {
value: {
propValue: {
type: Object,
default: () => {
return {};
@ -44,7 +44,7 @@
},
methods: {
init() {
const new_style = this.value.style || {};
const new_style = this.propValue.style || {};
this.setData({
style_container: `${ common_styles_computer(new_style.common_style)};gap:${new_style.data_spacing * 2}rpx`,
spacing_common_style: {

View File

@ -27,7 +27,7 @@
// #endif
export default {
props: {
value: {
propValue: {
type: Object,
default: () => ({}),
},
@ -68,9 +68,9 @@
},
methods: {
init() {
const new_content = this.value.content || {};
const new_style = this.value.style || {};
let new_tabs_data = this.value;
const new_content = this.propValue.content || {};
const new_style = this.propValue.style || {};
let new_tabs_data = this.propValue;
new_tabs_data.content.tabs_list.unshift(new_tabs_data.content.home_data);
this.setData({
tabs_data: new_tabs_data,

View File

@ -1,15 +1,26 @@
<template>
<view :style="style_container">
<view class="pr flex-row" :class="title_center">
<view class="z-i pr-15" :style="title_style" @click="url_open_event(form.title_link)">{{ form.title || '' }}</view>
<view class="flex-row gap-10 align-c right-0 pa">
<template v-if="form.keyword_show == '1'">
<view v-for="item in keyword_list" :key="item.id" :style="keyword_style" @click="url_open_event(item.link)">
{{ item.title }}
</view>
</template>
<view v-if="form.right_show == '1'" class="nowrap" :style="right_style" @click="url_open_event(form.right_link)">{{ form.right_title }}<iconfont name="icon-arrow-right" :size="right_size * 2 + 'rpx'" :color="new_style.right_color || '#999'"></iconfont> </view>
<view class="flex-col gap-10">
<view class="pr flex-row" :class="title_center">
<view class="z-i flex-row align-c gap-10 title-img">
<template v-if="!isEmpty(form.img_src)">
<image-empty v-model="form.img_src[0]"></image-empty>
</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"></iconfont>
</template>
<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'">
<view v-for="item in keyword_list" :key="item.id" :style="keyword_style">
{{ item.title }}
</view>
</template>
<view v-if="form.right_show == '1'" class="nowrap" :style="right_style">{{ form.right_title }}<iconfont name="icon-arrow-right" :color="new_style.right_color || '#999'"></iconfont></view>
</view>
</view>
<view v-if="!isEmpty(form.subtitle)" class="break" :style="subtitle_style">{{ form.subtitle }}</view>
</view>
</view>
</template>
@ -19,7 +30,7 @@
import { common_styles_computer, is_obj_empty } from '@/common/js/common/common.js';
export default {
props: {
value: {
propValue: {
type: Object,
default: () => {
return {};
@ -40,8 +51,8 @@
},
created() {
this.setData({
form: this.value.content,
new_style: this.value.style,
form: this.propValue.content,
new_style: this.propValue.style,
});
this.init();
},
@ -70,14 +81,25 @@
} else if (title_weight == '500') {
common_styles += `font-weight: 500`;
}
this.setData({
keyword_style: `color:${keyword_color}; font-size: ${keyword_size * 2}rpx;`, //
right_size: right_size * 2 + 'rpx', //
right_style: `color:${right_color}; font-size: ${right_size * 2}rpx;`,
title_style: `color:${title_color}; font-size: ${title_size * 2}rpx; ${common_styles}`,
subtitle_style: this.get_subtitle_style(), //
style_container: common_styles_computer(common_style), //
});
},
get_subtitle_style() {
let common_styles = '';
if (new_style.value.subtitle_weight == 'italic') {
common_styles += `font-style: italic`;
} else if (new_style.value.subtitle_weight == '500') {
common_styles += `font-weight: 500`;
}
return `color:${new_style.value.subtitle_color}; font-size: ${new_style.value.subtitle_size * 2}rpx; ${common_styles}`;
},
url_open_event(link) {
if (!is_obj_empty(link)) {
app.globalData.url_open(link.page);
@ -92,4 +114,13 @@
top: 50%;
transform: translateY(-50%);
}
.break {
word-break: break-word;
overflow-wrap: break-word;
word-wrap: break-word;
}
.title-img {
max-width: 6rem;
max-height: 3rem;
}
</style>

View File

@ -34,7 +34,7 @@
import { common_styles_computer, gradient_computer } from '@/common/js/common/common.js';
export default {
props: {
value: {
propValue: {
type: Object,
default: () => ({}),
},
@ -82,8 +82,8 @@
},
methods: {
init() {
const new_content = this.value.content || {};
const new_style = this.value.style || {};
const new_content = this.propValue.content || {};
const new_style = this.propValue.style || {};
const temp_base_data = {
//
user_avatar_size: new_style.user_avatar_size,

View File

@ -11,7 +11,7 @@
import { common_styles_computer } from '@/common/js/common/common.js';
export default {
props: {
value: {
propValue: {
type: Object,
default: () => ({}),
},
@ -29,8 +29,8 @@
},
methods: {
init() {
const new_content = this.value.content || {};
const new_style = this.value.style || {};
const new_content = this.propValue.content || {};
const new_style = this.propValue.style || {};
this.setData({
video_img: new_content.video_img[0].url || '',
video: new_content.video[0].url || '',