auditHistory.tsx.bak 5.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193
  1. import * as React from 'react';
  2. import { Table, TableColumnsType, TablePaginationConfig, Drawer } from 'antd';
  3. import { StepForwardOutlined } from '@ant-design/icons';
  4. import dayjs from 'dayjs';
  5. import store from './auditHistoryStore';
  6. import { Record } from '../types';
  7. import '../style.less';
  8. import InfoModal from './InfoModal';
  9. import PreviewModal from './PreviewModal';
  10. import LocalStorage from '@/LocalStorage';
  11. interface AuditHistoryProps {
  12. open: boolean;
  13. onClose: () => void;
  14. }
  15. const AuditHistory: React.FC<AuditHistoryProps> = ({ open, onClose }) => {
  16. const {
  17. state,
  18. init,
  19. onChangePagination,
  20. onClickModify,
  21. infoModalOnClickConfirm,
  22. infoModalOnClickCancel,
  23. infoModalOnClickClose,
  24. } = store;
  25. const {
  26. listLoading,
  27. list,
  28. infoModalId,
  29. infoModalOpen,
  30. page
  31. } = state;
  32. const [drawerFlag, setDrawerFlag] = React.useState<boolean>(false);
  33. const [drawerData, setDrawerData] = React.useState<any>({});
  34. React.useEffect(() => {
  35. if(open){
  36. const userInfo = LocalStorage.getUserInfo();
  37. const userId = (userInfo?.id ?? '').toString();
  38. init(userId);
  39. }
  40. }, [open]);
  41. const columns: TableColumnsType<Record> = [
  42. {
  43. title: '序号',
  44. dataIndex: 'index',
  45. width: 80,
  46. render: (_text, _record, index) => {
  47. return index + 1;
  48. }
  49. },
  50. {
  51. title: '知识名称',
  52. dataIndex: 'name',
  53. width: 300,
  54. render: (text, record) => {
  55. // const previewUrl = `/preview/${record.url}`; // 根据实际字段构造 URL
  56. return (
  57. <a
  58. href={record.url}
  59. target="_blank"
  60. rel="noopener noreferrer"
  61. onClick={(e) => {
  62. e.stopPropagation(); // 防止 Table 默认事件干扰
  63. }}
  64. >
  65. {text}
  66. </a>
  67. );
  68. }
  69. },
  70. {
  71. title: '状态',
  72. dataIndex: 'status',
  73. render: (text) => {
  74. if (text === '1') {
  75. return '待审核';
  76. } else if (text === '2') {
  77. return '审核中';
  78. } else if (text === '3') {
  79. return '审核通过';
  80. } else if (text === '4'||text === '5') {
  81. return '审核拒绝';
  82. }
  83. }
  84. },
  85. {
  86. title: '审核人',
  87. dataIndex: 'userName',
  88. render: (text) => {
  89. return `${text}`;
  90. }
  91. },
  92. {
  93. title: '审核意见',
  94. dataIndex: 'comment',
  95. render: (text) => {
  96. if (text) {
  97. return `${text}`;
  98. } else {
  99. return '--';
  100. }
  101. }
  102. },
  103. {
  104. title: '创建时间',
  105. dataIndex: 'createTime',
  106. width: 200,
  107. render: (text) => {
  108. if (text) {
  109. return dayjs(text).format('YYYY-MM-DD HH:mm:ss');
  110. } else {
  111. return '--';
  112. }
  113. }
  114. },
  115. // {
  116. // title: '操作',
  117. // dataIndex: 'operation',
  118. // width: 150,
  119. // fixed: 'right',
  120. // render: (_text, record) => {
  121. // return (
  122. // <>
  123. // <a
  124. // style={{ marginRight: 16 }}
  125. // onClick={() => {
  126. // setDrawerFlag(true)
  127. // setDrawerData(record)
  128. // }}
  129. // title='查看'
  130. // >
  131. // 查看
  132. // </a >
  133. // <a
  134. // style={{ marginRight: 16 }}
  135. // onClick={() => {
  136. // onClickModify(record.appId);
  137. // }}
  138. // title='审核'
  139. // >
  140. // <StepForwardOutlined />审核
  141. // </a >
  142. // </>
  143. // )
  144. // }
  145. // }
  146. ];
  147. const paginationConfig: TablePaginationConfig = {
  148. // 显示数据总量
  149. showTotal: (total: number) => {
  150. return `共 ${total} 条`;
  151. },
  152. // 展示分页条数切换
  153. showSizeChanger: true,
  154. // 指定每页显示条数
  155. pageSizeOptions: ['10', '20', '50', '100'],
  156. // 快速跳转至某页
  157. showQuickJumper: true,
  158. current: page.pageNum,
  159. pageSize: page.pageSize,
  160. total: page.total,
  161. onChange: async (page, pageSize) => {
  162. await onChangePagination(page, pageSize);
  163. },
  164. };
  165. return (
  166. <Drawer
  167. title="审核历史"
  168. width="80%"
  169. open={open}
  170. onClose={onClose}
  171. >
  172. <div className='knowledgeLibList'>
  173. <div className='knowledgeLibList-table'>
  174. <Table
  175. scroll={{ x: 'max-content' }}
  176. rowKey={(record) => record.createTime}
  177. loading={listLoading}
  178. columns={columns}
  179. dataSource={list}
  180. pagination={paginationConfig}
  181. />
  182. </div>
  183. </div>
  184. </Drawer>
  185. );
  186. }
  187. export default observer(AuditHistory);