esoftplay-event 0.0.1-n → 0.0.1-p

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/artist.tsx

@@ -43,6 +43,7 @@ export default function m(props: BigbangArtistProps): any {
 
     new LibCurl(url, null,
       (res) => {
+        esp.log({ res });
         new LibCurl(res?.[0]?.url_event || `event_detail/${res?.[0]?.event_id}`, null, (res) => {
           setResultEvent(res)
           if (res?.id) {

package/event/artist_detailv2.tsx

@@ -1,14 +1,29 @@
 // withHooks
 import { useEffect } from 'react';
 
+import { applyStyle } from 'esoftplay';
+import { EventButton } from 'esoftplay/cache/event/button/import';
 import { EventHeader } from 'esoftplay/cache/event/header/import';
+import { EventHtmltext } from 'esoftplay/cache/event/htmltext/import';
+import { EventIndexProperty } from 'esoftplay/cache/event/index/import';
+import { EventShare } from 'esoftplay/cache/event/share/import';
+import { LibCarrousel } from 'esoftplay/cache/lib/carrousel/import';
 import { LibCurl } from 'esoftplay/cache/lib/curl/import';
+import { LibIcon } from 'esoftplay/cache/lib/icon/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 { LibProgress } from 'esoftplay/cache/lib/progress/import';
+import { LibSlidingup } from 'esoftplay/cache/lib/slidingup/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 { LibVideoProperty } from 'esoftplay/cache/lib/video/import';
+import { LibWebview } from 'esoftplay/cache/lib/webview/import';
 import esp from 'esoftplay/esp';
 import useSafeState from 'esoftplay/state';
 import React from 'react';
-import { View } from 'react-native';
+import { Pressable, RefreshControl, ScrollView, Text, TouchableOpacity, View } from 'react-native';
 
 
 export interface EventArtist_detailv2Args {
@@ -18,26 +33,353 @@ export interface EventArtist_detailv2Props {
 
 }
 export default function m(props: EventArtist_detailv2Props): any {
-  const { url_price } = LibNavigation.getArgsAll(props)
+  const { url, subscribed } = LibNavigation.getArgsAll(props)
   const [priceList, setPriceList] = useSafeState<any>()
+  const [detailArtist, setDetailArtist] = useSafeState<any>()
+
+  let showSchedule = React.useRef<LibSlidingup>(null)
+  const [selectedTicket, setSelectedTicket, getSelectedTicket] = useSafeState<any>()
+  const [showAll, setShowAll] = useSafeState<any>({});
+  const [qty, setQty] = useSafeState<any>(1)
+  const [refreshing, setRefreshing] = useSafeState<boolean>(false);
 
   useEffect(() => {
-    loadData()
+    loadDataArtist()
   }, [])
 
-  function loadData() {
-    new LibCurl(url_price, null, (res, msg) => {
-      esp.log(res);
-      setPriceList(res)
+  esp.log({ priceList, detailArtist });
+
+  function loadDataArtist(): void {
+    new LibCurl(url, null, (res) => {
+      setRefreshing(false)
+      setDetailArtist(res)
+      loadDataPrice(res?.url_price)
     }, (err) => {
+      setRefreshing(false)
       LibToastProperty.show(err?.message)
       LibNavigation.back()
     }, 1)
   }
 
+  function loadDataPrice(url: string) {
+    new LibCurl(url, null, (res, msg) => {
+
+      const updatedData = res?.map((item: any) => ({
+        ...item,
+        list: item?.list?.map((itemList: any) => ({
+          ...itemList,
+          index_id: item?.price_id + "-" + itemList?.ondate
+        }))
+      }));
+
+      setPriceList(updatedData)
+    }, (err) => {
+      LibToastProperty.show(err?.message)
+      LibNavigation.back()
+    }, 1)
+  }
+
+  function loadDataPriceConfig(url: string) {
+    let post = {
+      price_ids: selectedTicket?.price_id,
+      event_id: 411
+    }
+    LibProgress.show("Mohon tunggu")
+    new LibCurl(url, post, (res, msg) => {
+      esp.log({ res, url });
+      LibProgress.hide()
+    }, (err) => {
+      LibProgress.hide()
+      LibToastProperty.show(err?.message)
+
+    }, 1)
+  }
+
+  const maxDisplay = 3;
+  const handleShowAll = (price_id: any) => {
+    setShowAll((prevShowAll: any) => ({
+      ...prevShowAll,
+      [price_id]: !prevShowAll[price_id],
+    }));
+  };
+
+
+  function add(): void {
+    let hasQuota = getSelectedTicket().quota > 0
+    const min = hasQuota ? Number(getSelectedTicket()?.quota) - Number(getSelectedTicket()?.quota_used) : Number(getSelectedTicket()?.qty_max)
+    if (qty < Math.min(min, Number(getSelectedTicket()?.qty_max))) {
+      setQty(Number(qty) + 1)
+    }
+  }
+
+  function min(): void {
+    if (qty <= getSelectedTicket()?.qty_min) {
+      setQty(Number(getSelectedTicket()?.qty_min))
+    } else {
+      setQty(qty == 1 ? 1 : qty - 1)
+    }
+  }
+
+  function onRefresh() {
+    setRefreshing(true)
+    loadDataArtist()
+  }
+
+  function renderItem(item: any, itemT: any, iT: number) {
+    let ticketWithDate = item.price_date == 1 && item.use_code == 0
+    let ticketSpecial = item.price_date == 0 && item.use_code == 0
+
+    let _selectedTicket = item.price_id == selectedTicket?.price_id && itemT.index_id == selectedTicket?.list?.index_id
+
+    let colorDefault = _selectedTicket ? "#FFE9AD" : '#fff'
+    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
+
+    return (
+      <TouchableOpacity
+        onPress={() => {
+          let itemTicket = {
+            ...item
+          }
+          let replaceList = LibObject.set(itemTicket, itemT)('list')
+          let msg = itemT?.status == 0 ? esp.lang("event/artist_detail", "sold_out") : esp.lang("event/artist_detail", "coming_soon")
+
+          // kondisi untuk tipe tiket yang ada tanggalnya
+          if (item?.status == 1 && itemT?.status == 1) {
+            setSelectedTicket(replaceList)
+            setQty(item.qty_min)
+          } else if (item?.status == 0) {
+            LibToastProperty.show(msg)
+          } else if (item?.status == 2) {
+            LibToastProperty.show(msg)
+          }
+        }} activeOpacity={itemT?.status == 1 ? 0 : 1} key={iT} style={{ flex: 1, flexDirection: 'row', backgroundColor: colorBackground, justifyContent: 'space-between', padding: 10, alignItems: 'center' }}>
+        {
+          itemT.ondate == "0000-00-00" ?
+            <LibPicture source={esp.assets('icons/ic_special2.png')} style={{ height: 42, width: 42 }} />
+            :
+            <>
+              <View style={applyStyle({ marginLeft: 10, marginHorizontal: 20, width: 42, height: 42, borderRadius: 5, backgroundColor: "#fff", borderStyle: "solid", borderWidth: 1, borderColor: _selectedTicket ? "#3ea4dc" : '#999', alignContent: 'center', alignItems: 'center', justifyContent: 'center' })}>
+                <Text allowFontScaling={false} style={applyStyle({ opacity: textOpacity, fontFamily: "Arial", fontSize: 20, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0.23, textAlign: "center", color: _selectedTicket ? "#3ea4dc" : '#999' })}>{LibUtils.moment(itemT.ondate).localeFormat('DD')}</Text>
+              </View>
+              <View style={applyStyle({ flexDirection: 'column', flex: 1 })}>
+                {
+                  item?.status == 1 && itemT?.status != 1 &&
+                  <View style={applyStyle({ flexDirection: 'row', marginBottom: 5 })}>
+                    <View style={applyStyle({ alignContent: 'center', alignItems: 'center', justifyContent: 'center', marginTop: 5, borderWidth: 1, backgroundColor: itemT?.status == 0 ? LibStyle.colorRed : "#4cd964", borderColor: itemT?.status == 0 ? LibStyle.colorRed : "#4cd964", borderRadius: 5, padding: 3, opacity: 0.8 })}>
+                      <Text allowFontScaling={false} style={applyStyle({ fontSize: 10, fontStyle: "normal", letterSpacing: 0, color:/*  itemT?.status == 2 ? "#000" :  */"#fff", fontWeight: 'bold' })}>{itemT?.status == 0 ? esp.lang("event/artist_detail", "sold_out") : esp.lang("event/artist_detail", "coming_soon")}</Text>
+                    </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(itemT.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(itemT.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(itemT.ondate).localeFormat('YYYY')}</Text>
+                </View>
+              </View>
+            </>
+        }
+
+        <View style={applyStyle({ marginRight: 5, marginLeft: 5, flexDirection: 'column' })} >
+          {
+            (itemT?.status == 1 || itemT?.status == 0) &&
+            <Text allowFontScaling={false} style={applyStyle({ opacity: ticketWithDate ? textOpacity : 1, fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, textAlign: "right", color: _selectedTicket ? "#3ea4dc" : (itemT.price == 0 ? LibStyle.colorGreen : '#999') })} >{itemT.price == 0 ? esp.lang("event/ticket_list", "free") : LibUtils.money(itemT.price, item.currency)}</Text>
+          }
+          {
+            item?.status == 1 && (ticketWithDate || ticketSpecial) && _selectedTicket &&
+            <View style={applyStyle({ marginTop: 4, flexDirection: 'row', marginLeft: 8, alignContent: 'center', alignItems: 'center' })}>
+              <TouchableOpacity onPress={() => { min() }}>
+                <View style={applyStyle({ width: 28, height: 28, borderRadius: 6, backgroundColor: "#ecf0f1", alignContent: 'center', alignItems: 'center' })}>
+                  <LibIcon name="minus" color="#e74c3c" />
+                </View>
+              </TouchableOpacity>
+              <Text style={applyStyle({ fontFamily: "Arial", fontSize: 20, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#9b9b9b", marginLeft: 13, marginRight: 13 })}>{qty}</Text>
+              <TouchableOpacity onPress={() => { add() }}>
+                <View style={applyStyle({ width: 28, height: 28, borderRadius: 6, backgroundColor: "#ecf0f1", alignContent: 'center', alignItems: 'center' })}>
+                  <LibIcon name="plus" color="#16a085" />
+                </View>
+              </TouchableOpacity>
+            </View>
+          }
+        </View>
+      </TouchableOpacity>
+    )
+  }
+
+  const bgHeight = LibStyle.width * 9 / 16
+
+  function renderImages(item: any, i: number) {
+    const styleId_Z1ecB7O: any = { height: bgHeight, width: LibStyle.width, resizeMode: 'cover' }
+    return (
+      <TouchableOpacity key={i} onPress={() => LibNavigation.navigate('lib/gallery', { images: detailArtist?.images, index: i })}>
+        <LibPicture source={{ uri: item.image }} style={styleId_Z1ecB7O} />
+      </TouchableOpacity>
+    )
+  }
+
+  let share = [
+    {
+      icon: 'icons/ic_facebook.png',
+      title: 'Facebook',
+      onPress: () => { EventShare.facebook(url) }
+    },
+    {
+      icon: 'icons/ic_whatsapp.png',
+      title: 'Whatsapp',
+      onPress: () => { EventShare.whatsapp(url) }
+    },
+    {
+      icon: 'icons/ic_twitter.png',
+      title: 'Twitter',
+      onPress: () => { EventShare.twitter(url) }
+    },
+    {
+      icon: 'icons/ic_copy.png',
+      title: esp.lang("event/artist_detail", "copy"),
+      onPress: () => {
+        LibUtils.copyToClipboard(url).then((v) => {
+          LibToastProperty.show(esp.lang("event/artist_detail", "alert"))
+        })
+      }
+    },
+  ]
+
+  function renderShare(item: any, i: number) {
+    return (
+      <View key={i} style={applyStyle({ marginRight: 10 })}>
+        <TouchableOpacity onPress={item.onPress} >
+          <LibPicture style={applyStyle({ resizeMode: 'contain', height: 25, width: 25, borderRadius: 12.5, backgroundColor: 'white' })} source={esp.assets(item.icon)} />
+        </TouchableOpacity>
+      </View>
+    )
+  }
+
   return (
     <View style={{ flex: 1 }}>
-      <EventHeader title={esp.lang("event/artist_detail", "title")} /* subtitle={data?.title} */ />
+      <EventHeader title={esp.lang("event/artist_detail", "title")} subtitle={detailArtist?.name} />
+      <ScrollView refreshControl={
+        <RefreshControl refreshing={refreshing} onRefresh={onRefresh} />
+      }>
+
+        {
+          detailArtist?.images && detailArtist?.images?.length > 0 ?
+            <LibCarrousel
+              delay={3000}
+              style={{ height: bgHeight, width: LibStyle.width }}
+              autoplay
+              bullets
+              bulletStyle={{ width: 7, height: 7, backgroundColor: "#fff", borderRadius: 3.5, borderWidth: 0, marginHorizontal: 2 }}
+              chosenBulletStyle={{ width: 7, height: 7, backgroundColor: "#f4e31b", borderRadius: 3.5, borderWidth: 0, marginHorizontal: 2 }}
+              bulletsContainerStyle={{ marginBottom: -10 }}>
+              {
+                detailArtist?.images && detailArtist?.images?.map(renderImages)
+              }
+            </LibCarrousel>
+            :
+            <Pressable onPress={() => LibNavigation.navigate('lib/gallery', { image: detailArtist?.image })} >
+              <LibPicture
+                style={applyStyle({ height: LibStyle.width * 9 / 16, width: LibStyle.width, backgroundColor: '#f2f3f4' })}
+                source={{ uri: detailArtist?.image }} />
+            </Pressable>
+        }
+        <View style={applyStyle({ marginTop: 10, marginLeft: 17, flexDirection: 'row' })}>
+          {
+            share.map(renderShare)
+          }
+        </View>
+        <Text allowFontScaling={false} style={applyStyle({ marginBottom: 12, marginLeft: 17, fontFamily: "Arial", marginTop: 20, fontSize: 26, fontWeight: "bold", fontStyle: "normal", lineHeight: 30, letterSpacing: 0, color: "#000" })}>{detailArtist?.name}</Text>
+        {
+          detailArtist?.description != "" &&
+          <ScrollView>
+            <LibWebview onFinishLoad={() => { }} source={{ html: detailArtist?.description }} />
+          </ScrollView>
+        }
+        {
+          detailArtist?.video != "" &&
+          <>
+            <Text allowFontScaling={false} style={applyStyle({ marginHorizontal: 20, marginTop: 10, fontFamily: "Arial", fontSize: 13, fontWeight: "bold", fontStyle: "normal", lineHeight: 22, letterSpacing: 0, color: "#4a4a4a" })} >{esp.lang("event/artist_detail", "video")}</Text>
+            <TouchableOpacity onPress={() => LibNavigation.navigate('lib/video', { code: detailArtist?.video })} >
+              <LibPicture source={{ uri: LibVideoProperty.getUrlThumbnail(detailArtist?.video) }} style={applyStyle({ height: LibStyle.width * 9 / 16, width: LibStyle.width - 40, marginHorizontal: 20, resizeMode: 'cover' })} />
+            </TouchableOpacity>
+          </>
+        }
+
+
+      </ScrollView>
+      <View style={{ flexDirection: 'row', padding: 10, backgroundColor: 'white' }} >
+        <EventButton label={esp.lang("event/artist_detail", "buy_ticket")} onPress={() => {
+          EventIndexProperty.isLogin(() => {
+            showSchedule.current?.show()
+          })
+        }} style={{ backgroundColor: LibStyle.colorGreen }} />
+      </View>
+
+      <LibSlidingup ref={showSchedule}>
+        <View style={applyStyle({ backgroundColor: 'white', borderTopRightRadius: 30, borderTopLeftRadius: 30, paddingTop: 15, maxHeight: LibStyle.height - (LibStyle.height / 3) })}>
+          <Text allowFontScaling={false} style={applyStyle({ marginBottom: 15, fontFamily: "Arial", fontSize: 16, fontWeight: "bold", fontStyle: "normal", lineHeight: 22, letterSpacing: 0, textAlign: "center", color: "#34495e" })}>{esp.lang("event/artist_detail", "select_date")}</Text>
+          <ScrollView showsVerticalScrollIndicator={false} >
+            {
+              priceList?.map((item: any, i: number) => {
+                let filterFullData = priceList?.filter((it: any) => it.status != 0)
+                const displayedData = showAll[item.price_id] ? item?.list : item?.list.slice(0, maxDisplay);
+                let textOpacity = item?.status == 1 ? 1 : 0.3
+                let selTic = item.price_id == selectedTicket?.price_id
+                return (
+                  <View key={i} style={{ overflow: 'hidden', margin: 15, marginBottom: 5, backgroundColor: '#fff', borderRadius: 10, ...LibStyle.elevation(2), borderWidth: 1, borderColor: selTic ? LibStyle.colorBlue : LibStyle.colorBgGrey }}>
+                    <View style={{ padding: 10, backgroundColor: '#f1f2f3', borderTopLeftRadius: 10, borderTopRightRadius: 10 }}>
+                      <View style={{ alignContent: 'center', alignItems: 'center', flexDirection: 'row', justifyContent: 'space-between', }}>
+                        <EventHtmltext allowFontScaling={false} style={{ opacity: textOpacity, fontWeight: 'bold' }}>{item.name}</EventHtmltext>
+                        {
+                          item.qty_min > 1 &&
+                          <Text style={{ color: LibStyle.colorRed, fontSize: 10, fontWeight: 'normal' }}> {"(" + esp.lang("event/ticket_list", "min_order") + LibUtils.number(item.qty_min) + ")"}</Text>
+                        }
+                        {
+                          item?.status != 1 &&
+                          <View style={applyStyle({ flexDirection: 'row' })}>
+                            <View style={applyStyle({ alignContent: 'center', alignItems: 'center', justifyContent: 'center', borderWidth: 1, backgroundColor: item?.status == 0 ? LibStyle.colorRed : "#4cd964", borderColor: item?.status == 0 ? LibStyle.colorRed : "#4cd964", borderRadius: 5, padding: 3, opacity: 0.8 })}>
+                              <Text allowFontScaling={false} style={applyStyle({ fontSize: 10, fontStyle: "normal", letterSpacing: 0, color: /* item?.status == 2 ? "#000" : */ "#fff", fontWeight: 'bold' })}>{item?.status == 0 ? esp.lang("event/artist_detail", "sold_out") : esp.lang("event/artist_detail", "coming_soon")}</Text>
+                            </View>
+                          </View>
+                        }
+                      </View>
+                      {
+                        item.hasOwnProperty("price_type_info") && item.price_type_info != "" &&
+                        <View style={{ marginTop: 3, alignContent: 'center', alignItems: 'center', flexDirection: 'row', marginRight: 5 }}>
+                          <Text allowFontScaling={false} style={{ fontSize: 12, color: LibStyle.colorBlue }}>{item.price_type_info}</Text>
+                        </View>
+                      }
+                    </View>
+
+                    {
+                      displayedData?.map((itemT: any, iT: number) => renderItem(item, itemT, iT))
+                    }
+                    {
+                      filterFullData?.[i]?.list?.length > 3 &&
+                      <TouchableOpacity onPress={() => {
+                        handleShowAll(item.price_id)
+                      }} style={{ borderTopColor: LibStyle.colorGrey, borderTopWidth: 0.8, flex: 1, padding: 8, flexDirection: 'row', alignContent: 'center', alignItems: 'center', justifyContent: 'center' }}>
+                        <Text allowFontScaling={false} style={{ marginRight: 5, fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: LibStyle.colorBlue }}>{showAll[item.price_id] ? esp.lang("event/ticket_list", "see_less") : esp.lang("event/ticket_list", "see_more")}</Text>
+                        <LibIcon name={showAll[item.price_id] ? 'chevron-up-circle-outline' : 'chevron-down-circle-outline'} color={LibStyle.colorBlue} size={18} />
+                      </TouchableOpacity>
+                    }
+
+                  </View>
+                )
+              })
+            }
+          </ScrollView>
+          <View style={applyStyle({ paddingVertical: 10 })} >
+            <EventButton label={esp.lang("event/artist_detail", "buy_ticket")} onPress={() => {
+              EventIndexProperty.isLogin(() => {
+                if (selectedTicket) {
+                  loadDataPriceConfig(selectedTicket?.url_config)
+                }
+                // proceedToPayment()
+              })
+            }} style={{ backgroundColor: LibStyle.colorGreen, marginTop: 2, marginHorizontal: 15 }} />
+          </View>
+        </View>
+      </LibSlidingup>
 
     </View>
   )

package/event/artistv2.tsx

@@ -29,7 +29,6 @@ export interface EventArtistv2Props {
 
 export default function m(props: EventArtistv2Props): any {
   const [result, setResult] = useSafeState<any>()
-  const [resultEvent, setResultEvent] = useSafeState<any>()
   const [error, setError] = useSafeState<any>('')
   const { isInPricingQueueConfig } = EventFirebase_socket()
 
@@ -43,21 +42,15 @@ export default function m(props: EventArtistv2Props): any {
     new LibCurl('v2/event_artist&event_id=411', null,
       (res) => {
         esp.log({ res });
-        new LibCurl(res?.[0]?.url_event || `event_detail/${res?.[0]?.event_id}`, null, (res) => {
-          setResultEvent(res)
-          if (res?.id) {
-            EventFirebase_socketProperty.eventIdQueue.set(res?.id)
-          }
-          if (res.allotment) {
-            esp.modProp("event/firebase_socket").userIdKeyReplacer.set({
-              t: Number(res.allotment.t),
-              s: Number(res.allotment.s),
-              priority: 1
-            })
-          }
-        }, (err) => {
+        EventFirebase_socketProperty.eventIdQueue.set(res?.[0]?.event_id)
+        if (res.allotment) {
+          esp.modProp("event/firebase_socket").userIdKeyReplacer.set({
+            t: Number(res.allotment.t),
+            s: Number(res.allotment.s),
+            priority: 1
+          })
+        }
 
-        }, 0)
         setResult(res)
       }, (err) => {
         setError(err?.message)
@@ -72,19 +65,21 @@ export default function m(props: EventArtistv2Props): any {
   const itemHeight = itemWidth * 9 / 16
 
   let subs = {
-    is_subscribed: resultEvent?.config?.is_subscribed,
-    is_subscribed_default: resultEvent?.config?.is_subscribed_default,
-    is_subscribed_label: resultEvent?.config?.is_subscribed_label
+    is_subscribed: result?.config?.is_subscribed,
+    is_subscribed_default: result?.config?.is_subscribed_default,
+    is_subscribed_label: result?.config?.is_subscribed_label
   }
   const width = LibStyle?.width
   const sliderHeight = 0.50 * width
 
   function renderIt(item: any, i: number) {
     const styleId_Z2g4Hs7: any = { backgroundColor: '#FFC523', width: itemWidth, height: itemHeight, margin: 0.5, justifyContent: 'center', alignItems: 'center' }
-
+    let isNotAvailable = item?.status_error != ""
     const handlePress = () => {
-      EventIndexProperty.isLogin(async () => {
-        if (item.status == 1) {
+      if (isNotAvailable) {
+        LibToastProperty.show(esp.lang("event/artist", "ticket_not_available"));
+      } else {
+        EventIndexProperty.isLogin(async () => {
           if (isInPricingQueueConfig(item.event_id)) {
             LibNavigation.navigateForResult('event/queue_pricing', {
               event_id: item?.event_id,
@@ -93,16 +88,14 @@ export default function m(props: EventArtistv2Props): any {
           }
           // EventCountdownProperty.countdownTime.set(moment().add(EventFirebase_socketProperty.eventQueueConfig.get(item?.event_id).time, 'seconds').localeFormat('YYYY-MM-DD HH:mm:ss'));
           LibNavigation.navigate(
-            // item?.config?.multiprice == 1
-            //   ? 'event/artist_detail_multi'
-            //   : 
-            'event/artist_detailv2',
-            { url_price: item.url }
+            item?.config?.multiprice == 1
+              ? 'event/artist_detail_multi'
+              :
+              'event/artist_detailv2',
+            { url: item.url, subscribed: subs }
           );
-        } else {
-          LibToastProperty.show(esp.lang("event/artist", "ticket_not_available"));
-        }
-      });
+        });
+      }
     };
 
     if (item?.images?.length > 1) {
@@ -117,7 +110,7 @@ export default function m(props: EventArtistv2Props): any {
             item?.images?.map((item1: any, ii: number) => {
               return (
                 <TouchableOpacity key={ii} onPress={handlePress} >
-                  <LibPicture key={ii} source={{ uri: item1 }} style={{ height: sliderHeight, width: width, resizeMode: 'cover', backgroundColor: "#f1f2f3" }} />
+                  <LibPicture key={ii} source={{ uri: item1 }} style={{ opacity: isNotAvailable ? 0.3 : 1, height: sliderHeight, width: width, resizeMode: 'cover', backgroundColor: "#f1f2f3" }} />
                 </TouchableOpacity>
               )
             })
@@ -127,7 +120,7 @@ export default function m(props: EventArtistv2Props): any {
     } else if (item?.images?.length == 1) {
       return (
         <TouchableOpacity key={i} onPress={handlePress} >
-          <LibPicture style={{ height: sliderHeight, width: width, resizeMode: 'cover', backgroundColor: "#f1f2f3" }} source={{ uri: item.images[0] }} />
+          <LibPicture style={{opacity: isNotAvailable ? 0.3 : 1, height: sliderHeight, width: width, resizeMode: 'cover', backgroundColor: "#f1f2f3" }} source={{ uri: item.images[0] }} />
         </TouchableOpacity>
       )
     } else {
@@ -141,9 +134,9 @@ export default function m(props: EventArtistv2Props): any {
 
   return (
     <View style={{ flex: 1, backgroundColor: 'white' }} >
-      <EventHeader title={title ? title : resultEvent?.event_title} iconShare={resultEvent?.url_share_artist && resultEvent?.url_share_artist !== ""}
+      <EventHeader title={title ? title : result?.name} iconShare={result?.url_share_artist && result?.url_share_artist !== ""}
         onPressShare={() => {
-          LibUtils.share(resultEvent?.url_share_artist)
+          LibUtils.share(result?.url_share_artist)
         }} />
       {
         !result && !error ? <LibLoading /> :
@@ -153,7 +146,7 @@ export default function m(props: EventArtistv2Props): any {
           //   }
           // </ScrollView>
           <LibList
-            data={result}
+            data={result?.list}
             // keyExtractor={(item) => item.id}
             onRefresh={loadData}
             staticHeight={itemHeight + 1}

package/event/detail.tsx

@@ -39,6 +39,7 @@ export default function m(props: EventDetailProps): any {
   function loadData(): void {
     // CacheHit.doHit(url)
     new LibCurl(url, null, (res, msg) => {
+      esp.log(res);
       EventFirebase_socketProperty.eventIdQueue.set(res.id)
       setResult(res)
       if (res.allotment) {

package/event/order_detail.tsx

@@ -399,6 +399,11 @@ export default function m(props: EventOrder_detailProps): any {
             <View testID='price_name' style={{ marginTop: 10, borderWidth: 5, padding: 3, borderColor: result?.color, backgroundColor: EventOrder_itemProperty.textColor(result?.color) }}>
               <View style={{ padding: 10, backgroundColor: result?.color, justifyContent: 'center', alignContent: 'center', alignItems: 'center' }}>
                 <EventHtmltext allowFontScaling={false} numberOfLines={3} ellipsizeMode="tail" style={{ color: EventOrder_itemProperty.textColor(result?.color), alignSelf: 'center', textAlign: 'center', fontSize: 20, fontWeight: 'bold' }}> {result?.price_name}</EventHtmltext>
+                {
+                  result?.ondate != "0000-00-00" &&
+                  <Text allowFontScaling={false} style={{ flex: 1, marginRight: 10, marginLeft: 6, fontFamily: "Arial", fontSize: 14, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#484848" }}>{moment(result?.ondate).localeFormat("DD MMMM YYYY")}</Text>
+                }
+
               </View>
             </View>
 
@@ -436,10 +441,13 @@ export default function m(props: EventOrder_detailProps): any {
                   </View>
                 }
 
-                <View style={{ flexDirection: 'row', alignContent: 'center', alignItems: 'center' }}>
-                  <LibIcon name="calendar-blank-outline" size={20} />
-                  <Text allowFontScaling={false} style={{ flex: 1, marginRight: 10, marginLeft: 6, fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#484848" }}>{result?.ondate != "0000-00-00" ? moment(result?.ondate).localeFormat("DD MMMM YYYY") : ((isInvitationDate || isOnlineWithoutDate) ? esp.lang("event/order_item", "used_once") : dateRange)}</Text>
-                </View>
+                {
+                  result?.ondate == "0000-00-00" &&
+                  <View style={{ flexDirection: 'row', alignContent: 'center', alignItems: 'center' }}>
+                    <LibIcon name="calendar-blank-outline" size={20} />
+                    <Text allowFontScaling={false} style={{ flex: 1, marginRight: 10, marginLeft: 6, fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#484848" }}>{((isInvitationDate || isOnlineWithoutDate) ? esp.lang("event/order_item", "used_once") : dateRange)}</Text>
+                  </View>
+                }
                 {
                   result?.use_seat == 1 &&
                   <View style={{ marginTop: 15, marginRight: 10 }}>

package/event/seat_map_new.tsx

@@ -126,7 +126,7 @@ export default function m(props: any): any {
     new LibCurl("v3/event_seat", {
       event_id: dataTicket?.event_id,
       price_id: dataTicket?.selected_ticket?.price_id,
-      ondate: dataTicket?.selected_ticket?.list?.ondate
+      ondate: dataTicket?.ondate || dataTicket?.selected_ticket?.list?.ondate
     }, (res, msg) => {
       // esp.log(res);
       setBoundingBox(res.metadata.bounding_box)
@@ -140,7 +140,7 @@ export default function m(props: any): any {
     new LibCurl("v3/event_seat_booked", {
       event_id: dataTicket?.event_id,
       price_id: dataTicket?.selected_ticket?.price_id,
-      ondate: dataTicket?.selected_ticket?.list?.ondate
+      ondate: dataTicket?.ondate || dataTicket?.selected_ticket?.list?.ondate
     }, (res, msg) => {
       loadDataSeatmap(res)
       setErrBookedSeat(undefined)

package/event/visitor_input.tsx

@@ -53,8 +53,6 @@ export default function m(props: EventVisitor_inputProps): any {
     return (name) => inputsState.set(LibObject.set(inputsState.get(), name)(list_id))
   }
 
-  // esp.log(url_invitation);
-
   useEffect(() => {
     loadData()
   }, [])
@@ -115,8 +113,11 @@ export default function m(props: EventVisitor_inputProps): any {
         setCounter(counter + 1)
       }}>
         <View style={applyStyle({ height: 35, width: LibStyle.width / 4, alignItems: 'center', overflow: 'visible', justifyContent: 'center', backgroundColor: '#fff' })}>
-          <Text allowFontScaling={false} style={applyStyle({ width: LibStyle.width / 4, fontFamily: "Arial", fontSize: 11, fontWeight: activeTab?.id == item?.id ? "bold" : "normal", fontStyle: "normal", letterSpacing: 0, textAlign: "center", color: activeTab?.id == item?.id ? "#51b596" : "#c5c5c5" })}>{item.name} ({LibUtils.number(item?.qty)})</Text>
-          <View style={applyStyle({ width: (LibStyle.width / 4) - 20, height: 3, backgroundColor: activeTab?.id == item?.id ? "#51b596" : "#fff", position: 'absolute', bottom: 0 })} />
+          <View style={{ width: LibStyle.width / 4, }}>
+            <Text allowFontScaling={false} numberOfLines={2} ellipsizeMode='tail' style={applyStyle({ fontFamily: "Arial", fontSize: 11, fontWeight: activeTab?.id == item?.id ? "bold" : "normal", fontStyle: "normal", letterSpacing: 0, textAlign: "center", color: activeTab?.id == item?.id ? "#51b596" : "#c5c5c5" })}>{item.name}</Text>
+            <Text allowFontScaling={false} style={applyStyle({ fontFamily: "Arial", fontSize: 11, fontWeight: activeTab?.id == item?.id ? "bold" : "normal", fontStyle: "normal", letterSpacing: 0, textAlign: "center", color: activeTab?.id == item?.id ? "#51b596" : "#c5c5c5" })}>({LibUtils.number(item?.qty)})</Text>
+          </View>
+          <View style={applyStyle({ width: (LibStyle.width / 4) - 20, height: 3, backgroundColor: activeTab?.id == item?.id ? "#51b596" : "#fff", position: 'absolute', bottom: -1 })} />
         </View>
       </TouchableOpacity>
     )
@@ -244,6 +245,16 @@ export default function m(props: EventVisitor_inputProps): any {
             // isDebug={1}
             key={activeTab + counter}
             // style={{ flex: 1 }}
+            ListHeaderComponent={
+              <>
+                {
+                  activeTab?.ondate != "0000-00-00" &&
+                  <View style={{ margin: 15, marginBottom: 0 }}>
+                    <Text allowFontScaling={false} style={{ fontWeight: 'bold', color: LibStyle.colorGreen }}>{"Tanggal berlaku " + LibUtils.moment(activeTab?.ondate).format("DD MMMM YYYY")}</Text>
+                  </View>
+                }
+              </>
+            }
             removeClippedSubviews={Platform.OS == 'android'}
             renderItem={renderItem}
           />

package/package.json

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