diff --git a/src/components/vacation/ProfileList.vue b/src/components/vacation/ProfileList.vue index 32e7ce0..b7947a9 100644 --- a/src/components/vacation/ProfileList.vue +++ b/src/components/vacation/ProfileList.vue @@ -12,7 +12,7 @@ @click="toggleDisable(index)" data-bs-toggle="tooltip" data-popup="tooltip-custom" - data-bs-placement="top" + data-bs-placement="bottom" :aria-label="user.MEMBERSEQ" :data-bs-original-title="getTooltipTitle(user)" > @@ -41,11 +41,10 @@ const emit = defineEmits(); const userStore = useUserStore(); const userList = ref([]); - const userListContainer = ref(null); // 프로필 목록 컨테이너 참조 + const userListContainer = ref(null); const baseUrl = $api.defaults.baseURL.replace(/api\/$/, ""); - const defaultProfile = "/img/icons/icon.png"; // 기본 이미지 경로 + const defaultProfile = "/img/icons/icon.png"; - // ✅ 사용자 목록 호출 onMounted(async () => { await userStore.fetchUserList(); userList.value = userStore.userList; @@ -57,77 +56,78 @@ }); }); - // ✅ 프로필 이미지 경로 반환 const getUserProfileImage = (profilePath) => { return profilePath && profilePath.trim() ? `${baseUrl}upload/img/profile/${profilePath}` : defaultProfile; }; - // ✅ 이미지 로딩 오류 처리 const setDefaultImage = (event) => { event.target.src = defaultProfile; }; - // ✅ 이미지 로드 후 깜빡임 방지 const showImage = (event) => { event.target.style.visibility = "visible"; }; - // ✅ 툴팁 타이틀 설정 const getTooltipTitle = (user) => { return user.MEMBERSEQ === userList.value.MEMBERSEQ ? "나" : user.MEMBERNAM; }; - // ✅ 좌우 스크롤 이동 기능 추가 (한 줄씩 이동) + const scrollAmount = 9 * 100; + const scrollLeft = () => { - userListContainer.value.scrollBy({ left: -userListContainer.value.clientWidth, behavior: "smooth" }); + userListContainer.value.scrollBy({ left: -scrollAmount, behavior: "smooth" }); }; const scrollRight = () => { - userListContainer.value.scrollBy({ left: userListContainer.value.clientWidth, behavior: "smooth" }); + userListContainer.value.scrollBy({ left: scrollAmount, behavior: "smooth" }); }; diff --git a/src/views/vacation/VacationManagement.vue b/src/views/vacation/VacationManagement.vue index 47cc56c..f267dc0 100644 --- a/src/views/vacation/VacationManagement.vue +++ b/src/views/vacation/VacationManagement.vue @@ -5,23 +5,19 @@