21 |
26 | )
27 | }
28 |
29 |
30 | Loader.propTypes = {
31 | spinning: PropTypes.bool,
32 | fullScreen: PropTypes.bool,
33 | }
34 |
35 | export default Loader
36 |
--------------------------------------------------------------------------------
/src/components/Iconfont/Iconfont.tsx:
--------------------------------------------------------------------------------
1 | import React, { FC } from 'react'
2 | import PropTypes from 'prop-types'
3 | import classnames from 'classnames'
4 | import './iconfont.less'
5 |
6 | type Props = {
7 | type: string
8 | colorful?: boolean
9 | className?: string
10 | }
11 |
12 | // #----------- 上: ts类型定义 ----------- 分割线 ----------- 下: JS代码 -----------
13 |
14 | const Iconfont: FC
22 |
23 |
25 | LOADING
24 |
29 | {loading ?
32 | )
33 | }
34 |
35 | static propTypes = {
36 | className: PropTypes.string,
37 | children: PropTypes.node,
38 | loading: PropTypes.bool,
39 | inner: PropTypes.bool,
40 | }
41 | }
42 |
--------------------------------------------------------------------------------
/src/models/login.ts:
--------------------------------------------------------------------------------
1 | import { routerRedux } from 'dva/router'
2 | import * as loginService from '@services/login'
3 | import { modelExtend } from './common'
4 | import { defaultPageInfo, loginRouter } from '@config';
5 | import { ReduxSagaEffects, ReduxAction } from '@ts-types';
6 |
7 | export default modelExtend({
8 | namespace: 'login',
9 |
10 | state: {},
11 |
12 | effects: {
13 | * login({ payload }: ReduxAction, { put, call, select }: ReduxSagaEffects) {
14 | const data = yield call(loginService.login, payload)
15 | const { locationQuery } = yield select(_ => _.app)
16 | if (data.success) {
17 | const { from } = locationQuery
18 | yield put({ type: 'app/query' })
19 | if (from && from !== loginRouter) {
20 | yield put(routerRedux.push(from))
21 | } else {
22 | yield put(routerRedux.push(defaultPageInfo.router))
23 | }
24 | } else {
25 | console.warn('login-login 报错');
26 | }
27 | },
28 |
29 | * logout({ payload }: ReduxAction, { call, put }: ReduxSagaEffects) {
30 | const data = yield call(loginService.logout)
31 | if (data.success) {
32 | yield put({ type: 'app/query' })
33 | } else {
34 | console.warn('app-logout 报错');
35 | }
36 | },
37 | },
38 |
39 | })
40 |
--------------------------------------------------------------------------------
/mock/common.js:
--------------------------------------------------------------------------------
1 | const Mock = require('mockjs')
2 | const config = require('../src/config')
3 | const apis = require('../src/config/apis')
4 |
5 | const queryArray = (array, key, keyAlias = 'key') => {
6 | if (!(array instanceof Array)) {
7 | return null
8 | }
9 | let data
10 |
11 | for (const item of array) {
12 | if (item[keyAlias] === key) {
13 | data = item
14 | break
15 | }
16 | }
17 |
18 | if (data) {
19 | return data
20 | }
21 | return null
22 | }
23 |
24 | const NOTFOUND = {
25 | message: 'Not Found',
26 | documentation_url: 'http://localhost:8000/request',
27 | }
28 |
29 |
30 | let postId = 0
31 | const posts = Mock.mock({
32 | 'data|100': [
33 | {
34 | id () {
35 | postId += 1
36 | return postId + 10000
37 | },
38 | 'status|1-2': 1,
39 | title: '@title',
40 | author: '@last',
41 | categories: '@word',
42 | tags: '@word',
43 | 'views|10-200': 1,
44 | 'comments|10-200': 1,
45 | visibility: () => {
46 | return Mock.mock('@pick(["Public",'
47 | + '"Password protected", '
48 | + '"Private"])')
49 | },
50 | date: '@dateTime',
51 | image () {
52 | return Mock.Random.image('100x100', Mock.Random.color(), '#757575', 'png', this.author.substr(0, 1))
53 | },
54 | },
55 | ],
56 | }).data
57 |
58 | module.exports = {
59 | queryArray,
60 | NOTFOUND,
61 | Mock,
62 | posts,
63 | config,
64 | apis,
65 | }
66 |
--------------------------------------------------------------------------------
/.roadhogrc.js:
--------------------------------------------------------------------------------
1 | const path = require('path')
2 | const { version } = require('./package.json')
3 |
4 | const svgSpriteDirs = [
5 | path.resolve(__dirname, 'src/svg/'),
6 | require.resolve('antd').replace(/index\.js$/, '')
7 | ]
8 |
9 | export default {
10 | entry: 'src/index.tsx',
11 | svgSpriteLoaderDirs: svgSpriteDirs,
12 | theme: "./theme.config.js",
13 | publicPath: `/${version}/`,
14 | outputPath: `./dist/${version}`,
15 | // 接口代理示例
16 | proxy: {
17 | "/api/v1/weather": {
18 | "target": "https://api.seniverse.com/",
19 | "changeOrigin": true,
20 | "pathRewrite": { "^/api/v1/weather": "/v3/weather" }
21 | },
22 | // "/api/v2": {
23 | // "target": "http://192.168.0.110",
24 | // "changeOrigin": true,
25 | // "pathRewrite": { "^/api/v2" : "/api/v2" }
26 | // }
27 | },
28 | env: {
29 | development: {
30 | extraBabelPlugins: [
31 | "dva-hmr",
32 | "transform-runtime",
33 | [
34 | "import", {
35 | "libraryName": "antd",
36 | "style": true
37 | }
38 | ]
39 | ]
40 | },
41 | production: {
42 | extraBabelPlugins: [
43 | "transform-runtime",
44 | [
45 | "import", {
46 | "libraryName": "antd",
47 | "style": true
48 | }
49 | ]
50 | ]
51 | }
52 | },
53 | dllPlugin: {
54 | exclude: ["babel-runtime", "roadhog", "cross-env"],
55 | include: ["dva/router", "dva/saga", "dva/fetch"]
56 | }
57 | }
58 |
--------------------------------------------------------------------------------
/src/components/Loader/Loader.less:
--------------------------------------------------------------------------------
1 | .loader {
2 | display: block;
3 | background-color: #fff;
4 | width: 100%;
5 | position: absolute;
6 | top: 0;
7 | bottom: 0;
8 | left: 0;
9 | z-index: 100000;
10 | display: flex;
11 | justify-content: center;
12 | align-items: center;
13 | opacity: 1;
14 | text-align: center;
15 |
16 | &.fullScreen {
17 | position: fixed;
18 | }
19 |
20 | .warpper {
21 | width: 100px;
22 | height: 100px;
23 | display: inline-flex;
24 | flex-direction: column;
25 | justify-content: space-around;
26 | }
27 |
28 | .inner {
29 | width: 40px;
30 | height: 40px;
31 | margin: 0 auto;
32 | text-indent: -12345px;
33 | border-top: 1px solid rgba(0, 0, 0, 0.08);
34 | border-right: 1px solid rgba(0, 0, 0, 0.08);
35 | border-bottom: 1px solid rgba(0, 0, 0, 0.08);
36 | border-left: 1px solid rgba(0, 0, 0, 0.7);
37 | border-radius: 50%;
38 | z-index: 100001;
39 |
40 | :local {
41 | animation: spinner 600ms infinite linear;
42 | }
43 | }
44 |
45 | .text {
46 | width: 100px;
47 | height: 20px;
48 | text-align: center;
49 | font-size: 12px;
50 | letter-spacing: 4px;
51 | color: #000;
52 | }
53 |
54 | &.hidden {
55 | z-index: -1;
56 | opacity: 0;
57 | transition: opacity 1s ease 0.5s, z-index 0.1s ease 1.5s;
58 | }
59 | }
60 | @keyframes spinner {
61 | 0% {
62 | transform: rotate(0deg);
63 | }
64 |
65 | 100% {
66 | transform: rotate(360deg);
67 | }
68 | }
69 |
--------------------------------------------------------------------------------
/src/models/common.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * 公共 model
3 | * @author ronffy
4 | */
5 | import _modelExtend from 'dva-model-extend'
6 | import { DvaModel } from '@ts-types';
7 |
8 | const commonModel = {
9 | reducers: {
10 | updateState (state: any, { payload }: any) {
11 | return {
12 | ...state,
13 | ...payload,
14 | }
15 | },
16 | error(state: any, { payload }: any) {
17 | return {
18 | ...state,
19 | error: payload,
20 | }
21 | },
22 | },
23 | }
24 |
25 | const modelExtend =
40 |
50 | )
51 | }
52 |
53 | Sider.propTypes = {
54 | menu: PropTypes.array,
55 | siderFold: PropTypes.bool,
56 | darkTheme: PropTypes.bool,
57 | changeTheme: PropTypes.func,
58 | navOpenKeys: PropTypes.array,
59 | changeOpenKeys: PropTypes.func,
60 | }
61 |
62 | export default Sider
63 |
--------------------------------------------------------------------------------
/src/router.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import PropTypes from 'prop-types'
3 | import { Switch, Route, Redirect, routerRedux } from 'dva/router'
4 | import dynamic from 'dva/dynamic'
5 | import App from './routes/app'
6 | import { defaultPageInfo } from './config';
7 | import { DvaApp, History } from '@ts-types';
8 |
9 | const { ConnectedRouter } = routerRedux
10 |
11 | type Props = {
12 | history: History
13 | app: DvaApp
14 | }
15 |
16 | const Routers = function ({ history, app }: Props) {
17 | const error = dynamic({
18 | app,
19 | component: () => import('./routes/error'),
20 | })
21 | const routes = [
22 | {
23 | path: '/home',
24 | models: () => [import('./models/home')],
25 | component: () => import('./routes/home'),
26 | }, {
27 | path: '/login',
28 | models: () => [import('./models/login')],
29 | component: () => import('./routes/login'),
30 | }
31 | ]
32 |
33 | return (
34 |
41 | 
42 | {siderFold ? '' : {config.name}}
43 |
44 |
46 |
: ''}
49 |
29 |
64 | )
65 | }
66 |
67 | Login.propTypes = {
68 | form: PropTypes.object,
69 | dispatch: PropTypes.func,
70 | loading: PropTypes.object,
71 | }
72 |
73 | export default connect(({ loading }) => ({ loading }))(Form.create()(Login))
74 |
--------------------------------------------------------------------------------
/tslint.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": [
3 | "tslint-react"
4 | ],
5 | "rules": {
6 | "align": false,
7 | "ban": false,
8 | "class-name": true,
9 | "jsx-curly-spacing": false,
10 | "jsx-boolean-value": false,
11 | "comment-format": false,
12 | "curly": false,
13 | "eofline": false,
14 | "forin": true,
15 | "indent": false,
16 | "interface-name": [
17 | true,
18 | "never-prefix"
19 | ],
20 | "jsdoc-format": true,
21 | "jsx-no-lambda": false,
22 | "jsx-no-multiline-js": false,
23 | "label-position": true,
24 | "max-line-length": false,
25 | "no-any": false,
26 | "no-arg": true,
27 | "no-bitwise": true,
28 | "no-console": false,
29 | "no-consecutive-blank-lines": false,
30 | "no-construct": true,
31 | "no-debugger": true,
32 | "no-duplicate-variable": true,
33 | "no-empty": true,
34 | "no-eval": true,
35 | "no-shadowed-variable": false,
36 | "no-string-literal": true,
37 | "no-switch-case-fall-through": true,
38 | "no-trailing-whitespace": false,
39 | "no-unused-expression": false,
40 | "no-use-before-declare": true,
41 | "one-line": false,
42 | "quotemark": [
43 | true,
44 | "single",
45 | "jsx-double"
46 | ],
47 | "radix": true,
48 | "semicolon": false,
49 | "switch-default": true,
50 | "trailing-comma": false,
51 | "triple-equals": [
52 | true,
53 | "allow-null-check"
54 | ],
55 | "typedef": [
56 | true,
57 | "parameter",
58 | "property-declaration"
59 | ],
60 | "typedef-whitespace": [
61 | true,
62 | {
63 | "call-signature": "nospace",
64 | "index-signature": "nospace",
65 | "parameter": "nospace",
66 | "property-declaration": "nospace",
67 | "variable-declaration": "nospace"
68 | }
69 | ],
70 | "variable-name": [
71 | true,
72 | "ban-keywords",
73 | "check-format",
74 | "allow-leading-underscore",
75 | "allow-pascal-case"
76 | ],
77 | "whitespace": [
78 | true,
79 | "check-branch",
80 | "check-decl",
81 | "check-module",
82 | "check-operator",
83 | "check-separator",
84 | "check-type",
85 | "check-typecast"
86 | ]
87 | }
88 | }
--------------------------------------------------------------------------------
/version.js:
--------------------------------------------------------------------------------
1 | const fs = require('fs')
2 | const path = require('path')
3 | const beautify = require('js-beautify').js_beautify
4 | const config = require('./package.json')
5 |
6 | const dist = path.join(`${__dirname}/dist`)
7 | const maxVersion = 5
8 |
9 | const writeVersion = () => new Promise((resolve, reject) => {
10 | const { version } = config
11 | const numbers = version.split('.')
12 | numbers[2] = Number(numbers[2]) + 1
13 | config.version = numbers.join('.')
14 |
15 | fs.writeFile(path.join(__dirname, 'package.json'), beautify(JSON.stringify(config), { indent_size: 2 }), (err) => {
16 | if (err) {
17 | reject()
18 | }
19 | resolve()
20 | console.log(`version: ${config.version}`)
21 | })
22 | })
23 |
24 | const removeFolder = (folderPath) => {
25 | let files = []
26 | if (fs.existsSync(folderPath)) {
27 | files = fs.readdirSync(folderPath)
28 | files.forEach((file) => {
29 | const curPath = `${folderPath}/${file}`
30 | if (fs.statSync(curPath).isDirectory()) {
31 | removeFolder(curPath)
32 | } else {
33 | fs.unlinkSync(curPath)
34 | }
35 | })
36 | fs.rmdirSync(folderPath)
37 | }
38 | }
39 |
40 | const start = async () => {
41 | const files = fs.readdirSync(dist)
42 | const promises = files.map(file => new Promise((resolve, reject) => {
43 | fs.stat(`${dist}/${file}`, (err, stats) => {
44 | if (err) {
45 | reject()
46 | } else {
47 | resolve(!stats.isFile()
48 | ? file
49 | : null)
50 | }
51 | })
52 | }))
53 |
54 | const result = await Promise.all(promises)
55 |
56 | const folders = result.filter((item) => {
57 | if (item) {
58 | return item.split('.').length === 3
59 | }
60 | return false
61 | }).sort((a, b) => {
62 | const an = a.split('.').map(_ => Number(_))
63 | const bn = b.split('.').map(_ => Number(_))
64 | if (an[0] === bn[0]) {
65 | if (an[1] === bn[1]) {
66 | return an[2] < bn[2]
67 | }
68 | return an[1] < bn[1]
69 | }
70 | return an[0] < bn[0]
71 | }).filter((item, index) => {
72 | return index > (maxVersion - 1)
73 | })
74 |
75 | for (const item of folders) {
76 | await removeFolder(`${dist}/${item}`)
77 | }
78 |
79 | await writeVersion()
80 | }
81 |
82 | start()
83 |
--------------------------------------------------------------------------------
/src/components/Layout/Header.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import PropTypes from 'prop-types'
3 | import { Menu, Icon, Popover, Layout } from 'antd'
4 | import classnames from 'classnames'
5 | import styles from './Header.less'
6 | import Menus from './Menu'
7 |
8 | const { SubMenu } = Menu
9 |
10 | const Header = ({
11 | user, logout, switchSider, siderFold, isNavbar, menuPopoverVisible, location, switchMenuPopover, navOpenKeys, changeOpenKeys, menu,
12 | }) => {
13 | let handleClickMenu = e => e.key === 'logout' && logout()
14 | const menusProps = {
15 | menu,
16 | siderFold: false,
17 | darkTheme: false,
18 | isNavbar,
19 | handleClickNavMenu: switchMenuPopover,
20 | location,
21 | navOpenKeys,
22 | changeOpenKeys,
23 | }
24 | return (
25 |
30 |
31 | {config.name}
32 |
33 |
63 |
29 |
31 |
32 | :
36 |
}
38 |
39 |
54 |
55 |
89 |
90 | {breads}
91 |
92 |
93 | )
94 | }
95 |
96 | Bread.propTypes = {
97 | menu: PropTypes.array,
98 | }
99 |
100 | export default Bread
101 |
--------------------------------------------------------------------------------
/src/themes/index.less:
--------------------------------------------------------------------------------
1 | @import "~themes/vars";
2 |
3 | body {
4 | height: 100%;
5 | overflow-y: hidden;
6 | background-color: #f8f8f8;
7 | }
8 |
9 | ::-webkit-scrollbar-thumb {
10 | background-color: #e6e6e6;
11 | }
12 |
13 | ::-webkit-scrollbar {
14 | width: 8px;
15 | height: 8px;
16 | }
17 |
18 | :global {
19 | .ant-breadcrumb {
20 | & > span {
21 | &:last-child {
22 | color: #999;
23 | font-weight: normal;
24 | }
25 | }
26 | }
27 |
28 | .ant-breadcrumb-link {
29 | .anticon + span {
30 | margin-left: 4px;
31 | }
32 | }
33 |
34 | .ant-table {
35 | .ant-table-thead > tr > th {
36 | text-align: center;
37 | }
38 |
39 | .ant-table-tbody > tr > td {
40 | text-align: center;
41 | }
42 |
43 | &.ant-table-small {
44 | .ant-table-thead > tr > th {
45 | background: #f7f7f7;
46 | }
47 |
48 | .ant-table-body > table {
49 | padding: 0;
50 | }
51 | }
52 | }
53 |
54 | .ant-table-pagination {
55 | float: none!important;
56 | display: table;
57 | margin: 16px auto !important;
58 | }
59 |
60 | .ant-popover-inner {
61 | border: none;
62 | border-radius: 0;
63 | box-shadow: 0 0 20px rgba(100, 100, 100, 0.2);
64 | }
65 |
66 | .vertical-center-modal {
67 | display: flex;
68 | align-items: center;
69 | justify-content: center;
70 |
71 | .ant-modal {
72 | top: 0;
73 |
74 | .ant-modal-body {
75 | max-height: 80vh;
76 | overflow-y: auto;
77 | }
78 | }
79 | }
80 |
81 | .ant-form-item-control {
82 | vertical-align: middle;
83 | }
84 |
85 | .ant-modal-mask {
86 | background-color: rgba(55, 55, 55, 0.2);
87 | }
88 |
89 | .ant-modal-content {
90 | box-shadow: none;
91 | }
92 |
93 | .ant-select-dropdown-menu-item {
94 | padding: 12px 16px !important;
95 | }
96 |
97 | .margin-right {
98 | margin-right: 16px;
99 | }
100 |
101 | a:focus {
102 | text-decoration: none;
103 | }
104 | }
105 | @media (min-width: 1600px) {
106 | :global {
107 | .ant-col-xl-48 {
108 | width: 20%;
109 | }
110 |
111 | .ant-col-xl-96 {
112 | width: 40%;
113 | }
114 | }
115 | }
116 | @media (max-width: 767px) {
117 | :global {
118 | .ant-pagination-item,
119 | .ant-pagination-next,
120 | .ant-pagination-options,
121 | .ant-pagination-prev {
122 | margin-bottom: 8px;
123 | }
124 |
125 | .ant-card {
126 | .ant-card-head {
127 | padding: 0 12px;
128 | }
129 |
130 | .ant-card-body {
131 | padding: 12px;
132 | }
133 | }
134 | }
135 | }
136 |
--------------------------------------------------------------------------------
/src/svg/emoji/tired.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "private": true,
3 | "name": "antd-admin",
4 | "version": "4.3.9",
5 | "dependencies": {
6 | "antd": "3.0.3",
7 | "axios": "^0.21.1",
8 | "babel-polyfill": "^6.23.0",
9 | "classnames": "^2.2.5",
10 | "cross-env": "^5.0.5",
11 | "d3-shape": "^1.2.0",
12 | "draftjs-to-markdown": "^0.5.0",
13 | "dva": "2.1.0",
14 | "dva-loading": "^1.0.4",
15 | "echarts": "^3.7.2",
16 | "echarts-for-react": "^2.0.0",
17 | "echarts-gl": "^1.0.0-beta.5",
18 | "echarts-liquidfill": "^1.1.0",
19 | "ejs-loader": "^0.3.0",
20 | "highcharts-exporting": "^0.1.2",
21 | "highcharts-more": "^0.1.2",
22 | "history": "^4.7.2",
23 | "js-beautify": "^1.6.14",
24 | "jsonp": "^0.2.1",
25 | "less-vars-to-js": "^1.1.2",
26 | "lodash": "^4.17.4",
27 | "md5": "^2.2.1",
28 | "mockjs": "^1.0.1-beta3",
29 | "nprogress": "^0.2.0",
30 | "path-to-regexp": "^2.1.0",
31 | "prop-types": "^15.5.10",
32 | "qs": "^6.5.0",
33 | "query-string": "^5.0.0",
34 | "rc-tween-one": "^1.3.1",
35 | "react": "^16.2.0",
36 | "react-countup": "^3.0.2",
37 | "react-dom": "^16.2.0",
38 | "react-draft-wysiwyg": "^1.10.0",
39 | "react-helmet": "^5.1.3",
40 | "react-highcharts": "^15.0.0",
41 | "recharts": "^1.0.0-beta.0"
42 | },
43 | "devDependencies": {
44 | "@redux-saga/types": "^1.1.0",
45 | "@types/node": "^12.11.7",
46 | "@types/chai": "^4.0.8",
47 | "@types/dva": "^1.1.0",
48 | "@types/history": "^4.7.3",
49 | "@types/mockjs": "^1.0.0",
50 | "@types/react": "^16.0.15",
51 | "babel-eslint": "^8.1.0",
52 | "babel-plugin-dev-expression": "^0.2.1",
53 | "babel-plugin-dva-hmr": "^0.4.0",
54 | "babel-plugin-import": "^1.1.1",
55 | "babel-plugin-transform-runtime": "^6.9.0",
56 | "babel-runtime": "^6.9.2",
57 | "copy-webpack-plugin": "^4.0.1",
58 | "draftjs-to-html": "^0.8.1",
59 | "dva-model-extend": "^0.1.1",
60 | "eslint": "^4.1.1",
61 | "eslint-config-airbnb": "^16.1.0",
62 | "eslint-import-resolver-node": "^0.3.1",
63 | "eslint-loader": "^1.9.0",
64 | "eslint-plugin-import": "^2.6.1",
65 | "eslint-plugin-jsx-a11y": "^6.0.2",
66 | "eslint-plugin-react": "^7.1.0",
67 | "html-webpack-plugin": "^2.29.0",
68 | "redbox-react": "^1.2.10",
69 | "roadhog": "1.3.1",
70 | "ts-node": "^3.3.0",
71 | "tslint": "^5.9.1",
72 | "tslint-react": "^3.5.1",
73 | "typescript": "^2.6.2",
74 | "typescript-eslint-parser": "^13.0.0"
75 | },
76 | "pre-commit": [
77 | "lint"
78 | ],
79 | "scripts": {
80 | "dev": "cross-env BROWSER=none HOST=0.0.0.0 roadhog server",
81 | "start": "roadhog buildDll && cross-env BROWSER=none HOST=0.0.0.0 roadhog server",
82 | "lint": "eslint --fix --ext .js src",
83 | "build": "roadhog build",
84 | "build:dll": "roadhog buildDll",
85 | "build:new": "node version && roadhog build"
86 | }
87 | }
88 |
--------------------------------------------------------------------------------
/src/svg/emoji/surprised.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/svg/emoji/smirking.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/utils/request.ts:
--------------------------------------------------------------------------------
1 |
2 | import axios, { AxiosRequestConfig, AxiosResponse, AxiosPromise } from 'axios'
3 | import cloneDeep from 'lodash/cloneDeep'
4 | import { message } from 'antd'
5 | import md5 from 'md5'
6 | import qs from 'qs'
7 | import storage from './storage'
8 | import sortByKey from './sortByKey'
9 |
10 | export default function request(url: string, options: AxiosRequestConfig = {}): AxiosPromise {
11 | let { data } = options
12 |
13 | options.url = url
14 | if (data) {
15 | options.params = cloneDeep(data)
16 | }
17 |
18 | return axios(options)
19 | .then(response => {
20 | const { status, statusText } = response
21 | const successed = checkRspStatus(status)
22 | if (successed) {
23 | return Promise.resolve({
24 | ...response,
25 | success: true,
26 | message: statusText,
27 | statusCode: status,
28 | data: response.data || {},
29 | })
30 | }
31 |
32 | // 错误提示
33 | tipError(response)
34 |
35 | const error = {
36 | name: 'http error',
37 | message: 'http response status error',
38 | config: options,
39 | code: `${status}`,
40 | response,
41 | isAxiosError: false,
42 | }
43 | return Promise.reject(error)
44 | })
45 | .catch(error => {
46 | const { response } = error
47 |
48 | // 错误提示
49 | tipError(response || {
50 | ...error,
51 | status: 600
52 | })
53 |
54 | let msg
55 | let statusCode
56 |
57 | if (response && response instanceof Object) {
58 | const { statusText } = response
59 | statusCode = response.status
60 | msg = response.data.message || statusText
61 | } else {
62 | statusCode = 600
63 | msg = error.message || 'Network Error'
64 | }
65 |
66 | /* eslint-disable */
67 | return Promise.resolve({
68 | ...response,
69 | success: false,
70 | status: statusCode,
71 | message: msg,
72 | })
73 | })
74 | }
75 |
76 | export function checkRspStatus(status: number) {
77 | if (status >= 200 && status < 300) {
78 | return true;
79 | }
80 |
81 | return false;
82 | }
83 |
84 | function tipError(response: AxiosResponse) {
85 | const status = response.status;
86 |
87 | switch (status) {
88 | case 401:
89 | storage.clear();
90 | message.error('登录过期，请重新登录');
91 | break;
92 |
93 | case 400:
94 | message.error('请求错误，请刷新重试');
95 | break;
96 |
97 | default:
98 | if (status >= 500) {
99 | message.error('网络错误，请刷新重试');
100 | }
101 | // 注意：其他错误的错误提示需要在业务内自行处理
102 | break;
103 | }
104 | console.error('http返回结果的 status 码错误，错误信息是:', response);
105 | }
106 |
107 | export const encryptMD5 = (value, apiKey = 'apikey=sunlandzlcx') => {
108 | if (qs.stringify(sortByKey(value))) {
109 | return md5(`${apiKey}&${qs.stringify(sortByKey(value), { encode: false })}`)
110 | } else {
111 | return md5(apiKey);
112 | }
113 | };
114 |
--------------------------------------------------------------------------------
/src/svg/emoji/unamused.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/svg/emoji/wink.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/components/Layout/Layout.less:
--------------------------------------------------------------------------------
1 | @import "~themes/vars";
2 |
3 | :global {
4 | .ant-layout-header {
5 | padding: 0;
6 | }
7 |
8 | .ant-layout-sider {
9 | transition: all 0.3s;
10 |
11 | .ant-menu-root {
12 | height: ~"calc(100vh - 144px)";
13 | overflow-x: hidden;
14 | border-right: none;
15 |
16 | &::-webkit-scrollbar-thumb {
17 | background-color: transparent;
18 | }
19 |
20 | &:hover {
21 | &::-webkit-scrollbar-thumb {
22 | background-color: rgba(0, 0, 0, 0.2);
23 | }
24 | }
25 | }
26 |
27 | .ant-menu {
28 | .ant-menu-item,
29 | .ant-menu-submenu-title {
30 | overflow: hidden;
31 | white-space: normal;
32 | }
33 | }
34 | }
35 |
36 | .ant-layout-content {
37 | padding: 24px;
38 | }
39 |
40 | .ant-layout-footer {
41 | text-align: center;
42 | padding: 0 24px;
43 | height: 40px;
44 | font-size: 12px;
45 | line-height: 40px;
46 | }
47 |
48 | .ant-back-top {
49 | right: 50px;
50 | }
51 |
52 | .ant-switch.ant-switch-large {
53 | line-height: 24px;
54 | height: 26px;
55 |
56 | &:after,
57 | &:before {
58 | width: 22px;
59 | height: 22px;
60 | }
61 |
62 | &.ant-switch-checked:after,
63 | &.ant-switch-checked:before {
64 | margin-left: -23px;
65 | }
66 | }
67 |
68 | .flex-vertical-center {
69 | display: flex;
70 | align-items: center;
71 | }
72 |
73 | .ant-form-item {
74 | margin-bottom: 12px;
75 | }
76 | }
77 |
78 | .logo {
79 | height: 96px;
80 | display: flex;
81 | align-items: center;
82 | justify-content: center;
83 |
84 | img {
85 | width: 40px;
86 | margin-right: 8px;
87 | }
88 |
89 | span {
90 | vertical-align: text-bottom;
91 | font-size: 16px;
92 | text-transform: uppercase;
93 | display: inline-block;
94 | font-weight: 700;
95 | color: @primary-color;
96 | }
97 | }
98 |
99 | .switchtheme {
100 | width: 100%;
101 | position: absolute;
102 | bottom: 0;
103 | height: 48px;
104 | background-color: #fff;
105 | border-top: solid 1px #f8f8f8;
106 | display: flex;
107 | justify-content: space-between;
108 | align-items: center;
109 | padding: 0 16px;
110 | overflow: hidden;
111 | z-index: 9;
112 | transition: all 0.3s;
113 |
114 | span {
115 | white-space: nowrap;
116 | overflow: hidden;
117 | font-size: 12px;
118 | }
119 |
120 | :global {
121 | .anticon {
122 | min-width: 14px;
123 | margin-right: 4px;
124 | font-size: 14px;
125 | }
126 | }
127 | }
128 |
129 | .bread {
130 | margin-bottom: 24px;
131 |
132 | :global {
133 | .ant-breadcrumb {
134 | display: flex;
135 | align-items: center;
136 | }
137 | }
138 | }
139 |
140 | .dark {
141 | .switchtheme {
142 | background-color: #000d18;
143 | border-color: #001629;
144 | }
145 | }
146 |
147 | .light {
148 | :global {
149 | .ant-layout-sider {
150 | background: #fff;
151 | }
152 | }
153 | }
154 | @media (max-width: 767px) {
155 | .bread {
156 | margin-bottom: 12px;
157 | }
158 |
159 | :global {
160 | .ant-layout-content {
161 | padding: 12px;
162 | }
163 |
164 | .ant-back-top {
165 | right: 20px;
166 | bottom: 20px;
167 | }
168 | }
169 | }
170 |
--------------------------------------------------------------------------------
/src/svg/cute/kiss.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/components/Layout/Menu.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import PropTypes from 'prop-types'
3 | import { Menu, Icon } from 'antd'
4 | import { Link } from 'react-router-dom'
5 | import { arrayToTree, queryArray } from '@utils'
6 | import pathToRegexp from 'path-to-regexp'
7 |
8 | const Menus = ({ siderFold, darkTheme, navOpenKeys, changeOpenKeys, menu, location }) => {
9 | // 生成树状
10 | const menuTree = arrayToTree(menu.filter(_ => _.mpid !== '-1'), 'id', 'mpid')
11 | const levelMap = {}
12 |
13 | // 递归生成菜单
14 | const getMenus = (menuTreeN, siderFoldN) => {
15 | return menuTreeN.map((item) => {
16 | if (item.children) {
17 | if (item.mpid) {
18 | levelMap[item.id] = item.mpid
19 | }
20 | return (
21 |
90 |
93 | )
94 | }
95 |
96 | return (
97 |
98 |
100 | ANTD ADMIN
101 |
102 |
103 | {iconFontJS && }
104 | {iconFontCSS && }
105 |
106 |
107 |
108 | {!isNavbar &&
113 | {siderProps.menu.length === 0 ? null : }
115 |
119 | document.getElementById('mainContainer')} />
120 |
122 |
125 |
128 |
129 |
130 |
131 | )
132 | }
133 |
134 | App.propTypes = {
135 | children: PropTypes.element.isRequired,
136 | location: PropTypes.object,
137 | dispatch: PropTypes.func,
138 | app: PropTypes.object,
139 | loading: PropTypes.object,
140 | }
141 |
142 | export default withRouter(connect(({ app, loading }) => ({ app, loading }))(App))
143 |
--------------------------------------------------------------------------------
/src/public/logo.svg:
--------------------------------------------------------------------------------
1 |
2 |
--------------------------------------------------------------------------------
/src/svg/cute/shy.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/models/app.ts:
--------------------------------------------------------------------------------
1 | /* global window */
2 | /* global document */
3 | import { routerRedux } from 'dva/router'
4 | import config from '@config'
5 | import { storage } from '@utils'
6 | import { EnumRoleType } from '@enums'
7 | import * as appService from '@services/app'
8 | import * as menusService from '@services/menus'
9 | import queryString from 'query-string'
10 | import { modelExtend } from './common';
11 | import { ReduxSagaEffects, DvaSetupParams, ReduxAction } from '../ts-types';
12 |
13 | const { prefix, defaultPageInfo, loginRouter } = config;
14 |
15 | type MenuItem = {
16 | id: number
17 | icon: string
18 | name: string
19 | router: string
20 | }
21 | type State = {
22 | user: Object
23 | permissions: {
24 | visit: any[]
25 | }
26 | menu: MenuItem[]
27 | menuPopoverVisible: boolean
28 | siderFold: boolean
29 | darkTheme: boolean
30 | isNavbar: boolean
31 | navOpenKeys: string[]
32 | locationPathname: string
33 | locationQuery: Object
34 | }
35 |
36 | const namespace = 'app';
37 |
38 | export default modelExtend