refactor: 优化plugin-layout和plugin-locale

This commit is contained in:
万纯 2021-03-15 20:02:46 +08:00
parent 82add74b66
commit b076db692e
4 changed files with 48 additions and 23 deletions

View File

@ -28,7 +28,7 @@ const _addAccessTag = (arr) => {
} }
}; };
export const addAccessTag = (menus) => { export const transform = (menus) => {
const originData = unref(menus); const originData = unref(menus);
_addAccessTag(originData); _addAccessTag(originData);
return originData; return originData;

View File

@ -0,0 +1,33 @@
import { unref, computed } from 'vue';
import { plugin } from '@@/core/coreExports';
const transTitle = (name) => {
const sharedLocale = plugin.getShared('locale');
if (sharedLocale) {
const { t } = sharedLocale.useI18n();
return t(name);
}
return name;
};
const _transform = (arr) => {
if (Array.isArray(arr)) {
arr.forEach((item) => {
if (item.title) {
item._title = item.title;
item.title = computed(() => transTitle(item._title));
}
if (item.children && item.children.length > 0) {
_transform(item.children);
}
});
}
};
export const transform = (menus) => {
const originData = unref(menus);
_transform(originData);
return originData;
};

View File

@ -7,7 +7,7 @@
> >
<template v-for="(item, index) in fixedMenus" :key="index"> <template v-for="(item, index) in fixedMenus" :key="index">
<template v-if="item.access"> <template v-if="item.access">
<a-sub-menu v-if="item.children" :title="transTitle(item.title)"> <a-sub-menu v-if="item.children" :title="item.title">
<template <template
v-for="(item1, index) in item.children" v-for="(item1, index) in item.children"
:key="index" :key="index"
@ -15,7 +15,7 @@
<template v-if="item1.access"> <template v-if="item1.access">
<a-sub-menu <a-sub-menu
v-if="item1.children" v-if="item1.children"
:title="transTitle(item1.title)" :title="item1.title"
> >
<template <template
v-for="(item2, index) in item1.children" v-for="(item2, index) in item1.children"
@ -24,21 +24,21 @@
<a-menu-item <a-menu-item
v-if="item2.access" v-if="item2.access"
:key="item2.path" :key="item2.path"
:title="transTitle(item2.title)" :title="item2.title"
> >
{{transTitle(item2.title)}} {{item2.title}}
</a-menu-item> </a-menu-item>
</template> </template>
</a-sub-menu> </a-sub-menu>
<a-menu-item v-else :key="item1.path" :title="transTitle(item1.title)"> <a-menu-item v-else :key="item1.path" :title="item1.title">
{{transTitle(item1.title)}} {{item1.title}}
</a-menu-item> </a-menu-item>
</template> </template>
</template> </template>
</a-sub-menu> </a-sub-menu>
<a-menu-item v-else :key="item.path" :title="transTitle(item.title)"> <a-menu-item v-else :key="item.path" :title="item.title">
<MenuIcon v-if="item.icon" :icon="item.icon" /> <MenuIcon v-if="item.icon" :icon="item.icon" />
<span>{{transTitle(item.title)}}</span> <span>{{item.title}}</span>
</a-menu-item> </a-menu-item>
</template> </template>
</template> </template>
@ -47,11 +47,12 @@
<script> <script>
import { toRefs, computed } from 'vue'; import { toRefs, computed } from 'vue';
import { useRoute, useRouter, plugin } from '@@/core/coreExports'; import { useRoute, useRouter } from '@@/core/coreExports';
import Menu from 'ant-design-vue/lib/menu'; import Menu from 'ant-design-vue/lib/menu';
import 'ant-design-vue/lib/menu/style/css'; import 'ant-design-vue/lib/menu/style/css';
import MenuIcon from './MenuIcon'; import MenuIcon from './MenuIcon';
import { addAccessTag } from '../helpers/pluginAccess'; import { transform as transformByAccess } from '../helpers/pluginAccess';
import { transform as transformByLocale } from '../helpers/pluginLocale';
export default { export default {
components: { components: {
@ -73,11 +74,10 @@ export default {
} }
}, },
setup(props) { setup(props) {
const sharedLocale = plugin.getShared('locale');
const { menus } = toRefs(props); const { menus } = toRefs(props);
const route = useRoute(); const route = useRoute();
const router = useRouter(); const router = useRouter();
const fixedMenus = addAccessTag(menus); const fixedMenus = transformByLocale(transformByAccess(menus));
const onMenuClick = (e) => { const onMenuClick = (e) => {
const path = e.key; const path = e.key;
if (/^https?:\/\//.test(path)) { if (/^https?:\/\//.test(path)) {
@ -90,19 +90,11 @@ export default {
); );
} }
}; };
const transTitle = (name) => {
if (sharedLocale) {
const { t } = sharedLocale.useI18n();
return t(name);
}
return name;
};
const selectedKeys = computed(() => [route.path]); const selectedKeys = computed(() => [route.path]);
return { return {
selectedKeys, selectedKeys,
fixedMenus, fixedMenus,
onMenuClick, onMenuClick
transTitle
}; };
} }
}; };

View File

@ -10,7 +10,7 @@ export default (api) => {
} = api; } = api;
api.chainWebpack((memo) => { api.chainWebpack((memo) => {
memo.resolve.alias.set('vue-i18n', 'vue-i18n/dist/vue-i18n.esm-bundler.js'); memo.resolve.alias.set('vue-i18n', 'vue-i18n/dist/vue-i18n.runtime.esm-bundler.js');
}); });
api.describe({ api.describe({