back-bar组件

src/compenents/back-bar/index.module.less

@@ -0,0 +1,20 @@
+.back-bar-box {
+  width: 100%;
+  height: auto;
+  float: left;
+  display: flex;
+  align-items: center;
+
+  .line {
+    width: 1px;
+    height: 14px;
+    background-color: #d8d8d8;
+    margin-right: 15px;
+  }
+
+  .name {
+    font-size: 14px;
+    font-weight: 600;
+    color: #333333;
+  }
+}

src/compenents/back-bar/index.tsx

@@ -0,0 +1,29 @@
+import { Button } from "antd";
+import { useState } from "react";
+import styles from "./index.module.less";
+import { useNavigate } from "react-router-dom";
+import { LeftOutlined } from "@ant-design/icons";
+
+interface PropInterface {
+  title: string;
+}
+
+export const BackBartment = (props: PropInterface) => {
+  const [loading, setLoading] = useState<boolean>(true);
+  const navigate = useNavigate();
+  return (
+    <div className={styles["back-bar-box"]}>
+      <Button
+      style={{paddingLeft:0}}
+        icon={<LeftOutlined />}
+        type="link"
+        danger
+        onClick={() => navigate(-1)}
+      >
+        返回
+      </Button>
+      <div className={styles["line"]}></div>
+      <div className={styles["name"]}>{props.title}</div>
+    </div>
+  );
+};

src/compenents/index.ts

@@ -2,4 +2,5 @@ export * from "./footer";
 export * from "./header";
 export * from "./leftMenu";
 export * from "./upload-image-button";
-export * from ".//treeDepartment";
+export * from "./treeDepartment";
+export * from "./back-bar";

src/pages/member/create.tsx

@@ -3,7 +3,7 @@ import { Row, Col, Form, Input, Cascader, Button, message } from "antd";
 import styles from "./create.module.less";
 import { user, department } from "../../api/index";
 import { useNavigate } from "react-router-dom";
-import { UploadImageButton } from "../../compenents";
+import { UploadImageButton, BackBartment } from "../../compenents";
 
 interface Option {
   value: string | number;
@@ -80,6 +80,10 @@ export const MemberCreatePage: React.FC = () => {
     <>
       <Row className="playedu-main-body">
         <Col>
+          <div className="float-left mb-24">
+            <BackBartment title="添加学员" />
+          </div>
+          <div className="float-left">
             <Form
               form={form}
               name="basic"
@@ -164,6 +168,7 @@ export const MemberCreatePage: React.FC = () => {
                 </Button>
               </Form.Item>
             </Form>
+          </div>
         </Col>
       </Row>
     </>

src/pages/member/update.tsx

@@ -3,7 +3,7 @@ import { Row, Col, Form, Input, Cascader, Button, message } from "antd";
 import styles from "./update.module.less";
 import { user, department } from "../../api/index";
 import { useParams, useNavigate } from "react-router-dom";
-import { UploadImageButton } from "../../compenents";
+import { UploadImageButton, BackBartment } from "../../compenents";
 
 interface Option {
   value: string | number;
@@ -102,6 +102,10 @@ export const MemberUpdatePage: React.FC = () => {
     <>
       <Row className="playedu-main-body">
         <Col>
+          <div className="float-left mb-24">
+            <BackBartment title="编辑学员" />
+          </div>
+          <div className="float-left">
             <Form
               form={form}
               name="basic"
@@ -193,6 +197,7 @@ export const MemberUpdatePage: React.FC = () => {
                 </Button>
               </Form.Item>
             </Form>
+          </div>
         </Col>
       </Row>
     </>

src/pages/system/administrator/create.tsx

@@ -3,6 +3,7 @@ import { Row, Col, Form, Input, Select, Switch, Button, message } from "antd";
 import styles from "./create.module.less";
 import { adminUser } from "../../../api/index";
 import { useNavigate } from "react-router-dom";
+import { BackBartment } from "../../../compenents";
 
 export const AdministratorCreatePage: React.FC = () => {
   const navigate = useNavigate();
@@ -62,6 +63,10 @@ export const AdministratorCreatePage: React.FC = () => {
     <>
       <Row className="playedu-main-body">
         <Col>
+          <div className="float-left mb-24">
+            <BackBartment title="添加管理员" />
+          </div>
+          <div className="float-left">
             <Form
               form={form}
               name="basic"
@@ -137,6 +142,7 @@ export const AdministratorCreatePage: React.FC = () => {
                 </Button>
               </Form.Item>
             </Form>
+          </div>
         </Col>
       </Row>
     </>

src/pages/system/administrator/update.tsx

@@ -3,6 +3,7 @@ import { Row, Col, Form, Input, Select, Switch, Button, message } from "antd";
 import styles from "./update.module.less";
 import { adminUser } from "../../../api/index";
 import { useParams, useNavigate } from "react-router-dom";
+import { BackBartment } from "../../../compenents";
 
 export const AdministratorUpdatePage: React.FC = () => {
   const params = useParams();
@@ -80,6 +81,10 @@ export const AdministratorUpdatePage: React.FC = () => {
     <>
       <Row className="playedu-main-body">
         <Col>
+          <div className="float-left mb-24">
+            <BackBartment title="编辑管理员" />
+          </div>
+          <div className="float-left">
             <Form
               form={form}
               name="basic"
@@ -154,6 +159,7 @@ export const AdministratorUpdatePage: React.FC = () => {
                 </Button>
               </Form.Item>
             </Form>
+          </div>
         </Col>
       </Row>
     </>

src/pages/system/adminroles/create.tsx

@@ -3,6 +3,7 @@ import { Row, Col, Form, Input, Select, Button, message } from "antd";
 import styles from "./create.module.less";
 import { adminRole } from "../../../api/index";
 import { useNavigate } from "react-router-dom";
+import { BackBartment } from "../../../compenents";
 
 export const AdminrolesCreatePage: React.FC = () => {
   const navigate = useNavigate();
@@ -47,6 +48,10 @@ export const AdminrolesCreatePage: React.FC = () => {
     <>
       <Row className="playedu-main-body">
         <Col>
+          <div className="float-left mb-24">
+            <BackBartment title="添加管理员角色" />
+          </div>
+          <div className="float-left">
             <Form
               form={form}
               name="basic"
@@ -88,6 +93,7 @@ export const AdminrolesCreatePage: React.FC = () => {
                 </Button>
               </Form.Item>
             </Form>
+          </div>
         </Col>
       </Row>
     </>

src/pages/system/adminroles/index.tsx

@@ -15,6 +15,7 @@ import { PlusOutlined, ReloadOutlined } from "@ant-design/icons";
 import { adminRole } from "../../../api/index";
 import { dateFormat } from "../../../utils/index";
 import { Link, useNavigate } from "react-router-dom";
+import { BackBartment } from "../../../compenents";
 
 interface DataType {
   id: React.Key;
@@ -106,6 +107,9 @@ export const SystemAdminrolesPage: React.FC = () => {
   return (
     <>
       <div className="playedu-main-body">
+        <div className="float-left mb-24">
+          <BackBartment title="管理员角色" />
+        </div>
         <div className="float-left j-b-flex mb-24">
           <div className="d-flex">
             <Link

src/pages/system/adminroles/update.tsx

@@ -3,6 +3,7 @@ import { Row, Col, Form, Input, Select, Button, message } from "antd";
 import styles from "./update.module.less";
 import { adminRole } from "../../../api/index";
 import { useParams, useNavigate } from "react-router-dom";
+import { BackBartment } from "../../../compenents";
 
 export const AdminrolesUpdatePage: React.FC = () => {
   const params = useParams();
@@ -62,6 +63,10 @@ export const AdminrolesUpdatePage: React.FC = () => {
     <>
       <Row className="playedu-main-body">
         <Col>
+          <div className="float-left mb-24">
+            <BackBartment title="编辑管理员角色" />
+          </div>
+          <div className="float-left">
             <Form
               form={form}
               name="basic"
@@ -103,6 +108,7 @@ export const AdminrolesUpdatePage: React.FC = () => {
                 </Button>
               </Form.Item>
             </Form>
+          </div>
         </Col>
       </Row>
     </>