1.diy---置顶开发
parent
834fa81488
commit
6f436bb6ca
|
|
@ -1,8 +1,8 @@
|
|||
<template>
|
||||
<!-- 文章列表 -->
|
||||
<view class="ou" :style="style_container">
|
||||
<componentDiyModulesTabsView :propValue="article_tabs" :propIsTop="top_up == '1'" :propTop="propStickyTop" :propStyle="tabs_style" @tabs-click="tabs_click_event"></componentDiyModulesTabsView>
|
||||
<view class="padding-top oh">
|
||||
<componentDiyModulesTabsView :propValue="article_tabs" :propIsTop="top_up == '1'" :propTop="propStickyTop" :propStyle="tabs_style + 'padding-bottom:24rpx;'" @tabs-click="tabs_click_event"></componentDiyModulesTabsView>
|
||||
<view class="oh">
|
||||
<componentDiyArticleList v-if="hackReset" :propValue="article_tabs" :propIsCommonStyle="false"></componentDiyArticleList>
|
||||
</view>
|
||||
</view>
|
||||
|
|
|
|||
|
|
@ -5,11 +5,11 @@
|
|||
<componentDiyHeader v-if="hackReset" :propValue="header_data.com_data"></componentDiyHeader>
|
||||
</view>
|
||||
<view class="content flex-col" :style="'padding-top:' + header_top">
|
||||
<view v-for="(item, index) in tabs_data" :key="index">
|
||||
<componentDiyTabs v-if="item.key == 'tabs'" :propValue="item.com_data" :propStickyTop="sticky_top" @tabs-click="tabs_click_event"></componentDiyTabs>
|
||||
<componentDiyTabsCarousel v-else-if="item.key == 'tabs-carousel'" :propValue="item.com_data" @tabs-click="tabs_click_event"></componentDiyTabsCarousel>
|
||||
</view>
|
||||
<block v-if="is_tabs_type">
|
||||
<template v-for="(item, index) in tabs_data">
|
||||
<componentDiyTabs v-if="item.key == 'tabs'" :key="index" :propValue="item.com_data" :propStickyTop="sticky_top" @tabs-click="tabs_click_event"></componentDiyTabs>
|
||||
<componentDiyTabsCarousel v-else-if="item.key == 'tabs-carousel'" :propValue="item.com_data" :propStickyTop="sticky_top" @tabs-click="tabs_click_event"></componentDiyTabsCarousel>
|
||||
</template>
|
||||
<template v-if="is_tabs_type">
|
||||
<template v-if="diy_data.length > 0">
|
||||
<view v-for="(item, index) in diy_data" :key="index" :style="{ 'margin-top': ['float-window'].includes(item.key) ? '0rpx' : -(item.com_data.style.common_style.floating_up * 2 || 0) + 'rpx' }">
|
||||
<!-- 基础组件 -->
|
||||
|
|
@ -20,8 +20,10 @@
|
|||
<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" :propStickyTop="sticky_top"></componentDiyArticleTabs>
|
||||
<componentDiyGoodsTabs v-else-if="item.key == 'goods-tabs'" :propValue="item.com_data" :propStickyTop="sticky_top"></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>
|
||||
|
|
@ -38,8 +40,8 @@
|
|||
<componentDiyAuxiliaryBlank v-else-if="item.key == 'auxiliary-blank'" :propValue="item.com_data"></componentDiyAuxiliaryBlank>
|
||||
</view>
|
||||
</template>
|
||||
</block>
|
||||
<block v-else>
|
||||
</template>
|
||||
<template v-else>
|
||||
<!-- goods九宫格数据 -->
|
||||
<!-- 列表 -->
|
||||
<scroll-view :scroll-y="true" class="scroll-box" @scrolltolower="scroll_lower" lower-threshold="60">
|
||||
|
|
@ -53,7 +55,7 @@
|
|||
<!-- 结尾 -->
|
||||
<component-bottom-line :propStatus="goods_bottom_line_status"></component-bottom-line>
|
||||
</scroll-view>
|
||||
</block>
|
||||
</template>
|
||||
</view>
|
||||
<view v-if="is_show_footer == 1" class="footer">
|
||||
<componentDiyFooter v-if="hackReset" :propValue="footer_data.com_data"></componentDiyFooter>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<view class="ou" :style="style_container">
|
||||
<componentDiyModulesTabsView :propValue="goods_tabs" :propIsTop="top_up == '1'" :propTop="propStickyTop" :propStyle="tabs_style" @tabs-click="tabs_click_event"></componentDiyModulesTabsView>
|
||||
<view class="padding-top oh">
|
||||
<componentDiyModulesTabsView :propValue="goods_tabs" :propIsTop="top_up == '1'" :propTop="propStickyTop" :propStyle="tabs_style + 'padding-bottom:24rpx;'" @tabs-click="tabs_click_event"></componentDiyModulesTabsView>
|
||||
<view class="oh">
|
||||
<componentGoodsList v-if="hackReset" :propValue="goods_tabs" :propIsCommonStyle="false"></componentGoodsList>
|
||||
</view>
|
||||
</view>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<!-- 文章列表 66rpx是自定义顶部导航栏的高度-->
|
||||
<uv-sticky :disabled="!propIsTop" :offset-top="propTop" zIndex="101" customNavHeight="66rpx">
|
||||
<uv-sticky :disabled="!propIsTop" :offset-top="propTop" zIndex="101" customNavHeight="66rpx" bgColor="#fff">
|
||||
<view class="flex-row gap-10 jc-sb align-c" :style="propStyle">
|
||||
<view class="tabs flex-1 flex-width">
|
||||
<scroll-view :scroll-x="true" :show-scrollbar="false" :scroll-with-animation="true" :scroll-into-view="'one-nav-item-' + active_index" class="wh-auto">
|
||||
|
|
|
|||
|
|
@ -1,17 +1,17 @@
|
|||
<template>
|
||||
<div class="flex-col oh" :style="style_container">
|
||||
<componentDiyTabs :propValue="value" :propIsCommon="false" :propSpacingCommonStyle="spacing_common_style" @tabs-click="tabs_click_event"></componentDiyTabs>
|
||||
<componentDiycarousel :propValue="value" :propIsCommon="false"></componentDiycarousel>
|
||||
</div>
|
||||
<view class="flex-col ou" :style="style_container">
|
||||
<componentDiyModulesTabsView :propValue="propValue" :propIsTop="top_up == '1'" :propTop="propStickyTop" :propStyle="tabs_style" @tabs-click="tabs_click_event"></componentDiyModulesTabsView>
|
||||
<componentDiycarousel :propValue="propValue" :propIsCommon="false"></componentDiycarousel>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { common_styles_computer } from '@/common/js/common/common.js';
|
||||
import componentDiyTabs from '@/components/diy/tabs';
|
||||
import { common_styles_computer, padding_computer, margin_computer } from '@/common/js/common/common.js';
|
||||
import componentDiyModulesTabsView from '@/components/diy/modules/tabs-view';
|
||||
import componentDiycarousel from '@/components/diy/carousel';
|
||||
export default {
|
||||
components: {
|
||||
componentDiyTabs,
|
||||
componentDiyModulesTabsView,
|
||||
componentDiycarousel,
|
||||
},
|
||||
props: {
|
||||
|
|
@ -21,6 +21,10 @@
|
|||
return {};
|
||||
},
|
||||
},
|
||||
propStickyTop: {
|
||||
type: Number,
|
||||
default: 0,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
|
@ -37,6 +41,8 @@
|
|||
margin_left: 0,
|
||||
margin_right: 0,
|
||||
},
|
||||
top_up: '0',
|
||||
tabs_style: '',
|
||||
};
|
||||
},
|
||||
created() {
|
||||
|
|
@ -44,21 +50,25 @@
|
|||
},
|
||||
methods: {
|
||||
init() {
|
||||
const new_content = this.propValue.content || {};
|
||||
const new_style = this.propValue.style || {};
|
||||
let tabs_style_obj = {
|
||||
padding_top: new_style.common_style.padding_top,
|
||||
padding_left: new_style.common_style.padding_left,
|
||||
padding_right: new_style.common_style.padding_right,
|
||||
margin_top: new_style.common_style.margin_top,
|
||||
margin_left: new_style.common_style.margin_left,
|
||||
margin_right: new_style.common_style.margin_right,
|
||||
};
|
||||
let new_tabs_style = padding_computer(tabs_style_obj) + margin_computer(tabs_style_obj) + `position:relative;left: -${tabs_style_obj.padding_left * 2}rpx;right: -${tabs_style_obj.padding_right * 2}rpx;width:100%;`;
|
||||
let common_style = Object.assign({}, new_style.common_style, {
|
||||
padding_top: 0,
|
||||
margin_top: 0,
|
||||
});
|
||||
this.setData({
|
||||
style_container: `${common_styles_computer(new_style.common_style)};gap:${new_style.data_spacing * 2}rpx`,
|
||||
spacing_common_style: {
|
||||
padding: 0,
|
||||
padding_top: new_style.common_style.padding_top,
|
||||
padding_bottom: 0,
|
||||
padding_left: new_style.common_style.padding_left,
|
||||
padding_right: new_style.common_style.padding_right,
|
||||
margin: 0,
|
||||
margin_top: new_style.common_style.margin_top,
|
||||
margin_bottom: 0,
|
||||
margin_left: new_style.common_style.margin_left,
|
||||
margin_right: new_style.common_style.margin_right,
|
||||
},
|
||||
style_container: `${common_styles_computer(common_style)};gap:${new_style.data_spacing * 2}rpx`,
|
||||
top_up: new_content.tabs_top_up,
|
||||
tabs_style: new_tabs_style,
|
||||
});
|
||||
},
|
||||
tabs_click_event(tabs_id, is_micro_page) {
|
||||
|
|
|
|||
|
|
@ -18,14 +18,6 @@
|
|||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
propIsCommon: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
propSpacingCommonStyle: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
propStickyTop: {
|
||||
type: Number,
|
||||
default: 0,
|
||||
|
|
@ -55,7 +47,7 @@
|
|||
new_tabs_data.content.tabs_list.unshift(new_tabs_data.content.home_data);
|
||||
this.setData({
|
||||
tabs_data: new_tabs_data,
|
||||
style_container: this.propIsCommon ? common_styles_computer(new_style.common_style) : new_content.tabs_top_up == '1' ? padding_computer(this.propSpacingCommonStyle) + margin_computer(this.propSpacingCommonStyle) : '',
|
||||
style_container: common_styles_computer(new_style.common_style),
|
||||
top_up: new_content.tabs_top_up,
|
||||
});
|
||||
},
|
||||
|
|
|
|||
Loading…
Reference in New Issue