Commit f7acd792 authored by 李晓静's avatar 李晓静

增加表格头部自定义dom

parent 78492a54
...@@ -4,6 +4,7 @@ import React from 'react'; ...@@ -4,6 +4,7 @@ import React from 'react';
import { Modal, message } from 'antd'; import { Modal, message } from 'antd';
import moment from 'moment'; import moment from 'moment';
import _ from 'lodash'; import _ from 'lodash';
import classNames from 'classnames';
// ant_components 组件 // ant_components 组件
import BITable from '@/ant_components/BITable'; import BITable from '@/ant_components/BITable';
import BIButton from '@/ant_components/BIButton'; import BIButton from '@/ant_components/BIButton';
...@@ -14,7 +15,6 @@ import SelfPagination from '@/components/SelfPagination'; ...@@ -14,7 +15,6 @@ import SelfPagination from '@/components/SelfPagination';
import ButtonAuth from '@/components/AuthButton'; import ButtonAuth from '@/components/AuthButton';
import IconFont from '@/components/CustomIcon/IconFont'; import IconFont from '@/components/CustomIcon/IconFont';
// 样式 // 样式
import styles from './index.less';
// 工具 // 工具
import antiAssign from '@/utils/anti-assign'; import antiAssign from '@/utils/anti-assign';
import { DATE_FORMAT, PAGINATION } from '@/utils/constants'; import { DATE_FORMAT, PAGINATION } from '@/utils/constants';
...@@ -23,6 +23,7 @@ import { getSift } from '@/services/comment'; ...@@ -23,6 +23,7 @@ import { getSift } from '@/services/comment';
import { getOptionName, replacePageNum } from '@/utils/utils'; import { getOptionName, replacePageNum } from '@/utils/utils';
import { SIFT_TYPE } from '@/utils/enum'; import { SIFT_TYPE } from '@/utils/enum';
import storage from '@/utils/storage'; /* eslint-disable react/sort-comp */ // 关闭下划线变量检测 // 关闭方法排序检测 // 多维数组降维成一维数组 import storage from '@/utils/storage'; /* eslint-disable react/sort-comp */ // 关闭下划线变量检测 // 关闭方法排序检测 // 多维数组降维成一维数组
import styles from './index.less';
/** /**
* *
...@@ -155,7 +156,7 @@ export function formatSelect(val, options) { ...@@ -155,7 +156,7 @@ export function formatSelect(val, options) {
} }
const selectObj = options.find((item) => { const selectObj = options.find((item) => {
return item.id === val; return item.id === val;
}) || {} }) || {};
return selectObj; return selectObj;
} }
...@@ -274,7 +275,7 @@ export default class DataView extends React.Component { ...@@ -274,7 +275,7 @@ export default class DataView extends React.Component {
current: (page && page.current) || PAGINATION.current, current: (page && page.current) || PAGINATION.current,
onChange: (nextPage) => { onChange: (nextPage) => {
this.fetchPage(nextPage); this.fetchPage(nextPage);
this.fetch(); // this.fetch();
window.history.replaceState({ pageNum: nextPage }, '', `?pageNum=${nextPage}`); window.history.replaceState({ pageNum: nextPage }, '', `?pageNum=${nextPage}`);
}, },
onShowSizeChange: this.fetchPageSize, onShowSizeChange: this.fetchPageSize,
...@@ -309,16 +310,15 @@ export default class DataView extends React.Component { ...@@ -309,16 +310,15 @@ export default class DataView extends React.Component {
const { const {
pageData: { list, page }, pageData: { list, page },
} = nextProps; } = nextProps;
const newPage = const newPage = page.total > 0
page.total > 0 ? {
? { current: page.pageNum,
current: page.pageNum, total: page.total,
total: page.total, }
} : {
: { current: PAGINATION.current,
current: PAGINATION.current, total: PAGINATION.total,
total: PAGINATION.total, };
};
const newData = _.assign({}, data, { origin: list }); const newData = _.assign({}, data, { origin: list });
this.setState({ this.setState({
pagination: _.assign({}, pagination, newPage), pagination: _.assign({}, pagination, newPage),
...@@ -384,13 +384,13 @@ export default class DataView extends React.Component { ...@@ -384,13 +384,13 @@ export default class DataView extends React.Component {
message.error(res && res.message); message.error(res && res.message);
} }
} }
initView = () => { // 该方法用于回调子空间的initView方法,只会执行一次
initView = () => { // 该方法用于回调子空间的initView方法,只会执行一次
const { initView } = this.props; const { initView } = this.props;
const { searchForm } = this.state; const { searchForm } = this.state;
if (initView) { if (initView) {
initView({ searchForm, instance: this, form: this.props.form }); initView({ searchForm, instance: this, form: this.props.form });
} }
} }
// eslint-disable-next-line react/sort-comp // eslint-disable-next-line react/sort-comp
...@@ -528,10 +528,9 @@ export default class DataView extends React.Component { ...@@ -528,10 +528,9 @@ export default class DataView extends React.Component {
result = {}; result = {};
} else { } else {
const siftDataArr = Array.isArray(this.state.siftDataArr) ? this.state.siftDataArr : []; const siftDataArr = Array.isArray(this.state.siftDataArr) ? this.state.siftDataArr : [];
const obj = const obj = siftDataArr.find((item) => {
siftDataArr.find((item) => { return item.queryLabelId === index;
return item.queryLabelId === index; }) || {};
}) || {};
try { try {
result = JSON.parse(obj.queryLabelValue); result = JSON.parse(obj.queryLabelValue);
result = this.rebackDate(result); result = this.rebackDate(result);
...@@ -568,6 +567,7 @@ export default class DataView extends React.Component { ...@@ -568,6 +567,7 @@ export default class DataView extends React.Component {
} }
return data; return data;
}; };
filterSubComChangeParams = (key) => { filterSubComChangeParams = (key) => {
const { searchCols, advancedSearchCols } = this.props; const { searchCols, advancedSearchCols } = this.props;
const sumSearchCols = [...(searchCols || []), ...(advancedSearchCols || [])]; const sumSearchCols = [...(searchCols || []), ...(advancedSearchCols || [])];
...@@ -581,22 +581,22 @@ export default class DataView extends React.Component { ...@@ -581,22 +581,22 @@ export default class DataView extends React.Component {
fn = onChangeParams; fn = onChangeParams;
return; return;
} }
} }
if (Array.isArray(data)) { if (Array.isArray(data)) {
data.map(ls => filterFun(ls)); data.map((ls) => { return filterFun(ls); });
} }
} };
filterFun(sumSearchCols); filterFun(sumSearchCols);
return fn; return fn;
} }
// 更改查询条件 // 更改查询条件
_changeSearchForm = async (props, changedValues, allValues) => { _changeSearchForm = async (props, changedValues, allValues) => {
let newData = changeDateRange(props, changedValues, allValues); let newData = changeDateRange(props, changedValues, allValues);
// 回调配置项里面changeParams方法 // 回调配置项里面changeParams方法
const onChangeParams = this.filterSubComChangeParams(Object.keys(changedValues)[0]); const onChangeParams = this.filterSubComChangeParams(Object.keys(changedValues)[0]);
if (onChangeParams) { if (onChangeParams) {
newData = await onChangeParams(changedValues, newData) || newData newData = await onChangeParams(changedValues, newData) || newData;
} }
await this.setState({ await this.setState({
searchForm: newData, searchForm: newData,
...@@ -639,9 +639,9 @@ export default class DataView extends React.Component { ...@@ -639,9 +639,9 @@ export default class DataView extends React.Component {
// 回调配置项里面changeParams方法 // 回调配置项里面changeParams方法
const onChangeParams = this.filterSubComChangeParams(values.key); const onChangeParams = this.filterSubComChangeParams(values.key);
if (onChangeParams) { if (onChangeParams) {
const obj = {} const obj = {};
obj[values.key] = undefined; obj[values.key] = undefined;
formData = await onChangeParams(obj, formData) || formData formData = await onChangeParams(obj, formData) || formData;
} }
this.setState( this.setState(
{ {
...@@ -706,7 +706,9 @@ export default class DataView extends React.Component { ...@@ -706,7 +706,9 @@ export default class DataView extends React.Component {
return ( return (
<div className={styles.row}> <div className={styles.row}>
{btns.map((item, i) => { {btns.map((item, i) => {
const { label, onClick, authority, download, iconBtnSrc, type } = item; const {
label, onClick, authority, download, iconBtnSrc, type,
} = item;
const style = { const style = {
marginLeft: '10px', marginLeft: '10px',
}; };
...@@ -819,7 +821,7 @@ export default class DataView extends React.Component { ...@@ -819,7 +821,7 @@ export default class DataView extends React.Component {
// }; // };
render() { render() {
const { style, hideForm, tips } = this.props; const { style, hideForm, tips, selfCom, selfTableWrap } = this.props;
const { loading } = this.state; const { loading } = this.state;
return ( return (
<div className={styles.view} style={style}> <div className={styles.view} style={style}>
...@@ -828,6 +830,7 @@ export default class DataView extends React.Component { ...@@ -828,6 +830,7 @@ export default class DataView extends React.Component {
<> <>
<div className={styles.formWrap}> <div className={styles.formWrap}>
{/* 筛选条件 */} {/* 筛选条件 */}
{selfCom || null}
{this._renderSearchForm()} {this._renderSearchForm()}
{/* 高级搜索 */} {/* 高级搜索 */}
{/* {advancedStatus ? this.renderAdvanced() : null} */} {/* {advancedStatus ? this.renderAdvanced() : null} */}
...@@ -837,7 +840,7 @@ export default class DataView extends React.Component { ...@@ -837,7 +840,7 @@ export default class DataView extends React.Component {
<div className={styles.split} /> <div className={styles.split} />
</> </>
)} )}
<div className={styles.tableWrap}> <div className={classNames(styles.tableWrap, selfTableWrap)}>
{tips ? this._renderTips() : this._renderBtns()} {tips ? this._renderTips() : this._renderBtns()}
{this._renderData()} {this._renderData()}
{this._renderPagination()} {this._renderPagination()}
......
...@@ -53,7 +53,7 @@ ...@@ -53,7 +53,7 @@
.label { .label {
color: @textPrimaryColor; color: @textPrimaryColor;
margin-right: 25px; margin-right: 25px;
width: 66px; min-width: 66px;
text-align: right; text-align: right;
} }
...@@ -83,7 +83,7 @@ ...@@ -83,7 +83,7 @@
} }
} }
} }
.modalRowWrap{ .modalRowWrap {
margin-bottom: 0px; margin-bottom: 0px;
} }
} }
...@@ -94,14 +94,14 @@ ...@@ -94,14 +94,14 @@
//background-color: blue; //background-color: blue;
//border-top: 1px solid red; //border-top: 1px solid red;
} }
.formItem{ .formItem {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: flex-start; justify-content: flex-start;
:global .ant-form-item-control{ :global .ant-form-item-control {
line-height: 1.2; line-height: 1.2;
} }
} }
.timeStyle{ .timeStyle {
max-width: 320px; max-width: 320px;
} }
\ 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