import { useState } from 'react';
import { Image, Pressable, StyleSheet, Text, TextInput, View } from 'react-native';
import { colors } from '../../../src/theme';
import {
  useEnterpriseCertification,
  useImagePick,
  useOnboarding,
  useRegisterFinish,
} from '../../../src/hooks';
import { ScreenShell } from '../ui/ScreenShell';
import { Illustration } from '../ui/Illustration';
import { PrimaryButton } from '../ui/PrimaryButton';

export function B3Recruiter() {
  const { data, setData, back } = useOnboarding();
  const finish = useRegisterFinish();
  const { pick, picking, error: pickError } = useImagePick();
  const { submit, submitting } = useEnterpriseCertification();
  const [submitFailed, setSubmitFailed] = useState(false);

  // 三项都是认证必需，缺一项不放行：没有营业执照的「企业认证」提交不出有意义的结果
  const canSubmit =
    data.recruiterCompany.trim().length > 0 &&
    data.recruiterContact.trim().length > 0 &&
    data.recruiterLicenseUri !== null;

  const pickLicense = async () => {
    // 营业执照是文档，方形裁剪会把内容切掉，用 4:3
    const result = await pick('library', { aspect: [4, 3] });
    if (result.status === 'picked') setData({ recruiterLicenseUri: result.uri });
  };

  const handleSubmit = async () => {
    if (!canSubmit || submitting) return;
    setSubmitFailed(false);
    try {
      // 提交审核状态由接口返回驱动，不再用本地 useState 假装「已提交」
      const res = await submit({
        companyName: data.recruiterCompany.trim(),
        // B3 不采集统一社会信用代码，由企业端「企业认证」页补全（该页已存在且有入口）
        creditCode: '',
        licenseUrl: data.recruiterLicenseUri ?? undefined,
        contactName: data.recruiterContact.trim(),
        // 联系人手机号用注册时登录的手机号，避免再问一次
        contactPhone: data.phone,
      });
      if (!res.success) {
        setSubmitFailed(true);
        return;
      }
      // 落地前 useRegisterFinish 会 flushSave，把认证资料一起落库
      await finish('enterprise');
    } catch {
      // 真实后端就绪后这里会接到网络异常
      setSubmitFailed(true);
    }
  };

  return (
    <ScreenShell title="企业认证" showBack onBack={back}>
      <Text style={styles.tip}>请完成企业认证，开启招聘之旅</Text>

      <Text style={styles.label}>公司名称</Text>
      <TextInput
        style={styles.input}
        value={data.recruiterCompany}
        onChangeText={(t) => setData({ recruiterCompany: t })}
        placeholder="请输入公司全称"
        placeholderTextColor={colors.textHint}
      />

      <Text style={styles.label}>营业执照</Text>
      <Pressable
        style={[styles.upload, picking && styles.dim]}
        disabled={picking}
        onPress={() => void pickLicense()}
      >
        {data.recruiterLicenseUri ? (
          <Image source={{ uri: data.recruiterLicenseUri }} style={styles.licensePreview} resizeMode="cover" />
        ) : (
          <Illustration name="businessLicense" size={96} radius={12} />
        )}
        <Text style={styles.uploadText}>
          {data.recruiterLicenseUri ? '已选择，点击可重新选择' : '点击上传营业执照'}
        </Text>
      </Pressable>

      {pickError ? <Text style={styles.error}>{pickError}</Text> : null}

      <Text style={styles.label}>联系人</Text>
      <TextInput
        style={styles.input}
        value={data.recruiterContact}
        onChangeText={(t) => setData({ recruiterContact: t })}
        placeholder="请输入联系人姓名"
        placeholderTextColor={colors.textHint}
      />

      {submitFailed ? <Text style={styles.error}>认证提交失败，请稍后重试</Text> : null}

      <View style={styles.footer}>
        <PrimaryButton
          label="提交认证"
          active={canSubmit && !submitting}
          loading={submitting}
          onPress={() => void handleSubmit()}
        />
      </View>
    </ScreenShell>
  );
}

const styles = StyleSheet.create({
  tip: { fontSize: 13, color: colors.textHint, marginBottom: 18 },
  label: { fontSize: 14, fontWeight: '700', color: colors.textPrimary, marginTop: 16, marginBottom: 8 },
  input: {
    height: 50,
    borderRadius: 12,
    borderWidth: 1,
    borderColor: colors.border,
    backgroundColor: colors.white,
    paddingHorizontal: 14,
    fontSize: 15,
    color: colors.textPrimary,
  },
  upload: {
    alignItems: 'center',
    justifyContent: 'center',
    gap: 8,
    paddingVertical: 18,
    borderRadius: 12,
    borderWidth: 1,
    borderStyle: 'dashed',
    borderColor: colors.borderStrong,
    backgroundColor: colors.white,
  },
  dim: { opacity: 0.5 },
  licensePreview: { width: 160, height: 120, borderRadius: 12 },
  uploadText: { fontSize: 13, color: colors.textHint },
  error: { fontSize: 12, color: colors.dangerText, marginTop: 10 },
  footer: { marginTop: 28 },
});