File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
import React, { useState,useEffect } from 'react';
import { View, Text, TouchableOpacity } from 'react-native';
import { FlatList } from 'react-native-gesture-handler';
import ListItem from '../components/ListItem';
import { url } from '../url';
// 라디오 버튼 컴포넌트
const RadioButton = ({ options, selectedOption, onSelect }) => {
return (
<View style={{ flexDirection: 'row'}}>
{options.map((option, index) => (
<TouchableOpacity
key={index}
onPress={() => {
onSelect(option,index);
}}
>
<View>
{/* 선택된 옵션에 따라 스타일 변경 */}
<Text
style={{
fontSize: 16,
marginRight: 10,
color: selectedOption === option ? 'blue' : 'black',
}}
>
{option}
</Text>
</View>
</TouchableOpacity>
))}
</View>
);
};
// 예제 앱
const SignatureScreen = () => {
//const [myList, setMyList] = useState([]);
//const [proceedingList, setProceedingList] = useState([]);
//const [doneList, setDoneList] = useState([]);
const [user, setUser] = useState('');
const options = ['내 기안', '진행 문서', '완료 문서'];
const [selectedOption, setSelectedOption] = useState(null);
const [selectedList, setSelectedList] = useState([]);
useEffect(() => {
if (user !== '') {
if (selectedOption === null && options.length > 0) {
getMyDoc();
setSelectedOption(options[0]);
}
} else {
console.log("user 없음")
}
}, [user,selectedList]);
// 옵션 선택 시 호출되는 함수
const handleSelect = (option,index) => {
setSelectedOption(option);
// 선택된 옵션에 따라 다른 리스트 데이터를 설정
if (index === 0) {
getMyDoc();
} else if (index === 1) {
getProceedingDoc();
} else if (index === 2) {
getDoneDoc();
}
};
useEffect(() => {
// 세션 정보를 가져옴
getSession();
}, []); // 여기에서는 세션 정보를 한 번만 가져오도록 수정
// 세션 정보를 가져오는 함수
const getSession = async () => {
try {
const response = await fetch(`${url}/`); // 세션 정보를 가져오는 엔드포인트로 변경
if (response.ok) {
const data = await response.json();
console.log('서버에서 받은 세션 정보signaturelist:', data);
setUser(data.user);
} else {
console.error('세션 정보를 가져오는 데 실패했습니다.');
}
} catch (error) {
console.error('오류:', error);
}
};
const getMyDoc = async () => {
console.log('mydoc user signaturelist:',user);
try {
const response = await fetch(`${url}/my_doc`, {
method: 'POST',
body: JSON.stringify({
user_id: user,
}),
headers: {
'Content-Type': 'application/json',
},
});
if (response.ok) {
const data = await response.json();
console.log("my"+data);
setSelectedList(data);
} else {
console.error('mydoc 데이터를 가져오는 데 실패했습니다.',response);
}
} catch (error) {
console.error('mydoc 데이터를 가져오는 중 오류 발생:', error);
}
};
const getProceedingDoc = async () => {
try {
const response = await fetch(`${url}/trying_doc`, {
method: 'POST',
body: JSON.stringify({
user_id: user,
}),
headers: {
'Content-Type': 'application/json',
},
})
if (response.ok) {
const data = await response.json();
console.log("proceed"+data);
//console.log('listpage:', data);
setSelectedList(data);
} else {
console.error('proceedingdoc 데이터를 가져오는 데 실패했습니다.');
}
} catch (error) {
console.error('proceedingdoc 데이터를 가져오는 중 오류 발생:', error);
}
};
const getDoneDoc = async () => {
try {
const response = await fetch(`${url}/done_doc`, {
method: 'GET',
headers: {
'Content-Type': 'application/json',
},
})
if (response.ok) {
const data = await response.json();
//console.log('listpage:', data);
setSelectedList(data);
} else {
console.error('donedoc 데이터를 가져오는 데 실패했습니다.');
}
} catch (error) {
console.error('donedoc 데이터를 가져오는 중 오류 발생:', error);
}
};
return (
<View>
{/* 라디오 버튼 컴포넌트 사용 */}
<RadioButton
options={options}
selectedOption={selectedOption}
onSelect={handleSelect}
/>
<FlatList
data={selectedList}
renderItem={({item}) => (
<ListItem name="SignatureScreen" item={item} />
)}
windowSize={5}
ListHeaderComponent={View}
ListHeaderComponentStyle={{height: 10}}
/>
</View>
);
};
export default SignatureScreen;