Commit ebc0a272 by zhaochengxiang

全文检索模型详情

parent 1659edc4
...@@ -88,6 +88,7 @@ export class App extends React.Component { ...@@ -88,6 +88,7 @@ export class App extends React.Component {
modelerId={id} modelerId={id}
action='detail' action='detail'
terms={terms} terms={terms}
reference='full-search'
/> />
</AppContext.Provider> </AppContext.Provider>
); );
......
...@@ -88,7 +88,7 @@ const callback = resp => { ...@@ -88,7 +88,7 @@ const callback = resp => {
if (resp.status === 401) { if (resp.status === 401) {
showMessage('warn', 'session过期,请重新登录!'); showMessage('warn', 'session过期,请重新登录!');
window.location.href = isSzseEnv?"/api/auth/login":"/center-home/view/login" window.location.href = isSzseEnv?`/api/auth/login?redirectURL=${encodeURIComponent(window.location.href)}`:"/center-home/view/login"
return null; return null;
} }
......
...@@ -2,6 +2,7 @@ import React, { useState, useEffect, useRef, useImperativeHandle } from 'react'; ...@@ -2,6 +2,7 @@ import React, { useState, useEffect, useRef, useImperativeHandle } from 'react';
import { Spin, Tabs, Anchor, Affix, Button } from 'antd'; import { Spin, Tabs, Anchor, Affix, Button } from 'antd';
import LocalStorage from 'local-storage'; import LocalStorage from 'local-storage';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import classnames from 'classnames';
import ImportActionHeader from './ImportActionHeader'; import ImportActionHeader from './ImportActionHeader';
import { ImportActionTable } from './ImportActionTable'; import { ImportActionTable } from './ImportActionTable';
...@@ -18,7 +19,7 @@ import './ImportAction.less' ...@@ -18,7 +19,7 @@ import './ImportAction.less'
export const importActionSubject = new Subject() export const importActionSubject = new Subject()
const ImportAction = React.forwardRef((props, ref) => { const ImportAction = React.forwardRef((props, ref) => {
const { action, hints, onChange, form, modelerId, terms, ddl, roughModelerData, versionId, permitCheckOut, catalogId, branchId, approvalModelId, approvalId } = props; const { action, hints, onChange, form, modelerId, terms, ddl, roughModelerData, versionId, permitCheckOut, catalogId, branchId, approvalModelId, approvalId, reference = '' } = props;
const [ constraints, setConstraints ] = useState([]); const [ constraints, setConstraints ] = useState([]);
const [ constraint, setConstraint ] = useState({}); const [ constraint, setConstraint ] = useState({});
...@@ -623,29 +624,31 @@ const ImportAction = React.forwardRef((props, ref) => { ...@@ -623,29 +624,31 @@ const ImportAction = React.forwardRef((props, ref) => {
{ {
(action==='detail' && ((modelerData||{}).optionList||[]).findIndex(item => item.enabled && item.name==='查看') === -1) ? <div style={{ padding: '10px 20px', height: 60 }}> (action==='detail' && ((modelerData||{}).optionList||[]).findIndex(item => item.enabled && item.name==='查看') === -1) ? <div style={{ padding: '10px 20px', height: 60 }}>
{loading?'':'暂无权限'} {loading?'':'暂无权限'}
</div> : <div className='import-action'> </div> : <div className={classnames('import-action', reference==='full-search'?'import-action-fullsearch':'')}>
<Tabs activeKey={activeValue} centered onChange={(val) => { {
setActiveValue(val); reference !== 'full-search' && <Tabs activeKey={activeValue} centered onChange={(val) => {
var targetElement = container?.querySelector(`.${val}`); // 找到目标元素 setActiveValue(val);
if (targetElement) { var targetElement = container?.querySelector(`.${val}`); // 找到目标元素
importActionSubject.next({ type: 'expand', key: val, action }) if (targetElement) {
setTimeout(() => { importActionSubject.next({ type: 'expand', key: val, action })
animating.current = true; setTimeout(() => {
targetElement.scrollIntoView(); animating.current = true;
}, 100) targetElement.scrollIntoView();
} }, 100)
}}> }
<Tabs.TabPane tab='基本信息' key="model-import-action-basic" /> }}>
<Tabs.TabPane tab='技术信息' key="model-import-action-technical" /> <Tabs.TabPane tab='基本信息' key="model-import-action-basic" />
<Tabs.TabPane tab='数据表结构' key="model-import-action-table" /> <Tabs.TabPane tab='技术信息' key="model-import-action-technical" />
<Tabs.TabPane tab='数据表索引' key="model-import-action-index" /> <Tabs.TabPane tab='数据表结构' key="model-import-action-table" />
<Tabs.TabPane tab='管理信息' key="model-import-action-manage" /> <Tabs.TabPane tab='数据表索引' key="model-import-action-index" />
<Tabs.TabPane tab='关联对象' key="model-import-action-relation" /> <Tabs.TabPane tab='管理信息' key="model-import-action-manage" />
{ <Tabs.TabPane tab='关联对象' key="model-import-action-relation" />
modelerData?.id && <Tabs.TabPane tab='模型评论' key="model-import-action-comment" /> {
} modelerData?.id && <Tabs.TabPane tab='模型评论' key="model-import-action-comment" />
</Tabs> }
<div ref={setContainer} style={{ height: action==='edit-inherite-modal'?'60vh':'calc(100vh - 44px - 64px - 66px)', overflow: 'auto' }}> </Tabs>
}
<div ref={setContainer} style={{ height: action==='edit-inherite-modal'?'60vh':(reference!=='full-search'?'calc(100vh - 44px - 64px - 66px)': '100%'), overflow: 'auto' }}>
<ImportActionHeader <ImportActionHeader
form={form} form={form}
editable={action!=='detail'&&action!=='flow'&&action!=='detail-version'&&action!=='edit-inherited'} editable={action!=='detail'&&action!=='flow'&&action!=='detail-version'&&action!=='edit-inherited'}
...@@ -659,6 +662,7 @@ const ImportAction = React.forwardRef((props, ref) => { ...@@ -659,6 +662,7 @@ const ImportAction = React.forwardRef((props, ref) => {
terms={terms} terms={terms}
supportedPartitionTypes={supportedPartitionTypes} supportedPartitionTypes={supportedPartitionTypes}
action={action} action={action}
reference={reference}
/> />
<ImportActionTable <ImportActionTable
modelerData={modelerData||{}} modelerData={modelerData||{}}
...@@ -672,31 +676,35 @@ const ImportAction = React.forwardRef((props, ref) => { ...@@ -672,31 +676,35 @@ const ImportAction = React.forwardRef((props, ref) => {
originAction={getQueryParam(Action, props?.location?.search)} originAction={getQueryParam(Action, props?.location?.search)}
terms={terms} terms={terms}
/> />
<ImportActionIndex
modelerData={modelerData||{}}
constraint={constraint}
template={template}
types={supportedIndextypes}
validateReports={validateReports}
onChange={onIndexChange}
editable={action!=='detail'&&action!=='flow'&&action!=='detail-version'&&action!=='edit-inherited'}
terms={terms}
action={action}
/>
<ImportActionManage
form={form}
modelerData={modelerData||{}}
editable={action!=='detail'&&action!=='flow'&&action!=='detail-version'&&action!=='edit-inherited'}
action={action}
/>
<ImportActionRelation
modelerData={modelerData} action={action}
/>
{ {
modelerData?.id && <ImportActionComment reference !== 'full-search' && <React.Fragment>
modelerData={modelerData} <ImportActionIndex
action={action} modelerData={modelerData||{}}
/> constraint={constraint}
template={template}
types={supportedIndextypes}
validateReports={validateReports}
onChange={onIndexChange}
editable={action!=='detail'&&action!=='flow'&&action!=='detail-version'&&action!=='edit-inherited'}
terms={terms}
action={action}
/>
<ImportActionManage
form={form}
modelerData={modelerData||{}}
editable={action!=='detail'&&action!=='flow'&&action!=='detail-version'&&action!=='edit-inherited'}
action={action}
/>
<ImportActionRelation
modelerData={modelerData} action={action}
/>
{
modelerData?.id && <ImportActionComment
modelerData={modelerData}
action={action}
/>
}
</React.Fragment>
} }
</div> </div>
</div> </div>
......
...@@ -8,4 +8,44 @@ ...@@ -8,4 +8,44 @@
width: 80%; width: 80%;
justify-content: space-between; justify-content: space-between;
} }
.model-import-action-basic,
.model-import-action-technical,
.model-import-action-table,
.model-import-action-index,
.model-import-action-manage,
.model-import-action-relation,
.model-import-action-comment {
background-color: #FFF;
padding: 20px;
}
.model-import-action-technical,
.model-import-action-table,
.model-import-action-index,
.model-import-action-manage,
.model-import-action-relation,
.model-import-action-comment {
margin-top: 7px;
}
}
.import-action-fullsearch {
.model-import-action-basic,
.model-import-action-technical,
.model-import-action-table,
.model-import-action-index,
.model-import-action-manage,
.model-import-action-relation,
.model-import-action-comment {
padding: 0 20px;
}
.model-import-action-technical,
.model-import-action-table,
.model-import-action-index,
.model-import-action-manage,
.model-import-action-relation,
.model-import-action-comment {
margin-top: 0px;
}
} }
\ No newline at end of file
...@@ -50,7 +50,7 @@ const dataTypeRemark = '描述ETL框架中目标表的数据类型'; ...@@ -50,7 +50,7 @@ const dataTypeRemark = '描述ETL框架中目标表的数据类型';
const bindingLoadRemark = '描述ETL框架绑定加载列表,如chain、daily、current等'; const bindingLoadRemark = '描述ETL框架绑定加载列表,如chain、daily、current等';
const ImportActionHeader = (props) => { const ImportActionHeader = (props) => {
const { editable, form, modelerData, constraints, templates, onConstraintChange, onTemplateChange, validateReports, onChange, terms, supportedPartitionTypes, action } = props; const { editable, form, modelerData, constraints, templates, onConstraintChange, onTemplateChange, validateReports, onChange, terms, supportedPartitionTypes, action, reference } = props;
const [ options, setOptions ] = useState([]); const [ options, setOptions ] = useState([]);
...@@ -311,13 +311,28 @@ const ImportActionHeader = (props) => { ...@@ -311,13 +311,28 @@ const ImportActionHeader = (props) => {
</Col> </Col>
<Col xs={24} sm={24} lg={12} xl={8}> <Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item <Form.Item
label={<ItemTitle name='remark' cnName='数据内容' validateReports={validateReports} />} label="规范"
name="remark" name="easyDataModelerModelingConstraint"
rules={[{ required: true, message: '请输入数据内容!' }]} rules={[{ required: true, message: '请选择规范!' }]}
style={{ marginBottom }} style={{ marginBottom }}
> >
{ {
editable ? <TextArea rows={1} placeholder='描述数据表包含的业务数据,包括数据内容业务描述、表的适用范围、数据粒度、数据统计口径、数据来源等。对于原始数据表,可以说明加载的源接口信息。' /> : <span className='word-wrap'>{highlightSearchContentByTerms(modelerData?.remark, terms)}</span> editable ? <ConstraintSelect
constraints={constraints}
onChange={onConstraintChange}
onDetail={() => {
setRuleParams({ visible: true })
}}
/> : <div className='flex' style={{ alignItems: 'flex-start' }}>
<div className='word-wrap mr-2'>
{modelerData?.easyDataModelerModelingConstraint?.cnName}
</div>
<div style={{ flex: 1, minWidth: 30 }}>
<a onClick={() => {
setRuleParams({ visible: true })
}}>查看</a>
</div>
</div>
} }
</Form.Item> </Form.Item>
</Col> </Col>
...@@ -345,28 +360,13 @@ const ImportActionHeader = (props) => { ...@@ -345,28 +360,13 @@ const ImportActionHeader = (props) => {
</Col> </Col>
<Col xs={24} sm={24} lg={12} xl={8}> <Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item <Form.Item
label="规范" label={<ItemTitle name='remark' cnName='数据内容' validateReports={validateReports} />}
name="easyDataModelerModelingConstraint" name="remark"
rules={[{ required: true, message: '请选择规范!' }]} rules={[{ required: true, message: '请输入数据内容!' }]}
style={{ marginBottom }} style={{ marginBottom }}
> >
{ {
editable ? <ConstraintSelect editable ? <TextArea rows={1} placeholder='描述数据表包含的业务数据,包括数据内容业务描述、表的适用范围、数据粒度、数据统计口径、数据来源等。对于原始数据表,可以说明加载的源接口信息。' /> : <span className='word-wrap'>{highlightSearchContentByTerms(modelerData?.remark, terms)}</span>
constraints={constraints}
onChange={onConstraintChange}
onDetail={() => {
setRuleParams({ visible: true })
}}
/> : <div className='flex' style={{ alignItems: 'flex-start' }}>
<div className='word-wrap mr-2'>
{modelerData?.easyDataModelerModelingConstraint?.cnName}
</div>
<div style={{ flex: 1, minWidth: 30 }}>
<a onClick={() => {
setRuleParams({ visible: true })
}}>查看</a>
</div>
</div>
} }
</Form.Item> </Form.Item>
</Col> </Col>
...@@ -405,120 +405,122 @@ const ImportActionHeader = (props) => { ...@@ -405,120 +405,122 @@ const ImportActionHeader = (props) => {
</Row> </Row>
</Form> </Form>
</div> </div>
<div className='model-import-action-technical'> {
<Space> reference !== 'full-search' && <div className='model-import-action-technical'>
<h3 style={{ width: 120, marginBottom: 0 }}>技术信息</h3> <Space>
<h3 style={{ width: 120, marginBottom: 0 }}>技术信息</h3>
{
isCollapse ? <Button type='primary' size='small' onClick={() => {
setCollapse(!isCollapse)
}}>展开<DownOutlined /></Button> : <Button type='primary' size='small' onClick={() => {
setCollapse(!isCollapse)
}}>收起<UpOutlined /></Button>
}
</Space>
{ {
isCollapse ? <Button type='primary' size='small' onClick={() => { !isCollapse && <Form
setCollapse(!isCollapse) className='mt-3'
}}>展开<DownOutlined /></Button> : <Button type='primary' size='small' onClick={() => { form={form}
setCollapse(!isCollapse) {...formItemLayout}
}}>收起<UpOutlined /></Button> onValuesChange={onValuesChange}
} >
</Space> <Row gutter={10}>
{ <Col xs={24} sm={24} lg={12} xl={8}>
!isCollapse && <Form <Form.Item
className='mt-3' label="分布键"
form={form} name="easyDataModelerDistributionKey"
{...formItemLayout} style={{ marginBottom }}
onValuesChange={onValuesChange} >
>
<Row gutter={10}>
<Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item
label="分布键"
name="easyDataModelerDistributionKey"
style={{ marginBottom }}
>
{
editable ? <AttributesSelect modelerData={modelerData} /> : <span className='word-wrap'>{highlightSearchContentByTerms(distributionDescription, terms)}</span>
}
</Form.Item>
</Col>
<Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item
label="分区键"
name="partition"
style={{ marginBottom }}
>
{
editable ? <PartitionSelect modelerData={modelerData} partitionTypes={supportedPartitionTypes} /> : <span className='word-wrap'>{highlightSearchContentByTerms(partitionsDescription, terms)}</span>
}
</Form.Item>
</Col>
<Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item
label="类主键"
name="easyDataModelerSemiPrimaryKey"
style={{ marginBottom }}
>
{
editable ? <AttributesSelect modelerData={modelerData} mode='tags' /> : <span className='word-wrap'>{highlightSearchContentByTerms(semiPrimaryDescription, terms)}</span>
}
</Form.Item>
</Col>
<Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item
label="数据情况"
name="dataCircumstances"
style={{ marginBottom }}
>
{
editable ? <Input placeholder='描述数据表中数据的更新频率、每日增量情况、数据量级和历史数据' /> : <span className='word-wrap'>{highlightSearchContentByTerms(modelerData?.dataCircumstances, terms)}</span>
}
</Form.Item>
</Col>
<Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item
label="更新时间"
name="dataUpdatingTiming"
style={{ marginBottom }}
>
{
editable ? <UpdateSelect placeholder='描述数据表的更新时间点'/> : <span className='word-wrap'>{highlightSearchContentByTerms(modelerData?.dataUpdatingTiming, terms)}</span>
}
</Form.Item>
</Col>
<Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item
label="数据类型"
name="dataType"
tooltip={dataTypeRemark}
style={{ marginBottom }}
>
{
editable ? <Select allowClear placeholder='请选择数据类型'>
{ {
dataTypeList?.map((item, index) => <Option key={index} value={item}> editable ? <AttributesSelect modelerData={modelerData} /> : <span className='word-wrap'>{highlightSearchContentByTerms(distributionDescription, terms)}</span>
{item}
</Option>)
} }
</Select> : <span className='word-wrap'>{highlightSearchContentByTerms(modelerData?.dataType, terms)}</span> </Form.Item>
} </Col>
</Form.Item> <Col xs={24} sm={24} lg={12} xl={8}>
</Col> <Form.Item
<Col xs={24} sm={24} lg={12} xl={8}> label="分区键"
<Form.Item name="partition"
label="绑定加载范围" style={{ marginBottom }}
name="bindingLoadRange" >
tooltip={bindingLoadRemark}
style={{ marginBottom }}
>
{
editable ? <Select allowClear placeholder='请选择绑定加载范围'>
{ {
bindingLoadRangeList?.map((item, index) => <Option key={index} value={item}> editable ? <PartitionSelect modelerData={modelerData} partitionTypes={supportedPartitionTypes} /> : <span className='word-wrap'>{highlightSearchContentByTerms(partitionsDescription, terms)}</span>
{item}
</Option>)
} }
</Select> : <span className='word-wrap'>{highlightSearchContentByTerms(modelerData?.bindingLoadRange, terms)}</span> </Form.Item>
} </Col>
</Form.Item> <Col xs={24} sm={24} lg={12} xl={8}>
</Col> <Form.Item
</Row> label="类主键"
</Form> name="easyDataModelerSemiPrimaryKey"
} style={{ marginBottom }}
</div> >
{
editable ? <AttributesSelect modelerData={modelerData} mode='tags' /> : <span className='word-wrap'>{highlightSearchContentByTerms(semiPrimaryDescription, terms)}</span>
}
</Form.Item>
</Col>
<Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item
label="数据情况"
name="dataCircumstances"
style={{ marginBottom }}
>
{
editable ? <Input placeholder='描述数据表中数据的更新频率、每日增量情况、数据量级和历史数据' /> : <span className='word-wrap'>{highlightSearchContentByTerms(modelerData?.dataCircumstances, terms)}</span>
}
</Form.Item>
</Col>
<Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item
label="更新时间"
name="dataUpdatingTiming"
style={{ marginBottom }}
>
{
editable ? <UpdateSelect placeholder='描述数据表的更新时间点'/> : <span className='word-wrap'>{highlightSearchContentByTerms(modelerData?.dataUpdatingTiming, terms)}</span>
}
</Form.Item>
</Col>
<Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item
label="数据类型"
name="dataType"
tooltip={dataTypeRemark}
style={{ marginBottom }}
>
{
editable ? <Select allowClear placeholder='请选择数据类型'>
{
dataTypeList?.map((item, index) => <Option key={index} value={item}>
{item}
</Option>)
}
</Select> : <span className='word-wrap'>{highlightSearchContentByTerms(modelerData?.dataType, terms)}</span>
}
</Form.Item>
</Col>
<Col xs={24} sm={24} lg={12} xl={8}>
<Form.Item
label="绑定加载范围"
name="bindingLoadRange"
tooltip={bindingLoadRemark}
style={{ marginBottom }}
>
{
editable ? <Select allowClear placeholder='请选择绑定加载范围'>
{
bindingLoadRangeList?.map((item, index) => <Option key={index} value={item}>
{item}
</Option>)
}
</Select> : <span className='word-wrap'>{highlightSearchContentByTerms(modelerData?.bindingLoadRange, terms)}</span>
}
</Form.Item>
</Col>
</Row>
</Form>
}
</div>
}
<Rule <Rule
{...ruleParams} {...ruleParams}
onCancel={() => { onCancel={() => {
......
...@@ -8,26 +8,6 @@ ...@@ -8,26 +8,6 @@
} }
} }
.model-import-action-basic,
.model-import-action-technical,
.model-import-action-table,
.model-import-action-index,
.model-import-action-manage,
.model-import-action-relation,
.model-import-action-comment {
background-color: #FFF;
padding: 20px;
}
.model-import-action-technical,
.model-import-action-table,
.model-import-action-index,
.model-import-action-manage,
.model-import-action-relation,
.model-import-action-comment {
margin-top: 7px;
}
.edit-template .model-import-action-table { .edit-template .model-import-action-table {
padding: 0; padding: 0;
} }
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment