ByungCheol
c4872c93a8
CI / build (push) Failing after 11m0s
- 각 화면 내 <h1> 페이지 타이틀 제거 → 헤더 타이틀로 일원화 (가계부 pending 카운트는 유지, 액션 헤더는 우측 정렬) - 게시글 상세: 공지 등록/해제 버튼 제거 + '목록' 아이콘 추가(list 아이콘 신규) - 글 작성/수정 공지 체크박스로 일원화(편집 시 기존값 로드) - ProfileEdit/AccountInfo 화면 내 뒤로가기 제거, 미사용 router 정리 Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
135 lines
2.9 KiB
Vue
135 lines
2.9 KiB
Vue
<script setup>
|
|
import { computed } from 'vue'
|
|
import { useRouter } from 'vue-router'
|
|
import { useAuthStore } from '@/stores/auth'
|
|
|
|
const auth = useAuthStore()
|
|
const router = useRouter()
|
|
|
|
const u = computed(() => auth.user || {})
|
|
const isLocal = computed(() => (u.value.provider || 'LOCAL') === 'LOCAL')
|
|
|
|
const providerLabel = computed(() => {
|
|
switch (u.value.provider) {
|
|
case 'NAVER': return '네이버'
|
|
case 'LOCAL':
|
|
default: return '일반(아이디/비밀번호)'
|
|
}
|
|
})
|
|
const roleLabel = computed(() => (u.value.role === 'ADMIN' ? '관리자' : '일반회원'))
|
|
|
|
function goEdit() {
|
|
router.push('/settings/account/edit')
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="account-info">
|
|
|
|
<section class="card">
|
|
<div class="row">
|
|
<span class="k">아이디</span>
|
|
<span class="v">{{ u.loginId || '-' }}</span>
|
|
</div>
|
|
<div class="row">
|
|
<span class="k">이름</span>
|
|
<span class="v">{{ u.name || '-' }}</span>
|
|
</div>
|
|
<div class="row">
|
|
<span class="k">이메일</span>
|
|
<span class="v">{{ u.email || '-' }}</span>
|
|
</div>
|
|
<div class="row">
|
|
<span class="k">가입유형</span>
|
|
<span class="v">{{ providerLabel }}</span>
|
|
</div>
|
|
<div class="row">
|
|
<span class="k">권한</span>
|
|
<span class="v">{{ roleLabel }}</span>
|
|
</div>
|
|
</section>
|
|
|
|
<button v-if="isLocal" type="button" class="primary-btn" @click="goEdit">정보변경</button>
|
|
<p v-else class="hint">소셜 로그인 계정은 앱에서 가입정보를 변경할 수 없습니다.</p>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.account-info {
|
|
max-width: 560px;
|
|
margin: 0 auto;
|
|
}
|
|
.back {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 0.3rem;
|
|
margin-bottom: 0.75rem;
|
|
padding: 0.3rem 0.1rem;
|
|
border: 0;
|
|
background: transparent;
|
|
color: var(--color-text);
|
|
opacity: 0.75;
|
|
cursor: pointer;
|
|
font-size: 0.9rem;
|
|
}
|
|
.back:hover {
|
|
opacity: 1;
|
|
}
|
|
.back svg {
|
|
width: 18px;
|
|
height: 18px;
|
|
}
|
|
.page-title {
|
|
font-size: 1.4rem;
|
|
margin-bottom: 1rem;
|
|
}
|
|
.card {
|
|
background: var(--color-background-soft);
|
|
border: 1px solid var(--color-border);
|
|
border-radius: 10px;
|
|
overflow: hidden;
|
|
}
|
|
.row {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 1rem;
|
|
padding: 0.95rem 1.1rem;
|
|
border-bottom: 1px solid var(--color-border);
|
|
}
|
|
.row:last-child {
|
|
border-bottom: 0;
|
|
}
|
|
.k {
|
|
font-size: 0.88rem;
|
|
opacity: 0.65;
|
|
}
|
|
.v {
|
|
font-size: 0.95rem;
|
|
font-weight: 600;
|
|
text-align: right;
|
|
word-break: break-all;
|
|
}
|
|
.primary-btn {
|
|
width: 100%;
|
|
margin-top: 1.25rem;
|
|
padding: 0.8rem 1rem;
|
|
border: 1px solid hsla(160, 100%, 37%, 1);
|
|
border-radius: 8px;
|
|
background: hsla(160, 100%, 37%, 1);
|
|
color: #fff;
|
|
font-size: 0.98rem;
|
|
font-weight: 600;
|
|
cursor: pointer;
|
|
}
|
|
.primary-btn:hover {
|
|
background: hsla(160, 100%, 32%, 1);
|
|
}
|
|
.hint {
|
|
margin-top: 1.25rem;
|
|
font-size: 0.85rem;
|
|
opacity: 0.6;
|
|
text-align: center;
|
|
}
|
|
</style>
|