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.
53 lines
2.0 KiB
53 lines
2.0 KiB
import { Pressable, StyleSheet, Text, View } from 'react-native';
|
|
import { colors } from '../../../src/theme';
|
|
import { Modal } from './Modal';
|
|
|
|
interface Props {
|
|
visible: boolean;
|
|
/** 「同意」= 勾选协议并继续原动作 */
|
|
onAccept: () => void;
|
|
/** 「拒绝」= 关闭弹窗，不执行动作 */
|
|
onDecline: () => void;
|
|
/** 点击协议名跳转协议详情 */
|
|
onOpenAgreement?: () => void;
|
|
}
|
|
|
|
/** 协议确认弹窗（对齐参考样式）：未勾选协议点登录时拦截，拒绝/同意双按钮 */
|
|
export function AgreementModal({ visible, onAccept, onDecline, onOpenAgreement }: Props) {
|
|
return (
|
|
<Modal visible={visible} onClose={onDecline}>
|
|
<Text style={styles.message}>
|
|
请阅读并同意
|
|
<Text style={styles.link} onPress={onOpenAgreement}>《有职用户协议》</Text>
|
|
和
|
|
<Text style={styles.link} onPress={onOpenAgreement}>《隐私政策》</Text>
|
|
，允许有职统一管理本人账号信息
|
|
</Text>
|
|
<View style={styles.btnRow}>
|
|
<Pressable style={[styles.btn, styles.declineBtn]} onPress={onDecline} hitSlop={4}>
|
|
<Text style={styles.declineText}>拒绝</Text>
|
|
</Pressable>
|
|
<Pressable style={[styles.btn, styles.acceptBtn]} onPress={onAccept} hitSlop={4}>
|
|
<Text style={styles.acceptText}>同意</Text>
|
|
</Pressable>
|
|
</View>
|
|
</Modal>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
message: { fontSize: 15, lineHeight: 24, color: colors.textPrimary, textAlign: 'center' },
|
|
link: { color: colors.primary },
|
|
btnRow: { flexDirection: 'row', gap: 14, marginTop: 20 },
|
|
btn: {
|
|
flex: 1,
|
|
height: 46,
|
|
borderRadius: 23,
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
},
|
|
declineBtn: { backgroundColor: colors.borderLight },
|
|
declineText: { fontSize: 16, fontWeight: '600', color: colors.textPrimary },
|
|
acceptBtn: { backgroundColor: colors.primary },
|
|
acceptText: { fontSize: 16, fontWeight: '700', color: colors.textInverse },
|
|
});
|
|
|