修改组件传参数
parent
35a6a514fe
commit
e9b03b307f
|
|
@ -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 字体大小
|
||||
*/
|
||||
|
|
@ -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:
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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({
|
||||
|
|
|
|||
|
|
@ -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();
|
||||
},
|
||||
|
|
|
|||
|
|
@ -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(
|
||||
|
|
|
|||
|
|
@ -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();
|
||||
},
|
||||
|
|
|
|||
|
|
@ -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();
|
||||
},
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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;`;
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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};`,
|
||||
|
|
|
|||
|
|
@ -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,
|
||||
|
|
|
|||
|
|
@ -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),
|
||||
|
|
|
|||
|
|
@ -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();
|
||||
},
|
||||
|
|
|
|||
|
|
@ -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();
|
||||
},
|
||||
|
|
|
|||
|
|
@ -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();
|
||||
},
|
||||
|
|
|
|||
|
|
@ -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();
|
||||
},
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
productListShow,
|
||||
},
|
||||
props: {
|
||||
value: {
|
||||
propValue: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
|
|
|
|||
|
|
@ -96,7 +96,7 @@
|
|||
imageEmpty,
|
||||
},
|
||||
props: {
|
||||
value: {
|
||||
propValue: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
|
|
|
|||
|
|
@ -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,
|
||||
|
|
|
|||
|
|
@ -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() {
|
||||
|
|
|
|||
|
|
@ -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 = {
|
||||
|
|
|
|||
|
|
@ -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),
|
||||
|
|
|
|||
|
|
@ -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();
|
||||
},
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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: {
|
||||
|
|
|
|||
|
|
@ -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,
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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,
|
||||
|
|
|
|||
|
|
@ -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 || '',
|
||||
|
|
|
|||
Loading…
Reference in New Issue