权限管理
尹诚诚
3 years ago
parent
ec8b39c08d
commit
c88f0118d9
@ -0,0 +1,62 @@
|
||||
import {makeAutoObservable, runInAction} from "mobx";
|
||||
import * as dd from 'dingtalk-jsapi';
|
||||
import * as config from "../config";
|
||||
import {Outlet, Navigate} from 'react-router-dom';
|
||||
|
||||
|
||||
//权限管理
|
||||
class AuthStore {
|
||||
|
||||
constructor(rootStore) {
|
||||
this.rootStore = rootStore;
|
||||
makeAutoObservable(this);
|
||||
this.get_auth_info();
|
||||
}
|
||||
|
||||
auth = [];
|
||||
|
||||
has_permission(requireds) {
|
||||
if (Object.keys(requireds).length == 0) {
|
||||
return true;
|
||||
}
|
||||
let has_permission = requireds.filter(item => this.auth.includes(item));
|
||||
if (Object.keys(has_permission).length !== 0) {
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
get_auth_info() {
|
||||
if (this.auth == false) { //如果没有权限，则去请求获取
|
||||
this.auth = ['customer_care'];
|
||||
}
|
||||
return;
|
||||
const CORPID = 'ding48bce8fd3957c96b';//企业的id
|
||||
dd.runtime.permission.requestAuthCode({
|
||||
corpId: CORPID,
|
||||
onSuccess: function (res) {
|
||||
let code = res.code;
|
||||
runInAction(() => {
|
||||
this.auth = ['admin'];
|
||||
})
|
||||
let url = '?code=' + code;
|
||||
//请求获取HT接口获取用户权限和用户信息
|
||||
fetch(config.HT_HOST + url)
|
||||
.then((response) => response.json())
|
||||
.then((json) => {
|
||||
console.log(json);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log('fetch data failed', error);
|
||||
});
|
||||
},
|
||||
onFail: function (err) {
|
||||
console.log(err)
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export default AuthStore;
|
||||
|
||||
@ -1,23 +1,21 @@
|
||||
import React, {Component} from 'react';
|
||||
import { observer } from 'mobx-react';
|
||||
import React, {Component, useContext} from 'react';
|
||||
import {observer} from 'mobx-react';
|
||||
import {Row, Col, Button, Tabs, Table} from 'antd';
|
||||
import {stores_Context} from '../config'
|
||||
import {useNavigate} from "react-router-dom";
|
||||
|
||||
class Home extends Component {
|
||||
static contextType = stores_Context;
|
||||
const Home = () => {
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
}
|
||||
|
||||
render() {
|
||||
const {orders_store} = this.context;
|
||||
const navigate = useNavigate();
|
||||
const {auth_store} = useContext(stores_Context);
|
||||
|
||||
return (
|
||||
<div>
|
||||
这就是一个主页,什么也没写
|
||||
<Button onClick={() => navigate('/auth')}>跳转</Button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export default observer(Home);
|
||||
|
||||
@ -0,0 +1,36 @@
|
||||
import React, {useContext, useEffect} from 'react';
|
||||
import {Row, Col, Button, Tabs, Table, Result, Space} from 'antd';
|
||||
import {
|
||||
ContainerOutlined,
|
||||
SearchOutlined,
|
||||
} from '@ant-design/icons';
|
||||
import {stores_Context} from '../config'
|
||||
import {Line} from "@ant-design/charts";
|
||||
import {observer} from 'mobx-react';
|
||||
import DatePickerCharts from '../charts/DatePickerCharts'
|
||||
import {NavLink, useParams} from "react-router-dom";
|
||||
import * as comm from "../utils/commons";
|
||||
import * as config from "../config";
|
||||
import {Outlet, useOutlet, useLocation, useNavigate} from 'react-router-dom';
|
||||
|
||||
const ProtectedRoute = ({auth}) => {
|
||||
const {auth_store} = useContext(stores_Context);
|
||||
if (auth_store.has_permission(auth)) {
|
||||
return <Outlet/>
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Result
|
||||
status="403"
|
||||
title="403 权限不足"
|
||||
subTitle={"试着联系一下技术 " + auth_store.code}
|
||||
extra={<Button type="primary" onClick={() => auth_store.get_auth_info()}>测试免登 </Button>}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
|
||||
|
||||
}
|
||||
export default observer(ProtectedRoute);
|
||||
|
||||
Loading…
Reference in New Issue