localnet/localhost-front
10
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

아이콘 간격 수정

Browse Source
This commit is contained in:
nevermoregb 2025-03-06 12:15:37 +09:00
parent 6c4fc7ac8e
commit 6ac3d587f8
1 changed files with 92 additions and 104 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

78
src/components/board/BoardProfile.vue
View File

@ -10,12 +10,8 @@
<div class="profile-detail"> <div class="profile-detail">
<span>{{ date }}</span> <span>{{ date }}</span>
<template v-if="showDetail"> <template v-if="showDetail">
<span class="ms-2"> <span class="ms-2"> <i class="fa-regular fa-eye"></i> {{ views }} </span>
<i class="fa-regular fa-eye"></i> {{ views }} <span class="ms-1"> <i class="bx bx-comment"></i> {{ commentNum }} </span>
</span>
<span>
<i class="bx bx-comment"></i> {{ commentNum }}
</span>
</template> </template>
</div> </div>
</div> </div>
@ -29,37 +25,32 @@
</template> </template>
<!-- 좋아요, 싫어요 버튼 (댓글에서만 표시) --> <!-- 좋아요, 싫어요 버튼 (댓글에서만 표시) -->
<BoardRecommendBtn <BoardRecommendBtn v-if="isLike" :boardId="boardId" :comment="comment" @updateReaction="handleUpdateReaction" />
v-if="isLike"
:boardId="boardId"
:comment="comment"
@updateReaction="handleUpdateReaction"
/>
</div> </div>
</div> </div>
</template> </template>
<script setup> <script setup>
import { computed, defineProps, defineEmits } from 'vue'; import { computed, defineProps, defineEmits } from 'vue';
import DeleteButton from '../button/DeleteBtn.vue'; import DeleteButton from '../button/DeleteBtn.vue';
import EditButton from '../button/EditBtn.vue'; import EditButton from '../button/EditBtn.vue';
import BoardRecommendBtn from '../button/BoardRecommendBtn.vue'; import BoardRecommendBtn from '../button/BoardRecommendBtn.vue';
// 기본 프로필 이미지 경로 // 기본 프로필 이미지 경로
const defaultProfile = "/img/icons/icon.png"; const defaultProfile = '/img/icons/icon.png';
// 서버의 이미지 경로 (Vue 환경 변수 사용 가능) // 서버의 이미지 경로 (Vue 환경 변수 사용 가능)
const baseUrl = "http://localhost:10325/"; // API 서버 URL const baseUrl = 'http://localhost:10325/'; // API 서버 URL
// Props 정의 // Props 정의
const props = defineProps({ const props = defineProps({
comment: { comment: {
type: Object, type: Object,
required: false, required: false,
}, },
boardId: { boardId: {
type: Number, type: Number,
required: false required: false,
}, },
commentId: { commentId: {
type: Number, type: Number,
@ -102,39 +93,36 @@ const props = defineProps({
isLike: { isLike: {
type: Boolean, type: Boolean,
default: false, default: false,
} },
}); });
const emit = defineEmits(['updateReaction', 'editClick', 'deleteClick']); const emit = defineEmits(['updateReaction', 'editClick', 'deleteClick']);
const isDeletedComment = computed(() => { const isDeletedComment = computed(() => {
return props.comment?.content === '삭제된 댓글입니다' && return props.comment?.content === '삭제된 댓글입니다' && props.comment?.updateAtRaw !== props.comment?.createdAtRaw;
props.comment?.updateAtRaw !== props.comment?.createdAtRaw; });
});
// 수정 // 수정
const editClick = () => { const editClick = () => {
emit('editClick', { ...props.comment, unknown: props.unknown }); emit('editClick', { ...props.comment, unknown: props.unknown });
}; };
// 삭제 // 삭제
const deleteClick = () => { const deleteClick = () => {
emit('deleteClick', { ...props.comment, unknown: props.unknown }); emit('deleteClick', { ...props.comment, unknown: props.unknown });
}; };
// 좋아요/싫어요 업데이트 // 좋아요/싫어요 업데이트
const handleUpdateReaction = (reactionData) => { const handleUpdateReaction = reactionData => {
emit("updateReaction", { emit('updateReaction', {
boardId: props.boardId, boardId: props.boardId,
commentId: props.comment?.commentId, commentId: props.comment?.commentId,
...reactionData, ...reactionData,
}); });
}; };
// 프로필 이미지 경로 설정 // 프로필 이미지 경로 설정
const getProfileImage = (profilePath) => { const getProfileImage = profilePath => {
return profilePath && profilePath.trim() return profilePath && profilePath.trim() ? `${baseUrl}upload/img/profile/${profilePath}` : defaultProfile;
? `${baseUrl}upload/img/profile/${profilePath}`
: defaultProfile;
}; };
</script> </script>