规范历史详情

src/view/Manage/ModelConfig/Component/rule-catalog-history-detail.jsx

+import React from "react"
+import { Button, Spin, Modal, Form, Input, Select, Tooltip, Typography, Descriptions, } from "antd"
+
+import { dispatch } from '../../../../model'
+import Table from '../../../../util/Component/Table'
+
+const FC = (props) => {
+  const { visible, item, onCancel } = props
+  const basicRef = React.useRef()
+
+  const close = () => {
+    onCancel?.()
+  }
+
+  return (
+    <Modal
+      visible={visible}
+      footer={null}
+      width='80%'
+      bodyStyle={{ padding: '15px', overflowX: 'auto', maxHeight: '80vh' }}
+      title='历史规范详情'
+      centered destroyOnClose
+      onCancel={() => { close() }}
+    >
+      <Basic item={item} />
+      <RuleList item={item} />
+    </Modal>
+  )
+}
+
+export default FC
+
+export const Basic = React.forwardRef(function ({ item }, ref) {
+  return (
+    <Descriptions column={2}>
+      <Descriptions.Item label='规范名称'>{item?.name}</Descriptions.Item>
+      <Descriptions.Item label='描述'>{item?.remark}</Descriptions.Item>
+      <Descriptions.Item label='状态'>{item?.statusName}</Descriptions.Item>
+      <Descriptions.Item label='维护说明'>{item?.maintenanceContent}</Descriptions.Item>
+    </Descriptions>
+  )
+})
+
+const RuleList = ({ item }) => {
+  const cols = React.useMemo(() => {
+    return ([
+      {
+        title: '序号',
+        dataIndex: 'index',
+        width: 60,
+        render: (_, __, index) => `${index+1}`
+      },
+      {
+        title: '规则名称',
+        dataIndex: 'ruleTemplateName',
+        render: (text, record) => (
+          <Tooltip title={text}>
+            <Typography.Text ellipsis={true}>
+              { text }
+            </Typography.Text>
+          </Tooltip>
+        )
+      },
+      {
+        title: '规则描述',
+        dataIndex: 'ruleTemplateRemark',
+        render: (text, record) => (
+          <Tooltip title={text}>
+            <Typography.Text ellipsis={true}>
+              { text }
+            </Typography.Text>
+          </Tooltip>
+        )
+      },
+      {
+        title: '规则状态',
+        dataIndex: 'statusName',
+        render: (text, record) => (
+          <Tooltip title={text}>
+            <Typography.Text ellipsis={true}>
+              { text }
+            </Typography.Text>
+          </Tooltip>
+        )
+      },
+      {
+        title: '规则类型',
+        dataIndex: 'alertTypeName',
+        render: (text, record) => (
+          <Tooltip title={text}>
+            <Typography.Text ellipsis={true}>
+              { text }
+            </Typography.Text>
+          </Tooltip>
+        )
+      },
+      {
+        title: '规则提示',
+        dataIndex: 'alertContent',
+        render: (text, record) => (
+          <Tooltip title={text}>
+            <Typography.Text ellipsis={true}>
+              { text }
+            </Typography.Text>
+          </Tooltip>
+        )
+      },
+    ])
+  }, [item])
+
+  return (
+    <div className='pt-3'>
+      <Table
+        columns={cols??[]}
+        dataSource={item?.ruleList??[]}
+        pagination={false}
+      />
+    </div>
+  )
+}
\ No newline at end of file

src/view/Manage/ModelConfig/Component/rule-catalog-history.jsx

@@ -2,16 +2,15 @@ import React from 'react';
 import { Timeline, Spin } from 'antd';
 
 import { dispatch } from '../../../../model'
-import Update from './update-rule-catalog'
+import HistoryDetail from './rule-catalog-history-detail'
 
 const FC = ({ item }) => {
   const [versions, setVersions] = React.useState()
   const [loading, setLoading] = React.useState(false)
-  const [updateParams, setUpdateParams] = React.useState({
+  const [historyDetailParams, setHistoryDetailParams] = React.useState({
     visible: false,
-    type: undefined,
     item: undefined,
-  });
+  })
 
   React.useEffect(() => {
     if (item?.id) {
@@ -48,9 +47,8 @@ const FC = ({ item }) => {
               <div>
                 <a
                   onClick={() => {
-                    setUpdateParams({
+                    setHistoryDetailParams({
                       visible: true,
-                      type: 'detail',
                       item: version
                     })
                   }}
@@ -66,12 +64,11 @@ const FC = ({ item }) => {
         }
         </Timeline>
       </Spin>
-      <Update 
-        {...updateParams}
+      <HistoryDetail 
+        {...historyDetailParams}
         onCancel={() => {
-          setUpdateParams({
+          setHistoryDetailParams({
             visible: false,
-            type: undefined,
             item: undefined,
           })
         }}

src/view/Manage/ModelConfig/Component/update-rule-catalog.jsx

@@ -151,7 +151,7 @@ export const Basic = React.forwardRef(function ({ type, item }, ref) {
         style={{ marginBottom }}
       >
         {
-          type === 'detail' ? <span>{item?.name}</span> : <Input placeholder='请输入描述' allowClear />
+          type === 'detail' ? <span>{item?.remark}</span> : <Input placeholder='请输入描述' allowClear />
         }
       </Form.Item>
       <Form.Item name='statusId' label='状态'
@@ -168,7 +168,7 @@ export const Basic = React.forwardRef(function ({ type, item }, ref) {
         style={{ marginBottom }}
       >
         {
-          type === 'detail' ? <span>{item?.name}</span> : <Input placeholder='请输入维护说明' allowClear />
+          type === 'detail' ? <span>{item?.maintenanceContent}</span> : <Input placeholder='请输入维护说明' allowClear />
         }
       </Form.Item>
     </Form>