部门、分类管理页面图标替换

src/assets/iconfont/iconfont.css

@@ -1,8 +1,8 @@
 @font-face {
   font-family: "iconfont"; /* Project id 3943555 */
-  src: url('iconfont.woff2?t=1678435002469') format('woff2'),
+  src: url('iconfont.woff2?t=1678776813161') format('woff2'),
-       url('iconfont.woff?t=1678435002469') format('woff'),
+       url('iconfont.woff?t=1678776813161') format('woff'),
-       url('iconfont.ttf?t=1678435002469') format('truetype');
+       url('iconfont.ttf?t=1678776813161') format('truetype');
 }
 
 .iconfont {
@@ -13,6 +13,18 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-icon-drag:before {
+  content: "\e740";
+}
+
+.icon-icon-edit:before {
+  content: "\e741";
+}
+
+.icon-icon-delete:before {
+  content: "\e742";
+}
+
 .icon-icon-video:before {
   content: "\e73f";
 }

src/index.less

@@ -406,6 +406,16 @@ textarea.ant-input {
   }
 }
 
+.ant-tree-title {
+  .iconfont {
+    color: rgba(0, 0, 0, 0.3);
+    cursor: pointer;
+    &:hover {
+      opacity: 0.8;
+    }
+  }
+}
+
 .ant-modal-confirm-btns > .ant-btn-default:hover {
   color: #ff4d4f !important;
   border-color: #ff4d4f;

src/pages/department/compenents/update.tsx

@@ -24,6 +24,7 @@ export const DepartmentUpdate: React.FC<PropInterface> = ({
   const [loading, setLoading] = useState<boolean>(true);
   const [departments, setDepartments] = useState<any>([]);
   const [parent_id, setParentId] = useState<number>(0);
+  const [sort, setSort] = useState<number>(0);
 
   useEffect(() => {
     getParams();
@@ -63,6 +64,7 @@ export const DepartmentUpdate: React.FC<PropInterface> = ({
         parent_id: new_arr,
       });
       setParentId(data.parent_id);
+      setSort(data.sort);
     });
   };
 
@@ -90,7 +92,7 @@ export const DepartmentUpdate: React.FC<PropInterface> = ({
 
   const onFinish = (values: any) => {
     department
-      .updateDepartment(id, values.name, parent_id || 0, 0)
+      .updateDepartment(id, values.name, parent_id || 0, sort)
       .then((res: any) => {
         message.success("保存成功！");
         onCancel();

src/pages/department/index.tsx

@@ -1,13 +1,13 @@
 import React, { useState, useEffect } from "react";
-import { Button, Space, Tree, Modal, message } from "antd";
+import { Button, Tree, Modal, message } from "antd";
 import styles from "./index.module.less";
 import { PlusOutlined, ExclamationCircleFilled } from "@ant-design/icons";
 import { department } from "../../api/index";
-import { useNavigate } from "react-router-dom";
 import { PerButton } from "../../compenents";
 import type { DataNode, TreeProps } from "antd/es/tree";
 import { DepartmentCreate } from "./compenents/create";
 import { DepartmentUpdate } from "./compenents/update";
+import { useSelector } from "../../store/hooks";
 
 const { confirm } = Modal;
 
@@ -25,7 +25,7 @@ interface DataType {
 }
 
 export const DepartmentPage: React.FC = () => {
-  const navigate = useNavigate();
+  const permisssions = useSelector((state: any) => state.permisssions);
   const [loading, setLoading] = useState<boolean>(true);
   const [refresh, setRefresh] = useState(false);
   const [treeData, setTreeData] = useState<any>([]);
@@ -40,6 +40,13 @@ export const DepartmentPage: React.FC = () => {
     console.log(selectedKeys);
   };
 
+  const through = (p: string) => {
+    if (!permisssions) {
+      return false;
+    }
+    return typeof permisssions[p] !== "undefined";
+  };
+
   useEffect(() => {
     getData();
   }, [refresh]);
@@ -65,30 +72,27 @@ export const DepartmentPage: React.FC = () => {
           title: (
             <div className="d-flex">
               <div className="w-250px mr-24">{departments[id][i].name}</div>
-              <Space size="small">
+              <i
-                <PerButton
+                className="iconfont icon-icon-drag mr-16"
-                  type="link"
+                style={{ fontSize: 24 }}
-                  text="编辑"
+              />
-                  class="b-link c-red"
+              {through("department-cud") && (
-                  icon={null}
+                <>
-                  p="department-cud"
+                  <i
+                    className="iconfont icon-icon-edit mr-16"
+                    style={{ fontSize: 24 }}
                     onClick={() => {
                       setDid(departments[id][i].id);
                       setUpdateVisible(true);
                     }}
-                  disabled={null}
                   />
-                <div className="form-column"></div>
+                  <i
-                <PerButton
+                    className="iconfont icon-icon-delete"
-                  type="link"
+                    style={{ fontSize: 24 }}
-                  text="删除"
-                  class="b-link c-red"
-                  icon={null}
-                  p="department-cud"
                     onClick={() => delUser(departments[id][i].id)}
-                  disabled={null}
                   />
-              </Space>
+                </>
+              )}
             </div>
           ),
           key: departments[id][i].id,
@@ -99,30 +103,27 @@ export const DepartmentPage: React.FC = () => {
           title: (
             <div className="d-flex">
               <div className="w-250px mr-24">{departments[id][i].name}</div>
-              <Space size="small">
+              <i
-                <PerButton
+                className="iconfont icon-icon-drag mr-16"
-                  type="link"
+                style={{ fontSize: 24 }}
-                  text="编辑"
+              />
-                  class="b-link c-red"
+              {through("department-cud") && (
-                  icon={null}
+                <>
-                  p="department-cud"
+                  <i
+                    className="iconfont icon-icon-edit mr-16"
+                    style={{ fontSize: 24 }}
                     onClick={() => {
                       setDid(departments[id][i].id);
                       setUpdateVisible(true);
                     }}
-                  disabled={null}
                   />
-                <div className="form-column"></div>
+                  <i
-                <PerButton
+                    className="iconfont icon-icon-delete"
-                  type="link"
+                    style={{ fontSize: 24 }}
-                  text="删除"
-                  class="b-link c-red"
-                  icon={null}
-                  p="department-cud"
                     onClick={() => delUser(departments[id][i].id)}
-                  disabled={null}
                   />
-              </Space>
+                </>
+              )}
             </div>
           ),
           key: departments[id][i].id,

src/pages/resource/resource-category/compenents/update.tsx

@@ -24,6 +24,7 @@ export const ResourceCategoryUpdate: React.FC<PropInterface> = ({
   const [loading, setLoading] = useState<boolean>(true);
   const [categories, setCategories] = useState<any>([]);
   const [parent_id, setParentId] = useState<number>(0);
+  const [sort, setSort] = useState<number>(0);
 
   useEffect(() => {
     getParams();
@@ -63,6 +64,7 @@ export const ResourceCategoryUpdate: React.FC<PropInterface> = ({
         parent_id: new_arr,
       });
       setParentId(data.parent_id);
+      setSort(data.sort);
     });
   };
 
@@ -88,7 +90,7 @@ export const ResourceCategoryUpdate: React.FC<PropInterface> = ({
 
   const onFinish = (values: any) => {
     resourceCategory
-      .updateResourceCategory(id, values.name, parent_id || 0, 0)
+      .updateResourceCategory(id, values.name, parent_id || 0, sort)
       .then((res: any) => {
         message.success("保存成功！");
         onCancel();

src/pages/resource/resource-category/index.tsx

@@ -1,13 +1,13 @@
 import React, { useState, useEffect } from "react";
-import { Button, Space, Tree, Modal, message } from "antd";
+import { Button, Tree, Modal, message } from "antd";
 import styles from "./index.module.less";
 import { PlusOutlined, ExclamationCircleFilled } from "@ant-design/icons";
 import { resourceCategory } from "../../../api/index";
-import {  useNavigate } from "react-router-dom";
 import { PerButton } from "../../../compenents";
 import type { DataNode, TreeProps } from "antd/es/tree";
 import { ResourceCategoryCreate } from "./compenents/create";
 import { ResourceCategoryUpdate } from "./compenents/update";
+import { useSelector } from "../../../store/hooks";
 
 const { confirm } = Modal;
 
@@ -25,7 +25,7 @@ interface DataType {
 }
 
 export const ResourceCategoryPage: React.FC = () => {
-  const navigate = useNavigate();
+  const permisssions = useSelector((state: any) => state.permisssions);
   const [loading, setLoading] = useState<boolean>(true);
   const [refresh, setRefresh] = useState(false);
   const [treeData, setTreeData] = useState<any>([]);
@@ -42,6 +42,13 @@ export const ResourceCategoryPage: React.FC = () => {
     setSelectKey(selectedKeys);
   };
 
+  const through = (p: string) => {
+    if (!permisssions) {
+      return false;
+    }
+    return typeof permisssions[p] !== "undefined";
+  };
+
   const getData = () => {
     setLoading(true);
     resourceCategory.resourceCategoryList().then((res: any) => {
@@ -62,30 +69,27 @@ export const ResourceCategoryPage: React.FC = () => {
           title: (
             <div className="d-flex">
               <div className="w-250px mr-24">{categories[id][i].name}</div>
-              <Space size="small">
+              <i
-                <PerButton
+                className="iconfont icon-icon-drag mr-16"
-                  type="link"
+                style={{ fontSize: 24 }}
-                  text="编辑"
+              />
-                  class="b-link c-red"
+              {through("resource-category") && (
-                  icon={null}
+                <>
-                  p="resource-category"
+                  <i
+                    className="iconfont icon-icon-edit mr-16"
+                    style={{ fontSize: 24 }}
                     onClick={() => {
                       setCid(categories[id][i].id);
                       setUpdateVisible(true);
                     }}
-                  disabled={null}
                   />
-                <div className="form-column"></div>
+                  <i
-                <PerButton
+                    className="iconfont icon-icon-delete"
-                  type="link"
+                    style={{ fontSize: 24 }}
-                  text="删除"
-                  class="b-link c-red"
-                  icon={null}
-                  p="resource-category"
                     onClick={() => delUser(categories[id][i].id)}
-                  disabled={null}
                   />
-              </Space>
+                </>
+              )}
             </div>
           ),
           key: categories[id][i].id,
@@ -96,30 +100,27 @@ export const ResourceCategoryPage: React.FC = () => {
           title: (
             <div className="d-flex">
               <div className="w-250px mr-24">{categories[id][i].name}</div>
-              <Space size="small">
+              <i
-                <PerButton
+                className="iconfont icon-icon-drag mr-16"
-                  type="link"
+                style={{ fontSize: 24 }}
-                  text="编辑"
+              />
-                  class="b-link c-red"
+              {through("resource-category") && (
-                  icon={null}
+                <>
-                  p="resource-category"
+                  <i
+                    className="iconfont icon-icon-edit mr-16"
+                    style={{ fontSize: 24 }}
                     onClick={() => {
                       setCid(categories[id][i].id);
                       setUpdateVisible(true);
                     }}
-                  disabled={null}
                   />
-                <div className="form-column"></div>
+                  <i
-                <PerButton
+                    className="iconfont icon-icon-delete"
-                  type="link"
+                    style={{ fontSize: 24 }}
-                  text="删除"
-                  class="b-link c-red"
-                  icon={null}
-                  p="resource-category"
                     onClick={() => delUser(categories[id][i].id)}
-                  disabled={null}
                   />
-              </Space>
+                </>
+              )}
             </div>
           ),
           key: categories[id][i].id,