模型对比任务结果过滤

src/model/datamodel.js

@@ -592,6 +592,30 @@ export function* getCompareJobResultDeployModels(payload) {
   return yield call(datamodelerService.getCompareJobResultDeployModels, payload)
 }
 
+export function* getCompareJobResultMetadataNotMatchCatalog(payload) {
+  return yield call(datamodelerService.getCompareJobResultMetadataNotMatchCatalog, payload)
+}
+
+export function* getCompareJobResultMetadataPartialMatchCatalog(payload) {
+  return yield call(datamodelerService.getCompareJobResultMetadataPartialMatchCatalog, payload)
+}
+
+export function* getCompareJobResultMetadataPerfectMatchCatalog(payload) {
+  return yield call(datamodelerService.getCompareJobResultMetadataPerfectMatchCatalog, payload)
+}
+
+export function* getCompareJobResultModelNotMatchCatalog(payload) {
+  return yield call(datamodelerService.getCompareJobResultModelNotMatchCatalog, payload)
+}
+
+export function* getCompareJobResultModelPartialMatchCatalog(payload) {
+  return yield call(datamodelerService.getCompareJobResultModelPartialMatchCatalog, payload)
+}
+
+export function* getCompareJobResultModelPerfectMatchCatalog(payload) {
+  return yield call(datamodelerService.getCompareJobResultModelPerfectMatchCatalog, payload)
+}
+
 export function* addDataTypeConfig(payload) {
   return yield call(datamodelerService.addDataTypeConfig, payload)
 }

src/service/datamodeler.js

@@ -537,6 +537,30 @@ export function getCompareJobResultDeployModels(payload) {
   return PostJSON("/datamodeler/easyDataModelModelCompareJobResult/deployModelByResultItemIds", payload)
 }
 
+export function getCompareJobResultMetadataNotMatchCatalog(payload) {
+  return GetJSON("/datamodeler/easyDataModelModelCompareJobResult/getMetadataNotMatchCatalog", payload)
+}
+
+export function getCompareJobResultMetadataPartialMatchCatalog(payload) {
+  return GetJSON("/datamodeler/easyDataModelModelCompareJobResult/getMetadataPartialMatchCatalog", payload)
+}
+
+export function getCompareJobResultMetadataPerfectMatchCatalog(payload) {
+  return GetJSON("/datamodeler/easyDataModelModelCompareJobResult/getMetadataPerfectMatchCatalog", payload)
+}
+
+export function getCompareJobResultModelNotMatchCatalog(payload) {
+  return GetJSON("/datamodeler/easyDataModelModelCompareJobResult/getModelNotMatchCatalog", payload)
+}
+
+export function getCompareJobResultModelPartialMatchCatalog(payload) {
+  return GetJSON("/datamodeler/easyDataModelModelCompareJobResult/getModelPartialMatchCatalog", payload)
+}
+
+export function getCompareJobResultModelPerfectMatchCatalog(payload) {
+  return GetJSON("/datamodeler/easyDataModelModelCompareJobResult/getModelPerfectMatchCatalog", payload)
+}
+
 /*type config*/
 export function addDataTypeConfig(payload) {
   return PostJSON("/datamodeler/easyDataModelerColumnDataType/addDataTypeConfig", payload)

src/view/Manage/ModelCompare/result-detail.jsx

 import React from 'react'
-import { Modal, Tabs, Button, Tooltip, Typography, Row, Col, Descriptions } from 'antd'
+import { Modal, Tabs, Button, Tooltip, Typography, Row, Col, Descriptions, TreeSelect, Space } from 'antd'
 
 import { dispatch } from '../../../model'
 import Table from '../../../util/Component/Table'
 import { defaultPage } from '../../../util/hooks/page'
-import { generateUUID, paginate, showMessage } from '../../../util'
+import { generateUUID, inputWidth, paginate, showMessage } from '../../../util'
 
 import './result-detail.less'
+import produce from 'immer'
 
 const FC = (props) => {
   const { visible, item, onCancel} = props
@@ -100,11 +101,18 @@ const PerfectMatch = ({ item }) => {
   const [args, setArgs] = React.useState({
     page: defaultPage.pageNum, 
     size: defaultPage.pageSize, 
+    metadataPath: undefined,
+    modelPath: undefined,
   })
   const [loading, setLoading] = React.useState(false)
   const [data, setData] = React.useState()
+  const [total, setTotal] = React.useState(0)
   const [selectedRows, setSelectedRows] = React.useState()
   const [rightRow, setRightRow] = React.useState()
+  const [loadingMetadataCatalog, setLoadingMetadataCatalog] = React.useState(false)
+  const [metadataCatalog, setMetadataCatalog] = React.useState()
+  const [loadingModelCatalog, setLoadingModelCatalog] = React.useState(false)
+  const [modelCatalog, setModelCatalog] = React.useState()
 
   const [modal, contextHolder] = Modal.useModal()
 
@@ -116,15 +124,16 @@ const PerfectMatch = ({ item }) => {
 
   React.useEffect(() => {
     if (item) {
-      getList()
+      getMetadataCatalog()
+      getModelCatalog()
     }
   }, [item])
 
-  const tableData = React.useMemo(() => {
-    let newTableData = [...data??[]]
- 
-    return paginate(newTableData, args.page, args.size)
-  }, [data, args])
+  React.useEffect(() => {
+    if (item) {
+      getList()
+    }
+  }, [args])
 
   const cols = [
     {
@@ -194,11 +203,16 @@ const PerfectMatch = ({ item }) => {
     dispatch({
       type: 'datamodel.getCompareJobResultPerfectMatchList',
       payload: {
-        resultId: item?.id
+        resultId: item?.id,
+        metadataPath: args.metadataPath,
+        modelPath: args.modelPath,
+        pageNo: args.page,
+        pageSize: args.size,
       },
       callback: data => {
         setLoading(false)
-        setData(data)
+        setData(data?.content)
+        setTotal(data?.totalElements)
       },
       error: () => {
         setLoading(false)
@@ -206,6 +220,40 @@ const PerfectMatch = ({ item }) => {
     })
   }
 
+  const getMetadataCatalog = () => {
+    setLoadingMetadataCatalog(true)
+    dispatch({
+      type: 'datamodel.getCompareJobResultMetadataPerfectMatchCatalog',
+      payload: {
+        resultId: item?.id
+      },
+      callback: data => {
+        setLoadingMetadataCatalog(false)
+        setMetadataCatalog(data)
+      },
+      error: () => {
+        setLoadingMetadataCatalog(false)
+      }
+    })
+  }
+
+  const getModelCatalog = () => {
+    setLoadingModelCatalog(true)
+    dispatch({
+      type: 'datamodel.getCompareJobResultModelPerfectMatchCatalog',
+      payload: {
+        resultId: item?.id
+      },
+      callback: data => {
+        setLoadingModelCatalog(false)
+        setModelCatalog(data)
+      },
+      error: () => {
+        setLoadingModelCatalog(false)
+      }
+    })
+  }
+
   const onDeployClick = () => {
     modal.confirm({
       title:'提示',
@@ -253,24 +301,40 @@ const PerfectMatch = ({ item }) => {
 
   return (
     <div>
-      <div>
+      <div className='flex mb-3' style={{ justifyContent: 'space-between', alignItems: 'center' }}>
         <Tooltip title={(selectedRows??[]).length===0?'请选择模型':''}>
           <Button onClick={onDeployClick} disabled={(selectedRows??[]).length===0}>确定上线</Button>
         </Tooltip>
+        <Space>
+          <Catalog 
+            placeholder='请选择元数据目录'
+            loading={loadingMetadataCatalog} data={metadataCatalog} value={args.metadataPath} 
+            onChange={(val) => {
+              setArgsByParams({ metadataPath: val, metadataPage: 1 })
+            }} 
+          />
+          <Catalog 
+            placeholder='请选择模型目录'
+            loading={loadingModelCatalog} data={modelCatalog} value={args.modelPath} 
+            onChange={(val) => {
+              setArgsByParams({ modelPath: val, modelPage: 1 })
+            }} 
+          />
+        </Space>
       </div>
-      <div className='pt-3'>
+      <div>
         <Table
           extraColWidth={32}
           loading={loading}
           columns={cols??[]}
-          dataSource={tableData??[]}
+          dataSource={data??[]}
           rowSelection={{
             selectedRowKeys: (selectedRows??[]).map(item => item.id),
             onChange: (selectedRowKeys, selectedRows) => {
               setSelectedRows(selectedRows)
             },
           }}
-          pageNum={args.page} pageSize={args.size} total={(data??[]).length}
+          pageNum={args.page} pageSize={args.size} total={total}
           onPaginate={(page, size) => {
             setArgsByParams({ page, size })
           }}
@@ -292,11 +356,18 @@ const PartialMatch = ({ item }) => {
   const [args, setArgs] = React.useState({
     page: defaultPage.pageNum, 
     size: defaultPage.pageSize, 
+    metadataPath: undefined,
+    modelPath: undefined,
   })
   const [loading, setLoading] = React.useState(false)
   const [data, setData] = React.useState()
+  const [total, setTotal] = React.useState(0)
   const [selectedRows, setSelectedRows] = React.useState()
   const [rightRow, setRightRow] = React.useState()
+  const [loadingMetadataCatalog, setLoadingMetadataCatalog] = React.useState(false)
+  const [metadataCatalog, setMetadataCatalog] = React.useState()
+  const [loadingModelCatalog, setLoadingModelCatalog] = React.useState(false)
+  const [modelCatalog, setModelCatalog] = React.useState()
 
   const [modal, contextHolder] = Modal.useModal()
 
@@ -308,15 +379,16 @@ const PartialMatch = ({ item }) => {
 
   React.useEffect(() => {
     if (item) {
-      getList()
+      getMetadataCatalog()
+      getModelCatalog()
     }
   }, [item])
 
-  const tableData = React.useMemo(() => {
-    let newTableData = [...data??[]]
- 
-    return paginate(newTableData, args.page, args.size)
-  }, [data, args])
+  React.useEffect(() => {
+    if (item) {
+      getList()
+    }
+  }, [args])
 
   const cols = [
     {
@@ -407,11 +479,16 @@ const PartialMatch = ({ item }) => {
     dispatch({
       type: 'datamodel.getCompareJobResultPartialMatchList',
       payload: {
-        resultId: item?.id
+        resultId: item?.id,
+        metadataPath: args.metadataPath,
+        modelPath: args.modelPath,
+        pageNo: args.page,
+        pageSize: args.size,
       },
       callback: data => {
         setLoading(false)
-        setData(data)
+        setData(data?.content)
+        setTotal(data?.totalElements)
       },
       error: () => {
         setLoading(false)
@@ -419,6 +496,40 @@ const PartialMatch = ({ item }) => {
     })
   }
 
+  const getMetadataCatalog = () => {
+    setLoadingMetadataCatalog(true)
+    dispatch({
+      type: 'datamodel.getCompareJobResultMetadataPartialMatchCatalog',
+      payload: {
+        resultId: item?.id
+      },
+      callback: data => {
+        setLoadingMetadataCatalog(false)
+        setMetadataCatalog(data)
+      },
+      error: () => {
+        setLoadingMetadataCatalog(false)
+      }
+    })
+  }
+
+  const getModelCatalog = () => {
+    setLoadingModelCatalog(true)
+    dispatch({
+      type: 'datamodel.getCompareJobResultModelPartialMatchCatalog',
+      payload: {
+        resultId: item?.id
+      },
+      callback: data => {
+        setLoadingModelCatalog(false)
+        setModelCatalog(data)
+      },
+      error: () => {
+        setLoadingModelCatalog(false)
+      }
+    })
+  }
+
   const onDeployClick = () => {
     modal.confirm({
       title:'提示',
@@ -466,24 +577,40 @@ const PartialMatch = ({ item }) => {
 
   return (
     <div>
-      <div>
+      <div className='flex mb-3' style={{ justifyContent: 'space-between', alignItems: 'center' }}>
         <Tooltip title={(selectedRows??[]).length===0?'请选择模型':''}>
           <Button onClick={onDeployClick} disabled={(selectedRows??[]).length===0}>确定上线</Button>
         </Tooltip>
+        <Space>
+          <Catalog 
+            placeholder='请选择元数据目录'
+            loading={loadingMetadataCatalog} data={metadataCatalog} value={args.metadataPath} 
+            onChange={(val) => {
+              setArgsByParams({ metadataPath: val, metadataPage: 1 })
+            }} 
+          />
+          <Catalog 
+            placeholder='请选择模型目录'
+            loading={loadingModelCatalog} data={modelCatalog} value={args.modelPath} 
+            onChange={(val) => {
+              setArgsByParams({ modelPath: val, modelPage: 1 })
+            }} 
+          />
+        </Space>
       </div>
-      <div className='pt-3'>
+      <div>
         <Table
           extraColWidth={32}
           loading={loading}
           columns={cols??[]}
-          dataSource={tableData??[]}
+          dataSource={data??[]}
           rowSelection={{
             selectedRowKeys: (selectedRows??[]).map(item => item.id),
             onChange: (selectedRowKeys, selectedRows) => {
               setSelectedRows(selectedRows)
             },
           }}
-          pageNum={args.page} pageSize={args.size} total={(data??[]).length}
+          pageNum={args.page} pageSize={args.size} total={total}
           onPaginate={(page, size) => {
             setArgsByParams({ page, size })
           }}
@@ -506,21 +633,36 @@ const NotMatch = ({ item }) => {
   const [args, setArgs] = React.useState({
     metadataPage: defaultPage.pageNum, 
     metadataSize: defaultPage.pageSize,
+    metadataPath: undefined,
     modelPage: defaultPage.pageNum, 
     modelSize: defaultPage.pageSize, 
+    modelPath: undefined,
   })
 
   const [loadingMetadata, setLoadingMetadata] = React.useState(false)
   const [metadatas, setMetadatas] = React.useState()
+  const [metadataTotal, setMetadataTotal] = React.useState(0)
   const [loadingModel, setLoadingModel] = React.useState(false)
   const [models, setModels] = React.useState()
+  const [modelTotal, setModelTotal] = React.useState(0)
+  const [loadingMetadataCatalog, setLoadingMetadataCatalog] = React.useState(false)
+  const [metadataCatalog, setMetadataCatalog] = React.useState()
+  const [loadingModelCatalog, setLoadingModelCatalog] = React.useState(false)
+  const [modelCatalog, setModelCatalog] = React.useState()
+
+  React.useEffect(() => {
+    if (item) {
+      getMetadataCatalog()
+      getModelCatalog()
+    }
+  }, [item])
 
   React.useEffect(() => {
     if (item) {
       getMetadatas() 
       getModels() 
     }
-  }, [item])
+  }, [args])
 
   const setArgsByParams = React.useCallback((params) => {
     setArgs((prev) => {
@@ -528,13 +670,6 @@ const NotMatch = ({ item }) => {
     })
   }, [])
 
-  const [metadataTableData, modelTableData] = React.useMemo(() => {
-    let newMetadataTableData = [...metadatas??[]]
-    let newModelTableData = [...models??[]]
-
-    return [paginate(newMetadataTableData, args.metadataPage, args.metadataSize), paginate(newModelTableData, args.modelPage, args.modelSize)]
-  }, [metadatas, models, args])
-
   const metadataCols = [
     {
       title: '序号',
@@ -608,11 +743,15 @@ const NotMatch = ({ item }) => {
     dispatch({
       type: 'datamodel.getCompareJobResultNotMatchMetadataList',
       payload: {
-        resultId: item?.id
+        resultId: item?.id,
+        metadataPath: args.metadataPath,
+        pageNo: args.metadataPage,
+        pageSize: args.metadataSize,
       },
       callback: data => {
         setLoadingMetadata(false)
-        setMetadatas(data)
+        setMetadatas(data?.content)
+        setMetadataTotal(data?.totalElements)
       },
       error: () => {
         setLoadingMetadata(false)
@@ -625,11 +764,15 @@ const NotMatch = ({ item }) => {
     dispatch({
       type: 'datamodel.getCompareJobResultNotMatchModelList',
       payload: {
-        resultId: item?.id
+        resultId: item?.id,
+        modelPath: args.modelPath,
+        pageNo: args.modelPage,
+        pageSize: args.modelSize,
       },
       callback: data => {
         setLoadingModel(false)
-        setModels(data)
+        setModels(data?.content)
+        setModelTotal(data?.totalElements)
       },
       error: () => {
         setLoadingModel(false)
@@ -637,16 +780,59 @@ const NotMatch = ({ item }) => {
     })
   }
 
+  const getMetadataCatalog = () => {
+    setLoadingMetadataCatalog(true)
+    dispatch({
+      type: 'datamodel.getCompareJobResultMetadataNotMatchCatalog',
+      payload: {
+        resultId: item?.id
+      },
+      callback: data => {
+        setLoadingMetadataCatalog(false)
+        setMetadataCatalog(data)
+      },
+      error: () => {
+        setLoadingMetadataCatalog(false)
+      }
+    })
+  }
+
+  const getModelCatalog = () => {
+    setLoadingModelCatalog(true)
+    dispatch({
+      type: 'datamodel.getCompareJobResultModelNotMatchCatalog',
+      payload: {
+        resultId: item?.id
+      },
+      callback: data => {
+        setLoadingModelCatalog(false)
+        setModelCatalog(data)
+      },
+      error: () => {
+        setLoadingModelCatalog(false)
+      }
+    })
+  }
+
   return (
     <div style={{ overflow: 'hidden' }}>
       <Row gutter={15}>
         <Col span={12}>
-          <h4>未匹配元数据列表</h4>
+          <div className='flex mb-3' style={{ justifyContent: 'space-between', alignItems: 'center' }}>
+            <h4 style={{ marginBottom: 0 }}>未匹配元数据列表</h4>
+            <Catalog 
+              placeholder='请选择元数据目录'
+              loading={loadingMetadataCatalog} data={metadataCatalog} value={args.metadataPath} 
+              onChange={(val) => {
+                setArgsByParams({ metadataPath: val, metadataPage: 1 })
+              }} 
+            />
+          </div>
           <Table
             loading={loadingMetadata}
             columns={metadataCols??[]}
-            dataSource={metadataTableData??[]}
-            pageNum={args.metadataPage} pageSize={args.metadataSize} total={(metadatas??[]).length}
+            dataSource={metadatas??[]}
+            pageNum={args.metadataPage} pageSize={args.metadataSize} total={metadataTotal}
             onPaginate={(page, size) => {
               setArgsByParams({ metadataPage: page, metadataSize: size })
             }}
@@ -656,12 +842,21 @@ const NotMatch = ({ item }) => {
           />
         </Col>
         <Col span={12}>
-          <h4>未匹配模型列表</h4>
+          <div className='flex mb-3' style={{ justifyContent: 'space-between', alignItems: 'center' }}>
+            <h4 style={{ marginBottom: 0 }}>未匹配模型列表</h4>
+            <Catalog 
+              placeholder='请选择模型目录'
+              loading={loadingModelCatalog} data={modelCatalog} value={args.modelPath} 
+              onChange={(val) => {
+                setArgsByParams({ modelPath: val, modelPage: 1 })
+              }} 
+            />
+          </div>
           <Table
             loading={loadingModel}
             columns={modelCols??[]}
-            dataSource={modelTableData??[]}
-            pageNum={args.modelPage} pageSize={args.modelSize} total={(models??[]).length}
+            dataSource={models??[]}
+            pageNum={args.modelPage} pageSize={args.modelSize} total={modelTotal}
             onPaginate={(page, size) => {
               setArgsByParams({ modelPage: page, modelSize: size })
             }}
@@ -673,4 +868,57 @@ const NotMatch = ({ item }) => {
       </Row>
     </div>
   )
+}
+
+const Catalog = ({ value, onChange, data, loading, placeholder }) => {
+  const [expandedKeys, setExpandedKeys] = React.useState()
+
+  React.useEffect(() => {
+    if ((data?.children??[]).length>0) {
+      setExpandedKeys([data.children.path])
+    }
+  }, [data])
+
+  const treeData = React.useMemo(() => {
+    if (data && data.children) {
+      const newTreeData = produce(data.children, draft => {
+        const setNode = (g) => {
+          g.key = g.path
+          g.title = g.name
+          g.value = g.path
+          g.children?.forEach((child) => {
+            setNode(child)
+          })
+        }
+
+        draft.forEach((child) => {
+          setNode(child)
+        })
+      })
+
+      return newTreeData
+    }
+
+    return undefined
+  }, [data])
+
+  return (
+    <TreeSelect
+      showSearch allowClear
+      treeNodeFilterProp='title'
+      loading={loading}
+      value={value}
+      dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
+      treeData={treeData}
+      treeExpandedKeys={expandedKeys}
+      onTreeExpand={(val) => {
+        setExpandedKeys(val)
+      }}
+      onChange={(val) => {
+        onChange?.(val)
+      }}
+      style={{ width: inputWidth }}
+      placeholder={placeholder??'请选择目录'}
+    />
+  )
 }
\ No newline at end of file