lijingjia 6 days ago
commit 6056bc5a74

@ -2,6 +2,7 @@
<svg <svg
:class="[prefixCls, $attrs.class, spin && 'svg-icon-spin']" :class="[prefixCls, $attrs.class, spin && 'svg-icon-spin']"
:style="getStyle" :style="getStyle"
:fill="color"
aria-hidden="true" aria-hidden="true"
> >
<use :xlink:href="symbolId" /> <use :xlink:href="symbolId" />
@ -19,6 +20,10 @@
type: String, type: String,
default: 'icon', default: 'icon',
}, },
color: {
type: String,
default: 'black',
},
name: { name: {
type: String, type: String,
required: true, required: true,
@ -43,6 +48,7 @@
return { return {
width: s, width: s,
height: s, height: s,
color: props.color,
} }
}) })
return { symbolId, prefixCls, getStyle } return { symbolId, prefixCls, getStyle }

@ -3,7 +3,7 @@
:collapsed-show-title="collapsedShowTitle"> :collapsed-show-title="collapsedShowTitle">
<template #title> <template #title>
<!-- <Icon v-if="getIcon" :icon="getIcon" :size="12" /> --> <!-- <Icon v-if="getIcon" :icon="getIcon" :size="12" /> -->
<SvgIcon :name="item.icon" :size="20" /> <SvgIcon :color="themeValue == 'white' ? 'rgba(39, 94, 204, 1)' : 'white'" :name="item.icon" :size="20" />
<div v-if="collapsedShowTitle && getIsCollapseParent" class="mt-2 collapse-title"> <div v-if="collapsedShowTitle && getIsCollapseParent" class="mt-2 collapse-title">
{{ getI18nName }} {{ getI18nName }}
</div> </div>
@ -37,7 +37,7 @@
import type { PropType } from 'vue' import type { PropType } from 'vue'
import type { Menu } from '/@/router/types' import type { Menu } from '/@/router/types'
import { Row, Col } from 'ant-design-vue' import { Row, Col } from 'ant-design-vue'
import { defineComponent, computed } from 'vue' import { defineComponent, computed, ref, watch } from 'vue'
import { useDesign } from '/@/hooks/web/useDesign' import { useDesign } from '/@/hooks/web/useDesign'
import Icon from '/@/components/Icon/index' import Icon from '/@/components/Icon/index'
import { SvgIcon } from '/@/components/Icon' import { SvgIcon } from '/@/components/Icon'
@ -47,7 +47,7 @@ import { propTypes } from '/@/utils/propTypes'
import { useI18n } from '/@/hooks/web/useI18n' import { useI18n } from '/@/hooks/web/useI18n'
import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent' import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent'
import { useMenuSetting } from '/@/hooks/setting/useMenuSetting' import { useMenuSetting } from '/@/hooks/setting/useMenuSetting'
import { useRootSetting } from '/@/hooks/setting/useRootSetting'
export default defineComponent({ export default defineComponent({
name: 'SimpleSubMenu', name: 'SimpleSubMenu',
components: { components: {
@ -73,7 +73,8 @@ export default defineComponent({
const { getCollapsed } = useMenuSetting() const { getCollapsed } = useMenuSetting()
const { t } = useI18n() const { t } = useI18n()
const { prefixCls } = useDesign('simple-menu') const { prefixCls } = useDesign('simple-menu')
const { getDarkMode } = useRootSetting()
const themeValue = ref(getDarkMode.value)
const getShowMenu = computed(() => !props.item?.meta?.hideMenu) const getShowMenu = computed(() => !props.item?.meta?.hideMenu)
const getIcon = computed(() => props.item?.icon) const getIcon = computed(() => props.item?.icon)
const getI18nName = computed(() => t(props.item?.name)) const getI18nName = computed(() => t(props.item?.name))
@ -87,7 +88,12 @@ export default defineComponent({
}, },
] ]
}) })
watch(
() => getDarkMode.value,
(v) => {
themeValue.value = v
}
)
function menuHasChildren(menuTreeItem: Menu): boolean { function menuHasChildren(menuTreeItem: Menu): boolean {
return ( return (
!menuTreeItem.meta?.hideChildrenInMenu && !menuTreeItem.meta?.hideChildrenInMenu &&
@ -97,6 +103,7 @@ export default defineComponent({
) )
} }
return { return {
prefixCls, prefixCls,
menuHasChildren, menuHasChildren,
@ -106,7 +113,8 @@ export default defineComponent({
getShowSubTitle, getShowSubTitle,
getLevelClass, getLevelClass,
getIsCollapseParent, getIsCollapseParent,
getCollapsed getCollapsed,
themeValue,
} }
}, },
}) })

Loading…
Cancel
Save