Commit d7b7482c authored by zhangwenshuai's avatar zhangwenshuai

update upload and number ui

parent d1a71d13
...@@ -9,7 +9,7 @@ ...@@ -9,7 +9,7 @@
height: 100%; height: 100%;
.loading { .loading {
position: absolute; position: absolute;
top: 50%; top: 200px;
left: 50%; left: 50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
} }
......
...@@ -83,7 +83,6 @@ export const SetFormatter = { ...@@ -83,7 +83,6 @@ export const SetFormatter = {
return [{ value: val, text: val }]; return [{ value: val, text: val }];
}, },
NUMBER: (val, config) => { NUMBER: (val, config) => {
debugger
if (!isNumber(val)) return emptyModel; if (!isNumber(val)) return emptyModel;
const { unit = {} } = config || {}; // 设置单位 const { unit = {} } = config || {}; // 设置单位
if (unit && unit.code === 'wan') { if (unit && unit.code === 'wan') {
......
...@@ -5,7 +5,7 @@ import { ApolloNumberProps } from '../editInterface'; ...@@ -5,7 +5,7 @@ import { ApolloNumberProps } from '../editInterface';
import { antiAssign } from '../../../../utils/utils'; import { antiAssign } from '../../../../utils/utils';
export const ApolloNumber = (props: ApolloNumberProps) => { export const ApolloNumber = (props: ApolloNumberProps) => {
const { onChange }: any = props; const { onChange, origin }: any = props;
const selfProps = antiAssign(props, ['columnConfig', 'onChange']); const selfProps = antiAssign(props, ['columnConfig', 'onChange']);
const changeValue = (newValue: any) => { const changeValue = (newValue: any) => {
if (typeof onChange === 'function') { if (typeof onChange === 'function') {
...@@ -13,5 +13,9 @@ export const ApolloNumber = (props: ApolloNumberProps) => { ...@@ -13,5 +13,9 @@ export const ApolloNumber = (props: ApolloNumberProps) => {
} }
}; };
const { onEmitChange, ...o } = selfProps; const { onEmitChange, ...o } = selfProps;
return <InputNumber className={styles.number} {...o} onChange={changeValue} />; const style: any = {};
if (origin === 'editForm') {
style.height = '32px';
}
return <InputNumber className={styles.number} style={style} {...o} onChange={changeValue} />;
}; };
...@@ -11,6 +11,10 @@ ...@@ -11,6 +11,10 @@
background: @disabledColor; background: @disabledColor;
border-color: #d9d9d9; border-color: #d9d9d9;
} }
&.editForm{
height: auto;
border: none;
}
.add { .add {
cursor: pointer; cursor: pointer;
font-size: @textFontGen; font-size: @textFontGen;
...@@ -19,9 +23,12 @@ ...@@ -19,9 +23,12 @@
} }
} }
.picContainer { .picContainer {
margin-left: @marginSmX; margin-right: @marginSmX;
.pic { .pic {
height: 30px; height: 30px;
&.editForm {
height: 100px;
}
} }
} }
} }
......
...@@ -8,7 +8,7 @@ import Upload from '../../extra/upload'; ...@@ -8,7 +8,7 @@ import Upload from '../../extra/upload';
import addIcon from '../../../../assets/addIcon.png'; import addIcon from '../../../../assets/addIcon.png';
export const ApolloUpload = (props: ApolloUploadProps) => { export const ApolloUpload = (props: ApolloUploadProps) => {
const { isMultiple, onEmitChange, onChange, disabled } = props; const { isMultiple, onEmitChange, onChange, disabled, origin } = props;
const selfProps = antiAssign(props, ['onChange', 'value']); const selfProps = antiAssign(props, ['onChange', 'value']);
if (isMultiple) { if (isMultiple) {
selfProps.multiple = true; selfProps.multiple = true;
...@@ -29,6 +29,9 @@ export const ApolloUpload = (props: ApolloUploadProps) => { ...@@ -29,6 +29,9 @@ export const ApolloUpload = (props: ApolloUploadProps) => {
// 点击Modal中上传时回调用浏览器弹框,触发onBlur,而此时并不希望触发onBlur,因此在组件内自定义监听 // 点击Modal中上传时回调用浏览器弹框,触发onBlur,而此时并不希望触发onBlur,因此在组件内自定义监听
useEffect(() => { useEffect(() => {
document.addEventListener('click', onBlur, false); document.addEventListener('click', onBlur, false);
if (origin !== 'editForm') {
toggleUploadDialog(true);
}
return () => { return () => {
document.removeEventListener('click', onBlur, false); document.removeEventListener('click', onBlur, false);
}; };
...@@ -61,23 +64,33 @@ export const ApolloUpload = (props: ApolloUploadProps) => { ...@@ -61,23 +64,33 @@ export const ApolloUpload = (props: ApolloUploadProps) => {
e.stopPropagation(); // 阻止事件冒泡 e.stopPropagation(); // 阻止事件冒泡
e.nativeEvent.stopImmediatePropagation(); e.nativeEvent.stopImmediatePropagation();
}; };
let containerClass = s.container;
if (disabled) {
containerClass = classNames(containerClass, s.disabled);
}
if (origin === 'editForm') {
containerClass = classNames(containerClass, s.editForm);
}
return ( return (
<div className={disabled ? classNames(s.container, s.disabled) : s.container} onClick={onClickContainer}> <div className={containerClass} onClick={onClickContainer}>
{!disabled && (
<div className={s.add} onClick={toggleUploadDialog.bind(null, true)}>
<img alt="" className={s.addIcon} src={addIcon} />
</div>
)}
{value && {value &&
value.map((item, i) => { value.map((item, i) => {
return ( return (
<div key={i} className={s.picContainer}> <div key={i} className={s.picContainer}>
<Tooltip placement="bottom" title={item.name}> <Tooltip placement="bottom" title={item.name}>
<img className={s.pic} src={item.thumbUrl} /> <img
className={origin === 'editForm' ? classNames(s.pic, s.editForm) : s.pic}
src={item.thumbUrl}
/>
</Tooltip> </Tooltip>
</div> </div>
); );
})} })}
{!disabled && origin === 'editForm' && (
<div className={s.add} onClick={toggleUploadDialog.bind(null, true)}>
<img alt="" className={s.addIcon} src={addIcon} />
</div>
)}
<Modal visible={visible} title="文件上传" onOk={onOk} onCancel={onCancel}> <Modal visible={visible} title="文件上传" onOk={onOk} onCancel={onCancel}>
<div className={s.uploadContainer}> <div className={s.uploadContainer}>
<Upload {...selfProps} value={props.value} onChange={changeValue} /> <Upload {...selfProps} value={props.value} onChange={changeValue} />
......
...@@ -78,6 +78,7 @@ class AirTable extends React.Component<CommonProps, CommonState> { ...@@ -78,6 +78,7 @@ class AirTable extends React.Component<CommonProps, CommonState> {
headerHeight, headerHeight,
contentMenu, contentMenu,
onScroll, onScroll,
loadComp,
} = this.props; } = this.props;
const sortConfig = const sortConfig =
operateConfig && operateConfig &&
...@@ -116,6 +117,7 @@ class AirTable extends React.Component<CommonProps, CommonState> { ...@@ -116,6 +117,7 @@ class AirTable extends React.Component<CommonProps, CommonState> {
rowSelection={rowSelection} rowSelection={rowSelection}
noDataPlaceholder={noDataPlaceholder} noDataPlaceholder={noDataPlaceholder}
contentMenu={contentMenu} contentMenu={contentMenu}
loadComp={loadComp}
/> />
</div> </div>
{paginationConfig && <Pagination {...paginationConfig} />} {paginationConfig && <Pagination {...paginationConfig} />}
......
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