提交 e6d8185d authored 作者: 吴强's avatar 吴强

完成搜索的功能

上级 6066ffdd
/**
* Created by zhouhuan on 2017/11/3.
*/
import React, { PureComponent } from 'react';
import { SearchBar } from 'antd-mobile';
class SearchComponent extends PureComponent {
state = {
value: '',
};
onSubmit = () => {
this.props.onSearchSubmit(this.state.value);
};
onChange= (value) => {
this.setState({ value });
this.props.onSearchChange(value);
};
render() {
return (
<SearchBar
{...this.props}
value={this.state.value}
placeholder="搜索"
onSubmit={this.onSubmit}
onChange={this.onChange}
/>
);
}
}
export default SearchComponent;
......@@ -8,6 +8,7 @@ export default {
sourceData: [],
metas: [],
DSRID: '',
searchValue: '',
},
reducers: {
setDSRID(state, { payload }) {
......@@ -27,6 +28,13 @@ export default {
setMetas(state, { payload }) {
return { ...state, metas: payload };
},
setSearchValue(state, { payload }) {
console.info(payload);
return {
...state,
searchValue: payload,
};
},
},
effects: {
*jumpPage({ payload: id }, { put }) {
......@@ -37,7 +45,9 @@ export default {
}));
},
*getDSRList({ payload }, { take, put, call, select }) {
if (payload === 'clear') {
const { clear, pName } = payload;
console.info(payload);
if (clear === 'clear') {
yield put({ type: 'clearList', payload: {} });
}
const { sourceData } = yield select(state => state.DSRInfo);
......@@ -47,7 +57,9 @@ export default {
containerName: 'query-DSRInfo',
datasourceName: 'QueryDSRInfoTable',
};
const result = yield call(getData, coordinate, { pst: size, psz: 10 });
const result = yield call(getData, coordinate, { pst: size, psz: 10, params: { pName } });
console.info('查询的结果');
console.info(result);
const meta = yield call(getMeta, coordinate);
yield put({ type: 'setMetas', payload: meta });
// const result = yield call('', 'query-DSRFWInfo', 'QueryfwTable', { pst: size, psz: 10 });
......
......@@ -7,6 +7,7 @@ export default {
sourceData: [],
metas: [],
houseID: '',
searchValue: '',
},
reducers: {
setHouseID(state, { payload }) {
......@@ -15,6 +16,12 @@ export default {
houseID: payload,
};
},
setSearchValue(state, { payload }) {
return {
...state,
searchValue: payload,
};
},
setList(state, { payload: { arrayData } }) {
return { ...state, sourceData: [...state.sourceData, ...arrayData] };
},
......@@ -34,7 +41,8 @@ export default {
}));
},
*getHouseList({ payload }, { take, put, call, select }) {
if (payload === 'clear') {
const { clear, pFWDiZhi } = payload;
if (clear === 'clear') {
yield put({ type: 'clearList', payload: {} });
}
const { sourceData } = yield select(state => state.ListHouse);
......@@ -44,7 +52,7 @@ export default {
containerName: 'query-DSRFWInfo',
datasourceName: 'QueryfwTable',
};
const result = yield call(getData, coordinate, { pst: size, psz: 10 });
const result = yield call(getData, coordinate, { pst: size, psz: 10, params: { pFWDiZhi } });
const meta = yield call(getMeta, coordinate);
yield put({ type: 'setMetas', payload: meta });
for (const row of result) {
......
......@@ -16,6 +16,7 @@ export default {
disabled: true,
types: '',
peopleID: '',
searchValue: '',
},
effects: {
*jumpPage({ payload: id }, { put }) {
......@@ -26,23 +27,30 @@ export default {
}));
},
*getPeopleInfo({ payload }, { put, call, select, take }) {
console.log(payload);
if (payload === 'clear') {
const { clear, pxingMing } = payload;
if (clear === 'clear') {
yield put({ type: 'clearList', payload: {} });
}
const { sourceData } = yield select(state => state.peopleInfo);
console.info(sourceData);
const size = sourceData.length;
const coordinate = {
containerType: 'module',
containerName: 'query-RKInfo',
datasourceName: 'QueryRKTable',
};
const result = yield call(getData, coordinate, { pst: size, psz: 10 });
const meta = yield call(getMeta, coordinate);
yield put({ type: 'setMetas', payload: meta });
for (const row of result) {
yield put({ type: 'addPeople', payload: row });
yield take('addPeople/@@end');
console.info(`pst${size}params${pxingMing}`);
try {
const result = yield call(getData, coordinate, { pst: size, psz: 10, params: { pxingMing } });
console.info(sourceData);
const meta = yield call(getMeta, coordinate);
yield put({ type: 'setMetas', payload: meta });
for (const row of result) {
yield put({ type: 'addPeople', payload: row });
yield take('addPeople/@@end');
}
} catch (err) {
console.info(err);
}
},
*addPeople({ payload }, { put }) {
......@@ -131,7 +139,7 @@ export default {
},
// 下拉刷新用到的,清空列表的数据
clearList(state) {
return { ...state, sourceData: {} };
return { ...state, sourceData: [] };
},
getPeopleDetailInfo(state, { payload }) {
return {
......@@ -169,6 +177,12 @@ export default {
types: payload,
};
},
setSearchValue(state, { payload }) {
return {
...state,
searchValue: payload,
};
},
},
};
import React, { Component } from 'react';
import { Text, FlatList } from 'react-native';
import { Text, FlatList, View } from 'react-native';
import { WingBlank, WhiteSpace } from 'antd-mobile';
import { connect } from 'react-redux';
import { createAction } from '../../../utils/index';
import FlatListItem from '../../../components/FlatListItem';
import SearchComponent from '../../../components/searchComponent';
@connect(({ DSRInfo }) => ({ DSRInfo/* , loading: !!loading.effects['obligeeInfo/getObligeeInfo'] */ }))
class DSRInfoScreeen extends Component {
componentDidMount() {
const { dispatch } = this.props;
console.info('初始加载');
dispatch(createAction('DSRInfo/getDSRList')());
console.info('界面加载完成是,输出的searchValue');
console.info(this.props.DSRInfo);
dispatch(createAction('DSRInfo/getDSRList')({ clear: '', pName: this.props.DSRInfo.searchValue }));
}
onSearchSubmit = (pName) => {
console.info('点击搜索时,输出的searchValue前');
console.info(this.props.DSRInfo);
this.props.dispatch(createAction('DSRInfo/getDSRList')({ clear: 'clear', pName }));
console.info('点击搜索时,输出的searchValue后');
console.info(this.props.DSRInfo);
};
onSearchChange = (pName) => {
this.props.dispatch(createAction('DSRInfo/setSearchValue')(pName));
console.info('每次改变的值searchValue');
console.info(this.props.DSRInfo);
};
// 上拉加载更多
onEndReached = () => {
// 以下是制造新数据
if (!this.props.loading) {
this.props.dispatch(createAction('DSRInfo/getDSRList')());
console.info('执行了上啦加载');
this.props.dispatch(createAction('DSRInfo/getDSRList')({ clear: '', pName: this.props.DSRInfo.searchValue }));
}
};
onPressItem = (id) => {
......@@ -55,7 +70,7 @@ class DSRInfoScreeen extends Component {
// 下拉刷新
renderRefresh = () => {
if (!this.props.loading) {
this.props.dispatch(createAction('DSRInfo/getDSRList')('clear'));
this.props.dispatch(createAction('DSRInfo/getDSRList')({ clear: 'clear', pName: this.props.DSRInfo.searchValue }));
}
};
/**
......@@ -79,21 +94,24 @@ class DSRInfoScreeen extends Component {
render() {
return (
<FlatList
data={this.props.DSRInfo.sourceData}
keyExtractor={this.keyExtractor}
renderItem={this.renderItem}
// 决定当距离内容最底部还有多远时触发onEndReached回调;数值范围0~1,例如:0.5表示可见布局的最底端距离content最底端等于可见布局一半高度的时候调用该回调
onEndReachedThreshold={0.3}
// 当列表被滚动到距离内容最底部不足onEndReacchedThreshold设置的距离时调用
onEndReached={this.onEndReached}
ListFooterComponent={this.renderFooter}
ListEmptyComponent={this.renderEmptyView}
refreshing={this.props.loading || false}
onRefresh={this.renderRefresh}
<View>
<SearchComponent onSearchSubmit={this.onSearchSubmit} onSearchChange={this.onSearchChange} />
<FlatList
data={this.props.DSRInfo.sourceData}
keyExtractor={this.keyExtractor}
renderItem={this.renderItem}
// 决定当距离内容最底部还有多远时触发onEndReached回调;数值范围0~1,例如:0.5表示可见布局的最底端距离content最底端等于可见布局一半高度的时候调用该回调
onEndReachedThreshold={0.3}
// 当列表被滚动到距离内容最底部不足onEndReacchedThreshold设置的距离时调用
onEndReached={this.onEndReached}
ListFooterComponent={this.renderFooter}
ListEmptyComponent={this.renderEmptyView}
refreshing={this.props.loading || false}
onRefresh={this.renderRefresh}
// 是一个可选的优化,用于避免动态测量内容,+1是加上分割线的高度
/>
// 是一个可选的优化,用于避免动态测量内容,+1是加上分割线的高度
/>
</View>
);
}
}
......
import React, { Component } from 'react';
import { View } from 'react-native';
import { Button, SearchBar } from 'antd-mobile';
import { StackNavigator, NavigationActions } from 'react-navigation';
import { connect } from 'react-redux';
import ListHouContent from './houseinfo/listhouse';
......@@ -8,10 +7,6 @@ import Empty from '../empty';
import ErJiScreen from './houseinfo/erJiScreen';
class HouseList extends Component {
state = {
value: '',
};
action = () => {
this.props.dispatch(NavigationActions.navigate({
routeName: 'ERJi',
......@@ -21,20 +16,6 @@ class HouseList extends Component {
render() {
return (
<View style={{ flex: 1 }}>
<SearchBar
value={this.state.value}
placeholder="搜索"
onSubmit={value => console.log(value, 'onSubmit')}
onClear={value => console.log(value, 'onClear')}
onFocus={() => console.log('onFocus')}
onBlur={() => console.log('onBlur')}
onCancel={() => console.log('onCancel')}
onChange={(value) => {
this.setState({
value,
});
}}
/>
<ListHouContent navigation={this.props.navigation} />
</View>
);
......
import React, { Component } from 'react';
import { FlatList, Text } from 'react-native';
import { FlatList, Text, View } from 'react-native';
import { Card, WingBlank, WhiteSpace } from 'antd-mobile';
import { connect } from 'react-redux';
import { createAction } from '../../../utils';
import FlatListItem from '../../../components/FlatListItem';
import SearchComponent from '../../../components/searchComponent';
@connect(({ ListHouse, loading }) => ({ ListHouse, loading: !!loading.effects['ListHouse/getHouseList'] }))
class ListHouContent extends Component {
componentDidMount() {
const { dispatch } = this.props;
dispatch(createAction('ListHouse/getHouseList')());
dispatch(createAction('ListHouse/getHouseList')({ clear: '', pFWDiZhi: this.props.ListHouse.searchValue }));
}
onSearchSubmit = (pFWDiZhi) => {
this.props.dispatch(createAction('ListHouse/getHouseList')({ clear: 'clear', pFWDiZhi }));
};
onSearchChange = (pFWDiZhi) => {
this.props.dispatch(createAction('ListHouse/setSearchValue')(pFWDiZhi));
};
// 上拉加载更多
onEndReached = () => {
// 以下是制造新数据
if (!this.props.loading) {
this.props.dispatch(createAction('ListHouse/getHouseList')());
this.props.dispatch(createAction('ListHouse/getHouseList')({ clear: '', pFWDiZhi: this.props.ListHouse.searchValue }));
}
};
onPressItem = (id) => {
......@@ -60,7 +66,7 @@ class ListHouContent extends Component {
// 下拉刷新
renderRefresh = () => {
if (!this.props.loading) {
this.props.dispatch(createAction('ListHouse/getHouseList')('clear'));
this.props.dispatch(createAction('ListHouse/getHouseList')({ clear: 'clear', pFWDiZhi: this.props.ListHouse.searchValue }));
}
};
/**
......@@ -81,25 +87,26 @@ class ListHouContent extends Component {
/>
);
};
render() {
return (
<FlatList
data={this.props.ListHouse.sourceData}
keyExtractor={this.keyExtractor}
renderItem={this.renderItem}
// 决定当距离内容最底部还有多远时触发onEndReached回调;数值范围0~1,例如:0.5表示可见布局的最底端距离content最底端等于可见布局一半高度的时候调用该回调
onEndReachedThreshold={0.3}
// 当列表被滚动到距离内容最底部不足onEndReacchedThreshold设置的距离时调用
onEndReached={this.onEndReached}
ListHeaderComponent={this.renderHeader}
ListFooterComponent={this.renderFooter}
ListEmptyComponent={this.renderEmptyView}
refreshing={this.props.loading}
onRefresh={this.renderRefresh}
// 是一个可选的优化,用于避免动态测量内容,+1是加上分割线的高度
/>
<View>
<SearchComponent onSearchSubmit={this.onSearchSubmit} onSearchChange={this.onSearchChange} />
<FlatList
data={this.props.ListHouse.sourceData}
keyExtractor={this.keyExtractor}
renderItem={this.renderItem}
// 决定当距离内容最底部还有多远时触发onEndReached回调;数值范围0~1,例如:0.5表示可见布局的最底端距离content最底端等于可见布局一半高度的时候调用该回调
onEndReachedThreshold={0.1}
// 当列表被滚动到距离内容最底部不足onEndReacchedThreshold设置的距离时调用
onEndReached={this.onEndReached}
ListHeaderComponent={this.renderHeader}
ListFooterComponent={this.renderFooter}
ListEmptyComponent={this.renderEmptyView}
refreshing={this.props.loading}
onRefresh={this.renderRefresh}
// 是一个可选的优化,用于避免动态测量内容,+1是加上分割线的高度
/>
</View>
);
}
}
......
......@@ -8,21 +8,27 @@ import { WingBlank, WhiteSpace } from 'antd-mobile';
import { connect } from 'react-redux';
import { createAction } from '../../../utils';
import FlatListItem from '../../../components/FlatListItem';
import SearchComponent from '../../../components/searchComponent';
@connect(({ peopleInfo, loading }) => ({ peopleInfo, loading: !!loading.effects['peopleInfo/getPeopleInfo'] }))
class PeopleInfo extends React.Component {
componentDidMount() {
this.props.dispatch(createAction('peopleInfo/getPeopleInfo')());
this.props.dispatch(createAction('peopleInfo/getPeopleInfo')({ clear: '', pxingMing: this.props.peopleInfo.searchValue }));
}
onSearchSubmit = (pxingMing) => {
this.props.dispatch(createAction('peopleInfo/getPeopleInfo')({ clear: 'clear', pxingMing }));
};
onSearchChange = (pxingMing) => {
this.props.dispatch(createAction('peopleInfo/setSearchValue')(pxingMing));
console.info(this.props.peopleInfo);
};
onPressItem = (id) => {
console.log(id);
this.props.dispatch(createAction('peopleInfo/jumpPage')(id));
// this.props.dispatch(createAction('peopleInfo/getPeopleDetail')(id));
};
onEndReached = () => {
// 以下是制造新数据
if (!this.props.loading) {
this.props.dispatch(createAction('peopleInfo/getPeopleInfo')());
this.props.dispatch(createAction('peopleInfo/getPeopleInfo')({ clear: '', pxingMing: this.props.peopleInfo.searchValue }));
}
};
addClick =() => {
......@@ -32,11 +38,10 @@ class PeopleInfo extends React.Component {
// 下拉刷新
renderRefresh = () => {
if (!this.props.loading) {
this.props.dispatch(createAction('peopleInfo/getPeopleInfo')('clear'));
this.props.dispatch(createAction('peopleInfo/getPeopleInfo')({ clear: 'clear', pxingMing: this.props.peopleInfo.searchValue }));
}
};
renderItem =({ item }) => {
// console.log(item);
return (
<FlatListItem
title={item.xingMing}
......@@ -65,12 +70,11 @@ class PeopleInfo extends React.Component {
/>);
return (
<View>
<View>
<WingBlank size="lg">
<WhiteSpace size="lg" />
{myButton}
</WingBlank>
</View>
<SearchComponent onSearchSubmit={this.onSearchSubmit} onSearchChange={this.onSearchChange} />
<WingBlank size="lg">
<WhiteSpace size="lg" />
{myButton}
</WingBlank>
{flatList}
</View>
);
......
......@@ -34,18 +34,12 @@ const defaultDateFormat = 'YYYY-MM-DD';
const defaultTimeFormat = 'HH:mm:ss';
const defaultDateTimeFormat = `${defaultDateFormat} ${defaultTimeFormat}`;
// eslint-disable-next-line no-underscore-dangle
const _apiContextPath = process.env.NODE_ENV === 'development' ? '' : apiContextPath;
// eslint-disable-next-line no-underscore-dangle
const _contextPath = process.env.NODE_ENV === 'development' ? '' : contextPath;
const config = {
name: 'Jbpm Demo',
productId: 'manager-app-sz',
footerText: '上海铂蓝信息科技有限公司',
logo: `${_contextPath}/logo.png`,
contextPath: _contextPath,
apiContextPath: `http://192.168.1.22:8080/bm${_apiContextPath}`,
contextPath: '',
apiContextPath: 'http://192.168.1.22:8080/bm',
defaultDateFormat,
defaultTimeFormat,
defaultDateTimeFormat,
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论