Add tags

src/components/cameraComponent.js

@@ -161,6 +161,24 @@ class CameraComponent extends React.Component {
         .then((responseData) => {
           const response = JSON.parse(responseData);
           if (response.errorCode === 0) {
+            const name = 'addTags';// 添加标签
+            const PicUri = `${config.apiContextPath}/api/interface/user/${name}/invoke`;
+            console.info(PicUri);
+            const postjson = { uri: response.data[0], tags: ['当事人信息', '当事人'] };
+            console.info(JSON.stringify(postjson));
+            futch(PicUri, {
+              method: 'POST',
+              headers: {
+                'Content-Type': 'application/json',
+              },
+              body: JSON.stringify(postjson),
+            }, (progressEvent) => {
+              console.info(progressEvent);
+            })
+              .then(request => request.responseText)// response.text())
+              .then((responseData2) => {
+                console.info(responseData2);
+              });
             // 这里需要调用接口，对图片数据进行绑定，等待完善
             // 页面跳转，跳转到前面的详情的页面
             console.info('跳转');

src/components/picFlatListItem.js

+import React, { PureComponent } from 'react';
+import { TouchableOpacity, Text, View, StyleSheet, Dimensions } from 'react-native';
+import { Card, WingBlank, WhiteSpace } from 'antd-mobile';
+
+const totalWidth = Dimensions.get('window').width;
+class PicFlatListItem extends PureComponent {
+  onPress = () => {
+    this.props.onPressItem(this.props.item.id);
+  };
+
+  render() {
+    return (
+      <TouchableOpacity
+        {...this.props}
+        style={{ height: this.props.height }}
+        onPress={this.onPress}
+      >
+        <WingBlank size="lg">
+          <WhiteSpace size="lg" />
+          <Card>
+            <Card.Header
+              title={this.props.title}
+              extra={<Text style={Styles.cardText}>&gt;&gt;详情</Text>}
+            />
+            <Card.Body>
+              {
+                this.props.meta.map((m) => {
+                  if (this.props.item[m.key] !== this.props.title) {
+                    return (
+                      <Text key={m.label} style={Styles.cardBodyText}>{m.label}:<Text key={m.key} style={Styles.cardBodyText2}>{this.props.item[m.key]}</Text></Text>
+                    );
+                  } else {
+                    return (
+                      <View key={m.key} />
+                    );
+                  }
+                })
+              }
+            </Card.Body>
+          </Card>
+          <WhiteSpace size="lg" />
+        </WingBlank>
+        <WingBlank size="lg">
+          <WhiteSpace size="lg" />
+          <Card>
+            <Card.Header
+              title={this.props.title}
+              thumb="https://cloud.githubusercontent.com/assets/1698185/18039916/f025c090-6dd9-11e6-9d86-a4d48a1bf049.png"
+              extra={<Text style={Styles.cardText}>&gt;&gt;大图</Text>}
+            />
+            <Card.Body>
+              {
+                this.props.meta.map((m) => {
+                  if (this.props.item[m.key] !== this.props.title) {
+                    return (
+                      <Text key={m.label} style={Styles.cardBodyText}>{m.label}:<Text key={m.key} style={Styles.cardBodyText2}>{this.props.item[m.key]}</Text></Text>
+                    );
+                  } else {
+                    return (
+                      <View key={m.key} />
+                    );
+                  }
+                })
+              }
+            </Card.Body>
+            <Card.Footer content="上传时间：" extra={<Text>类别</Text>} />
+          </Card>
+          <WhiteSpace size="lg" />
+        </WingBlank>
+      </TouchableOpacity>
+    );
+  }
+}
+const Styles = StyleSheet.create({
+  row: {
+    height: 60,
+    borderBottomWidth: 1,
+    borderBottomColor: '#ccc',
+    flexDirection: 'row',
+    alignItems: 'center',
+  },
+  part: {
+    marginLeft: 5,
+    flex: 1,
+  },
+  unColor: {
+    color: '#575656',
+    marginTop: 8,
+    fontSize: 12,
+  },
+  link: {
+    color: '#1BB7FF',
+    marginTop: 2,
+  },
+  ScrollView: {
+    flex: 1,
+  },
+  container: {
+    flex: 1,
+    marginLeft: 10,
+    marginRight: 10,
+    flexDirection: 'column',
+    backgroundColor: 'white',
+  },
+  nm: {
+    color: '#333',
+    fontSize: 12,
+  },
+  nm1: {
+    color: '#333',
+    fontSize: 12,
+    marginLeft: 30,
+  },
+  nameView: {
+    paddingTop: 2,
+    flexDirection: 'row',
+    alignItems: 'flex-start',
+    marginLeft: 1,
+  },
+  item: {
+    flex: 1,
+    height: 60,
+    width: totalWidth,
+    padding: 1,
+    borderBottomWidth: 2,
+    borderBottomColor: '#ddd',
+    flexDirection: 'column',
+    alignItems: 'flex-start',
+    justifyContent: 'flex-start',
+  },
+  width50: {
+    marginLeft: 1,
+    marginRight: 40,
+    alignItems: 'flex-start',
+    justifyContent: 'flex-start',
+    backgroundColor: 'white',
+  },
+  rightIcon: {
+    position: 'absolute',
+    right: -2,
+    top: -30,
+    height: 15,
+    width: 15,
+  },
+  cardText: {
+    color: '#2196F3',
+    textAlign: 'right',
+  },
+  cardBodyText: {
+    marginBottom: 10,
+    marginLeft: 13,
+  },
+
+});
+export default PicFlatListItem;

src/components/roundProgressBarComponent.js

@@ -44,17 +44,6 @@ const styles = StyleSheet.create({
 });
 
 class PercentageCircle extends Component {
-  // propTypes: {
-  //   color: string,
-  //   bgcolor: PropTypes.string,
-  //   innerColor: React.PropTypes.string,
-  //   radius: React.PropTypes.number,
-  //   percent: React.PropTypes.number,
-  //   borderWidth: React.Proptypes.number,
-  //   textStyle: React.Proptypes.array,
-  //   disabled: React.PropTypes.bool,
-  // }
-
   constructor(props) {
     super(props);
     const { percent } = this.props;
@@ -69,7 +58,6 @@ class PercentageCircle extends Component {
     }
 
     this.state = {
-      percent: this.props.percent,
       borderWidth: this.props.borderWidth < 2 || !this.props.borderWidth ? 2 : this.props.borderWidth,
       leftTransformerDegree,
       rightTransformerDegree,
@@ -88,7 +76,6 @@ class PercentageCircle extends Component {
       rightTransformerDegree = `${percent * 3.6}deg`;
     }
     this.setState({
-      percent: this.props.percent,
       borderWidth: this.props.borderWidth < 2 || !this.props.borderWidth ? 2 : this.props.borderWidth,
       leftTransformerDegree,
       rightTransformerDegree,

src/models/dangshireninfo/dsrPicInfoList.js

+import { unionBy } from 'lodash';
+import { getData, getMeta } from '../../utils/DataTemplate';
+
+export default {
+  namespace: 'DSRPicInfoList',
+  state: {
+    sourceData: [],
+    metas: [],
+    PicId: '',
+    searchValue: '',
+  },
+  reducers: {
+    setPicId(state, { payload }) {
+      return {
+        ...state,
+        PicId: payload,
+      };
+    },
+    setList(state, { payload: { arrayData } }) {
+      const newSourceData = unionBy(state.sourceData, arrayData, 'id');
+      return { ...state, sourceData: newSourceData };
+    },
+    // 下拉刷新用到的，清空列表的数据
+    clearList(state) {
+      return { ...state, sourceData: [] };
+    },
+    setMetas(state, { payload }) {
+      return { ...state, metas: payload };
+    },
+    setSearchValue(state, { payload }) {
+      return {
+        ...state,
+        searchValue: payload,
+      };
+    },
+  },
+  effects: {
+    *jumpPage({ payload: id }, { put }) {
+      yield put({ type: 'setPicId', payload: id });
+      // 放大图片的页面，暂无
+    },
+    *getPicList({ payload }, { take, put, call, select }) {
+      const { clear, pName } = payload;
+      if (clear === 'clear') {
+        yield put({ type: 'clearList', payload: {} });
+      }
+      const { sourceData } = yield select(state => state.DSRPicInfoList);
+      const size = sourceData.length;
+      const coordinate = {
+        containerType: 'module',
+        containerName: 'query-DSRInfo',
+        datasourceName: 'QueryDSRInfoTable',
+      };
+      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 });
+      for (const row of result) {
+        yield put({ type: 'addDSR', payload: row });
+        yield take('addDSR/@@end');
+      }
+    },
+    *addDSR({ payload }, { put }) {
+      yield put({ type: 'setList', payload: { arrayData: [payload] } });
+    },
+  },
+};

src/models/welcome.js

@@ -5,6 +5,7 @@ import { checkUpdate } from '../services/update';
 import { update } from '../native/Updater';
 import config from '../utils/config';
 import { encrypt } from '../utils/helper';
+import app from '../index';
 
 export default {
   namespace: 'welcome',
@@ -13,7 +14,6 @@ export default {
   },
   reducers: {
     setPercent(state, { payload }) {
-      console.info(payload);
       return {
         ...state,
         percent: payload.progress,
@@ -24,21 +24,20 @@ export default {
     *init(ignored, { put, call }) {
       try {
         // yield call(codePush.sync);
-        const result = yield call(checkUpdate);
-        const { action, deploymentInfo, tokenId } = result;
-        if (action === 'update') {
-          const token = encrypt(tokenId);
-          // console.info(`${config.updateContextPath}/resource/${token}/${encodeURIComponent(deploymentInfo.uri)}`);
-          console.log('开始');
-          yield call(
-            update, `${config.updateContextPath}/resource/${token}/${encodeURIComponent(deploymentInfo.uri)}`,
-            (event) => {
-              put({ type: 'setPercent', payload: { progress: event.progress } });
-              console.info(event);
-            },
-          );
-          console.log('结束结束结束结束结束结束结束结束结束结束');
-        }
+        // const result = yield call(checkUpdate);
+        // const { action, deploymentInfo, tokenId } = result;
+        // if (action === 'update') {
+        //   const token = encrypt(tokenId);
+        //   // console.info(`${config.updateContextPath}/resource/${token}/${encodeURIComponent(deploymentInfo.uri)}`);
+        //   console.log('开始');
+        //   yield call(
+        //     update, `${config.updateContextPath}/resource/${token}/${encodeURIComponent(deploymentInfo.uri)}`,
+        //     (event) => {
+        //       app.getStore().dispatch({ type: 'welcome/setPercent', payload: { progress: event.progress } });
+        //     },
+        //   );
+        //   console.log('结束结束结束结束结束结束结束结束结束结束');
+        // }
       } catch (e) {
         console.log(e); // eslint-disable-line no-console
       }

src/routes/main/dangshireninfo/DSRInfoDetailScreen.js

@@ -28,6 +28,10 @@ class DSRInfoDetailScreen extends React.Component {
       }
     });
   };
+  goToViewPage =() => {
+    // this.props.dispatch(createAction('DSRInfoDetail/setEnable')(true));
+    this.props.navigation.navigate('DSRInfoFileView', { pID: this.props.navigation.state.params });
+  };
   validateNoNull = (rule, value, callback) => {
     if (value) {
       callback();
@@ -128,6 +132,13 @@ class DSRInfoDetailScreen extends React.Component {
               >
                 资料上传
               </Icon.Button>
+              <Icon.Button
+                name="eye"
+                backgroundColor="#08BBF9"
+                onPress={this.goToViewPage}
+              >
+                资料查看
+              </Icon.Button>
             </View>
             <WhiteSpace />
             <List>

src/routes/main/dangshireninfo/fileViewList.js

+import React, { Component } from 'react';
+import { Text, FlatList, View } from 'react-native';
+import { WingBlank, WhiteSpace } from 'antd-mobile';
+import { connect } from 'react-redux';
+import { createAction } from '../../../utils/index';
+import PicFlatListItem from '../../../components/picFlatListItem';
+import SearchComponent from '../../../components/searchComponent';
+
+@connect(({ DSRInfo }) => ({ DSRInfo/* , loading: !!loading.effects['obligeeInfo/getObligeeInfo'] */ }))
+class FileViewList extends Component {
+  componentDidMount() {
+    const { dispatch } = this.props;
+    dispatch(createAction('DSRInfo/getDSRList')({ clear: '', pDangShiRenBianHao: this.props.DSRInfo.searchValue }));
+  }
+  onSearchSubmit = (pDangShiRenBianHao) => {
+    this.props.dispatch(createAction('DSRInfo/getDSRList')({ clear: 'clear', pDangShiRenBianHao }));
+  };
+  onSearchChange = (pName) => {
+    this.props.dispatch(createAction('DSRInfo/setSearchValue')(pName));
+  };
+  // 上拉加载更多
+  onEndReached = () => {
+    // 以下是制造新数据
+    if (!this.props.loading) {
+      // console.info('执行了上啦加载');
+      this.props.dispatch(createAction('DSRInfo/getDSRList')({ clear: '', pDangShiRenBianHao: this.props.DSRInfo.searchValue }));
+    }
+  };
+  onPressItem = (id) => {
+    this.props.dispatch(createAction('DSRInfo/jumpPage')(id));
+  };
+  getItemLayout = (data, index) => (
+    { length: 200, offset: (200 + 1) * index, index }
+  );
+  /**
+   * 此函数用于为给定的item生成一个不重复的Key。
+   * Key的作用是使React能够区分同类元素的不同个体，以便在刷新时能够确定其变化的位置，减少重新渲染的开销。
+   * 若不指定此函数，则默认抽取item.key作为key值。
+   * 若item.key也不存在，则使用数组下标
+   *
+   * @param item
+   * @private
+   */
+    // 这里指定使用数组下标作为唯一索引
+  keyExtractor = item => `${item.id}`;
+  // Footer布局
+  renderFooter = () => (
+    <WingBlank size="lg">
+      <WhiteSpace size="lg" />
+      <Text style={{ textAlign: 'center', justifyContent: 'center' }}>到底了！！！</Text>
+      <WhiteSpace size="lg" />
+    </WingBlank>
+  );
+  // 空布局
+  renderEmptyView = () => (
+    <WingBlank size="lg">
+      <WhiteSpace size="lg" />
+      <Text style={{ textAlign: 'center', justifyContent: 'center' }}>当前无内容</Text>
+      <WhiteSpace size="lg" />
+    </WingBlank>
+  );
+  // 下拉刷新
+  renderRefresh = () => {
+    if (!this.props.loading) {
+      this.props.dispatch(createAction('DSRInfo/getDSRList')({ clear: 'clear', pDangShiRenBianHao: this.props.DSRInfo.searchValue }));
+    }
+  };
+  /**
+   * 使用箭头函数防止不必要的re-render；
+   * 如果使用bind方式来绑定onPressItem，每次都会生成一个新的函数，导致props在===比较时返回false，
+   * 从而触发自身的一次不必要的重新render，也就是FlatListItem组件每次都会重新渲染。
+   *
+   * @param id
+   * @private
+   */
+  renderItem = ({ item }) => {
+    return (
+      <PicFlatListItem
+        height={150}
+        title={item.dangShiRenXingMing}
+        meta={this.props.DSRInfo.metas}
+        item={item}
+        onPressItem={this.onPressItem}
+      />
+    );
+  };
+
+  render() {
+    return (
+      <View style={{ marginBottom: 50 }}>
+        <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是加上分割线的高度
+        />
+      </View>
+    );
+  }
+}
+export default FileViewList;

src/routes/main/dangshireninfo/index.js

 import { StackNavigator } from 'react-navigation';
 import DSRInfoScreen from './DSRInfoScreeen';
 import DSRInfoDetailScreen from './DSRInfoDetailScreen';
+import FileViewList from './fileViewList';
 
 const DSRErJiScreen = StackNavigator(
   {
@@ -10,6 +11,9 @@ const DSRErJiScreen = StackNavigator(
     DSRInfoDetail: {
       screen: DSRInfoDetailScreen,
     },
+    DSRInfoFileView: {
+      screen: FileViewList,
+    },
   },
   {
     headerMode: 'none',