// withHooks

import { applyStyle } from 'esoftplay';
import { EventButton } from 'esoftplay/cache/event/button/import';
import { LibIcon } from 'esoftplay/cache/lib/icon/import';
import { LibPicture } from 'esoftplay/cache/lib/picture/import';
import { LibStyle } from 'esoftplay/cache/lib/style/import';
import { LibUtils } from 'esoftplay/cache/lib/utils/import';
import esp from 'esoftplay/esp';
import React from 'react';
import { Text, View } from 'react-native';


export interface EventScan_itemArgs {

}
export interface EventScan_itemProps {
  event_image: string,
  event_name: string,
  event_ondate: string,
  item: any,
  style?: any,

  onPress: () => void,
  label: string,
  colorBackground?: any,
  colorFont: any
  colorText?: any
}
export default function m(props: EventScan_itemProps): any {
  return (
    <View style={[{ padding: 10, overflow: 'hidden', flex: 1, flexDirection: 'row', backgroundColor: '#fff', borderBottomColor: LibStyle.colorGrey, borderBottomWidth: 1.5 }, props.style]}>
      <LibPicture style={applyStyle({ borderRadius: 5, width: LibStyle.width / 4.5, height: LibStyle.width / 4.5, backgroundColor: LibStyle.colorBgGrey })} source={{ uri: props?.event_image }} />
      <View style={{ marginLeft: 10, justifyContent: 'space-between', flex: 1 }}>
        <View style={{ flex: 1 }}>
          <Text allowFontScaling={false} ellipsizeMode={'tail'} numberOfLines={2} style={applyStyle({ color: props?.colorText ? props?.colorText : "#000", marginBottom: 4, fontSize: 16, fontWeight: 'bold' })}>{props?.event_name}</Text>
          <View style={applyStyle({ flexDirection: 'row', justifyContent: 'space-between', alignContent: 'center', alignItems: 'center' })}>
            <Text allowFontScaling={false} style={applyStyle({ color: props?.colorText ? props?.colorText : "#000", fontSize: 14 })}>{props.item.price_name}</Text>
            {
              props.item.hasOwnProperty('seat_name') && props?.item?.seat_name != "" &&
              <View style={applyStyle({ height: 35, width: 35, backgroundColor: "#fff", borderWidth: 1, borderColor: LibStyle.colorPrimary, borderRadius: 4, justifyContent: 'center', alignContent: 'center', alignItems: 'center' })}>
                <LibIcon name="seat" color={LibStyle.colorPrimary} size={15} />
                <Text allowFontScaling={false} style={applyStyle({ fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: LibStyle.colorPrimary })}>{props.item.seat_name}</Text>
              </View>
            }
          </View>
        </View>

        <View style={{}}>
          {
            props?.item?.hall_scanned && props?.item?.hall_scanned != "0000-00-00 00:00:00" &&
            <Text allowFontScaling={false} ellipsizeMode={'tail'} numberOfLines={2} style={applyStyle({ color: "#c9c9c9", marginBottom: 4, fontSize: 14, letterSpacing: 1.5 })}>{esp.lang("event/scan_item", "scan_on") + LibUtils.moment(props?.item?.hall_scanned).serverFormat("DD MMMM YYYY H:m:s ", props?.item?.scanned_detail?.timezone) /* + props.item?.scanned_detail?.timezone_locale || "" */}</Text>
          }
          {
            !Array.isArray(props?.item?.scanned_detail) && props?.item?.scanned_detail?.scanned != "" && props?.item?.scanned_detail?.scanned != "0000-00-00 00:00:00" &&
            <Text allowFontScaling={false} ellipsizeMode={'tail'} numberOfLines={2} style={applyStyle({ color: LibStyle.colorRed, marginBottom: 4, fontSize: 14, letterSpacing: 1.5 })}>{esp.lang("event/scan_item", "scan_on") + LibUtils.moment(props?.item?.scanned_detail?.scanned).serverFormat("DD MMMM YYYY H:m:s ", props?.item?.scanned_detail?.timezone) /* + props.item?.scanned_detail?.timezone_locale || "" */}</Text>
          }
          {
            props.item?.status == 1 &&
            <EventButton style={applyStyle({ marginTop: 10, alignSelf: 'flex-end', width: LibStyle.width / 3, backgroundColor: props.colorBackground })} label={props.label} fontColor={props.colorFont} onPress={props.onPress} />
          }
        </View>
      </View>
    </View>
  )
}