esoftplay-event 0.0.0-a

package/event/log.tsx

@@ -0,0 +1,435 @@
+// withHooks
+import { useEffect, useRef } from 'react';
+
+import { BigbangGate_infoProperty } from 'esoftplay/cache/bigbang/gate_info/import';
+import { ComponentButton } from 'esoftplay/cache/component/button/import';
+import { ComponentHeader } from 'esoftplay/cache/component/header/import';
+import { EventEntrance_log } from 'esoftplay/cache/event/entrance_log/import';
+import { EventEntrance_successProperty } from 'esoftplay/cache/event/entrance_success/import';
+import { EventExit_log } from 'esoftplay/cache/event/exit_log/import';
+import { EventExit_successProperty } from 'esoftplay/cache/event/exit_success/import';
+import { EventHall_in_log } from 'esoftplay/cache/event/hall_in_log/import';
+import { EventHall_in_successProperty } from 'esoftplay/cache/event/hall_in_success/import';
+import { EventHall_out_log } from 'esoftplay/cache/event/hall_out_log/import';
+import { EventHall_out_successProperty } from 'esoftplay/cache/event/hall_out_success/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 { LibIcon } from 'esoftplay/cache/lib/icon/import';
+import { LibNavigation } from 'esoftplay/cache/lib/navigation/import';
+import { LibProgress } from 'esoftplay/cache/lib/progress/import';
+import { LibSlidingup } from 'esoftplay/cache/lib/slidingup/import';
+import { LibStyle } from 'esoftplay/cache/lib/style/import';
+import { LibTextstyle } from 'esoftplay/cache/lib/textstyle/import';
+import { LibToastProperty } from 'esoftplay/cache/lib/toast/import';
+import { LibUtils } from 'esoftplay/cache/lib/utils/import';
+import { UseCondition } from 'esoftplay/cache/use/condition/import';
+import { UserClass } from 'esoftplay/cache/user/class/import';
+import esp from 'esoftplay/esp';
+import useSafeState from 'esoftplay/state';
+import Storage from 'esoftplay/storage';
+import Constants from 'expo-constants';
+import * as FileSystem from 'expo-file-system';
+import React from 'react';
+import { ScrollView, Text, View } from 'react-native';
+import Pressable from '../lib/pressable';
+
+
+export interface EventLogArgs {
+
+}
+export interface EventLogProps {
+
+}
+
+export interface LogItem {
+  text: string
+  value: string
+  onPress: () => void
+  valuecolor?: string
+}
+
+function Item(props: LogItem) {
+  return (
+    <Pressable
+      onPress={() => {
+        props.onPress()
+      }} style={{ flexDirection: 'row', justifyContent: 'space-between', alignContent: 'center', alignItems: 'center', marginHorizontal: 15, paddingVertical: 6, borderBottomWidth: 1, borderBottomColor: LibStyle.colorLightGrey }}>
+      <LibTextstyle text={props.text} textStyle="subhead" />
+      <LibTextstyle text={LibUtils.number(props.value)} style={{ color: props.valuecolor ? props.valuecolor : "#000" }} textStyle="title2" />
+    </Pressable>
+  )
+}
+
+// Fungsi untuk menjumlahkan nilai per kategori
+export function sumValuesPerCategory(data: any) {
+  let categoryTotals: any = {};
+
+  // Iterasi setiap kategori
+  for (const category in data) {
+    let categoryTotal = 0;
+    const gates = data[category];
+
+    // Iterasi setiap gate di dalam kategori
+    for (const gate in gates) {
+      const times = gates[gate];
+
+      // Iterasi setiap waktu dan menambahkan nilainya ke total per kategori
+      for (const time in times) {
+        categoryTotal += times[time];
+      }
+    }
+
+    // Simpan total kategori dalam objek hasil
+    categoryTotals[category] = categoryTotal;
+  }
+  return categoryTotals;
+}
+
+
+const useDetectStateChange = (state: any, duration: number) => {
+  const [trigger, setTrigger] = useSafeState(false);
+
+  useEffect(() => {
+    let timer: NodeJS.Timeout;
+    const handleStateChange = () => {
+      clearTimeout(timer);
+      timer = setTimeout(() => {
+        setTrigger(true);
+      }, duration);
+    }; handleStateChange(); return () => { clearTimeout(timer); };
+  }, [state, duration]);
+
+  return trigger;
+};
+
+
+export default function m(props: EventLogProps): any {
+  const selectedRef = useRef<LibSlidingup>(null)
+  const { event_id, gate, fromPage }: any = LibNavigation.getArgsAll(props)
+  const [, setSelectedData, getSelectedData] = useSafeState<any[]>([])
+  const [titleSliding, setTitleSliding] = useSafeState()
+  let counter = useRef(0).current
+  let counterDone = useRef(0).current
+
+  const backupEntrance = EventEntrance_successProperty.syncUsedTiket().useSelector(s => s)
+  const isStuckEntrance = useDetectStateChange(backupEntrance, 10000)
+
+  const backupExit = EventExit_successProperty.syncTicketExit().useSelector(s => s)
+  const isStuckExit = useDetectStateChange(backupExit, 10000)
+
+  const backupHall = EventHall_in_successProperty.syncHallIn().useSelector(s => s)
+  const isStuckHall = useDetectStateChange(backupHall, 10000)
+
+  const backupHall_out = EventHall_out_successProperty.syncHallOut().useSelector(s => s)
+  const isStuckHall_out = useDetectStateChange(backupHall_out, 10000)
+
+  let data = BigbangGate_infoProperty.counterState().get()
+
+  function transformData(data: any) {
+    const result: any = {};
+
+    // Iterasi setiap key dalam data
+    Object.entries(data)?.forEach(([key, value]: any) => {
+      // Inisialisasi array untuk setiap key di result
+      result[key] = [];
+      esp.log(key, value);
+      // Iterasi setiap id dan timestamps
+      Object.entries(value)?.forEach(([id, timestamps]: any) => {
+        // Menggunakan map untuk mengonversi timestamps menjadi array pasangan [timestamp, count]
+        const pairs = Object.entries(timestamps)?.map(([timestamp, count]) => [timestamp, count]);
+        // Menambahkan hasil pasangan ke result[key]
+        result[key]?.push(...pairs);
+      });
+    });
+    setSelectedData(result)
+    return result;
+  }
+
+  function closing() {
+    const counter = BigbangGate_infoProperty.getDataByDate()
+    let url = 'event_tms_closing' + LibUtils.objectToUrlParam({ event_id: event_id, gate_id: gate?.id })
+    let post = {
+      closing: JSON.stringify(counter)
+    }
+
+    LibDialog.warningConfirm(esp.lang("event/log", "title"), esp.lang("event/log", "msg"), esp.lang("event/log", "ok"), () => {
+      LibProgress.show(esp.lang("event/log", "wait"))
+      new LibCurl(url, post, (res, msg) => {
+        LibProgress.hide()
+        LibToastProperty.show(msg)
+        LibNavigation.back()
+
+        // reset counter
+        BigbangGate_infoProperty.counterState().reset()
+        EventEntrance_successProperty.syncUsedTiket().reset()
+        EventExit_successProperty.syncTicketExit().reset()
+        EventHall_in_successProperty.syncHallIn().reset()
+        EventHall_out_successProperty.syncHallOut().reset()
+
+      }, (err) => {
+        LibProgress.hide()
+        LibDialog.warning(esp.lang("event/log", "oops"), err?.message)
+      })
+    }, esp.lang("event/log", "no"), () => { })
+
+  }
+
+  function isEmptyObject(obj: any) {
+    return JSON.stringify(obj) === "{}";
+  }
+
+
+  return (
+    <View style={{ flex: 1 }}>
+      <ComponentHeader title={esp.lang("event/log", "header_title")} />
+      <ScrollView>
+        {/* scan gate in */}
+        <LibCollaps
+          header={(show) => {
+            return (
+              <View style={{ ...LibStyle.elevation(2), borderTopLeftRadius: 5, borderTopRightRadius: 5, paddingHorizontal: 10, paddingVertical: 5, margin: 15, marginBottom: 5, backgroundColor: LibStyle.colorGreen, flexDirection: 'row', alignContent: 'center', alignItems: 'center', justifyContent: 'space-between', borderBottomWidth: 2, borderBottomColor: "#c9c9c9" }}>
+                <Text allowFontScaling={false} style={{ fontSize: 16, fontWeight: 'bold', color: '#fff' }}>{esp.lang("event/log", "report_gate_in")}</Text>
+                <LibIcon name={show ? 'chevron-up' : 'chevron-down'} color='#fff' />
+              </View>
+            )
+          }}
+          show
+        >
+          <EventEntrance_log
+            onPress={(type: string, title: string) => {
+              setSelectedData(transformData(data)[type])
+              selectedRef.current?.show()
+              setTitleSliding(title)
+            }}
+          />
+        </LibCollaps>
+
+        {/* scan gate out */}
+        <LibCollaps
+          show
+          header={(show) => {
+            return (
+              <View style={{ ...LibStyle.elevation(2), borderTopLeftRadius: 5, borderTopRightRadius: 5, paddingHorizontal: 10, paddingVertical: 5, margin: 15, marginBottom: 5, backgroundColor: LibStyle.colorRed, flexDirection: 'row', alignContent: 'center', alignItems: 'center', justifyContent: 'space-between', borderBottomWidth: 2, borderBottomColor: "#c9c9c9" }}>
+                <Text allowFontScaling={false} style={{ fontSize: 16, fontWeight: 'bold', color: "#fff" }}>{esp.lang("event/log", "report_gate_out")}</Text>
+                <LibIcon name={show ? 'chevron-up' : 'chevron-down'} color='#fff' />
+              </View>
+            )
+          }}>
+          <EventExit_log
+            onPress={(type: string, title: string) => {
+              setSelectedData(transformData(data)[type])
+              selectedRef.current?.show()
+              setTitleSliding(title)
+            }}
+          />
+
+        </LibCollaps>
+
+        {/* scan hall in */}
+        <LibCollaps
+          show
+          header={(show) => {
+            return (
+              <View style={{ ...LibStyle.elevation(2), borderTopLeftRadius: 5, borderTopRightRadius: 5, paddingHorizontal: 10, paddingVertical: 5, margin: 15, marginBottom: 5, backgroundColor: "#fff", flexDirection: 'row', alignContent: 'center', alignItems: 'center', justifyContent: 'space-between', borderBottomWidth: 2, borderBottomColor: "#c9c9c9" }}>
+                <Text allowFontScaling={false} style={{ fontSize: 16, fontWeight: 'bold', color: LibStyle.colorGreen }}>{esp.lang("event/log", "report_hall_in")}</Text>
+                <LibIcon name={show ? 'chevron-up' : 'chevron-down'} />
+              </View>
+            )
+          }}>
+          <View>
+
+          </View>
+          <EventHall_in_log
+            onPress={(type: string, title: string) => {
+              setSelectedData(transformData(data)[type])
+              selectedRef.current?.show()
+              setTitleSliding(title)
+            }}
+          />
+        </LibCollaps>
+
+        {/* scan hall out */}
+        <LibCollaps
+          show
+          header={(show) => {
+            return (
+              <View style={{ ...LibStyle.elevation(2), borderTopLeftRadius: 5, borderTopRightRadius: 5, paddingHorizontal: 10, paddingVertical: 5, margin: 15, marginBottom: 5, backgroundColor: "#fff", flexDirection: 'row', alignContent: 'center', alignItems: 'center', justifyContent: 'space-between', borderBottomWidth: 2, borderBottomColor: "#c9c9c9" }}>
+                <Text allowFontScaling={false} style={{ fontSize: 16, fontWeight: 'bold', color: LibStyle.colorRed }}>{esp.lang("event/log", "report_hall_out")}</Text>
+                <LibIcon name={show ? 'chevron-up' : 'chevron-down'} />
+              </View>
+            )
+          }}>
+          <EventHall_out_log
+            onPress={(type: string, title: string) => {
+              setSelectedData(transformData(data)[type])
+              selectedRef.current?.show()
+              setTitleSliding(title)
+            }}
+          />
+        </LibCollaps>
+
+      </ScrollView>
+      <UseCondition if={backupExit.length == 0 && backupEntrance.length == 0 && backupHall.length == 0 && backupHall_out.length == 0} fallback={
+        <UseCondition if={isStuckEntrance || isStuckExit || isStuckHall || isStuckHall_out} >
+          <View style={{ padding: 10 }}>
+            <LibTextstyle textStyle='caption2' text={esp.lang("event/log", "alert")} />
+            <ComponentButton
+              style={{ marginTop: 10 }}
+              label={esp.lang("event/log", "btn_title")}
+              backgroundColor='#000'
+              onPress={() => {
+                LibDialog.confirm(esp.lang("event/log", "send_title"), esp.lang("event/log", "send_msg"), esp.lang("event/log", "send_ok"), () => {
+                  if (backupEntrance.length > 0) {
+                    counter = counter + 1
+                    Storage.setItem('event/entrance_log_copy_scanned', JSON.stringify(backupEntrance)).then(() => {
+                      sendFileTelegram('event/entrance_log_copy_scanned', () => {
+                        counterDone = counterDone + 1
+                        if (counter == counterDone) {
+                          if (!fromPage) {
+                            closing()
+                          }
+                        }
+                      })
+                    })
+                  }
+
+                  if (backupExit.length > 0) {
+                    counter = counter + 1
+                    Storage.setItem('event/exit_log_copy_scanned', JSON.stringify(backupExit)).then(() => {
+                      sendFileTelegram('event/exit_log_copy_scanned', () => {
+                        counterDone = counterDone + 1
+                        if (counter == counterDone) {
+                          if (!fromPage) {
+                            closing()
+                          }
+                        }
+                      })
+                    })
+                  }
+
+                  if (backupHall.length > 0) {
+                    counter = counter + 1
+                    Storage.setItem('event/hall_log_copy_scanned', JSON.stringify(backupHall)).then(() => {
+                      sendFileTelegram('event/hall_log_copy_scanned', () => {
+                        counterDone = counterDone + 1
+                        if (counter == counterDone) {
+                          if (!fromPage) {
+                            closing()
+                          }
+                        }
+                      })
+                    })
+                  }
+
+                  if (backupHall_out.length > 0) {
+                    counter = counter + 1
+                    Storage.setItem('event/hallout_log_copy_scanned', JSON.stringify(backupHall_out)).then(() => {
+                      sendFileTelegram('event/hallout_log_copy_scanned', () => {
+                        counterDone = counterDone + 1
+                        if (counter == counterDone) {
+                          if (!fromPage) {
+                            closing()
+                          }
+                        }
+                      })
+                    })
+                  }
+                }, esp.lang("event/log", "send_no"), () => { })
+              }} />
+          </View>
+        </UseCondition>
+      } >
+        <ComponentButton
+          style={{ margin: 10 }}
+          label={esp.lang("event/log", "btn_close")} onPress={() => {
+            if (isEmptyObject(data)) {
+              LibToastProperty.show(esp.lang("event/log", "empty_data"))
+            } else {
+              closing()
+            }
+          }} />
+      </UseCondition>
+      <LibSlidingup ref={selectedRef} >
+        <View style={{ height: 500, backgroundColor: 'white', borderTopLeftRadius: 20, borderTopRightRadius: 20 }} >
+          <Pressable onPress={() => selectedRef.current?.hide()} style={{ height: 4, borderRadius: 2, backgroundColor: '#aaa', width: 40, margin: 16, alignSelf: 'center', }} />
+          <View style={{ alignContent: 'center', alignItems: 'center', marginVertical: 15 }}>
+            <LibTextstyle textStyle="headline" text={esp.lang("event/log", "hourly_detail")} />
+            <LibTextstyle textStyle="headline" text={titleSliding} />
+          </View>
+          <ScrollView>
+            {
+              getSelectedData().map((item: any, i: number) => {
+                return (
+                  <View key={i} style={{ flexDirection: 'row', justifyContent: 'space-between', alignContent: 'center', alignItems: 'center', marginHorizontal: 15, paddingVertical: 6, borderBottomWidth: 1, borderBottomColor: LibStyle.colorLightGrey }}>
+                    <LibTextstyle text={LibUtils.moment(item[0] + ":00:00").serverFormat('DD MMM YYYY HH:mm')} textStyle="subhead" />
+                    <LibTextstyle text={LibUtils.number(item[1])} style={{ color: "#000" }} textStyle="title2" />
+                  </View>
+                )
+              })
+            }
+          </ScrollView>
+        </View>
+      </LibSlidingup >
+    </View>
+  )
+}
+
+async function sendFileTelegram(filePath: string, onDone: () => void) {
+  try {
+    let dbPath = Storage.getDBPath(filePath)
+    let fileInfo = await FileSystem.getInfoAsync(dbPath, {});
+    if (!fileInfo.exists) {
+      return
+    }
+
+    LibProgress.show(esp.lang("event/log", "sending_log"))
+    const fileName = fileInfo?.uri?.split('/').pop();
+    const formData = new FormData();
+    const email = UserClass.state().get('email')
+
+    let msg = [
+      '#log_tms from ' + email + ' with ' + Constants.deviceName,
+      esp.config('domain'),
+      // JSON.stringify({
+      //   ...counter,
+      //   waiting: EventEntrance_successProperty.syncUsedTiket().get().length
+      // }, undefined, 2),
+      // `RUMUS:`,
+      // `send = api_ok + api_no + blank `,
+      // `opengate = scan - scan_failed`,
+      // `waiting = opengate - api_ok`,
+    ].join('\n')
+    formData.append('caption', msg);
+    formData.append('chat_id', '-1001737180019');
+    formData.append('document', {
+      uri: dbPath,
+      name: email + '-' + fileName,
+      type: 'text/csv',
+    });
+    formData.append('document', {
+      uri: dbPath,
+      name: email + '-' + fileName,
+      type: 'text/csv',
+    });
+    const response = await fetch(
+      `https://api.telegram.org/bot923808407:AAEFBlllQNKCEn8E66fwEzCj5vs9qGwVGT4/sendDocument`,
+      {
+        method: 'POST',
+        body: formData,
+      }
+    );
+
+    const result = await response.json();
+    if (result.ok == true) {
+      LibToastProperty.show(esp.lang("event/log", "log_send"))
+      onDone()
+    } else {
+      LibToastProperty.show(result?.description)
+    }
+    LibProgress.hide()
+  } catch (error) {
+    LibToastProperty.show(JSON.stringify(error))
+    LibProgress.hide()
+  }
+}

package/event/qc_idcard.tsx

@@ -0,0 +1,209 @@
+// withHooks
+import { useEffect, useRef } from 'react';
+
+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 { ComponentSlidingup } from 'esoftplay/cache/component/slidingup/import';
+import { LibCurl } from 'esoftplay/cache/lib/curl/import';
+import { LibIcon } from 'esoftplay/cache/lib/icon/import';
+import { LibInput_rectangle2 } from 'esoftplay/cache/lib/input_rectangle2/import';
+import { LibLoading } from 'esoftplay/cache/lib/loading/import';
+import { LibNavigation } from 'esoftplay/cache/lib/navigation/import';
+import { LibProgress } from 'esoftplay/cache/lib/progress/import';
+import { LibStyle } from 'esoftplay/cache/lib/style/import';
+import { LibTextstyle } from 'esoftplay/cache/lib/textstyle/import';
+import { LibUtils } from 'esoftplay/cache/lib/utils/import';
+import esp from 'esoftplay/esp';
+import useSafeState from 'esoftplay/state';
+import React from 'react';
+import { Keyboard, RefreshControl, ScrollView, Text, TouchableOpacity, View } from 'react-native';
+
+
+export interface EventQc_idcardArgs {
+
+}
+export interface EventQc_idcardProps {
+
+}
+
+export function openScanner(event_id: any) {
+  LibNavigation.navigateForResult('component/scanner').then((value: any) => {
+    if (value) {
+      let post = {
+        qr: value,
+        event_id: event_id
+      }
+      LibProgress.show(esp.lang("event/qc_idcard", "wait"))
+      new LibCurl('event_exhibitor_qc', post, (res, msg) => {
+        LibProgress.hide()
+        LibNavigation.navigate('event/qc_idcard_success', {
+          data: { ...res.data },
+          event_id: event_id
+        })
+      }, (err) => {
+        LibProgress.hide()
+        LibNavigation.navigate('event/qc_idcard_failed', {
+          message: err?.message,
+          result: err?.result,
+          event_id: event_id
+        })
+      }, 1)
+    }
+  })
+}
+
+export default function m(props: EventQc_idcardProps): any {
+  const { data } = LibNavigation.getArgsAll(props)
+
+  const [result, setResult] = useSafeState<any>()
+  const [error, setError] = useSafeState<any>()
+  const [query, setQuery] = useSafeState<any>()
+  const [showReset, setShowReset] = useSafeState<boolean>(false)
+  const [counter, setCounter] = useSafeState(1)
+  const [refreshing, setRefreshing] = useSafeState<boolean>(false);
+  const dialogDetailExhibitor = useRef<ComponentSlidingup>(null)
+
+  const [selectedExhibitor, setSelectedExhibitor] = useSafeState<any>()
+
+  function loadData() {
+    let post = {
+      event_id: data?.id
+    }
+    let url = query ? 'event_exhibitor_qc_report?search=' + query : 'event_exhibitor_qc_report'
+    LibProgress.show(esp.lang("event/qc_idcard", "wait"))
+    new LibCurl(url, post, (res, msg) => {
+      setResult(res)
+      setError(undefined)
+      setRefreshing(false)
+      LibProgress.hide()
+    }, (err) => {
+      setRefreshing(false)
+      LibProgress.hide()
+      setResult(undefined)
+      setError(err)
+    }, 1)
+  }
+
+  useEffect(() => {
+    loadData()
+  }, [])
+
+  useEffect(() => {
+    loadData()
+  }, [counter])
+
+
+  function renderItem(item: any, i: number) {
+    return (
+      <TouchableOpacity onPress={() => {
+        setSelectedExhibitor(item)
+        LibUtils.debounce(() => {
+          dialogDetailExhibitor?.current?.show()
+        }, 100)
+      }} key={i} style={{ ...LibStyle.elevation(2), marginBottom: 5, margin: 10, backgroundColor: '#fff', borderRadius: 5 }}>
+        <View style={{ padding: 10, borderBottomWidth: 1, borderBottomColor: LibStyle.colorGrey, flexDirection: 'row', justifyContent: 'space-between' }}>
+          <Text allowFontScaling={false} numberOfLines={2} ellipsizeMode='tail' style={{ flex: 3, fontWeight: 'bold', fontSize: 16 }}>{item?.exhibitor_name}</Text>
+          <Text allowFontScaling={false} style={{ flex: 1, fontWeight: 'bold', textAlign: 'right', fontSize: 16 }}>{LibUtils.number(item?.qty)}</Text>
+        </View>
+      </TouchableOpacity>
+    )
+  }
+
+
+  function onRefresh() {
+    setRefreshing(true)
+    loadData()
+  }
+
+  if (!result && !error) {
+    return <LibLoading />
+  }
+
+  return (
+    <View style={{ flex: 1, backgroundColor: LibStyle.colorBgGrey }}>
+      <ComponentHeader title='QC ID CARD' subtitle={data?.name} />
+      {/* <Image 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.3, resizeMode: 'cover' }} /> */}
+      <View style={{ backgroundColor: '#fff', padding: 16, paddingBottom: 10, }} >
+        <View style={{ flexDirection: 'row' }}>
+          <LibInput_rectangle2
+            style={{ marginTop: 0, borderRadius: 5, flex: 1, height: 38 }}
+            placeholder={esp.lang("event/qc_idcard", "search_exhibitor")}
+            onChangeText={(e) => {
+              LibUtils.debounce(() => {
+                setQuery(e)
+              }, 200)
+            }}
+            blurOnSubmit
+            returnKeyType='go'
+            onSubmitEditing={() => {
+              if (query?.trim()) {
+                setCounter(counter + 1)
+                setShowReset(true)
+              }
+            }}
+          />
+          <TouchableOpacity onPress={() => {
+            if (query) {
+              setCounter(counter + 1)
+              Keyboard.dismiss()
+              setShowReset(true)
+            }
+          }} style={{ marginLeft: 5, height: 38, width: 38, backgroundColor: LibStyle.colorGreen, alignContent: 'center', justifyContent: 'center', alignItems: 'center', borderRadius: 5 }}>
+            <LibIcon name='magnify' color='#fff' />
+          </TouchableOpacity>
+        </View>
+        {
+          showReset &&
+          <TouchableOpacity onPress={() => {
+            setQuery(undefined)
+            setCounter(counter + 1)
+            setShowReset(false)
+          }} style={{ flexDirection: 'row' }}>
+            <View style={{ marginTop: 10, flexDirection: 'row', alignContent: 'center', alignItems: 'center', backgroundColor: LibStyle.colorRed, paddingVertical: 4, padding: 7, borderRadius: 5 }} >
+              <LibTextstyle textStyle="caption1" text={query} style={{ color: 'white' }} />
+              <LibIcon name='close-circle' style={{ marginLeft: 8 }} color="#fff" size={15} />
+            </View>
+          </TouchableOpacity>
+        }
+      </View>
+      <ScrollView refreshControl={<RefreshControl refreshing={refreshing} onRefresh={onRefresh} />}>
+        {
+          result?.length > 0 && result?.map(renderItem)
+        }
+        {
+          error &&
+          <ComponentMessage message={error?.message} style={{ marginTop: 30 }} />
+        }
+      </ScrollView>
+
+      <View style={{ padding: 10, backgroundColor: '#fff' }}>
+        <ComponentButton label={esp.lang("event/qc_idcard", "scan")} onPress={() => {
+          openScanner(data?.id)
+        }}
+          backgroundColor={LibStyle.colorGreen} />
+      </View>
+      <ComponentSlidingup ref={dialogDetailExhibitor}>
+        <View style={{ backgroundColor: '#f6f6f6', borderTopRightRadius: 20, borderTopLeftRadius: 20, paddingBottom: 35, paddingTop: 20, paddingHorizontal: 19, maxHeight: LibStyle.height - (LibStyle.height / 3) }}>
+          <ScrollView>
+            <View style={{ padding: 10, borderBottomWidth: 1, borderBottomColor: LibStyle.colorGrey, flexDirection: 'row', justifyContent: 'space-between' }}>
+              <Text allowFontScaling={false} numberOfLines={2} ellipsizeMode='tail' style={{ flex: 3, fontWeight: 'bold', fontSize: 16 }}>{selectedExhibitor?.exhibitor_name}</Text>
+              <Text allowFontScaling={false} style={{ flex: 1, fontWeight: 'bold', textAlign: 'right', fontSize: 16 }}>{LibUtils.number(selectedExhibitor?.qty)}</Text>
+            </View>
+            {
+              selectedExhibitor?.detail?.length > 0 && selectedExhibitor?.detail?.map((x: any, ii: number) => {
+                return (
+                  <View key={ii} style={{ padding: 10, borderBottomWidth: 1, borderBottomColor: LibStyle.colorGrey, flexDirection: 'row', justifyContent: 'space-between' }}>
+                    <Text allowFontScaling={false} numberOfLines={2} ellipsizeMode='tail' style={{ flex: 3, }}>{x.department_name}</Text>
+                    <Text allowFontScaling={false} style={{ flex: 1, textAlign: 'right', }}>{LibUtils.number(x.qty)}</Text>
+                  </View>
+                )
+              })
+            }
+          </ScrollView>
+        </View>
+      </ComponentSlidingup>
+
+    </View>
+  )
+}