-
Notifications
You must be signed in to change notification settings - Fork 21
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #22 from ireneAi/main
详细信息子项添加链接跳转
- Loading branch information
Showing
15 changed files
with
611 additions
and
32 deletions.
There are no files selected for viewing
4 changes: 2 additions & 2 deletions
4
packages/UIs/ccms-antd/src/components/detail/iframe/index.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
16 changes: 16 additions & 0 deletions
16
packages/UIs/ccms-antd/src/components/detail/link/index.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,16 @@ | ||
| import React from 'react' | ||
| import { DetailLink } from 'ccms' | ||
| import { ILinkDetail } from 'ccms/dist/src/components/detail/link' | ||
|
|
||
| export default class LinkDetailComponent extends DetailLink { | ||
| renderComponent = (props: ILinkDetail) => { | ||
| const { url, name } = props | ||
| return url && name ? ( | ||
| <a href={url} target="_blank" rel="noreferrer"> | ||
| {name} | ||
| </a> | ||
| ) : ( | ||
| <>{name}</> | ||
| ) | ||
| } | ||
| } |
47 changes: 47 additions & 0 deletions
47
packages/UIs/ccms-antd/src/components/detail/operation/index.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,47 @@ | ||
| import React from 'react' | ||
| import { DetailOperation } from 'ccms' | ||
| import { IButtonProps, IOperationDetail } from 'ccms/dist/src/components/detail/operation' | ||
| import { Button, Space } from 'antd' | ||
| import OperationHelper from '../../../util/operation' | ||
|
|
||
| export default class OperationDetailComponent extends DetailOperation { | ||
| OperationHelper = OperationHelper | ||
|
|
||
| renderComponent = (props: IOperationDetail) => { | ||
| const { actions } = props | ||
| return <Space>{Array.isArray(actions) && actions}</Space> | ||
| } | ||
|
|
||
| renderButtonComponent = (props: IButtonProps) => { | ||
| const { level, label, onClick } = props | ||
| let type | ||
| let danger | ||
| if (level === 'danger') { | ||
| type = 'default' | ||
| danger = true | ||
| } else { | ||
| danger = false | ||
| if (level === 'normal') { | ||
| type = 'default' | ||
| } else { | ||
| type = level | ||
| } | ||
| } | ||
| return ( | ||
| <Button type={type} danger={danger} onClick={() => onClick()}> | ||
| {label} | ||
| </Button> | ||
| ) | ||
| } | ||
|
|
||
| renderLinkComponent = (props: IButtonProps) => { | ||
| const { level, label, onClick } = props | ||
| const danger = level === 'danger' | ||
| const style = level === 'primary' ? { fontWeight: 'bold' } : {} | ||
| return ( | ||
| <Button type="link" style={style} danger={danger} onClick={() => onClick()}> | ||
| {label} | ||
| </Button> | ||
| ) | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,54 @@ | ||
| import React from 'react' | ||
| import StatementHelper, { StatementConfig } from '../../../util/statement' | ||
| import { DetailField, DetailFieldConfig, IDetailField } from '../common' | ||
|
|
||
| /** | ||
| * iLink嵌入组件 格式定义 | ||
| * - type: 类型 | ||
| * - url: 链接地址 | ||
| * - name: 链接名称 | ||
| */ | ||
| export interface LinkDetailConfig extends DetailFieldConfig { | ||
| type: 'link' | ||
| url: StatementConfig | ||
| name?: string | ||
| } | ||
|
|
||
| export interface ILinkDetail { | ||
| url?: string | ||
| name?: string | ||
| } | ||
|
|
||
| export default class LinkDetail | ||
| extends DetailField<LinkDetailConfig, ILinkDetail, string> | ||
| implements IDetailField<string> | ||
| { | ||
| renderComponent = (props: ILinkDetail) => { | ||
| return <>您当前使用的UI版本没有实现ILink组件。</> | ||
| } | ||
|
|
||
| getValue = () => { | ||
| const { | ||
| value, | ||
| config: { defaultValue } | ||
| } = this.props | ||
| if (value === undefined || value === null || value === '') { | ||
| return defaultValue !== undefined ? defaultValue : '' | ||
| } | ||
| return value | ||
| } | ||
|
|
||
| render = () => { | ||
| const { | ||
| config: { url, name } | ||
| } = this.props | ||
| const props: ILinkDetail = { | ||
| name: name || '' | ||
| } | ||
| if (url) { | ||
| props.url = StatementHelper(url, { data: this.props.data, step: this.props.step }) | ||
| props.name = name || props.url || '' | ||
| } | ||
| return <>{this.renderComponent(props)}</> | ||
| } | ||
| } |
167 changes: 167 additions & 0 deletions
167
packages/core/src/components/detail/operation/index.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,167 @@ | ||
| import React from 'react' | ||
| import { cloneDeep } from 'lodash' | ||
| import { DetailField, DetailFieldConfig } from '../common' | ||
| import OperationHelper, { OperationConfig } from '../../../util/operation' | ||
|
|
||
| /** | ||
| * 表格操作配置项 | ||
| * - type: 操作类型 | ||
| * - actions: 操作按钮配置 | ||
| */ | ||
| export interface OperationDetailConfig extends DetailFieldConfig { | ||
| type: 'operation' | ||
| actions: Array<ActionConfig> | [] | ||
| } | ||
|
|
||
| type ActionConfig = ActionButtonConfig | ActionLinkConfig | ||
|
|
||
| export interface ActionButtonConfig { | ||
| type: 'button' // to do group(按钮组)、dropdown(下拉按钮)、dropLink(下拉链接) | ||
| label: string | ||
| level: 'normal' | 'primary' | 'danger' | ||
| handle: OperationConfig | ||
| } | ||
|
|
||
| export interface ActionLinkConfig { | ||
| type: 'link' | ||
| label: string | ||
| level: 'normal' | 'primary' | 'danger' | ||
| handle: OperationConfig | ||
| } | ||
|
|
||
| export interface IButtonProps { | ||
| label: string | ||
| level: 'normal' | 'primary' | 'danger' | ||
| onClick: () => void | ||
| } | ||
|
|
||
| export interface IOperationDetail { | ||
| actions: Array<React.ReactNode> | ||
| } | ||
|
|
||
| export default class DetailOperation extends DetailField<OperationDetailConfig, IOperationDetail, string> { | ||
| OperationHelper = OperationHelper | ||
|
|
||
| renderComponent = (props: IOperationDetail) => { | ||
| return <>您当前使用的UI版本没有实现OperationDetail组件。</> | ||
| } | ||
|
|
||
| /** | ||
| * button组件 | ||
| * @param props | ||
| */ | ||
| renderButtonComponent = (props: IButtonProps) => { | ||
| return <>您当前使用的UI版本没有实现OperationDetail的Button组件。</> | ||
| } | ||
|
|
||
| /** | ||
| * link组件 | ||
| * @param props | ||
| */ | ||
| renderLinkComponent = (props: IButtonProps) => { | ||
| return <>您当前使用的UI版本没有实现OperationDetail的link组件。</> | ||
| } | ||
|
|
||
| state = { | ||
| pageAuth: {} | ||
| } | ||
|
|
||
| /** | ||
| * 页面权限获取状态 | ||
| * fulfilled ｜pending | ||
| */ | ||
| pageAuth: { [page: string]: boolean } = {} | ||
|
|
||
| checkPageAuth = (page: string) => { | ||
| if (!this.pageAuth[page]) { | ||
| this.pageAuth[page] = true | ||
| this.props.checkPageAuth(page).then((auth) => { | ||
| const pageAuth = cloneDeep(this.state.pageAuth) | ||
| pageAuth[page] = auth | ||
| this.setState({ pageAuth }) | ||
| }) | ||
| } | ||
| } | ||
|
|
||
| getValue = () => { | ||
| const { | ||
| value, | ||
| config: { defaultValue } | ||
| } = this.props | ||
|
|
||
| if (value === undefined || value === null || value === '') { | ||
| return defaultValue !== undefined ? defaultValue.toString() : '' | ||
| } | ||
| return value | ||
| } | ||
|
|
||
| /** | ||
| * 处理按钮列表按钮项回调 | ||
| * @param action 按钮项配置 | ||
| */ | ||
| handleCallback = async (action: ActionConfig, success: boolean) => { } | ||
|
|
||
| render = () => { | ||
| const { | ||
| record, | ||
| data, | ||
| step, | ||
| config: { actions } | ||
| } = this.props | ||
| const { pageAuth } = this.state | ||
|
|
||
| const value = this.getValue() | ||
| let actions_ | ||
| if (Object.prototype.toString.call(actions) === '[object Array]') { | ||
| actions_ = [] | ||
| for (let index = 0, len = actions.length; index < len; index++) { | ||
| let hidden = false | ||
| if (actions[index].handle && actions[index].handle.type === 'ccms') { | ||
| if (actions[index].handle.page !== undefined) { | ||
| this.checkPageAuth(actions[index].handle.page.toString()) | ||
| } | ||
| hidden = actions[index].handle.page === undefined || !pageAuth[actions[index].handle.page.toString()] | ||
| if (hidden) continue | ||
| } | ||
| const OperationHelperWrapper = ( | ||
| <this.OperationHelper | ||
| key={index} | ||
| config={actions[index].handle} | ||
| datas={{ record, data, step }} | ||
| checkPageAuth={this.props.checkPageAuth} | ||
| loadPageURL={this.props.loadPageURL} | ||
| loadPageFrameURL={this.props.loadPageFrameURL} | ||
| loadPageConfig={this.props.loadPageConfig} | ||
| loadPageList={this.props.loadPageList} | ||
| baseRoute={this.props.baseRoute} | ||
| loadDomain={this.props.loadDomain} | ||
| handlePageRedirect={this.props.handlePageRedirect} | ||
| callback={async (success) => { | ||
| await this.handleCallback(actions[index], success) | ||
| }} | ||
| > | ||
| {(onClick) => { | ||
| if (actions[index].type === 'button') { | ||
| return this.renderButtonComponent({ | ||
| label: actions[index].label || value, | ||
| level: actions[index].level, | ||
| onClick | ||
| }) | ||
| } | ||
| if (actions[index].type === 'link') { | ||
| return this.renderLinkComponent({ | ||
| label: actions[index].label || value, | ||
| level: actions[index].level, | ||
| onClick | ||
| }) | ||
| } | ||
| }} | ||
| </this.OperationHelper> | ||
| ) | ||
| actions_.push(OperationHelperWrapper) | ||
| } | ||
| } | ||
| console.log(actions_, 'actions') | ||
| return <> {this.renderComponent({ actions: actions_ })}</> | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.