před 2 roky · c49e4fbe04
--- a/.gitignore
+++ b/.gitignore
@@ -0,0 +1,24 @@
 
				+# Logs
			
 
				+logs
			
 
				+*.log
			
 
				+npm-debug.log*
			
 
				+yarn-debug.log*
			
 
				+yarn-error.log*
			
 
				+pnpm-debug.log*
			
 
				+lerna-debug.log*
			
 
				+
			
 
				+node_modules
			
 
				+dist
			
 
				+dist-ssr
			
 
				+*.local
			
 
				+
			
 
				+# Editor directories and files
			
 
				+.vscode/*
			
 
				+!.vscode/extensions.json
			
 
				+.idea
			
 
				+.DS_Store
			
 
				+*.suo
			
 
				+*.ntvs*
			
 
				+*.njsproj
			
 
				+*.sln
			
 
				+*.sw?
			
--- a/index.html
+++ b/index.html
@@ -0,0 +1,15 @@
 
				+<!DOCTYPE html>
			
 
				+<html lang="en">
			
 
				+  <head>
			
 
				+    <meta charset="UTF-8" />
			
 
				+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
			
 
				+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
			
 
				+    <script src="./config.js"></script>
			
 
				+    <script src="./qrcode.min.js"></script>
			
 
				+    <title>认证中心</title>
			
 
				+  </head>
			
 
				+  <body>
			
 
				+    <div id="root"></div>
			
 
				+    <script type="module" src="/src/main.jsx"></script>
			
 
				+  </body>
			
 
				+</html>
			
--- a/jsconfig.json
+++ b/jsconfig.json
@@ -0,0 +1,8 @@
 
				+{
			
 
				+  "compilerOptions": {
			
 
				+    "baseUrl": ".",
			
 
				+    "paths": {
			
 
				+      "@/*": ["./src/*"]
			
 
				+    }
			
 
				+  }
			
 
				+}
			
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -0,0 +1,36 @@
 
				+{
			
 
				+  "name": "vite-project",
			
 
				+  "private": true,
			
 
				+  "version": "0.0.0",
			
 
				+  "type": "module",
			
 
				+  "scripts": {
			
 
				+    "dev": "vite",
			
 
				+    "build": "vite build",
			
 
				+    "preview": "vite preview"
			
 
				+  },
			
 
				+  "dependencies": {
			
 
				+    "@ant-design/icons": "^4.7.0",
			
 
				+    "@ant-design/pro-components": "^2.3.13",
			
 
				+    "@wangeditor/editor": "^5.1.23",
			
 
				+    "@wangeditor/editor-for-react": "^1.0.6",
			
 
				+    "@zjxpcyc/react-tiny-store": "^2.0.1",
			
 
				+    "antd": "^4.23.4",
			
 
				+    "axios": "^1.2.0",
			
 
				+    "classnames": "^2.3.2",
			
 
				+    "echarts": "^5.4.0",
			
 
				+    "md5": "^2.3.0",
			
 
				+    "react": "18.2.0",
			
 
				+    "react-dom": "18.2.0",
			
 
				+    "react-helmet": "^6.1.0",
			
 
				+    "react-router-dom": "^6.4.2",
			
 
				+    "react-transition-group": "^4.4.5"
			
 
				+  },
			
 
				+  "devDependencies": {
			
 
				+    "@types/react": "18.0.27",
			
 
				+    "@types/react-dom": "18.0.10",
			
 
				+    "@vitejs/plugin-react": "^2.0.0",
			
 
				+    "less": "^4.1.3",
			
 
				+    "vite": "^3.0.0",
			
 
				+    "vite-plugin-imp": "^2.2.0"
			
 
				+  }
			
 
				+}
			
--- a/public/config.js
+++ b/public/config.js
@@ -0,0 +1,7 @@
 
				+
			
 
				+var SERVER_BASE = '';
			
 
				+
			
 
				+// 获取真实的上传文件地址
			
 
				+function getRealPath(path) {
			
 
				+  return path;
			
 
				+}
			
--- a/public/logo.png
+++ b/public/logo.png
--- a/public/particles/particles.json
+++ b/public/particles/particles.json
@@ -0,0 +1,110 @@
 
				+{
			
 
				+  "particles": {
			
 
				+    "number": {
			
 
				+      "value": 80,
			
 
				+      "density": {
			
 
				+        "enable": true,
			
 
				+        "value_area": 800
			
 
				+      }
			
 
				+    },
			
 
				+    "color": {
			
 
				+      "value": "#1890ff"
			
 
				+    },
			
 
				+    "shape": {
			
 
				+      "type": "circle",
			
 
				+      "stroke": {
			
 
				+        "width": 0,
			
 
				+        "color": "#000000"
			
 
				+      },
			
 
				+      "polygon": {
			
 
				+        "nb_sides": 5
			
 
				+      },
			
 
				+      "image": {
			
 
				+        "src": "img/github.svg",
			
 
				+        "width": 100,
			
 
				+        "height": 100
			
 
				+      }
			
 
				+    },
			
 
				+    "opacity": {
			
 
				+      "value": 0.5,
			
 
				+      "random": false,
			
 
				+      "anim": {
			
 
				+        "enable": false,
			
 
				+        "speed": 1,
			
 
				+        "opacity_min": 0.1,
			
 
				+        "sync": false
			
 
				+      }
			
 
				+    },
			
 
				+    "size": {
			
 
				+      "value": 3,
			
 
				+      "random": true,
			
 
				+      "anim": {
			
 
				+        "enable": false,
			
 
				+        "speed": 40,
			
 
				+        "size_min": 0.1,
			
 
				+        "sync": false
			
 
				+      }
			
 
				+    },
			
 
				+    "line_linked": {
			
 
				+      "enable": true,
			
 
				+      "distance": 150,
			
 
				+      "color": "#1890ff",
			
 
				+      "opacity": 0.4,
			
 
				+      "width": 1
			
 
				+    },
			
 
				+    "move": {
			
 
				+      "enable": true,
			
 
				+      "speed": 2,
			
 
				+      "direction": "none",
			
 
				+      "random": false,
			
 
				+      "straight": false,
			
 
				+      "out_mode": "out",
			
 
				+      "bounce": false,
			
 
				+      "attract": {
			
 
				+        "enable": false,
			
 
				+        "rotateX": 600,
			
 
				+        "rotateY": 1200
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  "interactivity": {
			
 
				+    "detect_on": "canvas",
			
 
				+    "events": {
			
 
				+      "onhover": {
			
 
				+        "enable": false,
			
 
				+        "mode": "repulse"
			
 
				+      },
			
 
				+      "onclick": {
			
 
				+        "enable": false,
			
 
				+        "mode": "push"
			
 
				+      },
			
 
				+      "resize": true
			
 
				+    },
			
 
				+    "modes": {
			
 
				+      "grab": {
			
 
				+        "distance": 400,
			
 
				+        "line_linked": {
			
 
				+          "opacity": 1
			
 
				+        }
			
 
				+      },
			
 
				+      "bubble": {
			
 
				+        "distance": 400,
			
 
				+        "size": 40,
			
 
				+        "duration": 2,
			
 
				+        "opacity": 8,
			
 
				+        "speed": 3
			
 
				+      },
			
 
				+      "repulse": {
			
 
				+        "distance": 200,
			
 
				+        "duration": 0.4
			
 
				+      },
			
 
				+      "push": {
			
 
				+        "particles_nb": 4
			
 
				+      },
			
 
				+      "remove": {
			
 
				+        "particles_nb": 2
			
 
				+      }
			
 
				+    }
			
 
				+  },
			
 
				+  "retina_detect": true
			
 
				+}
			
--- a/public/particles/particles.min.js
+++ b/public/particles/particles.min.js
--- a/public/qrcode.min.js
+++ b/public/qrcode.min.js
--- a/public/vite.svg
+++ b/public/vite.svg
@@ -0,0 +1 @@
 
				+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
			
--- a/src/App.css
+++ b/src/App.css
@@ -0,0 +1,42 @@
 
				+#root {
			
 
				+  max-width: 1280px;
			
 
				+  margin: 0 auto;
			
 
				+  padding: 2rem;
			
 
				+  text-align: center;
			
 
				+}
			
 
				+
			
 
				+.logo {
			
 
				+  height: 6em;
			
 
				+  padding: 1.5em;
			
 
				+  will-change: filter;
			
 
				+}
			
 
				+.logo:hover {
			
 
				+  filter: drop-shadow(0 0 2em #646cffaa);
			
 
				+}
			
 
				+.logo.react:hover {
			
 
				+  filter: drop-shadow(0 0 2em #61dafbaa);
			
 
				+}
			
 
				+
			
 
				+
			
 
				+@keyframes logo-spin {
			
 
				+  from {
			
 
				+    transform: rotate(0deg);
			
 
				+  }
			
 
				+  to {
			
 
				+    transform: rotate(360deg);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+@media (prefers-reduced-motion: no-preference) {
			
 
				+  a:nth-of-type(2) .logo {
			
 
				+    animation: logo-spin infinite 20s linear;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.card {
			
 
				+  padding: 2em;
			
 
				+}
			
 
				+
			
 
				+.read-the-docs {
			
 
				+  color: #888;
			
 
				+}
			
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -0,0 +1,10 @@
 
				+import { useState } from 'react'
			
 
				+
			
 
				+
			
 
				+function App() {
			
 
				+  const [count, setCount] = useState(0)
			
 
				+
			
 
				+  return null;
			
 
				+}
			
 
				+
			
 
				+export default App
			
--- a/src/assets/react.svg
+++ b/src/assets/react.svg
@@ -0,0 +1 @@
 
				+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="35.93" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 228"><path fill="#00D8FF" d="M210.483 73.824a171.49 171.49 0 0 0-8.24-2.597c.465-1.9.893-3.777 1.273-5.621c6.238-30.281 2.16-54.676-11.769-62.708c-13.355-7.7-35.196.329-57.254 19.526a171.23 171.23 0 0 0-6.375 5.848a155.866 155.866 0 0 0-4.241-3.917C100.759 3.829 77.587-4.822 63.673 3.233C50.33 10.957 46.379 33.89 51.995 62.588a170.974 170.974 0 0 0 1.892 8.48c-3.28.932-6.445 1.924-9.474 2.98C17.309 83.498 0 98.307 0 113.668c0 15.865 18.582 31.778 46.812 41.427a145.52 145.52 0 0 0 6.921 2.165a167.467 167.467 0 0 0-2.01 9.138c-5.354 28.2-1.173 50.591 12.134 58.266c13.744 7.926 36.812-.22 59.273-19.855a145.567 145.567 0 0 0 5.342-4.923a168.064 168.064 0 0 0 6.92 6.314c21.758 18.722 43.246 26.282 56.54 18.586c13.731-7.949 18.194-32.003 12.4-61.268a145.016 145.016 0 0 0-1.535-6.842c1.62-.48 3.21-.974 4.76-1.488c29.348-9.723 48.443-25.443 48.443-41.52c0-15.417-17.868-30.326-45.517-39.844Zm-6.365 70.984c-1.4.463-2.836.91-4.3 1.345c-3.24-10.257-7.612-21.163-12.963-32.432c5.106-11 9.31-21.767 12.459-31.957c2.619.758 5.16 1.557 7.61 2.4c23.69 8.156 38.14 20.213 38.14 29.504c0 9.896-15.606 22.743-40.946 31.14Zm-10.514 20.834c2.562 12.94 2.927 24.64 1.23 33.787c-1.524 8.219-4.59 13.698-8.382 15.893c-8.067 4.67-25.32-1.4-43.927-17.412a156.726 156.726 0 0 1-6.437-5.87c7.214-7.889 14.423-17.06 21.459-27.246c12.376-1.098 24.068-2.894 34.671-5.345a134.17 134.17 0 0 1 1.386 6.193ZM87.276 214.515c-7.882 2.783-14.16 2.863-17.955.675c-8.075-4.657-11.432-22.636-6.853-46.752a156.923 156.923 0 0 1 1.869-8.499c10.486 2.32 22.093 3.988 34.498 4.994c7.084 9.967 14.501 19.128 21.976 27.15a134.668 134.668 0 0 1-4.877 4.492c-9.933 8.682-19.886 14.842-28.658 17.94ZM50.35 144.747c-12.483-4.267-22.792-9.812-29.858-15.863c-6.35-5.437-9.555-10.836-9.555-15.216c0-9.322 13.897-21.212 37.076-29.293c2.813-.98 5.757-1.905 8.812-2.773c3.204 10.42 7.406 21.315 12.477 32.332c-5.137 11.18-9.399 22.249-12.634 32.792a134.718 134.718 0 0 1-6.318-1.979Zm12.378-84.26c-4.811-24.587-1.616-43.134 6.425-47.789c8.564-4.958 27.502 2.111 47.463 19.835a144.318 144.318 0 0 1 3.841 3.545c-7.438 7.987-14.787 17.08-21.808 26.988c-12.04 1.116-23.565 2.908-34.161 5.309a160.342 160.342 0 0 1-1.76-7.887Zm110.427 27.268a347.8 347.8 0 0 0-7.785-12.803c8.168 1.033 15.994 2.404 23.343 4.08c-2.206 7.072-4.956 14.465-8.193 22.045a381.151 381.151 0 0 0-7.365-13.322Zm-45.032-43.861c5.044 5.465 10.096 11.566 15.065 18.186a322.04 322.04 0 0 0-30.257-.006c4.974-6.559 10.069-12.652 15.192-18.18ZM82.802 87.83a323.167 323.167 0 0 0-7.227 13.238c-3.184-7.553-5.909-14.98-8.134-22.152c7.304-1.634 15.093-2.97 23.209-3.984a321.524 321.524 0 0 0-7.848 12.897Zm8.081 65.352c-8.385-.936-16.291-2.203-23.593-3.793c2.26-7.3 5.045-14.885 8.298-22.6a321.187 321.187 0 0 0 7.257 13.246c2.594 4.48 5.28 8.868 8.038 13.147Zm37.542 31.03c-5.184-5.592-10.354-11.779-15.403-18.433c4.902.192 9.899.29 14.978.29c5.218 0 10.376-.117 15.453-.343c-4.985 6.774-10.018 12.97-15.028 18.486Zm52.198-57.817c3.422 7.8 6.306 15.345 8.596 22.52c-7.422 1.694-15.436 3.058-23.88 4.071a382.417 382.417 0 0 0 7.859-13.026a347.403 347.403 0 0 0 7.425-13.565Zm-16.898 8.101a358.557 358.557 0 0 1-12.281 19.815a329.4 329.4 0 0 1-23.444.823c-7.967 0-15.716-.248-23.178-.732a310.202 310.202 0 0 1-12.513-19.846h.001a307.41 307.41 0 0 1-10.923-20.627a310.278 310.278 0 0 1 10.89-20.637l-.001.001a307.318 307.318 0 0 1 12.413-19.761c7.613-.576 15.42-.876 23.31-.876H128c7.926 0 15.743.303 23.354.883a329.357 329.357 0 0 1 12.335 19.695a358.489 358.489 0 0 1 11.036 20.54a329.472 329.472 0 0 1-11 20.722Zm22.56-122.124c8.572 4.944 11.906 24.881 6.52 51.026c-.344 1.668-.73 3.367-1.15 5.09c-10.622-2.452-22.155-4.275-34.23-5.408c-7.034-10.017-14.323-19.124-21.64-27.008a160.789 160.789 0 0 1 5.888-5.4c18.9-16.447 36.564-22.941 44.612-18.3ZM128 90.808c12.625 0 22.86 10.235 22.86 22.86s-10.235 22.86-22.86 22.86s-22.86-10.235-22.86-22.86s10.235-22.86 22.86-22.86Z"></path></svg>
			
--- a/src/components/EditableTag/Tag.jsx
+++ b/src/components/EditableTag/Tag.jsx
@@ -0,0 +1,15 @@
 
				+import React from 'react';
			
 
				+import { Button } from 'antd';
			
 
				+import { CloseOutlined } from '@ant-design/icons';
			
 
				+import './style.less'
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const { size, type, onDelete, children } = props;
			
 
				+
			
 
				+  return (
			
 
				+    <div className='tag-btn-group'>
			
 
				+      <Button size={size} type={type}>{children}</Button>
			
 
				+      <Button size={size} type="primary" icon={<CloseOutlined />} onClick={onDelete} />
			
 
				+    </div>
			
 
				+  )
			
 
				+}
			
--- a/src/components/EditableTag/index.jsx
+++ b/src/components/EditableTag/index.jsx
@@ -0,0 +1,21 @@
 
				+import React from 'react';
			
 
				+import { Button } from 'antd';
			
 
				+import Tag from './Tag';
			
 
				+import './style.less'
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const { size, type, list = [], onDelete, keyFuc, labelFunc } = props;
			
 
				+
			
 
				+  return (
			
 
				+    <div className='editable-tag-box'>
			
 
				+      {
			
 
				+        list.map((item, index) => {
			
 
				+          const key = keyFuc(item, index);
			
 
				+          const label = labelFunc(item, index);
			
 
				+
			
 
				+          return <Tag key={key} size={size} type={type} onDelete={() => onDelete(item)}>{label}</Tag>
			
 
				+        })
			
 
				+      }
			
 
				+    </div>
			
 
				+  )
			
 
				+}
			
--- a/src/components/EditableTag/style.less
+++ b/src/components/EditableTag/style.less
@@ -0,0 +1,27 @@
 
				+.tag-btn-group {
			
 
				+  .ant-btn {
			
 
				+    vertical-align: middle;
			
 
				+  }
			
 
				+
			
 
				+  .ant-btn:first-child {
			
 
				+    border-right: none;
			
 
				+  }
			
 
				+
			
 
				+  .ant-btn:last-child {
			
 
				+    // border-left: none;
			
 
				+    border-top-left-radius: 0;
			
 
				+    border-bottom-left-radius: 0;
			
 
				+    margin-left: -1px;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.editable-tag-box {
			
 
				+  display: flex;
			
 
				+  flex-wrap: wrap;
			
 
				+
			
 
				+  .tag-btn-group {
			
 
				+    flex: none;
			
 
				+    box-sizing: border-box;
			
 
				+    padding: 1em;
			
 
				+  }
			
 
				+}
			
--- a/src/components/Money/float.js
+++ b/src/components/Money/float.js
@@ -0,0 +1,4 @@
 
				+const epsilonN = N => num => Math.round( num * N + Number.EPSILON ) / N;
			
 
				+const epsilon2 = epsilonN(1e2);
			
 
				+
			
 
				+export default epsilon2;
			
--- a/src/components/Money/index.jsx
+++ b/src/components/Money/index.jsx
@@ -0,0 +1,30 @@
 
				+import { InputNumber } from "antd"
			
 
				+import { useEffect, useState } from "react"
			
 
				+import epsilon2 from './float'
			
 
				+
			
 
				+export default (props) => {
			
 
				+
			
 
				+  const { value, onChange, ...leftProps } = props
			
 
				+
			
 
				+  const [money, setMoney] = useState(0)
			
 
				+
			
 
				+  useEffect(() => {
			
 
				+    setMoney(epsilon2(value / 100))
			
 
				+  }, [value])
			
 
				+
			
 
				+  const handleChange = (val) => {
			
 
				+    onChange(epsilon2(val * 100))
			
 
				+  }
			
 
				+
			
 
				+  return (
			
 
				+    <InputNumber
			
 
				+      min='0'
			
 
				+      {...leftProps}
			
 
				+      value={money}
			
 
				+      onChange={handleChange}
			
 
				+      precision={2}
			
 
				+      formatter={value => `￥ ${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')}
			
 
				+      parser={value => value.replace(/\￥\s?|(,*)/g, '')}
			
 
				+    />
			
 
				+  )
			
 
				+}
			
--- a/src/components/Page/Curd.jsx
+++ b/src/components/Page/Curd.jsx
@@ -0,0 +1,83 @@
 
				+import React from 'react';
			
 
				+import { DrawerForm } from '@ant-design/pro-components';
			
 
				+import { Form } from 'antd';
			
 
				+import List from './List';
			
 
				+
			
 
				+const drawerProps = {
			
 
				+  destroyOnClose: true
			
 
				+}
			
 
				+export default (props) => {
			
 
				+  const { rowKey, columns, request, formProps, renderFormItems, ...leftProps } = props;
			
 
				+
			
 
				+  const [form] = Form.useForm();
			
 
				+  const listRef = React.useRef();
			
 
				+  const rowRef = React.useRef();
			
 
				+  const [open, setOpen] = React.useState(false);
			
 
				+  
			
 
				+  const onAdd = () => {
			
 
				+    rowRef.current = undefined;
			
 
				+    form.resetFields();
			
 
				+    setOpen(true);
			
 
				+  }
			
 
				+
			
 
				+  const onEdit = (row) => {
			
 
				+    rowRef.current = row;
			
 
				+    form.setFieldsValue(row);
			
 
				+    setOpen(true);
			
 
				+  }
			
 
				+
			
 
				+  const onDelete = (row) => {
			
 
				+    rowRef.current = row;
			
 
				+
			
 
				+    listRef.current.showLoading('正在操作, 请稍候...');
			
 
				+    request.del(row[rowKey]).then(() => {
			
 
				+      listRef.current.hideLoading();
			
 
				+      listRef.current.reload();
			
 
				+    }).catch(() => {
			
 
				+      listRef.current.hideLoading();
			
 
				+    });
			
 
				+  }
			
 
				+
			
 
				+  const onFinish = async (values) => {
			
 
				+    if (rowRef.current) {
			
 
				+      await request.update(rowRef.current[rowKey], {
			
 
				+        ...rowRef.current,
			
 
				+        ...values,
			
 
				+      });
			
 
				+    } else {
			
 
				+      await request.save(values);
			
 
				+    }
			
 
				+    listRef.current.reload();
			
 
				+
			
 
				+    return true;
			
 
				+  }
			
 
				+
			
 
				+  return (
			
 
				+    <>
			
 
				+      <List
			
 
				+        ref={listRef}
			
 
				+        rowKey={rowKey}
			
 
				+        columns={columns}
			
 
				+        request={request.list}
			
 
				+        onAdd={onAdd}
			
 
				+        onDelete={onDelete}
			
 
				+        onEdit={onEdit}
			
 
				+        {...leftProps}
			
 
				+      />
			
 
				+
			
 
				+      <DrawerForm
			
 
				+        submitTimeout={3000}
			
 
				+        open={open}
			
 
				+        form={form}
			
 
				+        drawerProps={drawerProps}
			
 
				+        onOpenChange={setOpen}
			
 
				+        onFinish={onFinish}
			
 
				+        {...formProps}
			
 
				+      >
			
 
				+        {
			
 
				+          renderFormItems && renderFormItems()
			
 
				+        }
			
 
				+      </DrawerForm>
			
 
				+    </>
			
 
				+  )
			
 
				+}
			
--- a/src/components/Page/Edit.jsx
+++ b/src/components/Page/Edit.jsx
@@ -0,0 +1,93 @@
 
				+import React from 'react';
			
 
				+import { Button, Card, Form } from 'antd';
			
 
				+import { useSearchParams, useNavigate } from "react-router-dom";
			
 
				+import useBool from '@/utils/hooks/useBool';
			
 
				+import Page from './index';
			
 
				+
			
 
				+const FormItem = Form.Item;
			
 
				+const formItemLayout = { labelCol: { span: 6 }, wrapperCol: { span: 14 } };
			
 
				+
			
 
				+export default (props) => {
			
 
				+  /**
			
 
				+   * request 编辑或者新增接口
			
 
				+   * dataFunc 将 form 表单数据转换为接口需要格式, 一般情况下不需要这个操作
			
 
				+   * formDataFunc 将接口返回的值转换为 form 表单数据格式, 一般情况下不需要这个操作
			
 
				+   * width form 表单宽度, 默认 800px
			
 
				+   */
			
 
				+  const { request, dataFunc, formDataFunc, width = '800px', onFinish, ...leftProps } = props;
			
 
				+  const [loading, startLoading, stopLoading] = useBool();
			
 
				+  const [form] = Form.useForm();
			
 
				+  const navigate = useNavigate();
			
 
				+
			
 
				+  // 获取 id query 参数, 如果存在说明是编辑，而不是新增
			
 
				+  const [params] = useSearchParams();
			
 
				+  const id = params.get("id");
			
 
				+  
			
 
				+  const navBack = React.useCallback(() => {
			
 
				+    const t = setTimeout(() => {
			
 
				+      navigate(-1);
			
 
				+      clearTimeout(t);
			
 
				+    }, 600);
			
 
				+  }, [navigate]);
			
 
				+
			
 
				+  // 表单提交
			
 
				+  const onSubmit = (values) => {    
			
 
				+    startLoading();
			
 
				+    // 可能需要转换下格式
			
 
				+    const data = dataFunc ? dataFunc(id, values) : values;
			
 
				+    if (id) {
			
 
				+      request.update(id, data).then((res) => {
			
 
				+        stopLoading();
			
 
				+        if (onFinish) {
			
 
				+          onFinish(res);
			
 
				+        } else {
			
 
				+          navBack();
			
 
				+        }
			
 
				+      }).catch(stopLoading);
			
 
				+    } else {
			
 
				+      request.save(data)
			
 
				+        .then((res) => {
			
 
				+          stopLoading();
			
 
				+          if (onFinish) {
			
 
				+            onFinish(res);
			
 
				+          } else {
			
 
				+            navBack();
			
 
				+          }
			
 
				+        }).catch(stopLoading);
			
 
				+    }
			
 
				+  }
			
 
				+
			
 
				+  // 查询详情
			
 
				+  React.useEffect(() => {
			
 
				+    if (id && request) {
			
 
				+      request.get(id).then(res => {
			
 
				+        // 此处可能需要转换下数据格式
			
 
				+        const formData = formDataFunc ? formDataFunc(res) : res;
			
 
				+        form.setFieldsValue(formData);
			
 
				+      })
			
 
				+    }
			
 
				+  }, [request, id]);
			
 
				+
			
 
				+  return (
			
 
				+    <Page>
			
 
				+      <Card bodyStyle={{padding: '48px 24px'}}>
			
 
				+        <Form {...formItemLayout} form={form} onFinish={onSubmit} style={{width}} {...leftProps} >
			
 
				+          {props.children}
			
 
				+          <FormItem label=" " colon={false} style={{marginBottom: 0}}>
			
 
				+            <Button type="default" onClick={() => navigate(-1)}>
			
 
				+              取消
			
 
				+            </Button>
			
 
				+            <Button
			
 
				+              type="primary"
			
 
				+              htmlType="submit"
			
 
				+              style={{ marginLeft: '4em' }}
			
 
				+              loading={loading}
			
 
				+            >
			
 
				+              确认
			
 
				+            </Button>
			
 
				+          </FormItem>
			
 
				+        </Form>
			
 
				+      </Card>
			
 
				+    </Page>
			
 
				+  )
			
 
				+}
			
--- a/src/components/Page/List.jsx
+++ b/src/components/Page/List.jsx
@@ -0,0 +1,89 @@
 
				+import React from 'react';
			
 
				+import { Button, Popconfirm, message } from 'antd';
			
 
				+import { ProTable } from '@ant-design/pro-components';
			
 
				+import { queryTable } from '@/utils/request';
			
 
				+import Page from './index';
			
 
				+
			
 
				+export default React.forwardRef((props, ref) => {
			
 
				+  /**
			
 
				+   * request 与 ProTable 定义不同，这个只是普通的接口即可
			
 
				+   */
			
 
				+  const { request, rowKey, columns, onAdd, onDelete, onEdit, toolBarRender, columnOptionRender, ...leftProps } = props;
			
 
				+  const actionRef = React.useRef();
			
 
				+  const hideRef = React.useRef();
			
 
				+
			
 
				+  const api = React.useMemo(() => queryTable(request), [request]);
			
 
				+
			
 
				+  // 统一实现操作列
			
 
				+  const cols = React.useMemo(() => [
			
 
				+    ...columns,
			
 
				+    {
			
 
				+      title: '操作',
			
 
				+      valueType: 'option',
			
 
				+      key: 'option',
			
 
				+      ellipsis: true,
			
 
				+      render: (_, record) => [
			
 
				+        (
			
 
				+          onEdit && 
			
 
				+          <Button style={{ padding: 0 }} type="link" key={1} onClick={() => onEdit(record) }>
			
 
				+            编辑
			
 
				+          </Button>
			
 
				+        ),
			
 
				+        (
			
 
				+          onDelete &&
			
 
				+          <Popconfirm
			
 
				+            key={3}
			
 
				+            title="您是否确认删除 ?"
			
 
				+            onConfirm={() => onDelete(record)}
			
 
				+            okText="确定"
			
 
				+            cancelText="取消"
			
 
				+          >
			
 
				+            <Button style={{ padding: 0 }} type="link">
			
 
				+              删除
			
 
				+            </Button>
			
 
				+          </Popconfirm>
			
 
				+        ),
			
 
				+        ...(columnOptionRender ? columnOptionRender(_, record) : []),
			
 
				+      ].filter(Boolean),
			
 
				+    },
			
 
				+  ], [columns, onEdit, onDelete]);
			
 
				+
			
 
				+  React.useImperativeHandle(ref, () => {
			
 
				+    const showLoading = msg => (hideRef.current = message.loading(msg || '操作中, 请稍候...'));
			
 
				+    const hideLoading = () => hideRef.current && hideRef.current();
			
 
				+    const reload = () => actionRef.current?.reload && actionRef.current.reload();
			
 
				+
			
 
				+    return {
			
 
				+      showLoading,
			
 
				+      hideLoading,
			
 
				+      reload,
			
 
				+      actionRef: actionRef,
			
 
				+    }
			
 
				+  }, []);
			
 
				+
			
 
				+  return (
			
 
				+    <Page>
			
 
				+      <ProTable
			
 
				+        rowKey={rowKey}
			
 
				+        columns={cols}
			
 
				+        request={api}
			
 
				+        cardBordered
			
 
				+        actionRef={actionRef}
			
 
				+        toolBarRender={() => [
			
 
				+          (
			
 
				+            onAdd && 
			
 
				+            <Button
			
 
				+              key="1"
			
 
				+              type="primary"
			
 
				+              onClick={onAdd}
			
 
				+            >
			
 
				+              新增
			
 
				+            </Button>
			
 
				+          ),
			
 
				+          ...(toolBarRender ? toolBarRender() : []),
			
 
				+        ].filter(Boolean)}
			
 
				+        {...leftProps}
			
 
				+      />
			
 
				+    </Page>
			
 
				+  )
			
 
				+});
			
--- a/src/components/Page/index.jsx
+++ b/src/components/Page/index.jsx
@@ -0,0 +1,24 @@
 
				+import React from 'react';
			
 
				+import { Typography } from 'antd';
			
 
				+import useRoute from '@/routes/hooks/useRoute';
			
 
				+
			
 
				+const pageStyle = {
			
 
				+  margin: '0 24px 24px 24px',
			
 
				+  // margin: '24px',
			
 
				+  minHeight: 'calc(100% - 24px)',
			
 
				+}
			
 
				+const { Title } = Typography;
			
 
				+
			
 
				+export default (props) => {
			
 
				+  console.log(props);
			
 
				+  const { meta = {} } = useRoute() || {};
			
 
				+  const style = meta.noLayout ? { height: '100%' } : pageStyle;
			
 
				+  const title = props.title || meta.title;
			
 
				+
			
 
				+  return (
			
 
				+    <div style={style}>
			
 
				+      { title && !meta.noLayout && <Title level={3} style={{ paddingBottom: '12px', fontWeight: 400 }}>{ title }</Title> }
			
 
				+      {props.children}
			
 
				+    </div>
			
 
				+  )
			
 
				+}
			
--- a/src/components/Upload/Upload.jsx
+++ b/src/components/Upload/Upload.jsx
@@ -0,0 +1,10 @@
 
				+import { Upload } from 'antd';
			
 
				+import { uploadFile } from './request'
			
 
				+
			
 
				+export default (props) => {
			
 
				+  return (
			
 
				+    <Upload {...props} customRequest={uploadFile} >
			
 
				+      {props.children}
			
 
				+    </Upload>
			
 
				+  )
			
 
				+}
			
--- a/src/components/Upload/UploadImage.jsx
+++ b/src/components/Upload/UploadImage.jsx
@@ -0,0 +1,60 @@
 
				+import React, { useState } from 'react';
			
 
				+import { LoadingOutlined, PlusOutlined } from '@ant-design/icons';
			
 
				+import Upload from './Upload';
			
 
				+
			
 
				+function beforeUpload(file) {
			
 
				+  const isImage = file.type === 'image/jpeg' || file.type === 'image/png'||file.type==='image/gif';
			
 
				+  if (!isImage) {
			
 
				+    message.error('请上传 JPG , PNG或GIF 图片!');
			
 
				+  }
			
 
				+  const isLt10M = file.size / 1024 / 1024 < 10;
			
 
				+  if (!isLt10M) {
			
 
				+    message.error('图片大小必须小于 10MB!');
			
 
				+  }
			
 
				+
			
 
				+  return isImage && isLt10M;
			
 
				+}
			
 
				+
			
 
				+const UploadButton = (props) => (
			
 
				+  <div>
			
 
				+    {props.loading ? <LoadingOutlined /> : <PlusOutlined />}
			
 
				+    <div style={{ marginTop: 8 }}>上传</div>
			
 
				+  </div>
			
 
				+);
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const { value, onChange } = props;
			
 
				+
			
 
				+  const [loading, setLoading] = useState(false);
			
 
				+
			
 
				+  const handleChange = info => {
			
 
				+    if (info.file.status === 'uploading') {
			
 
				+      setLoading(true);
			
 
				+      return;
			
 
				+    }
			
 
				+    if (info.file.status === 'error') {
			
 
				+      setLoading(false);
			
 
				+      return;
			
 
				+    }
			
 
				+
			
 
				+    if (info.file.status === 'done') {
			
 
				+      setLoading(false);
			
 
				+      const { url, fileType } = info.file.response;
			
 
				+      onChange(url);
			
 
				+    }
			
 
				+  };
			
 
				+
			
 
				+  const previewUrl = getRealPath ? getRealPath(value) : value;
			
 
				+
			
 
				+  return (
			
 
				+    <Upload
			
 
				+      listType="picture-card"
			
 
				+      className="image-uploader"
			
 
				+      showUploadList={false}
			
 
				+      beforeUpload={beforeUpload}
			
 
				+      onChange={handleChange}
			
 
				+    >
			
 
				+      {value ? <img src={previewUrl} alt="avatar" style={{ width: '100%', height: '100%' }} /> : <UploadButton loading={loading} />}
			
 
				+    </Upload>
			
 
				+  );
			
 
				+}
			
--- a/src/components/Upload/UploadImageList.jsx
+++ b/src/components/Upload/UploadImageList.jsx
@@ -0,0 +1,115 @@
 
				+
			
 
				+import React, { useEffect, useState } from 'react';
			
 
				+import { Modal } from 'antd'
			
 
				+import { LoadingOutlined, PlusOutlined } from '@ant-design/icons';
			
 
				+import Upload from './Upload';
			
 
				+
			
 
				+function beforeUpload(file) {
			
 
				+  const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png'|| file.type === 'image/gif';
			
 
				+  if (!isJpgOrPng) {
			
 
				+    message.error('请上传 JPG,PNG 或 GIF 图片!');
			
 
				+  }
			
 
				+  const isLt10M = file.size / 1024 / 1024 < 10;
			
 
				+  if (!isLt10M) {
			
 
				+    message.error('图片大小必须小于 10MB!');
			
 
				+  }
			
 
				+
			
 
				+  return isJpgOrPng && isLt10M;
			
 
				+}
			
 
				+
			
 
				+const UploadButton = (props) => (
			
 
				+  <div>
			
 
				+    {props.loading ? <LoadingOutlined /> : <PlusOutlined />}
			
 
				+    <div style={{ marginTop: 8 }}>上传</div>
			
 
				+  </div>
			
 
				+);
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const { value, onChange, input, output } = props;
			
 
				+
			
 
				+  const [loading, setLoading] = useState(false);
			
 
				+  const [previewVisible, setPreviewVisible] = useState(false);
			
 
				+  const [previewImage, setPreviewImage] = useState();
			
 
				+  const [fileList, setFileList] = useState([]);
			
 
				+
			
 
				+  const handleChange = info => {
			
 
				+    if (info.file.status === 'uploading') {
			
 
				+      setLoading(true);
			
 
				+      return;
			
 
				+    }
			
 
				+    if (info.file.status === 'error') {
			
 
				+      setLoading(false);
			
 
				+      return;
			
 
				+    }
			
 
				+
			
 
				+    if (info.file.status === 'removed') {
			
 
				+      toggleChange(info.fileList)
			
 
				+    }
			
 
				+  };
			
 
				+
			
 
				+  const handleSuccess = ({url}) => {
			
 
				+    setLoading(false)
			
 
				+    const inx = fileList?.length ? fileList.length + 1 : 1
			
 
				+    const list = fileList.concat({
			
 
				+      url,
			
 
				+      uid: `new-${inx}`,
			
 
				+      status: 'done'
			
 
				+    })
			
 
				+    toggleChange(list)
			
 
				+  }
			
 
				+
			
 
				+  const toggleChange = (list) => {
			
 
				+    if (output) {
			
 
				+      onChange(list.map(x => output(x)))
			
 
				+    } else {
			
 
				+      onChange(list)
			
 
				+    }
			
 
				+  }
			
 
				+
			
 
				+  const handlePreview = (file) => {
			
 
				+    setPreviewImage(file.url)
			
 
				+    setPreviewVisible(true)
			
 
				+  }
			
 
				+
			
 
				+  useEffect(() => {
			
 
				+    if (input) {
			
 
				+      const lst = (value || []).map((it) => {
			
 
				+        const { uid, url } = input(it)
			
 
				+        return {
			
 
				+          uid,
			
 
				+          url,
			
 
				+          status: 'done',
			
 
				+          raw: it,
			
 
				+        }
			
 
				+      })
			
 
				+      setFileList(lst)
			
 
				+    } else {
			
 
				+      setFileList(value || [])
			
 
				+    }
			
 
				+  }, [value])
			
 
				+
			
 
				+  return (
			
 
				+    <>
			
 
				+      <Upload
			
 
				+        listType="picture-card"
			
 
				+        className="image-uploader"
			
 
				+        fileList={fileList}
			
 
				+        beforeUpload={beforeUpload}
			
 
				+        onChange={handleChange}
			
 
				+        onPreview={handlePreview}
			
 
				+        onSuccess={handleSuccess}
			
 
				+      >
			
 
				+        <UploadButton loading={loading} />
			
 
				+      </Upload>
			
 
				+      <Modal
			
 
				+        visible={previewVisible}
			
 
				+        title="图片预览"
			
 
				+        footer={null}
			
 
				+        onCancel={() => setPreviewVisible(false)}
			
 
				+      >
			
 
				+        <img alt="example" style={{ width: '100%' }} src={previewImage} />
			
 
				+      </Modal>
			
 
				+    </>
			
 
				+  );
			
 
				+}
			
 
				+
			
--- a/src/components/Upload/UploadVideo.jsx
+++ b/src/components/Upload/UploadVideo.jsx
@@ -0,0 +1,94 @@
 
				+import React, { useState, useRef, useEffect } from 'react';
			
 
				+import { Button } from 'antd'
			
 
				+import Upload from './Upload';
			
 
				+// import { uplodeNoteImage } from '@/services/note';
			
 
				+import styles from './style.less';
			
 
				+
			
 
				+function beforeUpload(file) {
			
 
				+  const isMp4 = file.type === 'video/mp4';
			
 
				+  if (!isMp4) {
			
 
				+    message.error('请上传 MP4 视频!');
			
 
				+  }
			
 
				+
			
 
				+  return isMp4;
			
 
				+}
			
 
				+
			
 
				+export default (props) => {
			
 
				+  //onPoster 改变主图事件   isScreenshot判断父组件是否需要截屏按钮
			
 
				+  const { value, onChange, onPoster, isScreenshot } = props;
			
 
				+  const [loading, setLoading] = useState(false);//上传按钮loading框
			
 
				+  const [capturing, setCapturing] = useState(false);//截屏按钮loading框
			
 
				+  const [video, setVideo] = useState()//当前上传的视频
			
 
				+  const [isVideoReady, setIsVideoReady] = useState(false)//判断视频是否加载成功
			
 
				+  
			
 
				+  const canvasRef = useRef()
			
 
				+  const videoRef = useRef()
			
 
				+
			
 
				+  useEffect(() => {
			
 
				+    setVideo(value)//父组件的视频获取成功时改变当前页面的视频
			
 
				+  }, [value])
			
 
				+
			
 
				+  const handleChange = info => {
			
 
				+    if (info.file.status === 'uploading') {
			
 
				+      setLoading(true);
			
 
				+      return;
			
 
				+    }
			
 
				+    if (info.file.status === 'error') {
			
 
				+      setLoading(false);
			
 
				+      return;
			
 
				+    }
			
 
				+    if (info.file.status === 'done') {
			
 
				+      onChange(info.file.response);
			
 
				+      setLoading(false);
			
 
				+    }
			
 
				+  };
			
 
				+
			
 
				+  //开始截图
			
 
				+  const handelScreenshot = () => {
			
 
				+    const ctx = canvasRef.current.getContext("2d");  
			
 
				+    ctx.drawImage(videoRef.current, 0, 0);    
			
 
				+    const image = canvasRef.current.toDataURL("image/png", 0.9)
			
 
				+    setCapturing(true)
			
 
				+    // uplodeNoteImage({ base64: image }).then((res) => {
			
 
				+    //   onPoster(res)
			
 
				+    //   setCapturing(false)
			
 
				+    // })
			
 
				+  }
			
 
				+
			
 
				+  //视频加载成功事件
			
 
				+  const handleVideoReady = (e) => {
			
 
				+    setIsVideoReady(true)
			
 
				+    canvasRef.current.width = e.target.videoWidth;
			
 
				+    canvasRef.current.height = e.target.videoHeight;
			
 
				+  }
			
 
				+
			
 
				+  return (
			
 
				+    <div className={styles['video-uploader']}>
			
 
				+      <Upload
			
 
				+        className="image-uploader"
			
 
				+        showUploadList={false}
			
 
				+        beforeUpload={beforeUpload}
			
 
				+        onChange={handleChange}
			
 
				+      >
			
 
				+        <div style={{ maxWidth: '1px', maxHeight: '1px', overflow: 'hidden' }}>
			
 
				+          <canvas ref={canvasRef}></canvas>
			
 
				+        </div>
			
 
				+        <Button loading={loading}>
			
 
				+          点击上传视频 (MP4)
			
 
				+        </Button>
			
 
				+
			
 
				+      </Upload>
			
 
				+      {
			
 
				+        isScreenshot && (
			
 
				+          // disabled={!isVideoReady} 当视频准备成功时截屏按钮可以点击  否则不能点击
			
 
				+          <Button loading={capturing} style={{ marginLeft: '1em' }} onClick={handelScreenshot} disabled={!isVideoReady}>截屏</Button>
			
 
				+        )
			
 
				+      }
			
 
				+      {
			
 
				+        !!video && (
			
 
				+          <video ref={videoRef} width="320" height='500' crossOrigin='anonymous' controls src={video} onCanPlay={handleVideoReady}></video>
			
 
				+        )
			
 
				+      }
			
 
				+    </div>
			
 
				+  );
			
 
				+}
			
--- a/src/components/Upload/index.jsx
+++ b/src/components/Upload/index.jsx
@@ -0,0 +1,11 @@
 
				+import Upload from './Upload';
			
 
				+import UploadImage from './UploadImage';
			
 
				+import UploadImageList from './UploadImageList';
			
 
				+import UploadVideo from './UploadVideo';
			
 
				+
			
 
				+export {
			
 
				+  Upload,
			
 
				+  UploadImage,
			
 
				+  UploadImageList,
			
 
				+  UploadVideo,
			
 
				+}
			
--- a/src/components/Upload/request.js
+++ b/src/components/Upload/request.js
@@ -0,0 +1,32 @@
 
				+import request from '@/utils/request';
			
 
				+
			
 
				+const upload = (file, fileType = 'image') => {
			
 
				+  const formData = new FormData();
			
 
				+  formData.append("file", file);
			
 
				+  formData.append("fileType", fileType);
			
 
				+
			
 
				+  return request('/api/admin/file', {
			
 
				+    method: 'post',
			
 
				+    data: formData,
			
 
				+    headers: {
			
 
				+      'Content-Type': 'multipart/form-data',
			
 
				+    }
			
 
				+  });
			
 
				+}
			
 
				+
			
 
				+/**
			
 
				+ * 上传文件
			
 
				+ * @returns 
			
 
				+ */
			
 
				+export function uploadFile(params) {
			
 
				+  const { file, onSuccess, onError } = params;
			
 
				+  upload(file).then((res) => {
			
 
				+    onSuccess(res, file)
			
 
				+  }).catch((e) => {
			
 
				+    onError(e)
			
 
				+  });
			
 
				+
			
 
				+  return {
			
 
				+    abort: () => {},
			
 
				+  };
			
 
				+}
			
--- a/src/components/Upload/style.less
+++ b/src/components/Upload/style.less
@@ -0,0 +1,7 @@
 
				+.video-uploader {
			
 
				+  video {
			
 
				+    margin-top: 2em;
			
 
				+    width: 100%;
			
 
				+    max-height: 360px;
			
 
				+  }
			
 
				+}
			
--- a/src/components/Wangeditor/index.jsx
+++ b/src/components/Wangeditor/index.jsx
@@ -0,0 +1,87 @@
 
				+import React, { useState, useEffect } from "react";
			
 
				+import "@wangeditor/editor/dist/css/style.css";
			
 
				+import { Editor, Toolbar } from "@wangeditor/editor-for-react";
			
 
				+
			
 
				+// 工具栏配置参考
			
 
				+// https://www.cnblogs.com/-roc/p/16400965.html
			
 
				+
			
 
				+const defaultStyle = {
			
 
				+  border: "1px solid #ccc",
			
 
				+  zIndex: 100,
			
 
				+  marginTop: "15px"
			
 
				+}
			
 
				+
			
 
				+function MyEditor(props) {
			
 
				+
			
 
				+  const style = React.useMemo(() => ({ ...defaultStyle, ...(props.style || {}) }), [props.style])
			
 
				+
			
 
				+  const {
			
 
				+    value = "",
			
 
				+    onChange = (e) => {
			
 
				+      setHtml(e);
			
 
				+    },
			
 
				+    toolbarConfig = {
			
 
				+      excludeKeys: ["group-image", "group-video"],
			
 
				+    },
			
 
				+    editorConfig = {
			
 
				+      placeholder: "请输入内容...",
			
 
				+    },
			
 
				+    readonly = false,
			
 
				+  } = props;
			
 
				+  const [editor, setEditor] = useState(null); // 存储 editor 实例
			
 
				+  const [html, setHtml] = useState("");
			
 
				+ 
			
 
				+  // 模拟 ajax 请求，异步设置 html
			
 
				+  useEffect(() => {
			
 
				+    setHtml(value || "");
			
 
				+  }, [value]);
			
 
				+
			
 
				+  // 及时销毁 editor
			
 
				+  useEffect(() => {
			
 
				+    return () => {
			
 
				+      if (editor == null) return;
			
 
				+      editor.destroy();
			
 
				+      setEditor(null);
			
 
				+    };
			
 
				+  }, [editor]);
			
 
				+
			
 
				+  function insertText() {
			
 
				+    if (editor == null) return;
			
 
				+    editor.insertText(" hello ");
			
 
				+  }
			
 
				+
			
 
				+  function printHtml() {
			
 
				+    if (editor == null) return;
			
 
				+    console.log(editor.getHtml());
			
 
				+  }
			
 
				+
			
 
				+  const handleChange = (editor) => {
			
 
				+    const raw = editor.getHtml();
			
 
				+    if (raw !== '<p><br></p>') {
			
 
				+      onChange(raw)
			
 
				+    }
			
 
				+  }
			
 
				+
			
 
				+  return !readonly ? (
			
 
				+    <div className={props.className} style={style}>
			
 
				+      <Toolbar
			
 
				+        editor={editor}
			
 
				+        defaultConfig={toolbarConfig}
			
 
				+        mode="default"
			
 
				+        style={{ borderBottom: "1px solid #ccc" }}
			
 
				+      />
			
 
				+      <Editor
			
 
				+        defaultConfig={editorConfig}
			
 
				+        value={html}
			
 
				+        onCreated={setEditor}
			
 
				+        onChange={handleChange}
			
 
				+        mode="default"
			
 
				+        style={{ height: "500px" }}
			
 
				+      />
			
 
				+    </div>
			
 
				+  ) : (
			
 
				+    <div dangerouslySetInnerHTML={{ __html: value }}></div>
			
 
				+  );
			
 
				+}
			
 
				+
			
 
				+export default MyEditor;
			
--- a/src/components/chart/index.jsx
+++ b/src/components/chart/index.jsx
@@ -0,0 +1,81 @@
 
				+import React, { useRef, useEffect } from 'react';
			
 
				+
			
 
				+// 引入 echarts 核心模块，核心模块提供了 echarts 使用必须要的接口。
			
 
				+import * as echarts from 'echarts/core';
			
 
				+// 引入图表，图表后缀都为 Chart
			
 
				+import {
			
 
				+  BarChart,
			
 
				+  PieChart,
			
 
				+  LineChart,
			
 
				+  GaugeChart,
			
 
				+  RadarChart,
			
 
				+  PictorialBarChart,
			
 
				+} from 'echarts/charts';
			
 
				+// 引入提示框，标题，直角坐标系，数据集，内置数据转换器组件，组件后缀都为 Component
			
 
				+import {
			
 
				+  TitleComponent,
			
 
				+  TooltipComponent,
			
 
				+  ToolboxComponent,
			
 
				+  GridComponent,
			
 
				+  DatasetComponent,
			
 
				+  LegendComponent,
			
 
				+  DataZoomComponent,
			
 
				+  TransformComponent,
			
 
				+  VisualMapComponent,
			
 
				+} from 'echarts/components';
			
 
				+// 标签自动布局，全局过渡动画等特性
			
 
				+import { LabelLayout, UniversalTransition } from 'echarts/features';
			
 
				+// 引入 Canvas 渲染器，注意引入 CanvasRenderer 或者 SVGRenderer 是必须的一步
			
 
				+import { CanvasRenderer } from 'echarts/renderers';
			
 
				+
			
 
				+// 注册必须的组件
			
 
				+echarts.use([
			
 
				+  TitleComponent,
			
 
				+  TooltipComponent,
			
 
				+  ToolboxComponent,
			
 
				+  GridComponent,
			
 
				+  DatasetComponent,
			
 
				+  LegendComponent,
			
 
				+  DataZoomComponent,
			
 
				+  TransformComponent,
			
 
				+  VisualMapComponent,
			
 
				+  BarChart,
			
 
				+  PieChart,
			
 
				+  LineChart,
			
 
				+  GaugeChart,
			
 
				+  RadarChart,
			
 
				+  PictorialBarChart,
			
 
				+  LabelLayout,
			
 
				+  UniversalTransition,
			
 
				+  CanvasRenderer
			
 
				+]);
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const { className, style, option } = props;
			
 
				+
			
 
				+  const domRef = useRef();
			
 
				+  const chartRef = useRef();
			
 
				+
			
 
				+  useEffect(() => {
			
 
				+    if (!chartRef.current) {
			
 
				+      chartRef.current = echarts.init(domRef.current);
			
 
				+    }
			
 
				+
			
 
				+    const resize = () => {
			
 
				+      const t = setTimeout(() => {
			
 
				+        clearTimeout(t);
			
 
				+        chartRef.current.resize();
			
 
				+      }, 100);
			
 
				+    };
			
 
				+
			
 
				+    chartRef.current.setOption(option);
			
 
				+    resize();
			
 
				+
			
 
				+    window.addEventListener('resize', resize);    
			
 
				+    return () => window.removeEventListener('resize', resize);
			
 
				+  }, [option]);
			
 
				+
			
 
				+  return (
			
 
				+    <div className={className} style={style} ref={domRef}></div>
			
 
				+  )
			
 
				+}
			
--- a/src/index.less
+++ b/src/index.less
@@ -0,0 +1,71 @@
 
				+@import './theme.less';
			
 
				+
			
 
				+html, body, #root {
			
 
				+  width: 100%;
			
 
				+  height: 100%;
			
 
				+  margin: 0;
			
 
				+}
			
 
				+
			
 
				+:root {
			
 
				+  --theme-color: #fff;
			
 
				+  --theme-front: #000;
			
 
				+  --theme-main-bg: #f1f7fe; // #f0f2f5;
			
 
				+  --header-height: 60px;
			
 
				+  --siderbar-width: 240px;
			
 
				+}
			
 
				+
			
 
				+.main-layout {
			
 
				+  height: 100vh;
			
 
				+  display: flex;
			
 
				+  flex-direction: column;
			
 
				+}
			
 
				+
			
 
				+.fixd-header {
			
 
				+  width: 100%;
			
 
				+  position: fixed;
			
 
				+  top: 0;
			
 
				+  height: var(--header-height);
			
 
				+  line-height: var(--header-height);
			
 
				+  z-index: 100;
			
 
				+}
			
 
				+
			
 
				+.ant-layout-header {
			
 
				+  line-height: var(--header-height);
			
 
				+  z-index: 10;
			
 
				+}
			
 
				+
			
 
				+.layout-sidebar {
			
 
				+  width: var(--siderbar-width);
			
 
				+  color: var(--theme-front);
			
 
				+}
			
 
				+
			
 
				+.ant-card, .ant-pro-card {
			
 
				+  border-radius: 8px !important;
			
 
				+}
			
 
				+
			
 
				+
			
 
				+// 兼容 360
			
 
				+.ant-pro-sider-collapsed-button {
			
 
				+  top: 18px;
			
 
				+  right: -13px;
			
 
				+}
			
 
				+
			
 
				+.ant-pro .ant-pro-layout .ant-pro-sider-logo {
			
 
				+  padding: 16px;
			
 
				+}
			
 
				+
			
 
				+.ant-pro .ant-pro-query-filter .ant-form-item {
			
 
				+  margin: 0;
			
 
				+}
			
 
				+
			
 
				+.ant-pro-page-container .ant-pro-page-container-warp-page-header ~ .ant-pro-grid-content .ant-pro-page-container-children-content {
			
 
				+  margin: 8px 40px 40px 40px;
			
 
				+}
			
 
				+
			
 
				+.ant-pro-table-list-toolbar-container {
			
 
				+  padding: 16px 0;
			
 
				+}
			
 
				+
			
 
				+.ant-pro-card .ant-pro-card-body {
			
 
				+  padding: 16px 24px;
			
 
				+}
			
--- a/src/layouts/AuthLayout/Main.jsx
+++ b/src/layouts/AuthLayout/Main.jsx
@@ -0,0 +1,40 @@
 
				+import React from "react";
			
 
				+import { Layout } from "antd";
			
 
				+import { useLocation, Outlet, useNavigate } from "react-router-dom";
			
 
				+import { useModel } from "@/store";
			
 
				+import useRoute from "@/routes/hooks/useRoute";
			
 
				+import SiderBar from "./components/SiderBar";
			
 
				+import Header from "./components/Header";
			
 
				+import Container from "./components/Container";
			
 
				+
			
 
				+import "./style.less";
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const { theme } = useModel("system");
			
 
				+  const { user, menus } = useModel("user");
			
 
				+  const navigate = useNavigate();
			
 
				+  const location = useLocation();
			
 
				+  const { meta } = useRoute() || {};
			
 
				+  const { noLayout = false, noSiderBar = false, noFooter = false } = meta || {};
			
 
				+
			
 
				+  // 非管理人员只能看到卡片
			
 
				+  React.useEffect(() => {
			
 
				+    if ("1" !== user?.orgId && "/appCenter" !== location.pathname) {
			
 
				+      navigate("/appCenter", { replace: true });
			
 
				+    }
			
 
				+  }, [location.pathname, user?.orgId]);
			
 
				+
			
 
				+  return noLayout ? (
			
 
				+    <Outlet />
			
 
				+  ) : (
			
 
				+    <Layout className={theme} style={{ height: "100vh" }}>
			
 
				+      <Header theme={theme} user={user} />
			
 
				+      <Layout style={{ height: "calc(100vh - var(--header-height))" }}>
			
 
				+        {!noSiderBar && (
			
 
				+          <SiderBar theme={theme} menus={menus} location={location} />
			
 
				+        )}
			
 
				+        <Container location={location} noFooter={noFooter} />
			
 
				+      </Layout>
			
 
				+    </Layout>
			
 
				+  );
			
 
				+};
			
--- a/src/layouts/AuthLayout/RedirectLogin.jsx
+++ b/src/layouts/AuthLayout/RedirectLogin.jsx
@@ -0,0 +1,3 @@
 
				+import { Navigate } from "react-router-dom";
			
 
				+
			
 
				+export default () => <Navigate to="/login?back=true" />;
			
--- a/src/layouts/AuthLayout/components/Background.jsx
+++ b/src/layouts/AuthLayout/components/Background.jsx
@@ -0,0 +1,72 @@
 
				+import React from 'react'
			
 
				+
			
 
				+const wrapperStyle = {
			
 
				+  width: '100%',
			
 
				+  height: '100%',
			
 
				+  position: 'absolute',
			
 
				+  zIndex: 0,
			
 
				+  top: 0,
			
 
				+  left: 0,
			
 
				+  overflow: 'hidden',
			
 
				+}
			
 
				+
			
 
				+const colors = [
			
 
				+  '#fff1f0',
			
 
				+  '#fff2e8',
			
 
				+  '#fff7e6',
			
 
				+  '#fffbe6',
			
 
				+  '#feffe6',
			
 
				+  '#fcffe6',
			
 
				+  '#f6ffed',
			
 
				+  '#e6fffb',
			
 
				+  '#e6f4ff',
			
 
				+  '#f0f5ff',
			
 
				+  '#f9f0ff',
			
 
				+  '#fff0f6',
			
 
				+]
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const ref = React.useRef();
			
 
				+
			
 
				+  const [color1, color2] = React.useMemo(() => {
			
 
				+    const inx1 = Math.floor(Math.random() * colors.length);
			
 
				+    const inx2 = Math.floor(Math.random() * colors.length);
			
 
				+
			
 
				+    return [colors[inx1], colors[inx2]];
			
 
				+  }, []);
			
 
				+
			
 
				+  React.useEffect(() => {
			
 
				+    const dom = ref.current;
			
 
				+    const canvas = dom.firstElementChild;
			
 
				+    canvas.width = dom.offsetWidth;
			
 
				+    canvas.height = dom.offsetHeight;
			
 
				+
			
 
				+    const centerX = canvas.width / 2;
			
 
				+    const centerY = canvas.height / 2;
			
 
				+    const size = centerX / 3
			
 
				+
			
 
				+    const ctx = canvas.getContext("2d");
			
 
				+    
			
 
				+    ctx.filter = `blur(200px)`;
			
 
				+
			
 
				+    ctx.beginPath()
			
 
				+    ctx.fillStyle = color1; // "#ffd8bf";
			
 
				+    ctx.ellipse(centerX + 100, centerY + 80, size, size + Math.random() * 100, Math.PI / 4, 0, 2 * Math.PI);
			
 
				+    ctx.fill();
			
 
				+    ctx.closePath();
			
 
				+
			
 
				+    ctx.beginPath()
			
 
				+    ctx.fillStyle = color2; // "#e6fffb";
			
 
				+    ctx.ellipse(centerX + 400, centerY + 120, size, size + Math.random() * 100, Math.PI / 2, 0, 2 * Math.PI);
			
 
				+    ctx.fill();
			
 
				+    ctx.closePath();
			
 
				+
			
 
				+  }, []);
			
 
				+
			
 
				+  return (
			
 
				+    <div ref={ref} style={wrapperStyle}>
			
 
				+      <canvas>
			
 
				+      </canvas>
			
 
				+    </div>
			
 
				+  )
			
 
				+}
			
--- a/src/layouts/AuthLayout/components/Container.jsx
+++ b/src/layouts/AuthLayout/components/Container.jsx
@@ -0,0 +1,31 @@
 
				+import React from 'react';
			
 
				+import { Layout } from 'antd';
			
 
				+import { Outlet } from "react-router-dom";
			
 
				+import PageTransition from './PageTransition';
			
 
				+import Footer from './Footer';
			
 
				+
			
 
				+const { Content } = Layout;
			
 
				+const marginSpace = 24;
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const { noFooter } = props;
			
 
				+  const footerRef = React.useRef();
			
 
				+  const [height, setHeight] = React.useState(`calc(100% - ${marginSpace * 2}px`);
			
 
				+
			
 
				+  React.useEffect(() => {
			
 
				+    if (footerRef.current) {
			
 
				+      setHeight(`calc(100% - ${footerRef.current.offsetHeight + marginSpace * 2}px)`);
			
 
				+    }
			
 
				+  }, [noFooter])
			
 
				+
			
 
				+  return (
			
 
				+    <div className='layout-container'>
			
 
				+      <Content style={{ minHeight: height, margin: `0 ${marginSpace}px`}}>
			
 
				+        <PageTransition location={props.location}>
			
 
				+          <Outlet />
			
 
				+        </PageTransition>
			
 
				+      </Content>
			
 
				+      {!noFooter && <Footer ref={footerRef} />}
			
 
				+    </div>
			
 
				+  )
			
 
				+}
			
--- a/src/layouts/AuthLayout/components/Footer.jsx
+++ b/src/layouts/AuthLayout/components/Footer.jsx
@@ -0,0 +1,15 @@
 
				+import React from 'react';
			
 
				+import { Layout } from 'antd';
			
 
				+import { useModel } from '@/store';
			
 
				+
			
 
				+const { Footer } = Layout;
			
 
				+
			
 
				+const year = new Date().getFullYear();
			
 
				+export default React.forwardRef((props, ref) => {
			
 
				+  const { app } = useModel('system');
			
 
				+  const copyRight = `${app.company || '南京云致'} @ ${year}`;
			
 
				+
			
 
				+  return (
			
 
				+    <Footer ref={ref} style={{ textAlign: 'center', color: 'rgba(0,0,0, 0.3)' }}>{copyRight}</Footer>
			
 
				+  )
			
 
				+})
			
--- a/src/layouts/AuthLayout/components/Header/Exit.jsx
+++ b/src/layouts/AuthLayout/components/Header/Exit.jsx
@@ -0,0 +1,35 @@
 
				+import React from "react";
			
 
				+import { useNavigate } from "react-router-dom";
			
 
				+import { LogoutOutlined } from "@ant-design/icons";
			
 
				+import { Button, Modal } from "antd";
			
 
				+import { useModel } from "@/store";
			
 
				+
			
 
				+const { confirm } = Modal;
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const navigate = useNavigate();
			
 
				+  const { setUser } = useModel("user");
			
 
				+
			
 
				+  const onExit = () => {
			
 
				+    confirm({
			
 
				+      title: "确认退出系统?",
			
 
				+      onOk: () => {
			
 
				+        // logout(); // 调用接口
			
 
				+        localStorage.removeItem("token");
			
 
				+        setUser();
			
 
				+        navigate("/login?back=true");
			
 
				+      },
			
 
				+    });
			
 
				+  };
			
 
				+
			
 
				+  return (
			
 
				+    <Button
			
 
				+      className="font"
			
 
				+      type="text"
			
 
				+      icon={<LogoutOutlined />}
			
 
				+      onClick={onExit}
			
 
				+    >
			
 
				+      退出
			
 
				+    </Button>
			
 
				+  );
			
 
				+};
			
--- a/src/layouts/AuthLayout/components/Header/Title.jsx
+++ b/src/layouts/AuthLayout/components/Header/Title.jsx
@@ -0,0 +1,24 @@
 
				+
			
 
				+import useRoute from '@/routes/hooks/useRoute';
			
 
				+
			
 
				+const titleStyle = {
			
 
				+  margin: 0,
			
 
				+}
			
 
				+
			
 
				+const spanStyle = {
			
 
				+  display: 'inline-block',
			
 
				+  width: '24px',
			
 
				+  textAlign: 'center'
			
 
				+}
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const route = useRoute();
			
 
				+  const { title } = route && route.meta || {}
			
 
				+
			
 
				+  return (
			
 
				+    <h5 style={titleStyle}>
			
 
				+      { title && <span style={spanStyle}>&raquo;</span> }
			
 
				+      { title && <span>{title}</span> }
			
 
				+    </h5>
			
 
				+  );
			
 
				+}
			
--- a/src/layouts/AuthLayout/components/Header/User.jsx
+++ b/src/layouts/AuthLayout/components/Header/User.jsx
@@ -0,0 +1,122 @@
 
				+import React, {
			
 
				+  useState,
			
 
				+  forwardRef,
			
 
				+  useRef,
			
 
				+  useImperativeHandle,
			
 
				+} from "react";
			
 
				+import { Avatar, Dropdown } from "antd";
			
 
				+import {
			
 
				+  ModalForm,
			
 
				+  ProFormText,
			
 
				+  ProFormDependency,
			
 
				+} from "@ant-design/pro-components";
			
 
				+import md5 from "md5";
			
 
				+import { changePassword } from "@/services/login";
			
 
				+
			
 
				+const DefaultAvatar = ({ color = "#1296db" }) => (
			
 
				+  <svg
			
 
				+    viewBox="0 0 1024 1024"
			
 
				+    version="1.1"
			
 
				+    xmlns="http://www.w3.org/2000/svg"
			
 
				+    width="24"
			
 
				+    height="24"
			
 
				+  >
			
 
				+    <path
			
 
				+      d="M938.666667 883.2c0-8.533333 0-42.666667-21.333334-81.066667-12.8-25.6-34.133333-42.666667-59.733333-59.733333-29.866667-17.066667-68.266667-34.133333-115.2-42.666667-4.266667 0-34.133333-4.266667-59.733333-12.8-29.866667-8.533333-42.666667-12.8-46.933334-17.066666v-25.6c4.266667-55.466667 34.133333-85.333333 59.733334-110.933334 8.533333-8.533333 17.066667-17.066667 25.6-29.866666 29.866667-42.666667 34.133333-85.333333 34.133333-93.866667 0-8.533333 0-12.8-4.266667-21.333333s-8.533333-17.066667-12.8-21.333334c0-12.8 4.266667-25.6 4.266667-34.133333 0-21.333333 4.266667-55.466667-4.266667-89.6 0-4.266667 0-12.8-4.266666-21.333333-8.533333-25.6-17.066667-46.933333-34.133334-64-8.533333 0-68.266667-59.733333-230.4-72.533334H405.333333c-8.533333 0-17.066667 0-25.6 4.266667-29.866667 8.533333-34.133333 29.866667-38.4 38.4v25.6l-4.266666 4.266667c-4.266667 4.266667-46.933333 42.666667-51.2 93.866666-4.266667 34.133333-4.266667 85.333333 0 123.733334-4.266667 8.533333-12.8 17.066667-12.8 38.4 0 8.533333 4.266667 51.2 34.133333 89.6 8.533333 8.533333 12.8 17.066667 25.6 29.866666 25.6 29.866667 55.466667 59.733333 59.733333 110.933334v25.6c-8.533333 4.266667-21.333333 12.8-51.2 21.333333s-59.733333 12.8-64 12.8c-42.666667 8.533333-81.066667 21.333333-110.933333 38.4-25.6 17.066667-46.933333 38.4-59.733333 59.733333-21.333333 38.4-21.333333 72.533333-21.333334 81.066667v21.333333c0 17.066667 17.066667 34.133333 38.4 34.133334h776.533334c21.333333 0 38.4-17.066667 38.4-38.4v-17.066667z"
			
 
				+      fill={color}
			
 
				+    ></path>
			
 
				+  </svg>
			
 
				+);
			
 
				+
			
 
				+const ChangePassword = forwardRef((props, ref) => {
			
 
				+  const { user } = props;
			
 
				+
			
 
				+  const [visible, setVisible] = useState(false);
			
 
				+
			
 
				+  const onFinish = async (values) => {
			
 
				+    const data = {
			
 
				+      originPassword: md5(values.password),
			
 
				+      newPassword: md5(values.newPassword),
			
 
				+    };
			
 
				+
			
 
				+    await changePassword(user.userId, data);
			
 
				+
			
 
				+    return true;
			
 
				+  };
			
 
				+
			
 
				+  useImperativeHandle(ref, () => {
			
 
				+    return {
			
 
				+      show: () => setVisible(true),
			
 
				+    };
			
 
				+  });
			
 
				+
			
 
				+  return (
			
 
				+    <ModalForm
			
 
				+      title="修改密码"
			
 
				+      width="480px"
			
 
				+      open={visible}
			
 
				+      onOpenChange={setVisible}
			
 
				+      onFinish={onFinish}
			
 
				+    >
			
 
				+      <ProFormText.Password
			
 
				+        label="原始密码"
			
 
				+        name="password"
			
 
				+        rules={[{ required: true, message: "请输入原始密码!" }]}
			
 
				+      />
			
 
				+      <ProFormText.Password
			
 
				+        label="新密码"
			
 
				+        name="newPassword"
			
 
				+        rules={[{ required: true, message: "请输入新密码!" }]}
			
 
				+      />
			
 
				+
			
 
				+      <ProFormDependency name={["newPassword"]}>
			
 
				+        {({ newPassword }) => (
			
 
				+          <ProFormText.Password
			
 
				+            label="确认新密码"
			
 
				+            name="newPassword2"
			
 
				+            rules={[
			
 
				+              { required: true, message: "请输入新密码!" },
			
 
				+              () => ({
			
 
				+                validator (_, value) {
			
 
				+                  if (!value || value == newPassword) {
			
 
				+                    return Promise.resolve();
			
 
				+                  }
			
 
				+
			
 
				+                  return Promise.reject("两次输入密码不一致");
			
 
				+                },
			
 
				+              }),
			
 
				+            ]}
			
 
				+          />
			
 
				+        )}
			
 
				+      </ProFormDependency>
			
 
				+    </ModalForm>
			
 
				+  );
			
 
				+});
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const items = [
			
 
				+    {
			
 
				+      key: "changePassword",
			
 
				+      label: "修改密码",
			
 
				+    },
			
 
				+  ];
			
 
				+
			
 
				+  const passRef = useRef();
			
 
				+  const { user = {} } = props;
			
 
				+
			
 
				+  const onClick = ({ key }) => {
			
 
				+    if (key === "changePassword") {
			
 
				+      passRef.current.show();
			
 
				+    }
			
 
				+  };
			
 
				+
			
 
				+  return (
			
 
				+    <Dropdown menu={{ items, onClick }}>
			
 
				+      <div className="user-info">
			
 
				+        <Avatar size={24} src={user.avatar || <DefaultAvatar />} />
			
 
				+        <span className="font">{user.name}</span>
			
 
				+        <ChangePassword user={user} ref={passRef} />
			
 
				+      </div>
			
 
				+    </Dropdown>
			
 
				+  );
			
 
				+};
			
--- a/src/layouts/AuthLayout/components/Header/index.jsx
+++ b/src/layouts/AuthLayout/components/Header/index.jsx
@@ -0,0 +1,28 @@
 
				+import React, { useMemo } from 'react';
			
 
				+import { Layout, Space } from 'antd';
			
 
				+import classNames from 'classnames';
			
 
				+import Title from './Title';
			
 
				+import User from './User';
			
 
				+import Exit from './Exit';
			
 
				+import Logo from '../Logo';
			
 
				+
			
 
				+const { Header } = Layout;
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const { user } = props;
			
 
				+
			
 
				+  const className = useMemo(() => classNames({
			
 
				+    'layout-header': true,
			
 
				+    'light': props.theme === 'light',
			
 
				+  }), [props.theme]);
			
 
				+
			
 
				+  return (
			
 
				+    <Header className={className}>
			
 
				+      <Logo />
			
 
				+      <Space>
			
 
				+        <User user={user} />
			
 
				+        <Exit />
			
 
				+      </Space>
			
 
				+    </Header>
			
 
				+  )
			
 
				+}
			
--- a/src/layouts/AuthLayout/components/HtmlTitle.jsx
+++ b/src/layouts/AuthLayout/components/HtmlTitle.jsx
@@ -0,0 +1,19 @@
 
				+
			
 
				+import { Helmet } from "react-helmet";
			
 
				+import { useModel } from '@/store';
			
 
				+import useRoute from '@/routes/hooks/useRoute';
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const { app } = useModel('system');
			
 
				+  const route = useRoute();
			
 
				+  const { title } = route && route.meta || {}
			
 
				+  
			
 
				+  const titleTemplate = `%s - ${app.fullName}`;
			
 
				+  const defaultTitle = app.fullName;
			
 
				+
			
 
				+  return (
			
 
				+    <Helmet titleTemplate={titleTemplate} defaultTitle={defaultTitle}>
			
 
				+      <title>{title}</title>
			
 
				+    </Helmet>
			
 
				+  );
			
 
				+}
			
--- a/src/layouts/AuthLayout/components/Logo.jsx
+++ b/src/layouts/AuthLayout/components/Logo.jsx
@@ -0,0 +1,17 @@
 
				+import React from 'react';
			
 
				+import { Typography } from 'antd';
			
 
				+import { NavLink } from "react-router-dom";
			
 
				+import { useModel } from '@/store';
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const { app } = useModel('system');
			
 
				+
			
 
				+  return (
			
 
				+    // <NavLink className='logo'  to="/">
			
 
				+    <div className="logo">
			
 
				+      <img src="./logo.png" alt="" />
			
 
				+      <h3>{app.shorName}</h3>
			
 
				+    </div>
			
 
				+    // </NavLink>
			
 
				+  )
			
 
				+}
			
--- a/src/layouts/AuthLayout/components/Menus.jsx
+++ b/src/layouts/AuthLayout/components/Menus.jsx
@@ -0,0 +1,32 @@
 
				+import React from 'react';
			
 
				+import { Menu } from 'antd';
			
 
				+
			
 
				+const menuStyle = { height: '100%' };
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const { theme, items, location } = props;
			
 
				+
			
 
				+  // const selectedKeys = React.useMemo(() => {
			
 
				+  //   const parts = location.pathname.split('/').filter(Boolean);
			
 
				+  //   const keys = parts.reduce((acc, it) => {
			
 
				+  //     const parent = acc.pop();
			
 
				+  //     const path = !parent ? `/${it}` : `${parent}/${it}`
			
 
				+
			
 
				+  //     return acc.concat([parent, path].filter(Boolean));
			
 
				+  //   }, []);
			
 
				+
			
 
				+  //   return keys;
			
 
				+  // }, [location.pathname]);
			
 
				+
			
 
				+  const selectedKeys = [location.pathname];
			
 
				+
			
 
				+  return (
			
 
				+    <Menu
			
 
				+      mode="inline"
			
 
				+      style={menuStyle}
			
 
				+      theme={theme}
			
 
				+      items={items}
			
 
				+      selectedKeys={selectedKeys}
			
 
				+    />
			
 
				+  )
			
 
				+}
			
--- a/src/layouts/AuthLayout/components/PageTransition/index.jsx
+++ b/src/layouts/AuthLayout/components/PageTransition/index.jsx
@@ -0,0 +1,21 @@
 
				+import { TransitionGroup, CSSTransition } from 'react-transition-group';
			
 
				+import './style.less';
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const { location } = props;
			
 
				+  const currentURL = location.pathname + location.search;
			
 
				+
			
 
				+  return (
			
 
				+    <TransitionGroup component={null}>
			
 
				+      <CSSTransition
			
 
				+        key={currentURL}
			
 
				+        addEndListener={(node, done) => node.addEventListener("transitionend", done, false)}
			
 
				+        classNames="page-fade"
			
 
				+      >
			
 
				+        <div style={{ height: '100%' }}>
			
 
				+          {props.children}
			
 
				+        </div>
			
 
				+      </CSSTransition>
			
 
				+    </TransitionGroup>
			
 
				+  );
			
 
				+}
			
--- a/src/layouts/AuthLayout/components/PageTransition/style.less
+++ b/src/layouts/AuthLayout/components/PageTransition/style.less
@@ -0,0 +1,21 @@
 
				+
			
 
				+.page-fade-enter {
			
 
				+  opacity: 0;
			
 
				+  transform: translateY(10%);
			
 
				+}
			
 
				+.page-fade-enter-active {
			
 
				+  opacity: 1;
			
 
				+  transform: translateY(0%);
			
 
				+}
			
 
				+.page-fade-exit {
			
 
				+  opacity: 0; // 1;
			
 
				+  transform: translateY(0%);
			
 
				+}
			
 
				+.page-fade-exit-active {
			
 
				+  opacity: 0;
			
 
				+  transform: translateY(10%);
			
 
				+}
			
 
				+.page-fade-enter-active,
			
 
				+.page-fade-exit-active {
			
 
				+  transition: opacity 220ms, transform 220ms;
			
 
				+}
			
--- a/src/layouts/AuthLayout/components/SiderBar.jsx
+++ b/src/layouts/AuthLayout/components/SiderBar.jsx
@@ -0,0 +1,22 @@
 
				+import React, { useMemo } from 'react';
			
 
				+import { Layout, Spin } from 'antd';
			
 
				+import { getPropertyValue } from '@/utils/css';
			
 
				+import Menus from './Menus';
			
 
				+
			
 
				+const { Sider } = Layout;
			
 
				+
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const { theme, location, menus } = props;
			
 
				+
			
 
				+  const width = useMemo(() => {
			
 
				+    return /\d+/.exec(getPropertyValue('--siderbar-width'))[0] - 0;
			
 
				+  }, []);
			
 
				+
			
 
				+
			
 
				+  return (
			
 
				+    <Sider className='layout-sidebar' theme={theme} collapsible width={width}>
			
 
				+      <Menus theme={theme} items={menus} location={location} />
			
 
				+    </Sider>
			
 
				+  );
			
 
				+}
			
--- a/src/layouts/AuthLayout/index.jsx
+++ b/src/layouts/AuthLayout/index.jsx
@@ -0,0 +1,33 @@
 
				+import React from "react";
			
 
				+import { Spin } from "antd";
			
 
				+import HtmlTitle from "./components/HtmlTitle";
			
 
				+// import Main from './Main';
			
 
				+import withLogin from "./withLogin";
			
 
				+
			
 
				+const Spinner = () => (
			
 
				+  <div
			
 
				+    style={{
			
 
				+      width: "100%",
			
 
				+      height: "100%",
			
 
				+      display: "grid",
			
 
				+      placeItems: "center",
			
 
				+    }}
			
 
				+  >
			
 
				+    <Spin />
			
 
				+  </div>
			
 
				+);
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const RequireLogin = React.lazy(() => {
			
 
				+    return withLogin(import("./Main"));
			
 
				+  });
			
 
				+
			
 
				+  return (
			
 
				+    <>
			
 
				+      <HtmlTitle />
			
 
				+      <React.Suspense fallback={<Spinner />}>
			
 
				+        <RequireLogin />
			
 
				+      </React.Suspense>
			
 
				+    </>
			
 
				+  );
			
 
				+};
			
--- a/src/layouts/AuthLayout/style.less
+++ b/src/layouts/AuthLayout/style.less
@@ -0,0 +1,80 @@
 
				+.layout-header {
			
 
				+  height: var(--header-height);
			
 
				+  box-sizing: border-box;
			
 
				+  padding: 0;
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  justify-content: space-between;
			
 
				+  color: #fff;
			
 
				+
			
 
				+  &.light {
			
 
				+    color: #000;
			
 
				+  }
			
 
				+
			
 
				+  .header-content {
			
 
				+    flex: 1;
			
 
				+  }
			
 
				+
			
 
				+  .font {
			
 
				+    color: inherit;
			
 
				+    display: inline-block;
			
 
				+  }
			
 
				+
			
 
				+  .user-info {
			
 
				+    cursor: pointer;
			
 
				+
			
 
				+    .ant-avatar {
			
 
				+      border: 1px solid rgba(255, 255, 255, 0.4);
			
 
				+    }
			
 
				+
			
 
				+    span {
			
 
				+      margin-left: 1em;
			
 
				+    }
			
 
				+  }
			
 
				+
			
 
				+  .sys-exit {
			
 
				+    margin-right: 1em;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.logo {
			
 
				+  height: var(--header-height);
			
 
				+  display: flex;
			
 
				+  align-items: center;
			
 
				+  box-sizing: border-box;
			
 
				+  padding-left: 1em;
			
 
				+  color: inherit;
			
 
				+
			
 
				+  & > * {
			
 
				+    color: inherit;
			
 
				+    margin: 0;
			
 
				+  }
			
 
				+
			
 
				+  h5 {
			
 
				+    margin: 0;
			
 
				+  }
			
 
				+
			
 
				+  img {
			
 
				+    width: 28px;
			
 
				+    vertical-align: middle;
			
 
				+    margin-right: 1em;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.layout-container {
			
 
				+  flex: 1;
			
 
				+
			
 
				+  overflow-y: auto;
			
 
				+  scrollbar-width: none;
			
 
				+  -ms-overflow-style: none;
			
 
				+
			
 
				+  &::--webkit-scrollbar {
			
 
				+    display: none;
			
 
				+  }
			
 
				+
			
 
				+  padding-top: 0; // 避免子元素的 margin 影响
			
 
				+}
			
 
				+
			
 
				+.ant-menu-vertical {
			
 
				+  border: none;
			
 
				+}
			
--- a/src/layouts/AuthLayout/withLogin.jsx
+++ b/src/layouts/AuthLayout/withLogin.jsx
@@ -0,0 +1,28 @@
 
				+import React from "react";
			
 
				+import store from "@/store";
			
 
				+
			
 
				+export default function withLogin(factory) {
			
 
				+  return new Promise((resolve) => {
			
 
				+    const { user, getCurrentUser } = store.getState("user");
			
 
				+    const loged = user && (user.userId || user.id);
			
 
				+
			
 
				+    if (loged) {
			
 
				+      resolve(factory);
			
 
				+    } else {
			
 
				+      let ticket = undefined;
			
 
				+      const match = window.location?.href?.match(/ticket=([^?&/]*)/);
			
 
				+      if (match?.length > 0) {
			
 
				+        ticket = match[1];
			
 
				+      }
			
 
				+
			
 
				+      getCurrentUser({ ticket: ticket })
			
 
				+        .then(() => {
			
 
				+          resolve(factory);
			
 
				+        })
			
 
				+        .catch((e) => {
			
 
				+          console.error(e);
			
 
				+          resolve(import("./RedirectLogin"));
			
 
				+        });
			
 
				+    }
			
 
				+  });
			
 
				+}
			
--- a/src/main.jsx
+++ b/src/main.jsx
@@ -0,0 +1,16 @@
 
				+import React from 'react';
			
 
				+import ReactDOM from 'react-dom/client';
			
 
				+import Background from './layouts/AuthLayout/components/Background';
			
 
				+import Router from './routes/Router';
			
 
				+import './index.less';
			
 
				+import { Provider } from './store';
			
 
				+import { initTokenIfExists } from './utils/sso';
			
 
				+
			
 
				+initTokenIfExists();
			
 
				+
			
 
				+ReactDOM.createRoot(document.getElementById('root')).render(
			
 
				+  <Provider>
			
 
				+    <Background />
			
 
				+    <Router />
			
 
				+  </Provider>
			
 
				+);
			
--- a/src/pages/404/index.jsx
+++ b/src/pages/404/index.jsx
@@ -0,0 +1,29 @@
 
				+import React from 'react';
			
 
				+import { Button, Result } from 'antd';
			
 
				+import { Helmet } from "react-helmet";
			
 
				+import { NavLink } from "react-router-dom";
			
 
				+import { useModel } from '@/store';
			
 
				+
			
 
				+const style = {
			
 
				+  display: 'grid',
			
 
				+  placeItems: 'center',
			
 
				+  height: '100%'
			
 
				+}
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const { app } = useModel('system');
			
 
				+
			
 
				+  return (
			
 
				+    <div style={style}>
			
 
				+      <Helmet>
			
 
				+        <title>{app.fullName}</title>
			
 
				+      </Helmet>
			
 
				+      <Result
			
 
				+        status="404"
			
 
				+        title="404"
			
 
				+        subTitle="页面不存在"
			
 
				+        extra={<NavLink to="/" replace><Button type="primary">返回首页</Button></NavLink>}
			
 
				+      />
			
 
				+    </div>
			
 
				+  )
			
 
				+}
			
--- a/src/pages/login/Effect.jsx
+++ b/src/pages/login/Effect.jsx
@@ -0,0 +1,11 @@
 
				+import React from "react";
			
 
				+
			
 
				+export default (props) => {
			
 
				+  return (
			
 
				+    <div className="login-effect-box">
			
 
				+      <div className="login-effect">
			
 
				+        <div className="login-effect-arc"></div>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+  );
			
 
				+};
			
--- a/src/pages/login/LoginForm.jsx
+++ b/src/pages/login/LoginForm.jsx
@@ -0,0 +1,54 @@
 
				+import React from "react";
			
 
				+import md5 from "md5";
			
 
				+import { Button, Form, Input } from "antd";
			
 
				+import { login } from "@/services/login";
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const { onSuccess, mode, appid } = props;
			
 
				+  const [form] = Form.useForm();
			
 
				+  const [loading, setLoading] = React.useState(false);
			
 
				+  const onFinish = (values) => {
			
 
				+    const formData = new FormData();
			
 
				+    formData.append("name", values.name);
			
 
				+    formData.append("pwd", md5(values.pwd));
			
 
				+    if (mode) {
			
 
				+      formData.append("mode", mode);
			
 
				+    }
			
 
				+    formData.append("client", appid);
			
 
				+
			
 
				+    setLoading(true);
			
 
				+    login(formData)
			
 
				+      .then((res) => {
			
 
				+        onSuccess(res);
			
 
				+        setLoading(false);
			
 
				+      })
			
 
				+      .catch((err) => {
			
 
				+        console.log('----err--', err);
			
 
				+        setLoading(false);
			
 
				+      });
			
 
				+  };
			
 
				+  return (
			
 
				+    <Form form={form} layout="vertical" onFinish={onFinish}>
			
 
				+      <Form.Item label="用户名" name="name" required>
			
 
				+        <Input placeholder="请输入用户名" style={{ borderRadius: "4px" }} />
			
 
				+      </Form.Item>
			
 
				+      <Form.Item label="密 码" name="pwd" required>
			
 
				+        <Input.Password
			
 
				+          placeholder="请输入密码"
			
 
				+          style={{ borderRadius: "4px" }}
			
 
				+        />
			
 
				+      </Form.Item>
			
 
				+      <Form.Item>
			
 
				+        <Button
			
 
				+          type="primary"
			
 
				+          size="large"
			
 
				+          style={{ width: "100%", marginTop: "24px", borderRadius: "4px" }}
			
 
				+          loading={loading}
			
 
				+          htmlType="submit"
			
 
				+        >
			
 
				+          登录
			
 
				+        </Button>
			
 
				+      </Form.Item>
			
 
				+    </Form>
			
 
				+  );
			
 
				+};
			
--- a/src/pages/login/LoginUse.jsx
+++ b/src/pages/login/LoginUse.jsx
@@ -0,0 +1,45 @@
 
				+import React from "react";
			
 
				+import { Button, Form, Input } from "antd";
			
 
				+export default (props) => {
			
 
				+  const { loading, checkLoginwx } = props;
			
 
				+  console.log(loading);
			
 
				+  const style = {
			
 
				+    display: "flex",
			
 
				+    justifyContent: "flex-end",
			
 
				+    cursor: "pointer",
			
 
				+    color: "#576b95",
			
 
				+    position: "absolute",
			
 
				+    top: "0",
			
 
				+    right: "0",
			
 
				+    height: "33px",
			
 
				+    lineHeight: "33px",
			
 
				+  };
			
 
				+  return (
			
 
				+    <>
			
 
				+      <span style={style} onClick={checkLoginwx}>
			
 
				+        使用二维码登录
			
 
				+      </span>
			
 
				+
			
 
				+      <Form.Item label="用户名" name="name" required>
			
 
				+        <Input placeholder="请输入用户名" style={{ borderRadius: "4px" }} />
			
 
				+      </Form.Item>
			
 
				+      <Form.Item label="密 码" name="pwd" required>
			
 
				+        <Input.Password
			
 
				+          placeholder="请输入密码"
			
 
				+          style={{ borderRadius: "4px" }}
			
 
				+        />
			
 
				+      </Form.Item>
			
 
				+      <Form.Item>
			
 
				+        <Button
			
 
				+          type="primary"
			
 
				+          size="large"
			
 
				+          style={{ width: "100%", marginTop: "24px", borderRadius: "4px" }}
			
 
				+          loading={loading}
			
 
				+          htmlType="submit"
			
 
				+        >
			
 
				+          登录
			
 
				+        </Button>
			
 
				+      </Form.Item>
			
 
				+    </>
			
 
				+  );
			
 
				+};
			
--- a/src/pages/login/components/LoginQrCode.jsx
+++ b/src/pages/login/components/LoginQrCode.jsx
@@ -0,0 +1,159 @@
 
				+import React from 'react';
			
 
				+import { Button } from 'antd';
			
 
				+import { qrCode, postQrCode } from "@/services/login";
			
 
				+import QrCode from './QrCode';
			
 
				+import SuccessIcon from './SuccessIcon';
			
 
				+import styles from './qrcode.module.less';
			
 
				+
			
 
				+// 轮询
			
 
				+const polling = (p, delay) => {
			
 
				+  let t = null;
			
 
				+  let cancelled = false;
			
 
				+
			
 
				+  const clearTicker = () => {
			
 
				+    if (t) {
			
 
				+      clearTimeout(t);
			
 
				+      t = null;
			
 
				+    }
			
 
				+  }
			
 
				+
			
 
				+  const cancel = () => {
			
 
				+    cancelled = true;
			
 
				+    clearTimeout(t);
			
 
				+  };
			
 
				+
			
 
				+  const fn = () => {
			
 
				+    p().then((done) => {
			
 
				+      clearTicker();
			
 
				+
			
 
				+      if (!done && !cancelled) {
			
 
				+        t = setTimeout(fn, delay);
			
 
				+      }
			
 
				+    }).catch(() => {
			
 
				+      clearTicker();
			
 
				+    });
			
 
				+  }
			
 
				+
			
 
				+  fn();
			
 
				+
			
 
				+  return cancel;
			
 
				+};
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const { onSuccess, mode, appid } = props;
			
 
				+
			
 
				+  // 二维码是否初始化
			
 
				+  const [qrInited, setQrInited] = React.useState(false);
			
 
				+  // 是否扫码
			
 
				+  const [scaned, setScaned] = React.useState(false);
			
 
				+  // 二维码数据
			
 
				+  const [qrData, setQrData] = React.useState();
			
 
				+  // 是否发生错误
			
 
				+  const [hasError, setHasError] = React.useState(false);
			
 
				+  // 提示信息
			
 
				+  const [tips, setTips] = React.useState();
			
 
				+  // 停止轮询控制器
			
 
				+  const pollingCancel = React.useRef();
			
 
				+
			
 
				+  // 重新开始
			
 
				+  const onReset = () => {
			
 
				+    // 停止轮询
			
 
				+    if (pollingCancel.current) {
			
 
				+      pollingCancel.current();
			
 
				+    }
			
 
				+
			
 
				+    setQrInited(false);
			
 
				+    setScaned(false);
			
 
				+    setHasError(false);
			
 
				+  }
			
 
				+
			
 
				+  // 校验二维码各种状态
			
 
				+  const checkQrCode = React.useCallback((qrId, params) => {
			
 
				+    return new Promise((resolve, reject) => {
			
 
				+      postQrCode(qrId, params).then(res => {
			
 
				+        // 带有 token 说明扫码登录成功
			
 
				+        if (res.token) {
			
 
				+          onSuccess(res);
			
 
				+          resolve(true);
			
 
				+          return;
			
 
				+        } else {
			
 
				+          // state 与 stateLabels 是对应关系
			
 
				+          const { state } = res;
			
 
				+          const stateLabels = [
			
 
				+            '未扫码',
			
 
				+            '扫码成功, 请确认登录',
			
 
				+            '扫码确认',
			
 
				+            '已取消',
			
 
				+            '已删除',
			
 
				+          ]
			
 
				+
			
 
				+          const isError = state > 2;
			
 
				+          setScaned(state == 1);
			
 
				+          setHasError(isError);
			
 
				+          setTips(stateLabels[state]);
			
 
				+
			
 
				+          if (isError) {
			
 
				+            reject();
			
 
				+          } else {
			
 
				+            resolve();
			
 
				+          }
			
 
				+        }
			
 
				+      }).catch((err) => {
			
 
				+        console.error(err);
			
 
				+        setTips(err.data.msg || err.message || err);
			
 
				+
			
 
				+        setScaned(false);
			
 
				+        setHasError(true);
			
 
				+        reject();
			
 
				+      });
			
 
				+    });
			
 
				+  }, []);
			
 
				+
			
 
				+  // 请求二维码
			
 
				+  React.useEffect(() => {
			
 
				+    if (!qrInited) {
			
 
				+      qrCode({ client: appid || "authcenter" }).then(res => {
			
 
				+        setQrData(res);
			
 
				+        setQrInited(true);
			
 
				+
			
 
				+        // 开启轮询
			
 
				+        const fn = () => checkQrCode(res.id, { mode });
			
 
				+        pollingCancel.current = polling(fn, 1000);
			
 
				+      })
			
 
				+    }
			
 
				+  }, [qrInited, mode]);
			
 
				+
			
 
				+  return (
			
 
				+    <div className={styles['qr-form']}>
			
 
				+      <div className={styles['qr-form-wrapper']}>
			
 
				+
			
 
				+        <div className={styles['qr-box']}>
			
 
				+          <QrCode text={qrData?.qrCode} />
			
 
				+        </div>
			
 
				+
			
 
				+        {
			
 
				+          (scaned || hasError) && (
			
 
				+            <div className={styles['status-box']}>
			
 
				+              <div>
			
 
				+                {
			
 
				+                  scaned && !hasError && <SuccessIcon />
			
 
				+                }
			
 
				+                <div className={styles['status-tip']}>{tips}</div>
			
 
				+                <Button type='link' onClick={onReset}>点击刷新</Button>
			
 
				+              </div>
			
 
				+            </div>
			
 
				+          )
			
 
				+        }
			
 
				+
			
 
				+      </div>
			
 
				+
			
 
				+      <div className={styles['tip-box']}>
			
 
				+        {
			
 
				+          qrInited && !hasError && (
			
 
				+            <div>请使用行信扫码登录</div>
			
 
				+          )
			
 
				+        }
			
 
				+      </div>
			
 
				+    </div>
			
 
				+  )
			
 
				+}
			
--- a/src/pages/login/foo.js
+++ b/src/pages/login/foo.js
@@ -0,0 +1,34 @@
 
				+const { postQrCode } = require("@/services/login");
			
 
				+
			
 
				+const foo = (fp, delay) => {
			
 
				+
			
 
				+    let t = null;
			
 
				+
			
 
				+    const fn = () => {
			
 
				+        fp().then(() => {
			
 
				+            if (t) {
			
 
				+                clearTimeout(t);
			
 
				+            }
			
 
				+
			
 
				+            t = setTimeout(fn, delay);
			
 
				+        }).catch(() => {
			
 
				+            if (t) {
			
 
				+                clearTimeout(t);
			
 
				+            }
			
 
				+        });
			
 
				+    }
			
 
				+}
			
 
				+
			
 
				+const fp = () => {
			
 
				+    return new Promise((resovle, reject) => {
			
 
				+        postQrCode().then(() => {
			
 
				+            if (succes) {
			
 
				+                resovle()
			
 
				+            } else {
			
 
				+                reject()
			
 
				+            }
			
 
				+        }).catch(() => {
			
 
				+            reject()
			
 
				+        });
			
 
				+    });
			
 
				+}
			
--- a/src/pages/login/index.jsx
+++ b/src/pages/login/index.jsx
@@ -0,0 +1,91 @@
 
				+import React, { useEffect } from "react";
			
 
				+import { Button } from "antd";
			
 
				+import { Helmet } from "react-helmet";
			
 
				+import { useNavigate, useSearchParams } from "react-router-dom";
			
 
				+import { useModel } from "@/store";
			
 
				+import LoginForm from "./LoginForm";
			
 
				+import LoginEffect from "./Effect";
			
 
				+import "./style.less";
			
 
				+
			
 
				+const year = new Date().getFullYear();
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const { app } = useModel("system");
			
 
				+  const navigate = useNavigate();
			
 
				+  const [searchParams] = useSearchParams();
			
 
				+
			
 
				+  const baseUrl = import.meta.env.BASE_URL;
			
 
				+  const title = `欢迎使用${app.fullName}`;
			
 
				+  const copyright = `${app.company} @ ${year}`;
			
 
				+
			
 
				+  useEffect(() => {
			
 
				+    const oScript = document.createElement("script");
			
 
				+    oScript.type = "text/javascript";
			
 
				+    oScript.onload = () => {
			
 
				+      particlesJS.load(
			
 
				+        "particles-js",
			
 
				+        `${baseUrl}particles/particles.json`,
			
 
				+        function () {
			
 
				+          console.log("callback - particles.js config loaded");
			
 
				+        }
			
 
				+      );
			
 
				+    };
			
 
				+    document.querySelector("head").appendChild(oScript);
			
 
				+    oScript.src = `${baseUrl}particles/particles.min.js`;
			
 
				+
			
 
				+    return () => {
			
 
				+      document.querySelector("head").removeChild(oScript);
			
 
				+    };
			
 
				+  }, []);
			
 
				+
			
 
				+  const onSuccess = ({ ticket }) => {
			
 
				+    if (searchParams.get("redirect")) {
			
 
				+      const redirect = decodeURIComponent(searchParams.get("redirect"));
			
 
				+      let herf = "";
			
 
				+      if (redirect.indexOf("#") === -1) {
			
 
				+        herf = redirect + `#/?ticket=${ticket}`;
			
 
				+      } else if (redirect.indexOf("?") > -1) {
			
 
				+        herf = redirect + `ticket=${ticket}`;
			
 
				+      } else {
			
 
				+        herf = redirect + `?ticket=${ticket}`;
			
 
				+      }
			
 
				+      window.location.href = herf;
			
 
				+    } else if (searchParams.get("back")) {
			
 
				+      navigate(-1);
			
 
				+    } else {
			
 
				+      navigate("/");
			
 
				+    }
			
 
				+  };
			
 
				+
			
 
				+  return (
			
 
				+    <div className="login-page">
			
 
				+      <Helmet>
			
 
				+        <title>{app.fullName}</title>
			
 
				+      </Helmet>
			
 
				+      <div id="particles-js"></div>
			
 
				+      <div className="login-page-container">
			
 
				+        <div className="login-card">
			
 
				+          <div className="login-card-left">
			
 
				+            <div className="login-form-box">
			
 
				+              <div className="login-form">
			
 
				+                <h2>
			
 
				+                  <span>登录系统</span>
			
 
				+                </h2>
			
 
				+                <div className="login-subtitle">{title}</div>
			
 
				+                <LoginForm
			
 
				+                  mode={searchParams.get("mode")}
			
 
				+                  appid={searchParams.get("appid")}
			
 
				+                  onSuccess={onSuccess}
			
 
				+                />
			
 
				+              </div>
			
 
				+            </div>
			
 
				+            <div className="login-copyright">{copyright}</div>
			
 
				+          </div>
			
 
				+          <div className="login-card-right">
			
 
				+            <LoginEffect />
			
 
				+          </div>
			
 
				+        </div>
			
 
				+      </div>
			
 
				+    </div>
			
 
				+  );
			
 
				+};
			
--- a/src/pages/login/qrcode.less
+++ b/src/pages/login/qrcode.less
@@ -0,0 +1,77 @@
 
				+ .pageQr{
			
 
				+  position: relative;
			
 
				+  width: 180px;
			
 
				+  height: 180px;
			
 
				+  margin: 0 auto;
			
 
				+  // top: 50%;
			
 
				+  .loginPage,.loginSvg{
			
 
				+    display: table;
			
 
				+      position: absolute;
			
 
				+      top: 100%;
			
 
				+      left: 40%;
			
 
				+      text-align: center;
			
 
				+      width: 180px;
			
 
				+      height: 180px;
			
 
				+      margin-left: -61px;
			
 
				+      margin-top: -132px;
			
 
				+      background-color: #fffffff5;
			
 
				+      .loginLap{
			
 
				+        display: table-cell;
			
 
				+    vertical-align: middle;
			
 
				+      }
			
 
				+
			
 
				+  }
			
 
				+
			
 
				+  .loginSvg{
			
 
				+.ScanningCode{
			
 
				+  display: block;
			
 
				+  // cursor: pointer;
			
 
				+}
			
 
				+
			
 
				+  }
			
 
				+  .newCode{
			
 
				+    position: absolute;
			
 
				+    top: 100%;
			
 
				+    right: 37%;
			
 
				+    cursor: pointer;
			
 
				+    color: #576b95;
			
 
				+    text-decoration: none;
			
 
				+  }
			
 
				+  .qrcode{
			
 
				+    width: 178px;
			
 
				+    height: 150px;
			
 
				+    margin: auto;
			
 
				+    position: absolute;
			
 
				+    top: 30%;
			
 
				+    span{
			
 
				+      display: block;
			
 
				+      text-align: center; 
			
 
				+      padding-top:10px ;
			
 
				+    }
			
 
				+    .qrBoder{
			
 
				+      box-sizing: border-box;
			
 
				+    border: 1px solid #e2e2e2;
			
 
				+    width: 180px;
			
 
				+    height: 180px;
			
 
				+    text-align: -webkit-center;
			
 
				+    img{
			
 
				+      position: absolute;
			
 
				+    top: 10%;
			
 
				+    right: 6%;
			
 
				+    }
			
 
				+    }
			
 
				+  }
			
 
				+ }
			
 
				+
			
 
				+ .pageUse{
			
 
				+  display: flex;
			
 
				+  justify-content: flex-end;
			
 
				+  cursor: pointer;
			
 
				+  color: #576b95;
			
 
				+  
			
 
				+  position: absolute;
			
 
				+  top: 0;
			
 
				+  right: 0;
			
 
				+  height: 33px;
			
 
				+  line-height: 33px;
			
 
				+}
			
--- a/src/pages/login/style.less
+++ b/src/pages/login/style.less
@@ -0,0 +1,109 @@
 
				+
			
 
				+.login-page {
			
 
				+  height: 100%;
			
 
				+  background: linear-gradient(#fff, #e6f7ff);
			
 
				+
			
 
				+  #particles-js {
			
 
				+    position: absolute;
			
 
				+    top: 0;
			
 
				+    left: 0;
			
 
				+    width: 100%;
			
 
				+    height: 100%;
			
 
				+  }
			
 
				+
			
 
				+  .login-page-container {
			
 
				+    height: 100%;
			
 
				+    display: grid;
			
 
				+    place-items: center;
			
 
				+    position: relative;
			
 
				+    z-index: 10;
			
 
				+  }
			
 
				+
			
 
				+  .login-card {
			
 
				+    width: 900px;
			
 
				+    height: 600px;
			
 
				+    border-radius: 12px;
			
 
				+    overflow: hidden;
			
 
				+    box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2);
			
 
				+    
			
 
				+    display: grid;
			
 
				+    grid-template-columns: 1fr 1fr;
			
 
				+  }
			
 
				+
			
 
				+  .login-card-left {
			
 
				+    background: rgba(255, 255, 255, 0.6);
			
 
				+    backdrop-filter: blur(4px);
			
 
				+  }
			
 
				+  .login-card-right {
			
 
				+    background: rgba(239, 246, 250, .85);
			
 
				+  }
			
 
				+
			
 
				+  .login-form-box {
			
 
				+    height: 560px;
			
 
				+    display: grid;
			
 
				+    place-items: center;
			
 
				+
			
 
				+    .login-form {
			
 
				+      min-width: 280px;
			
 
				+      position: absolute;
			
 
				+
			
 
				+      & > h2 {
			
 
				+        display: flex;
			
 
				+        justify-content: space-between;
			
 
				+        text-align: center;
			
 
				+
			
 
				+        & > span {
			
 
				+          display: flex;
			
 
				+          align-items: center;
			
 
				+        }
			
 
				+      }
			
 
				+    }
			
 
				+
			
 
				+    .login-subtitle {
			
 
				+      font-size: .9em;
			
 
				+      color: #666;
			
 
				+      margin-bottom: 24px;
			
 
				+      letter-spacing: 2px;
			
 
				+    }
			
 
				+  }
			
 
				+
			
 
				+  .login-effect-box {
			
 
				+    height: 100%;
			
 
				+    display: grid;
			
 
				+    place-items: center;
			
 
				+
			
 
				+    .login-effect {
			
 
				+      width: 180px;
			
 
				+      height: 180px;
			
 
				+      position: relative;
			
 
				+    }
			
 
				+
			
 
				+    .login-effect-arc {
			
 
				+      width: 100%;
			
 
				+      height: 100%;
			
 
				+      border-radius: 50%;
			
 
				+      background-color: #fa8c16;
			
 
				+
			
 
				+      &::after {
			
 
				+        content: '';
			
 
				+        width: 200%;
			
 
				+        height: 100%;
			
 
				+        top: 50%;
			
 
				+        left: -50%;
			
 
				+        position: absolute;
			
 
				+        z-index: 10;
			
 
				+        background-color: rgba(255, 255, 255, 0.001);
			
 
				+        backdrop-filter: blur(16px);
			
 
				+        border-top: 1px solid rgba(255, 255, 255, 0.2);
			
 
				+      }
			
 
				+    }
			
 
				+  }
			
 
				+
			
 
				+  .login-copyright {
			
 
				+    font-size: 12px;
			
 
				+    color: #666;
			
 
				+    line-height: 40px;
			
 
				+    padding-left: 20px;
			
 
				+    box-sizing: border-box;
			
 
				+  }
			
 
				+}
			
--- a/src/pages/org/components/Form.jsx
+++ b/src/pages/org/components/Form.jsx
@@ -0,0 +1,85 @@
 
				+import React from "react";

			
 
				+import { Button, Form, Input, Select } from "antd";

			
 
				+import useBool from "@/utils/hooks/useBool";

			
 
				+// import { postSysOrg, putSysOrg } from "@/services/sysorg";

			
 
				+import { formItemLayout, tailFormItemLayout } from "@/utils/form";

			
 
				+

			
 
				+export default (props) => {

			
 
				+  const { org, list, parentId, onChange } = props;

			
 
				+

			
 
				+  const [submiting, startSubmit, cancelSubmit] = useBool();

			
 
				+  const [form] = Form.useForm();

			
 
				+

			
 
				+  const onFinish = (values) => {

			
 
				+    startSubmit();

			
 
				+    // if (org?.orgId) {

			
 
				+    //   // 修改

			
 
				+    //   putSysOrg(org.orgId, values)

			
 
				+    //     .then((res) => {

			
 
				+    //       cancelSubmit();

			
 
				+    //       onChange(res);

			
 
				+    //     })

			
 
				+    //     .catch(() => {

			
 
				+    //       cancelSubmit();

			
 
				+    //     });

			
 
				+    // } else {

			
 
				+    //   // 新增

			
 
				+    //   postSysOrg(values)

			
 
				+    //     .then((res) => {

			
 
				+    //       cancelSubmit();

			
 
				+    //       onChange(res);

			
 
				+    //     })

			
 
				+    //     .catch(() => {

			
 
				+    //       cancelSubmit();

			
 
				+    //     });

			
 
				+    // }

			
 
				+  };

			
 
				+

			
 
				+  React.useEffect(() => {

			
 
				+    console.log(list);

			
 
				+    form.resetFields();

			
 
				+    if (org) {

			
 
				+      form.setFieldsValue(org);

			
 
				+    } else {

			
 
				+      form.setFieldValue("parentId", parentId);

			
 
				+    }

			
 
				+

			
 
				+    console.log(org, parentId);

			
 
				+  }, [org, parentId]);

			
 
				+

			
 
				+  return (

			
 
				+    <Form

			
 
				+      form={form}

			
 
				+      {...formItemLayout}

			
 
				+      style={{ maxWidth: "800px" }}

			
 
				+      onFinish={onFinish}

			
 
				+    >

			
 
				+      <Form.Item

			
 
				+        name="name"

			
 
				+        label="机构名称"

			
 
				+        rules={[{ required: true, message: "请填写机构名称" }]}

			
 
				+      >

			
 
				+        <Input />

			
 
				+      </Form.Item>

			
 
				+      <Form.Item name="parentId" label="上级单位">

			
 
				+        <Select disabled={true}>

			
 
				+          {(list || []).map((x) => (

			
 
				+            <Select.Option key={x.orgId}>{x.name}</Select.Option>

			
 
				+          ))}

			
 
				+        </Select>

			
 
				+      </Form.Item>

			
 
				+

			
 
				+      <Form.Item name="status" label="状态">

			
 
				+        <Select style={{ width: "100%" }} placeholder="请选择状态">

			
 
				+          <Select.Option value={0}>不正常</Select.Option>

			
 
				+          <Select.Option value={1}>正常</Select.Option>

			
 
				+        </Select>

			
 
				+      </Form.Item>

			
 
				+      <Form.Item {...tailFormItemLayout}>

			
 
				+        <Button loading={submiting} type="primary" htmlType="submit">

			
 
				+          保存

			
 
				+        </Button>

			
 
				+      </Form.Item>

			
 
				+    </Form>

			
 
				+  );

			
 
				+};

			
--- a/src/pages/org/index.jsx
+++ b/src/pages/org/index.jsx
@@ -0,0 +1,159 @@
 
				+import React from "react";

			
 
				+import { PlusOutlined, DeleteOutlined } from "@ant-design/icons";

			
 
				+import { Button, Card, Row, Col, Tree, Tooltip, Popconfirm, Spin } from "antd";

			
 
				+import Page from "@/components/Page";

			
 
				+// import { getSysOrg, deleteSysOrg } from "@/services/sysorg";

			
 
				+import { arr2Tree } from "@/utils/array";

			
 
				+import useBool from "@/utils/hooks/useBool";

			
 
				+import Form from "./components/Form";

			
 
				+import { useModel } from "@/store";

			
 
				+

			
 
				+export default (props) => {

			
 
				+  const { user } = useModel("user");

			
 
				+  console.log(user);

			
 
				+  const [loading, startLoading, stopLoading] = useBool();

			
 
				+  const [list, setList] = React.useState([]);

			
 
				+  const [current, setCurrernt] = React.useState();

			
 
				+  const [parentId, setParentId] = React.useState();

			
 
				+

			
 
				+  const [parentList, treeData] = React.useMemo(() => {

			
 
				+    const plist = [{ orgId: "-1", name: "根节点" }].concat(list);

			
 
				+    const [tree] = arr2Tree(

			
 
				+      (list || []).map((x) => ({

			
 
				+        title: x.name,

			
 
				+        key: x.orgId,

			
 
				+        parentId: x.parentId,

			
 
				+        raw: x,

			
 
				+      }))

			
 
				+    );

			
 
				+    return [plist, tree];

			
 
				+  }, [list]);

			
 
				+

			
 
				+  const changeCurrent = (org) => {

			
 
				+    setCurrernt(org);

			
 
				+    setParentId(org?.orgPId || "-1");

			
 
				+  };

			
 
				+

			
 
				+  const onSelect = (selectedKeys, e) => {

			
 
				+    changeCurrent(e.node.raw);

			
 
				+  };

			
 
				+

			
 
				+  const onClick = (org) => {

			
 
				+    changeCurrent(org);

			
 
				+  };

			
 
				+

			
 
				+  const onAdd = (parent = "-1", parentId = "-1") => {

			
 
				+    setParentId(parent);

			
 
				+    setCurrernt({ parentId });

			
 
				+  };

			
 
				+

			
 
				+  const onDelete = (org) => {

			
 
				+    // deleteSysOrg(org.orgId).then(() => {

			
 
				+    //   queryList();

			
 
				+    // });

			
 
				+  };

			
 
				+

			
 
				+  const queryList = React.useCallback(() => {

			
 
				+    startLoading();

			
 
				+    // getSysOrg({ pageSize: 500 }).then((res) => {

			
 
				+    //   setList(res.records || []);

			
 
				+    //   stopLoading();

			
 
				+    // });

			
 
				+  }, []);

			
 
				+

			
 
				+  const onFormChange = () => {

			
 
				+    // 重新查一次数据

			
 
				+    queryList();

			
 
				+  };

			
 
				+

			
 
				+  React.useEffect(() => {

			
 
				+    queryList();

			
 
				+  }, []);

			
 
				+

			
 
				+  return (

			
 
				+    <Page>

			
 
				+      <Row gutter={24}>

			
 
				+        <Col span={8} style={{ overflow: "hidden" }}>

			
 
				+          <Card

			
 
				+            title="单位"

			
 
				+            onSelect={onSelect}

			
 
				+            extra={

			
 
				+              user.orgId === "1" && (

			
 
				+                <Button type="link" onClick={() => onAdd()}>

			
 
				+                  新增

			
 
				+                </Button>

			
 
				+              )

			
 
				+            }

			
 
				+          >

			
 
				+            <Spin spinning={loading}>

			
 
				+              <Tree

			
 
				+                blockNode

			
 
				+                defaultExpandParent={true}

			
 
				+                treeData={treeData}

			
 
				+                // onSelect={onSelect}

			
 
				+                titleRender={(node) => (

			
 
				+                  <div

			
 
				+                    style={{ display: "flex" }}

			
 
				+                    onClick={(e) => e.stopPropagation()}

			
 
				+                  >

			
 
				+                    <div

			
 
				+                      style={{

			
 
				+                        lineHeight: "32px",

			
 
				+                        flex: 1,

			
 
				+                        width: 0,

			
 
				+                      }}

			
 
				+                      onClick={() => onClick(node.raw)}

			
 
				+                    >

			
 
				+                      <div

			
 
				+                        style={{

			
 
				+                          overflow: "hidden",

			
 
				+                          whiteSpace: "nowrap",

			
 
				+                          textOverflow: "ellipsis",

			
 
				+                        }}

			
 
				+                      >

			
 
				+                        {node.title}

			
 
				+                      </div>

			
 
				+                    </div>

			
 
				+                    <div style={{ width: "80px", flex: "none" }}>

			
 
				+                      <Tooltip title="新增子节点">

			
 
				+                        <Button

			
 
				+                          type="link"

			
 
				+                          icon={<PlusOutlined />}

			
 
				+                          onClick={() => onAdd(node.raw.orgId)}

			
 
				+                        ></Button>

			
 
				+                      </Tooltip>

			
 
				+                      <Tooltip title="删除节点">

			
 
				+                        <Popconfirm

			
 
				+                          title="确认进行删除操作?"

			
 
				+                          onConfirm={() => onDelete(node.raw)}

			
 
				+                        >

			
 
				+                          <Button

			
 
				+                            type="link"

			
 
				+                            danger

			
 
				+                            icon={<DeleteOutlined />}

			
 
				+                          ></Button>

			
 
				+                        </Popconfirm>

			
 
				+                      </Tooltip>

			
 
				+                    </div>

			
 
				+                  </div>

			
 
				+                )}

			
 
				+              />

			
 
				+            </Spin>

			
 
				+          </Card>

			
 
				+        </Col>

			
 
				+        <Col span={16}>

			
 
				+          {parentId && (

			
 
				+            <Card>

			
 
				+              <Form

			
 
				+                org={current}

			
 
				+                parentId={parentId}

			
 
				+                list={parentList}

			
 
				+                onChange={onFormChange}

			
 
				+              />

			
 
				+            </Card>

			
 
				+          )}

			
 
				+        </Col>

			
 
				+      </Row>

			
 
				+    </Page>

			
 
				+  );

			
 
				+};

			
--- a/src/pages/sample/curd.jsx
+++ b/src/pages/sample/curd.jsx
@@ -0,0 +1,117 @@
 
				+import React from 'react';
			
 
				+import Curd from '@/components/Page/Curd';
			
 
				+import { Form, Input } from 'antd';
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const columns = [
			
 
				+      {
			
 
				+          dataIndex: 'index',
			
 
				+          valueType: 'indexBorder',
			
 
				+          width: 48,
			
 
				+      },
			
 
				+      {
			
 
				+          title: '标题',
			
 
				+          dataIndex: 'title',
			
 
				+          copyable: true,
			
 
				+          ellipsis: true,
			
 
				+          tip: '标题过长会自动收缩',
			
 
				+          formItemProps: {
			
 
				+              rules: [
			
 
				+                  {
			
 
				+                      required: true,
			
 
				+                      message: '此项为必填项',
			
 
				+                  },
			
 
				+              ],
			
 
				+          },
			
 
				+      },
			
 
				+      {
			
 
				+          disable: true,
			
 
				+          title: '状态',
			
 
				+          dataIndex: 'state',
			
 
				+          filters: true,
			
 
				+          onFilter: true,
			
 
				+          ellipsis: true,
			
 
				+          valueType: 'select',
			
 
				+          valueEnum: {
			
 
				+              all: { text: '超长'.repeat(50) },
			
 
				+              open: {
			
 
				+                  text: '未解决',
			
 
				+                  status: 'Error',
			
 
				+              },
			
 
				+              closed: {
			
 
				+                  text: '已解决',
			
 
				+                  status: 'Success',
			
 
				+                  disabled: true,
			
 
				+              },
			
 
				+              processing: {
			
 
				+                  text: '解决中',
			
 
				+                  status: 'Processing',
			
 
				+              },
			
 
				+          },
			
 
				+      },
			
 
				+      {
			
 
				+          disable: true,
			
 
				+          title: '标签',
			
 
				+          dataIndex: 'labels',
			
 
				+          search: false,
			
 
				+          renderFormItem: (_, { defaultRender }) => {
			
 
				+              return defaultRender(_);
			
 
				+          },
			
 
				+          render: (_, record) => (<Space>
			
 
				+          {record.labels.map(({ name, color }) => (<Tag color={color} key={name}>
			
 
				+              {name}
			
 
				+              </Tag>))}
			
 
				+          </Space>),
			
 
				+      },
			
 
				+      {
			
 
				+          title: '创建时间',
			
 
				+          key: 'showTime',
			
 
				+          dataIndex: 'created_at',
			
 
				+          valueType: 'date',
			
 
				+          sorter: true,
			
 
				+          hideInSearch: true,
			
 
				+      },
			
 
				+      {
			
 
				+          title: '创建时间',
			
 
				+          dataIndex: 'created_at',
			
 
				+          valueType: 'dateRange',
			
 
				+          hideInTable: true,
			
 
				+          search: {
			
 
				+              transform: (value) => {
			
 
				+                  return {
			
 
				+                      startTime: value[0],
			
 
				+                      endTime: value[1],
			
 
				+                  };
			
 
				+              },
			
 
				+          },
			
 
				+      },
			
 
				+  ];
			
 
				+
			
 
				+  return (
			
 
				+    <Curd
			
 
				+      columns={columns}
			
 
				+      request={{
			
 
				+        del: () => Promise.resolve(),
			
 
				+        save: () => Promise.resolve(),
			
 
				+        update: () => Promise.resolve(),
			
 
				+        list: () => Promise.resolve({total: 0}),
			
 
				+      }}
			
 
				+      renderFormItems={() => (
			
 
				+        <>
			
 
				+          <Form.Item label="示例1" name="demo1">
			
 
				+            <Input />
			
 
				+          </Form.Item>
			
 
				+          <Form.Item label="示例2" name="demo2">
			
 
				+            <Input />
			
 
				+          </Form.Item>
			
 
				+          <Form.Item label="示例3" name="demo3">
			
 
				+            <Input />
			
 
				+          </Form.Item>
			
 
				+          <Form.Item label="示例4" name="demo4">
			
 
				+            <Input />
			
 
				+          </Form.Item>
			
 
				+        </>
			
 
				+      )}
			
 
				+    />
			
 
				+  )
			
 
				+}
			
--- a/src/pages/sample/form/index.jsx
+++ b/src/pages/sample/form/index.jsx
@@ -0,0 +1,308 @@
 
				+import {
			
 
				+  AutoComplete,
			
 
				+  Button,
			
 
				+  Cascader,
			
 
				+  Checkbox,
			
 
				+  Col,
			
 
				+  Form,
			
 
				+  Input,
			
 
				+  InputNumber,
			
 
				+  Row,
			
 
				+  Select,
			
 
				+  Card,
			
 
				+} from 'antd';
			
 
				+import React, { useState } from 'react';
			
 
				+import Edit from '@/components/Page/Edit';
			
 
				+
			
 
				+const { Option } = Select;
			
 
				+const residences = [
			
 
				+  {
			
 
				+    value: 'zhejiang',
			
 
				+    label: 'Zhejiang',
			
 
				+    children: [
			
 
				+      {
			
 
				+        value: 'hangzhou',
			
 
				+        label: 'Hangzhou',
			
 
				+        children: [
			
 
				+          {
			
 
				+            value: 'xihu',
			
 
				+            label: 'West Lake',
			
 
				+          },
			
 
				+        ],
			
 
				+      },
			
 
				+    ],
			
 
				+  },
			
 
				+  {
			
 
				+    value: 'jiangsu',
			
 
				+    label: 'Jiangsu',
			
 
				+    children: [
			
 
				+      {
			
 
				+        value: 'nanjing',
			
 
				+        label: 'Nanjing',
			
 
				+        children: [
			
 
				+          {
			
 
				+            value: 'zhonghuamen',
			
 
				+            label: 'Zhong Hua Men',
			
 
				+          },
			
 
				+        ],
			
 
				+      },
			
 
				+    ],
			
 
				+  },
			
 
				+];
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const prefixSelector = (
			
 
				+    <Form.Item name="prefix" noStyle>
			
 
				+      <Select
			
 
				+        style={{
			
 
				+          width: 70,
			
 
				+        }}
			
 
				+      >
			
 
				+        <Option value="86">+86</Option>
			
 
				+        <Option value="87">+87</Option>
			
 
				+      </Select>
			
 
				+    </Form.Item>
			
 
				+  );
			
 
				+  const suffixSelector = (
			
 
				+    <Form.Item name="suffix" noStyle>
			
 
				+      <Select
			
 
				+        style={{
			
 
				+          width: 70,
			
 
				+        }}
			
 
				+      >
			
 
				+        <Option value="USD">$</Option>
			
 
				+        <Option value="CNY">¥</Option>
			
 
				+      </Select>
			
 
				+    </Form.Item>
			
 
				+  );
			
 
				+  const [autoCompleteResult, setAutoCompleteResult] = useState([]);
			
 
				+
			
 
				+  const onWebsiteChange = (value) => {
			
 
				+    if (!value) {
			
 
				+      setAutoCompleteResult([]);
			
 
				+    } else {
			
 
				+      setAutoCompleteResult(['.com', '.org', '.net'].map((domain) => `${value}${domain}`));
			
 
				+    }
			
 
				+  };
			
 
				+
			
 
				+  const websiteOptions = autoCompleteResult.map((website) => ({
			
 
				+    label: website,
			
 
				+    value: website,
			
 
				+  }));
			
 
				+  return (
			
 
				+    <Edit width="1000px">
			
 
				+      <Form.Item
			
 
				+        name="email"
			
 
				+        label="E-mail"
			
 
				+        rules={[
			
 
				+          {
			
 
				+            type: 'email',
			
 
				+            message: 'The input is not valid E-mail!',
			
 
				+          },
			
 
				+          {
			
 
				+            required: true,
			
 
				+            message: 'Please input your E-mail!',
			
 
				+          },
			
 
				+        ]}
			
 
				+      >
			
 
				+        <Input />
			
 
				+      </Form.Item>
			
 
				+
			
 
				+      <Form.Item
			
 
				+        name="password"
			
 
				+        label="Password"
			
 
				+        rules={[
			
 
				+          {
			
 
				+            required: true,
			
 
				+            message: 'Please input your password!',
			
 
				+          },
			
 
				+        ]}
			
 
				+        hasFeedback
			
 
				+      >
			
 
				+        <Input.Password />
			
 
				+      </Form.Item>
			
 
				+
			
 
				+      <Form.Item
			
 
				+        name="confirm"
			
 
				+        label="Confirm Password"
			
 
				+        dependencies={['password']}
			
 
				+        hasFeedback
			
 
				+        rules={[
			
 
				+          {
			
 
				+            required: true,
			
 
				+            message: 'Please confirm your password!',
			
 
				+          },
			
 
				+          ({ getFieldValue }) => ({
			
 
				+            validator(_, value) {
			
 
				+              if (!value || getFieldValue('password') === value) {
			
 
				+                return Promise.resolve();
			
 
				+              }
			
 
				+
			
 
				+              return Promise.reject(new Error('The two passwords that you entered do not match!'));
			
 
				+            },
			
 
				+          }),
			
 
				+        ]}
			
 
				+      >
			
 
				+        <Input.Password />
			
 
				+      </Form.Item>
			
 
				+
			
 
				+      <Form.Item
			
 
				+        name="nickname"
			
 
				+        label="Nickname"
			
 
				+        tooltip="What do you want others to call you?"
			
 
				+        rules={[
			
 
				+          {
			
 
				+            required: true,
			
 
				+            message: 'Please input your nickname!',
			
 
				+            whitespace: true,
			
 
				+          },
			
 
				+        ]}
			
 
				+      >
			
 
				+        <Input />
			
 
				+      </Form.Item>
			
 
				+
			
 
				+      <Form.Item
			
 
				+        name="residence"
			
 
				+        label="Habitual Residence"
			
 
				+        rules={[
			
 
				+          {
			
 
				+            type: 'array',
			
 
				+            required: true,
			
 
				+            message: 'Please select your habitual residence!',
			
 
				+          },
			
 
				+        ]}
			
 
				+      >
			
 
				+        <Cascader options={residences} />
			
 
				+      </Form.Item>
			
 
				+
			
 
				+      <Form.Item
			
 
				+        name="phone"
			
 
				+        label="Phone Number"
			
 
				+        rules={[
			
 
				+          {
			
 
				+            required: true,
			
 
				+            message: 'Please input your phone number!',
			
 
				+          },
			
 
				+        ]}
			
 
				+      >
			
 
				+        <Input
			
 
				+          addonBefore={prefixSelector}
			
 
				+          style={{
			
 
				+            width: '100%',
			
 
				+          }}
			
 
				+        />
			
 
				+      </Form.Item>
			
 
				+
			
 
				+      <Form.Item
			
 
				+        name="donation"
			
 
				+        label="Donation"
			
 
				+        rules={[
			
 
				+          {
			
 
				+            required: true,
			
 
				+            message: 'Please input donation amount!',
			
 
				+          },
			
 
				+        ]}
			
 
				+      >
			
 
				+        <InputNumber
			
 
				+          addonAfter={suffixSelector}
			
 
				+          style={{
			
 
				+            width: '100%',
			
 
				+          }}
			
 
				+        />
			
 
				+      </Form.Item>
			
 
				+
			
 
				+      <Form.Item
			
 
				+        name="website"
			
 
				+        label="Website"
			
 
				+        rules={[
			
 
				+          {
			
 
				+            required: true,
			
 
				+            message: 'Please input website!',
			
 
				+          },
			
 
				+        ]}
			
 
				+      >
			
 
				+        <AutoComplete options={websiteOptions} onChange={onWebsiteChange} placeholder="website">
			
 
				+          <Input />
			
 
				+        </AutoComplete>
			
 
				+      </Form.Item>
			
 
				+
			
 
				+      <Form.Item
			
 
				+        name="intro"
			
 
				+        label="Intro"
			
 
				+        rules={[
			
 
				+          {
			
 
				+            required: true,
			
 
				+            message: 'Please input Intro',
			
 
				+          },
			
 
				+        ]}
			
 
				+      >
			
 
				+        <Input.TextArea showCount maxLength={100} />
			
 
				+      </Form.Item>
			
 
				+
			
 
				+      <Form.Item
			
 
				+        name="gender"
			
 
				+        label="Gender"
			
 
				+        rules={[
			
 
				+          {
			
 
				+            required: true,
			
 
				+            message: 'Please select gender!',
			
 
				+          },
			
 
				+        ]}
			
 
				+      >
			
 
				+        <Select placeholder="select your gender">
			
 
				+          <Option value="male">Male</Option>
			
 
				+          <Option value="female">Female</Option>
			
 
				+          <Option value="other">Other</Option>
			
 
				+        </Select>
			
 
				+      </Form.Item>
			
 
				+
			
 
				+      <Form.Item label="Captcha" extra="We must make sure that your are a human.">
			
 
				+        <Row gutter={8}>
			
 
				+          <Col span={12}>
			
 
				+            <Form.Item
			
 
				+              name="captcha"
			
 
				+              noStyle
			
 
				+              rules={[
			
 
				+                {
			
 
				+                  required: true,
			
 
				+                  message: 'Please input the captcha you got!',
			
 
				+                },
			
 
				+              ]}
			
 
				+            >
			
 
				+              <Input />
			
 
				+            </Form.Item>
			
 
				+          </Col>
			
 
				+          <Col span={12}>
			
 
				+            <Button>Get captcha</Button>
			
 
				+          </Col>
			
 
				+        </Row>
			
 
				+      </Form.Item>
			
 
				+
			
 
				+      <Form.Item
			
 
				+        name="agreement"
			
 
				+        valuePropName="checked"
			
 
				+        rules={[
			
 
				+          {
			
 
				+            validator: (_, value) =>
			
 
				+              value ? Promise.resolve() : Promise.reject(new Error('Should accept agreement')),
			
 
				+          },
			
 
				+        ]}
			
 
				+        wrapperCol={{
			
 
				+          xs: {
			
 
				+            span: 24,
			
 
				+            offset: 0,
			
 
				+          },
			
 
				+          sm: {
			
 
				+            span: 16,
			
 
				+            offset: 8,
			
 
				+          },
			
 
				+        }}
			
 
				+      >
			
 
				+        <Checkbox>
			
 
				+          I have read the <a href="">agreement</a>
			
 
				+        </Checkbox>
			
 
				+      </Form.Item>
			
 
				+    </Edit>
			
 
				+  );
			
 
				+};
			
 
				+
			
--- a/src/pages/sample/home/components/AreaChart.jsx
+++ b/src/pages/sample/home/components/AreaChart.jsx
@@ -0,0 +1,191 @@
 
				+import React from 'react';
			
 
				+import { Card } from 'antd';
			
 
				+import * as echarts from 'echarts/core';
			
 
				+import Chart from '@/components/chart';
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const option = {
			
 
				+    color: ['#80FFA5', '#00DDFF', '#37A2FF', '#FF0087', '#FFBF00'],
			
 
				+    // title: {
			
 
				+    //   text: 'Gradient Stacked Area Chart'
			
 
				+    // },
			
 
				+    tooltip: {
			
 
				+      trigger: 'axis',
			
 
				+      axisPointer: {
			
 
				+        type: 'cross',
			
 
				+        label: {
			
 
				+          backgroundColor: '#6a7985'
			
 
				+        }
			
 
				+      }
			
 
				+    },
			
 
				+    legend: {
			
 
				+      data: ['Line 1', 'Line 2', 'Line 3', 'Line 4', 'Line 5']
			
 
				+    },
			
 
				+    grid: {
			
 
				+      left: '3%',
			
 
				+      right: '4%',
			
 
				+      bottom: '3%',
			
 
				+      containLabel: true
			
 
				+    },
			
 
				+    xAxis: [
			
 
				+      {
			
 
				+        type: 'category',
			
 
				+        boundaryGap: false,
			
 
				+        data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
			
 
				+      }
			
 
				+    ],
			
 
				+    yAxis: [
			
 
				+      {
			
 
				+        type: 'value'
			
 
				+      }
			
 
				+    ],
			
 
				+    series: [
			
 
				+      {
			
 
				+        name: 'Line 1',
			
 
				+        type: 'line',
			
 
				+        stack: 'Total',
			
 
				+        smooth: true,
			
 
				+        lineStyle: {
			
 
				+          width: 0
			
 
				+        },
			
 
				+        showSymbol: false,
			
 
				+        areaStyle: {
			
 
				+          opacity: 0.8,
			
 
				+          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
			
 
				+            {
			
 
				+              offset: 0,
			
 
				+              color: 'rgb(128, 255, 165)'
			
 
				+            },
			
 
				+            {
			
 
				+              offset: 1,
			
 
				+              color: 'rgb(1, 191, 236)'
			
 
				+            }
			
 
				+          ])
			
 
				+        },
			
 
				+        emphasis: {
			
 
				+          focus: 'series'
			
 
				+        },
			
 
				+        data: [140, 232, 101, 264, 90, 340, 250]
			
 
				+      },
			
 
				+      {
			
 
				+        name: 'Line 2',
			
 
				+        type: 'line',
			
 
				+        stack: 'Total',
			
 
				+        smooth: true,
			
 
				+        lineStyle: {
			
 
				+          width: 0
			
 
				+        },
			
 
				+        showSymbol: false,
			
 
				+        areaStyle: {
			
 
				+          opacity: 0.8,
			
 
				+          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
			
 
				+            {
			
 
				+              offset: 0,
			
 
				+              color: 'rgb(0, 221, 255)'
			
 
				+            },
			
 
				+            {
			
 
				+              offset: 1,
			
 
				+              color: 'rgb(77, 119, 255)'
			
 
				+            }
			
 
				+          ])
			
 
				+        },
			
 
				+        emphasis: {
			
 
				+          focus: 'series'
			
 
				+        },
			
 
				+        data: [120, 282, 111, 234, 220, 340, 310]
			
 
				+      },
			
 
				+      {
			
 
				+        name: 'Line 3',
			
 
				+        type: 'line',
			
 
				+        stack: 'Total',
			
 
				+        smooth: true,
			
 
				+        lineStyle: {
			
 
				+          width: 0
			
 
				+        },
			
 
				+        showSymbol: false,
			
 
				+        areaStyle: {
			
 
				+          opacity: 0.8,
			
 
				+          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
			
 
				+            {
			
 
				+              offset: 0,
			
 
				+              color: 'rgb(55, 162, 255)'
			
 
				+            },
			
 
				+            {
			
 
				+              offset: 1,
			
 
				+              color: 'rgb(116, 21, 219)'
			
 
				+            }
			
 
				+          ])
			
 
				+        },
			
 
				+        emphasis: {
			
 
				+          focus: 'series'
			
 
				+        },
			
 
				+        data: [320, 132, 201, 334, 190, 130, 220]
			
 
				+      },
			
 
				+      {
			
 
				+        name: 'Line 4',
			
 
				+        type: 'line',
			
 
				+        stack: 'Total',
			
 
				+        smooth: true,
			
 
				+        lineStyle: {
			
 
				+          width: 0
			
 
				+        },
			
 
				+        showSymbol: false,
			
 
				+        areaStyle: {
			
 
				+          opacity: 0.8,
			
 
				+          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
			
 
				+            {
			
 
				+              offset: 0,
			
 
				+              color: 'rgb(255, 0, 135)'
			
 
				+            },
			
 
				+            {
			
 
				+              offset: 1,
			
 
				+              color: 'rgb(135, 0, 157)'
			
 
				+            }
			
 
				+          ])
			
 
				+        },
			
 
				+        emphasis: {
			
 
				+          focus: 'series'
			
 
				+        },
			
 
				+        data: [220, 402, 231, 134, 190, 230, 120]
			
 
				+      },
			
 
				+      {
			
 
				+        name: 'Line 5',
			
 
				+        type: 'line',
			
 
				+        stack: 'Total',
			
 
				+        smooth: true,
			
 
				+        lineStyle: {
			
 
				+          width: 0
			
 
				+        },
			
 
				+        showSymbol: false,
			
 
				+        label: {
			
 
				+          show: true,
			
 
				+          position: 'top'
			
 
				+        },
			
 
				+        areaStyle: {
			
 
				+          opacity: 0.8,
			
 
				+          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
			
 
				+            {
			
 
				+              offset: 0,
			
 
				+              color: 'rgb(255, 191, 0)'
			
 
				+            },
			
 
				+            {
			
 
				+              offset: 1,
			
 
				+              color: 'rgb(224, 62, 76)'
			
 
				+            }
			
 
				+          ])
			
 
				+        },
			
 
				+        emphasis: {
			
 
				+          focus: 'series'
			
 
				+        },
			
 
				+        data: [220, 302, 181, 234, 210, 290, 150]
			
 
				+      }
			
 
				+    ]
			
 
				+  };
			
 
				+  
			
 
				+
			
 
				+  return (
			
 
				+    <Card title='Gradient Stacked Area Chart'>
			
 
				+      <Chart option={option} style={props.style}></Chart>
			
 
				+    </Card>
			
 
				+  )
			
 
				+}
			
--- a/src/pages/sample/home/components/Banner.jsx
+++ b/src/pages/sample/home/components/Banner.jsx
@@ -0,0 +1,44 @@
 
				+import React from 'react';
			
 
				+import { Row, Col, Card, Statistic } from 'antd';
			
 
				+import { ArrowDownOutlined, ArrowUpOutlined, LikeOutlined } from '@ant-design/icons';
			
 
				+
			
 
				+export default (props) => {
			
 
				+  return (
			
 
				+    <Row gutter={24}>
			
 
				+      <Col span={6}>
			
 
				+        <Card>
			
 
				+          <Statistic title="Feedback" value={1128} prefix={<LikeOutlined />} />
			
 
				+        </Card>
			
 
				+      </Col>
			
 
				+      <Col span={6}>
			
 
				+        <Card>
			
 
				+          <Statistic title="Unmerged" value={93} suffix="/ 100" />
			
 
				+        </Card>
			
 
				+      </Col>
			
 
				+      <Col span={6}>
			
 
				+        <Card>
			
 
				+          <Statistic
			
 
				+            title="Active"
			
 
				+            value={11.28}
			
 
				+            precision={2}
			
 
				+            valueStyle={{ color: '#3f8600' }}
			
 
				+            prefix={<ArrowUpOutlined />}
			
 
				+            suffix="%"
			
 
				+          />
			
 
				+        </Card>
			
 
				+      </Col>
			
 
				+      <Col span={6}>
			
 
				+        <Card>
			
 
				+          <Statistic
			
 
				+            title="Idle"
			
 
				+            value={9.3}
			
 
				+            precision={2}
			
 
				+            valueStyle={{ color: '#cf1322' }}
			
 
				+            prefix={<ArrowDownOutlined />}
			
 
				+            suffix="%"
			
 
				+          />
			
 
				+        </Card>
			
 
				+      </Col>
			
 
				+    </Row>
			
 
				+  )
			
 
				+}
			
--- a/src/pages/sample/home/components/BarChart.jsx
+++ b/src/pages/sample/home/components/BarChart.jsx
@@ -0,0 +1,37 @@
 
				+import React from 'react';
			
 
				+import { Card } from 'antd';
			
 
				+import Chart from '@/components/chart';
			
 
				+
			
 
				+export default (props) => {
			
 
				+
			
 
				+  const option = {
			
 
				+    legend: {},
			
 
				+    tooltip: {},
			
 
				+    dataset: {
			
 
				+      source: [
			
 
				+        ['product', '2015', '2016', '2017'],
			
 
				+        ['Matcha Latte', 43.3, 85.8, 93.7],
			
 
				+        ['Milk Tea', 83.1, 73.4, 55.1],
			
 
				+        ['Cheese Cocoa', 86.4, 65.2, 82.5],
			
 
				+        ['Walnut Brownie', 72.4, 53.9, 39.1]
			
 
				+      ]
			
 
				+    },
			
 
				+    xAxis: { type: 'category' },
			
 
				+    yAxis: {},
			
 
				+    grid: {
			
 
				+      left: '3%',
			
 
				+      right: '4%',
			
 
				+      bottom: '3%',
			
 
				+      containLabel: true
			
 
				+    },
			
 
				+    // Declare several bar series, each will be mapped
			
 
				+    // to a column of dataset.source by default.
			
 
				+    series: [{ type: 'bar' }, { type: 'bar' }, { type: 'bar' }]
			
 
				+  };
			
 
				+
			
 
				+  return (
			
 
				+    <Card title='Bar Chart'>
			
 
				+      <Chart option={option} style={props.style}></Chart>
			
 
				+    </Card>
			
 
				+  )
			
 
				+}
			
--- a/src/pages/sample/home/components/PictorialBar.jsx
+++ b/src/pages/sample/home/components/PictorialBar.jsx
@@ -0,0 +1,112 @@
 
				+import React from 'react';
			
 
				+import { Card } from 'antd';
			
 
				+import * as echarts from 'echarts/core';
			
 
				+import Chart from '@/components/chart';
			
 
				+
			
 
				+
			
 
				+export default (props) => {
			
 
				+  let category = [];
			
 
				+  let dottedBase = +new Date();
			
 
				+  let lineData = [];
			
 
				+  let barData = [];
			
 
				+  for (let i = 0; i < 20; i++) {
			
 
				+    let date = new Date((dottedBase += 3600 * 24 * 1000));
			
 
				+    category.push(
			
 
				+      [date.getFullYear(), date.getMonth() + 1, date.getDate()].join('-')
			
 
				+    );
			
 
				+    let b = Math.random() * 200;
			
 
				+    let d = Math.random() * 200;
			
 
				+    barData.push(b);
			
 
				+    lineData.push(d + b);
			
 
				+  }
			
 
				+
			
 
				+  const option = {
			
 
				+    backgroundColor: '#0f375f',
			
 
				+    tooltip: {
			
 
				+      trigger: 'axis',
			
 
				+      axisPointer: {
			
 
				+        type: 'shadow'
			
 
				+      }
			
 
				+    },
			
 
				+    legend: {
			
 
				+      data: ['line', 'bar'],
			
 
				+      textStyle: {
			
 
				+        color: '#ccc'
			
 
				+      }
			
 
				+    },
			
 
				+    xAxis: {
			
 
				+      data: category,
			
 
				+      axisLine: {
			
 
				+        lineStyle: {
			
 
				+          color: '#ccc'
			
 
				+        }
			
 
				+      }
			
 
				+    },
			
 
				+    yAxis: {
			
 
				+      splitLine: { show: false },
			
 
				+      axisLine: {
			
 
				+        lineStyle: {
			
 
				+          color: '#ccc'
			
 
				+        }
			
 
				+      }
			
 
				+    },
			
 
				+    series: [
			
 
				+      {
			
 
				+        name: 'line',
			
 
				+        type: 'line',
			
 
				+        smooth: true,
			
 
				+        showAllSymbol: true,
			
 
				+        symbol: 'emptyCircle',
			
 
				+        symbolSize: 15,
			
 
				+        data: lineData
			
 
				+      },
			
 
				+      {
			
 
				+        name: 'bar',
			
 
				+        type: 'bar',
			
 
				+        barWidth: 10,
			
 
				+        itemStyle: {
			
 
				+          borderRadius: 5,
			
 
				+          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
			
 
				+            { offset: 0, color: '#14c8d4' },
			
 
				+            { offset: 1, color: '#43eec6' }
			
 
				+          ])
			
 
				+        },
			
 
				+        data: barData
			
 
				+      },
			
 
				+      {
			
 
				+        name: 'line',
			
 
				+        type: 'bar',
			
 
				+        barGap: '-100%',
			
 
				+        barWidth: 10,
			
 
				+        itemStyle: {
			
 
				+          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
			
 
				+            { offset: 0, color: 'rgba(20,200,212,0.5)' },
			
 
				+            { offset: 0.2, color: 'rgba(20,200,212,0.2)' },
			
 
				+            { offset: 1, color: 'rgba(20,200,212,0)' }
			
 
				+          ])
			
 
				+        },
			
 
				+        z: -12,
			
 
				+        data: lineData
			
 
				+      },
			
 
				+      {
			
 
				+        name: 'dotted',
			
 
				+        type: 'pictorialBar',
			
 
				+        symbol: 'rect',
			
 
				+        itemStyle: {
			
 
				+          color: '#0f375f'
			
 
				+        },
			
 
				+        symbolRepeat: true,
			
 
				+        symbolSize: [12, 4],
			
 
				+        symbolMargin: 1,
			
 
				+        z: -10,
			
 
				+        data: lineData
			
 
				+      }
			
 
				+    ]
			
 
				+  };
			
 
				+
			
 
				+  return (
			
 
				+    <Card title='Pictorial Chart'>
			
 
				+      <Chart option={option} style={props.style}></Chart>
			
 
				+    </Card>
			
 
				+  )
			
 
				+}
			
--- a/src/pages/sample/home/components/PieChart.jsx
+++ b/src/pages/sample/home/components/PieChart.jsx
@@ -0,0 +1,48 @@
 
				+import React from 'react';
			
 
				+import { Card } from 'antd';
			
 
				+import Chart from '@/components/chart';
			
 
				+
			
 
				+export default (props) => {
			
 
				+
			
 
				+  const option = {
			
 
				+    // title: {
			
 
				+    //   text: 'Referer of a Website',
			
 
				+    //   subtext: 'Fake Data',
			
 
				+    //   left: 'center'
			
 
				+    // },
			
 
				+    tooltip: {
			
 
				+      trigger: 'item'
			
 
				+    },
			
 
				+    legend: {
			
 
				+      orient: 'vertical',
			
 
				+      left: 'left'
			
 
				+    },
			
 
				+    series: [
			
 
				+      {
			
 
				+        name: 'Access From',
			
 
				+        type: 'pie',
			
 
				+        radius: '50%',
			
 
				+        data: [
			
 
				+          { value: 1048, name: 'Search Engine' },
			
 
				+          { value: 735, name: 'Direct' },
			
 
				+          { value: 580, name: 'Email' },
			
 
				+          { value: 484, name: 'Union Ads' },
			
 
				+          { value: 300, name: 'Video Ads' }
			
 
				+        ],
			
 
				+        emphasis: {
			
 
				+          itemStyle: {
			
 
				+            shadowBlur: 10,
			
 
				+            shadowOffsetX: 0,
			
 
				+            shadowColor: 'rgba(0, 0, 0, 0.5)'
			
 
				+          }
			
 
				+        }
			
 
				+      }
			
 
				+    ]
			
 
				+  };
			
 
				+
			
 
				+  return (
			
 
				+    <Card title='Basic Pie Chart'>
			
 
				+      <Chart option={option} style={props.style}></Chart>
			
 
				+    </Card>
			
 
				+  )
			
 
				+}
			
--- a/src/pages/sample/home/components/RadarChart.jsx
+++ b/src/pages/sample/home/components/RadarChart.jsx
@@ -0,0 +1,48 @@
 
				+import React from 'react';
			
 
				+import { Card } from 'antd';
			
 
				+import Chart from '@/components/chart';
			
 
				+
			
 
				+export default (props) => {
			
 
				+
			
 
				+  const option = {
			
 
				+    // title: {
			
 
				+    //   text: 'Basic Radar Chart'
			
 
				+    // },
			
 
				+    legend: {
			
 
				+      data: ['Allocated Budget', 'Actual Spending']
			
 
				+    },
			
 
				+    radar: {
			
 
				+      // shape: 'circle',
			
 
				+      indicator: [
			
 
				+        { name: 'Sales', max: 6500 },
			
 
				+        { name: 'Administration', max: 16000 },
			
 
				+        { name: 'Information Technology', max: 30000 },
			
 
				+        { name: 'Customer Support', max: 38000 },
			
 
				+        { name: 'Development', max: 52000 },
			
 
				+        { name: 'Marketing', max: 25000 }
			
 
				+      ]
			
 
				+    },
			
 
				+    series: [
			
 
				+      {
			
 
				+        name: 'Budget vs spending',
			
 
				+        type: 'radar',
			
 
				+        data: [
			
 
				+          {
			
 
				+            value: [4200, 3000, 20000, 35000, 50000, 18000],
			
 
				+            name: 'Allocated Budget'
			
 
				+          },
			
 
				+          {
			
 
				+            value: [5000, 14000, 28000, 26000, 42000, 21000],
			
 
				+            name: 'Actual Spending'
			
 
				+          }
			
 
				+        ]
			
 
				+      }
			
 
				+    ]
			
 
				+  };
			
 
				+
			
 
				+  return (
			
 
				+    <Card title='Basic Radar Chart'>
			
 
				+      <Chart option={option} style={props.style}></Chart>
			
 
				+    </Card>
			
 
				+  )
			
 
				+}
			
--- a/src/pages/sample/home/index.jsx
+++ b/src/pages/sample/home/index.jsx
@@ -0,0 +1,41 @@
 
				+import React from 'react';
			
 
				+import { Row, Col, Card, Space, Statistic } from 'antd';
			
 
				+import Page from '@/components/Page';
			
 
				+import Banner from './components/Banner';
			
 
				+import AreaChart from './components/AreaChart';
			
 
				+import BarChart from './components/BarChart';
			
 
				+import PictorialBar from './components/PictorialBar';
			
 
				+import RadarChart from './components/RadarChart';
			
 
				+import PieChart from './components/PieChart';
			
 
				+
			
 
				+export default (props) => {
			
 
				+
			
 
				+  const chartStyle = {
			
 
				+    height: '360px',
			
 
				+    width: '100%',
			
 
				+  }
			
 
				+
			
 
				+  return (
			
 
				+    <Page>
			
 
				+      <Banner />
			
 
				+
			
 
				+      <Row gutter={24} style={{ marginTop: '24px' }}>
			
 
				+        <Col span={16}>
			
 
				+          <AreaChart style={chartStyle}/>
			
 
				+        </Col>
			
 
				+        <Col span={8}>
			
 
				+          <RadarChart style={chartStyle}/>
			
 
				+        </Col>
			
 
				+      </Row>
			
 
				+
			
 
				+      <Row gutter={24} style={{ marginTop: '24px' }}>
			
 
				+        <Col span={8}>
			
 
				+          <PieChart style={chartStyle}/>
			
 
				+        </Col>
			
 
				+        <Col span={16}>
			
 
				+          <BarChart style={chartStyle}/>
			
 
				+        </Col>
			
 
				+      </Row>
			
 
				+    </Page>
			
 
				+  )
			
 
				+}
			
--- a/src/pages/sample/table/index.jsx
+++ b/src/pages/sample/table/index.jsx
@@ -0,0 +1,96 @@
 
				+
			
 
				+import { Space, Tag } from 'antd';
			
 
				+import List from '@/components/Page/List';
			
 
				+
			
 
				+export default () => {
			
 
				+    const columns = [
			
 
				+        {
			
 
				+            dataIndex: 'index',
			
 
				+            valueType: 'indexBorder',
			
 
				+            width: 48,
			
 
				+        },
			
 
				+        {
			
 
				+            title: '标题',
			
 
				+            dataIndex: 'title',
			
 
				+            copyable: true,
			
 
				+            ellipsis: true,
			
 
				+            tip: '标题过长会自动收缩',
			
 
				+            formItemProps: {
			
 
				+                rules: [
			
 
				+                    {
			
 
				+                        required: true,
			
 
				+                        message: '此项为必填项',
			
 
				+                    },
			
 
				+                ],
			
 
				+            },
			
 
				+        },
			
 
				+        {
			
 
				+            disable: true,
			
 
				+            title: '状态',
			
 
				+            dataIndex: 'state',
			
 
				+            filters: true,
			
 
				+            onFilter: true,
			
 
				+            ellipsis: true,
			
 
				+            valueType: 'select',
			
 
				+            valueEnum: {
			
 
				+                all: { text: '超长'.repeat(50) },
			
 
				+                open: {
			
 
				+                    text: '未解决',
			
 
				+                    status: 'Error',
			
 
				+                },
			
 
				+                closed: {
			
 
				+                    text: '已解决',
			
 
				+                    status: 'Success',
			
 
				+                    disabled: true,
			
 
				+                },
			
 
				+                processing: {
			
 
				+                    text: '解决中',
			
 
				+                    status: 'Processing',
			
 
				+                },
			
 
				+            },
			
 
				+        },
			
 
				+        {
			
 
				+            disable: true,
			
 
				+            title: '标签',
			
 
				+            dataIndex: 'labels',
			
 
				+            search: false,
			
 
				+            renderFormItem: (_, { defaultRender }) => {
			
 
				+                return defaultRender(_);
			
 
				+            },
			
 
				+            render: (_, record) => (<Space>
			
 
				+            {record.labels.map(({ name, color }) => (<Tag color={color} key={name}>
			
 
				+                {name}
			
 
				+                </Tag>))}
			
 
				+            </Space>),
			
 
				+        },
			
 
				+        {
			
 
				+            title: '创建时间',
			
 
				+            key: 'showTime',
			
 
				+            dataIndex: 'created_at',
			
 
				+            valueType: 'date',
			
 
				+            sorter: true,
			
 
				+            hideInSearch: true,
			
 
				+        },
			
 
				+        {
			
 
				+            title: '创建时间',
			
 
				+            dataIndex: 'created_at',
			
 
				+            valueType: 'dateRange',
			
 
				+            hideInTable: true,
			
 
				+            search: {
			
 
				+                transform: (value) => {
			
 
				+                    return {
			
 
				+                        startTime: value[0],
			
 
				+                        endTime: value[1],
			
 
				+                    };
			
 
				+                },
			
 
				+            },
			
 
				+        },
			
 
				+    ];
			
 
				+    
			
 
				+    return (
			
 
				+        <List
			
 
				+            columns={columns}
			
 
				+            request={() => Promise.resolve({ total: 0 })}
			
 
				+        />
			
 
				+    );
			
 
				+};
			
--- a/src/pages/user/Account.jsx
+++ b/src/pages/user/Account.jsx
@@ -0,0 +1,127 @@
 
				+import React from "react";
			
 
				+import { Modal, Form, Input, Button, Select } from "antd";
			
 
				+import useBool from "@/utils/hooks/useBool";
			
 
				+// import { postSysUser } from "@/services/sysuser";
			
 
				+import md5 from "md5";
			
 
				+
			
 
				+const { Option } = Select;
			
 
				+
			
 
				+const formItemLayout = {
			
 
				+  labelCol: {
			
 
				+    xs: { span: 24 },
			
 
				+    sm: { span: 8 },
			
 
				+  },
			
 
				+  wrapperCol: {
			
 
				+    xs: { span: 24 },
			
 
				+    sm: { span: 16 },
			
 
				+  },
			
 
				+};
			
 
				+const tailFormItemLayout = {
			
 
				+  wrapperCol: {
			
 
				+    xs: {
			
 
				+      span: 24,
			
 
				+      offset: 0,
			
 
				+    },
			
 
				+    sm: {
			
 
				+      span: 16,
			
 
				+      offset: 8,
			
 
				+    },
			
 
				+  },
			
 
				+};
			
 
				+
			
 
				+const defaultPass = "123456";
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const { user, onSuccess, onCancel, roleList = [], ...leftProps } = props;
			
 
				+
			
 
				+  const [loading, startLoading, cancelLoading] = useBool();
			
 
				+  const [form] = Form.useForm();
			
 
				+
			
 
				+  const onFinish = (values) => {
			
 
				+    const password = md5(defaultPass);
			
 
				+    const rolesList = (values.rolesList || []).map((x) => ({ roleId: x }));
			
 
				+    const data = {
			
 
				+      ...user,
			
 
				+      ...values,
			
 
				+      password,
			
 
				+
			
 
				+      rolesList,
			
 
				+      userId: user.userId,
			
 
				+    };
			
 
				+
			
 
				+    startLoading();
			
 
				+    // postSysUser(data)
			
 
				+    //   .then((res) => {
			
 
				+    //     onSuccess();
			
 
				+    //     cancelLoading();
			
 
				+    //   })
			
 
				+    //   .catch(() => {
			
 
				+    //     cancelLoading();
			
 
				+    //   });
			
 
				+  };
			
 
				+
			
 
				+  React.useEffect(() => {
			
 
				+    if (user?.userId) {
			
 
				+      form.setFieldsValue({
			
 
				+        account: user.account || undefined,
			
 
				+        rolesList: user.rolesList.map((x) => x.roleId),
			
 
				+      });
			
 
				+    }
			
 
				+  }, [user, form]);
			
 
				+
			
 
				+  return (
			
 
				+    <Modal
			
 
				+      title="账号维护"
			
 
				+      footer={null}
			
 
				+      width={600}
			
 
				+      onCancel={onCancel}
			
 
				+      {...leftProps}
			
 
				+    >
			
 
				+      <Form
			
 
				+        {...formItemLayout}
			
 
				+        form={form}
			
 
				+        scrollToFirstError
			
 
				+        style={{ width: "480px" }}
			
 
				+        onFinish={onFinish}
			
 
				+      >
			
 
				+        <Form.Item
			
 
				+          name="account"
			
 
				+          label="账号"
			
 
				+          rules={[
			
 
				+            {
			
 
				+              required: true,
			
 
				+              message: "请填写姓名",
			
 
				+            },
			
 
				+          ]}
			
 
				+        >
			
 
				+          <Input />
			
 
				+        </Form.Item>
			
 
				+        <Form.Item name="rolesList" label="角色">
			
 
				+          <Select
			
 
				+            mode="multiple"
			
 
				+            allowClear
			
 
				+            style={{ width: "100%" }}
			
 
				+            placeholder="请选择角色"
			
 
				+          >
			
 
				+            {roleList.map((role) => (
			
 
				+              <Option key={role.roleId}>{role.name}</Option>
			
 
				+            ))}
			
 
				+          </Select>
			
 
				+        </Form.Item>
			
 
				+        <Form.Item
			
 
				+          label="密码"
			
 
				+        >
			
 
				+          <div>{`默认密码 ${defaultPass}`}</div>
			
 
				+        </Form.Item>
			
 
				+        <Form.Item {...tailFormItemLayout}>
			
 
				+          <Button loading={loading} type="primary" htmlType="submit">
			
 
				+            保存
			
 
				+          </Button>
			
 
				+          <Button style={{ marginLeft: "2em" }} onClick={onCancel}>
			
 
				+            取消
			
 
				+          </Button>
			
 
				+        </Form.Item>
			
 
				+      </Form>
			
 
				+    </Modal>
			
 
				+  );
			
 
				+};
			
--- a/src/pages/user/Edit.jsx
+++ b/src/pages/user/Edit.jsx
@@ -0,0 +1,141 @@
 
				+import React from "react";
			
 
				+import { Button, Card, Form, Input } from "antd";
			
 
				+import useBool from "@/utils/hooks/useBool";
			
 
				+// import { getSysRole } from "@/services/sysrole";
			
 
				+// import { postSysUser, getSysUserById, resetPwd } from "@/services/sysuser";
			
 
				+import { useSearchParams, useNavigate } from "react-router-dom";
			
 
				+import Page from "@/components/Page";
			
 
				+import { formItemLayout, tailFormItemLayout } from "@/utils/form";
			
 
				+import Account from "./Account";
			
 
				+import md5 from "md5";
			
 
				+
			
 
				+export default (props) => {
			
 
				+
			
 
				+  const [loading, startLoading, cancelLoading] = useBool();
			
 
				+  const [submiting, startSubmit, cancelSubmit] = useBool();
			
 
				+  const [open, setShow, setHidden] = useBool(false);
			
 
				+  const [roleList, setRoleList] = React.useState([]);
			
 
				+  const [searchParams] = useSearchParams();
			
 
				+  const [form] = Form.useForm();
			
 
				+  const [user, setUser] = React.useState();
			
 
				+  const navigate = useNavigate();
			
 
				+
			
 
				+  const id = searchParams.get("id");
			
 
				+
			
 
				+  const resetPassWord = () => {
			
 
				+    // if (id) {
			
 
				+    //   resetPwd(id, md5("123456")).then((res) => {});
			
 
				+    // }
			
 
				+  };
			
 
				+
			
 
				+  const onFinish = (values) => {
			
 
				+    startSubmit();
			
 
				+    // postSysUser({ ...values, userId: id })
			
 
				+    //   .then((res) => {
			
 
				+    //     cancelSubmit();
			
 
				+    //     if (id) {
			
 
				+    //       navigate(-1);
			
 
				+    //     } else {
			
 
				+    //       navigate(`/user/edit?id=${res.userId}`, { replace: true });
			
 
				+    //     }
			
 
				+    //   })
			
 
				+    //   .catch(() => {
			
 
				+    //     cancelSubmit();
			
 
				+    //   });
			
 
				+  };
			
 
				+
			
 
				+  // React.useEffect(() => {
			
 
				+  //   getSysRole({ pageSize: 500 }).then((res) => setRoleList(res.records || []));
			
 
				+  // }, []);
			
 
				+
			
 
				+  React.useEffect(() => {
			
 
				+    if (id) {
			
 
				+      startLoading();
			
 
				+      // getSysUserById(id)
			
 
				+      //   .then((res) => {
			
 
				+      //     setUser(res);
			
 
				+      //     form.setFieldsValue({
			
 
				+      //       ...res,
			
 
				+      //     });
			
 
				+      //     cancelLoading();
			
 
				+      //   })
			
 
				+      //   .catch(() => {
			
 
				+      //     cancelLoading();
			
 
				+      //   });
			
 
				+    } else {
			
 
				+
			
 
				+    }
			
 
				+  }, [id]);
			
 
				+
			
 
				+  return (
			
 
				+    <Page>
			
 
				+      <Card loading={loading}>
			
 
				+        <Form
			
 
				+          onFinish={onFinish}
			
 
				+          form={form}
			
 
				+          {...formItemLayout}
			
 
				+          scrollToFirstError
			
 
				+          style={{ maxWidth: "1000px" }}
			
 
				+        >
			
 
				+          <Form.Item
			
 
				+            name="name"
			
 
				+            label="姓名"
			
 
				+            rules={[
			
 
				+              {
			
 
				+                required: true,
			
 
				+                message: "请填写姓名",
			
 
				+              },
			
 
				+            ]}
			
 
				+          >
			
 
				+            <Input placeholder="请输入姓名" />
			
 
				+          </Form.Item>
			
 
				+          <Form.Item name="phone" label="手机号">
			
 
				+            <Input placeholder="请输入手机号" />
			
 
				+          </Form.Item>
			
 
				+          <Form.Item name="orgId" label="机构Id">
			
 
				+            <Input placeholder="请输入" />
			
 
				+          </Form.Item>
			
 
				+          <Form.Item name="orgName" label="机构名称">
			
 
				+            <Input placeholder="请输入" />
			
 
				+          </Form.Item>
			
 
				+
			
 
				+          <Form.Item {...tailFormItemLayout}>
			
 
				+            <Button loading={submiting} type="primary" htmlType="submit">
			
 
				+              保存
			
 
				+            </Button>
			
 
				+            <Button style={{ marginLeft: "2em" }} onClick={() => navigate(-1)}>
			
 
				+              返回
			
 
				+            </Button>
			
 
				+            {id && (
			
 
				+              <Button
			
 
				+                disabled={!id}
			
 
				+                style={{ marginLeft: "2em" }}
			
 
				+                onClick={setShow}
			
 
				+              >
			
 
				+                登录账户
			
 
				+              </Button>
			
 
				+            )}
			
 
				+            {user?.account && (
			
 
				+              <Button
			
 
				+                key={2}
			
 
				+                style={{ marginLeft: "2em" }}
			
 
				+                onClick={() => {
			
 
				+                  resetPassWord();
			
 
				+                }}
			
 
				+              >
			
 
				+                重置密码
			
 
				+              </Button>
			
 
				+            )}
			
 
				+          </Form.Item>
			
 
				+        </Form>
			
 
				+      </Card>
			
 
				+      <Account
			
 
				+        open={open}
			
 
				+        user={user}
			
 
				+        roleList={roleList}
			
 
				+        onSuccess={setHidden}
			
 
				+        onCancel={setHidden}
			
 
				+      />
			
 
				+    </Page>
			
 
				+  );
			
 
				+};
			
--- a/src/pages/user/index.jsx
+++ b/src/pages/user/index.jsx
@@ -0,0 +1,151 @@
 
				+import React from "react";

			
 
				+import { useNavigate } from "react-router-dom";

			
 
				+import { Button, Popconfirm, message } from "antd";

			
 
				+import { ProTable } from "@ant-design/pro-components";

			
 
				+import { queryTable, queryDict } from "@/utils/request";

			
 
				+// import {

			
 
				+//   getSysUser,

			
 
				+//   updateUserStatus,

			
 
				+//   deleteSysUser,

			
 
				+// } from "@/services/sysuser";

			
 
				+// import { getSysOrg } from "@/services/sysorg";

			
 
				+// import { getSysPosition } from "@/services/sysposition";

			
 
				+import Page from "@/components/Page";

			
 
				+// import { getSysDept } from "@/services/sysdept";

			
 
				+import md5 from "md5";

			
 
				+

			
 
				+// const queryUserList = queryTable(getSysUser);

			
 
				+// const queryOrg = queryDict(getSysOrg, { labelKey: "name", valueKey: "orgId" });

			
 
				+// const queryDept = queryDict((params) => getSysDept({ ...params, dict: true }), {

			
 
				+//   labelKey: "name",

			
 
				+//   valueKey: "deptId",

			
 
				+// });

			
 
				+const queryPosition = queryDict(

			
 
				+  // (params) => getSysPosition({ ...params, dict: true }),

			
 
				+  {

			
 
				+    labelKey: "name",

			
 
				+    valueKey: "positionId",

			
 
				+  }

			
 
				+);

			
 
				+

			
 
				+export default (props) => {

			
 
				+  const actionRef = React.useRef();

			
 
				+  const navigate = useNavigate();

			
 
				+

			
 
				+  const updateStatus = (user) => {

			
 
				+    const status = user.status === 1 ? 0 : 1;

			
 
				+    const hide = message.loading("请稍候...", 0);

			
 
				+    // updateUserStatus(user.userId, status)

			
 
				+    //   .then((res) => {

			
 
				+    //     hide();

			
 
				+    //     actionRef.current.reload();

			
 
				+    //   })

			
 
				+    //   .catch(() => {

			
 
				+    //     hide();

			
 
				+    //   });

			
 
				+  };

			
 
				+

			
 
				+  const handleDelete = (id) => {

			
 
				+    if (id) {

			
 
				+      // deleteSysUser(id).then((res) => {

			
 
				+      //   actionRef.current.reload();

			
 
				+      // });

			
 
				+    }

			
 
				+  };

			
 
				+

			
 
				+  const columns = [

			
 
				+    {

			
 
				+      title: "EHR",

			
 
				+      dataIndex: "hxId",

			
 
				+    },

			
 
				+    {

			
 
				+      title: "姓名",

			
 
				+      dataIndex: "name",

			
 
				+    },

			
 
				+    {

			
 
				+      title: "手机号",

			
 
				+      search: false,

			
 
				+      dataIndex: "phone",

			
 
				+    },

			
 
				+    {

			
 
				+      title: "机构",

			
 
				+      dataIndex: "orgName",

			
 
				+    },

			
 
				+    {

			
 
				+      title: "状态",

			
 
				+      dataIndex: "status",

			
 
				+      search: false,

			
 
				+      valueEnum: {

			
 
				+        1: {

			
 
				+          text: "正常",

			
 
				+          status: "Processing",

			
 
				+        },

			
 
				+        0: {

			
 
				+          text: "禁用",

			
 
				+          status: "Error",

			
 
				+        },

			
 
				+      },

			
 
				+    },

			
 
				+    {

			
 
				+      title: "操作",

			
 
				+      valueType: "option",

			
 
				+      width: 200,

			
 
				+      render: (_, record) => [

			
 
				+        <Button

			
 
				+          key={1}

			
 
				+          style={{ padding: 0 }}

			
 
				+          type="link"

			
 
				+          onClick={() => {

			
 
				+            updateStatus(record);

			
 
				+          }}

			
 
				+        >

			
 
				+          {record.status === 1 ? "禁用" : "启用"}

			
 
				+        </Button>,

			
 
				+        <Button

			
 
				+          key={3}

			
 
				+          style={{ padding: 0 }}

			
 
				+          type="link"

			
 
				+          onClick={() => {

			
 
				+            navigate(`/user/edit?id=${record.userId}`);

			
 
				+          }}

			
 
				+        >

			
 
				+          编辑

			
 
				+        </Button>,

			
 
				+        <Popconfirm

			
 
				+          key={4}

			
 
				+          title="您是否确认删除 ?"

			
 
				+          onConfirm={() => handleDelete(record.userId)}

			
 
				+          okText="确定"

			
 
				+          cancelText="取消"

			
 
				+        >

			
 
				+

			
 
				+          <Button style={{ padding: 0 }} type="link">

			
 
				+            删除

			
 
				+          </Button>

			
 
				+        </Popconfirm>,

			
 
				+      ],

			
 
				+    },

			
 
				+  ];

			
 
				+

			
 
				+  return (

			
 
				+    <Page>

			
 
				+      <ProTable

			
 
				+        actionRef={actionRef}

			
 
				+        rowKey="userId"

			
 
				+        toolBarRender={() => [

			
 
				+          <Button

			
 
				+            key="1"

			
 
				+            type="primary"

			
 
				+            onClick={() => {

			
 
				+              navigate("/user/edit");

			
 
				+            }}

			
 
				+          >

			
 
				+            新增

			
 
				+          </Button>,

			
 
				+        ]}

			
 
				+        // request={queryUserList}

			
 
				+        columns={columns}

			
 
				+      />

			
 
				+    </Page>

			
 
				+  );

			
 
				+};

			
--- a/src/routes/Router.jsx
+++ b/src/routes/Router.jsx
@@ -0,0 +1,18 @@
 
				+import React from "react";
			
 
				+import { createHashRouter, RouterProvider } from "react-router-dom";
			
 
				+import { useModel } from "@/store";
			
 
				+import { defaultRoutes } from './routes';
			
 
				+
			
 
				+export default (props) => {
			
 
				+  const { routes } = useModel('user');
			
 
				+
			
 
				+  const router = React.useMemo(() => {
			
 
				+    if (!routes || routes.length < 1) {
			
 
				+      return createHashRouter(defaultRoutes);
			
 
				+    } else {
			
 
				+      return createHashRouter(routes);
			
 
				+    }
			
 
				+  }, [routes]);
			
 
				+  
			
 
				+  return <RouterProvider router={router} />
			
 
				+}
			
--- a/src/routes/hooks/usePrompt.jsx
+++ b/src/routes/hooks/usePrompt.jsx
@@ -0,0 +1,37 @@
 
				+import React from "react";
			
 
				+import { UNSAFE_NavigationContext } from "react-router-dom";
			
 
				+
			
 
				+// 估计在 react-router v6 的后续某个版本 usePrompt 会回归
			
 
				+// v6.7 已经添加 UNSAFE_usePrompt
			
 
				+export function usePrompt(message, when = true) {
			
 
				+  let blocker = React.useCallback(
			
 
				+    tx => {
			
 
				+      if (window.confirm(message)) tx.retry();
			
 
				+    },
			
 
				+    [message]
			
 
				+  );
			
 
				+
			
 
				+  useBlocker(blocker, when);
			
 
				+}
			
 
				+
			
 
				+function useBlocker(blocker, when = true) {
			
 
				+  let { navigator } = React.useContext(UNSAFE_NavigationContext);
			
 
				+
			
 
				+  React.useEffect(() => {
			
 
				+    if (!when) return;
			
 
				+
			
 
				+    let unblock = navigator.block((tx) => {
			
 
				+      let autoUnblockingTx = {
			
 
				+        ...tx,
			
 
				+        retry() {
			
 
				+          unblock();
			
 
				+          tx.retry();
			
 
				+        }
			
 
				+      };
			
 
				+
			
 
				+      blocker(autoUnblockingTx);
			
 
				+    });
			
 
				+
			
 
				+    return unblock;
			
 
				+  }, [navigator, blocker, when]);
			
 
				+}
			
--- a/src/routes/hooks/useRoute.jsx
+++ b/src/routes/hooks/useRoute.jsx
@@ -0,0 +1,17 @@
 
				+import { useLocation } from "react-router-dom";
			
 
				+import { routes } from '../routes';
			
 
				+import { flatten } from "../utils";
			
 
				+
			
 
				+let routeMap = null;
			
 
				+
			
 
				+// 获取当前的 route 信息
			
 
				+export default function useRoute() {
			
 
				+  if (!routeMap) {
			
 
				+    routeMap = flatten(routes);
			
 
				+  }
			
 
				+
			
 
				+  const location = useLocation();
			
 
				+  return routeMap[location.pathname];
			
 
				+  // const currentRoute = routeArr.filter(x => x.path === location.pathname)[0];
			
 
				+  // return currentRoute;
			
 
				+}
			
--- a/src/routes/menus.jsx
+++ b/src/routes/menus.jsx
@@ -0,0 +1,44 @@
 
				+import { Link } from 'react-router-dom';
			
 
				+import { getPath } from './utils';
			
 
				+
			
 
				+// 菜单是否显示
			
 
				+// 没有 meta 或者 meta.title 为空, 或者 meta.hideInMenu = true 的 都不显示
			
 
				+const isShow = item => item.meta && item.meta.title && !item.meta.hideInMenu;
			
 
				+
			
 
				+const hasChildren = (list) => {
			
 
				+  if (!list || list.length < 1) return false;
			
 
				+
			
 
				+  // 如果子元素全部都是不显示的, 说明子菜单不需要显示
			
 
				+  return list.filter(it => !isShow(it)).length !== list.length;
			
 
				+}
			
 
				+
			
 
				+export const getMenuItems = (routes = [], fullPath = '/') => {
			
 
				+  return routes.map(route => {
			
 
				+    const path = getPath(fullPath, route.path);
			
 
				+
			
 
				+    //
			
 
				+    if (!isShow(route)) return false;
			
 
				+    
			
 
				+    const children = hasChildren(route.children) ? getMenuItems(route.children, path) : false;
			
 
				+
			
 
				+    const { target, title, icon } = route.meta || {}
			
 
				+
			
 
				+    // 坑爹 react-router v6 不支持 hash 路由的 target 跳转
			
 
				+    const label = target === '_blank' ?
			
 
				+      <a href={`${window.location.pathname}#${path}`} target={target}>{title}</a>
			
 
				+      : (
			
 
				+        path.indexOf('http') === 0  ? <a href={path} target="_blank">{title}</a>
			
 
				+        : <Link to={path} target={target}>{title}</Link>
			
 
				+      );
			
 
				+
			
 
				+    return Object.assign(
			
 
				+      {
			
 
				+        key: path,
			
 
				+        label,
			
 
				+        title,
			
 
				+        icon,
			
 
				+      },
			
 
				+      children && { children },
			
 
				+    )
			
 
				+  }).filter(Boolean);
			
 
				+}
			
--- a/src/routes/permissions.js
+++ b/src/routes/permissions.js
@@ -0,0 +1,14 @@
 
				+
			
 
				+export const getAuthedRoutes = (routes, permissions) => {
			
 
				+  if (!routes || routes.length < 1) return [];
			
 
				+
			
 
				+  return routes.map(route => {
			
 
				+    if (route.meta && route.meta.permission && permissions.indexOf(route.meta.permission) < 0) return false;
			
 
				+
			
 
				+    if (route.children) {
			
 
				+      route.children = getAuthedRoutes(route.children, permissions);
			
 
				+    }
			
 
				+
			
 
				+    return route;
			
 
				+  }).filter(Boolean);
			
 
				+}
			
--- a/src/routes/routes.jsx
+++ b/src/routes/routes.jsx
@@ -0,0 +1,118 @@
 
				+import {
			
 
				+  UserOutlined,
			
 
				+  BankOutlined,
			
 
				+  DesktopOutlined,
			
 
				+} from "@ant-design/icons";
			
 
				+import { Navigate } from "react-router-dom";
			
 
				+import AuthLayout from "@/layouts/AuthLayout";
			
 
				+import Login from "@/pages/login";
			
 
				+import Page404 from "@/pages/404";
			
 
				+import Home from "@/pages/sample/home";
			
 
				+import User from "@/pages/user";
			
 
				+import UserEdit from "@/pages/user/Edit";
			
 
				+import Org from "@/pages/org/index";
			
 
				+
			
 
				+/**
			
 
				+ * meta 用来扩展自定义数据数据
			
 
				+ * {
			
 
				+ *    title: 用于页面或者菜单的标题, 没有此字段, 菜单不会显示
			
 
				+ *    hideInMenu: 布尔值, 如果为 false, 菜单不会显示
			
 
				+ *    noLayout: 布尔值, 如果为 true, 将不会使用默认布局
			
 
				+ *    noSiderBar: 布尔值, 如果为 true, 将没有左侧菜单栏
			
 
				+ *    noFooter: 布尔值, 如果为 true, 将没有底部 footer
			
 
				+ *    target: 字符串, 如果为 _blank, 将在新窗口打开
			
 
				+ *    permission: 对应服务器端权限名称
			
 
				+ * }
			
 
				+ */
			
 
				+
			
 
				+export const authRoutes = [
			
 
				+  {
			
 
				+    index: true,
			
 
				+    element: <Navigate to="/user" replace={true} />,
			
 
				+  },
			
 
				+  {
			
 
				+    path: "user",
			
 
				+    element: <User />,
			
 
				+    meta: {
			
 
				+      title: "人员管理",
			
 
				+      icon: <UserOutlined />,
			
 
				+      // permission: 'user',
			
 
				+    }
			
 
				+  },
			
 
				+  {
			
 
				+    path: "user/edit",
			
 
				+    element: <UserEdit />,
			
 
				+    meta: {
			
 
				+      title: "人员维护",
			
 
				+      hideInMenu: true,
			
 
				+      // permission: 'user.edit',
			
 
				+    },
			
 
				+  },
			
 
				+  {
			
 
				+    path: "org",
			
 
				+    element: <Org />,
			
 
				+    meta: {
			
 
				+      title: "机构管理",
			
 
				+      icon: <BankOutlined />,
			
 
				+      // permission: 'org',
			
 
				+    },
			
 
				+  },
			
 
				+];
			
 
				+
			
 
				+export const defaultRoutes = [
			
 
				+  {
			
 
				+    path: "/",
			
 
				+    element: <AuthLayout />,
			
 
				+    children: [
			
 
				+      {
			
 
				+        path: "home",
			
 
				+        element: <Home />,
			
 
				+        meta: {
			
 
				+          title: "首页",
			
 
				+          icon: <DesktopOutlined />,
			
 
				+        },
			
 
				+      },
			
 
				+      {
			
 
				+        path: "*",
			
 
				+        element: <Page404 />,
			
 
				+      },
			
 
				+    ],
			
 
				+  },
			
 
				+  {
			
 
				+    path: "/login",
			
 
				+    element: <Login />,
			
 
				+  },
			
 
				+  {
			
 
				+    path: "*",
			
 
				+    element: <Page404 />,
			
 
				+  },
			
 
				+];
			
 
				+
			
 
				+export function mergeAuthRoutes (r1, r2) {
			
 
				+  const r = r1.slice();
			
 
				+  const children = r1[0].children.slice();
			
 
				+  r[0].children = children.concat(r2);
			
 
				+  return r;
			
 
				+}
			
 
				+
			
 
				+// 全部路由
			
 
				+export const routes = mergeAuthRoutes(defaultRoutes, authRoutes);
			
 
				+function getPath (parent = "/", current = "") {
			
 
				+  if (current.indexOf("/") === 0 || current.indexOf("http") === 0)
			
 
				+    return current;
			
 
				+  return `${parent}/${current}`.replace(/\/\//g, "/");
			
 
				+}
			
 
				+
			
 
				+// 路由数组, 一维数组
			
 
				+export const routeArr = (() => {
			
 
				+  const flatten = (routes, parentPath = "/") => {
			
 
				+    return routes.reduce((acc, route) => {
			
 
				+      const path = getPath(parentPath, route.path);
			
 
				+      const children = route.children ? flatten(route.children, path) : [];
			
 
				+
			
 
				+      return acc.concat([{ ...route, path }].concat(children));
			
 
				+    }, []);
			
 
				+  };
			
 
				+
			
 
				+  return flatten(routes);
			
 
				+})();
			
--- a/src/routes/utils.js
+++ b/src/routes/utils.js
@@ -0,0 +1,22 @@
 
				+
			
 
				+// 获取组件路径
			
 
				+export function getPath (parent = "/", current = "") {
			
 
				+  if (current.indexOf("/") === 0 || current.indexOf("http") === 0)
			
 
				+    return current;
			
 
				+  return `${parent}/${current}`.replace(/\/\//g, "/");
			
 
				+}
			
 
				+
			
 
				+// 展平 routes, 为一个简单对象
			
 
				+// 如果出现 父组件与子组件相同路由, 那么子组件会覆盖父组件
			
 
				+export function flatten (routes, parentPath = "/") {
			
 
				+  return routes.reduce((acc, route) => {
			
 
				+    const path = route.index ? parentPath : getPath(parentPath, route.path);
			
 
				+    const children = route.children ? flatten(route.children, path) : {};
			
 
				+
			
 
				+    return {
			
 
				+      ...acc,
			
 
				+      [path]: route,
			
 
				+      ...children,
			
 
				+    }
			
 
				+  }, {});
			
 
				+};
			
--- a/src/services/login.js
+++ b/src/services/login.js
@@ -0,0 +1,19 @@
 
				+import request from "@/utils/request";
			
 
				+
			
 
				+/*
			
 
				+ * 修改密码
			
 
				+ */
			
 
				+export const changePassword = (id, data) =>
			
 
				+  request(`/api/sysUser/${id}/change-pwd`, { data, method: "put" });
			
 
				+
			
 
				+/*
			
 
				+ * 后台登录
			
 
				+ */
			
 
				+export const login = (data) =>
			
 
				+  request("/api/sso/doLogin", { data, method: "post" });
			
 
				+
			
 
				+/*
			
 
				+ * 登出
			
 
				+ */
			
 
				+export const logout = (data) =>
			
 
				+  request("/api/admin/logout", { data, method: "post" });
			
--- a/src/services/sys_user.js
+++ b/src/services/sys_user.js
@@ -0,0 +1,10 @@
 
				+import request from "@/utils/request";
			
 
				+
			
 
				+/*
			
 
				+ * 查询当前人员
			
 
				+ */
			
 
				+
			
 
				+export const currentUser = (params) => {
			
 
				+  console.log("currentUser");
			
 
				+  return request("/api/sysUser/current", { params });
			
 
				+};
			
--- a/src/services/sysuser.js
+++ b/src/services/sysuser.js
@@ -0,0 +1,50 @@
 
				+import request from "@/utils/request";
			
 
				+
			
 
				+/*
			
 
				+ * 分页查询
			
 
				+ */
			
 
				+export const getSysUser = (params) => request("/api/sysUser", { params });
			
 
				+
			
 
				+/*
			
 
				+ * 新增数据
			
 
				+ */
			
 
				+export const postSysUser = (data) =>
			
 
				+  request("/api/sysUser", { data, method: "post" });
			
 
				+
			
 
				+/*
			
 
				+ * 通过ID查询单条数据
			
 
				+ */
			
 
				+export const getSysUserById = (id) => request(`/api/sysUser/${id}`);
			
 
				+
			
 
				+/*
			
 
				+ * 通过ID查询单条数据
			
 
				+ */
			
 
				+export const currentUser = () => request(`/api/sysUser/current`);
			
 
				+
			
 
				+/*
			
 
				+ * 更新数据
			
 
				+ */
			
 
				+export const putSysUser = (id, data) =>
			
 
				+  request(`/api/sysUser/${id}`, { data, method: "put" });
			
 
				+
			
 
				+/*
			
 
				+ * 通过主键删除数据
			
 
				+ */
			
 
				+export const deleteSysUser = (id) =>
			
 
				+  request(`/api/sysUser/${id}`, { method: "delete" });
			
 
				+
			
 
				+/*
			
 
				+ * 更新状态
			
 
				+ */
			
 
				+export const updateUserStatus = (id, status) =>
			
 
				+  request(`/api/sysUser/${id}/status?status=${status}`, { method: "put" });
			
 
				+/*
			
 
				+ * 重置密码
			
 
				+ */
			
 
				+export const resetPwd = (id, pwd) =>
			
 
				+  request(`/api/sysUser/${id}/reset-pwd?pwd=${pwd}`, { method: "put" });
			
 
				+
			
 
				+/**
			
 
				+ * 获取ticket
			
 
				+ */
			
 
				+export const getTicket = (params) => request(`/api/sso/getTicket`, { params });
			
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -0,0 +1,14 @@
 
				+import { createStore } from "@zjxpcyc/react-tiny-store";
			
 
				+import useSystem from "./models/system";
			
 
				+import useUser from "./models/user";
			
 
				+
			
 
				+const store = createStore({
			
 
				+  system: useSystem,
			
 
				+  user: useUser,
			
 
				+});
			
 
				+
			
 
				+export default store
			
 
				+export const useModel = store.useModel
			
 
				+export const addModel = store.addModel
			
 
				+export const removeModel = store.removeModel
			
 
				+export const Provider = store.Provider
			
--- a/src/store/models/system.js
+++ b/src/store/models/system.js
@@ -0,0 +1,20 @@
 
				+import { useState, useCallback } from "react";
			
 
				+
			
 
				+export default function useSystem () {
			
 
				+  // 主题
			
 
				+  const [theme, updateTheme] = useState('light');
			
 
				+
			
 
				+  // 其他配置
			
 
				+  const [app, setApp] = useState({
			
 
				+    fullName: '开票信息收集公示系统',
			
 
				+    shorName: '开票信息',
			
 
				+    company: '云致'
			
 
				+  });
			
 
				+
			
 
				+  return {
			
 
				+    theme,
			
 
				+    updateTheme,
			
 
				+    app,
			
 
				+    hashRoute: true,
			
 
				+  }
			
 
				+}
			
--- a/src/store/models/user.js
+++ b/src/store/models/user.js
@@ -0,0 +1,39 @@
 
				+import { useState, useRef } from "react";
			
 
				+import { defaultRoutes, authRoutes, mergeAuthRoutes } from "@/routes/routes";
			
 
				+import { getMenuItems } from "@/routes/menus";
			
 
				+import { getAuthedRoutes } from "@/routes/permissions";
			
 
				+import { currentUser } from "@/services/sys_user";
			
 
				+
			
 
				+export default function useUser() {
			
 
				+  const [user, setUser] = useState();
			
 
				+  const menusRef = useRef();
			
 
				+  const routesRef = useRef();
			
 
				+
			
 
				+  const getCurrentUser = (params) =>
			
 
				+    new Promise((resolve, reject) => {
			
 
				+      currentUser(params)
			
 
				+        .then((res) => {
			
 
				+          const { user } = res;
			
 
				+          const permissions = (user.resourcesList || []).map((x) => x.resourceCode);
			
 
				+
			
 
				+          // authRoutes 是所有待验证授权的路由
			
 
				+          // authedRoutes 是已经被授权的路由
			
 
				+          const authedRoutes = getAuthedRoutes(authRoutes, permissions);
			
 
				+
			
 
				+          menusRef.current = getMenuItems(authedRoutes);
			
 
				+          routesRef.current = mergeAuthRoutes(defaultRoutes, authedRoutes);
			
 
				+
			
 
				+          setUser(user);
			
 
				+          resolve(user);
			
 
				+        })
			
 
				+        .catch(reject);
			
 
				+    });
			
 
				+
			
 
				+  return {
			
 
				+    user,
			
 
				+    setUser,
			
 
				+    getCurrentUser,
			
 
				+    menus: menusRef.current || [],
			
 
				+    routes: routesRef.current || [],
			
 
				+  };
			
 
				+}
			
--- a/src/theme.less
+++ b/src/theme.less
@@ -0,0 +1,11 @@
 
				+
			
 
				+.light {
			
 
				+  .ant-layout,
			
 
				+  .ant-layout-header,
			
 
				+  .ant-layout-sider,
			
 
				+  .ant-layout-sider-trigger,
			
 
				+  .ant-menu
			
 
				+   {
			
 
				+    background: transparent !important;
			
 
				+  }
			
 
				+}
			
--- a/src/utils/array.js
+++ b/src/utils/array.js
@@ -0,0 +1,64 @@
 
				+/**
			
 
				+ * 数组 转 Tree
			
 
				+ * @param {*} arr
			
 
				+ * @param {*} parent
			
 
				+ * @param {*} key
			
 
				+ * @returns
			
 
				+ */
			
 
				+export function arr2Tree(arr = [], parent = "parentId", key = "key") {
			
 
				+  // 转换为字典
			
 
				+  const dict = arr.reduce((acc, item) => {
			
 
				+    return {
			
 
				+      ...acc,
			
 
				+      [item[key]]: {
			
 
				+        ...item,
			
 
				+        children: [],
			
 
				+      },
			
 
				+    };
			
 
				+  }, {});
			
 
				+
			
 
				+  // // 查找顶级结点
			
 
				+  // const getRootNode = (node) => {
			
 
				+  //   const found = arr.filter((x) => node[parentId] === x[key])[0];
			
 
				+
			
 
				+  //   return !found ? dict[node[key]] : getRootNode(found);
			
 
				+  // };
			
 
				+
			
 
				+  // 挂载父子节点
			
 
				+  const tree = [];
			
 
				+  for (let item of arr) {
			
 
				+    const it = dict[item[key]];
			
 
				+    const parentNodeId = it[parent];
			
 
				+    const parentNode = dict[parentNodeId];
			
 
				+
			
 
				+    if (!parentNode) {
			
 
				+      tree.push(it);
			
 
				+    } else {
			
 
				+      dict[parentNodeId].children.push(it);
			
 
				+    }
			
 
				+  }
			
 
				+  return [tree, dict];
			
 
				+}
			
 
				+
			
 
				+/**
			
 
				+ * 深度展平数组
			
 
				+ * @param {*} arr
			
 
				+ * @returns
			
 
				+ */
			
 
				+export function flatten(arr = []) {
			
 
				+  return arr.reduce((acc, it) => {
			
 
				+    const list = Array.isArray(it) ? flatten(it) : it;
			
 
				+    return acc.concat(list);
			
 
				+  }, []);
			
 
				+}
			
 
				+
			
 
				+/**
			
 
				+ * 深度数组去重
			
 
				+ * @param {*} arr
			
 
				+ */
			
 
				+export function uniq(arr = []) {
			
 
				+  const list = flatten(arr);
			
 
				+  return list.reduce((acc, it) => {
			
 
				+    return acc.indexOf(it) > -1 ? acc : acc.concat(it);
			
 
				+  }, []);
			
 
				+}
			
--- a/src/utils/css.js
+++ b/src/utils/css.js
@@ -0,0 +1,8 @@
 
				+
			
 
				+export function setProperty(...args) {
			
 
				+  document.documentElement.style.setProperty(...args);
			
 
				+}
			
 
				+
			
 
				+export function getPropertyValue(...args) {
			
 
				+  return getComputedStyle(document.documentElement).getPropertyValue(...args);
			
 
				+}
			
--- a/src/utils/download.js
+++ b/src/utils/download.js
@@ -0,0 +1,17 @@
 
				+export function fetchBlob(url) {
			
 
				+  return window.fetch(url).then((response) => response.blob());
			
 
				+}
			
 
				+
			
 
				+export function downloadBlob(blob, fileName) {
			
 
				+  console.info(blob)
			
 
				+  const url = window.URL.createObjectURL(blob);
			
 
				+  const link = document.createElement('a');
			
 
				+  link.href = url;
			
 
				+  link.setAttribute('download', fileName);
			
 
				+  link.click();
			
 
				+  window.URL.revokeObjectURL(url);
			
 
				+}
			
 
				+
			
 
				+export function downloadUrl(url, fileName) {
			
 
				+  return fetchBlob(url).then((blob) => downloadBlob(blob, fileName));
			
 
				+}
			
--- a/src/utils/float.js
+++ b/src/utils/float.js
@@ -0,0 +1,5 @@
 
				+const epsilonN = N => num => Math.round( num * N + Number.EPSILON ) / N;
			
 
				+
			
 
				+// 可以处理丢失精度的问题
			
 
				+// 比如 epsilon2(0.29 * 100)
			
 
				+export const epsilon2 = epsilonN(1e2);
			
--- a/src/utils/form.js
+++ b/src/utils/form.js
@@ -0,0 +1,23 @@
 
				+

			
 
				+export const formItemLayout = {

			
 
				+  labelCol: {

			
 
				+    xs: { span: 24 },

			
 
				+    sm: { span: 8 },

			
 
				+  },

			
 
				+  wrapperCol: {

			
 
				+    xs: { span: 24 },

			
 
				+    sm: { span: 16 },

			
 
				+  },

			
 
				+};

			
 
				+export const tailFormItemLayout = {

			
 
				+  wrapperCol: {

			
 
				+    xs: {

			
 
				+      span: 24,

			
 
				+      offset: 0,

			
 
				+    },

			
 
				+    sm: {

			
 
				+      span: 16,

			
 
				+      offset: 8,

			
 
				+    },

			
 
				+  },

			
 
				+};
			
--- a/src/utils/hooks/useBool.js
+++ b/src/utils/hooks/useBool.js
@@ -0,0 +1,13 @@
 
				+import React from "react";
			
 
				+
			
 
				+export default function useLoading(initial = false) {
			
 
				+  const [loading, setLoading] = React.useState(initial);
			
 
				+  const loadingRef = React.useRef();
			
 
				+  loadingRef.current = loading;
			
 
				+
			
 
				+  const setTrue = React.useCallback(() => setLoading(true), []);
			
 
				+  const setFalse = React.useCallback(() => setLoading(false), []);
			
 
				+  const toggle = React.useCallback(() => setLoading(!loadingRef.current), []);
			
 
				+
			
 
				+  return [loading, setTrue, setFalse, setLoading, toggle];
			
 
				+}
			
--- a/src/utils/observe.js
+++ b/src/utils/observe.js
@@ -0,0 +1,19 @@
 
				+
			
 
				+export default function observe() {
			
 
				+  const listeners = [];
			
 
				+
			
 
				+  const subscribe = (fn) => {
			
 
				+    listeners.push(fn);
			
 
				+
			
 
				+    return () => listeners.splice(listeners.indexOf(fn), 1)
			
 
				+  }
			
 
				+
			
 
				+  const notify = (...args) => {
			
 
				+    listeners.forEach(fn => fn(...args))
			
 
				+  }
			
 
				+
			
 
				+  return {
			
 
				+    subscribe,
			
 
				+    notify,
			
 
				+  }
			
 
				+}
			
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -0,0 +1,202 @@
 
				+import axios from "axios";
			
 
				+import React from "react";
			
 
				+import { message } from "antd";
			
 
				+import { getToken, setToken } from "./token";
			
 
				+
			
 
				+const instance = axios.create({
			
 
				+  baseURL: SERVER_BASE,
			
 
				+  timeout: 10000,
			
 
				+  withCredentials: true, // 跨域
			
 
				+});
			
 
				+
			
 
				+// 添加请求拦截器
			
 
				+instance.interceptors.request.use(
			
 
				+  function (config) {
			
 
				+    const {
			
 
				+      headers = {},
			
 
				+      method = "get",
			
 
				+      responseType = "json",
			
 
				+      download = false,
			
 
				+      silent,
			
 
				+      params = {},
			
 
				+    } = config;
			
 
				+    let token = localStorage.getItem("token") || "";
			
 
				+
			
 
				+    let noTip = silent;
			
 
				+    if (noTip === undefined) {
			
 
				+      noTip = method.toLocaleLowerCase() === "get" ? true : false;
			
 
				+    }
			
 
				+
			
 
				+    const ticketOrigin = localStorage.getItem('ticket');
			
 
				+    if (params.ticket && params.ticket != ticketOrigin) {
			
 
				+      token = '';
			
 
				+      localStorage.setItem('ticket', params.ticket);
			
 
				+    } else {
			
 
				+      params.ticket = undefined,
			
 
				+        params.appid = undefined;
			
 
				+    }
			
 
				+
			
 
				+    // 在发送请求之前做些什么
			
 
				+    return {
			
 
				+      ...config,
			
 
				+      params,
			
 
				+      silent: noTip,
			
 
				+      headers: {
			
 
				+        ...headers,
			
 
				+        Authorization: token,
			
 
				+      },
			
 
				+      responseType: download ? "blob" : responseType,
			
 
				+    };
			
 
				+  },
			
 
				+  function (error) {
			
 
				+    // 对请求错误做些什么
			
 
				+    return Promise.reject(error);
			
 
				+  }
			
 
				+);
			
 
				+
			
 
				+// 添加响应拦截器
			
 
				+instance.interceptors.response.use(
			
 
				+  function (response) {
			
 
				+    // 2xx 范围内的状态码都会触发该函数。
			
 
				+    // 对响应数据做点什么
			
 
				+
			
 
				+    const { data, config } = response;
			
 
				+
			
 
				+    if (config.download && !data.code) {
			
 
				+      return downloadBlob(response, "下载文件");
			
 
				+    }
			
 
				+
			
 
				+    if (data.code === 200) {
			
 
				+      if (data.data?.token) {
			
 
				+        setToken(data.data.token);
			
 
				+      }
			
 
				+
			
 
				+      if (!config.silent) {
			
 
				+        message.success("操作成功");
			
 
				+      }
			
 
				+
			
 
				+      return data.data;
			
 
				+    } else if (data.code === 401) {
			
 
				+      if (!config.silent) {
			
 
				+        message.error("未登录或者超时, 请重新登录");
			
 
				+      }
			
 
				+    } else {
			
 
				+      console.log(config);
			
 
				+      if (!config.silent) {
			
 
				+        const errMsg = data.msg || "系统错误";
			
 
				+        message.error(errMsg.indexOf("exception") > -1 ? "服务异常" : errMsg);
			
 
				+      }
			
 
				+    }
			
 
				+
			
 
				+    return Promise.reject(response);
			
 
				+  },
			
 
				+  function (error) {
			
 
				+    // 超出 2xx 范围的状态码都会触发该函数。
			
 
				+    // 对响应错误做点什么
			
 
				+
			
 
				+    console.error(error);
			
 
				+
			
 
				+    return Promise.reject("网络异常, 请重试...");
			
 
				+  }
			
 
				+);
			
 
				+
			
 
				+export default instance;
			
 
				+
			
 
				+export function queryTable (apiRequest) {
			
 
				+  return function (params) {
			
 
				+    const { pageSize } = params;
			
 
				+    return apiRequest({
			
 
				+      ...params,
			
 
				+      pageSize,
			
 
				+      pageNum: params.current,
			
 
				+    })
			
 
				+      .then((res) => {
			
 
				+        return {
			
 
				+          data: res.records,
			
 
				+          success: true,
			
 
				+          total: res.total,
			
 
				+        };
			
 
				+      })
			
 
				+      .catch((err) => {
			
 
				+        return {
			
 
				+          success: false,
			
 
				+        };
			
 
				+      });
			
 
				+  };
			
 
				+}
			
 
				+
			
 
				+export function queryDict (
			
 
				+  apiRequest,
			
 
				+  { labelKey = "name", valueKey = "id" } = {}
			
 
				+) {
			
 
				+  return function (params) {
			
 
				+    const { current, pageSize, ...leftParams } = params || {};
			
 
				+    return apiRequest({
			
 
				+      pageSize: 9999,
			
 
				+      pageNum: 1,
			
 
				+      ...(leftParams || {}),
			
 
				+    })
			
 
				+      .then((res) => {
			
 
				+        return res?.records?.map((x) => ({
			
 
				+          label: x[labelKey],
			
 
				+          value: x[valueKey],
			
 
				+          ...x,
			
 
				+        }));
			
 
				+      })
			
 
				+      .catch((err) => {
			
 
				+        return {
			
 
				+          success: false,
			
 
				+        };
			
 
				+      });
			
 
				+  };
			
 
				+}
			
 
				+export function restful (url) {
			
 
				+  const list = (params) => instance.get(url, { params });
			
 
				+  const get = (id) => instance.get(`${url}/${id}`);
			
 
				+  const add = (data) => instance.post(url, data);
			
 
				+  const update = (id, data) => instance.put(`${url}/${id}`, data);
			
 
				+  const del = (id) => instance.delete(`${url}/${id}`);
			
 
				+
			
 
				+  return [list, get, add, update, del];
			
 
				+}
			
 
				+
			
 
				+export function useRequest (fn) {
			
 
				+  const [loading, setLoading] = React.useState(false);
			
 
				+
			
 
				+  const p = (...args) =>
			
 
				+    new Promise((resolve, reject) => {
			
 
				+      setLoading(true);
			
 
				+      fn(...args)
			
 
				+        .then((res) => {
			
 
				+          setLoading(false);
			
 
				+          resolve(res);
			
 
				+        })
			
 
				+        .catch((e) => {
			
 
				+          setLoading(false);
			
 
				+          reject(e);
			
 
				+        });
			
 
				+    });
			
 
				+
			
 
				+  return [loading, p];
			
 
				+}
			
 
				+
			
 
				+function downloadBlob (response) {
			
 
				+  let fileName = "未知文件";
			
 
				+  const contentType = response.headers["content-type"];
			
 
				+  const contentDisposition = response.headers["content-disposition"];
			
 
				+  if (contentDisposition) {
			
 
				+    const parts = contentDisposition.split(";filename=");
			
 
				+    if (parts[1]) {
			
 
				+      fileName = decodeURIComponent(parts[1]);
			
 
				+    }
			
 
				+  }
			
 
				+
			
 
				+  const url = window.URL.createObjectURL(
			
 
				+    new Blob([response.data], { type: contentType })
			
 
				+  );
			
 
				+  const link = document.createElement("a");
			
 
				+  link.href = url;
			
 
				+  link.setAttribute("download", fileName);
			
 
				+  link.click();
			
 
				+  window.URL.revokeObjectURL(url);
			
 
				+}
			
--- a/src/utils/sso.js
+++ b/src/utils/sso.js
@@ -0,0 +1,70 @@
 
				+import { getToken, setToken } from "./token";
			
 
				+
			
 
				+/**
			
 
				+ * 异或加密, 可同时进行加密及解密
			
 
				+ * @param {*} src 原始数据或待解密数据
			
 
				+ * @param {*} key 密钥数组
			
 
				+ * @returns 
			
 
				+ */
			
 
				+function xorDecrypt(src, key) {
			
 
				+  let output = '';
			
 
				+  for (var i = 0; i < src.length; i++) {
			
 
				+    const c = src[i].charCodeAt();
			
 
				+    const k = key[i % key.length];
			
 
				+    output += String.fromCharCode(c ^ k);
			
 
				+  }
			
 
				+  return output;
			
 
				+}
			
 
				+
			
 
				+/**
			
 
				+ * 获取 token
			
 
				+ * @param {*} url 
			
 
				+ * @returns 
			
 
				+ */
			
 
				+function getTokenFromUrl(url) {
			
 
				+  const matches = url.match(/sso-token=([^/&?]+)/);
			
 
				+  return matches?.[1];
			
 
				+}
			
 
				+
			
 
				+/**
			
 
				+ * 初始化 token
			
 
				+ * @returns 
			
 
				+ */
			
 
				+export function initTokenIfExists() {
			
 
				+  // token 是 base64 格式
			
 
				+  const base64Str = getTokenFromUrl(window.location.href);
			
 
				+  if (!base64Str) return;
			
 
				+
			
 
				+  // base64 解码
			
 
				+  const tkMixStr = window.atob(base64Str);
			
 
				+  if (!tkMixStr) return;
			
 
				+
			
 
				+  // 解码后的格式为 xxxx-xxxxxxxxx
			
 
				+  // 其中第一部分为密钥, 第二部分为 加密字串
			
 
				+  const [keyStr, ...tkArr] = tkMixStr.split('-')
			
 
				+  if (!keyStr || !tkArr.length) return;
			
 
				+  
			
 
				+  // 需要异或解密的是第二部分
			
 
				+  const tkStr = tkArr.join('-');
			
 
				+  const tk = xorDecrypt(tkStr, keyStr.split(''))
			
 
				+  if (tk) {
			
 
				+    setToken(tk);
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+/**
			
 
				+ * 获取加密且可用于 URL 的 token
			
 
				+ * @returns 
			
 
				+ */
			
 
				+export function getEncryptToken() {
			
 
				+  const tk = getToken();
			
 
				+  if (!tk) return;
			
 
				+
			
 
				+  const key = (new Date).valueOf();
			
 
				+  
			
 
				+  // 用 key 加密 token
			
 
				+  const cipherText = xorDecrypt(tk, `${key}`.split(''));
			
 
				+  const mixStr = [key, cipherText].join('-');
			
 
				+
			
 
				+  return window.btoa(mixStr);
			
 
				+}
			
--- a/src/utils/token.js
+++ b/src/utils/token.js