self audio

app/Router.js

@@ -3,7 +3,7 @@ import { Easing, Animated } from 'react-native'
 import { createStackNavigator, createAppContainer } from 'react-navigation'
 import { createStackNavigator, createAppContainer } from 'react-navigation'
 import LoginPage from './containers/login/LoginPage'
 import LoginPage from './containers/login/LoginPage'
 import HomePage from './containers/home/HomePage'
 import HomePage from './containers/home/HomePage'
-// import SelfOrderPage from './containers/selfOrder/SelfOrderPage'
+import SelfOrderPage from './containers/selfOrder/SelfOrderPage'
 import ChooseProductPage from './containers/selfOrder/module/ChooseProductPage'
 import ChooseProductPage from './containers/selfOrder/module/ChooseProductPage'
 import SearchPage from './containers/selfOrder/module/SearchPage'
 import SearchPage from './containers/selfOrder/module/SearchPage'
 import EditThirdLevelPage from './containers/selfOrder/module/EditThirdLevelPage'
 import EditThirdLevelPage from './containers/selfOrder/module/EditThirdLevelPage'
@@ -56,6 +56,7 @@ const Router = createAppContainer(
     {
     {
       LoginPage: { screen: LoginPage },
       LoginPage: { screen: LoginPage },
       HomePage: { screen: HomePage },
       HomePage: { screen: HomePage },
+      SelfOrderPage: { screen: SelfOrderPage },
       SelfOrder: { screen: SelfOrder },
       SelfOrder: { screen: SelfOrder },
       ChooseProductPage: { screen: ChooseProductPage },
       ChooseProductPage: { screen: ChooseProductPage },
       SearchPage: { screen: SearchPage },
       SearchPage: { screen: SearchPage },

src/components/form/audio.styl

+@import '../../assets/styles/base.styl'
+@import '../../assets/styles/variable.styl'
+
+.audio
+  background-color #fff
+  padding 18px
+  margin-bottom 18px
+
+.not-record
+  &-tip
+    font-size 18px
+    padding-bottom 20px
+    font-family font_family_regular
+
+.record
+  &-btn
+    @extend .row
+    @extend .middle
+    @extend .center
+    align-self center
+    background-color dis_sub_color
+    width 150px
+    height 48px
+    border-radius 24px
+    margin-top 20px
+    margin-bottom 20px
+
+    &__icon
+      height 20px
+
+    &__text
+      font-size second_text_size
+      color #333
+
+.recorded
+  @extend .row
+  align-items center
+
+  &-item
+    background-color home_background_color
+    padding 10px
+    border-radius 10px
+
+    &__text
+      font-size second_text_size
+      font-family font_family_regular
+
+    &__delete
+      padding 0 8px
+      background-color primary_color
+      height 22px
+      @extend .middle
+      border-radius 5px
+      margin-left 20px
+
+      &-text
+        font-size third_text_size
+        color #fff
+        line-height 22px
+
+.unactive
+  display none
\ No newline at end of file

src/components/form/audio.tsx

+/*
+ * @FilePath: /BoneHouse_Business_APP/src/components/form/audio.tsx
+ * @Author: peii
+ * @Date: 2021-06-19 22:37:22
+ * @LastEditTime: 2022-11-21 14:51:12
+ * @LastEditors: PEII
+ * @Vision: 1.0
+ * @Description: 录音组件
+ */
+// @ts-nocheck
+
+import React, { Component } from 'react'
+import { View, Text, Image, TouchableOpacity, Alert, Linking, Platform, NativeModules } from 'react-native'
+import Sound from 'react-native-sound'
+import { IFormField } from 'bonehouse'
+import * as R from 'ramda'
+import { AudioRecorder, AudioUtils } from 'react-native-audio'
+import { isBlank, show, isNotBlank, g } from '../../utils/utils'
+import { MsgType } from '../../enums'
+import styles from './audio.styl'
+// import Container from '../../inversify'
+// import { TYPES } from '../../inversify/types'
+// import Service from '../../services/service'
+
+type IProps = {
+  item: IFormField
+  value: string
+  onChange: Function
+}
+
+type IState = {
+  audioPath: string
+  hasPermission: boolean
+  currentTime: number
+  recorded: boolean
+}
+
+export default class Audio extends Component<IProps, IState> {
+  state = {
+    audioPath: AudioUtils.DocumentDirectoryPath + `/${new Date().getTime()}.aac`, // 文件路径
+    hasPermission: false,
+    recorded: false,
+    currentTime: 0,
+  }
+  sound = null
+
+  constructor(props: IProps) {
+    super(props)
+    this.openAppSetting = this.openAppSetting.bind(this)
+    this.requestAudioPermission = this.requestAudioPermission.bind(this)
+    this.prepareRecordingPath = this.prepareRecordingPath.bind(this)
+    this.recordHandler = this.recordHandler.bind(this)
+    this.stopRecordingHandler = this.stopRecordingHandler.bind(this)
+    this.deleteHandler = this.deleteHandler.bind(this)
+    this.playHandler = this.playHandler.bind(this)
+  }
+
+  componentDidMount() {
+    this.requestAudioPermission()
+  }
+
+  /**
+   * @description: 打开设置
+   * @param {*}
+   * @return {*}
+   */
+  openAppSetting() {
+    Alert.alert('提示信息', 'APP需要使用录音，请打开录音权限允许APP使用', [
+      {
+        text: '设置',
+        onPress: () => {
+          if (Platform.OS == 'ios') {
+            Linking.openURL('app-settings:').catch(err => console.log('error', err))
+          } else if (Platform.OS == 'android') {
+            NativeModules.OpenSettings.openNetworkSettings((data: any) => {
+              console.log('call back data', data)
+            }).catch((err: any) => console.log('android', err))
+          }
+        },
+      },
+      {
+        text: '取消',
+      },
+    ])
+  }
+
+  /**
+   * @description: 请求录音权限
+   * @param {*}
+   * @return {*}
+   */
+  requestAudioPermission() {
+    AudioRecorder.requestAuthorization().then(isAuthor => {
+      console.log('是否授权: ' + isAuthor)
+      if (!isAuthor) return this.openAppSetting()
+
+      this.setState({ hasPermission: isAuthor })
+      // this.prepareRecordingPath(this.state.audioPath)
+
+      // 录音进展
+      AudioRecorder.onProgress = data => {
+        this.setState({
+          currentTime: Math.ceil(data.currentTime),
+        })
+      }
+      // 完成录音
+      AudioRecorder.onFinished = data => {
+        // data 录音数据
+        console.log(data)
+      }
+    })
+  }
+
+  /**
+   * @description: 设置录音路径
+   * @param {string} path
+   * @return {*}
+   */
+  prepareRecordingPath(path: string) {
+    const option = {
+      SampleRate: 44100.0, //采样率
+      Channels: 2, //通道
+      AudioQuality: 'High', //音质
+      AudioEncoding: 'aac', //音频编码
+      OutputFormat: 'mpeg_4', //输出格式
+      MeteringEnabled: false, //是否计量
+      MeasurementMode: false, //测量模式
+      AudioEncodingBitRate: 32000, //音频编码比特率
+      IncludeBase64: true, //是否是base64格式
+      AudioSource: 0, //音频源
+    }
+    AudioRecorder.prepareRecordingAtPath(path, option as any)
+  }
+
+  /**
+   * @description: 录音操作
+   * @param {*}
+   * @return {*}
+   */
+  async recordHandler() {
+    try {
+      if (!this.state.hasPermission) return this.openAppSetting()
+
+      await this.prepareRecordingPath(this.state.audioPath)
+      this.sound = null
+      AudioRecorder.startRecording()
+      show('录音开始')
+    } catch (err) {
+      console.error(err)
+    }
+  }
+
+  /**
+   * @description: 录音完成
+   * @param {*}
+   * @return {*}
+   */
+  async stopRecordingHandler() {
+    if (!this.state.hasPermission) return
+
+    try {
+      await AudioRecorder.stopRecording()
+      show('录音完成')
+      this.setState({ recorded: true })
+    } catch (error) {}
+  }
+
+  /**
+   * @description: 录音播放
+   * @param {*}
+   * @return {*}
+   */
+  playHandler() {
+    if (this.state.playing) return
+
+    if (isBlank(this.sound)) {
+      this.sound = new Sound(this.state.audioPath, '', err => {
+        if (err) {
+          return show('音频加载失败')
+        }
+        this.setState({ playing: true })
+        this.sound.play(success => {
+          this.setState({ playing: false })
+          success ? show('播放完毕') : show('播放失败')
+        })
+      })
+    } else {
+      this.setState({ playing: true })
+      this.sound.play(success => {
+        this.setState({ playing: false })
+        success ? show('播放完毕') : show('播放失败')
+      })
+    }
+  }
+
+  /**
+   * @description: 删除操作
+   * @param {*}
+   * @return {*}
+   */
+  deleteHandler() {
+    this.setState({ recorded: false })
+    this.sound = null
+  }
+
+  render() {
+    const { recorded, currentTime } = this.state
+
+    return (
+      <View style={g(styles, 'audio')}>
+        <View style={g(styles, { 'not-record': true, unactive: recorded })}>
+          <Text style={g(styles, 'not-record-tip')}>还有什么要安排的，可录音备注哟！</Text>
+          <TouchableOpacity
+            style={g(styles, 'record-btn')}
+            touchableOpacity={0.8}
+            onLongPress={this.recordHandler.bind(this)}
+            onPressOut={this.stopRecordingHandler}
+            ref={ref => (this.recordBtnRef = ref)}
+          >
+            <Image
+              style={g(styles, 'record-btn__icon')}
+              source={require('../../assets/images/record_icon.png')}
+              resizeMode="contain"
+            />
+            <Text style={g(styles, 'record-btn__text')}>长按录音</Text>
+          </TouchableOpacity>
+        </View>
+        <View style={g(styles, { recorded: true, unactive: !recorded })}>
+          <TouchableOpacity style={g(styles, 'recorded-item')} onPress={this.playHandler}>
+            <Text style={g(styles, 'recorded-item__text')}>点击播放 {currentTime}"</Text>
+          </TouchableOpacity>
+          <TouchableOpacity style={g(styles, 'recorded-item__delete')} onPress={this.deleteHandler}>
+            <Text style={g(styles, 'recorded-item__delete-text')}>删除</Text>
+          </TouchableOpacity>
+        </View>
+      </View>
+    )
+  }
+}

src/components/form/index.tsx

@@ -19,6 +19,7 @@ import Radio from './radio'
 import Input from './input'
 import Input from './input'
 import DatePicker from './date'
 import DatePicker from './date'
 import ImageForm from './image'
 import ImageForm from './image'
+import Audio from './audio'
 import { g, isBlank, show, debounce } from '../../utils/utils'
 import { g, isBlank, show, debounce } from '../../utils/utils'
 import styles from './index.styl'
 import styles from './index.styl'
 
 
@@ -33,6 +34,7 @@ const formComponents = {
   [FieldType.DATE]: DatePicker,
   [FieldType.DATE]: DatePicker,
   [FieldType.IMAGE]: ImageForm,
   [FieldType.IMAGE]: ImageForm,
   [FieldType.RADIO]: Radio,
   [FieldType.RADIO]: Radio,
+  [FieldType.VOICE]: Audio,
 }
 }
 
 
 export default class Form extends Component<IProps> {
 export default class Form extends Component<IProps> {

src/pages/order/self.tsx

@@ -2,7 +2,7 @@
  * @FilePath: /BoneHouse_Business_APP/src/pages/order/self.tsx
  * @FilePath: /BoneHouse_Business_APP/src/pages/order/self.tsx
  * @Author: peii
  * @Author: peii
  * @Date: 2021-07-13 22:40:12
  * @Date: 2021-07-13 22:40:12
- * @LastEditTime: 2022-11-04 18:56:41
+ * @LastEditTime: 2022-11-21 15:21:52
  * @LastEditors: PEII
  * @LastEditors: PEII
  * @Vision: 1.0
  * @Vision: 1.0
  * @Description: 自助下单
  * @Description: 自助下单
@@ -37,6 +37,7 @@ type IState = {
   data: { [key: string]: any[] }
   data: { [key: string]: any[] }
   formItems: IFormField[]
   formItems: IFormField[]
   doctorNames: []
   doctorNames: []
+  invs: {}
 }
 }
 
 
 class SelfOrder extends Component<IProps, IState> {
 class SelfOrder extends Component<IProps, IState> {
@@ -53,6 +54,7 @@ class SelfOrder extends Component<IProps, IState> {
       Caller: 'dingding',
       Caller: 'dingding',
     },
     },
     formItems: [],
     formItems: [],
+    invs: {},
   }
   }
 
 
   componentDidMount() {
   componentDidMount() {
@@ -284,7 +286,7 @@ class SelfOrder extends Component<IProps, IState> {
    * @return {*}
    * @return {*}
    */
    */
   setBillToSitesCallback() {
   setBillToSitesCallback() {
-    const { formItems, data, doctorNames } = this.state
+    let { formItems, data, doctorNames } = this.state
     const { billToSiteCode } = data
     const { billToSiteCode } = data
 
 
     const item = getFormItem(formItems, 'shipToSiteCode')
     const item = getFormItem(formItems, 'shipToSiteCode')
@@ -328,28 +330,31 @@ class SelfOrder extends Component<IProps, IState> {
    * @return {*}
    * @return {*}
    */
    */
   async getInventories() {
   async getInventories() {
-    const { formItems, data } = this.state
+    const { formItems, data, invs } = this.state
     const { orgCode, customerCode, billToSiteCode, shipToSiteCode } = data
     const { orgCode, customerCode, billToSiteCode, shipToSiteCode } = data
 
 
     const item = getFormItem(formItems, 'collectSrcInvCode')
     const item = getFormItem(formItems, 'collectSrcInvCode')
 
 
-    let invRes = await this.props.getCollectSetting(orgCode, customerCode, billToSiteCode, shipToSiteCode)
-    console.log(invRes)
+    const key = `${orgCode}_${customerCode}_${billToSiteCode}_${shipToSiteCode}`
+    if (isBlank(invs[key])) {
+      let invRes = await this.props.getCollectSetting(orgCode, customerCode, billToSiteCode, shipToSiteCode)
+      const options = R.compose(
+        R.uniqBy(R.prop('value')),
+        R.map(
+          R.applySpec({
+            value: R.prop('source_inv_code'),
+            label: R.prop('source_inv_name'),
+          }),
+        ),
+        R.propOr([], 'payload'),
+      )(invRes)
+      invs[key] = options
+    }
 
 
-    // if (isBlank(invs)) {
-    //   item.loading = true
-    //   await this.props.orderStore.getInventories(orgCode, customerCode, billToSiteCode, shipToSiteCode)
-    //   item.loading = false
-    // }
-    // invs = this.props.orderStore.invs(orgCode, customerCode, billToSiteCode, shipToSiteCode)
-    // item.options = R.map(
-    //   R.applySpec({
-    //     value: R.prop('sourceInvCode'),
-    //     label: R.prop('sourceInvName'),
-    //   }),
-    // )(invs)
+    item.options = invs[key]
+    console.log(item.options)
 
 
-    // this.setState({ formItems })
+    this.setState({ formItems, invs })
   }
   }
 
 
   /**
   /**

src/services/baseApi.ts

@@ -66,7 +66,6 @@ export const request = (args: Partial<RequestConfig>) => {
       }
       }
     }
     }
     args.data = transformObject(options.data, 'toLine')
     args.data = transformObject(options.data, 'toLine')
-    args.data = options.data
 
 
     options = R.cond([
     options = R.cond([
       [R.propEq('method', 'get'), () => R.assoc('url', args.url + '?' + stringify(args.data), options)],
       [R.propEq('method', 'get'), () => R.assoc('url', args.url + '?' + stringify(args.data), options)],