// withHooks

import { LibInfinite } from 'esoftplay/cache/lib/infinite/import';
import { LibNavigation } from 'esoftplay/cache/lib/navigation/import';
import { LibTextstyle } from 'esoftplay/cache/lib/textstyle/import';
import { LibUtils } from 'esoftplay/cache/lib/utils/import';
import { MarketEmpty } from 'esoftplay/cache/market/empty/import';
import { MarketHeader } from 'esoftplay/cache/market/header/import';
import { MarketSection_menu } from 'esoftplay/cache/market/section_menu/import';
import esp from 'esoftplay/esp';

import moment from 'esoftplay/moment';
import React from 'react';
import { TouchableOpacity, View } from 'react-native';


export interface MarkteAds_deposit_historyArgs {

}
export interface MarkteAds_deposit_historyProps {

}
export default function m(props: MarkteAds_deposit_historyProps): any {
  let lastDate = ''

  function renderItems(item: any, i: number) {
    const showDate = lastDate != moment(item.ondate).localeFormat("DD MMMM YYYY")
    lastDate = moment(item.ondate).localeFormat("DD MMMM YYYY")
    return (
      <View key={i}>
        {
          showDate &&
          <MarketSection_menu title={moment(item.ondate).localeFormat("DD MMMM YYYY")} />
        }
        <TouchableOpacity
          style={styleId_Z1elR1s}
          onPress={() => { LibNavigation.navigate('market/ads_deposit_detail', { url: item.url }) }}>
          <View style={styleId_ZcMJmd} >
            <LibTextstyle
              textStyle="caption1"
              text={item.title} />
            <LibTextstyle
              textStyle="footnote"
              style={styleId_GW3Y7}
              text={LibUtils.money(item.amount)} />
            <View style={styleId_Z1i5LUH} >
              <View style={[styleId_Z22bmhl, { backgroundColor: item.status == 0 ? '#f8d7da' : item.status == 1 ? '#fff3cd' : item.status == 2 ? '#d4edda' : '#cce5ff' }]} >
                <LibTextstyle textStyle="caption2" text={item.status == 0 ? esp.lang("market/ads_deposit_history", "status_0") : item.status == 1 ? esp.lang("market/ads_deposit_history", "status_1") : item.status == 2 ? esp.lang("market/ads_deposit_history", "status_2") : 'undefined'} />
              </View>
            </View>
          </View>
          <LibTextstyle textStyle="caption2" text={moment(item.ondate).localeFormat("HH:mm")} />
        </TouchableOpacity>
      </View>
    )
  }

  function renderError(error: any) {
    return (
      <MarketEmpty msg={error} />
    )
  }

  return (
    <View style={styleId_ZcMJmd} >
      <MarketHeader
        onlyBack
        title={esp.lang("market/ads_deposit_history", "header_title")}
      />
      <LibInfinite
        onDataChange={() => { lastDate = '' }}
        url={"advert/deposit_list"}
        errorView={renderError}
        renderItem={renderItems} />
    </View>
  )
}
const styleId_Z1elR1s: any = { paddingHorizontal: 17, paddingVertical: 10, borderBottomWidth: 1, borderBottomColor: "#f4f4f4", flexDirection: 'row' }
const styleId_ZcMJmd: any = { flex: 1 }
const styleId_GW3Y7: any = { fontWeight: "bold" }
const styleId_Z1i5LUH: any = { flexDirection: 'row', marginTop: 5 }
const styleId_Z22bmhl: any = { paddingVertical: 5, paddingHorizontal: 10, borderRadius: 5 }