//@ts-nocheck
import React from 'react';
import { Dimensions, TouchableOpacity, View } from 'react-native';
import Pdf from 'react-native-pdf';
import { commonStyles } from '../CommonStyles';
import { useSafeAreaInsets } from 'react-native-safe-area-context';
import { CheckBox, CheckBoxActive, IconBack } from '../../assets/icons';
import { useNavigation } from '@react-navigation/native';
import { MText } from '../../components/MText';
import { Api } from '../../services/api';
import LinearGradient from 'react-native-linear-gradient';
export default function PolicyF88(props) {
  const navigation = useNavigation();
  const insets = useSafeAreaInsets();
  const [check, setCheck] = React.useState(false);
  const [isLoading, setIsLoading] = React.useState(false);
  const { item } = props.route.params;
  const confirm = async () => {
    try {
      setIsLoading(true);
      const response = await Api.getInstance().confirmF88({
        loanBriefId: item?.id,
      });
      if (response.kind === 'ok' && response.data?.meta?.errorCode === 200) {
        navigation.goBack();
      } else {
        Alert.alert(
          'Thông báo',
          response?.data?.meta?.errorMessage ||
            'Có lỗi xảy ra, vui lòng thử lại sau!'
        );
      }
    } catch (error) {
      Alert.alert('Thông báo', 'Có lỗi xảy ra, vui lòng thử lại sau');
    } finally {
      setIsLoading(false);
    }
  };
  return (
    <View style={{ flex: 1, backgroundColor: 'white' }}>
      <View
        style={{
          marginTop: insets.top,
          paddingVertical: 16,
          alignItems: 'center',
          justifyContent: 'center',
          flexDirection: 'row',
        }}
      >
        <TouchableOpacity
          onPress={() => navigation.goBack()}
          style={{
            position: 'absolute',
            left: 16,
          }}
        >
          <IconBack />
        </TouchableOpacity>
        <MText
          style={{
            fontWeight: 'bold',
          }}
        >
          ĐIỀU KIỆN VÀ ĐIỀU KHOẢN
        </MText>
      </View>
      <View style={{ flex: 1 }}>
        <Pdf
          trustAllCerts={false}
          source={{
            uri: 'https://cdn.tima.vn/file-pdf/policy_f88.pdf',
          }}
          style={{
            flex: 1,
            width: Dimensions.get('window').width,
            height: Dimensions.get('window').height,
          }}
        />
      </View>
      <View style={{ padding: 16 }}>
        <View
          style={{
            flexDirection: 'row',
            alignItems: 'center',
            marginTop: 24,
            gap: 8,
          }}
        >
          <TouchableOpacity
            onPress={() => {
              setCheck(!check);
            }}
          >
            {check ? <CheckBoxActive /> : <CheckBox />}
          </TouchableOpacity>
          <MText>
            Tôi đồng ý với{' '}
            <MText style={{ color: '#2F80ED' }}>điều kiện và điều khoản</MText>
          </MText>
        </View>
        <TouchableOpacity
          disabled={check || isLoading ? false : true}
          onPress={() => {
            confirm();
          }}
        >
          <LinearGradient
            colors={check ? ['#FF8E4F', '#EF592E'] : ['#E0E0E0', '#E0E0E0']}
            style={{
              height: 40,
              alignItems: 'center',
              justifyContent: 'center',
              borderRadius: 24,
              paddingHorizontal: 10,
              marginTop: 24,
            }}
          >
            <MText
              style={{
                color: 'white',
                fontWeight: 'bold',
              }}
            >
              Đồng ý & Tiếp tục
            </MText>
          </LinearGradient>
        </TouchableOpacity>
      </View>
    </View>
  );
}
