diff --git a/src/api/system/notice.ts b/src/api/system/notice.ts new file mode 100644 index 0000000..81dd7f9 --- /dev/null +++ b/src/api/system/notice.ts @@ -0,0 +1,23 @@ +import request from "../../utils/request"; + +export const getNoticeListApi = (params: any) => { + return request({ + url: "/notice/notify", + method: "get", + params, + }); +}; + +export const getNoticeInfoApi = (id: number) => { + return request({ + url: "/notice/notify/" + id, + method: "get", + }); +}; + +export const deleteNoticeInfoApi = (id: number) => { + return request({ + url: "/notice/notify/" + id, + method: "delete", + }); +}; diff --git a/src/view/system/dept/index.tsx b/src/view/system/dept/index.tsx index 3012326..5b3ace3 100644 --- a/src/view/system/dept/index.tsx +++ b/src/view/system/dept/index.tsx @@ -1,7 +1,5 @@ import React from "react"; export default function Dept() { - return( -
dept
- ) -} \ No newline at end of file + return
dept
; +} diff --git a/src/view/system/notice/inform/index.scss b/src/view/system/notice/inform/index.scss new file mode 100644 index 0000000..12821c2 --- /dev/null +++ b/src/view/system/notice/inform/index.scss @@ -0,0 +1,60 @@ +#content { + display: flex; + border-top: 1px solid black; + .dept-content { + flex: 20%; + padding: 35px 12px 0 0; + height: calc(100vh - 85px); + } + + .left-dept { + flex: 20%; + padding: 35px 12px 0 0; + height: calc(100vh - 85px); + border: 1px solid red; + border-top: 1px solid black; + } + .right { + flex: 80%; + height: 190px; + display: flex; + flex-direction: column; + + .search-content { + display: flex; + width: 500px; + justify-content: space-around; + padding: 35px 12px 0 0; + margin-left: 20px; + } + } + .table-content { + margin: 12px 0 0 12px; + + .ant-table-thead > tr > th { + color: #909399; + text-align: center; + } + .ant-table-tbody > tr > td { + text-align: center; + } + } + .add-content { + display: flex; + margin-left: 12px; + margin-top: 20px; + button:focus, + button:focus-visible { + outline: none; + } + } + .user-mid-button { + display: flex; + margin-left: 12px; + margin-top: 20px; + button:focus, + button:focus-visible { + outline: none; + } + } +} diff --git a/src/view/system/notice/inform/index.tsx b/src/view/system/notice/inform/index.tsx new file mode 100644 index 0000000..b48eae1 --- /dev/null +++ b/src/view/system/notice/inform/index.tsx @@ -0,0 +1,242 @@ +import "./index.scss"; +import { Select, Button, Table, Space, Tag, message, Modal } from "antd"; + +import { + EditOutlined, + DeleteOutlined, + ExclamationCircleFilled, +} from "@ant-design/icons"; + +import { + getNoticeListApi, + deleteNoticeInfoApi, +} from "../../../../api/system/notice"; + +import { useEffect, useState } from "react"; +import { SearchOutlined, RedoOutlined } from "@ant-design/icons"; + +export default function Inform() { + const [noticeInfo, setNoticeInfo] = useState(""); + const [isNoticeOpen, setIsNoticeOpen] = useState(false); + const [listData, setListData] = useState([]); + const [messageApi, contextHolder] = message.useMessage(); + const [queryParams, setQueryParams] = useState({ + state: undefined, + pageSize: undefined, + pageNum: undefined, + }); + const columns = [ + { + title: "序号", + dataIndex: "noticeId", + key: "noticeId", + render: (text: string) => <>{text ? text : "null"}, + }, + { + title: "公告标题", + dataIndex: "noticeTitle", + key: "noticeTitle", + render: (text: string) => <>{text ? text : "null"}, + }, + { + title: "阅读状态", + key: "state", + dataIndex: "state", + render: (text: string) => ( + <> + {text === "1" ? ( + 已读 + ) : ( + 未读 + )} + + ), + }, + { + title: "操作", + key: "operate", + dataIndex: "operate", + render: (_: string, record: object) => ( +
+ + + handleInfo(record)} + style={{ color: " #58aaff" }} + > + 详情 + + + handleDel(record)} + style={{ color: " #58aaff" }} + > + 删除 + + +
+ ), + }, + ]; + + interface QueryParamsType { + state?: string; + pageSize?: number; + pageNum?: number; + } + + const getList = async (newQueryParams: object) => { + try { + const { code, data } = await getNoticeListApi(newQueryParams); + if (code === 1000) { + setListData(data.rows); + } + } catch (err) { + console.error(err); + } + }; + + const handleReset = async () => { + setQueryParams({}); + getList({}); + }; + + const handleSearch = () => { + getList(queryParams); + }; + + const handleInfo = (record: any) => { + setIsNoticeOpen(true); + setNoticeInfo(record.noticeTitle); + }; + + const handleInfoOk = () => { + setIsNoticeOpen(false); + }; + + const handleInfoCancel = () => { + setIsNoticeOpen(false); + }; + + const handleDel = async (record: any) => { + Modal.confirm({ + title: `确定删除Id为-${record.noticeId}-, 名称为-${record.noticeTitle}-的岗位吗?`, + icon: , + async onOk() { + const { code } = await deleteNoticeInfoApi(record.noticeId); + try { + if (code === 1000) { + messageApi.open({ + type: "success", + content: "删除成功", + }); + getList({}); + } else { + messageApi.open({ + type: "error", + content: "删除失败", + }); + } + } catch (err) { + console.log(err); + } + }, + onCancel() { + messageApi.open({ + type: "warning", + content: "取消成功", + }); + }, + }); + }; + + const handlePageChange = (page: number) => { + setQueryParams({ + ...queryParams, + pageNum: page, + }); + }; + + useEffect(() => { + getList(queryParams); + }, []); + + return ( +
+ <> +
+
+ <> + +
状态
+