blackteay/fes.js
1
0
Fork 0
mirror of https://github.com/WeBankFinTech/fes.js.git synced 2025-04-06 03:59:53 +08:00
Code Issues Projects Releases Wiki Activity

Merge branch 'master' of https://github.com/WeBankFinTech/fes.js

Browse Source
This commit is contained in:
winixt 2022-01-06 10:12:35 +08:00
commit 36cbce55d1
22 changed files with 168 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
docs/reference/plugin/plugins/layout.md
View File

@ -56,21 +56,21 @@ export default {
}
</config>
```
如果只是不想展示`side`，则：
如果只是不想展示`sidebar`，则：
```
<config lang="json">
{
"layout": {
"side": false
"sidebar": false
}
}
</config>
```
`layout`的可选配置有：
- **side**： 左侧区域
- **sidebar**： 左侧区域，从v4.0.0开始，之前名称叫`side`
- **top**： 头部区域
- **header**： 头部区域,，从v4.0.0开始，之前名称叫`top`
- **logo**：logo和标题区域。
@ -182,6 +182,15 @@ export default {
- **name**：菜单的名称。通过匹配 `name` 和路由元信息 [meta](../../../guide/route.md#扩展路由元信息) 中的 `name`，把菜单和路由关联起来，然后使用路由元信息补充菜单配置，比如 `title`、`path` 等。
- **path**：菜单的路径，可配置第三方地址。
- **match**：额外匹配的路径，当前路由命中匹配规则时，此菜单高亮。 (v4.0.0+）
```
{
path: '/product',
match: ['/product/*', '/product/create']
}
```
- **title**：菜单的标题，如果同时使用[国际化插件](./locale.md)，而且`title`的值以`$`开头，则使用`$`后面的内容去匹配语言设置。

17
docs/zh/reference/plugin/plugins/layout.md
View File

@ -56,21 +56,21 @@ export default {
}
</config>
```
如果只是不想展示`side`，则：
如果只是不想展示`sidebar`，则：
```
<config lang="json">
{
"layout": {
"side": false
"sidebar": false
}
}
</config>
```
`layout`的可选配置有：
- **side**： 左侧区域
- **sidebar**： 左侧区域，从v4.0.0开始，之前名称叫`side`
- **top**： 头部区域
- **header**： 头部区域,，从v4.0.0开始，之前名称叫`top`
- **logo**：logo和标题区域。
@ -182,6 +182,15 @@ export default {
- **name**：菜单的名称。通过匹配 `name` 和路由元信息 [meta](../../../guide/route.md#扩展路由元信息) 中的 `name`，把菜单和路由关联起来，然后使用路由元信息补充菜单配置，比如 `title`、`path` 等。
- **path**：菜单的路径，可配置第三方地址。
- **match**：额外匹配的路径，当前路由命中匹配规则时，此菜单高亮。 (v4.0.0+）
```
{
path: '/product',
match: ['/product/*', '/product/create']
}
```
- **title**：菜单的标题，如果同时使用[国际化插件](./locale.md)，而且`title`的值以`$`开头，则使用`$`后面的内容去匹配语言设置。

2
packages/create-fes-app/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@fesjs/create-fes-app",
"version": "2.1.1",
"version": "2.1.2",
"description": "create a app base on fes.js",
"main": "lib/index.js",
"files": [

1
packages/create-fes-app/templates/app/h5/.npmrc Normal file
View File

@ -0,0 +1 @@
public-hoist-pattern[]=@babel/*

3
packages/create-fes-app/templates/app/h5/package.json
View File

@ -48,7 +48,8 @@
"@fesjs/fes": "^2.0.0",
"@fesjs/plugin-icon": "^2.0.0",
"@fesjs/plugin-request": "^2.0.0",
"vue": "^3.2.6"
"vue": "^3.2.6",
"core-js": "^3.8.3"
},
"private": true
}

1
packages/create-fes-app/templates/app/pc/.fes.js
View File

@ -12,6 +12,7 @@ export default {
layout: {
title: "Fes.js",
footer: 'Created by MumbleFE',
navigation: 'mixin',
multiTabs: false,
menus: [{
name: 'index'

1
packages/create-fes-app/templates/app/pc/.npmrc Normal file
View File

@ -0,0 +1 @@
public-hoist-pattern[]=@babel/*

3
packages/create-fes-app/templates/app/pc/package.json
View File

@ -53,7 +53,8 @@
"@fesjs/plugin-model": "^2.0.0",
"@fesjs/plugin-enums": "^2.0.0",
"@fesjs/fes-design": "^0.1.10",
"vue": "^3.2.6"
"vue": "^3.2.6",
"core-js": "^3.8.3"
},
"private": true
}

3
packages/create-fes-app/templates/app/pc/src/global.less Normal file
View File

@ -0,0 +1,3 @@
body, html {
margin: 0;
}

2
packages/fes-plugin-layout/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@fesjs/plugin-layout",
"version": "3.0.0",
"version": "4.0.0",
"description": "@fesjs/plugin-layout",
"main": "lib/index.js",
"files": [

9
packages/fes-plugin-layout/src/runtime/helpers/utils.js Normal file
View File

@ -0,0 +1,9 @@
export const flatNodes = (nodes = []) => nodes.reduce((res, node) => {
res.push(node);
if (node.children) {
res = res.concat(
flatNodes(node.children)
);
}
return res;
}, []);

14
packages/fes-plugin-layout/src/runtime/views/BaseLayout.vue
View File

@ -2,7 +2,7 @@
<f-layout v-if="routeLayout" class="main-layout">
<template v-if="navigation === 'side'">
<f-aside
v-if="routeLayout.side"
v-if="routeLayout.sidebar"
v-model:collapsed="collapsed"
:fixed="fixedSideBar"
class="layout-aside"
@ -32,7 +32,7 @@
}"
>
<f-header
v-if="routeLayout.top"
v-if="routeLayout.header"
class="layout-header"
:fixed="currentFixedHeader"
>
@ -59,7 +59,7 @@
</template>
<template v-if="navigation === 'top'">
<f-header
v-if="routeLayout.top"
v-if="routeLayout.header"
class="layout-header"
:inverted="theme === 'dark'"
:fixed="currentFixedHeader"
@ -96,7 +96,7 @@
</template>
<template v-if="navigation === 'mixin'">
<f-header
v-if="routeLayout.top"
v-if="routeLayout.header"
class="layout-header"
:fixed="currentFixedHeader"
:inverted="theme === 'dark'"
@ -117,7 +117,7 @@
:style="{ top: currentFixedHeader ? '54px' : 'auto' }"
>
<f-aside
v-if="routeLayout.side"
v-if="routeLayout.sidebar"
v-model:collapsed="collapsed"
:fixed="fixedSideBar"
collapsible
@ -226,8 +226,8 @@ export default {
key: 'layout',
type: ApplyPluginsType.modify,
initialValue: {
side: true,
top: true,
sidebar: true,
header: true,
logo: true
}
});

22
packages/fes-plugin-layout/src/runtime/views/Menu.vue
View File

@ -1,6 +1,6 @@
<template>
<f-menu
:modelValue="route.path"
:modelValue="activePath"
:inverted="inverted"
:mode="mode"
:options="fixedMenus"
@ -15,6 +15,7 @@ import { useRoute, useRouter } from '@@/core/coreExports';
import MenuIcon from './MenuIcon';
import { transform as transformByAccess } from '../helpers/pluginAccess';
import { transform as transformByLocale } from '../helpers/pluginLocale';
import { flatNodes } from '../helpers/utils';
export default {
components: {
@ -56,6 +57,23 @@ export default {
return copy;
});
const fixedMenus = computed(() => transformByLocale(transformByAccess(transform(props.menus))));
const menus = computed(() => flatNodes(fixedMenus.value));
const activePath = computed(() => {
const matchMenus = menus.value.filter((menu) => {
const match = menu.match;
if (!match || !Array.isArray(match)) {
return false;
}
return match.some((str) => {
const reg = new RegExp(str);
return reg.test(route.path);
});
});
if (matchMenus.length === 0) {
return route.path;
}
return matchMenus[0].path;
});
const onMenuClick = (e) => {
const path = e.value;
if (/^https?:\/\//.test(path)) {
@ -69,7 +87,7 @@ export default {
}
};
return {
route,
activePath,
fixedMenus,
onMenuClick
};

5
packages/fes-preset-built-in/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@fesjs/preset-built-in",
"version": "2.0.12",
"version": "2.0.14",
"description": "@fesjs/preset-built-in",
"main": "lib/index.js",
"types": "lib/index.d.ts",
@ -73,6 +73,7 @@
"webpackbar": "^5.0.0-3"
},
"peerDependencies": {
"@vue/compiler-sfc": "^3.0.5"
"@vue/compiler-sfc": "^3.0.5",
"core-js": "^3.8.3"
}
}

BIN
packages/fes-preset-built-in/src/plugins/commands/dev/fes.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 33 KiB

After

Width:  |  Height:  |  Size: 50 KiB

1
packages/fes-preset-built-in/src/plugins/commands/webpackConfig/index.js
View File

@ -82,6 +82,7 @@ export default async function getConfig({
// --------------- cache -----------
webpackConfig.cache({
type: 'filesystem',
version: require('../../../../package.json').version,
cacheDirectory: join(cwd, '.cache/webpack')
});

20
packages/fes-template/.fes.js
View File

@ -1,7 +1,7 @@
// .fes.js 只负责管理编译时配置，只能使用plain Object
export default {
// exportStatic: {},
// exportStatic: {},
define: {
__DEV__: false
},
@ -10,12 +10,12 @@ export default {
title: '海贼王'
},
router: {
mode: 'history'
mode: 'hash'
},
access: {
roles: {
admin: ['*'],
menuTest: ['/','/menuTest']
menuTest: ['/', '/menuTest']
}
},
request: {
@ -39,7 +39,8 @@ export default {
menus: [
{
name: 'index',
icon: '/wine-outline.svg'
icon: '/wine-outline.svg',
match: ['/route/*']
},
{
name: 'store'
@ -54,18 +55,21 @@ export default {
path: 'https://www.baidu.com'
},
{
title: '菜单权限测试',
name: 'mock'
},
{
title: '菜单权限测试',
children: [
{
title: '子菜单',
path: '/menuTest',
path: '/menuTest'
},
{
title: '子菜单a',
path: '/menuTest/a'
},
}
]
},
},
{
name: 'cssModule'
}

3
packages/fes-template/src/locales/en-US.js
View File

@ -3,5 +3,6 @@ export default {
home: 'home',
store: 'store',
editor: 'editor',
externalLink: 'externalLink'
externalLink: 'externalLink',
mock: 'mock'
};

3
packages/fes-template/src/locales/zh-CN.js
View File

@ -3,5 +3,6 @@ export default {
home: '首页',
store: '状态管理',
editor: '编辑器',
externalLink: '外部链接'
externalLink: '外部链接',
mock: '代理'
};

49
packages/fes-template/src/pages/mock.vue Normal file
View File

@ -0,0 +1,49 @@
<template>
<div>
mock and proxy
</div>
</template>
<config>
{
"name": "mock",
"title": "$mock"
}
</config>
<script setup>
import { request } from '@fesjs/fes';
console.log('测试 mock!!');
request('/v2/file')
.then((data) => {
console.log(data);
})
.catch((err) => {
console.log(err);
});
request('/v2/movie/in_theaters_mock', { a: 1 }, 'get')
.then((data) => {
console.log(data);
})
.catch((err) => {
console.log(err);
});
console.log('测试 proxy!!');
request(
'/v2/movie/in_theaters_proxy',
{ a: 1 },
{
method: 'get',
headers: { Accept: '*/*' }
}
)
.then((resp) => {
console.log(resp);
})
.catch((err) => {
console.log(err);
});
</script>

23
packages/fes-template/src/pages/route/@id.vue Normal file
View File

@ -0,0 +1,23 @@
<template>
<div>
{{params.id}}
</div>
</template>
<config>
{
"name": "activeRoute",
"title": "动态路由"
}
</config>
<script>
import { useRoute } from '@fesjs/fes';
export default {
setup() {
const { params } = useRoute();
return {
params
};
}
};
</script>

4
packages/fes/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@fesjs/fes",
"version": "2.0.13",
"version": "2.0.15",
"description": "一个好用的前端管理台快速开发框架",
"preferGlobal": true,
"scripts": {
@ -39,7 +39,7 @@
],
"dependencies": {
"@fesjs/compiler": "^2.0.3",
"@fesjs/preset-built-in": "^2.0.12",
"@fesjs/preset-built-in": "^2.0.14",
"@fesjs/runtime": "^2.0.2",
"@fesjs/utils": "^2.0.3",
"resolve-cwd": "^3.0.0"