esoftplay-event 0.0.0-n → 0.0.0-p

package/modules/topup/payment.tsx

@@ -0,0 +1,150 @@
+// withHooks
+import { applyStyle } from 'esoftplay';
+import { ComponentButton } from 'esoftplay/cache/component/button/import';
+import { ComponentHeader } from 'esoftplay/cache/component/header/import';
+import { ComponentMessage } from 'esoftplay/cache/component/message/import';
+import { ComponentTouchable } from 'esoftplay/cache/component/touchable/import';
+import { LibCollaps } from 'esoftplay/cache/lib/collaps/import';
+import { LibCurl } from 'esoftplay/cache/lib/curl/import';
+import { LibDialog } from 'esoftplay/cache/lib/dialog/import';
+import { LibLoading } from 'esoftplay/cache/lib/loading/import';
+import { LibNavigation } from 'esoftplay/cache/lib/navigation/import';
+import { LibPicture } from 'esoftplay/cache/lib/picture/import';
+import { LibStyle } from 'esoftplay/cache/lib/style/import';
+import { LibUtils } from 'esoftplay/cache/lib/utils/import';
+import { UserClass } from 'esoftplay/cache/user/class/import';
+import esp from 'esoftplay/esp';
+import useSafeState from 'esoftplay/state';
+
+import React, { useEffect } from 'react';
+import { ScrollView, Text, TouchableOpacity, View } from 'react-native';
+
+
+export interface TopUpPaymentProps {
+  sendData: (data: any) => void
+}
+
+export default function m(props: TopUpPaymentProps): any {
+  const user = UserClass.state().get()
+  const [payment, setPayment] = useSafeState<any>([])
+
+  useEffect(() => {
+    new LibCurl('payment?is_topup=1', null, (res) => {
+      setPayment(res)
+    }, (error) => {
+      LibDialog.warning(esp.lang("topup/payment", "get_err"), error?.message)
+    }, 1)
+  }, [])
+
+
+  if (!payment) {
+    <LibLoading />
+  }
+
+  function renderItemPayment(item2: any, i2: number) {
+    return (
+      <ComponentTouchable key={i2} onPress={() => {
+        if (item2.active == "0") {
+
+        } else {
+          esp.log(item2);
+          LibNavigation.navigate('event/order_detail_payment', {
+            data: item2.description,
+            from: 'fromTopUp',
+            title: item2.title,
+            image: item2.image,
+            va_no: item2.va_no,
+            charge: item2.charge,
+            fee_topup: item2?.fee_topup
+          })
+        }
+      }}>
+        <View style={applyStyle({ marginLeft: 25, marginRight: 25, padding: 7, backgroundColor: item2.active == '0' ? '#e6e6e6' : '#FFF', ...LibStyle.elevation(2) })} >
+          <View style={applyStyle({ justifyContent: 'space-between', flexDirection: 'row' })}>
+            <View style={applyStyle({ flex: 1, alignContent: 'center', alignItems: 'center', flexDirection: 'row' })}>
+              <LibPicture source={{ uri: item2.image }} style={applyStyle({ width: 35, height: 35 })} />
+              <Text allowFontScaling={false} style={applyStyle({ marginLeft: 15, fontFamily: "Arial", fontSize: 14, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, textAlign: "right", color: "#4a4a4a" })}>{item2.title}</Text>
+            </View>
+            <View style={{}}>
+              {
+                item2?.hasOwnProperty("fee_topup") && item2?.fee_topup != null && item2?.fee_topup != 0 &&
+                <View style={{ paddingHorizontal: 10, paddingVertical: 5, backgroundColor: LibStyle.colorBgGrey, borderRadius: 10, justifyContent: 'center', alignContent: 'center', alignItems: 'center' }}>
+                  <Text allowFontScaling={false} style={{ fontSize: 10, color: '#4a4a4a' }}>- {LibUtils.money(item2?.fee_topup)}</Text>
+                </View>
+              }
+            </View>
+          </View>
+          {
+            item2.active && item2.active == "0" &&
+            <Text allowFontScaling={false} style={applyStyle({ marginTop: 4, fontFamily: "Arial", fontSize: 10, fontStyle: "normal", letterSpacing: 0, color: LibStyle.colorRed })}>{item2.info}</Text>
+          }
+        </View>
+      </ComponentTouchable>
+      // <TopupPayment_item key={i2} data={item2} />
+    )
+  }
+
+  function renderItem(item2: any, i: number) {
+    if (item2.type == 3) {
+      return (
+        <TouchableOpacity key={i} onPress={() => {
+          LibNavigation.navigate('topup/nominal')
+        }} style={applyStyle({ borderRadius: 5, marginTop: 5, marginBottom: 5, marginLeft: 15, marginRight: 15, padding: 10, justifyContent: 'space-between', flexDirection: 'row', backgroundColor: '#fff', ...LibStyle.elevation(2) })}>
+          <View style={applyStyle({ flex: 7, alignContent: 'center', alignItems: 'center', flexDirection: 'row' })}>
+            <LibPicture source={{ uri: item2.image }} style={applyStyle({ width: 38, height: 38 })} />
+            <Text allowFontScaling={false} ellipsizeMode={"middle"} numberOfLines={1} style={applyStyle({ marginLeft: 10, marginRight: 10, fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, textAlign: "right", color: "#4a4a4a" })}>{item2.title}</Text>
+          </View>
+          <LibPicture style={applyStyle({ marginLeft: 10, width: 13, height: 13, alignSelf: 'center' })} source={esp.assets('icons/ic_chevron_right.png')} />
+        </TouchableOpacity>
+      )
+    } else {
+      return (
+        <LibCollaps key={i} show
+          header={() =>
+            <View style={applyStyle({ borderRadius: 5, marginTop: 5, marginBottom: 5, marginLeft: 15, marginRight: 15, padding: 10, justifyContent: 'space-between', flexDirection: 'row', backgroundColor: '#fff', ...LibStyle.elevation(2) })}>
+              <View style={applyStyle({ flex: 7, alignContent: 'center', alignItems: 'center', flexDirection: 'row' })}>
+                <LibPicture source={{ uri: item2.image }} style={applyStyle({ width: 38, height: 38 })} />
+                <Text allowFontScaling={false} ellipsizeMode={"middle"} numberOfLines={1} style={applyStyle({ marginLeft: 10, marginRight: 10, fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, textAlign: "right", color: "#4a4a4a" })}>{item2.title}</Text>
+              </View>
+              <LibPicture style={applyStyle({ marginLeft: 10, width: 13, height: 13, alignSelf: 'center' })} source={esp.assets('icons/ic_chevron_right.png')} />
+            </View>
+          }>
+          {
+            item2.list && item2.list.map(renderItemPayment)
+          }
+        </LibCollaps>
+      )
+    }
+  }
+
+  if (user?.config?.can_topup == 0) {
+    return (
+      <View style={{ flex: 1, backgroundColor: '#fff' }}>
+        <ComponentHeader title={esp.lang("topup/payment", "title_topup")} subtitle={esp.lang("topup/payment", "choose_topup_method")} />
+        <ComponentMessage message={""} />
+      </View>
+    )
+  }
+
+  return (
+    <View style={{ flex: 1, backgroundColor: '#fff' }}>
+      <ComponentHeader title={esp.lang("topup/payment", "title_topup")} subtitle={esp.lang("topup/payment", "choose_topup_method")} />
+      {
+        user.have_pin == 0 ?
+          <View style={{ justifyContent: 'center', marginTop: LibStyle.height / 2 - 70, alignContent: 'center', alignItems: 'center', alignSelf: 'center' }}>
+            <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 14, textAlign: 'center', fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#4a4a4a", marginBottom: 10 }}>{esp.lang("topup/payment", "you_have_not_set_pin_bbopay")}</Text>
+            <ComponentButton style={{ backgroundColor: '#f39c12', width: '50%', alignSelf: 'center' }} onPress={() => { LibNavigation.navigate('user/pin') }} label={esp.lang("topup/payment", "set_pin_now")} />
+          </View>
+          :
+          <ScrollView showsVerticalScrollIndicator={false} >
+            <View style={{ flex: 1 }}>
+              <Text allowFontScaling={false} style={{ marginTop: 15, marginBottom: 12, fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#9b9b9b", marginLeft: 16 }}>{esp.lang("topup/payment", "choose_topup_method")}</Text>
+              {
+                Object.values(payment).map(renderItem)
+              }
+            </View>
+          </ScrollView>
+      }
+    </View >
+  )
+}

package/modules/transfer/index.tsx

@@ -0,0 +1,173 @@
+// withHooks
+import { ComponentHeader } from 'esoftplay/cache/component/header/import';
+import { ComponentInput_circle_icon } from 'esoftplay/cache/component/input_circle_icon/import';
+import { ComponentSlidingup } from 'esoftplay/cache/component/slidingup/import';
+import { ComponentTouchable } from 'esoftplay/cache/component/touchable/import';
+import { LibCurl } from 'esoftplay/cache/lib/curl/import';
+import { LibDialog } from 'esoftplay/cache/lib/dialog/import';
+import { LibKeyboard_avoid } from 'esoftplay/cache/lib/keyboard_avoid/import';
+import { LibNavigation } from 'esoftplay/cache/lib/navigation/import';
+import { LibPicture } from 'esoftplay/cache/lib/picture/import';
+import { LibStyle } from 'esoftplay/cache/lib/style/import';
+import { LibToastProperty } from 'esoftplay/cache/lib/toast/import';
+import { UserClass } from 'esoftplay/cache/user/class/import';
+import { UserPopup } from 'esoftplay/cache/user/popup/import';
+import esp from 'esoftplay/esp';
+import useSafeState from 'esoftplay/state';
+
+import React, { useEffect, useRef } from 'react';
+import { ScrollView, Text, TouchableOpacity, View } from 'react-native';
+
+export interface TransferIndexProps {
+
+}
+
+export default function m(props: TransferIndexProps): any {
+  const { saldo_wallet } = LibNavigation.getArgsAll(props)
+
+  let inputEmail = React.useRef<ComponentInput_circle_icon>(null)
+  const dialogUser = useRef<ComponentSlidingup>(null)
+  const [email, setEmail] = useSafeState<string>('')
+  const width = LibStyle.width / 4
+
+  const height = 90
+  const [transferHistory, setTransferHistory] = useSafeState<any>([])
+  const user = UserClass.state().get()
+
+  useEffect(() => {
+    let url = saldo_wallet ? 'user_saldo_wallet_transfer_history' : 'user_saldo_transfer_history'
+    new LibCurl(url, null,
+      (res) => {
+        setTransferHistory(res)
+      }, (msg) => {
+      }, 1)
+  }, [])
+
+  function renderTransferHistoryItem(item: any, i: number) {
+    const styleId_1nsfoj: any = { alignItems: 'center', width: width, height: height, paddingHorizontal: 10 }
+    return (
+      <TouchableOpacity key={i}
+        onPress={() => LibNavigation.navigate('transfer/input', {
+          email: item.email,
+          saldo_wallet: saldo_wallet,
+        })}
+        style={styleId_1nsfoj} >
+        <LibPicture source={{ uri: item.image }} style={styleId_2nkMsW} resizeMode="cover" />
+        <Text numberOfLines={1} allowFontScaling={false} ellipsizeMode="middle" style={styleId_Z29rpc8}>{(item.name)}</Text>
+        <Text numberOfLines={1} allowFontScaling={false} ellipsizeMode="middle" style={styleId_1q1sHt}>{String(item.email).toLowerCase()}</Text>
+      </TouchableOpacity>
+    )
+  }
+
+  return (
+    <View style={{ flex: 1, backgroundColor: '#fff' }}>
+      <LibKeyboard_avoid style={{ flex: 1 }}>
+        <ComponentHeader title={saldo_wallet ? esp.lang("transfer/index", "transfer_walet") : /*transfer_saldo*/esp.lang("transfer/index", "transfer_saldo")} />
+
+        <ScrollView showsVerticalScrollIndicator={false} >
+          <ComponentTouchable onPress={() => {
+            // LibNavigation.navigate('component/scanner', { fromPage: 'home' })
+            LibNavigation.navigateForResult('component/scanner').then((value) => {
+              LibNavigation.replace('transfer/input', { user_id: value, saldo_wallet: true }) // untuk transfer
+            })
+          }}>
+            <View style={{ width: LibStyle.width, height: LibStyle.height * 0.5, backgroundColor: '#b8b7bf', justifyContent: 'center', alignContent: 'center', alignItems: 'center' }}>
+              <LibPicture source={esp.assets('icons/ic_barcode_white.png')} style={{ height: 250, width: 250 }} />
+              <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 14, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, textAlign: "center", marginTop: 10, color: '#fff' }}>{esp.lang("transfer/index", "klik_here")}</Text>
+            </View>
+          </ComponentTouchable>
+          <Text allowFontScaling={false} style={{ opacity: 0.7, fontFamily: "Arial", fontSize: 14, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, textAlign: "center", marginTop: 36 }}>{esp.lang("transfer/index", "scan_qrcode")}</Text>
+          <Text allowFontScaling={false} style={{ opacity: 0.6, fontFamily: "Arial", fontSize: 12, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0, textAlign: "center", marginTop: 5 }}>{esp.lang("transfer/index", "in_member_bbo_page")}</Text>
+          <Text allowFontScaling={false} style={{ opacity: 0.6, fontFamily: "Arial", fontSize: 12, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0, textAlign: "center", marginTop: 17 }}>{esp.lang("transfer/index", "or")}</Text>
+          <ComponentInput_circle_icon
+            ref={inputEmail}
+            keyboardType="email-address"
+            placeholder={esp.lang("transfer/index", "placeholder_input_email")}
+            autoCapitalize="none"
+            onChangeText={(t) => {
+              setEmail(t)
+            }}
+            onSubmitEditing={() => {
+              if (inputEmail.current!.getText() == '') {
+                LibToastProperty.show(esp.lang("transfer/index", "msg_error_input_email"))
+                inputEmail.current!.blur()
+                return
+              } else if (email === user.email) {
+                LibDialog.warningConfirm(esp.lang("transfer/index", "title_alert_warning"), esp.lang("transfer/index", "msg_alert_warning"), esp.lang("transfer/index", "btn_yes_alert_warning"), () => {
+                  setEmail("")
+                  inputEmail.current?.setText("")
+                  inputEmail.current!.focus()
+                }, "", () => {
+
+                })
+                return
+              } else {
+                dialogUser.current!.show()
+                // LibNavigation.navigate('transfer/input', { email: inputEmail.current!.getText() })
+              }
+            }}
+            style={{ marginLeft: 25, marginRight: 25, marginTop: 18 }} />
+          <ComponentTouchable onPress={() => {
+            if (inputEmail.current!.getText() == '') {
+              LibToastProperty.show(esp.lang("transfer/index", "msg_error_input_email"))
+              inputEmail.current!.blur()
+              return
+            } else if (email === user.email) {
+              LibDialog.warningConfirm(esp.lang("transfer/index", "title_alert_warning"), esp.lang("transfer/index", "msg_alert_warning"), esp.lang("transfer/index", "btn_yes_alert_warning"), () => {
+                setEmail("")
+                inputEmail.current?.setText("")
+                inputEmail.current!.focus()
+              }, "", () => {
+
+              })
+            } else {
+              dialogUser.current!.show()
+              // LibNavigation.navigate('transfer/input', { email: inputEmail.current!.getText() })
+            }
+          }} >
+            <View style={{ marginBottom: 10, marginTop: 18, marginLeft: 25, marginRight: 25, height: 35, borderRadius: 17.5, backgroundColor: "#34a2ec", borderStyle: "solid", borderWidth: 0.5, borderColor: "#2980b9", alignItems: 'center', justifyContent: 'center' }} >
+              <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 13, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, textAlign: "center", color: "#fff" }} >{esp.lang("transfer/index", "next")}</Text>
+            </View>
+          </ComponentTouchable>
+
+          {
+            transferHistory && transferHistory.length > 0 &&
+            <View>
+              <Text allowFontScaling={false} style={{ marginLeft: 20, opacity: 0.7, fontFamily: "Arial", fontSize: 14, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, marginBottom: 15 }}>{esp.lang("transfer/index", "recent_transaction")}</Text>
+              <View style={{ flexDirection: 'row' }} >
+                {
+                  transferHistory && transferHistory.length > 0 && transferHistory.slice(0, 3).map(renderTransferHistoryItem)
+                }
+                {
+                  transferHistory && transferHistory.length > 3 &&
+                  <TouchableOpacity onPress={() => { LibNavigation.navigate('transfer/list', { saldo_wallet: saldo_wallet }) }} style={{ alignItems: 'center', width: width, height: height }} >
+                    <LibPicture source={esp.assets('ppob/other.png')} style={{ width: 40, height: 40 }} resizeMode="contain" />
+                    <Text allowFontScaling={false} style={{ opacity: 0.6, fontFamily: "Arial", fontSize: 12, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0, textAlign: "center", marginTop: 5 }}>{esp.lang("transfer/index", "others")}</Text>
+                  </TouchableOpacity>
+                }
+              </View>
+            </View>
+          }
+
+
+        </ScrollView>
+      </LibKeyboard_avoid>
+      <ComponentSlidingup ref={dialogUser} >
+        <View style={{ backgroundColor: 'white', borderTopLeftRadius: 20, borderTopRightRadius: 20, padding: 20 }} >
+          <UserPopup email={email.trim()} redirect={() => {
+            LibNavigation.navigate('transfer/input', {
+              saldo_wallet: saldo_wallet,
+              email: inputEmail.current!.getText().trim()
+            })
+          }} cancel={() => {
+            dialogUser.current!.hide()
+          }} />
+
+        </View>
+      </ComponentSlidingup>
+    </View>
+  )
+}
+const styleId_2nkMsW: any = { width: 40, height: 40, borderRadius: 20 }
+const styleId_Z29rpc8: any = { opacity: 0.6, fontFamily: "Arial", fontSize: 12, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0, textAlign: "center", marginTop: 5 }
+const styleId_1q1sHt: any = { opacity: 0.6, fontFamily: "Arial", fontSize: 12, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0, textAlign: "center", marginVertical: 5 }

package/modules/transfer/input.tsx

@@ -0,0 +1,181 @@
+// withHooks
+import { BigbangTransaction } from 'esoftplay/cache/bigbang/transaction/import';
+import { ComponentAvatar } from 'esoftplay/cache/component/avatar/import';
+import { ComponentHeader } from 'esoftplay/cache/component/header/import';
+import { ComponentTouchable } from 'esoftplay/cache/component/touchable/import';
+import { LibCurl } from 'esoftplay/cache/lib/curl/import';
+import { LibDialog } from 'esoftplay/cache/lib/dialog/import';
+import { LibInput } from 'esoftplay/cache/lib/input/import';
+import { LibInput_rectangle2 } from 'esoftplay/cache/lib/input_rectangle2/import';
+import { LibKeyboard_avoid } from 'esoftplay/cache/lib/keyboard_avoid/import';
+import { LibLoading } from 'esoftplay/cache/lib/loading/import';
+import { LibNavigation } from 'esoftplay/cache/lib/navigation/import';
+import { LibStyle } from 'esoftplay/cache/lib/style/import';
+import { LibToastProperty } from 'esoftplay/cache/lib/toast/import';
+import { LibUtils } from 'esoftplay/cache/lib/utils/import';
+import { UserClass } from 'esoftplay/cache/user/class/import';
+import esp from 'esoftplay/esp';
+import useSafeState from 'esoftplay/state';
+
+import React, { useEffect, useRef } from 'react';
+import { ScrollView, Text, View } from 'react-native';
+
+
+export interface TransferInputProps {
+  navigation: any
+}
+
+export default function m(props: TransferInputProps): any {
+  const user = UserClass.state().get()
+  const user_id = LibNavigation.getArgs(props, 'user_id')
+  const saldo_wallet = LibNavigation.getArgs(props, 'saldo_wallet')
+  const email = LibNavigation.getArgs(props, 'email')
+  let inputNominal = useRef<LibInput>(null)
+  const inputNotes = useRef<LibInput_rectangle2>(null)
+  const [trxId] = useSafeState(BigbangTransaction().getTrxId())
+
+  const [all, setAll] = useSafeState<number>(0)
+  const [userTo, setUserTo] = useSafeState<any>()
+
+  function transfer(pin?: string): void {
+    let post = {
+      trx_id: trxId,
+      user_to: user_id,
+      email: email.trim(),
+      pin: pin,
+      amount: LibUtils.numberAbsolute(inputNominal.current!.getText()),
+      notes: inputNotes.current!.getText(),
+    }
+
+    let url = saldo_wallet ? 'user_saldo_wallet_transfer' : 'user_saldo_transfer'
+
+    LibNavigation.navigateForResult('bigbang/loading_page', {
+      post: post,
+      url: url,
+      title: saldo_wallet ? esp.lang("transfer/input", "transfer_wallet") : esp.lang("transfer/input", "saldo"),
+      isSecure: 1,
+      amount: LibUtils.numberAbsolute(inputNominal.current!.getText()),
+      receive_name: userTo?.name,
+      send_name: user?.name,
+      send_image: user?.image,
+    }, 111).then((value) => {
+      LibNavigation.backToRoot()
+      LibNavigation.push('user/transaction_detail', {
+        ...value,
+        url: value.url,
+        title: esp.lang("bigbang/loading_page", "success")
+      })
+    })
+  }
+
+  useEffect(() => {
+    let postTest = {
+      qr: user_id,
+      email: email.trim()
+    }
+
+    new LibCurl('user', postTest, (result, msg) => {
+      setUserTo(result)
+    }, (error) => {
+      LibNavigation.back()
+      LibToastProperty.show(error?.message)
+    })
+  }, [])
+
+  let minTransfer = 5000
+
+  if (!userTo) {
+    return (
+      <LibLoading />
+    )
+  }
+
+  let saldo = saldo_wallet ? user?.saldo_wallet : user?.saldo
+
+  return (
+    <View style={{ flex: 1, backgroundColor: '#fff' }}>
+      <LibKeyboard_avoid style={{ flex: 1 }}>
+        <ComponentHeader title={saldo_wallet ? esp.lang("transfer/input", "transfer_wallet") : /*title_transfer_saldo*/esp.lang("transfer/input", "title_transfer_saldo")} />
+
+        <ScrollView showsVerticalScrollIndicator={false} >
+          <Text allowFontScaling={false} style={{ marginLeft: 15, fontFamily: "Arial", fontSize: 14, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0, color: "#121212", marginTop: 15 }}>{saldo_wallet ? esp.lang("transfer/input", "saldo_wallet") : esp.lang("transfer/input", "saldo_bbo")}</Text>
+          <Text allowFontScaling={false} style={{ marginLeft: 15, fontFamily: "Arial", fontSize: 20, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#121212", marginTop: 4 }}>{LibUtils.money(saldo, "IDR")}</Text>
+          <View style={[{ margin: 15, marginTop: 20, padding: 15, borderRadius: 5, backgroundColor: '#fff' }, LibStyle.elevation(2)]}>
+            <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 16, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, textAlign: "center", color: "#4a4a4a" }}>{esp.lang("transfer/input", "transfer_saldo_to")}</Text>
+            <ComponentAvatar uri={userTo.image} style={{ marginTop: 18, alignSelf: 'center' }} />
+            <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 16, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, textAlign: "center", color: "#4a4a4a", marginTop: 11 }}>{userTo.name}</Text>
+            <Text allowFontScaling={false} style={{ marginTop: 5, fontFamily: "Arial", fontSize: 12, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0, textAlign: "center", color: "#4a4a4a" }}>{userTo.phone}</Text>
+            <Text allowFontScaling={false} style={{ marginTop: 5, fontFamily: "Arial", fontSize: 12, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0, textAlign: "center", color: "#4a4a4a" }}>{userTo.email}</Text>
+            <Text style={{ marginBottom: 10, marginTop: 20, fontFamily: "Arial", fontSize: 14, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0, textAlign: "center", color: "#4a4a4a" }}>{esp.lang("transfer/input", "amount_transfer")}</Text>
+
+            <LibInput
+              ref={inputNominal}
+              label=""
+              maskFrom="end"
+              onChangeText={(t) => {
+                setAll(0)
+              }}
+              mask="###.###.###.###"
+              placeholder="0"
+              keyboardType="numeric"
+              style={{ letterSpacing: 0, fontSize: 30, marginBottom: 10, padding: -15 }} />
+
+            <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12, fontStyle: "normal", letterSpacing: 0, color: LibStyle.colorRed }}>{esp.lang("transfer/input", "min_transfer", LibUtils.money(minTransfer))}</Text>
+
+            <LibInput_rectangle2
+              ref={inputNotes}
+              keyboardType="default"
+              returnKeyType="go"
+              placeholder={esp.lang("cashier/invoice", "label_note")}
+              maxLength={150}
+              onSubmitEditing={() => {
+                // inputNotes.current!.blur()
+                // dialogUser.current!.show()
+              }}
+              inputStyle={{ marginTop: 10, height: 70, textAlignVertical: 'top' }} style={{ height: 70, textAlignVertical: 'top', borderRadius: 4 }} multiline />
+
+          </View>
+        </ScrollView>
+        <View style={{ flexDirection: 'row', paddingVertical: 10, paddingHorizontal: 20 }} >
+          <View style={{ flex: 1 }} >
+            <ComponentTouchable onPress={() => {
+              if (inputNominal.current!.getText() == '') {
+                inputNominal.current!.blur()
+                LibToastProperty.show(esp.lang("transfer/input", "error_msg_input_amount"))
+                return
+              }
+
+              if (parseInt(inputNominal.current!.getText()) > parseInt(saldo)) {
+                inputNominal.current!.blur()
+                LibToastProperty.show(esp.lang("transfer/input", "error_msg_saldo_not_enough"))
+                return
+              }
+
+              if (minTransfer > parseInt(inputNominal.current!.getText())) {
+                inputNominal.current!.blur()
+                LibToastProperty.show(esp.lang("transfer/input", "min_transfer", LibUtils.money(minTransfer)))
+                return
+              }
+
+              LibNavigation.navigateForResult("bigbang/payment_pin", undefined, 1132).then((p) => {
+                if (p) {
+                  LibDialog.confirm(esp.lang("transfer/input", "title_alert_confirm"),
+                    esp.lang("transfer/input", "transfer_saldo_of", LibUtils.money(inputNominal.current!.getText()), esp.lang("transfer/input", "to"), userTo.email, "?"),
+                    esp.lang("transfer/input", "btn_yes_alert_confirm_transfer_saldo"), () => {
+                      transfer(p)
+                    },
+                    esp.lang("transfer/input", "btn_cancel_alert_confirm_transfer_saldo"), () => { })
+                }
+              })
+
+            }} >
+              <View style={{ height: 35, borderRadius: 17.5, backgroundColor: "#00b894", borderStyle: "solid", borderWidth: 0.5, borderColor: "#2980b9", alignItems: 'center', justifyContent: 'center' }} >
+                <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 13, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, textAlign: "center", color: "#fff" }} >{esp.lang("transfer/input", "transfer")}</Text>
+              </View>
+            </ComponentTouchable>
+          </View>
+        </View>
+      </LibKeyboard_avoid>
+    </View>
+  )
+}

package/modules/transfer/list.tsx

@@ -0,0 +1,142 @@
+// withHooks
+import { ComponentHeader } from 'esoftplay/cache/component/header/import';
+import { ComponentInput_circle_icon } from 'esoftplay/cache/component/input_circle_icon/import';
+import { ComponentSlidingup } from 'esoftplay/cache/component/slidingup/import';
+import { ComponentTouchable } from 'esoftplay/cache/component/touchable/import';
+import { LibCurl } from 'esoftplay/cache/lib/curl/import';
+import { LibIcon } from 'esoftplay/cache/lib/icon/import';
+import { LibList } from 'esoftplay/cache/lib/list/import';
+import { LibLoading } from 'esoftplay/cache/lib/loading/import';
+import { LibNavigation } from 'esoftplay/cache/lib/navigation/import';
+import { LibPicture } from 'esoftplay/cache/lib/picture/import';
+import { LibStyle } from 'esoftplay/cache/lib/style/import';
+import { LibToastProperty } from 'esoftplay/cache/lib/toast/import';
+import esp from 'esoftplay/esp';
+import useSafeState from 'esoftplay/state';
+
+import React, { useEffect, useRef } from 'react';
+import { Text, TextInput, TouchableOpacity, View } from 'react-native';
+
+
+export interface TransferListProps {
+
+}
+export default function m(props: TransferListProps): any {
+  const { saldo_wallet } = LibNavigation.getArgsAll(props)
+  const dialogAdd = useRef<ComponentSlidingup>(null)
+  const inputEmail = useRef<ComponentInput_circle_icon>(null)
+  const [email, setEmail] = useSafeState('')
+  const [transferHistory, setTransferHistory] = useSafeState<any>()
+  const [query, setQuery] = useSafeState<string>('')
+  const [error, setError] = useSafeState<string>('')
+
+  useEffect(() => {
+    let url = saldo_wallet ? 'user_saldo_wallet_transfer_history' : 'user_saldo_transfer_history'
+
+    new LibCurl(url, null,
+      (res) => {
+        setTransferHistory(res)
+      }, (msg) => {
+        setError(msg?.message)
+      }, 1)
+  }, [])
+
+  const data = transferHistory && transferHistory.length > 0 && transferHistory.filter((item: any, i: number) => String(item.name).toLowerCase().includes(query.toLowerCase()))
+
+  function renderItem(item: any, i: number) {
+    return (
+      <TouchableOpacity key={i}
+        onPress={() => { LibNavigation.navigate('transfer/input', { email: item.email, saldo_wallet: saldo_wallet }) }}
+        activeOpacity={0.5}
+        style={styleId_1UakNd} >
+        <View style={styleId_1eRtVl} >
+          <LibPicture source={{ uri: item.image }} style={styleId_2nkMsW} />
+          <View style={styleId_2cWFO3} >
+            <Text numberOfLines={1} style={styleId_Z28Kzqd}>{(item.name)}</Text>
+            <Text numberOfLines={1} style={styleId_Z1uokYl}>{item.email}</Text>
+          </View>
+          <LibIcon name="chevron-right" color="#C1C1C1" size={30} />
+        </View>
+      </TouchableOpacity>
+    )
+  }
+
+  return (
+    <View style={{ flex: 1, backgroundColor: "white" }} >
+      <ComponentHeader title={esp.lang("transfer/list", "title_transfer_saldo")} />
+      <LibList
+        data={data}
+        ListEmptyComponent={
+          !data ?
+            <LibLoading />
+            :
+            <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center', marginTop: LibStyle.width * 0.3 }} >
+              <LibIcon name="alert-circle-outline" size={70} style={{ marginBottom: 10 }} />
+              <Text allowFontScaling={false} style={{ textAlign: 'center', textAlignVertical: 'center' }} >{error}</Text>
+            </View>
+        }
+        ListHeaderComponent={
+          <>
+            <View style={{ marginHorizontal: 15, marginTop: 10, flexDirection: 'row', alignItems: 'center' }}>
+              <TextInput
+                placeholder={esp.lang("transfer/list", "placeholder_search")}
+                onChangeText={(t) => { setQuery(t) }}
+                style={{ flex: 1, borderColor: '#E6E6E6', color: '#B8B8B8', borderWidth: 1, padding: 4, paddingLeft: 40, borderRadius: 10, backgroundColor: 'white', height: 40 }}
+              />
+              <View style={{ position: "absolute", top: 9, bottom: 0, left: 9 }}>
+                <LibIcon name="magnify" color="#E6E6E6" />
+              </View>
+            </View>
+            <Text allowFontScaling={false} style={{ marginLeft: 15, opacity: 0.7, fontFamily: "Arial", fontSize: 14, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, marginTop: 15 }}>{esp.lang("transfer/list", "saved_account")}</Text>
+            <TouchableOpacity onPress={() => { dialogAdd.current!.show() }} style={{ flexDirection: 'row', alignItems: 'center', paddingVertical: 15, marginHorizontal: 15 }} >
+              <LibIcon name="plus-circle-outline" size={30} />
+              <Text style={{ opacity: 0.6, fontFamily: "Arial", fontSize: 14, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0, paddingLeft: 10 }} >{esp.lang("transfer/list", "new_transaction")}</Text>
+            </TouchableOpacity>
+          </>
+        }
+        renderItem={renderItem}
+      />
+      <ComponentSlidingup ref={dialogAdd} >
+        <View style={{ backgroundColor: 'white', borderTopLeftRadius: 20, borderTopRightRadius: 20, padding: 20 }} >
+          <Text allowFontScaling={false}>{esp.lang("transfer/list", "label_new_transaction")}</Text>
+          <ComponentInput_circle_icon
+            ref={inputEmail}
+            keyboardType="email-address"
+            placeholder={esp.lang("transfer/list", "placeholder_input_email")}
+            onChangeText={(t) => {
+              setEmail(t)
+            }}
+            onSubmitEditing={() => {
+              if (inputEmail.current!.getText() == '') {
+                LibToastProperty.show(esp.lang("transfer/list", "msg_error_input_email"))
+                inputEmail.current!.blur()
+                return
+              } else {
+                LibNavigation.navigate('transfer/input', { saldo_wallet: saldo_wallet, email: inputEmail.current!.getText().trim() })
+              }
+            }}
+            style={{ marginLeft: 25, marginRight: 25, marginTop: 18 }} />
+          <ComponentTouchable onPress={() => {
+            if (inputEmail.current!.getText() == '') {
+              LibToastProperty.show(esp.lang("transfer/list", "msg_error_input_email"))
+              inputEmail.current!.blur()
+              return
+            } else {
+              LibNavigation.navigate('transfer/input', { saldo_wallet: saldo_wallet, email: inputEmail.current!.getText().trim() })
+            }
+          }} >
+            <View style={{ marginBottom: 10, marginTop: 18, marginLeft: 25, marginRight: 25, height: 35, borderRadius: 17.5, backgroundColor: "#34a2ec", borderStyle: "solid", borderWidth: 0.5, borderColor: "#2980b9", alignItems: 'center', justifyContent: 'center' }} >
+              <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 13, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, textAlign: "center", color: "#fff" }} >{esp.lang("transfer/list", "btn_next")}</Text>
+            </View>
+          </ComponentTouchable>
+        </View>
+      </ComponentSlidingup>
+    </View>
+  )
+}
+const styleId_1UakNd: any = { paddingVertical: 15, borderTopWidth: 1, borderTopColor: "#e6e6e6", borderBottomWidth: 1, borderBottomColor: "#e6e6e6" }
+const styleId_1eRtVl: any = { flexDirection: 'row', alignItems: 'center', paddingHorizontal: 15 }
+const styleId_2nkMsW: any = { width: 40, height: 40, borderRadius: 20 }
+const styleId_2cWFO3: any = { flex: 1, paddingLeft: 15 }
+const styleId_Z28Kzqd: any = { opacity: 0.6, fontFamily: "Arial", fontSize: 14, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0, paddingBottom: 8 }
+const styleId_Z1uokYl: any = { opacity: 0.6, fontFamily: "Arial", fontSize: 14, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0 }