esoftplay-event 0.0.0-a

package/event/entrance_warning.tsx

@@ -0,0 +1,91 @@
+// withHooks
+
+import { applyStyle } from 'esoftplay';
+import { LibNavigation } from 'esoftplay/cache/lib/navigation/import';
+import { LibStyle } from 'esoftplay/cache/lib/style/import';
+import { TicketItemProperty } from 'esoftplay/cache/ticket/item/import';
+import esp from 'esoftplay/esp';
+import React from 'react';
+import { Text, TouchableOpacity, View } from 'react-native';
+
+
+export interface EventEntrance_warningArgs {
+
+}
+export interface EventEntrance_warningProps {
+
+}
+export default function m(props: EventEntrance_warningProps): any {
+  const {
+    url_ticket_update,
+    url_ticket_detail,
+    price_type,
+    selectedTicket,
+    gate_type,
+    qr_code,
+    event_id,
+    selectGate,
+    typeScanner,
+    event_title,
+    qty,
+    configPriority,
+    scan_type,
+    is_from_list } = LibNavigation.getArgsAll<any>(props)
+
+
+  let args = {
+    price_type: price_type,
+    gate_type: gate_type,
+    qr_code: qr_code,
+    event_id: event_id,
+    event_title: event_title,
+    selectGate: selectGate,
+    typeScanner: typeScanner,
+    url_ticket_detail: url_ticket_detail,
+    url_ticket_update: url_ticket_update,
+    qty: qty,
+    configPriority: configPriority,
+    scan_type: scan_type
+  }
+
+  return (
+    <View style={{ flex: 1, backgroundColor: selectedTicket?.color }}>
+      <View style={{ padding: 15, flex: 4, alignContent: 'center', alignItems: 'center', justifyContent: 'center' }}>
+        <Text allowFontScaling={false} style={{ color: TicketItemProperty.textColor(selectedTicket?.color), letterSpacing: 1, fontSize: 20, textAlign: 'center', fontWeight: 'normal' }}>{esp.lang("event/entrance_warning", "your_ticket")}</Text>
+        <Text allowFontScaling={false} numberOfLines={5} ellipsizeMode="tail" style={{ marginVertical: 15, letterSpacing: 2, color: TicketItemProperty.textColor(selectedTicket?.color), fontSize: 32, textAlign: 'center', fontWeight: 'bold' }}>{selectedTicket?.title}</Text>
+        <Text allowFontScaling={false} style={{ paddingHorizontal: 20, color: TicketItemProperty.textColor(selectedTicket?.color), letterSpacing: 1, fontSize: 20, textAlign: 'center', fontWeight: 'normal' }}>{esp.lang("event/entrance_warning", "confirm")}</Text>
+      </View>
+      <View style={{ flex: 1, padding: 15, justifyContent: 'flex-end' }}>
+        <TouchableOpacity onPress={() => {
+          if (is_from_list == 1) {
+            LibNavigation.replace('event/entrance_success', {
+              selectedTicket: selectedTicket,
+              ...args
+            })
+          } else {
+            if (selectedTicket?.qty > 1) {
+              let tikets = [selectedTicket]
+              LibNavigation.replace('event/entrance_list', {
+                tickets: tikets,
+                ...args
+              })
+            } else {
+              LibNavigation.replace('event/entrance_success', {
+                selectedTicket: selectedTicket,
+                ...args
+              })
+            }
+          }
+        }} style={applyStyle({ marginBottom: 20, width: LibStyle.width - 30, height: 40, borderRadius: 16, backgroundColor: TicketItemProperty.textColor(selectedTicket?.color), flexDirection: 'row', alignItems: 'center', alignContent: 'center', justifyContent: 'center', paddingHorizontal: 9 })} >
+          <Text allowFontScaling={false} style={applyStyle({ fontFamily: "ArialBold", fontSize: 14, textAlign: "center", textAlignVertical: 'center', color: selectedTicket?.color, marginRight: 15 })} >{esp.lang("event/entrance_warning", "process")}</Text>
+        </TouchableOpacity>
+        <TouchableOpacity onPress={() => {
+          LibNavigation.back()
+        }} style={applyStyle({ width: LibStyle.width - 30, borderWidth: 1, borderColor: TicketItemProperty.textColor(selectedTicket?.color), height: 40, borderRadius: 16, backgroundColor: selectedTicket?.color, flexDirection: 'row', alignItems: 'center', alignContent: 'center', justifyContent: 'center', paddingHorizontal: 9 })} >
+          <Text allowFontScaling={false} style={applyStyle({ fontFamily: "ArialBold", fontSize: 14, textAlign: "center", textAlignVertical: 'center', color: TicketItemProperty.textColor(selectedTicket?.color), marginRight: 15 })} >{esp.lang("event/entrance_warning", "cancel")}</Text>
+        </TouchableOpacity>
+      </View>
+
+    </View>
+  )
+}

package/event/exchange_reward.tsx

@@ -0,0 +1,31 @@
+// withHooks
+
+import { ComponentHeader } from 'esoftplay/cache/component/header/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 esp from 'esoftplay/esp';
+import React from 'react';
+import { Pressable, View } from 'react-native';
+
+
+export interface EventExchange_rewardArgs {
+
+}
+export interface EventExchange_rewardProps {
+
+}
+export default function m(props: EventExchange_rewardProps): any {
+  const { dataEvent }: any = LibNavigation.getArgsAll(props)
+
+  return (
+    <View style={{ flex: 1, backgroundColor: LibStyle.colorBgGrey }}>
+      <ComponentHeader title={esp.lang("event/exchange_reward", "header_title")} subtitle={dataEvent?.name} />
+      <Pressable onPress={() => {
+        LibNavigation.navigate('component/scanner', { event_title: dataEvent?.name, event_id: dataEvent?.id, fromPage: "event/exchange_reward" })
+      }} style={{ flex: 1, overflow: 'hidden', margin: 15, backgroundColor: '#fff', borderRadius: 10, ...LibStyle.elevation(2) }}>
+        <LibPicture source={{ uri: 'https://static.vecteezy.com/system/resources/previews/005/594/108/non_2x/mobile-application-for-scanning-qr-code-hand-holding-smartphone-scan-qr-code-icon-phone-app-barcode-scanner-vector.jpg' }} style={{ flex: 1, opacity: 0.7, resizeMode: 'cover' }} />
+      </Pressable >
+    </View>
+  )
+}

package/event/exchange_reward_result.tsx

@@ -0,0 +1,137 @@
+// withHooks
+
+import { applyStyle } from 'esoftplay';
+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 { LibIcon } from 'esoftplay/cache/lib/icon/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 { LibProgress } from 'esoftplay/cache/lib/progress/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 esp from 'esoftplay/esp';
+import useSafeState from 'esoftplay/state';
+import React, { useEffect } from 'react';
+import { Pressable, ScrollView, Text, View } from 'react-native';
+
+
+export interface EventExchange_reward_resultArgs {
+
+}
+export interface EventExchange_reward_resultProps {
+
+}
+export default function m(props: EventExchange_reward_resultProps): any {
+  const { qr, event_id, event_title }: any = LibNavigation.getArgsAll(props)
+
+  const [result, setResult] = useSafeState<any>()
+
+  function loadData() {
+    let post = {
+      event_id: event_id,
+      qr: qr
+    }
+    new LibCurl('event_tms_order_review', post, (res, msg) => {
+      setResult(res)
+    }, (err) => {
+      LibDialog.warning(esp.lang("event/exchange_reward_result", "oops"), err?.message)
+      LibNavigation.back()
+    })
+  }
+  
+  function submitSign() {
+    let post = {
+      booking_id: result?.booking?.id,
+      event_id: event_id,
+    }
+    LibProgress.show("Mohon Tunggu")
+    new LibCurl('event_tms_order_review_sign', post, (res, msg) => {
+      LibProgress.hide()
+      LibToastProperty.show(msg)
+      LibNavigation.back()
+      LibNavigation.navigate('component/scanner', { event_title: event_title, event_id: event_id, fromPage: "event/exchange_reward" })
+      
+    }, (err) => {
+      LibProgress.hide()
+      LibDialog.warning(esp.lang("event/exchange_reward_result", "oops"), err?.message)
+    }, 1)
+  }
+
+  useEffect(() => {
+    loadData()
+  }, [])
+
+  if (!result) {
+    return <LibLoading />
+  }
+
+  return (
+    <View style={{ flex: 1, backgroundColor: LibStyle.colorBgGrey }}>
+      <ComponentHeader title={esp.lang("event/exchange_reward_result", "header_title")} subtitle={event_title} />
+      <ScrollView>
+        <Pressable onPress={() => { }} style={{ backgroundColor: '#fff', borderRadius: 5, overflow: 'hidden', width: LibStyle.width - 30, margin: 15, marginBottom: 0 }}>
+          <View style={{ alignContent: 'center', borderBottomWidth: 1, borderBottomColor: "#c9c9c9", alignItems: 'center', justifyContent: 'center', backgroundColor: LibStyle.colorPrimary, padding: 10 }}>
+            <Text allowFontScaling={false} numberOfLines={1} ellipsizeMode="tail" style={{ color: "#fff", alignSelf: 'center', textAlign: 'center', fontSize: 16, fontWeight: 'bold' }}> {result?.booking?.price_name}</Text>
+          </View>
+          <View style={{ padding: 10, backgroundColor: '#fff', flex: 1 }}>
+            <Text allowFontScaling={false} style={applyStyle({ marginHorizontal: 15, fontSize: 14, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#4a4a4a" })}>{result?.booking?.event_name}</Text>
+
+            <View style={applyStyle({ marginHorizontal: 15, borderBottomWidth: 1, marginTop: 15, borderBottomColor: '#9b9b9b' })}>
+              <View style={{ flexDirection: 'row', marginBottom: 10 }}>
+                <View style={applyStyle({ width: 60, height: 60, borderRadius: 5, backgroundColor: LibStyle.colorBgGrey, ...LibStyle.elevation(2) })}>
+                  <LibPicture style={applyStyle({ width: 60, height: 60, resizeMode: 'cover', borderRadius: 5, })} source={{ uri: result?.event?.image }} />
+                </View>
+                <View style={applyStyle({ flexDirection: 'row', justifyContent: 'space-between', marginLeft: 14, flex: 1 })}>
+                  <View style={{ flex: 2, marginRight: 5, }}>
+                    <View style={{ flexDirection: 'row', alignContent: 'center', alignItems: 'center', marginBottom: 4 }}>
+                      <LibIcon name='ticket' size={20} color="#9b9b9b" />
+                      <Text allowFontScaling={false} style={applyStyle({ marginLeft: 5, fontSize: 16, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0, color: "#000" })}>{LibUtils.number(result?.booking?.qty)} Tiket</Text>
+                    </View>
+                    <View style={{ flexDirection: 'row', alignContent: 'center', alignItems: 'center', marginBottom: 4 }}>
+                      <LibIcon name='cash' size={20} color="#9b9b9b" />
+                      <Text allowFontScaling={false} style={applyStyle({ marginLeft: 5, fontSize: 14, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0, color: "#000" })}>{LibUtils.money(result?.booking?.total)}</Text>
+                    </View>
+
+                    {
+                      result?.booking?.ondate == "0000-00-00" &&
+                      <View style={{ flexDirection: 'row', alignContent: 'center', alignItems: 'center', marginBottom: 4 }}>
+                        <LibIcon name='calendar' size={18} color="#9b9b9b" />
+                        <Text allowFontScaling={false} style={applyStyle({ marginLeft: 5, fontSize: 14, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0, color: "#000" })}>{LibUtils.getDateRange(result?.booking?.start_date, result?.booking?.end_date)}</Text>
+                      </View>
+                    }
+                  </View>
+                  {
+                    result?.booking?.ondate != "0000-00-00" &&
+                    <View style={{ flex: 1, marginLeft: 15, alignContent: 'flex-end', alignItems: 'flex-end' }}>
+                      <Text allowFontScaling={false} style={{ fontSize: 30, fontWeight: 'bold' }}>{LibUtils.moment(result?.booking?.ondate).localeFormat("DD")}</Text>
+                      <Text allowFontScaling={false} style={{ fontSize: 20, fontWeight: 'bold', marginTop: -5, }}>{LibUtils.moment(result?.booking?.ondate).localeFormat("MMM")}</Text>
+                    </View>
+                  }
+                </View>
+              </View>
+
+            </View>
+            <Text allowFontScaling={false} style={applyStyle({ padding: 10, paddingBottom: 0, textAlign: 'center', textAlignVertical: 'center', fontFamily: "ArialBold", fontSize: 14, fontWeight: "normal", fontStyle: "normal", letterSpacing: 4, color: '#70472b' })}>{result?.booking?.booking_code}</Text>
+            <View style={applyStyle({ flexDirection: 'row', alignItems: 'center', justifyContent: 'center', position: 'absolute', top: 0, left: 0, right: 0, bottom: 0 })}>
+              <View style={applyStyle({ width: 25, height: 25, borderRadius: 12.5, backgroundColor: LibStyle.colorBgGrey, marginLeft: -12.5 })} />
+              <View style={applyStyle({ flex: 1 })} />
+              <View style={applyStyle({ width: 25, height: 25, borderRadius: 12.5, backgroundColor: LibStyle.colorBgGrey, marginRight: -12.5 })} />
+            </View>
+          </View>
+        </Pressable>
+      </ScrollView>
+
+      <ComponentTouchable onPress={() => {
+        submitSign()
+      }}>
+        <View style={{ margin: 15, marginTop: 20, height: 35, borderRadius: 5, backgroundColor: LibStyle.colorRed, justifyContent: 'center', alignItems: 'center', paddingHorizontal: 9 }} >
+          <Text allowFontScaling={false} style={{ fontFamily: "ArialBold", textAlign: "center", textAlignVertical: 'center', color: 'white', marginRight: 13, marginLeft: 10 }} >{esp.lang("event/exchange_reward_result", "submit")}</Text>
+        </View>
+      </ComponentTouchable>
+    </View>
+  )
+}

package/event/exchange_ticket.tsx

@@ -0,0 +1,234 @@
+// withHooks
+
+import { ComponentHeader } from 'esoftplay/cache/component/header/import';
+import { ComponentSlidingup } from 'esoftplay/cache/component/slidingup/import';
+import { ComponentTouchable } from 'esoftplay/cache/component/touchable/import';
+import { EventExchange_ticket_resultProperty } from 'esoftplay/cache/event/exchange_ticket_result/import';
+import { LibCurl } from 'esoftplay/cache/lib/curl/import';
+import { LibIcon } from 'esoftplay/cache/lib/icon/import';
+import { LibInput_circle2 } from 'esoftplay/cache/lib/input_circle2/import';
+import { LibLoading } from 'esoftplay/cache/lib/loading/import';
+import { LibNavigation } from 'esoftplay/cache/lib/navigation/import';
+import { LibObject } from 'esoftplay/cache/lib/object/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 { LibUtils } from 'esoftplay/cache/lib/utils/import';
+import { UseTasks } from 'esoftplay/cache/use/tasks/import';
+import esp from 'esoftplay/esp';
+import useGlobalState from 'esoftplay/global';
+import useSafeState from 'esoftplay/state';
+import useGlobalSubscriber, { useGlobalSubscriberReturn } from 'esoftplay/subscribe';
+import { useTimeout } from 'esoftplay/timeout';
+import React, { useEffect, useRef } from 'react';
+import isEqual from 'react-fast-compare';
+import { Pressable, RefreshControl, ScrollView, Text, View } from 'react-native';
+
+
+export interface EventExchange_ticketArgs {
+
+}
+export interface EventExchange_ticketProps {
+
+}
+
+
+// new
+export const stateExchangeLog = useGlobalState({}, {
+  persistKey: 'event/exchange_ticket_log',
+  inFile: true,
+  loadOnInit: true
+})
+
+function addCounter(counter: number, type: string) {
+  const cdate = LibUtils.moment().localeFormat('YYYY-MM-DD HH')
+  stateExchangeLog.set((old: any) => {
+    if (!old[type]) { old[type] = {} }
+    return LibObject.update(old, (c) => (c || 0) + counter)(type, cdate)
+  })
+}
+
+export function getDataByDate(): any {
+  return stateExchangeLog.get()
+}
+
+export function addCounterScan(counter: number) {
+  addCounter(counter, 'scan')
+}
+export function addCounterScanNo(counter: number) {
+  addCounter(counter, 'scan_failed')
+}
+export function addCounterSend(counter: number) {
+  addCounter(counter, 'send')
+}
+export function addCounterResponseOK(counter: number) {
+  addCounter(counter, 'api_ok')
+}
+export function addCounterResponseNo(counter: number) {
+  addCounter(counter, 'api_no')
+}
+export function addCounterResponseTimeout(counter: number) {
+  addCounter(counter, 'timeout')
+}
+export function addCounterGiftBy(title: string, counter: number) {
+  addCounter(counter, `gift_${title}`)
+}
+
+const subscriber = useGlobalSubscriber()
+export function subscribeSync(): useGlobalSubscriberReturn {
+  return subscriber
+}
+
+const useTasks1 = UseTasks()
+
+export default function m(props: EventExchange_ticketProps): any {
+  const { dataEvent }: any = LibNavigation.getArgsAll(props)
+  const dialogInput = useRef<ComponentSlidingup>(null)
+
+  const [dataConfig, setDataConfig] = useSafeState<any>()
+  const [error, setError] = useSafeState<string>()
+  const [refreshing, setRefreshing] = useSafeState<boolean>(false);
+
+  let inputAccessCode = React.useRef<LibInput_circle2>(null)
+
+  const timeoutSync = useRef<any>()
+  const timeout = useTimeout()
+  const [syncTicketExchange] = useTasks1((item: any) => new Promise((next) => {
+    clearTimeout?.(timeoutSync.current)
+    timeoutSync.current = timeout(() => {
+      next()
+    }, 10000);
+    new LibCurl(item?.url, item?.post, (res, msg) => {
+      addCounterResponseOK(1)
+      let a = EventExchange_ticket_resultProperty.stateListConfirm().get().filter((x: any) => !isEqual(item, x))
+      EventExchange_ticket_resultProperty.stateListConfirm().set(a)
+      next()
+    }, (err) => {
+      addCounterResponseNo(1)
+      next()
+    })
+  }))
+
+  subscriber.useSubscribe(() => {
+    syncTicketExchange(subscriber.getValue())
+  })
+
+  useEffect(() => {
+    subscriber.trigger(EventExchange_ticket_resultProperty.stateListConfirm().get())
+    loadDataConfig()
+  }, [])
+
+
+  function loadDataConfig() {
+    new LibCurl('event_booking_exchange_config?event_id=' + dataEvent?.id, null, (res, msg) => {
+      setDataConfig(res)
+      setRefreshing(false)
+    }, (err) => {
+      setRefreshing(false)
+      setError(err?.message)
+      // LibToastProperty.show(err?.message)
+    }, 1)
+  }
+
+  function doSubmit() {
+    inputAccessCode.current?.blur()
+    if (inputAccessCode.current?.getText() == '') {
+      LibToastProperty.show(esp.lang("visitor/index", "alert_error_not_empty_code"))
+      inputAccessCode.current?.focus()
+      return
+    }
+    dialogInput.current?.hide()
+    LibNavigation.navigate('event/exchange_ticket_result', { event_title: dataEvent?.name, event_id: dataEvent?.id, qr: inputAccessCode.current?.getText().toUpperCase() })
+  }
+
+  function onRefresh() {
+    setRefreshing(true)
+    loadDataConfig()
+  }
+
+
+  return (
+    <View style={{ flex: 1, backgroundColor: LibStyle.colorBgGrey }}>
+      <ComponentHeader title={esp.lang("event/exchange_ticket", "header")} subtitle={dataEvent?.name} />
+      <ScrollView style={{ flex: 1 }} refreshControl={<RefreshControl refreshing={refreshing} onRefresh={onRefresh} />}>
+        <Pressable onPress={() => {
+          LibNavigation.navigate('event/exchange_ticket_list', { dataEvent: dataEvent })
+        }} style={{ margin: 15, marginBottom: 0, padding: 10, borderWidth: 1, backgroundColor: '#fff', borderColor: LibStyle.colorRed, flex: 1, borderRadius: 10, flexDirection: 'row', justifyContent: 'space-between', alignContent: 'center', alignItems: 'center' }}>
+          <Text allowFontScaling={false}>{esp.lang("event/exchange_ticket", "exchange_history")}</Text>
+          <LibIcon name='chevron-right' />
+        </Pressable >
+        <View style={{ flex: 1, margin: 15, backgroundColor: '#fff', borderRadius: 10, ...LibStyle.elevation(2) }}>
+          <ComponentTouchable onPress={() => {
+            if (dataConfig) {
+              LibNavigation.navigate('component/scanner', { event_title: dataEvent?.name, event_id: dataEvent?.id, fromPage: "event/exchange_ticket" })
+            }
+          }}>
+            <View style={{ width: LibStyle.width - 30, overflow: 'hidden', borderTopLeftRadius: 10, borderTopRightRadius: 10, 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>
+
+          {
+            (dataConfig || error) ?
+              <View style={{ marginTop: 20, margin: 10 }}>
+                {
+                  dataConfig &&
+                  <Text allowFontScaling={false} style={{ fontFamily: 'MonoSpace', letterSpacing: 1 }}>{esp.lang("event/exchange_ticket", "type_can_scan")}</Text>
+                }
+
+                {
+                  dataConfig && dataConfig?.map((item: any, i: number) => {
+                    return (
+                      <Text key={i} allowFontScaling={false} style={{ marginTop: 4, fontFamily: 'MonoSpace', letterSpacing: 1 }}>{(i + 1) + "."} {item?.type}</Text>
+                    )
+                  })
+                }
+                {
+                  error &&
+                  <Text allowFontScaling={false} style={{ color: LibStyle.colorRed, fontWeight: 'bold', fontFamily: 'MonoSpace', letterSpacing: 1 }}>{error}</Text>
+                }
+              </View>
+              :
+              <View style={{ marginTop: 30, marginBottom: 20 }}>
+                <LibLoading />
+              </View>
+          }
+
+        </View >
+      </ScrollView>
+
+      <Pressable onPress={() => {
+        if (dataConfig) {
+          dialogInput.current?.show()
+        }
+      }} style={{ ...LibStyle.elevation(2), alignContent: 'center', alignItems: 'center', justifyContent: 'center', position: 'absolute', width: 50, height: 50, borderRadius: 25, backgroundColor: LibStyle.colorRed, bottom: 20, right: 15 }}>
+        <LibIcon.Ionicons name='terminal-outline' color='#fff' />
+      </Pressable>
+
+      <ComponentSlidingup ref={dialogInput}>
+        <View style={{ backgroundColor: '#f6f6f6', borderTopRightRadius: 20, borderTopLeftRadius: 20, paddingHorizontal: 19, }}>
+          <Text allowFontScaling={false} style={{ marginTop: 26, marginBottom: 23, fontFamily: "Arial", fontSize: 16, fontWeight: "bold", fontStyle: "normal", lineHeight: 22, letterSpacing: 0, textAlign: "center", color: "#34495e" }}>{esp.lang("event/exchange_ticket", "input_qr")}</Text>
+          <LibInput_circle2
+            ref={inputAccessCode}
+            onSubmitEditing={() => doSubmit()}
+            blurOnSubmit
+            returnKeyType="done"
+            autoCapitalize='characters'
+            style={{ borderColor: '#c4c4c4', height: 35, margin: 15, borderRadius: 5 }}
+            placeholder={esp.lang("event/exchange_ticket", "placeholder_code")}
+          />
+
+          <ComponentTouchable onPress={() => { doSubmit() }}>
+            <View style={{ margin: 15, marginTop: 20, height: 35, borderRadius: 5, backgroundColor: "#6c432c", justifyContent: 'center', alignItems: 'center', paddingHorizontal: 9 }} >
+              <Text allowFontScaling={false} style={{ fontFamily: "ArialBold", fontSize: 12, textAlign: "center", textAlignVertical: 'center', color: 'white', marginRight: 13, marginLeft: 10 }} >{esp.lang("visitor/index", "submit")}</Text>
+            </View>
+          </ComponentTouchable>
+
+        </View>
+      </ComponentSlidingup>
+
+
+    </View>
+  )
+}