模型发布状态

src/index.less

@@ -103,6 +103,10 @@ div[id^='__qiankun_microapp_wrapper_'] {
   }
 }
 
+.yy-pro-table-list-toolbar-container {
+  padding: 0 0 16px 0 !important;
+}
+
 .yy-table-cell{
   word-break: break-all; 
 }

src/view/Manage/Model/Component/ModelTable.jsx

 import React, { useState, useEffect, useRef } from "react";
-import { Space, Button, Tooltip, Modal } from 'antd';
+import { Space, Button, Tooltip, Modal, Select, Input } from 'antd';
 import { EditOutlined, ReconciliationOutlined, DeleteOutlined  } from '@ant-design/icons';
 import SmoothScroll from 'smooth-scroll';
 import ProTable from "@ant-design/pro-table";
@@ -10,9 +10,11 @@ import { AnchorId, AnchorTimestamp } from '../../../../util/constant';
 
 import './ModelTable.less';
 
+const { Option } = Select;
+
 const ModelTable = (props) => {
 
-  const { data, onChange, onItemAction, onSelect, catalogId } = props;
+  const { data, onChange, onItemAction, onSelect, catalogId, onSearchInputChange, onModelStateChange, loadingStates, currentModelState, modelStates, view, keyword } = props;
   const [ selectedRowKeys, setSelectedRowKeys ] = useState([]);
 
   const [modal, contextHolder] = Modal.useModal();
@@ -161,6 +163,49 @@ const ModelTable = (props) => {
     );
   }
 
+  const TitleComponent = (
+    <div
+      className='d-flex'
+      style={{
+        fontSize: 14,
+        color: 'rgba(0, 0, 0, 0.65)',
+        fontWeight: 'normal'
+      }}
+    >
+      {
+        view==='dir' && <Space className='mr-3'>
+          <span>模型状态:</span>
+          <Select 
+            style={{ width: 120 }} 
+            onChange={(value) => {
+              onModelStateChange && onModelStateChange(value);
+            }}
+            loading={loadingStates}
+            value={currentModelState}
+          >
+          {
+            (modelStates||[]).map(item => {
+              return (
+                <Option key={item.id} value={item.id}>{item.cnName||''}</Option>
+              );
+            })
+          }
+          </Select>
+        </Space>
+      }
+      <Space>
+        <span>模型搜索:</span>
+        <Input 
+          placeholder="请输入模型名称或者中文名称" 
+          allowClear 
+          value={keyword}
+          onChange={(e) => { onSearchInputChange && onSearchInputChange(e); }} 
+          style={{ width: 240, marginLeft: 'auto' }}
+        />
+      </Space>
+    </div>
+  );
+
   return (
     <div className='model-table'>
       <ProTable
@@ -181,6 +226,9 @@ const ModelTable = (props) => {
         }}
         search={false}
         tableAlertRender={false}
+        toolbar={{
+          title: TitleComponent,
+        }}
         sticky
       />
       { contextHolder }

src/view/Manage/Model/Component/ModelTable.less

@@ -4,4 +4,10 @@
     height: calc(100vh - @header-height - @pm-4 - @pm-3 - @pm-3 - 37px - 37px - 48px - @pm-3) !important;
     overflow: auto !important;
   }
+
+  .yy-pro-table {
+    .yy-card-body {
+      padding: 0 !important;
+    }
+  }
 }
\ No newline at end of file

src/view/Manage/Model/index.jsx

 import React from 'react';
-import { Button, Input, Space, Spin, Select } from 'antd';
+import { Button, Space, Spin } from 'antd';
 import copy from "copy-to-clipboard";  
 
 import ModelTree from './Component/ModelTree';
@@ -16,8 +16,6 @@ import { Action, CatalogId, ModelerId, Hints } from '../../../util/constant';
 
 import './index.less';
 
-const { Option } = Select;
-
 class Model extends React.Component {
 
   constructor() {
@@ -318,7 +316,7 @@ class Model extends React.Component {
     const { importModalVisible, catalogId, loadingTableData, selectModelerIds, keyword, filterTableData, selectModelerNames, importModalAddMode, exportErwinLoading, exportDDLModalVisible, templateCURDModalVisible, wordTemplateModalVisible, constraintDetailModalVisible, importWordModalVisible, loadingStates, modelStates, currentModelState, currentView } = this.state;
 
     const content = (
-      <ModelTable loading={loadingTableData} catalogId={catalogId} data={filterTableData} onChange={this.onTableChange} onSelect={this.onTableSelect} onItemAction={this.onTableItemAction} {...this.props} />
+      <ModelTable loading={loadingTableData} catalogId={catalogId} data={filterTableData} view={currentView} loadingStates={loadingStates} modelStates={modelStates} currentModelState={currentModelState} keyword={keyword} onChange={this.onTableChange} onSelect={this.onTableSelect} onItemAction={this.onTableItemAction} onModelStateChange={this.onModelStateChange} onSearchInputChange={this.onSearchInputChange} {...this.props} />
     );
 
     return (
@@ -331,40 +329,15 @@ class Model extends React.Component {
             className='d-flex p-3'
             style={{
               borderBottom: '1px solid #EFEFEF',
-              justifyContent: 'space-between'
+              justifyContent: 'space-between',
+              alignItems: 'center'
             }}
           >
-            <div>
-              {
-                currentView==='dir' && <Space className='mr-3'>
-                  <span>模型状态:</span>
-                  <Select 
-                    style={{ width: 120 }} 
-                    onChange={this.onModelStateChange}
-                    loading={loadingStates}
-                    value={currentModelState}
-                  >
-                  {
-                    (modelStates||[]).map(item => {
-                      return (
-                        <Option key={item.id} value={item.id}>{item.cnName||''}</Option>
-                      );
-                    })
-                  }
-                  </Select>
-                </Space>
-              }
-              <Space>
-                <span>模型搜索:</span>
-                <Input 
-                  placeholder="请输入模型名称或者中文名称" 
-                  allowClear 
-                  value={keyword}
-                  onChange={this.onSearchInputChange} 
-                  style={{ width: 240, marginLeft: 'auto' }}
-                />
-              </Space>
-            </div>
+            <span style={{
+              fontSize: 18,
+              fontWeight: 800,
+              color: '#767676'
+            }}>数据模型</span>
             <Space>
               <Button type="primary" onClick={this.onWordTemplateCURDClick}>Word模版配置</Button>
               <Button type="primary" onClick={this.onTemplateCURDClick}>数据表类型配置</Button>