|
|
@@ -25,97 +25,95 @@ import { getHasBottom } from '@/common/setup/order/orderData';
|
|
|
import { useRoute } from 'vue-router';
|
|
|
|
|
|
function handleMenu(context: SetupContext) {
|
|
|
- const selectedKeys = ref<string[]>(['1-1']);
|
|
|
- const openKeys = ref<string[]>(['1']);
|
|
|
- const preOpenKeys = ref<string[]>(['1']);
|
|
|
- const menuList = APP.getRef('menus');
|
|
|
- function menuClick(value: any) {
|
|
|
- const arr = value.keyPath;
|
|
|
- if (arr.length > 1 && arr[1] !== selectedKeys.value[0]) {
|
|
|
- const first = menuList.value.find((e: OperationTabMenu) => {
|
|
|
- return e.code === arr[0];
|
|
|
- });
|
|
|
- if (first) {
|
|
|
- const seconde = first.children.find((e: OperationTabMenu) => e.code === arr[1]);
|
|
|
- seconde && context.emit('chooseMenu', seconde);
|
|
|
- }
|
|
|
- }
|
|
|
+ const selectedKeys = ref<string[]>(['1-1']);
|
|
|
+ const openKeys = ref<string[]>(['1']);
|
|
|
+ const preOpenKeys = ref<string[]>(['1']);
|
|
|
+ const menuList = APP.getRef('menus');
|
|
|
+ function menuClick(value: any) {
|
|
|
+ const arr = value.keyPath;
|
|
|
+ if (arr.length > 1 && arr[1] !== selectedKeys.value[0]) {
|
|
|
+ const first = menuList.value.find((e: OperationTabMenu) => {
|
|
|
+ return e.code === arr[0];
|
|
|
+ });
|
|
|
+ if (first) {
|
|
|
+ const seconde = first.children.find((e: OperationTabMenu) => e.code === arr[1]);
|
|
|
+ seconde && context.emit('chooseMenu', seconde);
|
|
|
+ }
|
|
|
}
|
|
|
- // 一级菜单图标
|
|
|
- function fontIcon(code: string): string {
|
|
|
- let result = 'icon-jinrongfenxi';
|
|
|
- switch (code) {
|
|
|
- case 'market':
|
|
|
- result = 'icon-jinrongfenxi';
|
|
|
- break;
|
|
|
- case 'info':
|
|
|
- result = 'icon-zhangdan';
|
|
|
- break;
|
|
|
- case 'business':
|
|
|
- result = 'icon-renwu';
|
|
|
- break;
|
|
|
- case 'manage':
|
|
|
- result = 'icon-quanxian';
|
|
|
- break;
|
|
|
- case 'search':
|
|
|
- result = 'icon-chazhaojilu';
|
|
|
- break;
|
|
|
- case 'report':
|
|
|
- result = 'icon-bingtu';
|
|
|
- break;
|
|
|
- }
|
|
|
- return '#' + result;
|
|
|
+ }
|
|
|
+ // 一级菜单图标
|
|
|
+ function fontIcon(code: string): string {
|
|
|
+ switch (code) {
|
|
|
+ case 'info':
|
|
|
+ return '#icon-xitong';
|
|
|
+ case 'business':
|
|
|
+ return '#icon-zhangdan';
|
|
|
+ case 'riskmanage':
|
|
|
+ return '#icon-quanxian';
|
|
|
+ case 'riskreview':
|
|
|
+ return '#icon-chazhaojilu';
|
|
|
+ case 'spotreview':
|
|
|
+ return '#icon-jiaoyijilu';
|
|
|
+ case 'inventory':
|
|
|
+ return '#icon-jintiao';
|
|
|
+ case 'financereview':
|
|
|
+ return '#icon-zhangdan2';
|
|
|
+ case 'report':
|
|
|
+ return '#icon-bingtu';
|
|
|
+ default:
|
|
|
+ return '#icon-jinrongfenxi'
|
|
|
}
|
|
|
- return { selectedKeys, menuList, openKeys, preOpenKeys, menuClick, fontIcon };
|
|
|
+ }
|
|
|
+ return { selectedKeys, menuList, openKeys, preOpenKeys, menuClick, fontIcon };
|
|
|
}
|
|
|
|
|
|
export default defineComponent({
|
|
|
- props: {
|
|
|
- collapsed: {
|
|
|
- default: true,
|
|
|
- type: Boolean,
|
|
|
- },
|
|
|
+ props: {
|
|
|
+ collapsed: {
|
|
|
+ default: true,
|
|
|
+ type: Boolean,
|
|
|
},
|
|
|
- setup(props, context) {
|
|
|
- const isBottom = getHasBottom();
|
|
|
- const { selectedKeys, openKeys, menuList, menuClick, preOpenKeys, fontIcon } = handleMenu(context);
|
|
|
- watchEffect(() => {
|
|
|
- if (props.collapsed) {
|
|
|
- preOpenKeys.value = openKeys.value;
|
|
|
- openKeys.value = [];
|
|
|
- } else {
|
|
|
- openKeys.value = preOpenKeys.value;
|
|
|
+ },
|
|
|
+ setup(props, context) {
|
|
|
+ const isBottom = getHasBottom();
|
|
|
+ const { selectedKeys, openKeys, menuList, menuClick, preOpenKeys, fontIcon } = handleMenu(context);
|
|
|
+ watchEffect(() => {
|
|
|
+ if (props.collapsed) {
|
|
|
+ preOpenKeys.value = openKeys.value;
|
|
|
+ openKeys.value = [];
|
|
|
+ } else {
|
|
|
+ openKeys.value = preOpenKeys.value;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ const filterMenu = () => menuList.value.filter((e: OperationTabMenu) => e.path);
|
|
|
+ const route = useRoute();
|
|
|
+ initData(() => {
|
|
|
+ // 处理路由跳转到菜单栏里第一个对应的页面
|
|
|
+ const list = filterMenu();
|
|
|
+ if (list.length && list[0].children && list[0].children.length) {
|
|
|
+ const matched = route.matched;
|
|
|
+ // 处理修改具体某个菜单栏,主要处理页面刷新
|
|
|
+ let firstIndex = 0,
|
|
|
+ secondeIndex = 0;
|
|
|
+ for (let i = 0; i < list.length; i++) {
|
|
|
+ for (let j = 0; j < list[i].children.length; j++) {
|
|
|
+ if (matched[1].name === list[i].children[j].code) {
|
|
|
+ firstIndex = i;
|
|
|
+ secondeIndex = j;
|
|
|
+ break;
|
|
|
}
|
|
|
- });
|
|
|
- const filterMenu = () => menuList.value.filter((e: OperationTabMenu) => e.path);
|
|
|
- const route = useRoute();
|
|
|
- initData(() => {
|
|
|
- // 处理路由跳转到菜单栏里第一个对应的页面
|
|
|
- const list = filterMenu();
|
|
|
- if (list.length && list[0].children && list[0].children.length) {
|
|
|
- const matched = route.matched;
|
|
|
- // 处理修改具体某个菜单栏,主要处理页面刷新
|
|
|
- let firstIndex = 0,
|
|
|
- secondeIndex = 0;
|
|
|
- for (let i = 0; i < list.length; i++) {
|
|
|
- for (let j = 0; j < list[i].children.length; j++) {
|
|
|
- if (matched[1].name === list[i].children[j].code) {
|
|
|
- firstIndex = i;
|
|
|
- secondeIndex = j;
|
|
|
- break;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- const temp = list[firstIndex].children[secondeIndex];
|
|
|
- const code = temp.code;
|
|
|
- // warn: Set operation on key "default" failed: target is readonly
|
|
|
- selectedKeys.value = [code];
|
|
|
- openKeys.value = [list[firstIndex].code];
|
|
|
- context.emit('chooseMenu', temp);
|
|
|
- }
|
|
|
- });
|
|
|
- return { selectedKeys, openKeys, filterMenu, menuClick, fontIcon, isBottom };
|
|
|
- },
|
|
|
+ }
|
|
|
+ }
|
|
|
+ const temp = list[firstIndex].children[secondeIndex];
|
|
|
+ const code = temp.code;
|
|
|
+ // warn: Set operation on key "default" failed: target is readonly
|
|
|
+ selectedKeys.value = [code];
|
|
|
+ openKeys.value = [list[firstIndex].code];
|
|
|
+ context.emit('chooseMenu', temp);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ return { selectedKeys, openKeys, filterMenu, menuClick, fontIcon, isBottom };
|
|
|
+ },
|
|
|
});
|
|
|
</script>
|
|
|
<style lang="less">
|