esoftplay-event 0.0.1-z → 0.0.2-a

package/config.json

@@ -1,9 +1,9 @@
 {
   "fonts": {
+    "mono": "mono.ttf",
     "Arial": "Arial.ttf",
     "ArialBold": "ArialBold.ttf",
     "SFProText": "SFProText.ttf",
-    "mono": "mono.ttf",
     "MonoSpace": "MonoSpace.ttf",
     "DecoNumbers": "DecoNumbers.ttf",
     "digital": "digital.ttf"

package/event/button_order_detail.tsx

@@ -35,7 +35,7 @@ export default function m(props: EventButton_order_detailProps): any {
         </LibGradient>
         <View style={{ flex: 1, margin: 3, borderRadius: 5, ...LibStyle.elevation(2), backgroundColor: props.color, justifyContent: 'center', alignContent: 'center', alignItems: 'center' }}>
           {/* <LibIcon name={"dice-multiple"} size={40} color={EventOrder_itemProperty.textColor(props.color)} style={{ opacity: 1 }} /> */}
-          <LibIcon name={props.icon} size={40} color={EventOrder_itemProperty.textColor(props.color)} style={{ opacity: 1 }} />
+          <LibIcon name={props.icon} size={35} color={EventOrder_itemProperty.textColor(props.color)} style={{ opacity: 1 }} />
         </View>
       </View>
     </TouchableOpacity>

package/event/countdown_event.tsx

@@ -3,6 +3,7 @@
 
 import { EventCountdown_base } from 'esoftplay/cache/event/countdown_base/import';
 import { LibStyle } from 'esoftplay/cache/lib/style/import';
+import esp from 'esoftplay/esp';
 import React, { useEffect } from 'react';
 import { StyleProp, Text, TextStyle, View, ViewStyle } from 'react-native';
 import Animated, { useAnimatedStyle, useSharedValue, withRepeat, withTiming } from 'react-native-reanimated';

package/event/order_detail.tsx

@@ -37,6 +37,7 @@ import useSafeState from 'esoftplay/state';
 import useGlobalSubscriber, { useGlobalSubscriberReturn } from 'esoftplay/subscribe';
 import React, { useEffect, useRef } from 'react';
 import { Linking, Pressable, Text, TouchableOpacity, View } from 'react-native';
+import { ScrollView } from 'react-native-gesture-handler';
 import QRCode from 'react-native-qrcode-svg';
 
 
@@ -100,6 +101,7 @@ export default function m(props: EventOrder_detailProps): any {
   const [user] = UserClass.state().useState()
 
   let showQR = useRef<LibSlidingup>(null)
+  let dialogAddonList = useRef<LibSlidingup>(null)
   const dialogSendBack = useRef<LibSlidingup>(null)
   const url = LibNavigation.getArgs(props, 'url')
   const [result, setResult] = useSafeState<any>(EventIndexProperty?.stateTicketCache()?.get()?.filter?.((x: any) => x.url?.replace?.('?id=', '/') == url?.replace?.('?id=', '/'))?.[0]?.detail)
@@ -110,6 +112,7 @@ export default function m(props: EventOrder_detailProps): any {
 
   const [coupons, setCoupons] = useSafeState<any>()
   const [qty, setQty] = useSafeState<number>(1)
+  const [, setGroupAddon, getGroupAddon] = useSafeState()
 
   const dataOfflineReview = EventReview_addProperty.state().get()
   let availableOfflineReview = dataOfflineReview?.filter((z: any) => z?.booking_id == result?.id)
@@ -382,6 +385,8 @@ export default function m(props: EventOrder_detailProps): any {
 
   const termData = result?.term ? Object.values(result?.term) : []
 
+  // esp.log(getGroupAddon());
+
   return (
     <View style={{ flex: 1, backgroundColor: LibStyle.colorBgGrey }}>
       <EventHeader title={esp.lang("event/order_detail", "order_detail")} />
@@ -418,11 +423,26 @@ export default function m(props: EventOrder_detailProps): any {
 
             <View style={{ flexDirection: 'row', margin: 16, justifyContent: 'space-between', marginTop: 0 }}>
               <View style={{ flex: 1 }}>
+                {/* <View style={{ flexDirection: 'row' }}> */}
                 <View style={{ flexDirection: 'row', alignContent: 'center', alignItems: 'center' }}>
                   <LibIcon name="ticket-outline" size={20} />
                   <Text allowFontScaling={false} style={{ marginLeft: 6, fontFamily: "Arial", fontSize: 30, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#484848" }}>{result?.qty}</Text>
                   <Text allowFontScaling={false} style={{ marginLeft: 4, fontFamily: "Arial", fontSize: 16, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0, color: "#484848" }}>{esp.lang("event/order_detail", "ticket")}</Text>
                 </View>
+
+                <View style={{ position: 'absolute', right: 0, justifyContent: 'flex-end', alignContent: 'center', alignItems: 'flex-end' }}>
+                  {
+                    result?.qr != "" && useIndividualQr == 0 &&
+                    <TouchableOpacity onPress={() => {
+                      showQR?.current?.show()
+                    }}>
+                      <EventQr_bg>
+                        <QRCode ecl="H" size={80} value={result?.qr} />
+                      </EventQr_bg>
+                    </TouchableOpacity>
+                  }
+                </View>
+                {/* </View> */}
                 <UseCondition if={result?.show_ticket_status == 1 && result?.status == 1 || result?.status == 3 || result?.status == 6}>
                   <Text allowFontScaling={false} style={{ fontSize: 12, fontWeight: "normal", fontStyle: "normal", letterSpacing: 0, marginBottom: 12, color: "#484848" }}>
                     {
@@ -456,35 +476,32 @@ export default function m(props: EventOrder_detailProps): any {
                   <View style={{ marginTop: 15, marginRight: 10 }}>
                     <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 14, marginBottom: 5, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#4a4a4a" }}>{esp.lang("event/order_detail", "seat_number")}</Text>
                     <View style={{ flexDirection: 'row', flexWrap: 'wrap' }}>
-                      {
-                        tickets?.map((item: any, i: number) => {
+                      {tickets?.map((item: any, i: number) => {
+                        const [front, end] = item?.seat_name?.split("#") || ["", ""];
+                        if (item?.seat_name?.includes("#")) {
+                          return (
+                            <View key={i} style={{ flexDirection: 'row', alignItems: 'center', paddingVertical: 5, marginBottom: 7, paddingHorizontal: 5, backgroundColor: '#fff', borderRadius: 5, marginRight: 7, ...LibStyle.elevation(5), }}>
+                              <Text allowFontScaling={false} style={{ fontWeight: 'bold', fontSize: 16, color: "#000" }}> {front} </Text>
+                              <Text allowFontScaling={false} style={{ marginLeft: 3, fontWeight: 'bold', fontSize: 16, color: '#000', }}> {end} </Text>
+                            </View>
+                          );
+                        } else {
                           return (
-                            <View key={i} style={{ paddingVertical: 5, marginBottom: 7, paddingHorizontal: 7, borderWidth: 1, borderColor: '#000', backgroundColor: '#fff', borderRadius: 5, marginRight: 7 }}>
-                              <Text allowFontScaling={false} style={{ fontWeight: 'bold', fontSize: 20, color: '#000' }}>{item.seat_name}</Text>
+                            <View key={i} style={{ flexDirection: 'row', alignItems: 'center', paddingVertical: 5, marginBottom: 7, paddingHorizontal: 5, backgroundColor: '#fff', borderRadius: 5, marginRight: 7, ...LibStyle.elevation(5), }}>
+                              <Text allowFontScaling={false} style={{ fontWeight: 'bold', fontSize: 20, color: "#000" }}>{item?.seat_name}</Text>
                             </View>
                           )
-                        })
-                      }
+                        }
+                      })}
                     </View>
                   </View>
                 }
 
-              </View>
-              <View style={{ marginTop: 14, justifyContent: 'center', alignContent: 'center', alignItems: 'center' }}>
-                {
-                  result?.qr != "" && useIndividualQr == 0 &&
-                  <TouchableOpacity onPress={() => {
-                    showQR?.current?.show()
-                  }}>
-                    <EventQr_bg>
-                      <QRCode ecl="H" size={80} value={result?.qr} />
-                    </EventQr_bg>
-                  </TouchableOpacity>
-                }
+
               </View>
             </View>
-
           </View>
+
         }
         {
           useIndividualQr > 0 && dataTickets.length > 0 ?
@@ -536,7 +553,7 @@ export default function m(props: EventOrder_detailProps): any {
 
         <UseCondition if={result?.is_luckydraw && result?.is_luckydraw == 2}>
           <View style={{ margin: 15, padding: 10, marginBottom: 0, justifyContent: 'center', alignContent: 'center', alignItems: 'center', borderRadius: 7, backgroundColor: LibStyle.colorBgGrey, paddingBottom: 10, ...LibStyle.elevation(3) }}>
-            <LibTextstyle textStyle='headline' text={result?.config_luckydraw != null ? esp.lang("event/order_detail", "already_follow") + result?.config_luckydraw?.title : esp.lang("event/order_detail", "already_join_lucky_draw")} style={{ color: '#c9c9c9', fontWeight: 'bold' }} />
+            <LibTextstyle textStyle='headline' text={esp.lang("event/order_detail", "already_join_lucky_draw")} style={{ color: '#c9c9c9', fontWeight: 'bold' }} />
           </View>
         </UseCondition>
 
@@ -560,17 +577,36 @@ export default function m(props: EventOrder_detailProps): any {
         {/* tombol add on */}
         {
           result?.addons?.length > 0 && result?.addons?.map((item: any, i: number) => {
-            return (
-              <EventButton_order_detail
-                color={result?.color}
-                onPress={() => {
-                  loadDataAddons(item?.addons_id, item?.url)
-                }}
-                icon={'plus-circle'}
-                title={item.title}
-                info={item.info}
-              />
-            )
+            if (item?.hasOwnProperty("group_id")) {
+              return (
+                <EventButton_order_detail
+                  color={result?.color}
+                  onPress={() => {
+                    setGroupAddon(item)
+                    LibUtils.debounce(() => {
+                      dialogAddonList?.current?.show()
+                    }, 100)
+                    // loadDataAddons(item?.addons_id, item?.url)
+                  }}
+                  icon={'chevron-down'}
+                  title={item.group_title}
+                  info={""}
+                />
+              )
+            } else {
+              return (
+                <EventButton_order_detail
+                  key={i}
+                  color={result?.color}
+                  onPress={() => {
+                    loadDataAddons(item?.addons_id, item?.url)
+                  }}
+                  icon={'plus-circle-outline'}
+                  title={item.title}
+                  info={item.info}
+                />
+              )
+            }
           })
         }
 
@@ -833,6 +869,36 @@ export default function m(props: EventOrder_detailProps): any {
         </View>
       </LibSlidingup>
 
+      {/* add on list */}
+      <LibSlidingup ref={dialogAddonList}>
+        <View style={{ backgroundColor: 'white', borderTopRightRadius: 20, maxHeight: LibStyle.height / 2, borderTopLeftRadius: 20, paddingBottom: 20 }}>
+          <View style={{ margin: 15, flexDirection: 'row', justifyContent: 'space-between', alignContent: 'center', alignItems: 'center' }}>
+            <Text allowFontScaling={false} style={{ flex: 1, fontSize: 16, fontWeight: 'bold' }}>{getGroupAddon()?.group_title}</Text>
+            <TouchableOpacity style={{ flex: 1, alignItems: 'flex-end' }} onPress={() => dialogAddonList?.current?.hide()}>
+              <LibIcon name='close' />
+            </TouchableOpacity>
+          </View>
+          <ScrollView>
+            {
+              getGroupAddon()?.addons?.length > 0 && getGroupAddon()?.addons?.map((item: any, i: number) => {
+                return (
+                  <EventButton_order_detail
+                    key={i}
+                    color={result?.color}
+                    onPress={() => {
+                      loadDataAddons(item?.addons_id, item?.url)
+                    }}
+                    icon={'plus-circle-outline'}
+                    title={item.title}
+                    info={item.info}
+                  />
+                )
+              })
+            }
+          </ScrollView>
+        </View>
+      </LibSlidingup>
+
       <LibSlidingup ref={dialogSendBack} >
         <View style={{ backgroundColor: 'white', borderTopLeftRadius: 20, borderTopRightRadius: 20, padding: 20 }} >
           <EventPopup email={result?.sharer_email?.trim?.()} redirect={() => {
@@ -872,7 +938,6 @@ export default function m(props: EventOrder_detailProps): any {
               </View>
             }
           />
-
         </View>
       </LibSlidingup>
 

package/event/order_lottery.tsx

@@ -71,7 +71,7 @@ export default function m(props: EventOrder_lotteryProps): any {
     }
 
     LibDialog.confirm(esp.lang("event/order_lottery", "confirm"), esp.lang("event/order_lottery", "confirm_point"), esp.lang("event/order_lottery", "yes"), () => {
-      LibProgress.show("Mohon tunggu")
+      LibProgress.show(esp.lang("event/order_lottery", "please_wait"))
       new LibCurl("event_order_detail_luckydraw_claim?id=" + id, post, (res: any) => {
         LibProgress.hide()
         esp.log(res);
@@ -152,8 +152,10 @@ export default function m(props: EventOrder_lotteryProps): any {
 
   return (
     <View style={{ flex: 1, backgroundColor: LibStyle.colorBgGrey /* "#FFC523" */ }}>
-      <EventHeader title={result?.config != null ? result?.config?.title : esp.lang("event/order_lottery", "follow_lucky_draw")}
-        subtitle={result?.config != null ? result?.config?.subtitle : ""} />
+      <EventHeader
+        title={result?.config != null ? result?.config?.title : esp.lang("event/order_lottery", "follow_lucky_draw")}
+        // subtitle={result?.config != null ? result?.config?.subtitle : ""}
+      />
 
       <ScrollView>
         {

package/event/seat.tsx

@@ -355,6 +355,8 @@ export default function m(props: EventSeatProps): any {
 
   function renderTicketShare(item: any, i: number) {
     let _selectTicket = item.hasOwnProperty('check') && item.check
+    const [front, end] = item?.seat_name?.split("#") || ["", ""];
+
     return (
       <TouchableOpacity onPress={() => {
         if (counter + 1 > dataTicket?.qty && !item.check) {
@@ -365,7 +367,12 @@ export default function m(props: EventSeatProps): any {
           setCounter(item.check ? counter - 1 : counter + 1)
         }
       }} key={i} style={styleId_Z1ppFKw}>
-        <Text allowFontScaling={false}>{item.seat_name}</Text>
+        <View key={i} style={{ flexDirection: 'row', alignItems: 'center', paddingVertical: 5, paddingHorizontal: 5, backgroundColor: '#fff', borderRadius: 5, marginRight: 7, ...LibStyle.elevation(5), }}>
+          <Text allowFontScaling={false} style={{ fontWeight: 'bold', fontSize: 16, color: "#000" }}> {front} </Text>
+          <Text allowFontScaling={false} style={{ marginLeft: 3, fontWeight: 'bold', fontSize: 16, color: '#000', }}> {end} </Text>
+        </View>
+
+        {/* <Text allowFontScaling={false}>{item.seat_name}</Text> */}
         <TouchableOpacity onPress={() => {
           if (!item.check && counter + 1 > dataTicket?.qty) {
             alertSelectSeat()
@@ -383,6 +390,7 @@ export default function m(props: EventSeatProps): any {
 
   function renderTicketReturn(item: any, i: number) {
     let _selectTicket = item.hasOwnProperty('check') && item.check
+    const [front, end] = item?.seat_name?.split("#") || ["", ""];
     return (
       <TouchableOpacity onPress={() => {
         if (counter + 1 > dataTicket?.qty && !item.check) {
@@ -393,7 +401,12 @@ export default function m(props: EventSeatProps): any {
           setCounter(item.check ? counter - 1 : counter + 1)
         }
       }} key={i} style={styleId_Z1ppFKw}>
-        <Text allowFontScaling={false}>{item.seat_name}</Text>
+        <View key={i} style={{ flexDirection: 'row', alignItems: 'center', paddingVertical: 5, paddingHorizontal: 5, backgroundColor: '#fff', borderRadius: 5, marginRight: 7, ...LibStyle.elevation(5), }}>
+          <Text allowFontScaling={false} style={{ fontWeight: 'bold', fontSize: 16, color: "#000" }}> {front} </Text>
+          <Text allowFontScaling={false} style={{ marginLeft: 3, fontWeight: 'bold', fontSize: 16, color: '#000', }}> {end} </Text>
+        </View>
+
+        {/* <Text allowFontScaling={false}>{item.seat_name}</Text> */}
         <TouchableOpacity onPress={() => {
           if (!item.check && counter + 1 > dataTicket?.qty) {
             alertSelectSeat()

package/event/seat_map_new.tsx

@@ -202,15 +202,16 @@ export default function m(props: any): any {
                   }}>
                   {
                     getData()?.map(([x, y, name, status], i) => {
+                      let newName = name?.replace(/^.*#/, "")
                       const isSelected = getSelectedSeat()?.includes(name)
                       const color = isSelected ? "#8EF67B" : getColorByStatus(status)
                       const xSize = (boxSize / 2) + (x * boxSize)
                       const ySize = (boxSize / 2) + (y * boxSize)
 
-                      const fontSize = getFontSizeByLength(name?.length);
-                      const font = getFontByLength(name?.length);
+                      const fontSize = getFontSizeByLength(newName?.length);
+                      const font = getFontByLength(newName?.length);
 
-                      const textWidthApprox = fontSize * name?.length * 0.6;
+                      const textWidthApprox = fontSize * newName?.length * 0.6;
                       const textX = xSize + (boxSize - textWidthApprox) / 2;
 
                       return (
@@ -236,7 +237,7 @@ export default function m(props: any): any {
                               x={textX}
                               y={(ySize) + boxSize * 0.60}
                               color={"#020202"}
-                              text={name}
+                              text={newName}
                               transform={[{ scale }]}
                               font={font} />
                           )}
@@ -269,6 +270,8 @@ export default function m(props: any): any {
             let value = {
               seat_label: getSelectedSeat()
             }
+            esp.log({ value });
+            // return
             if (getSelectedSeat()?.length < qty) {
               LibToastProperty.show(esp.lang("event/seat_map", "seat_more", (qty - (getSelectedSeat()?.length)).toString()))
             } else {

package/event/ticket_list.tsx

@@ -143,7 +143,7 @@ export default function m(props: EventTicket_listProps): any {
   const [timer] = EventCountdownProperty.countdownTime.useState()
 
   const [unAvailableResult, setUnavailableResult] = useLazyState<any>()
-  const [availableResult, setAvailableResult] = useSafeState<Result>()
+  const [availableResult, setAvailableResult, getAvailableResult] = useSafeState<Result>()
   const [urlPayment, setUrlPayment] = useLazyState<any>()
 
   const [qty, setQty, getQty] = useSafeState<number>(1)
@@ -348,7 +348,7 @@ export default function m(props: EventTicket_listProps): any {
     let colorBackground = item.status != 1 ? LibStyle.colorLightGrey : itemT.status != 1 ? LibStyle.colorLightGrey : colorDefault
     let textOpacity = /* item.status == 1 ? 1 :  */itemT?.status == 1 ? 1 : 0.3
 
-    let showCountDown = esp.isDebug("show_countdown") && itemT.status != 0 && item?.date_start != "0000-00-00 00:00:00" && item?.date_end != "0000-00-00 00:00:00"
+    let showCountDown = getAvailableResult()?.countdown_booking == "1" && itemT?.status == 1 && item?.status == 1 && item?.date_start != "0000-00-00 00:00:00" && item?.date_end != "0000-00-00 00:00:00" && moment(item?.date_end).format("YYYY-MM-DD HH:mm:ss") >= moment().format("YYYY-MM-DD HH:mm:ss")
     let dateShowed = item?.price_date == 1 ?
       moment(item?.date_end).format("YYYY-MM-DD HH:mm:ss") > moment(itemT?.ondate).format("YYYY-MM-DD HH:mm:ss") ? moment(itemT?.ondate).add(1, "days").format("YYYY-MM-DD HH:mm:ss") : item?.date_end
       : item?.date_end
@@ -629,7 +629,7 @@ export default function m(props: EventTicket_listProps): any {
                                 }
                               </EventHtmltext>
                               {
-                                availableResult?.countdown_booking == "1" && displayedData?.length == 1 && item?.date_start != "0000-00-00 00:00:00" && item?.date_end != "0000-00-00 00:00:00" &&
+                                availableResult?.countdown_booking == "1" && displayedData?.length == 1 && item?.status == 1 && item?.date_start != "0000-00-00 00:00:00" && item?.date_end != "0000-00-00 00:00:00" && moment(item?.date_end).format("YYYY-MM-DD HH:mm:ss") >= moment().format("YYYY-MM-DD HH:mm:ss") &&
                                 <EventCountdown_event date={item?.date_end} containerStyle={{ marginVertical: -5 }} />
                               }
                               {

package/event/ticket_list2.tsx

@@ -22,6 +22,7 @@ import { EventAlert } from 'esoftplay/cache/event/alert/import';
 import { EventConfigProperty } from 'esoftplay/cache/event/config/import';
 import { EventCountdownProperty } from 'esoftplay/cache/event/countdown/import';
 import { EventCountdown_base } from 'esoftplay/cache/event/countdown_base/import';
+import { EventCountdown_event } from 'esoftplay/cache/event/countdown_event/import';
 import { EventFirebase_socket, EventFirebase_socketProperty } from 'esoftplay/cache/event/firebase_socket/import';
 import { EventHtmltext } from 'esoftplay/cache/event/htmltext/import';
 import { EventLoading_pageProperty } from 'esoftplay/cache/event/loading_page/import';
@@ -55,6 +56,7 @@ type Result = {
   "status": string,
   "quota_checkout": string,
   "show_price": string,
+  "countdown_booking": string,
   "config_queue": {
     "limit": number,
     "time": number,
@@ -399,6 +401,12 @@ export default function m(props: EventTicket_list2Props): any {
     let colorBackground = item.status != 1 ? LibStyle.colorLightGrey : itemC.status != 1 ? LibStyle.colorLightGrey : colorDefault
     let textOpacity = /* item.status == 1 ? 1 :  */itemC?.status == 1 ? 1 : 0.3
 
+    let showCountDown = getAvailableResult()?.countdown_booking == "1" && itemC?.status == 1 && item?.status == 1 && item?.date_start != "0000-00-00 00:00:00" && item?.date_end != "0000-00-00 00:00:00" && moment(item?.date_end).format("YYYY-MM-DD HH:mm:ss") >= moment().format("YYYY-MM-DD HH:mm:ss")
+    let dateShowed = item?.price_date == 1 ?
+      moment(item?.date_end).format("YYYY-MM-DD HH:mm:ss") > moment(itemC?.ondate).format("YYYY-MM-DD HH:mm:ss") ? moment(itemC?.ondate).add(1, "days").format("YYYY-MM-DD HH:mm:ss") : item?.date_end
+      : item?.date_end
+
+
     return (
       <TouchableOpacity key={iC} onPress={() => {
         let msg = ""
@@ -463,11 +471,22 @@ export default function m(props: EventTicket_list2Props): any {
                       </View>
                     </View>
                   }
-                  <Text allowFontScaling={false} style={applyStyle({ opacity: textOpacity, fontFamily: "Arial", fontSize: 14, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: _selectedTicket ? "#3ea4dc" : '#999' })}>{LibUtils.moment(itemC.ondate).localeFormat('dddd')}</Text>
-                  <View style={applyStyle({ flexDirection: 'row' })}>
-                    <Text allowFontScaling={false} style={applyStyle({ opacity: textOpacity, fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: _selectedTicket ? "#3ea4dc" : '#999' })}>{LibUtils.moment(itemC.ondate).localeFormat('MMMM')}</Text>
-                    <Text allowFontScaling={false} style={applyStyle({ opacity: textOpacity, marginLeft: 7, fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: _selectedTicket ? "#3ea4dc" : '#999' })}>{LibUtils.moment(itemC.ondate).localeFormat('YYYY')}</Text>
-                  </View>
+                  {
+                    showCountDown ?
+                      <Text allowFontScaling={false} style={applyStyle({ opacity: textOpacity, fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: _selectedTicket ? "#3ea4dc" : '#999' })}>{LibUtils.moment(itemC?.ondate).localeFormat('dddd, MMMM YYYY')}</Text>
+                      :
+                      <>
+                        <Text allowFontScaling={false} style={applyStyle({ opacity: textOpacity, fontFamily: "Arial", fontSize: 14, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: _selectedTicket ? "#3ea4dc" : '#999' })}>{LibUtils.moment(itemC.ondate).localeFormat('dddd')}</Text>
+                        <View style={applyStyle({ flexDirection: 'row' })}>
+                          <Text allowFontScaling={false} style={applyStyle({ opacity: textOpacity, fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: _selectedTicket ? "#3ea4dc" : '#999' })}>{LibUtils.moment(itemC.ondate).localeFormat('MMMM')}</Text>
+                          <Text allowFontScaling={false} style={applyStyle({ opacity: textOpacity, marginLeft: 7, fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: _selectedTicket ? "#3ea4dc" : '#999' })}>{LibUtils.moment(itemC.ondate).localeFormat('YYYY')}</Text>
+                        </View>
+                      </>
+                  }
+                  {
+                    showCountDown &&
+                    <EventCountdown_event date={dateShowed} containerStyle={{ marginVertical: -5 }} />
+                  }
                 </View>
               </View>
               :
@@ -647,6 +666,11 @@ export default function m(props: EventTicket_list2Props): any {
                                   <Text style={{ color: LibStyle.colorRed, fontSize: 10, fontWeight: 'normal' }}> {"(" + esp.lang("event/ticket_list", "min_order") + LibUtils.number(item.qty_min) + ")"}</Text>
                                 }
                               </EventHtmltext>
+                              {
+                                availableResult?.countdown_booking == "1" && displayedData?.length == 1 && item?.status == 1 && item?.date_start != "0000-00-00 00:00:00" && item?.date_end != "0000-00-00 00:00:00" && moment(item?.date_end).format("YYYY-MM-DD HH:mm:ss") >= moment().format("YYYY-MM-DD HH:mm:ss") &&
+                                <EventCountdown_event date={item?.date_end} containerStyle={{ marginVertical: -5 }} />
+                              }
+
                               {
                                 deeplinkParams?.type == 'event-voucher' && deeplinkParams?.price_id == item.price_id ?
                                   <Text allowFontScaling={false} style={{ color: "coral", fontSize: 12, fontWeight: 'bold' }}>{esp.lang("event/ticket_list", "applied_code", deeplinkParams?.code)}</Text>

package/event/tms_check_ticket_result.tsx

@@ -248,16 +248,25 @@ export default function m(props: EventTms_check_ticket_resultProps): any {
                         <Text allowFontScaling={false} style={{ fontSize: 14 }}>{LibUtils.moment(item?.ondate).localeFormat('DD MMMM YYYY')}</Text>
                     }
                   </View>
-                  <View style={{ marginBottom: 10, flexDirection: 'row', flexWrap: 'wrap', marginLeft: -10 }}>
+                  <View style={{ marginBottom: 10, flexDirection: 'row', flexWrap: 'wrap' }}>
                     {
                       item?.tickets?.map((x: any, i: number) => {
+                        const [front, end] = x?.seat_label?.split("#") || ["", ""];
                         if (x.seat_label != "") {
-                          return (
-                            <View key={i} style={{ marginLeft: 10, paddingVertical: 5, marginBottom: 7, paddingHorizontal: 7, borderWidth: 1, borderColor: '#000', backgroundColor: '#fff', borderRadius: 5 }}>
-                              <Text allowFontScaling={false} style={{ fontWeight: 'bold', fontSize: 20, color: '#000' }}>{x.seat_label}</Text>
-                            </View>
-
-                          )
+                          if (x?.seat_label?.includes("#")) {
+                            return (
+                              <View key={i} style={{ flexDirection: 'row', alignItems: 'center', paddingVertical: 5, marginBottom: 7, paddingHorizontal: 5, backgroundColor: '#fff', borderRadius: 5, marginRight: 7, ...LibStyle.elevation(5), }}>
+                                <Text allowFontScaling={false} style={{ fontWeight: 'bold', fontSize: 16, color: "#000" }}> {front} </Text>
+                                <Text allowFontScaling={false} style={{ marginLeft: 3, fontWeight: 'bold', fontSize: 16, color: '#000', }}> {end} </Text>
+                              </View>
+                            )
+                          } else {
+                            return (
+                              <View key={i} style={{ flexDirection: 'row', alignItems: 'center', paddingVertical: 5, marginBottom: 7, paddingHorizontal: 5, backgroundColor: '#fff', borderRadius: 5, marginRight: 7, ...LibStyle.elevation(5), }}>
+                                <Text allowFontScaling={false} style={{ fontWeight: 'bold', fontSize: 16, color: "#000" }}>{x?.seat_label}</Text>
+                              </View>
+                            )
+                          }
                         } else {
                           return null
                         }

package/event/tms_in_hall.tsx

@@ -44,6 +44,7 @@ export default function m(props: EventTms_in_hallProps): any {
     var post = {
       event_id: event_id,
       user_qr: qr_code,
+      // user_qr: "BBO-IBT2376",
       hall_id: selectGate?.id
     }
 
@@ -71,7 +72,6 @@ export default function m(props: EventTms_in_hallProps): any {
         }
       });
 
-      esp.log({ res });
 
       if (res?.hasOwnProperty("staff")) {
         res?.staff?.map((it: any) => {
@@ -87,6 +87,9 @@ export default function m(props: EventTms_in_hallProps): any {
         })
       }
 
+      esp.log({ res, ticketsData });
+
+
       if (ticketsData.length == 1) { // cek jika tiket cuma 1
         let tiket = ticketsData[0]
         if (tiket.price_id == "staff") { // jika itu adalah id card

package/event/tms_in_hall_failed.tsx

@@ -180,7 +180,7 @@ export default function m(props: EventTms_in_hall_failedProps): any {
               {
                 msgError?.result?.length > 0 && msgError?.result?.map((item: any, i: number) => {
                   return (
-                    <View key={i} style={{ marginBottom: 5, backgroundColor: "#fff", borderRadius: 10, overflow: 'hidden' }}>
+                    <View key={i} style={{ marginHorizontal: 10, marginBottom: 5, backgroundColor: "#fff", borderRadius: 10, overflow: 'hidden' }}>
                       {
                         item.hasOwnProperty("status_label") && item?.status_label != "" &&
                         <View style={{ backgroundColor: '#37c2d0', padding: 10, }} >
@@ -235,16 +235,14 @@ export default function m(props: EventTms_in_hall_failedProps): any {
           </View>
         </UseCondition>
         <View style={{ flexDirection: 'row', width: LibStyle.width - 40, alignItems: 'center', marginVertical: 10, justifyContent: 'space-between' }}>
-          <UseCondition if={msgError?.status_code != 'EV043'}>
-            <Pressable onPress={() => {
-              LibDialog.warningConfirm(esp.lang("event/tms_in_failed", "warn_title"), esp.lang("event/tms_in_failed", "warn_msg"), esp.lang("event/tms_in_failed", "warn_ok"), () => {
-                sendTelegram()
-              }, esp.lang("event/tms_in_failed", "warn_no"), () => { })
+          <Pressable onPress={() => {
+            LibDialog.warningConfirm(esp.lang("event/tms_in_failed", "warn_title"), esp.lang("event/tms_in_failed", "warn_msg"), esp.lang("event/tms_in_failed", "warn_ok"), () => {
+              sendTelegram()
+            }, esp.lang("event/tms_in_failed", "warn_no"), () => { })
 
-            }} style={{ width: (LibStyle.width - 45) * 0.5, height: 40, borderRadius: 5, backgroundColor: LibStyle.colorRed, borderWidth: 3, borderColor: "#fff", justifyContent: 'center', alignContent: 'center', alignItems: 'center', ...LibStyle.elevation(10) }}>
-              <Text allowFontScaling={false} style={{ textAlign: 'center', fontWeight: 'bold', color: "#fff" }}>{esp.lang("event/tms_in_hall_failed", "report_error")}</Text>
-            </Pressable>
-          </UseCondition>
+          }} style={{ width: (LibStyle.width - 45) * 0.5, height: 40, borderRadius: 5, backgroundColor: LibStyle.colorRed, borderWidth: 3, borderColor: "#fff", justifyContent: 'center', alignContent: 'center', alignItems: 'center', ...LibStyle.elevation(10) }}>
+            <Text allowFontScaling={false} style={{ textAlign: 'center', fontWeight: 'bold', color: "#fff" }}>{esp.lang("event/tms_in_hall_failed", "report_error")}</Text>
+          </Pressable>
           <Pressable onPress={getBack} style={{ width: (LibStyle.width - 45) * 0.5, backgroundColor: LibStyle.colorGreen, height: 40, borderRadius: 5, borderWidth: 5, borderColor: LibStyle.colorGreen, justifyContent: 'center', alignContent: 'center', alignItems: 'center', ...LibStyle.elevation(10) }}>
             <Text allowFontScaling={false} style={{ fontWeight: 'bold', color: "#fff" }}>{esp.lang("event/tms_in_hall_failed", "back")}</Text>
           </Pressable>

package/event/visitor_input.tsx

@@ -23,7 +23,6 @@ import { useRef } from 'react';
 import { applyStyle } from 'esoftplay';
 import { EventInput_rectangle } from 'esoftplay/cache/event/input_rectangle/import';
 import { EventLabel_input } from 'esoftplay/cache/event/label_input/import';
-import { UserClass } from 'esoftplay/cache/user/class/import';
 import useLazyState from 'esoftplay/lazy';
 import React, { useEffect } from 'react';
 import { ActivityIndicator, Platform, ScrollView, Text, TouchableOpacity, View } from 'react-native';
@@ -55,7 +54,7 @@ export default function m(props: EventVisitor_inputProps): any {
   }
 
   useEffect(() => {
-    if (UserClass.state().get().email == 'bagus@fisip.net') {
+    if (esp.isDebug("")) {
       LibNavigation.replace('event/visitor_inputv2', { data: _data, url: url })
     } else {
       loadData()

package/event/visitor_inputv2.tsx

@@ -46,9 +46,13 @@ export default function m(props: EventVisitor_inputv2Props): any {
   const [counter, setCounter] = useSafeState(1)
   const [listClaim, setListClaim] = useSafeState()
   const [selectedCode, setSelectedCode] = useSafeState()
+  const [token, setToken] = useSafeState()
 
   const dialogListClaim = useRef<LibSlidingup>(null)
   const dialogClaim = useRef<LibSlidingup>(null)
+  let inputName = useRef<EventInput_rectangle>(null)
+  let inputToken = useRef<EventInput_rectangle>(null)
+
 
   let _tabs: any = getData()?.list
   function setText(list_id: string): (name: string) => void {
@@ -108,6 +112,38 @@ export default function m(props: EventVisitor_inputv2Props): any {
     }, esp.lang("event/visitor_input", "confirm_cancel"), () => { })
   }
 
+  function assignToken() {
+
+    if (token && token != 0 && token > getData()?.token_remaining) {
+      LibToastProperty?.show(esp.lang("event/visitor_inputv2", "max_token_is") + getData()?.token_remaining)
+      return
+    }
+
+    let post = {
+      name: inputName?.current?.getText(),
+      token: inputToken?.current?.getText() == "" ? 0 : inputToken?.current?.getText(),
+      code: selectedCode?.access_code
+    }
+
+    LibDialog.confirm(esp.lang("event/visitor_input", "confirm_title"), esp.lang("event/visitor_inputv2", "confirm_input_token"), esp.lang("event/visitor_inputv2", "yes"), () => {
+      LibProgress.show(esp.lang("event/visitor_inputv2", "please_wait"))
+      new LibCurl('event_exhibitor_staff_token', post, (res, msg) => {
+        LibProgress.hide()
+        LibDialog.info(esp.lang("event/visitor_input", "confirm_success"), msg);
+        loadData()
+        setCounter(counter + 1)
+        dialogClaim?.current?.hide()
+      }, (error) => {
+        dialogClaim?.current?.hide()
+        LibProgress.hide()
+        LibDialog.warning(esp.lang("event/visitor_input", "confirm_failed"), error?.message)
+      })
+
+    }, esp.lang("event/visitor_inputv2", "no"), () => { })
+  }
+
+  esp.log(selectedCode);
+
   function renderTabs(item: any, i: number) {
     return (
       <TouchableOpacity key={i} onPress={() => {
@@ -193,7 +229,7 @@ export default function m(props: EventVisitor_inputv2Props): any {
               <LibIcon.Ionicons name='copy' size={16} style={applyStyle({ color: item.is_used == 1 ? "#c4c4c4" : "#2980b9", marginLeft: 7 })} />
             </TouchableOpacity>
             <View style={{ flex: 1, justifyContent: 'flex-end', flexDirection: 'row', alignContent: 'center', alignItems: 'center' }}>
-              <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 13, fontWeight: "normal", fontStyle: "normal", lineHeight: 22, letterSpacing: 0, color: "#9b9b9b", }}>{"Belum digunakan"}</Text>
+              <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 13, fontWeight: "normal", fontStyle: "normal", lineHeight: 22, letterSpacing: 0, color: "#9b9b9b", }}>{item?.is_used == 1 ? "" : esp.lang("event/visitor_inputv2", "notyet_used")}</Text>
               <TouchableOpacity onPress={() => {
                 dialogClaim?.current?.show()
                 setSelectedCode(item)
@@ -202,8 +238,24 @@ export default function m(props: EventVisitor_inputv2Props): any {
               </TouchableOpacity>
             </View>
           </View>
-          <View style={{ padding: 10, borderWidth: 1, borderColor: LibStyle.colorBgGrey, borderRadius: 5, marginTop: 5 }}>
 
+          <View style={{ padding: 5, borderWidth: 1, borderColor: LibStyle.colorBgGrey, borderRadius: 5, marginTop: 5 }}>
+            <Text allowFontScaling={false} style={{ fontSize: 10, color: '#9b9b9b' }}>{esp.lang("event/visitor_inputv2", "name")}</Text>
+            <Text allowFontScaling={false} style={{ fontSize: 14 }}>{item.name == null ? "-" : item.name}</Text>
+            <View style={{ marginTop: 5, flexDirection: 'row', justifyContent: 'space-between' }}>
+              <View style={{ flex: 1 }}>
+                <Text allowFontScaling={false} style={{ fontSize: 10, color: '#9b9b9b' }}>{esp.lang("event/visitor_inputv2", "total_token")}</Text>
+                <Text allowFontScaling={false} style={{ fontSize: 14 }}>{Number(item?.token)}</Text>
+              </View>
+              <View style={{ flex: 1 }}>
+                <Text allowFontScaling={false} style={{ fontSize: 10, color: '#9b9b9b' }}>{esp.lang("event/visitor_inputv2", "token_used")}</Text>
+                <Text allowFontScaling={false} style={{ fontSize: 14 }}>{Number(item?.token_used)}</Text>
+              </View>
+              <View style={{ flex: 1 }}>
+                <Text allowFontScaling={false} style={{ fontSize: 10, color: '#9b9b9b' }}>{esp.lang("event/visitor_inputv2", "token_left")}</Text>
+                <Text allowFontScaling={false} style={{ fontSize: 14 }}>{Number(item?.token_remaining)}</Text>
+              </View>
+            </View>
           </View>
         </View>
       )
@@ -238,24 +290,24 @@ export default function m(props: EventVisitor_inputv2Props): any {
     },
     {
       id: 2,
-      title: "Total Token",
+      title: esp.lang("event/visitor_inputv2", "total_token"),
       color: '#d7edf8',
       textColor: '#64b0e0',
-      total: 4275
+      total: LibUtils.number(getData()?.token)
     },
     {
       id: 3,
-      title: "Token dialokasikan",
+      title: esp.lang("event/visitor_inputv2", "token_shared"),
       color: '#fbe3dd',
       textColor: '#ec7463',
-      total: 4170
+      total: LibUtils.number(getData()?.token_shared)
     },
     {
       id: 4,
-      title: "Token tersisa",
+      title: esp.lang("event/visitor_inputv2", "token_left"),
       color: '#fef2de',
       textColor: '#f6c67f',
-      total: 105
+      total: LibUtils.number(getData()?.token_remaining)
     },
   ]
 
@@ -264,7 +316,27 @@ export default function m(props: EventVisitor_inputv2Props): any {
       <EventHeader title={esp.lang("event/visitor_input", "title_input_exhibitor")} subtitle={esp.lang("event/visitor_input", "total_staff", LibUtils.number(data.qty))} />
       <LibKeyboard_avoid style={{ flex: 1 }}>
         <>
-          {/* <ComponentTabheader titles={tabTitles} activeIndex={tabIndex} onPress={(index) => setTabIndex(index)} /> */}
+          {
+            activeTab?.type == "STAFF" &&
+            <View style={{ padding: 10, paddingBottom: 0, flexDirection: 'row', justifyContent: 'space-between', flexWrap: 'wrap' }}>
+              {
+                menuHeader?.map((item, i) => {
+                  return (
+                    <View key={i} style={{ width: (LibStyle.width - 30) / 2, alignContent: 'center', alignItems: 'center', marginBottom: 10, overflow: 'hidden', backgroundColor: item.color, borderRadius: 5, padding: 5, flexDirection: 'row', justifyContent: 'space-between' }}>
+                      <View style={{ flex: 2, }}>
+                        <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 13, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#4b4b4b" }}>{item.title}</Text>
+                      </View>
+                      <View style={{ marginLeft: 5, flex: 1 }}>
+                        <View style={{ alignContent: 'center', alignItems: 'center', backgroundColor: item.textColor, paddingHorizontal: 7, paddingVertical: 3, borderRadius: 5 }}>
+                          <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 13, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#fff" }}>{item.total}</Text>
+                        </View>
+                      </View>
+                    </View>
+                  )
+                })
+              }
+            </View>
+          }
 
           <View style={{ height: 35, marginBottom: 2, flexDirection: 'row', backgroundColor: '#fff', ...LibStyle.elevation(2) }} >
             <ScrollView horizontal showsHorizontalScrollIndicator={false} >
@@ -280,43 +352,17 @@ export default function m(props: EventVisitor_inputv2Props): any {
             // style={{ flex: 1 }}
             ListHeaderComponent={
               <>
-                {
+                {/* {
                   activeTab?.ondate != "0000-00-00" &&
                   <View style={{ margin: 10, marginBottom: 0 }}>
                     <Text allowFontScaling={false} style={{ fontWeight: 'bold', color: LibStyle.colorGreen }}>{"Tanggal berlaku " + LibUtils.moment(activeTab?.ondate).format("DD MMMM YYYY")}</Text>
                   </View>
-                }
-                {
-                  activeTab?.type == "STAFF" &&
-                  <View style={{ padding: 10, paddingBottom: 0, flexDirection: 'row', justifyContent: 'space-between', flexWrap: 'wrap' }}>
-                    {
-                      menuHeader?.map((item, i) => {
-                        return (
-                          <View key={i} style={{ width: (LibStyle.width - 30) / 2, alignContent: 'center', alignItems: 'center', marginBottom: 10, overflow: 'hidden', backgroundColor: item.color, borderRadius: 5, padding: 5, flexDirection: 'row', justifyContent: 'space-between' }}>
-                            <View style={{ flex: 2, }}>
-                              <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 13, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#4b4b4b" }}>{item.title}</Text>
-                            </View>
-                            <View style={{ marginLeft: 5, flex: 1 }}>
-                              <View style={{ alignContent: 'center', alignItems: 'center', backgroundColor: item.textColor, paddingHorizontal: 7, paddingVertical: 3, borderRadius: 5 }}>
-                                <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 13, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#fff" }}>{item.total}</Text>
-                              </View>
-                            </View>
-                          </View>
-                        )
-                      })
-                    }
-                  </View>
-                }
-
+                } */}
               </>
             }
             removeClippedSubviews={Platform.OS == 'android'}
             renderItem={renderItem}
           />
-          {
-            activeTab?.type == "STAFF" &&
-            <EventButton style={{ backgroundColor: '#00b894', margin: 5 }} label={esp.lang("event/visitor_input", "save_btn")} onPress={() => { send() }} />
-          }
         </>
       </LibKeyboard_avoid>
       <LibSlidingup ref={dialogListClaim}>
@@ -327,8 +373,6 @@ export default function m(props: EventVisitor_inputv2Props): any {
           </View>
           <LibInfinite
             url={listClaim?.url}
-            // isDebug={1}
-            // key={}
             removeClippedSubviews={Platform.OS == 'android'}
             renderItem={(item: any, i: number) => {
               return (
@@ -348,47 +392,59 @@ export default function m(props: EventVisitor_inputv2Props): any {
       <LibSlidingup ref={dialogClaim}>
         <View style={{ backgroundColor: 'white', padding: 15, maxHeight: LibStyle.height * 0.7, borderTopLeftRadius: 5, borderTopRightRadius: 5 }} >
           <View style={{ flexDirection: 'row', justifyContent: 'space-between', alignContent: 'center', alignItems: 'center' }}>
-            <LibTextstyle text={"Kode"} textStyle="headline" />
+            <LibTextstyle text={esp.lang("event/visitor_inputv2", "code")} textStyle="headline" />
             <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 16, fontWeight: "bold", fontStyle: "normal", lineHeight: 22, letterSpacing: 0, color: "#00b894" }}>{selectedCode?.access_code}</Text>
           </View>
 
-          <EventLabel_input label={"Masukkan nama"} />
+          <EventLabel_input label={esp.lang("event/visitor_inputv2", "input_name")} />
           <EventInput_rectangle
+            ref={inputName}
             returnKeyType="next"
-            style={applyStyle({ borderRadius: 4, borderColor: '#c4c4c4', height: 35, marginTop: 8, backgroundColor: '#fff' })}
-            onChangeText={(t) => {
-
-            }}
-            placeholder={"Masukkan nama"}
+            style={applyStyle({ borderRadius: 4, borderColor: '#c4c4c4', marginTop: 8, backgroundColor: '#fff' })}
+            inputStyle={{ color: selectedCode?.is_used == "1" ? "#c4c4c4" : "#000" }}
+            onSubmitEditing={() => inputToken?.current?.focus()}
+            placeholder={esp.lang("event/visitor_inputv2", "input_name")}
+            defaultValue={selectedCode?.name}
+            editable={selectedCode?.is_used == "1" ? false : true}
           />
 
           <View style={{ flexDirection: 'row', justifyContent: 'flex-end', alignContent: 'center', alignItems: 'center' }}>
             <View style={{ flex: 2 }}>
-              <EventLabel_input label={"Masukkan token"} />
+              <EventLabel_input label={esp.lang("event/visitor_inputv2", "input_token")} mandatory />
               <EventInput_rectangle
-                returnKeyType="next"
-                style={applyStyle({ borderRadius: 4, borderColor: '#c4c4c4', height: 35, marginTop: 8, backgroundColor: '#fff' })}
-                onChangeText={(t) => {
-
-                }}
-                placeholder={"Masukkan token"}
+                ref={inputToken}
+                keyboardType='phone-pad'
+                returnKeyType="done"
+                style={applyStyle({ borderRadius: 4, borderColor: '#c4c4c4', marginTop: 8, backgroundColor: '#fff' })}
+                placeholder={esp.lang("event/visitor_inputv2", "input_token")}
+                onChangeText={(t) => setToken(t)}
+                onSubmitEditing={assignToken}
+                defaultValue={selectedCode?.token != "0" ? selectedCode?.token : ''}
               />
             </View>
-            <View style={{ flex: 1, justifyContent: 'flex-end', marginLeft: 10, marginTop: 5 }}>
-              <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#4b4b4b" }}>{"Token terpakai"}</Text>
-              <View style={{ marginTop: 12, alignContent: 'center', alignItems: 'center', backgroundColor: "#ec7463", paddingHorizontal: 7, paddingVertical: 3, borderRadius: 5 }}>
-                <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#fff" }}>{10}</Text>
+            {
+              selectedCode?.token != "0" &&
+              <View style={{ flex: 1, justifyContent: 'flex-end', marginLeft: 10, marginTop: 5 }}>
+                <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#4b4b4b" }}>{esp.lang("event/visitor_inputv2", "token_used")}</Text>
+                <View style={{ marginTop: 12, alignContent: 'center', alignItems: 'center', backgroundColor: "#ec7463", paddingHorizontal: 7, paddingVertical: 3, borderRadius: 5 }}>
+                  <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#fff" }}>{LibUtils.number(selectedCode?.token_used)}</Text>
+                </View>
               </View>
-            </View>
-            <View style={{ flex: 1, justifyContent: 'flex-end', marginLeft: 10, marginTop: 5 }}>
-              <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#4b4b4b" }}>{"Token tersisa"}</Text>
-              <View style={{ marginTop: 12, alignContent: 'center', alignItems: 'center', backgroundColor: "#f6c67f", paddingHorizontal: 7, paddingVertical: 3, borderRadius: 5 }}>
-                <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#fff" }}>{120}</Text>
+            }
+            {
+              selectedCode?.token != "0" &&
+              <View style={{ flex: 1, justifyContent: 'flex-end', marginLeft: 10, marginTop: 5 }}>
+                <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#4b4b4b" }}>{esp.lang("event/visitor_inputv2", "token_left")}</Text>
+                <View style={{ marginTop: 12, alignContent: 'center', alignItems: 'center', backgroundColor: "#f6c67f", paddingHorizontal: 7, paddingVertical: 3, borderRadius: 5 }}>
+                  <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#fff" }}>{LibUtils.number(selectedCode?.token_remaining)}</Text>
+                </View>
               </View>
-            </View>
+            }
           </View>
 
-          <EventButton style={{ backgroundColor: '#00b894', marginTop: 15 }} label={esp.lang("event/visitor_input", "save_btn")} onPress={() => { }} />
+          <EventButton style={{ backgroundColor: '#00b894', marginTop: 15, borderRadius: 5 }} label={esp.lang("event/visitor_input", "save_btn")} onPress={() => {
+            assignToken()
+          }} />
 
         </View>
       </LibSlidingup>

package/id.json

@@ -931,7 +931,7 @@
     "Checked_within_10_minutes_after_payment_is_made": "Dicek dalam 10 menit setelah pembayaran dilakukan",
     "This_Event_Has_Changed_the_Event_Date_Please_Reschedule_or_Refund": "Event ini Mengalami Perubahan Tanggal Event, Silahkan Reschedule atau Melakukan Refund",
     "already_follow": "Sudah memilih ",
-    "already_join_lucky_draw": "Sudah memilih lucky draw",
+    "already_join_lucky_draw": "Pilihan sudah dibuat",
     "back_err": "Oops",
     "back_to_homepage": "Kembali ke Halaman Utama",
     "birtdate": "Tanggal Lahir",
@@ -1078,15 +1078,16 @@
     "used_once": "Bisa digunakan sekali selama acara berlangsung"
   },
   "event/order_lottery": {
-    "chance_for_exchange": " kesempatan untuk ditukarkan",
+    "chance_for_exchange": " pilihan untuk dibuat",
     "confirm": "Konfirmasi",
-    "confirm_point": "Apakah kupon yang anda masukkan sudah benar?",
+    "confirm_point": "Apakah pilihan yang anda masukkan sudah benar?",
     "follow_lucky_draw": "Ikuti Lucky Draw",
     "information": "Informasi",
     "no": "Tidak",
     "oops": "Oops",
     "please_enter_all_point": "Silahkan masukkan semua kupon lucky draw anda",
-    "submit": "Tukarkan Kupon",
+    "please_wait": "Mohon tunggu",
+    "submit": "Lanjutkan untuk konfirmasi",
     "token_for_luckydraw": " kupon untuk mengikuti undian Lucky Draw",
     "u_have": "Anda mempunyai ",
     "yes": "Ya",
@@ -1868,6 +1869,23 @@
     "title_input_exhibitors": "Masukkan Exhibitors",
     "total_staff": "Total %s "
   },
+  "event/visitor_inputv2": {
+    "code": "Kode",
+    "confirm_input_token": "Apakah data yang anda masukkan sudah benar?",
+    "esp.lang(\"event/visitor_input\", \"confirm_title\")": "Info",
+    "input_name": "Masukkan nama",
+    "input_token": "Masukkan token",
+    "max_token_is": "Maksimal token yang anda punya adalah ",
+    "name": "Nama",
+    "no": "Tidak",
+    "notyet_used": "Belum digunakan",
+    "please_wait": "Mohon tunggu",
+    "token_left": "Token tersisa",
+    "token_shared": "Token dialokasikan",
+    "token_used": "Total terpakai",
+    "total_token": "Total token",
+    "yes": "Ya"
+  },
   "event/voucher": {
     "check_wait": "Mohon Tunggu",
     "header": "Silahkan input kode",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "esoftplay-event",
-  "version": "0.0.1-z",
+  "version": "0.0.2-a",
   "description": "event module on esoftplay framework",
   "main": "index.js",
   "scripts": {