diff --git a/src/App.js b/src/App.js index e7c3983..84591f4 100644 --- a/src/App.js +++ b/src/App.js @@ -1,13 +1,14 @@ import './App.css'; -import React, {Component} from 'react'; +import React, {useContext} from 'react'; import { HomeOutlined, TeamOutlined, DashboardOutlined, FileProtectOutlined, CustomerServiceTwoTone, + UserOutlined } from '@ant-design/icons'; -import {Layout, Menu, Image} from 'antd'; +import {Layout, Menu, Image, Spin} from 'antd'; import {BrowserRouter, Route, Routes, NavLink} from "react-router-dom" import Home from "./views/Home" import Dashboard from "./views/Dashboard" @@ -18,85 +19,87 @@ import Customer_care_inchina from "./charts/Customer_care_inchina" import Customer_care_potential from "./charts/Customer_care_potential" import Customer_care_regular from "./charts/Customer_care_regular" import Logo from './logo.png' +import {stores_Context} from "./config"; +import {observer} from "mobx-react"; -class App extends Component { +const App = () => { - render() { - const {Content, Footer, Sider} = Layout; + const {Content, Footer, Sider} = Layout; + const {auth_store} = useContext(stores_Context); - const menu_items = [ - {key: 1, label: 主页, icon: }, - {key: 2, label: 订单数据, icon: ,}, - {key: 5, label: 仪表盘, icon: }, - { - key: 3, label: '客运', icon: , - children: [ - {key: 31, label: 潜力客户}, - {key: 32, label: 老客户}, - {key: 33, label: 在华客户}, - ] - }, - { - key: 4, - label: '财务', - icon: , - children: [ - {key: 412, label: 损益表}, - {key: 41, label: 信用卡账单}, - {key: 42, label: 测试登陆}, - ] - }, + const menu_items = [ + {key: 1, label: 主页, icon: }, + {key: 2, label: 订单数据, icon: ,}, + {key: 5, label: 仪表盘, icon: }, + { + key: 3, label: '客运', icon: , + children: [ + {key: 31, label: 潜力客户}, + {key: 32, label: 老客户}, + {key: 33, label: 在华客户}, + ] + }, + { + key: 4, + label: '财务', + icon: , + children: [ + {key: 412, label: 损益表}, + {key: 41, label: 信用卡账单}, + ] + }, - ]; + ]; - return ( - - - - - - - - - - }> - }/> - }/> - }/> - }/> - - }> - }/> - }/> - }/> - - - -
- Hainatravel Dashboard ©2022 Created by IT -
- + return ( + + + + + + + + + + }/> + }> + }/> + }/> + }/> + + }> + }/> + }/> + }/> + + + +
+ {auth_store.user.name} ({auth_store.user.userid})
+ Hainatravel Dashboard ©2022 Created by IT +
- - ); - } + + + ); + } -export default App; +export default observer(App); diff --git a/src/config.js b/src/config.js index a07dcf8..5d3c28c 100644 --- a/src/config.js +++ b/src/config.js @@ -2,5 +2,5 @@ import React from "react"; export const stores_Context = React.createContext(); export const DATE_FORMAT = 'YYYY-MM-DD'; -export const HT_HOST = 'https://p9axztuwd7x8a7.mycht.cn'; -//export const HT_HOST = 'http://202.103.68.100:890';//889正式库 \ No newline at end of file +//export const HT_HOST = 'https://p9axztuwd7x8a7.mycht.cn'; +export const HT_HOST = 'http://202.103.68.100:890';//889正式库 \ No newline at end of file diff --git a/src/index.js b/src/index.js index e4cd1fa..9227a64 100644 --- a/src/index.js +++ b/src/index.js @@ -5,6 +5,7 @@ import App from './App'; import reportWebVitals from './reportWebVitals'; import {stores_Context} from './config' import rootStore from "./stores/Index" +import {Spin} from "antd"; const root = ReactDOM.createRoot(document.getElementById('root')); diff --git a/src/stores/AuthStore.js b/src/stores/AuthStore.js index 076068e..1d9c6cc 100644 --- a/src/stores/AuthStore.js +++ b/src/stores/AuthStore.js @@ -1,7 +1,6 @@ import {makeAutoObservable, runInAction} from "mobx"; import * as dd from 'dingtalk-jsapi'; import * as config from "../config"; -import {Outlet, Navigate} from 'react-router-dom'; //权限管理 @@ -10,10 +9,11 @@ class AuthStore { constructor(rootStore) { this.rootStore = rootStore; makeAutoObservable(this); - this.get_auth_info(); + this.get_auth(); } auth = []; + user = {}; has_permission(requireds) { if (Object.keys(requireds).length == 0) { @@ -26,25 +26,24 @@ class AuthStore { return false; } - get_auth_info() { - if (this.auth == false) { //如果没有权限，则去请求获取 - this.auth = ['customer_care']; - } - return; + //请求权限 + get_auth() { + let _this = this; const CORPID = 'ding48bce8fd3957c96b';//企业的id dd.runtime.permission.requestAuthCode({ corpId: CORPID, onSuccess: function (res) { + console.log(res); let code = res.code; - runInAction(() => { - this.auth = ['admin']; - }) - let url = '?code=' + code; + let url = '/dingtalk/dingtalkwork/Getusers_auth?code=' + code; //请求获取HT接口获取用户权限和用户信息 fetch(config.HT_HOST + url) .then((response) => response.json()) .then((json) => { - console.log(json); + runInAction(() => { + _this.user = json.result; + _this.auth = json.result.authlist; + }) }) .catch((error) => { console.log('fetch data failed', error); diff --git a/src/views/Home.js b/src/views/Home.js index a15193f..bbc8314 100644 --- a/src/views/Home.js +++ b/src/views/Home.js @@ -3,6 +3,13 @@ import {observer} from 'mobx-react'; import {Row, Col, Button, Tabs, Table} from 'antd'; import {stores_Context} from '../config' import {useNavigate} from "react-router-dom"; +import { + SlackOutlined, + SketchOutlined, + AntCloudOutlined, + RedditOutlined, + GithubOutlined +} from '@ant-design/icons'; const Home = () => { @@ -11,8 +18,11 @@ const Home = () => { return (
+ +
这就是一个主页,什么也没写 - +
+
); diff --git a/src/views/ProtectedRoute.js b/src/views/ProtectedRoute.js index dddefd6..670b24e 100644 --- a/src/views/ProtectedRoute.js +++ b/src/views/ProtectedRoute.js @@ -1,5 +1,5 @@ import React, {useContext, useEffect} from 'react'; -import {Row, Col, Button, Tabs, Table, Result, Space} from 'antd'; +import {Row, Col, Button, Tabs, Spin, Result, Space} from 'antd'; import { ContainerOutlined, SearchOutlined, @@ -15,8 +15,9 @@ 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 + return } return ( @@ -24,8 +25,8 @@ const ProtectedRoute = ({auth}) => { auth_store.get_auth_info()}>测试免登 } + subTitle={"试着联系一下技术，所需权限: "+auth.toString()} + extra='' /> );