feat : 유저 디테일 조회시 데이터 컨버터 추가

THT-Team · Aug 11, 2024 · 3a92cf9 · 3a92cf9
1 parent 99f62af
commit 3a92cf9
Show file tree

Hide file tree

Showing 2 changed files with 78 additions and 10 deletions.
diff --git a/src/api/user/UserDataConverter.js b/src/api/user/UserDataConverter.js
@@ -0,0 +1,53 @@
+const SERVICE_AGREE_CATEGORY = {
+  'PERSONAL_PRIVACY_INFO_AGREE': '개인정보 이용약관',
+  'SERVICE_USE_AGREE': '서비스 이용약관',
+  'LOCATION_SERVICE_AGREE': '위치정보 이용약관',
+  'MARKETING_AGREE': '마케팅 이용약관'
+}
+
+export function convertServiceAgreeToString(category) {
+  return SERVICE_AGREE_CATEGORY[category]
+}
+
+const RELIGION = {
+  'NONE' : '무교',
+  'CHRISTIAN' : '기독교',
+  'CATHOLICISM' : '천주교',
+  'BUDDHISM' : '불교',
+  'WON_BUDDHISM' : '원불교',
+  'OTHER' : '기타'
+}
+export function convertReligion(data){
+  return RELIGION[data]
+}
+
+const FREQUENCY = {
+  'NONE' : '안함',
+  'SOMETIMES' : '가끔',
+  'FREQUENTLY' : '자주'
+}
+
+export function convertFrequency(data) {
+  return FREQUENCY[data]
+}
+
+const SEXUALITY = {
+  'MALE' : '남성',
+  'FEMALE' : '여성',
+  'BISEXUAL' : '양성'
+}
+
+export function convertGender(data) {
+  return SEXUALITY[data]
+}
+
+const SNS_TYPE = {
+  'NORMAL': '일반',
+  'KAKAO': '카카오',
+  'NAVER': '네이버',
+  'GOOGLE': '구글'
+}
+
+export function convertSnsType(data) {
+  return SNS_TYPE[data]
+}
diff --git a/src/components/UserDetail.vue b/src/components/UserDetail.vue
@@ -4,7 +4,7 @@
             <Carousel autoplay="5000" items-to-show="1" :wrap-around="true">
                 <Slide v-for="(imgUrl, priority) in userDetailData.profileUrl" :key="priority">
                     <div class="carousel__item">
-                        <img :src="imgUrl" alt="프로필 사진"/>
+                        <img :src="imgUrl" alt="프로필 사진" />
                     </div>
                 </Slide>
 
@@ -23,21 +23,30 @@
             <span> <b-badge variant="success">이메일</b-badge> : {{ userDetailData.email }}</span> <br>
             <span> <b-badge variant="success">거주지</b-badge> : {{ userDetailData.userLocation }}</span> <br>
             <span> <b-badge variant="success">키</b-badge> : {{ userDetailData.tall }} cm</span> <br>
-            <span> <b-badge variant="success">성별</b-badge> : {{ userDetailData.gender }}</span> <br>
-            <span> <b-badge variant="success">선호 성별</b-badge> : {{ userDetailData.preferGender }}</span> <br>
-            <span> <b-badge variant="success">음주 여부</b-badge> : {{ userDetailData.drinkStatus }}</span> <br>
-            <span> <b-badge variant="success">흡연 여부</b-badge> : {{ userDetailData.smokingStatus }}</span> <br>
-            <span> <b-badge variant="success">종교</b-badge> : {{ userDetailData.religion }}</span> <br>
+            <span> <b-badge variant="success">성별</b-badge> : {{ convertGender(userDetailData.gender) }}</span> <br>
+            <span> <b-badge variant="success">선호 성별</b-badge> : {{ convertGender(userDetailData.preferGender) }}</span>
+            <br>
+            <span> <b-badge variant="success">음주 여부</b-badge> : {{ convertFrequency(userDetailData.drinkStatus)
+                }}</span> <br>
+            <span> <b-badge variant="success">흡연 여부</b-badge> : {{ convertFrequency(userDetailData.smokingStatus)
+                }}</span> <br>
+            <span> <b-badge variant="success">종교</b-badge> : {{ convertReligion(userDetailData.religion) }}</span> <br>
         </div>
         <div class="detail-info">
             <span> <b-badge variant="success">서비스 이용약관 동의 목록</b-badge> <br>
                 <span v-for="(isAgree, agreeCategory) in userDetailData.serviceAgreeList">
-                    ✔️ {{ agreeCategory }} : {{ isAgree ? " 동의 " : " 비동의 " }} <br>
+                    ✔️ {{ convertServiceAgreeToString(agreeCategory) }} : {{ isAgree ? ' 동의 ' : ' 비동의 ' }} <br>
                 </span>
             </span> <br>
-            <span> <b-badge variant="success">SNS 가입 타입</b-badge> : {{ userDetailData.snsSignUpList }}</span> <br>
-            <span> <b-badge variant="success">관심사</b-badge> : {{ userDetailData.interests }}</span> <br>
-            <span> <b-badge variant="success">이상형</b-badge> : {{ userDetailData.idealTypes }}</span> <br>
+            <span> <b-badge variant="success">SNS 가입 타입</b-badge> :
+                <span v-for="(type, index) in userDetailData.snsSignUpList"> <b-badge pill variant="warning">{{ convertSnsType(type) }}</b-badge> &nbsp</span>
+            </span> <br>
+            <span> <b-badge variant="success">관심사</b-badge> :
+                <span v-for="(interest, index) in userDetailData.interests"> <b-badge pill variant="secondary">{{ interest }}</b-badge> &nbsp</span>
+            </span> <br>
+            <span> <b-badge variant="success">이상형</b-badge> :
+                                <span v-for="(idealType, index) in userDetailData.idealTypes"> <b-badge pill variant="secondary">{{ idealType }}</b-badge> &nbsp</span>
+            </span> <br>
 
         </div>
     </div>
@@ -50,6 +59,12 @@ import { onMounted, ref } from 'vue'
 import { getUserDetail } from '@/api/user/UserDetail.js'
 import { Carousel, Navigation, Pagination, Slide } from 'vue3-carousel'
 import 'vue3-carousel/dist/carousel.css'
+import {
+    convertFrequency,
+    convertGender,
+    convertReligion,
+    convertServiceAgreeToString, convertSnsType
+} from '../api/user/UserDataConverter.js'
 
 const props = defineProps({
     uuid: String