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

app/web/page/activity/view/activity/index.vue

 <template>
   <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">
         <div class="layout">
           <template v-for="(item, index) in pageData.elements">
-            <div :style="transformStyle(item.commonStyle, item.point, item.name)" 
-                    :key="fixGridKey(item)"
-                    :id="`item_${item.id}`"
-                    @click="dot(item.title)"
-                    @touchend="disTouch"
+            <div
+              :style="transformStyle(item.commonStyle, item.point, item.name)"
+              :key="fixGridKey(item)"
+              :id="`item_${item.id}`"
+              @click="dot(item.title)"
+              @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>
-          </div>
+              <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>
           </template>
-      
+
           <div
             v-if="pageData.props.showPageBottomTip"
             :id="bottomInfo.i + pageData.elements.length"
@@ -22,109 +36,128 @@
             <page-bottom-tip />
           </div>
         </div>
-        <back-top v-if="showBackTop" :show-back-top="showBackTop" ref="backTop" />
-        <invalid-notice v-model="pageInvalid" @toOtherActivity="toOtherActivity"/>
+        <back-top
+          v-if="showBackTop"
+          :show-back-top="showBackTop"
+          ref="backTop"
+        />
+        <invalid-notice
+          v-model="pageInvalid"
+          @toOtherActivity="toOtherActivity"
+        />
         <coupon-modal :modal-data="couponModalData" v-model="showCouponModal" />
       </template>
       <empty-state v-else />
     </div>
     <!-- 底部导航 -->
-    <div v-if="navigatorConfig" class="bottomNav" :style="computedNavContainerStyle(navigatorConfig)">
+    <div
+      v-if="navigatorConfig"
+      class="bottomNav"
+      :style="computedNavContainerStyle(navigatorConfig)"
+    >
       <div
         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"
         :key="index"
         @click.stop="handleNavUrl(item, +navIndex === index)"
       >
-        <img 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>
+        <img
+          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>
 </template>
 <script lang="ts" src="./index.ts"></script>
 <style lang="less" scoped>
-  @deep: ~'>>>';
-  .pageContent{
+@deep: ~">>>";
+.pageContent {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  .bottomNav {
+    box-sizing: content-box;
     width: 100%;
-    height: 100%;
-    position: relative;
-    .bottomNav{
-      box-sizing: content-box;
-      width: 100%;
-      position: fixed;
-      bottom: 0;
-      left: 0;
-      z-index: 899;
-      padding-top: 0;
-      padding-left: 4px;
-      padding-right: 4px;
-      padding-bottom: constant(safe-area-inset-bottom);
-      padding-bottom: env(safe-area-inset-bottom);
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    z-index: 899;
+    padding-top: 0;
+    padding-left: 4px;
+    padding-right: 4px;
+    padding-bottom: constant(safe-area-inset-bottom);
+    padding-bottom: env(safe-area-inset-bottom);
+    display: flex;
+    justify-content: space-around;
+    .navItem {
+      width: 62px;
+      height: 55px;
       display: flex;
-      justify-content: space-around;
-      .navItem{
-        width: 62px;
-        height: 55px;
-        display: flex;
-        justify-content: center;
-        flex-direction: column;
-        align-items: center;
-        &.pic{
-          .icon{
-            max-width: 40px;
-            max-height: 40px;
-          }
-        }
-        .icon{
-          max-width: 35px;
-          max-height: 35px;
-        }
-        .text{
-          margin-top: 3px;
-          text-align: center;
-          font-size: 10px;
+      justify-content: center;
+      flex-direction: column;
+      align-items: center;
+      &.pic {
+        .icon {
+          max-width: 40px;
+          max-height: 40px;
         }
       }
+      .icon {
+        max-width: 35px;
+        max-height: 35px;
+      }
+      .text {
+        margin-top: 3px;
+        text-align: center;
+        font-size: 10px;
+      }
     }
   }
-  .activity {
-    width: 100%;
-    min-height: 100%;
-    background-color: rgb(244, 244, 244);
-    &.hasBottomNav{
-      padding-bottom: calc(constant(safe-area-inset-bottom) + 55px);
-      padding-bottom: calc(env(safe-area-inset-bottom) + 55px);
-    }
-    // box-shadow: 2px 0 10px rgba(0, 0, 0, 0.2);
-    // overflow-x: hidden;
-    // overflow-y: scroll;
-    /deep/ .vue-grid-layout {
-      padding-bottom: 40px;
-      box-sizing: content-box;
-      // transform: translateY(-10px);
-      transition-property: none;
+}
+.activity {
+  width: 100%;
+  min-height: 100%;
+  background-color: rgb(244, 244, 244);
+  &.hasBottomNav {
+    padding-bottom: calc(constant(safe-area-inset-bottom) + 55px);
+    padding-bottom: calc(env(safe-area-inset-bottom) + 55px);
+  }
+  // box-shadow: 2px 0 10px rgba(0, 0, 0, 0.2);
+  // overflow-x: hidden;
+  // overflow-y: scroll;
+  /deep/ .vue-grid-layout {
+    padding-bottom: 40px;
+    box-sizing: content-box;
+    // transform: translateY(-10px);
+    transition-property: none;
 
-      .vue-grid-item {
-        transition-property: none;
-        display: flex;
-        justify-content: center;
-        align-items: center;
+    .vue-grid-item {
+      transition-property: none;
+      display: flex;
+      justify-content: center;
+      align-items: center;
 
-        /* 不可设置溢出隐藏，tabs导航会出问题 */
-        overflow: hidden;
+      /* 不可设置溢出隐藏，tabs导航会出问题 */
+      overflow: hidden;
 
-        & > *:first-child {
-          height: 100%;
-        }
+      & > *:first-child {
+        height: 100%;
       }
     }
   }
+}
 
-  .del_transform {
-    overflow: visible !important;
-    transform: none !important;
-  }
-
+.del_transform {
+  overflow: visible !important;
+  transform: none !important;
+}
 </style>