diff --git a/components/cards/QrCard.js b/components/cards/QrCard.js index b99ce3d..c0f25c3 100644 --- a/components/cards/QrCard.js +++ b/components/cards/QrCard.js @@ -1,5 +1,5 @@ import React, { useState } from 'react'; -import { View, Text, Image } from 'react-native'; +import { View, Text, Image, ScrollView } from 'react-native'; import { useNavigation } from '@react-navigation/native'; import QRCode from 'react-native-qrcode-svg'; @@ -26,21 +26,34 @@ const QrCard = ({ hasAccessAuthority, did, userName, hospitalName, startDate, ex source={require('../../assets/images/mainBackground.png')} resizeMode="contain" // 이미지 비율 유지 /> - {hasAccessAuthority ? ( - <> - 임시 출입 QR - - {userName} - {hospitalName} - 시작일: {startDate} - 만료일: {expireDate} - - ) : ( - <> - 등록된 출입 권한이 존재하지 않습니다. - 방문 신청 버튼을 눌러 출입 권한을 신청해주세요. - - )} + + {hasAccessAuthority ? ( + <> + 임시 출입 QR + + {userName} + {hospitalName} + 시작일: {startDate} + 만료일: {expireDate} + + ) : ( + <> + 등록된 출입 권한이 존재하지 않습니다. + + 방문 신청 버튼을 눌러 출입 권한을 신청해주세요. + + + )} + ); diff --git a/components/cards/styles/QrCard.styles.js b/components/cards/styles/QrCard.styles.js index 83a5187..4b7a06a 100644 --- a/components/cards/styles/QrCard.styles.js +++ b/components/cards/styles/QrCard.styles.js @@ -11,7 +11,7 @@ export const styles = StyleSheet.create({ elevation: 7, // Android용 borderRadius: 15, width: '70%', - height: '85%', //TODO : 기존에는 80이었는데, 추후 카드 높이 변경 필요할듯함 + height: '90%', //TODO : 기존에는 80이었는데, 추후 카드 높이 변경 필요할듯함 marginVertical: '10%', }, cardContainer: { diff --git a/modals/MyAccessDetailModal.js b/modals/MyAccessDetailModal.js index 97385dd..0fa72c2 100644 --- a/modals/MyAccessDetailModal.js +++ b/modals/MyAccessDetailModal.js @@ -1,5 +1,5 @@ import React from 'react'; -import { View, Text, TouchableOpacity } from 'react-native'; +import { View, Text, TouchableOpacity, ScrollView } from 'react-native'; import Modal from 'react-native-modal'; import { styles } from './styles/MyAccessDetailModal.styles'; @@ -7,23 +7,36 @@ import { styles } from './styles/MyAccessDetailModal.styles'; const MyAccessDetailModal = ({ isVisible, onClose, onConfirm, data }) => { if (!data) return null; + // visitorType에 따라 타이틀 결정 + const relationTitle = + data.visitorType === '환자' + ? '내 보호자' + : data.visitorType === '보호자' + ? '내 환자' + : '상대방'; + return ( - {data.hospitalName} - {data.area} - - 방문자: {data.visitorType} - 시작일: {data.startDate} - 만료일: {data.expireDate} - 승인 여부: {data.approval} - 환자 번호: {data.patientNumber} - - 내 보호자 - - {`김지수\t|\t010-0000-0000`} - {`손민지\t|\t010-1111-1111`} - + + {data.hospitalName} + {data.area} + + 방문자: {data.visitorType} + 시작일: {data.startDate} + 만료일: {data.expireDate} + 승인 여부: {data.approval} + 환자 번호: {data.patientNumber} + + {relationTitle} + + {`김지수\t|\t010-0000-0000`} + {`손민지\t|\t010-1111-1111`} + + diff --git a/modals/styles/MyAccessDetailModal.styles.js b/modals/styles/MyAccessDetailModal.styles.js index 8a457cc..74f8436 100644 --- a/modals/styles/MyAccessDetailModal.styles.js +++ b/modals/styles/MyAccessDetailModal.styles.js @@ -4,7 +4,7 @@ import { colors } from '../../constants/colors'; export const styles = StyleSheet.create({ modalContainer: { width: 300, - height: 'auto', + maxHeight: '80%', padding: '5%', borderRadius: 10, backgroundColor: colors.white, @@ -41,7 +41,7 @@ export const styles = StyleSheet.create({ flexDirection: 'row', justifyContent: 'center', alignSelf: 'stretch', - marginVertical: '7%', + // marginVertical: '7%', gap: '5%', }, button: {