消耗确认

src/components/form/index.styl

@@ -79,6 +79,9 @@
   align-self center
   margin-bottom 30px
 
+  &__inner
+    @extend .row
+
   &__disabled
     background-color #BBBBBB
 
@@ -89,3 +92,6 @@
 
     &__disabled
       color rgba(255, 255, 255, 0.5)
+
+.ml10
+  margin-left 10px

src/components/form/index.tsx

@@ -20,6 +20,7 @@ import ImageForm from './image'
 import { g, isBlank, show, debounce } from '../../utils/utils'
 import Consumables from '../../pages/consume/selected-consumables'
 import styles from './index.styl'
+import { ActivityIndicator } from '@ant-design/react-native'
 
 type IProps = {
   fields: IFromField[]
@@ -104,7 +105,7 @@ export default class Form extends Component<IProps> {
 
   render() {
     const { fields = [], data = {} } = this.props
-    const { scrollable, modal, canSubmit } = this.state
+    const { scrollable, modal, canSubmit, submiting } = this.state
 
     return (
       <View style={g(styles, 'container')}>
@@ -131,19 +132,34 @@ export default class Form extends Component<IProps> {
             })}
 
             <TouchableOpacity
-              style={g(styles, { 'submit-btn': true, 'submit-btn__disabled': !canSubmit })}
-              disabled={!canSubmit}
+              style={g(styles, {
+                'submit-btn': true,
+                'submit-btn__disabled': !canSubmit || submiting,
+              })}
+              disabled={!canSubmit || submiting}
               activeOpacity={0.8}
               onPress={this.submitHandler}
             >
+              {submiting ? (
+                <View style={g(styles, 'submit-btn__inner')}>
+                  <ActivityIndicator
+                    style={g(styles, 'submit-btn__loading')}
+                    color="rgba(255,255,255,0.5)"
+                  />
+                  <Text style={g(styles, 'submit-btn__text', 'submit-btn__text__disabled', 'ml10')}>
+                    提交中
+                  </Text>
+                </View>
+              ) : (
                 <Text
                   style={g(styles, {
                     'submit-btn__text': true,
-                  'btn-primary__text__disabled': !canSubmit,
+                    'submit-btn__text__disabled': !canSubmit,
                   })}
                 >
                   提交
                 </Text>
+              )}
             </TouchableOpacity>
           </View>
         </ScrollView>

src/pages/consume/consume.tsx

@@ -66,7 +66,6 @@ class Consume extends Component<IProps> {
   }
 
   state = {
-    scrollable: true,
     data: {
       sellerCode: this.props.userStore.userName,
     },
@@ -211,6 +210,7 @@ class Consume extends Component<IProps> {
   componentWillUnmount() {
     this.props.consumeStore.resetOrderLines()
     this.props.consumeStore.setSelectedLines([])
+    console.log('Consume page will unmount')
   }
 
   /**
@@ -502,10 +502,19 @@ class Consume extends Component<IProps> {
    * @description: 提交
    */
   async submitHandler() {
-    const { data } = this.state
+    const { data, submitting } = this.state
+
     data.lines = R.map(R.assoc('consumedQuantity', 1))(data.lines)
 
-    const res = await this.props.consumeStore.submit(data)
+    const res = await this.props.consumeStore.submit({ data })
+    if (res.errorCode === 0) {
+      this.props.navigation.navigate('Success', {
+        orderNumber: res.consumeOrderNumber,
+        title: '器械消耗',
+      })
+    } else {
+      show(res.errorMsg)
+    }
   }
 
   render() {

src/pages/index/index.tsx

@@ -73,7 +73,7 @@ class Index extends Component<IProps> {
   navigateToBizPage(fun: IFunction) {
     const pages = {
       MOBILE_BORROW_ORDER: '',
-      MOBILE_SELF_HELP_ORDER: '',
+      MOBILE_SELF_HELP_ORDER: 'Success',
       MOBILE_CONSUMP_CONFIRMA: 'Consume',
       MOBILE_DEVICE_INFORMATION: '',
       MOBILE_TRANSFER_APPLICATION: '',

src/pages/success/success.styl

+@import '../../assets/styles/base.styl'
+@import '../../assets/styles/variable.styl'
+
+.body
+  flex 1
+  justify-content center
+  align-items center
+
+.success
+  &-title
+    margin-top 10px
+    font-size 17px
+    color primary_text_color
+    font-family font_family_medium
+
+  &-text
+    margin-top 21px
+    font-size 14px
+    color second_text_color
+    font-family font_family_regular
+
+.btn
+  width 333px
+  height 50px
+  border-radius 25px
+  background-color primary_color
+  justify-content center
+  align-items center
+  margin-top 38px
+  margin-bottom 100px
+
+  &-text
+    color btn_color
+    font-size 17px
+    font-family font_family_regular

src/pages/success/success.tsx

+import React, { Component } from 'react'
+import { View, Text, ScrollView, Clipboard, Image, TouchableOpacity } from 'react-native'
+import { IOrganization, ISurgeryCollectHeader, IFee } from 'bonehouse'
+import * as R from 'ramda'
+import Header from '../../components/header/header'
+import { g, getFormItem, isBlank, isNotBlank, show } from '../../utils/utils'
+import styles from './success.styl'
+
+type IProps = {
+  navigation: any
+}
+
+export default ({ navigation }) => {
+  const { orderNumber, title } = navigation.state.params
+
+  return (
+    <View style={g(styles, 'container')}>
+      <Header title={title} backCallback={() => navigation.navigate('Main')} />
+
+      <View style={g(styles, 'body')}>
+        <Image
+          style={g(styles, 'success-icon')}
+          source={require('../../assets/images/cor_green.png')}
+        ></Image>
+        <Text style={g(styles, 'success-title')}>提交成功</Text>
+        <Text style={g(styles, 'success-text')}>订单号：{orderNumber || '未知订单号'}</Text>
+
+        <TouchableOpacity
+          style={g(styles, 'btn')}
+          activeOpacity={0.8}
+          onPress={async () => {
+            let hide
+            if (orderNumber) {
+              Clipboard.setString(orderNumber)
+              await Clipboard.getString()
+              hide = show('复制成功')
+            }
+            setTimeout(
+              () => {
+                hide && hide()
+                navigation.navigate('Main')
+              },
+              hide ? 1000 : 0,
+            )
+          }}
+        >
+          <Text style={g(styles, 'btn-text')}>复制订单号并返回主页</Text>
+        </TouchableOpacity>
+      </View>
+    </View>
+  )
+}

src/router.tsx

@@ -14,6 +14,7 @@ import Signin from './pages/signin/signin'
 import Consume from './pages/consume/consume'
 import Consumables from './pages/consume/consumables'
 import ConsumeFee from './pages/consume/fee'
+import Success from './pages/success/success'
 
 function createNavigator() {
   const options = {
@@ -88,6 +89,7 @@ function createNavigator() {
       Consume: { screen: Consume },
       Consumables: { screen: Consumables },
       ConsumeFee: { screen: ConsumeFee },
+      Success: { screen: Success },
     },
     { initialRouteName: 'Main', ...options },
   )

src/services/request.ts

@@ -56,8 +56,16 @@ export const request = (args: Partial<RequestConfig>) => {
       ...args,
     }
 
-    if (options.needToken) {
+    if (options.needToken && store.token) {
       options.data.accessToken = store.token
+      if (options.method.toUpperCase() === 'POST') {
+        const token = 'access_token=' + store.token
+        options.url += R.ifElse(
+          R.includes('?'),
+          R.always('&' + token),
+          R.always('?' + token),
+        )(options.url)
+      }
     }
     args.data = transformObject(options.data, 'toLine')
 

src/utils/utils.ts

@@ -105,6 +105,11 @@ export const show = (data: string, type = MsgType.INFO, position = Toast.positio
       toast = null
     },
   })
+  return () => {
+    if (isNotBlank(toast)) {
+      Toast.hide(toast)
+    }
+  }
 }
 
 const X_WIDTH = 375