Commit 8957ac22 authored by shida.liu's avatar shida.liu

feat: 鸿蒙购物车跳h5,分享暂时隐藏;

parent 5d41b663
<template> <template>
<div class="pageContent"> <div class="pageContent">
<div class="activity" :class="{hasBottomNav: navigatorConfig}" :style="transformStyle(pageData.commonStyle)"> <div
class="activity"
:class="{ hasBottomNav: navigatorConfig }"
:style="transformStyle(pageData.commonStyle)"
>
<template v-if="!noPageData && tenantIdCorrect"> <template v-if="!noPageData && tenantIdCorrect">
<div class="layout"> <div class="layout">
<template v-for="(item, index) in pageData.elements"> <template v-for="(item, index) in pageData.elements">
<div :style="transformStyle(item.commonStyle, item.point, item.name)" <div
:style="transformStyle(item.commonStyle, item.point, item.name)"
:key="fixGridKey(item)" :key="fixGridKey(item)"
:id="`item_${item.id}`" :id="`item_${item.id}`"
@click="dot(item.title)" @click="dot(item.title)"
@touchend="disTouch" @touchend="disTouch"
> >
<component :data-index="index" :id="item.id" :containerIndex="index" :component-data="item" :childItem="item" :is="item.name" :sa-info="getSaInfo(item)" v-bind="item.props"></component> <component
:data-index="index"
:id="item.id"
:containerIndex="index"
:component-data="item"
:childItem="item"
:is="item.name"
:sa-info="getSaInfo(item)"
v-bind="item.props"
></component>
</div> </div>
</template> </template>
...@@ -22,35 +36,55 @@ ...@@ -22,35 +36,55 @@
<page-bottom-tip /> <page-bottom-tip />
</div> </div>
</div> </div>
<back-top v-if="showBackTop" :show-back-top="showBackTop" ref="backTop" /> <back-top
<invalid-notice v-model="pageInvalid" @toOtherActivity="toOtherActivity"/> v-if="showBackTop"
:show-back-top="showBackTop"
ref="backTop"
/>
<invalid-notice
v-model="pageInvalid"
@toOtherActivity="toOtherActivity"
/>
<coupon-modal :modal-data="couponModalData" v-model="showCouponModal" /> <coupon-modal :modal-data="couponModalData" v-model="showCouponModal" />
</template> </template>
<empty-state v-else /> <empty-state v-else />
</div> </div>
<!-- 底部导航 --> <!-- 底部导航 -->
<div v-if="navigatorConfig" class="bottomNav" :style="computedNavContainerStyle(navigatorConfig)"> <div
v-if="navigatorConfig"
class="bottomNav"
:style="computedNavContainerStyle(navigatorConfig)"
>
<div <div
class="navItem" class="navItem"
:class="{pic: item.type == 2, current: +navIndex === index}" :class="{ pic: item.type == 2, current: +navIndex === index }"
v-for="(item, index) in navigatorConfig.navigatorData" v-for="(item, index) in navigatorConfig.navigatorData"
:key="index" :key="index"
@click.stop="handleNavUrl(item, +navIndex === index)" @click.stop="handleNavUrl(item, +navIndex === index)"
> >
<img class="icon" :src="+navIndex === index ? item.selectIcon : item.icon" alt=""> <img
<span v-if="item.type == 1 && item.name" class="text" :style="computedNavTextStyle(item, +navIndex === index)">{{item.name}}</span> class="icon"
:src="+navIndex === index ? item.selectIcon : item.icon"
alt=""
/>
<span
v-if="item.type == 1 && item.name"
class="text"
:style="computedNavTextStyle(item, +navIndex === index)"
>{{ item.name }}</span
>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script lang="ts" src="./index.ts"></script> <script lang="ts" src="./index.ts"></script>
<style lang="less" scoped> <style lang="less" scoped>
@deep: ~'>>>'; @deep: ~">>>";
.pageContent{ .pageContent {
width: 100%; width: 100%;
height: 100%; height: 100%;
position: relative; position: relative;
.bottomNav{ .bottomNav {
box-sizing: content-box; box-sizing: content-box;
width: 100%; width: 100%;
position: fixed; position: fixed;
...@@ -64,36 +98,36 @@ ...@@ -64,36 +98,36 @@
padding-bottom: env(safe-area-inset-bottom); padding-bottom: env(safe-area-inset-bottom);
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
.navItem{ .navItem {
width: 62px; width: 62px;
height: 55px; height: 55px;
display: flex; display: flex;
justify-content: center; justify-content: center;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
&.pic{ &.pic {
.icon{ .icon {
max-width: 40px; max-width: 40px;
max-height: 40px; max-height: 40px;
} }
} }
.icon{ .icon {
max-width: 35px; max-width: 35px;
max-height: 35px; max-height: 35px;
} }
.text{ .text {
margin-top: 3px; margin-top: 3px;
text-align: center; text-align: center;
font-size: 10px; font-size: 10px;
} }
} }
} }
} }
.activity { .activity {
width: 100%; width: 100%;
min-height: 100%; min-height: 100%;
background-color: rgb(244, 244, 244); background-color: rgb(244, 244, 244);
&.hasBottomNav{ &.hasBottomNav {
padding-bottom: calc(constant(safe-area-inset-bottom) + 55px); padding-bottom: calc(constant(safe-area-inset-bottom) + 55px);
padding-bottom: calc(env(safe-area-inset-bottom) + 55px); padding-bottom: calc(env(safe-area-inset-bottom) + 55px);
} }
...@@ -120,11 +154,10 @@ ...@@ -120,11 +154,10 @@
} }
} }
} }
} }
.del_transform { .del_transform {
overflow: visible !important; overflow: visible !important;
transform: none !important; transform: none !important;
} }
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment