From 1d9a3e452722f3ac36a2b26721c8843e252823be Mon Sep 17 00:00:00 2001 From: zenn Date: Tue, 12 May 2026 10:08:18 +0900 Subject: [PATCH] =?UTF-8?q?v0.0.87:=20=EC=A0=80=EC=9E=A5=C2=B7=EB=A1=9C?= =?UTF-8?q?=EA=B7=B8=EC=9D=B8=20=EB=B2=84=ED=8A=BC=20=EB=B9=84=ED=99=9C?= =?UTF-8?q?=EC=84=B1=20=EA=B8=B0=EB=B3=B8,=20=EA=B8=80=20=EB=AA=A9?= =?UTF-8?q?=EB=A1=9D=20=EC=82=AD=EC=A0=9C=20=EC=95=84=EC=9D=B4=EC=BD=98,?= =?UTF-8?q?=20=ED=91=B8=EC=8B=9C=20=EC=A7=80=EC=B9=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- AGENTS.md | 1 + docs/history.md | 6 ++++ docs/map.md | 10 +++--- docs/spec.md | 5 +++ docs/update.md | 7 +++++ package.json | 2 +- pages/admin/login.vue | 10 ++++-- pages/admin/navigation/index.vue | 29 ++++++++++++++++- pages/admin/posts/index.vue | 15 +++++++-- pages/admin/tags/index.vue | 53 ++++++++++++++++++++++++++++---- pages/signin.vue | 10 ++++-- 11 files changed, 129 insertions(+), 19 deletions(-) diff --git a/AGENTS.md b/AGENTS.md index cd058a8..556ea7e 100644 --- a/AGENTS.md +++ b/AGENTS.md @@ -122,6 +122,7 @@ - 작업이 끝나 변경사항을 커밋할 때마다 버전을 증가시킨다. - 버전은 `v0.0.1`, `v0.0.2`처럼 `v` 접두사를 포함해 순차 증가시킨다. - 원격 저장소에 푸시하기 전 민감 정보 포함 여부를 반드시 확인한다. +- 커밋까지 완료한 작업은 사용자가 중단을 요청하지 않는 한 `git push`로 원격에 반영해 푸시 누락을 피한다. 민감 정보 예시: - 실명 diff --git a/docs/history.md b/docs/history.md index 9f7fa85..89243d5 100644 --- a/docs/history.md +++ b/docs/history.md @@ -1,5 +1,11 @@ # 의사결정 이력 +## 2026-05-12 v0.0.87 + +### 저장·로그인 버튼 기본 비활성과 글 목록 삭제 아이콘 + +정렬 저장·메뉴 저장은 변경이 없을 때 연속 클릭이 의미 없으므로, 서버 스냅샷과 비교해 dirty일 때만 활성화한다. 로그인은 빈 제출을 막기 위해 필수 필드가 채워진 뒤에만 버튼을 켠다. 글 목록 삭제는 보조 액션이므로 텍스트 강조 대신 휴지통 아이콘과 낮은 기본 대비, 호버 시 강조로 시선 부담을 줄였다. + ## 2026-05-12 v0.0.86 ### 게시물 URL 로마자화와 태그 표기 분리 diff --git a/docs/map.md b/docs/map.md index 252f14e..cb6bbaf 100644 --- a/docs/map.md +++ b/docs/map.md @@ -73,8 +73,8 @@ | 파일 | 화면 | |------|------| | pages/admin/index.vue | 대시보드 | -| pages/admin/login.vue | 관리자 로그인 | -| pages/admin/posts/index.vue | 글 목록, 예약 발행 상태 표시 | +| pages/admin/login.vue | 관리자 로그인(이메일·비밀번호 모두 입력 시에만 제출 버튼 활성) | +| pages/admin/posts/index.vue | 글 목록, 예약 발행 상태 표시, 삭제는 휴지통 아이콘·기본 낮은 강조 | | pages/admin/posts/new.vue | 글 작성, Ghost 스타일 작성 폼, 저장 토스트 | | pages/admin/posts/[id].vue | 글 수정, Ghost 스타일 작성 폼, 저장/삭제 토스트 | | pages/admin/posts/preview.vue | 글 미리보기(공개 상세와 동일한 중앙 컬럼·수평 패딩) | @@ -82,8 +82,8 @@ | pages/admin/pages/new.vue | 페이지 작성, 저장 토스트 | | pages/admin/pages/[id].vue | 페이지 수정, 저장/삭제 토스트 | | pages/admin/media/index.vue | 미디어 관리, 폴더 트리, 복수 선택, 드래그 이동 | -| pages/admin/navigation/index.vue | 메뉴/네비게이션 관리 | -| pages/admin/tags/index.vue | 태그 관리(메인 태그 드래그 정렬·일반 강등, 일반 태그 검색/메인 전환/삭제), 액션 피드백 토스트 | +| pages/admin/navigation/index.vue | 메뉴/네비게이션 관리(변경 시에만 메뉴 저장 활성) | +| pages/admin/tags/index.vue | 태그 관리(메인 태그 드래그 정렬·일반 강등, 일반 태그 검색/메인 전환/삭제), 액션 피드백 토스트, 순서 변경 시에만 정렬 저장 활성 | | pages/admin/tags/new.vue | 태그 생성 | | pages/admin/tags/[id].vue | 태그 수정 | | pages/admin/settings/index.vue | 사이트 설정 + 관리자 프로필(썸네일/이름) + 관리자 비밀번호 변경 | @@ -102,7 +102,7 @@ | pages/tag/[slug].vue | 태그별 글 목록, 상단 태그 헤더 + 리스트형 게시물 카드 | | pages/pages/[slug].vue | 고정 페이지 상세 | | pages/signup.vue | 회원가입 3단계, 2단계 입력에 `auth-form-input`, 패널 `auth-signup__panel`(보더·배경) | -| pages/signin.vue | 로그인(다크 폼, `[color-scheme:dark]`, 입력 `auth-form-input`), 비밀번호 SVG 토글, 회원 로그인 API 연동 | +| pages/signin.vue | 로그인(다크 폼, `[color-scheme:dark]`, 입력 `auth-form-input`), 비밀번호 SVG 토글, 회원 로그인 API 연동, 이메일·비밀번호 입력 시에만 제출 버튼 활성 | | pages/settings/index.vue | 회원 설정(썸네일 미리보기/이미지 변경·제거, 닉네임 변경/중복확인, 비밀번호 변경, 회원 탈퇴) | ## 서버 API diff --git a/docs/spec.md b/docs/spec.md index c4bf648..9df5d61 100644 --- a/docs/spec.md +++ b/docs/spec.md @@ -403,10 +403,12 @@ components/content/ - `PUT /admin/api/members/:id/role` - 회원 권한 변경(`owner`/`admin`/`member`) > 글 발행/초안/비공개 전환은 현재 `PUT /admin/api/posts/:id`의 `status` 값으로 처리한다. +> 관리자 글 목록의 삭제 액션은 휴지통 아이콘으로 표시하며, 기본은 낮은 강조로 두고 호버 시에만 색·불투명도를 올린다. > 태그 삭제 시 `post_tags` 연결도 데이터베이스 외래 키 규칙에 따라 함께 삭제된다. > 공개 `GET /api/tags`는 `managed`(메인 태그)만 반환한다. > 관리자 태그 목록은 `managed` 우선, `sort_order ASC, name ASC` 기준으로 정렬한다. > 메인 태그 순서 저장은 드래그 순서를 받아 `sort_order`를 순차 값으로 다시 저장한다. +> 메인 태그 순서가 서버에서 불러온 순서와 같을 때는 `정렬 저장` 버튼이 비활성화된다. > 게시물 작성에서 새로 생기는 태그는 기본적으로 `general`(일반 태그)로 생성한다. > 메인 태그는 목록에서 `일반 태그로 변경` 액션으로 강등하며, 일반 태그 삭제는 검색 결과에서만 수행한다. > 태그 관리 화면에서 순서 저장·메인 전환·강등·삭제 등의 성공·실패 피드백은 우측 상단 토스트로 표시한다. @@ -518,6 +520,7 @@ components/content/ - 공개 왼쪽 사이드바의 상단 메뉴는 `primary` 위치 항목을 사용한다. - 공개 왼쪽 사이드바 하단 메뉴는 `footer` 위치 항목을 사용한다. - URL은 `/`로 시작하는 내부 경로 또는 `http://`, `https://` 외부 URL을 허용한다. +- 관리자 메뉴 관리 화면에서 저장 API로 보내는 필드 조합이 서버에서 불러온 직후와 동일하면 `메뉴 저장` 버튼이 비활성화된다. ### 관리자 인증 @@ -525,6 +528,7 @@ components/content/ - DB에 사용자가 없으면 `/signup`에서 관리자 등록 모드(관리자 이름/이메일/비밀번호/비밀번호 확인)로 첫 계정을 생성한다. - 첫 계정 생성 시 `is_admin=true`, `user_role=owner`를 자동 부여한다. - 관리자 로그인 성공 시 httpOnly 세션 쿠키를 `/admin` 경로에 설정한다. +- `/admin/login` 로그인 제출 버튼은 이메일·비밀번호가 모두 입력된 경우에만 활성화한다. - 관리자 로그인 성공 시 관리자/회원 세션 쿠키를 함께 설정해 관리자 화면에서도 프로필(썸네일, 이름) 수정 API를 공통으로 사용한다. - 관리자 설정 화면에서 관리자 프로필(이름, 썸네일)과 관리자 비밀번호를 수정할 수 있다. - 관리자 멤버 화면에서 권한은 `소유자(owner)`, `관리자(admin)`, `멤버(member)` 3단계로 표시하고 변경할 수 있다. @@ -534,6 +538,7 @@ components/content/ ### 회원 인증 - 회원 인증은 `users` 테이블의 이메일/비밀번호(bcrypt 해시) 기반으로 처리한다. +- `/signin` 로그인 제출 버튼은 이메일·비밀번호가 모두 입력된 경우에만 활성화한다. - 로그인 성공 시 httpOnly 세션 쿠키(`sori_member_session`)를 `/` 경로에 설정한다. - 회원 API(`POST /api/auth/signup`, `POST /api/auth/login`, `GET /api/auth/me`, `POST /api/auth/logout`)로 세션을 관리한다. - 첫 회원가입 시 관리자 세션도 함께 설정되어 관리자 화면(`/admin`)으로 바로 진입할 수 있다. diff --git a/docs/update.md b/docs/update.md index f699812..d26a36a 100644 --- a/docs/update.md +++ b/docs/update.md @@ -1,5 +1,12 @@ # 업데이트 이력 +## v0.0.87 + +- 메인 태그 `정렬 저장`·메뉴 `메뉴 저장`은 서버에서 받은 상태와 비교해 변경이 있을 때만 버튼이 활성화되도록 조정. +- 관리자 로그인·회원 로그인(`signin`) 제출 버튼은 이메일·비밀번호가 모두 입력된 경우에만 활성화. +- 관리자 글 목록의 삭제는 휴지통 아이콘으로 바꾸고, 기본은 낮은 불투명도·호버 시에만 강조. +- `AGENTS.md`에 커밋 후 원격 반영 시 `git push` 생략 방지 지침을 추가. + ## v0.0.86 - 관리자 게시물 미리보기 본문 영역을 공개 상세와 동일한 `max-w-[720px]`·좌우 패딩으로 감싸 여백을 맞춤. diff --git a/package.json b/package.json index c40877e..403b522 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "sori.studio", - "version": "0.0.86", + "version": "0.0.87", "private": true, "type": "module", "imports": { diff --git a/pages/admin/login.vue b/pages/admin/login.vue index 0b424f6..c66c460 100644 --- a/pages/admin/login.vue +++ b/pages/admin/login.vue @@ -10,6 +10,12 @@ const form = reactive({ const pending = ref(false) const errorMessage = ref('') + +/** + * 로그인 제출 가능 여부(이메일·비밀번호가 모두 채워졌는지) + * @returns {boolean} 제출 가능 여부 + */ +const canSubmitAdminLogin = computed(() => Boolean(form.email.trim()) && Boolean(form.password)) const { data: bootstrapStatus } = await useFetch('/api/auth/bootstrap-status', { default: () => ({ hasUsers: true, @@ -83,9 +89,9 @@ const submitLogin = async () => { {{ errorMessage }}

diff --git a/pages/admin/navigation/index.vue b/pages/admin/navigation/index.vue index 3e7d13d..7efbdec 100644 --- a/pages/admin/navigation/index.vue +++ b/pages/admin/navigation/index.vue @@ -14,6 +14,28 @@ const { data: navigationItems } = await useFetch('/admin/api/navigation', { const items = ref(navigationItems.value.map((item) => ({ ...item }))) +/** + * 네비게이션 항목을 저장 API와 동일한 형태로 직렬화한다. + * @param {Array} list - 항목 목록 + * @returns {string} 비교용 JSON 문자열 + */ +const serializeNavigationItems = (list) => JSON.stringify(list.map((item) => ({ + label: String(item.label || '').trim(), + url: String(item.url || '').trim(), + location: item.location, + sortOrder: Number(item.sortOrder || 0), + isVisible: Boolean(item.isVisible) +}))) + +/** 서버에서 불러온 네비게이션 직렬화 스냅샷 */ +const navigationBaseline = ref(serializeNavigationItems(items.value)) + +/** + * 현재 편집본이 서버 스냅샷과 다른지 여부 + * @returns {boolean} 변경 여부 + */ +const isNavigationDirty = computed(() => serializeNavigationItems(items.value) !== navigationBaseline.value) + /** * 저장 상태 토스트 표시 * @param {'success'|'error'|'info'} type - 토스트 타입 @@ -58,6 +80,10 @@ const removeNavigationItem = (index) => { * @returns {Promise} 저장 결과 */ const saveNavigation = async () => { + if (saving.value || !isNavigationDirty.value) { + return + } + saving.value = true errorMessage.value = '' showToast('info', '네비게이션을 저장하는 중입니다.') @@ -77,6 +103,7 @@ const saveNavigation = async () => { }) items.value = savedItems.map((item) => ({ ...item })) + navigationBaseline.value = serializeNavigationItems(items.value) showToast('success', '네비게이션이 저장되었습니다.') } catch (error) { errorMessage.value = error?.data?.message || '네비게이션을 저장하지 못했습니다.' @@ -184,7 +211,7 @@ onBeforeUnmount(() => { diff --git a/pages/admin/posts/index.vue b/pages/admin/posts/index.vue index 0126b1d..1477348 100644 --- a/pages/admin/posts/index.vue +++ b/pages/admin/posts/index.vue @@ -148,12 +148,23 @@ const deletePost = async (post) => { diff --git a/pages/admin/tags/index.vue b/pages/admin/tags/index.vue index fc33c8c..4e783c2 100644 --- a/pages/admin/tags/index.vue +++ b/pages/admin/tags/index.vue @@ -21,6 +21,47 @@ const { data: tags, refresh } = await useFetch('/admin/api/tags', { const managedTags = computed(() => tags.value.filter((tag) => tag.tagType === 'managed')) +/** 서버 기준 메인 태그 id 순서(정렬 저장 버튼 활성 비교용) */ +const baselineManagedTagIds = ref([]) + +/** + * 서버와 동기화된 메인 태그 순서를 기준선으로 저장한다. + * @returns {void} + */ +const resetManagedOrderBaseline = () => { + baselineManagedTagIds.value = managedTags.value.map((tag) => tag.id) +} + +/** + * 태그 목록을 다시 불러온 뒤 메인 태그 순서 기준선을 맞춘다. + * @returns {Promise} + */ +const refreshTagsFromServer = async () => { + await refresh() + resetManagedOrderBaseline() +} + +resetManagedOrderBaseline() + +/** + * 메인 태그 드래그 순서가 기준선과 다른지 여부 + * @returns {boolean} 변경 여부 + */ +const isManagedOrderDirty = computed(() => { + const currentIds = managedTags.value.map((tag) => tag.id) + const base = baselineManagedTagIds.value + + if (!currentIds.length) { + return false + } + + if (currentIds.length !== base.length) { + return true + } + + return currentIds.some((id, index) => id !== base[index]) +}) + /** * 피드백 토스트 표시 * @param {'success'|'error'|'info'} type - 토스트 타입 @@ -114,7 +155,7 @@ const handleDrop = (event, targetId) => { * @returns {Promise} */ const saveManagedOrder = async () => { - if (savingOrder.value || managedTags.value.length === 0) { + if (savingOrder.value || managedTags.value.length === 0 || !isManagedOrderDirty.value) { return } @@ -129,7 +170,7 @@ const saveManagedOrder = async () => { }) tags.value = [...reordered] - await refresh() + await refreshTagsFromServer() showToast('success', '메인 태그 순서가 저장되었습니다.') } catch (error) { showToast('error', error?.data?.message || '정렬 순서를 저장하지 못했습니다.') @@ -190,7 +231,7 @@ const promoteToMainTag = async (tag) => { tagType: 'managed' } }) - await refresh() + await refreshTagsFromServer() await searchGeneralTags() showToast('success', `"${tag.name}" 태그를 메인 태그로 전환했습니다.`) } catch (error) { @@ -224,7 +265,7 @@ const demoteToGeneralTag = async (tag) => { tagType: 'general' } }) - await refresh() + await refreshTagsFromServer() await searchGeneralTags() showToast('success', `"${tag.name}" 태그를 일반 태그로 변경했습니다.`) } catch (error) { @@ -250,7 +291,7 @@ const deleteGeneralTag = async (tag) => { await $fetch(`/admin/api/tags/${tag.id}`, { method: 'DELETE' }) - await refresh() + await refreshTagsFromServer() await searchGeneralTags() showToast('success', `"${tag.name}" 일반 태그를 삭제했습니다.`) } catch (error) { @@ -291,7 +332,7 @@ onBeforeUnmount(() => {