From 821117f529f47cc44dd0b995221b79d639069c16 Mon Sep 17 00:00:00 2001
From: Burt <1020103647@qq.com>
Date: Wed, 3 Jan 2024 17:34:52 +0800
Subject: [PATCH] =?UTF-8?q?fix(icon):=20uni-icon=20=E5=9C=A8=E5=BE=AE?=
 =?UTF-8?q?=E4=BF=A1=E4=B8=8D=E6=94=AF=E6=8C=81=E9=A2=9C=E8=89=B2=EF=BC=8C?=
 =?UTF-8?q?=E6=94=B9=E7=94=A8unocss-icons?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .vscode/settings.json                    |  3 ++-
 README.md                                |  4 ++--
 src/components/fly-navbar/fly-navbar.vue | 22 +++++++++++++++++-----
 src/pages.json                           | 10 ++++++++++
 src/utils/index.ts                       | 13 +++++++++++++
 5 files changed, 44 insertions(+), 8 deletions(-)
 create mode 100644 src/utils/index.ts

diff --git a/.vscode/settings.json b/.vscode/settings.json
index 87aa119..d44c4b7 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -28,5 +28,6 @@
   "files.associations": {
     "pages.json": "jsonc", // pages.json 可以写注释
     "manifest.json": "jsonc" // manifest.json 可以写注释
-  }
+  },
+  "cSpell.words": ["Tabbar"]
 }
diff --git a/README.md b/README.md
index 3039aa0..146f21d 100644
--- a/README.md
+++ b/README.md
@@ -8,9 +8,9 @@
 
 - 📑 pinia+适用于多端的持久化方案
 
-- 🎨 [UnoCSS](https://github.com/unocss/unocss) - 高性能且极具灵活性的即时原子化 CSS 引擎
+- 🎨 [UnoCSS](https://unocss.dev/) - 高性能且极具灵活性的即时原子化 CSS 引擎
 
-- 😃 [各种图标集为你所用](https://github.com/antfu/unocss/tree/main/packages/preset-icons)
+- 😃 [UnoCSS Icons](https://unocss.dev/presets/icons), [海量图标-https://icones.js.org/](https://icones.js.org/)
 
 - 🔥 使用 [新的 `<script setup>` 语法](https://github.com/vuejs/rfcs/pull/227)
 
diff --git a/src/components/fly-navbar/fly-navbar.vue b/src/components/fly-navbar/fly-navbar.vue
index 3048832..34d74d4 100644
--- a/src/components/fly-navbar/fly-navbar.vue
+++ b/src/components/fly-navbar/fly-navbar.vue
@@ -1,22 +1,34 @@
 <template>
   <!-- 自定义导航栏: 默认透明不可见, scroll-view 滚动到 50 时展示 -->
   <view class="fly-navbar" :style="{ paddingTop: safeAreaInsets?.top + 'px' }">
-    <navigator v-if="pages.length > 1" open-type="navigateBack" class="back">
-      <uni-icons type="left" color="white" size="24" />
+    <!-- 1/3，多于1个页面，用返回图标 -->
+    <navigator v-if="pages.length > 1" open-type="navigateBack" class="left-icon">
+      <button class="i-carbon-chevron-left text-white"></button>
     </navigator>
-    <navigator v-else open-type="switchTab" url="/pages/index/index" class="back">
-      <uni-icons type="home" color="white" size="24" />
+    <!-- 2/3，只有1个页面，如果不是tabbar，需要首页图标 -->
+    <!-- 这种情况一般出现在用户直接打开分享出去的详情页面，或者使用redirectTo等API -->
+    <navigator
+      v-else-if="isTabbar"
+      open-type="switchTab"
+      url="/pages/index/index"
+      class="left-icon"
+    >
+      <button class="i-carbon-home text-white"></button>
     </navigator>
+    <!-- 如果当前页就是tabbar页，不用去首页，也就是什么图标都不需要 -->
     <view class="title">{{ title || '' }}</view>
   </view>
 </template>
 
 <script lang="ts" setup>
+import { getIsTabbar } from '@/utils/index'
+
 defineProps<{ title?: string }>()
 // 获取屏幕边界到安全区域距离
 const { safeAreaInsets } = uni.getSystemInfoSync()
 // 获取页面栈
 const pages = getCurrentPages()
+const isTabbar = getIsTabbar()
 </script>
 
 <style lang="scss" scoped>
@@ -29,7 +41,7 @@ const pages = getCurrentPages()
   color: #000;
   background-color: transparent;
 
-  .back {
+  .left-icon {
     position: absolute;
     left: 0;
     display: flex;
diff --git a/src/pages.json b/src/pages.json
index de10049..27ea050 100644
--- a/src/pages.json
+++ b/src/pages.json
@@ -26,5 +26,15 @@
       "^uni-(.*)": "@dcloudio/uni-ui/lib/uni-$1/uni-$1.vue"
     }
   },
+  "tabBar": {
+    "list": [
+      {
+        "pagePath": "pages/index/index"
+      },
+      {
+        "pagePath": "pages/my/index"
+      }
+    ]
+  },
   "subPackages": []
 }
diff --git a/src/utils/index.ts b/src/utils/index.ts
new file mode 100644
index 0000000..156116f
--- /dev/null
+++ b/src/utils/index.ts
@@ -0,0 +1,13 @@
+import pagesJson from '@/pages.json'
+
+console.log(pagesJson)
+
+/** 判断当前页面是否是tabbar页  */
+export const getIsTabbar = () => {
+  if (!pagesJson.tabBar) {
+    return false
+  }
+  const pages = getCurrentPages()
+  const currPath = pages.at(-1).route
+  return !!pagesJson.tabBar.list.find((e) => e.pagePath === currPath)
+}