You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
723 lines
20 KiB
723 lines
20 KiB
import { Ionicons } from '@expo/vector-icons';
|
|
import { useRouter } from 'expo-router';
|
|
import { useMemo, useState } from 'react';
|
|
import {
|
|
Alert,
|
|
ActivityIndicator,
|
|
Pressable,
|
|
ScrollView,
|
|
StyleSheet,
|
|
Text,
|
|
View,
|
|
} from 'react-native';
|
|
import { SafeAreaView } from 'react-native-safe-area-context';
|
|
import { usePersonalDataExport } from '../src/hooks';
|
|
import {colors, spacing} from '../src/theme';
|
|
import type { DataExportCategory, DataExportFormat, PersonalDataExport } from '../src/types';
|
|
|
|
/* ===================== 子组件：顶部导航 ===================== */
|
|
|
|
function Header({ onBack }: { onBack: () => void }) {
|
|
return (
|
|
<View style={styles.header}>
|
|
<Pressable style={styles.headerBtn} onPress={onBack} hitSlop={8}>
|
|
<Ionicons name="chevron-back" size={24} color={colors.textPrimary} />
|
|
</Pressable>
|
|
<Text style={styles.headerTitle}>个人数据导出</Text>
|
|
<View style={styles.headerBtn} />
|
|
</View>
|
|
);
|
|
}
|
|
|
|
/* ===================== 子组件：功能说明卡 ===================== */
|
|
|
|
function IntroCard({ title, description }: { title: string; description: string }) {
|
|
return (
|
|
<View style={styles.introCard}>
|
|
<View style={styles.introIconWrap}>
|
|
<Ionicons name="cloud-download-outline" size={28} color={colors.primary} />
|
|
</View>
|
|
<View style={styles.introText}>
|
|
<Text style={styles.introTitle}>{title}</Text>
|
|
<Text style={styles.introDesc}>{description}</Text>
|
|
</View>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
/* ===================== 子组件：数据分类选择 ===================== */
|
|
|
|
function CategoryRow({
|
|
category,
|
|
checked,
|
|
onToggle,
|
|
}: {
|
|
category: DataExportCategory;
|
|
checked: boolean;
|
|
onToggle: () => void;
|
|
}) {
|
|
return (
|
|
<Pressable style={styles.categoryRow} onPress={onToggle}>
|
|
<View style={[styles.checkbox, checked && styles.checkboxActive]}>
|
|
{checked ? <Ionicons name="checkmark" size={14} color={colors.white} /> : null}
|
|
</View>
|
|
<View style={styles.categoryBody}>
|
|
<Text style={styles.categoryLabel}>{category.label}</Text>
|
|
<Text style={styles.categoryDesc}>{category.description}</Text>
|
|
</View>
|
|
<Text style={styles.categorySize}>{category.size}</Text>
|
|
</Pressable>
|
|
);
|
|
}
|
|
|
|
/* ===================== 子组件：导出格式选择 ===================== */
|
|
|
|
function FormatCard({
|
|
format,
|
|
selected,
|
|
onSelect,
|
|
}: {
|
|
format: DataExportFormat;
|
|
selected: boolean;
|
|
onSelect: () => void;
|
|
}) {
|
|
return (
|
|
<Pressable
|
|
style={[styles.formatCard, selected && styles.formatCardActive]}
|
|
onPress={onSelect}
|
|
>
|
|
<View style={styles.formatTop}>
|
|
<View style={[styles.formatIconWrap, selected && styles.formatIconWrapActive]}>
|
|
<Ionicons name={format.icon as keyof typeof Ionicons.glyphMap} size={24} color={selected ? colors.primary : colors.textSecondary} />
|
|
</View>
|
|
{selected ? <Ionicons name="checkmark-circle" size={20} color={colors.primary} /> : null}
|
|
</View>
|
|
<Text style={[styles.formatLabel, selected && styles.formatLabelActive]}>{format.label}</Text>
|
|
<Text style={styles.formatDesc}>{format.description}</Text>
|
|
</Pressable>
|
|
);
|
|
}
|
|
|
|
/* ===================== 子组件：时间范围选择 ===================== */
|
|
|
|
function TimeRangeRow({
|
|
label,
|
|
selected,
|
|
onSelect,
|
|
}: {
|
|
label: string;
|
|
selected: boolean;
|
|
onSelect: () => void;
|
|
}) {
|
|
return (
|
|
<Pressable style={styles.timeRow} onPress={onSelect}>
|
|
<Text style={[styles.timeLabel, selected && styles.timeLabelActive]}>{label}</Text>
|
|
<View style={[styles.radio, selected && styles.radioActive]}>
|
|
{selected ? <View style={styles.radioDot} /> : null}
|
|
</View>
|
|
</Pressable>
|
|
);
|
|
}
|
|
|
|
/* ===================== 子组件：导出预览 ===================== */
|
|
|
|
function PreviewCard({
|
|
categoryCount,
|
|
totalSize,
|
|
estimatedTime,
|
|
validity,
|
|
}: {
|
|
categoryCount: number;
|
|
totalSize: string;
|
|
estimatedTime: string;
|
|
validity: string;
|
|
}) {
|
|
return (
|
|
<View style={styles.previewCard}>
|
|
<Text style={styles.previewTitle}>导出数据预览</Text>
|
|
<View style={styles.previewGrid}>
|
|
<View style={styles.previewItem}>
|
|
<Text style={styles.previewValue}>{categoryCount} 类</Text>
|
|
<Text style={styles.previewLabel}>已选分类</Text>
|
|
</View>
|
|
<View style={styles.previewItem}>
|
|
<Text style={styles.previewValue}>{totalSize}</Text>
|
|
<Text style={styles.previewLabel}>预估大小</Text>
|
|
</View>
|
|
<View style={styles.previewItem}>
|
|
<Text style={styles.previewValue}>{estimatedTime}</Text>
|
|
<Text style={styles.previewLabel}>预计处理时间</Text>
|
|
</View>
|
|
<View style={styles.previewItem}>
|
|
<Text style={styles.previewValue}>{validity}</Text>
|
|
<Text style={styles.previewLabel}>有效期</Text>
|
|
</View>
|
|
</View>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
/* ===================== 子组件：最近导出记录 ===================== */
|
|
|
|
function RecentExportRow({
|
|
record,
|
|
onDownload,
|
|
}: {
|
|
record: PersonalDataExport['recentExports'][number];
|
|
onDownload: () => void;
|
|
}) {
|
|
const isCompleted = record.status === 'completed';
|
|
return (
|
|
<View style={styles.recentRow}>
|
|
<View style={styles.recentIconWrap}>
|
|
<Ionicons name="document-outline" size={22} color={colors.primary} />
|
|
</View>
|
|
<View style={styles.recentBody}>
|
|
<Text style={styles.recentName}>{record.name}</Text>
|
|
<View style={styles.recentMeta}>
|
|
<Text style={styles.recentDate}>{record.date}</Text>
|
|
<Text style={styles.recentSize}>{record.size}</Text>
|
|
<View style={[styles.statusTag, isCompleted ? styles.statusCompleted : styles.statusExpired]}>
|
|
<Text style={[styles.statusText, isCompleted ? styles.statusTextCompleted : styles.statusTextExpired]}>
|
|
{isCompleted ? '已完成' : '已过期'}
|
|
</Text>
|
|
</View>
|
|
</View>
|
|
</View>
|
|
<Pressable style={styles.recentAction} onPress={onDownload} hitSlop={6}>
|
|
<Ionicons name="download-outline" size={20} color={colors.primary} />
|
|
</Pressable>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
/* ===================== 页面 ===================== */
|
|
|
|
export default function PersonalDataExportScreen() {
|
|
const router = useRouter();
|
|
const { exportData, loading, error, refresh, submit, submitting } = usePersonalDataExport();
|
|
const [selectedIds, setSelectedIds] = useState<Set<string>>(new Set());
|
|
const [formatId, setFormatId] = useState<string | null>(null);
|
|
const [timeRangeId, setTimeRangeId] = useState<string | null>(null);
|
|
|
|
// 初始化本地选择状态
|
|
const initialized = useMemo(() => {
|
|
if (!exportData) return false;
|
|
if (selectedIds.size === 0) {
|
|
const initial = new Set<string>();
|
|
exportData.categories.forEach((cat) => {
|
|
if (cat.items.every((item) => item.checked)) {
|
|
initial.add(cat.id);
|
|
}
|
|
});
|
|
setSelectedIds(initial);
|
|
}
|
|
if (formatId === null) setFormatId(exportData.selectedFormat);
|
|
if (timeRangeId === null) setTimeRangeId(exportData.selectedTimeRange);
|
|
return true;
|
|
}, [exportData, selectedIds.size, formatId, timeRangeId]);
|
|
|
|
const toggleCategory = (id: string) => {
|
|
setSelectedIds((prev) => {
|
|
const next = new Set(prev);
|
|
if (next.has(id)) next.delete(id);
|
|
else next.add(id);
|
|
return next;
|
|
});
|
|
};
|
|
|
|
const handleSubmit = async () => {
|
|
await submit();
|
|
};
|
|
|
|
if (loading) {
|
|
return (
|
|
<SafeAreaView style={styles.container} edges={['top']}>
|
|
<Header onBack={() => router.back()} />
|
|
<View style={styles.center}>
|
|
<ActivityIndicator size="large" color={colors.primary} />
|
|
</View>
|
|
</SafeAreaView>
|
|
);
|
|
}
|
|
|
|
if (error || !exportData || !initialized) {
|
|
return (
|
|
<SafeAreaView style={styles.container} edges={['top']}>
|
|
<Header onBack={() => router.back()} />
|
|
<View style={styles.center}>
|
|
<Ionicons name="alert-circle-outline" size={40} color={colors.danger} />
|
|
<Text style={styles.tip}>加载失败</Text>
|
|
<Pressable style={styles.retryBtn} onPress={refresh}>
|
|
<Text style={styles.retryText}>重试</Text>
|
|
</Pressable>
|
|
</View>
|
|
</SafeAreaView>
|
|
);
|
|
}
|
|
|
|
const selectedCategories = exportData.categories.filter((cat) => selectedIds.has(cat.id));
|
|
const selectedCount = selectedCategories.length;
|
|
|
|
return (
|
|
<SafeAreaView style={styles.container} edges={['top', 'bottom']}>
|
|
<Header onBack={() => router.back()} />
|
|
<ScrollView contentContainerStyle={styles.body} showsVerticalScrollIndicator={false}>
|
|
<IntroCard title={exportData.title} description={exportData.description} />
|
|
|
|
{/* 选择要导出的数据 */}
|
|
<View style={styles.section}>
|
|
<View style={styles.sectionHeader}>
|
|
<Text style={styles.sectionTitle}>选择要导出的数据</Text>
|
|
<Pressable
|
|
onPress={() => {
|
|
const allIds = new Set(exportData.categories.map((cat) => cat.id));
|
|
setSelectedIds(allIds);
|
|
}}
|
|
>
|
|
<Text style={styles.sectionAction}>全选</Text>
|
|
</Pressable>
|
|
</View>
|
|
<View style={styles.card}>
|
|
{exportData.categories.map((category, index) => {
|
|
const isLast = index === exportData.categories.length - 1;
|
|
return (
|
|
<View key={category.id} style={isLast ? undefined : styles.rowBorder}>
|
|
<CategoryRow
|
|
category={category}
|
|
checked={selectedIds.has(category.id)}
|
|
onToggle={() => toggleCategory(category.id)}
|
|
/>
|
|
</View>
|
|
);
|
|
})}
|
|
</View>
|
|
</View>
|
|
|
|
{/* 导出格式 */}
|
|
<View style={styles.section}>
|
|
<Text style={styles.sectionTitle}>导出格式</Text>
|
|
<View style={styles.formatRow}>
|
|
{exportData.formats.map((format) => (
|
|
<FormatCard
|
|
key={format.id}
|
|
format={format}
|
|
selected={formatId === format.id}
|
|
onSelect={() => setFormatId(format.id)}
|
|
/>
|
|
))}
|
|
</View>
|
|
</View>
|
|
|
|
{/* 时间范围 */}
|
|
<View style={styles.section}>
|
|
<Text style={styles.sectionTitle}>时间范围</Text>
|
|
<View style={styles.card}>
|
|
{exportData.timeRanges.map((range, index) => {
|
|
const isLast = index === exportData.timeRanges.length - 1;
|
|
return (
|
|
<View key={range.id} style={isLast ? undefined : styles.rowBorder}>
|
|
<TimeRangeRow
|
|
label={range.label}
|
|
selected={timeRangeId === range.id}
|
|
onSelect={() => setTimeRangeId(range.id)}
|
|
/>
|
|
</View>
|
|
);
|
|
})}
|
|
</View>
|
|
</View>
|
|
|
|
{/* 导出预览 */}
|
|
<View style={styles.section}>
|
|
<Text style={styles.sectionTitle}>导出数据预览</Text>
|
|
<PreviewCard
|
|
categoryCount={selectedCount}
|
|
totalSize={exportData.preview.totalSize}
|
|
estimatedTime={exportData.preview.estimatedTime}
|
|
validity={exportData.preview.validity}
|
|
/>
|
|
</View>
|
|
|
|
{/* 最近导出 */}
|
|
<View style={styles.section}>
|
|
<Text style={styles.sectionTitle}>最近导出</Text>
|
|
<View style={styles.card}>
|
|
{exportData.recentExports.map((record, index) => {
|
|
const isLast = index === exportData.recentExports.length - 1;
|
|
return (
|
|
<View key={record.id} style={isLast ? undefined : styles.rowBorder}>
|
|
{/* 下载需要后端给出文件地址（RecentExportRecord 无下载地址字段），故按项目 4.4 节先例
|
|
保留入口 + 如实说明，不假装成功 */}
|
|
<RecentExportRow
|
|
record={record}
|
|
onDownload={() =>
|
|
// affordance-pending-backend
|
|
Alert.alert('暂未开放', '导出文件下载需后端支持，当前版本暂未开放')
|
|
}
|
|
/>
|
|
</View>
|
|
);
|
|
})}
|
|
{/* 原先这里挂着「查看更多历史导出」，但记录只有 mock 三条、也没有分页接口和历史页，已摘掉 */}
|
|
</View>
|
|
</View>
|
|
</ScrollView>
|
|
|
|
<View style={styles.footer}>
|
|
<Pressable
|
|
style={[styles.submitBtn, (submitting || selectedCount === 0) && styles.submitBtnDisabled]}
|
|
onPress={handleSubmit}
|
|
disabled={submitting || selectedCount === 0}
|
|
>
|
|
{submitting ? (
|
|
<ActivityIndicator size="small" color={colors.white} />
|
|
) : (
|
|
<Text style={styles.submitBtnText}>申请导出</Text>
|
|
)}
|
|
</Pressable>
|
|
</View>
|
|
</SafeAreaView>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
container: { flex: 1, backgroundColor: colors.pageBg },
|
|
header: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
justifyContent: 'space-between',
|
|
paddingHorizontal: 8,
|
|
height: 48,
|
|
backgroundColor: colors.white,
|
|
borderBottomWidth: 1,
|
|
borderBottomColor: colors.borderLight,
|
|
},
|
|
headerBtn: {
|
|
width: 40,
|
|
height: 40,
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
},
|
|
headerTitle: {
|
|
fontSize: 17,
|
|
fontWeight: '700',
|
|
color: colors.textPrimary,
|
|
},
|
|
body: {
|
|
padding: 8,
|
|
paddingBottom: 100,
|
|
},
|
|
center: {
|
|
flex: 1,
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
gap: 12,
|
|
},
|
|
tip: { fontSize: 14, color: colors.textSecondary },
|
|
retryBtn: {
|
|
marginTop: 8,
|
|
paddingHorizontal: 24,
|
|
paddingVertical: 8,
|
|
borderRadius: 18,
|
|
backgroundColor: colors.primaryBtn,
|
|
},
|
|
retryText: { color: colors.white, fontSize: 13, fontWeight: '600' },
|
|
introCard: {
|
|
flexDirection: 'row',
|
|
backgroundColor: colors.primaryLight,
|
|
borderRadius: 8,
|
|
padding: 8,
|
|
marginBottom: 8,
|
|
},
|
|
introIconWrap: {
|
|
width: 48,
|
|
height: 48,
|
|
borderRadius: 24,
|
|
backgroundColor: colors.white,
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
marginRight: 12,
|
|
},
|
|
introText: { flex: 1 },
|
|
introTitle: {
|
|
fontSize: 16,
|
|
fontWeight: '700',
|
|
color: colors.primaryText,
|
|
marginBottom: 4,
|
|
},
|
|
introDesc: {
|
|
fontSize: 12,
|
|
lineHeight: 17,
|
|
color: colors.textSecondary,
|
|
},
|
|
section: { marginBottom: 20 },
|
|
sectionHeader: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
justifyContent: 'space-between',
|
|
marginBottom: 10,
|
|
},
|
|
sectionTitle: {
|
|
fontSize: 15,
|
|
fontWeight: '700',
|
|
color: colors.textPrimary,
|
|
},
|
|
sectionAction: {
|
|
fontSize: 13,
|
|
color: colors.primary,
|
|
fontWeight: '600',
|
|
},
|
|
card: {
|
|
backgroundColor: colors.white,
|
|
borderRadius: 8,
|
|
overflow: 'hidden',
|
|
},
|
|
rowBorder: {
|
|
borderBottomWidth: 1,
|
|
borderBottomColor: colors.borderLight,
|
|
},
|
|
categoryRow: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
paddingHorizontal: spacing.framework,
|
|
paddingVertical: 14,
|
|
},
|
|
checkbox: {
|
|
width: 20,
|
|
height: 20,
|
|
borderRadius: 4,
|
|
borderWidth: 2,
|
|
borderColor: colors.borderStrong,
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
marginRight: 12,
|
|
},
|
|
checkboxActive: {
|
|
backgroundColor: colors.primary,
|
|
borderColor: colors.primary,
|
|
},
|
|
categoryBody: { flex: 1 },
|
|
categoryLabel: {
|
|
fontSize: 15,
|
|
fontWeight: '600',
|
|
color: colors.textPrimary,
|
|
},
|
|
categoryDesc: {
|
|
fontSize: 12,
|
|
color: colors.textSecondary,
|
|
marginTop: 2,
|
|
},
|
|
categorySize: {
|
|
fontSize: 12,
|
|
color: colors.textHint,
|
|
},
|
|
formatRow: {
|
|
flexDirection: 'row',
|
|
gap: 8,
|
|
},
|
|
formatCard: {
|
|
flex: 1,
|
|
backgroundColor: colors.white,
|
|
borderRadius: 8,
|
|
padding: 8,
|
|
borderWidth: 1,
|
|
borderColor: colors.borderLight,
|
|
},
|
|
formatCardActive: {
|
|
borderColor: colors.primary,
|
|
backgroundColor: colors.primaryLight,
|
|
},
|
|
formatTop: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
justifyContent: 'space-between',
|
|
marginBottom: 12,
|
|
},
|
|
formatIconWrap: {
|
|
width: 44,
|
|
height: 44,
|
|
borderRadius: 12,
|
|
backgroundColor: colors.pageBg,
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
},
|
|
formatIconWrapActive: {
|
|
backgroundColor: colors.white,
|
|
},
|
|
formatLabel: {
|
|
fontSize: 15,
|
|
fontWeight: '700',
|
|
color: colors.textPrimary,
|
|
marginBottom: 4,
|
|
},
|
|
formatLabelActive: {
|
|
color: colors.primary,
|
|
},
|
|
formatDesc: {
|
|
fontSize: 12,
|
|
color: colors.textSecondary,
|
|
lineHeight: 17,
|
|
},
|
|
timeRow: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
justifyContent: 'space-between',
|
|
paddingHorizontal: spacing.framework,
|
|
paddingVertical: 14,
|
|
},
|
|
timeLabel: {
|
|
fontSize: 15,
|
|
color: colors.textPrimary,
|
|
},
|
|
timeLabelActive: {
|
|
fontWeight: '600',
|
|
color: colors.primary,
|
|
},
|
|
radio: {
|
|
width: 20,
|
|
height: 20,
|
|
borderRadius: 10,
|
|
borderWidth: 2,
|
|
borderColor: colors.borderStrong,
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
},
|
|
radioActive: {
|
|
borderColor: colors.primary,
|
|
},
|
|
radioDot: {
|
|
width: 10,
|
|
height: 10,
|
|
borderRadius: 5,
|
|
backgroundColor: colors.primary,
|
|
},
|
|
previewCard: {
|
|
backgroundColor: colors.white,
|
|
borderRadius: 8,
|
|
padding: 8,
|
|
},
|
|
previewTitle: {
|
|
fontSize: 14,
|
|
fontWeight: '700',
|
|
color: colors.textPrimary,
|
|
marginBottom: 12,
|
|
},
|
|
previewGrid: {
|
|
flexDirection: 'row',
|
|
flexWrap: 'wrap',
|
|
},
|
|
previewItem: {
|
|
width: '50%',
|
|
paddingVertical: 10,
|
|
},
|
|
previewValue: {
|
|
fontSize: 16,
|
|
fontWeight: '700',
|
|
color: colors.primary,
|
|
marginBottom: 2,
|
|
},
|
|
previewLabel: {
|
|
fontSize: 12,
|
|
color: colors.textSecondary,
|
|
},
|
|
recentRow: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
paddingHorizontal: spacing.framework,
|
|
paddingVertical: 12,
|
|
},
|
|
recentIconWrap: {
|
|
width: 40,
|
|
height: 40,
|
|
borderRadius: 10,
|
|
backgroundColor: colors.primaryLight,
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
marginRight: 12,
|
|
},
|
|
recentBody: { flex: 1 },
|
|
recentName: {
|
|
fontSize: 14,
|
|
fontWeight: '600',
|
|
color: colors.textPrimary,
|
|
marginBottom: 4,
|
|
},
|
|
recentMeta: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
gap: 8,
|
|
},
|
|
recentDate: {
|
|
fontSize: 12,
|
|
color: colors.textSecondary,
|
|
},
|
|
recentSize: {
|
|
fontSize: 12,
|
|
color: colors.textHint,
|
|
},
|
|
statusTag: {
|
|
paddingHorizontal: 6,
|
|
paddingVertical: 2,
|
|
borderRadius: 8,
|
|
},
|
|
statusCompleted: {
|
|
backgroundColor: colors.successLight,
|
|
},
|
|
statusExpired: {
|
|
backgroundColor: colors.borderLight,
|
|
},
|
|
statusText: {
|
|
fontSize: 11,
|
|
fontWeight: '600',
|
|
},
|
|
statusTextCompleted: {
|
|
color: colors.successText,
|
|
},
|
|
statusTextExpired: {
|
|
color: colors.textHint,
|
|
},
|
|
recentAction: {
|
|
width: 36,
|
|
alignItems: 'center',
|
|
},
|
|
viewMoreRow: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
paddingVertical: 12,
|
|
borderTopWidth: 1,
|
|
borderTopColor: colors.borderLight,
|
|
},
|
|
viewMoreText: {
|
|
fontSize: 13,
|
|
color: colors.textSecondary,
|
|
marginRight: 4,
|
|
},
|
|
footer: {
|
|
position: 'absolute',
|
|
left: 0,
|
|
right: 0,
|
|
bottom: 0,
|
|
backgroundColor: colors.white,
|
|
paddingHorizontal: spacing.framework,
|
|
paddingTop: 12,
|
|
paddingBottom: 24,
|
|
borderTopWidth: 1,
|
|
borderTopColor: colors.borderLight,
|
|
},
|
|
submitBtn: {
|
|
backgroundColor: colors.primaryBtn,
|
|
borderRadius: 24,
|
|
paddingVertical: 14,
|
|
alignItems: 'center',
|
|
},
|
|
submitBtnDisabled: {
|
|
backgroundColor: colors.textDisabled,
|
|
},
|
|
submitBtnText: {
|
|
color: colors.white,
|
|
fontSize: 16,
|
|
fontWeight: '700',
|
|
},
|
|
});
|
|
|