Commit 45c158dd authored by zhangwenshuai's avatar zhangwenshuai

Merge branch 'patch1.0.1' into dev

parents a136e052 49179a1a
import { createFromIconfontCN } from '@ant-design/icons'; import { createFromIconfontCN } from '@ant-design/icons';
const IconFont = createFromIconfontCN({ const IconFont = createFromIconfontCN({
scriptUrl: 'https://influencer-attachment.mttop.cn/influencer/v2/website/20200629/iconFont.js', scriptUrl: 'https://static.mttop.cn/website/20200723/iconFont.jsiconfont.js',
}); });
export default IconFont; export default IconFont;
...@@ -33,6 +33,8 @@ const Cell = (props: CellProps) => { ...@@ -33,6 +33,8 @@ const Cell = (props: CellProps) => {
rowSelection, rowSelection,
columns, columns,
contentMenu, contentMenu,
tableId,
maxPopHeight,
} = props; } = props;
const { const {
columnType, columnType,
...@@ -72,12 +74,14 @@ const Cell = (props: CellProps) => { ...@@ -72,12 +74,14 @@ const Cell = (props: CellProps) => {
if (requiredFlag) { if (requiredFlag) {
if (!changedValue || changedValue.length === 0) { if (!changedValue || changedValue.length === 0) {
message.error('该字段为必填项'); message.error('该字段为必填项');
setStatus('detail');
return; return;
} }
if (changedValue.length === 1) { if (changedValue.length === 1) {
const data = changedValue[0]; const data = changedValue[0];
if (!data.value && !data.text) { if (!data.value && !data.text) {
message.error('该字段为必填项'); message.error('该字段为必填项');
setStatus('detail');
return; return;
} }
} }
...@@ -102,14 +106,14 @@ const Cell = (props: CellProps) => { ...@@ -102,14 +106,14 @@ const Cell = (props: CellProps) => {
}; };
// 添加行hover样式 // 添加行hover样式
const onMouseEnter = () => { const onMouseEnter = () => {
const doms = document.querySelectorAll(`.row_${rowIndex}`); const doms = document.querySelectorAll(`.table_${tableId}.row_${rowIndex}`);
doms.forEach((dom) => { doms.forEach((dom) => {
dom.classList.add(s.hover); dom.classList.add(s.hover);
}); });
}; };
// 去除行hover样式 // 去除行hover样式
const onMouseLeave = () => { const onMouseLeave = () => {
const doms = document.querySelectorAll(`.row_${rowIndex}`); const doms = document.querySelectorAll(`.table_${tableId}.row_${rowIndex}`);
doms.forEach((dom) => { doms.forEach((dom) => {
dom.classList.remove(s.hover); dom.classList.remove(s.hover);
}); });
...@@ -240,7 +244,7 @@ const Cell = (props: CellProps) => { ...@@ -240,7 +244,7 @@ const Cell = (props: CellProps) => {
// 否则进入选中状态 // 否则进入选中状态
if (dom) { if (dom) {
// 先清除所有dom的选中状态及样式 // 先清除所有dom的选中状态及样式
const doms = document.querySelectorAll('.cellUnit'); const doms = document.querySelectorAll(`.cellUnit.table_${tableId}`);
if (doms) { if (doms) {
doms.forEach((item) => { doms.forEach((item) => {
item.setAttribute('data-selected-cell', '0'); item.setAttribute('data-selected-cell', '0');
...@@ -334,11 +338,13 @@ const Cell = (props: CellProps) => { ...@@ -334,11 +338,13 @@ const Cell = (props: CellProps) => {
const value = setFormat(editConfig, columnConfig, changedValue, optionValue); const value = setFormat(editConfig, columnConfig, changedValue, optionValue);
emitChangeCellData(value, optionValue); emitChangeCellData(value, optionValue);
}} }}
tableId={tableId}
cellRenderProps={cellRenderProps} cellRenderProps={cellRenderProps}
style={{ style={{
minHeight: cellStyle.height, minHeight: cellStyle.height,
borderRadius: 0, borderRadius: 0,
}} }}
maxPopHeight={maxPopHeight}
/> />
</div> </div>
); );
...@@ -346,14 +352,14 @@ const Cell = (props: CellProps) => { ...@@ -346,14 +352,14 @@ const Cell = (props: CellProps) => {
return ( return (
<div <div
className={classNames(s.cellContainer, `row_${rowIndex}`, `col_${columnIndex}`, cellClassName)} className={classNames(s.cellContainer, `table_${tableId}`, `row_${rowIndex}`, `col_${columnIndex}`, cellClassName)}
style={cellStyle} style={cellStyle}
onMouseEnter={onMouseEnter} onMouseEnter={onMouseEnter}
onMouseLeave={onMouseLeave} onMouseLeave={onMouseLeave}
> >
{columnIndex === 0 && (rowSelection || showExpand || showIndex) && renderFirst()} {columnIndex === 0 && (rowSelection || showExpand || showIndex) && renderFirst()}
<div <div
className={classNames(s.cellData, 'cellUnit', `row_${rowIndex}`, `col_${columnIndex}`)} className={classNames(s.cellData, 'cellUnit', `table_${tableId}`, `row_${rowIndex}`, `col_${columnIndex}`)}
id={`cellUnit_${rowIndex}_${columnIndex}`} id={`cellUnit_${rowIndex}_${columnIndex}`}
data-selected-cell="0" data-selected-cell="0"
data-editing-cell="0" data-editing-cell="0"
......
...@@ -82,10 +82,17 @@ export default class TableColumn extends PureComponent<ColumnProps> { ...@@ -82,10 +82,17 @@ export default class TableColumn extends PureComponent<ColumnProps> {
return item.colName === columnName; return item.colName === columnName;
}); });
const { sortType }: { sortType: string } = sort || {}; const { sortType }: { sortType: string } = sort || {};
let marginLeft:any = 0;
if (columnIndex === 0 && (rowSelection || showIndex)) {
marginLeft = '56px';
if (!rowSelection) {
marginLeft = '82px';
}
}
return ( return (
<div className={s.colContainer}> <div className={s.colContainer}>
{rowSelection && columnIndex === 0 && <div className={s.checkbox}>{this.getCheckbox()}</div>} {rowSelection && columnIndex === 0 && <div className={s.checkbox}>{this.getCheckbox()}</div>}
<div className={s.colBrief} style={{ marginLeft: showIndex && columnIndex === 0 ? '56px' : 0 }}> <div className={s.colBrief} style={{ marginLeft }}>
{icon && <div className={s.colIcon}>{icon()}</div>} {icon && <div className={s.colIcon}>{icon()}</div>}
<span className={required ? classNames(s.colTitle, s.required) : s.colTitle}> <span className={required ? classNames(s.colTitle, s.required) : s.colTitle}>
{columnChsName} {columnChsName}
......
...@@ -422,7 +422,8 @@ export default class AirTable extends Component<TableProps, TableState> { ...@@ -422,7 +422,8 @@ export default class AirTable extends Component<TableProps, TableState> {
}: { showColumns: ColumnProps[]; showData: RowProps; position?: string }, }: { showColumns: ColumnProps[]; showData: RowProps; position?: string },
{ columnIndex, key, rowIndex, style }: any, { columnIndex, key, rowIndex, style }: any,
) => { ) => {
const { columns, dataSource } = this.state; const { columns, dataSource, tableHeight = 0 } = this.state;
const { headerHeight } = this.config;
const { const {
emitChangeCell, emitChangeCell,
paginationConfig, paginationConfig,
...@@ -434,6 +435,7 @@ export default class AirTable extends Component<TableProps, TableState> { ...@@ -434,6 +435,7 @@ export default class AirTable extends Component<TableProps, TableState> {
contentMenu, contentMenu,
rowClassName, rowClassName,
rowStyle, rowStyle,
tableId,
} = this.props; } = this.props;
if (showColumns.length === 0 || showData.length === 0) { if (showColumns.length === 0 || showData.length === 0) {
return; return;
...@@ -479,6 +481,11 @@ export default class AirTable extends Component<TableProps, TableState> { ...@@ -479,6 +481,11 @@ export default class AirTable extends Component<TableProps, TableState> {
cellData, cellData,
}); });
let maxPopHeight = (tableHeight - headerHeight) / 2;
if (maxPopHeight > 250) {
maxPopHeight = 250;
}
return ( return (
<Cell <Cell
key={key} key={key}
...@@ -501,12 +508,14 @@ export default class AirTable extends Component<TableProps, TableState> { ...@@ -501,12 +508,14 @@ export default class AirTable extends Component<TableProps, TableState> {
contentMenu={contentMenu} contentMenu={contentMenu}
cellKey={key} cellKey={key}
position={position} position={position}
tableId={tableId}
maxPopHeight={maxPopHeight}
/> />
); );
}; };
render() { render() {
const { loading, noDataPlaceholder, loadComp, canFixed } = this.props; const { loading, noDataPlaceholder, loadComp, canFixed, tableId } = this.props;
const { columns, dataSource, tableWidth = 0, tableHeight = 0 } = this.state; const { columns, dataSource, tableWidth = 0, tableHeight = 0 } = this.state;
const { overscanColumnCount, overscanRowCount, rowHeight, headerHeight, columnWidth } = this.config; const { overscanColumnCount, overscanRowCount, rowHeight, headerHeight, columnWidth } = this.config;
const scrollbarWidth = scrollbarSize() || 0; const scrollbarWidth = scrollbarSize() || 0;
...@@ -548,7 +557,7 @@ export default class AirTable extends Component<TableProps, TableState> { ...@@ -548,7 +557,7 @@ export default class AirTable extends Component<TableProps, TableState> {
style={{ style={{
paddingRight: this.props.onScroll ? paddingRight : 0, paddingRight: this.props.onScroll ? paddingRight : 0,
}} }}
id="tableContainer" id={`apolloTable_${tableId}`}
ref={(dom) => { ref={(dom) => {
this.tableContainer = dom; this.tableContainer = dom;
}} }}
......
...@@ -44,6 +44,7 @@ ...@@ -44,6 +44,7 @@
cursor: pointer; cursor: pointer;
text-align: center; text-align: center;
display: none; display: none;
color: #B7CCFE;
.extend { .extend {
width: 14px; width: 14px;
border-radius: 50%; border-radius: 50%;
......
...@@ -130,7 +130,7 @@ export const ApolloTextLinkDetail = (props: any) => { ...@@ -130,7 +130,7 @@ export const ApolloTextLinkDetail = (props: any) => {
changeEdit(); changeEdit();
}} }}
> >
<IconFont type="iconzhankai1" /> <IconFont type="iconzhankai11" />
</div> </div>
)} )}
</div> </div>
......
...@@ -13,6 +13,8 @@ export interface LinkData { ...@@ -13,6 +13,8 @@ export interface LinkData {
export interface CommonProps { export interface CommonProps {
onEmitChange?: Function; onEmitChange?: Function;
isMobile?: boolean; isMobile?: boolean;
origin?: string;
tableId?: string|number;
} }
export interface ApolloInputProps extends InputProps, CommonProps { export interface ApolloInputProps extends InputProps, CommonProps {
value: string | undefined; value: string | undefined;
......
...@@ -6,9 +6,9 @@ import { antiAssign } from '../../../../utils/utils'; ...@@ -6,9 +6,9 @@ import { antiAssign } from '../../../../utils/utils';
import styles from './styles.less'; import styles from './styles.less';
export const ApolloSelect = (props: ApolloSelectProps) => { export const ApolloSelect = (props: ApolloSelectProps) => {
const { options = [], onChange, isMultiple, origin } = props; const { options = [], onChange, isMultiple, origin, maxPopHeight } = props;
const selfProps = antiAssign(props, ['columnConfig', 'onChange', 'isMultiple', 'options']); const selfProps = antiAssign(props, ['columnConfig', 'onChange', 'isMultiple', 'options', 'maxPopHeight']);
const isOpen = useRef(); const isOpen: any = useRef();
if (isMultiple) { if (isMultiple) {
selfProps.mode = 'multiple'; selfProps.mode = 'multiple';
...@@ -30,12 +30,16 @@ export const ApolloSelect = (props: ApolloSelectProps) => { ...@@ -30,12 +30,16 @@ export const ApolloSelect = (props: ApolloSelectProps) => {
onBlurFn(props); onBlurFn(props);
} }
}; };
return (origin === 'editForm' ?
return origin === 'editForm' ? (
<Select <Select
className={styles.select} className={styles.select}
{...selfProps} {...selfProps}
onChange={changeValue} onChange={changeValue}
onDropdownVisibleChange={selfProps.mode === 'multiple' ? multipleBlurFn : singleBlurFn} onDropdownVisibleChange={selfProps.mode === 'multiple' ? multipleBlurFn : singleBlurFn}
dropdownStyle={{
maxHeight: maxPopHeight,
}}
> >
{options.map((item) => { {options.map((item) => {
return ( return (
...@@ -44,10 +48,15 @@ export const ApolloSelect = (props: ApolloSelectProps) => { ...@@ -44,10 +48,15 @@ export const ApolloSelect = (props: ApolloSelectProps) => {
</Select.Option> </Select.Option>
); );
})} })}
</Select> : <Select </Select>
) : (
<Select
className={styles.select} className={styles.select}
{...selfProps} {...selfProps}
onChange={changeValue} onChange={changeValue}
dropdownStyle={{
maxHeight: maxPopHeight,
}}
> >
{options.map((item) => { {options.map((item) => {
return ( return (
......
...@@ -227,7 +227,7 @@ class AssociationSearch extends React.Component<Props, State> { ...@@ -227,7 +227,7 @@ class AssociationSearch extends React.Component<Props, State> {
render() { render() {
const { data, value } = this.state; const { data, value } = this.state;
const { selfCom, autoFocus, onChange, ...rest } = this.props; const { selfCom, autoFocus, onChange, maxPopHeight, ...rest } = this.props;
return ( return (
<Consumer> <Consumer>
{({ locale }: any) => { {({ locale }: any) => {
...@@ -243,6 +243,9 @@ class AssociationSearch extends React.Component<Props, State> { ...@@ -243,6 +243,9 @@ class AssociationSearch extends React.Component<Props, State> {
onChange={this.handleChange} onChange={this.handleChange}
onFocus={this.onFocus} onFocus={this.onFocus}
onBlur={this.onBlur} onBlur={this.onBlur}
dropdownStyle={{
maxHeight: maxPopHeight,
}}
> >
{data.map((d: any) => { {data.map((d: any) => {
return ( return (
......
...@@ -137,11 +137,7 @@ class TextSelect extends React.Component<Props, State> { ...@@ -137,11 +137,7 @@ class TextSelect extends React.Component<Props, State> {
onChange = (obj) => { onChange = (obj) => {
const { onChange } = this.props; const { onChange } = this.props;
if (typeof onChange === 'function') { if (typeof onChange === 'function') {
if (!obj || (!obj.label && !obj.value)) { onChange(obj);
onChange(undefined);
} else {
onChange(obj);
}
} }
}; };
...@@ -158,7 +154,11 @@ class TextSelect extends React.Component<Props, State> { ...@@ -158,7 +154,11 @@ class TextSelect extends React.Component<Props, State> {
}; };
onVisibleChange = (tempVisible) => { onVisibleChange = (tempVisible) => {
const { onDropdownVisibleChange } = this.props;
this.setState({ tempVisible }); this.setState({ tempVisible });
if (onDropdownVisibleChange) {
onDropdownVisibleChange(tempVisible);
}
}; };
renderList = () => { renderList = () => {
...@@ -198,13 +198,16 @@ class TextSelect extends React.Component<Props, State> { ...@@ -198,13 +198,16 @@ class TextSelect extends React.Component<Props, State> {
}; };
render() { render() {
const { placeholder, disabled } = this.props; const { placeholder, disabled, maxPopHeight } = this.props;
const { searchStr } = this.state; const { searchStr } = this.state;
return ( return (
<div className={styles.textSelectContainer} ref={this.container}> <div className={styles.textSelectContainer} ref={this.container}>
<Dropdown <Dropdown
trigger={['click']} trigger={['click']}
overlayClassName={styles.overlayClassName} overlayClassName={styles.overlayClassName}
overlayStyle={{
maxHeight: maxPopHeight,
}}
onVisibleChange={this.onVisibleChange} onVisibleChange={this.onVisibleChange}
placement="bottomLeft" placement="bottomLeft"
overlay={this.renderList()} overlay={this.renderList()}
......
...@@ -86,6 +86,7 @@ class AirTable extends React.Component<CommonProps, CommonState> { ...@@ -86,6 +86,7 @@ class AirTable extends React.Component<CommonProps, CommonState> {
canFixed, canFixed,
id, id,
onDragSorted, onDragSorted,
tableId,
} = this.props; } = this.props;
const sortConfig = operateConfig const sortConfig = operateConfig
&& operateConfig.menusGroup && operateConfig.menusGroup
...@@ -145,6 +146,7 @@ class AirTable extends React.Component<CommonProps, CommonState> { ...@@ -145,6 +146,7 @@ class AirTable extends React.Component<CommonProps, CommonState> {
loadComp={loadComp} loadComp={loadComp}
canFixed={canFixed} canFixed={canFixed}
onDragSorted={onDragSorted} onDragSorted={onDragSorted}
tableId={tableId}
/> />
</div> </div>
</div> </div>
......
...@@ -77,6 +77,7 @@ export interface TableProps extends LoadConfigProps { ...@@ -77,6 +77,7 @@ export interface TableProps extends LoadConfigProps {
canSorted?: boolean;// 是否可以拖拽自定义列排序 canSorted?: boolean;// 是否可以拖拽自定义列排序
canResized?: boolean;// 是否可以拖拽自定义列伸缩 canResized?: boolean;// 是否可以拖拽自定义列伸缩
onDragSorted?:Function;// 拖拽更改列排序回调 onDragSorted?:Function;// 拖拽更改列排序回调
tableId?:string|number;// tableId
} }
export interface TableState { export interface TableState {
columns: ColumnProps[]; columns: ColumnProps[];
...@@ -93,6 +94,7 @@ export interface CommonProps extends TableProps { ...@@ -93,6 +94,7 @@ export interface CommonProps extends TableProps {
tableClassName?: string; tableClassName?: string;
showCondition?: boolean; showCondition?: boolean;
id?:string; id?:string;
tableId?:string|number;
} }
export interface CommonState extends TableState {} export interface CommonState extends TableState {}
...@@ -130,6 +132,8 @@ export interface CellProps { ...@@ -130,6 +132,8 @@ export interface CellProps {
selectedCell?: any; selectedCell?: any;
changeSelectedCell?: Function; changeSelectedCell?: Function;
position: string; position: string;
tableId?:string|number;
maxPopHeight?:string|number;
} }
export interface EditCellProps { export interface EditCellProps {
......
...@@ -89,6 +89,30 @@ class FormWrap extends Component { ...@@ -89,6 +89,30 @@ class FormWrap extends Component {
); );
}; };
validateRequired = (item, rule, value, callback) => {
if (!item.requiredFlag) {
return callback();
}
if (!value) {
return callback('必填项不能为空');
}
if (Array.isArray(value)) {
if (value.length === 0) {
return callback('必填项不能为空');
}
const [first] = value;
if (!first.text && first.text !== 0 && !first.value && first.value !== 0) {
return callback('必填项不能为空');
}
}
if (typeof value === 'object') {
if (!value.text && value.text !== 0 && !value.value && value.value !== 0) {
return callback('必填项不能为空');
}
}
return callback();
};
renderEditForm = (item) => { renderEditForm = (item) => {
const { getFieldDecorator } = this.props.form; const { getFieldDecorator } = this.props.form;
const { rowData, rowId, getInstanceDetail, onBlurFn } = this.props; const { rowData, rowId, getInstanceDetail, onBlurFn } = this.props;
...@@ -141,7 +165,11 @@ class FormWrap extends Component { ...@@ -141,7 +165,11 @@ class FormWrap extends Component {
{getFieldDecorator(columnName, { {getFieldDecorator(columnName, {
validateFirst, validateFirst,
validateTrigger, validateTrigger,
rules: [{ required: !!item.requiredFlag, message: '必填项不能为空' }, ...rules], rules: [
{ required: !!item.requiredFlag, message: '必填项不能为空' },
{ validator: this.validateRequired.bind(this, item) },
...rules,
],
initialValue: getFormat(detailConfig, item, value), initialValue: getFormat(detailConfig, item, value),
})( })(
<EditComp <EditComp
......
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