feat: 일정 — 내 일정 필터 + 월간 '+N' 팝오버 + 필수표기/참석자 필수

- '내 일정' 토글 추가(참석자 기준: 전 직원 또는 참석자에 본인 포함). 주간/월간 공통
- 월간 '+N' 클릭 시 그날 전체 일정 팝오버(Teleport, 바깥클릭/ESC 닫기, 클릭→상세)
- 일정/카테고리 모달 필수 입력 표기(*) — 제목·유형·시작일·종료일·시간·참석자, 카테고리 이름
  (.form-label .req 전역 스타일 추가)
- 참석자 필수화(폼 검증: 전 직원 또는 1명 이상)
- 월간 일정바 두께 소폭 증가

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-06-23 13:33:52 +09:00
parent 4ff746638c
commit 511efec64d
6 changed files with 264 additions and 29 deletions
+56 -2
View File
@@ -150,6 +150,27 @@ async function onDeleteCategory(id: string): Promise<void> {
@update:model-value="store.setViewMode"
/>
<div class="spacer" />
<button
type="button"
class="mine-btn"
:class="{ on: store.mineOnly }"
:aria-pressed="store.mineOnly"
@click="store.toggleMineOnly()"
>
<svg
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
><circle
cx="12"
cy="8"
r="4"
/><path d="M6 21v-1a6 6 0 0 1 12 0v1" /></svg>
일정
</button>
<ScheduleTypeFilter
:categories="store.categories"
:counts="store.counts"
@@ -181,7 +202,7 @@ async function onDeleteCategory(id: string): Promise<void> {
<ScheduleTimeline
v-if="store.viewMode === 'week'"
:categories="store.categories"
:events="store.events"
:events="store.displayEvents"
:days="store.days"
:active-type-ids="store.activeTypeIds"
:sel-id="selId"
@@ -191,7 +212,7 @@ async function onDeleteCategory(id: string): Promise<void> {
<ScheduleMonthGrid
v-else
:weeks="store.monthWeeks"
:events="store.events"
:events="store.displayEvents"
:categories="store.categories"
:active-type-ids="store.activeTypeIds"
:sel-id="selId"
@@ -297,6 +318,39 @@ async function onDeleteCategory(id: string): Promise<void> {
.spacer {
flex: 1;
}
/* '내 일정' 토글 — 정렬/필터 pill 과 동일 외형, 활성 시 강조색 */
.mine-btn {
display: inline-flex;
align-items: center;
gap: 0.4375rem;
height: 2.25rem;
padding: 0 0.75rem;
border: 1px solid var(--border-strong);
border-radius: var(--radius);
background: #fff;
font-family: inherit;
font-size: 0.8125rem;
font-weight: 600;
color: var(--text-2);
cursor: pointer;
white-space: nowrap;
}
.mine-btn:hover {
background: #f9fafb;
}
.mine-btn svg {
width: 0.9375rem;
height: 0.9375rem;
color: var(--text-3);
}
.mine-btn.on {
border-color: var(--accent);
background: var(--accent-weak);
color: var(--accent);
}
.mine-btn.on svg {
color: var(--accent);
}
/* '새 일정' 버튼은 전역 .btn / .btn.primary 표준(다른 화면의 주요 버튼과 동일)을 그대로 사용 */
.content-row {
flex: 1;