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

This commit is contained in:
禺狨 2023-03-14 15:17:28 +08:00
parent 1972380fd7
commit 63a8992312
9 changed files with 135 additions and 107 deletions

View File

@ -1,8 +1,8 @@
@font-face {
font-family: "iconfont"; /* Project id 3943555 */
src: url('iconfont.woff2?t=1678435002469') format('woff2'),
url('iconfont.woff?t=1678435002469') format('woff'),
url('iconfont.ttf?t=1678435002469') format('truetype');
src: url('iconfont.woff2?t=1678776813161') format('woff2'),
url('iconfont.woff?t=1678776813161') format('woff'),
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";
}

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@ -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;

View File

@ -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();

View File

@ -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">
<PerButton
type="link"
text="编辑"
class="b-link c-red"
icon={null}
p="department-cud"
onClick={() => {
setDid(departments[id][i].id);
setUpdateVisible(true);
}}
disabled={null}
/>
<div className="form-column"></div>
<PerButton
type="link"
text="删除"
class="b-link c-red"
icon={null}
p="department-cud"
onClick={() => delUser(departments[id][i].id)}
disabled={null}
/>
</Space>
<i
className="iconfont icon-icon-drag mr-16"
style={{ fontSize: 24 }}
/>
{through("department-cud") && (
<>
<i
className="iconfont icon-icon-edit mr-16"
style={{ fontSize: 24 }}
onClick={() => {
setDid(departments[id][i].id);
setUpdateVisible(true);
}}
/>
<i
className="iconfont icon-icon-delete"
style={{ fontSize: 24 }}
onClick={() => delUser(departments[id][i].id)}
/>
</>
)}
</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">
<PerButton
type="link"
text="编辑"
class="b-link c-red"
icon={null}
p="department-cud"
onClick={() => {
setDid(departments[id][i].id);
setUpdateVisible(true);
}}
disabled={null}
/>
<div className="form-column"></div>
<PerButton
type="link"
text="删除"
class="b-link c-red"
icon={null}
p="department-cud"
onClick={() => delUser(departments[id][i].id)}
disabled={null}
/>
</Space>
<i
className="iconfont icon-icon-drag mr-16"
style={{ fontSize: 24 }}
/>
{through("department-cud") && (
<>
<i
className="iconfont icon-icon-edit mr-16"
style={{ fontSize: 24 }}
onClick={() => {
setDid(departments[id][i].id);
setUpdateVisible(true);
}}
/>
<i
className="iconfont icon-icon-delete"
style={{ fontSize: 24 }}
onClick={() => delUser(departments[id][i].id)}
/>
</>
)}
</div>
),
key: departments[id][i].id,

View File

@ -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();

View File

@ -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">
<PerButton
type="link"
text="编辑"
class="b-link c-red"
icon={null}
p="resource-category"
onClick={() => {
setCid(categories[id][i].id);
setUpdateVisible(true);
}}
disabled={null}
/>
<div className="form-column"></div>
<PerButton
type="link"
text="删除"
class="b-link c-red"
icon={null}
p="resource-category"
onClick={() => delUser(categories[id][i].id)}
disabled={null}
/>
</Space>
<i
className="iconfont icon-icon-drag mr-16"
style={{ fontSize: 24 }}
/>
{through("resource-category") && (
<>
<i
className="iconfont icon-icon-edit mr-16"
style={{ fontSize: 24 }}
onClick={() => {
setCid(categories[id][i].id);
setUpdateVisible(true);
}}
/>
<i
className="iconfont icon-icon-delete"
style={{ fontSize: 24 }}
onClick={() => delUser(categories[id][i].id)}
/>
</>
)}
</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">
<PerButton
type="link"
text="编辑"
class="b-link c-red"
icon={null}
p="resource-category"
onClick={() => {
setCid(categories[id][i].id);
setUpdateVisible(true);
}}
disabled={null}
/>
<div className="form-column"></div>
<PerButton
type="link"
text="删除"
class="b-link c-red"
icon={null}
p="resource-category"
onClick={() => delUser(categories[id][i].id)}
disabled={null}
/>
</Space>
<i
className="iconfont icon-icon-drag mr-16"
style={{ fontSize: 24 }}
/>
{through("resource-category") && (
<>
<i
className="iconfont icon-icon-edit mr-16"
style={{ fontSize: 24 }}
onClick={() => {
setCid(categories[id][i].id);
setUpdateVisible(true);
}}
/>
<i
className="iconfont icon-icon-delete"
style={{ fontSize: 24 }}
onClick={() => delUser(categories[id][i].id)}
/>
</>
)}
</div>
),
key: categories[id][i].id,