- 添加菜单权限控制

- url 权限控制

admin-web/src/models/login.js

@@ -4,6 +4,7 @@ import { fakeAccountLogin, getFakeCaptcha } from '@/services/api';
 import { setAuthority } from '@/utils/authority';
 import { getPageQuery } from '@/utils/utils';
 import { reloadAuthorized } from '@/utils/Authorized';
+import { setLoginToken } from '../utils/cache';
 
 export default {
   namespace: 'login',
@@ -19,8 +20,15 @@ export default {
         type: 'changeLoginStatus',
         payload: response,
       });
+      yield put(routerRedux.replace('/'));
+
       // Login successfully
-      if (response.status === 'ok') {
+      if (response.code === 0) {
+        // 保存 token 到 localStorage，发送请求的时候，会自动取 token 放到 header
+        setLoginToken(response.data.accessToken, response.data.refreshToken);
+        // 此处直接设置为 admin、和 user 角色，因为暂时不做服务控制前段 角色
+        setAuthority(['admin', 'user']);
+
         reloadAuthorized();
         const urlParams = new URL(window.location.href);
         const params = getPageQuery();

admin-web/src/pages/Authorized.js

@@ -4,10 +4,16 @@ import { getAuthority } from '@/utils/authority';
 import Redirect from 'umi/redirect';
 
 const Authority = getAuthority();
+
+// TODO RenderAuthorized 暂时写死为 admin，次组件集成于 antd-pro 后期有时间处理，（可能有用，可能没用）
+// TODO 可大致分为两种角色，admin 管理员角色，user 代表其他非授权页面，可以公开的
+// const Authorized = RenderAuthorized(['admin', 'user']);
 const Authorized = RenderAuthorized(Authority);
 
-export default ({ children }) => (
-  <Authorized authority={children.props.route.authority} noMatch={<Redirect to="/user/login" />}>
-    {children}
-  </Authorized>
-);
+export default ({ children }) => {
+  return (
+    <Authorized authority={children.props.route.authority} noMatch={<Redirect to="/user/login" />}>
+      {children}
+    </Authorized>
+  );
+};

admin-web/src/pages/User/Login.js

@@ -24,7 +24,7 @@ class LoginPage extends Component {
 
   onGetCaptcha = () =>
     new Promise((resolve, reject) => {
-      this.loginForm.validateFields(['mobile'], {}, (err, values) => {
+      this.loginForm.validateFields(['username'], {}, (err, values) => {
         if (err) {
           reject(err);
         } else {
@@ -82,7 +82,7 @@ class LoginPage extends Component {
               !submitting &&
               this.renderMessage(formatMessage({ id: 'app.login.message-invalid-credentials' }))}
             <UserName
-              name="userName"
+              name="username"
               placeholder={`${formatMessage({ id: 'app.login.userName' })}: admin or user`}
               rules={[
                 {
@@ -93,7 +93,7 @@ class LoginPage extends Component {
             />
             <Password
               name="password"
-              placeholder={`${formatMessage({ id: 'app.login.password' })}: ant.design`}
+              placeholder={`${formatMessage({ id: 'app.login.password' })}: admin`}
               rules={[
                 {
                   required: true,
@@ -114,7 +114,7 @@ class LoginPage extends Component {
                 formatMessage({ id: 'app.login.message-invalid-verification-code' })
               )}
             <Mobile
-              name="mobile"
+              name="username"
               placeholder={formatMessage({ id: 'form.phone-number.placeholder' })}
               rules={[
                 {
@@ -128,7 +128,7 @@ class LoginPage extends Component {
               ]}
             />
             <Captcha
-              name="captcha"
+              name="password"
               placeholder={formatMessage({ id: 'form.verification-code.placeholder' })}
               countDown={120}
               onGetCaptcha={this.onGetCaptcha}

admin-web/src/services/api.js

@@ -104,7 +104,7 @@ export async function updateFakeList(params) {
 }
 
 export async function fakeAccountLogin(params) {
-  return request('/api/login/account', {
+  return request(`/admin-api/admin/passport/login/?${stringify(params)}`, {
     method: 'POST',
     body: params,
   });