feat: 平台兼容性调整

2024-09-14 16:08:23 +08:00 · 2024-09-14 16:08:23 +08:00 · fc1a36ef3b
parent 35735c1d80
commit fc1a36ef3b
10 changed files with 309 additions and 263 deletions
--- a/src/App.vue
+++ b/src/App.vue
@ -3,7 +3,23 @@ import { onLaunch, onShow, onHide } from "@dcloudio/uni-app";

 onLaunch(() => {
  //隐藏官方的tabBar
-  // uni.hideTabBar();
+  // #ifdef MP-ALIPAY
+  my.hideTabBar({
+    animation: false, // 是否需要动画效果，alipay 1.95.0支持此参数
+    success: (res) => {
+      // 隐藏成功的回调
+      console.log("TabBar has been hidden", res);
+    },
+    fail: (err) => {
+      // 隐藏失败的回调
+      console.error("Failed to hide TabBar", err);
+    },
+  });
+  // #endif
+
+  // #ifndef MP-ALIPAY
+  uni.hideTabBar();
+  // #endif
 });
 onShow(() => {
  console.log("App Show");
--- a/src/components/Tabbar/index.vue
+++ b/src/components/Tabbar/index.vue
@ -74,8 +74,7 @@ const handleClick = (item: tabBar) => {
 };

 onLaunch(() => {
-  //隐藏官方的tabBar
-  uni.hideTabBar();
+  
 });
 </script>

--- a/src/manifest.json
+++ b/src/manifest.json
@ -86,7 +86,8 @@
        "lazyCodeLoading" : "requiredComponents"
    },
    "mp-alipay" : {
-        "usingComponents" : true
+        "usingComponents" : true,
+        "styleIsolation":"apply-shared"
    },
    "mp-baidu" : {
        "usingComponents" : true
--- a/src/pages.json
+++ b/src/pages.json
@ -113,11 +113,11 @@
    "list": [
      {
        "pagePath": "pagesHome/index",
-        "text": "工作台"
+        "text": ""
      },
      {
        "pagePath": "pagesHome/profile",
-        "text": "我的"
+        "text": ""
      }
    ]
  },
--- a/src/pagesBattery/index.vue
+++ b/src/pagesBattery/index.vue
@ -2,8 +2,8 @@
  <!-- 轮播图 -->
  <CustomSwiper :list="bannerList"> </CustomSwiper>
  <!-- 入口 -->
+  <view class="entry-card">
    <uni-card
-    class="entry-card"
      :shadow="'0rpx 0rpx 10rpx 0rpx rgba(5,68,37,0.12)'"
      :padding="'20px 10px'"
      :border="false"
@ -23,9 +23,11 @@
        </view>
      </view>
    </uni-card>
+  </view>
+
  <!-- 介绍 -->
+  <view class="avatar-card">
    <uni-card
-    class="avatar-card"
      :shadow="'0rpx 0rpx 10rpx 0rpx rgba(5,68,37,0.12)'"
      :padding="'20px 10px'"
      :border="false"
@ -43,11 +45,8 @@
      <up-gap height="10" bgColor="#F8F8F8"></up-gap>
      <view class="title mt-20">回收物品</view>
      <uni-grid :column="2" :showBorder="false" :square="false">
-      <uni-grid-item
-        class="item"
-        v-for="(item, index) in serviceItemList"
-        :key="index"
-      >
+        <uni-grid-item v-for="(item, index) in serviceItemList" :key="index">
+          <view class="item">
            <uni-card
              :shadow="'0rpx 0rpx 10rpx 0rpx rgba(5,68,37,0.12)'"
              :padding="'0px'"
@ -64,6 +63,7 @@
                <text class="text">{{ item.name }}</text>
              </view>
            </uni-card>
+          </view>
        </uni-grid-item>
      </uni-grid>

@ -80,9 +80,14 @@

      <view class="other">
        <view>其他问题请咨询客服电话</view>
-      <view><text @click="callNumber('15150231777')" class="active">15150231777&nbsp;&nbsp;欢迎咨询</text></view>
+        <view
+          ><text @click="callNumber('15150231777')" class="active"
+            >15150231777&nbsp;&nbsp;欢迎咨询</text
+          ></view
+        >
      </view>
    </uni-card>
+  </view>
 </template>

 <script setup lang="ts">
@ -181,7 +186,7 @@ const handleClick = (item: any) => {
  });
 };

-const callNumber = (number) => {
+const callNumber = (number:any) => {
  // 判断是否为移动端
  if (
    uni.getSystemInfoSync().platform === "android" ||
--- a/src/pagesHome/index.vue
+++ b/src/pagesHome/index.vue
@ -3,18 +3,15 @@
    <!-- 轮播图 -->
    <CustomSwiper> </CustomSwiper>
    <!-- 入口 -->
+    <view class="entry-card">
      <uni-card
-      class="entry-card"
        :shadow="'0rpx 0rpx 10rpx 0rpx rgba(5,68,37,0.12)'"
        :padding="'20px 10px'"
        :border="false"
      >
        <uni-grid :column="3" :showBorder="false" :square="false">
-        <uni-grid-item
-          class="item"
-          v-for="(item, index) in entryItemList"
-          :key="index"
-        >
+          <uni-grid-item v-for="(item, index) in entryItemList" :key="index">
+            <view class="item">
              <view @click="handleClick(item)">
                <view>
                  <image :src="`${url}/static/img/${item.path}`"></image>
@ -23,12 +20,15 @@
                  <text class="text">{{ item.name }}</text>
                </view>
              </view>
+            </view>
          </uni-grid-item>
        </uni-grid>
      </uni-card>
+    </view>
+
    <!-- 介绍 -->
+    <view class="avatar-card">
      <uni-card
-      class="avatar-card"
        :shadow="'0rpx 0rpx 10rpx 0rpx rgba(5,68,37,0.12)'"
        :padding="'10px 10px'"
        :border="false"
@ -60,6 +60,7 @@
          style="width: 100%"
        />
      </uni-card>
+    </view>
  </Layout>
 </template>

@ -136,7 +137,7 @@ const handleClick = (item: any) => {
    padding: 0px !important;
  }
  image + image {
-    margin-top: -12rpx;
+    margin-top: -14rpx;
  }
 }
 </style>
--- a/src/pagesHome/profile.vue
+++ b/src/pagesHome/profile.vue
@ -95,6 +95,24 @@ const openDoc = (item: string) => {
  });
 };

+  //隐藏官方的tabBar
+  // #ifdef MP-ALIPAY
+  my.hideTabBar({
+    animation: false, // 是否需要动画效果，alipay 1.95.0支持此参数
+    success: (res) => {
+      // 隐藏成功的回调
+      console.log("TabBar has been hidden", res);
+    },
+    fail: (err) => {
+      // 隐藏失败的回调
+      console.error("Failed to hide TabBar", err);
+    },
+  });
+  // #endif
+
+  // #ifndef MP-ALIPAY
+  uni.hideTabBar();
+  // #endif
 </script>

 <style lang="scss" scoped>
--- a/src/pagesScrapSteel/index.vue
+++ b/src/pagesScrapSteel/index.vue
@ -2,8 +2,8 @@
  <!-- 轮播图 -->
  <CustomSwiper :list="bannerList"> </CustomSwiper>
  <!-- 介绍 -->
+  <view class="avatar-card">
    <uni-card
-    class="avatar-card"
      :shadow="'0rpx 0rpx 10rpx 0rpx rgba(5,68,37,0.12)'"
      :padding="'20px 10px'"
      :border="false"
@ -22,7 +22,11 @@
            <view>货场名称：{{ item.name }}</view>
            <view>货场地址：{{ item.address }}</view>
            <view
-            >联系电话：{{item.owner}} &nbsp;&nbsp;<text  @click="callNumber(item.phone)" class="active">{{ item.phone }} &nbsp;&nbsp;欢迎询价</text></view
+              >联系电话：{{ item.owner }} &nbsp;&nbsp;<text
+                @click="callNumber(item.phone)"
+                class="active"
+                >{{ item.phone }} &nbsp;&nbsp;欢迎询价</text
+              ></view
            >
          </view>
        </view>
@ -54,12 +58,12 @@
                >加入爱梵达</u-button
              ></view
            >
-          
          </view>
          <view class="mt-30 mb-30">爱梵达智能过磅系统，提升您的经营效率</view>
        </uni-grid>
      </view>
    </uni-card>
+  </view>
 </template>

 <script setup lang="ts">
@ -79,7 +83,7 @@ const list = ref([
      "长期回收废钢（轻一、轻二、轻三、重废、钢板料等）、废纸、泡沫、塑料等，量大价优，欢迎来电咨询。",
    name: "在生万有-中悦犇站",
    address: "上海市奉贤区川南奉公路8598号",
-    owner: '刘先生',
+    owner: "刘先生",
    phone: "13651779998",
  },
  {
@ -88,7 +92,7 @@ const list = ref([
      "长期回收重废、中废、轻废、小废、岩棉板、花盒等，量大价优，欢迎来电咨询。",
    name: "上海宽钢公司",
    address: "上海市宝山区兰岗路2号门",
-    owner: '李女士',
+    owner: "李女士",
    phone: "13601647155",
  },
 ]);
@ -122,13 +126,14 @@ const handleJoin = () => {
  });
 };

-const callNumber = (number) => {
+const callNumber = (number:any) => {
  // 判断是否为移动端
  if (
    uni.getSystemInfoSync().platform === "android" ||
    uni.getSystemInfoSync().platform === "ios"
  ) {
    // 在移动端使用内置拨号程序进行拨号
+    // my.makePhoneCall({ number: '1111111' }); 支付宝
    uni.makePhoneCall({
      phoneNumber: number, // 电话号码
      success: function () {
--- a/src/pagesVehicle/index.vue
+++ b/src/pagesVehicle/index.vue
@ -2,18 +2,15 @@
  <!-- 轮播图 -->
  <CustomSwiper :list="bannerList"> </CustomSwiper>
  <!-- 入口 -->
+  <view class="entry-card">
    <uni-card
-    class="entry-card"
      :shadow="'0rpx 0rpx 10rpx 0rpx rgba(5,68,37,0.12)'"
      :padding="'20px 10px'"
      :border="false"
    >
      <uni-grid :column="4" :showBorder="false" :square="false">
-      <uni-grid-item
-        class="item"
-        v-for="(item, index) in entryItemList"
-        :key="index"
-      >
+        <uni-grid-item v-for="(item, index) in entryItemList" :key="index">
+          <view class="item">
            <view @click="handleClick(item)">
              <view>
                <image :src="`${url}/static/img/vehicle/${item.path}`"></image>
@ -22,12 +19,14 @@
                <text class="text">{{ item.name }}</text>
              </view>
            </view>
+          </view>
        </uni-grid-item>
      </uni-grid>
    </uni-card>
+  </view>
  <!-- 介绍 -->
+  <view class="avatar-card">
    <uni-card
-    class="avatar-card"
      :shadow="'0rpx 0rpx 10rpx 0rpx rgba(5,68,37,0.12)'"
      :padding="'20px 10px'"
      :border="false"
@ -39,6 +38,7 @@
          v-for="(item, index) in serviceItemList"
          :key="index"
        >
+          <view class="item">
            <uni-card
              :shadow="'0rpx 0rpx 10rpx 0rpx rgba(5,68,37,0.12)'"
              :padding="'0px'"
@ -55,6 +55,7 @@
                <text class="text">{{ item.name }}</text>
              </view>
            </uni-card>
+          </view>
        </uni-grid-item>
      </uni-grid>

@ -69,9 +70,14 @@

      <view class="other">
        <view>其他问题请咨询客服电话</view>
-      <view><text @click="callNumber('15150231777')" class="active">15150231777 &nbsp;&nbsp;欢迎咨询</text></view>
+        <view
+          ><text @click="callNumber('15150231777')" class="active"
+            >15150231777 &nbsp;&nbsp;欢迎咨询</text
+          ></view
+        >
      </view>
    </uni-card>
+  </view>
 </template>

 <script setup lang="ts">
@ -177,7 +183,7 @@ const handleClick = (item: any) => {
  });
 };

-const callNumber = (number) => {
+const callNumber = (number: any) => {
  // 判断是否为移动端
  if (
    uni.getSystemInfoSync().platform === "android" ||
--- a/src/static/style/common.scss
+++ b/src/static/style/common.scss
@ -99,8 +99,3 @@ body {
    color: $u-primary;
  }
 }
-// #ifdef H5
-.bottom {
-  padding-bottom: 30rpx !important;
-}
-// #endif