From f65bed72ac8c63aaed640d59703f73e83de80da5 Mon Sep 17 00:00:00 2001
From: vben <anncwb@126.com>
Date: Wed, 28 Oct 2020 00:25:45 +0800
Subject: [PATCH] feat: restore the breadcrumb display icon function

---
 CHANGELOG.zh_CN.md                       |  1 +
 src/layouts/default/LayoutBreadcrumb.tsx | 25 ++++++++++++++++++++++--
 2 files changed, 24 insertions(+), 2 deletions(-)

diff --git a/CHANGELOG.zh_CN.md b/CHANGELOG.zh_CN.md
index 6538aadb4..b1f629bd1 100644
--- a/CHANGELOG.zh_CN.md
+++ b/CHANGELOG.zh_CN.md
@@ -4,6 +4,7 @@
 
 - 新增`pwa`功能，可在`.env.production`开启
 - Button 组件扩展 `preIcon`和`postIcon`属性用于在文本前后添加图标
+- 恢复面包屑显示图标功能
 
 ### 🎫 Chores
 
diff --git a/src/layouts/default/LayoutBreadcrumb.tsx b/src/layouts/default/LayoutBreadcrumb.tsx
index 8c9997794..2ede95b76 100644
--- a/src/layouts/default/LayoutBreadcrumb.tsx
+++ b/src/layouts/default/LayoutBreadcrumb.tsx
@@ -1,5 +1,6 @@
 import type { AppRouteRecordRaw } from '/@/router/types';
 import type { RouteLocationMatched } from 'vue-router';
+import type { PropType } from 'vue';
 
 import { defineComponent, TransitionGroup, unref, watch, ref } from 'vue';
 import Breadcrumb from '/@/components/Breadcrumb/Breadcrumb.vue';
@@ -10,10 +11,17 @@ import { PageEnum } from '/@/enums/pageEnum';
 import { isBoolean } from '/@/utils/is';
 
 import { compile } from 'path-to-regexp';
+import Icon from '/@/components/Icon';
 
 export default defineComponent({
   name: 'BasicBreadcrumb',
-  setup() {
+  props: {
+    showIcon: {
+      type: Boolean as PropType<boolean>,
+      default: false,
+    },
+  },
+  setup(props) {
     const itemList = ref<AppRouteRecordRaw[]>([]);
 
     const { currentRoute, push } = useRouter();
@@ -82,7 +90,20 @@ export default defineComponent({
                     isLink={isLink}
                     onClick={handleItemClick.bind(null, item)}
                   >
-                    {() => item.meta.title}
+                    {() => (
+                      <>
+                        {props.showIcon && item.meta.icon && item.meta.icon.trim() !== '' && (
+                          <Icon
+                            icon={item.meta.icon}
+                            class="icon mr-1 "
+                            style={{
+                              marginBottom: '2px',
+                            }}
+                          />
+                        )}
+                        {item.meta.title}
+                      </>
+                    )}
                   </BreadcrumbItem>
                 );
               });