공개페이지 수정

This commit is contained in:
2025-06-11 03:57:05 +09:00
parent bca24be143
commit e500024154
2 changed files with 23 additions and 42 deletions
+22 -39
View File
@@ -56,22 +56,18 @@
<!-- 신규 게스트 추가 입력폼 --> <!-- 신규 게스트 추가 입력폼 -->
<div v-if="selectedMember && selectedMember.isNewGuest" class="w-full border p-3 rounded bg-gray-50 mt-2"> <div v-if="selectedMember && selectedMember.isNewGuest" class="w-full border p-3 rounded bg-gray-50 mt-2">
<div class="mb-2"> <div class="mb-2">
<label>이름</label> <label>이름*</label>
<InputText v-model="newGuest.name" class="w-full" /> <InputText v-model="newGuest.name" class="w-full" />
</div> </div>
<div class="mb-2">
<label>성별*</label>
<Select v-model="newGuest.gender" :options="GENDER_OPTIONS" optionLabel="name" optionValue="value" placeholder="성별 선택" class="w-full" />
</div>
<div class="mb-2"> <div class="mb-2">
<label>연락처</label> <label>연락처</label>
<InputText v-model="newGuest.phone" class="w-full" /> <InputText v-model="newGuest.phone" class="w-full" />
</div> </div>
<div class="mb-2"> <Button label="게스트 추가" class="mt-1" @click="addNewGuest" :disabled="!newGuest.name || !newGuest.gender" />
<label>성별</label>
<Select v-model="newGuest.gender" :options="GENDER_OPTIONS" optionLabel="label" optionValue="value" placeholder="성별 선택" class="w-full" />
</div>
<div class="mb-2">
<label>에버리지</label>
<InputText v-model="newGuest.average" class="w-full" />
</div>
<Button label="게스트 추가" class="mt-1" @click="addNewGuest" :disabled="!newGuest.name || !newGuest.phone || !newGuest.gender" />
</div> </div>
</div> </div>
@@ -80,8 +76,8 @@
<label>참가 상태</label> <label>참가 상태</label>
<Select <Select
v-model="status" v-model="status"
:options="STATUS_OPTIONS" :options="PARTICIPANT_STATUS_OPTIONS"
optionLabel="label" optionLabel="name"
optionValue="value" optionValue="value"
placeholder="상태를 선택하세요" placeholder="상태를 선택하세요"
checkmark checkmark
@@ -89,13 +85,13 @@
/> />
<small v-if="submitted && !status" class="p-error">참가 상태를 선택해주세요.</small> <small v-if="submitted && !status" class="p-error">참가 상태를 선택해주세요.</small>
</div> </div>
<!-- 회비 납부 상태 --> <!-- 납부 상태 -->
<div class="flex-1 min-w-[200px]"> <div class="flex-1 min-w-[200px]">
<label>회비 납부 상태</label> <label>납부 상태</label>
<Select <Select
v-model="paymentStatus" v-model="paymentStatus"
:options="paymentStatusOptions" :options="PAYMENT_STATUS_OPTIONS"
optionLabel="label" optionLabel="name"
optionValue="value" optionValue="value"
placeholder="납부 상태를 선택하세요" placeholder="납부 상태를 선택하세요"
checkmark checkmark
@@ -119,13 +115,11 @@
<script setup> <script setup>
import { import {
STATUS_OPTIONS,
GENDER_OPTIONS, GENDER_OPTIONS,
PARTICIPANT_STATUS_OPTIONS,
PAYMENT_STATUS_OPTIONS, PAYMENT_STATUS_OPTIONS,
getGenderLabel, getGenderLabel,
getMemberTypeLabel, getMemberTypeLabel
getStatusLabel,
getPaymentStatusLabel
} from '@/utils/enumMappings'; } from '@/utils/enumMappings';
import { ref, computed, watch } from 'vue'; import { ref, computed, watch } from 'vue';
import Tag from 'primevue/tag'; import Tag from 'primevue/tag';
@@ -178,7 +172,7 @@ const memberOptions = computed(() => {
const nameB = b.name || ''; const nameB = b.name || '';
return nameA.localeCompare(nameB, 'ko'); return nameA.localeCompare(nameB, 'ko');
}); });
if (props.eventStatus === '준비') { if (props.eventStatus === 'ready') {
baseOptions.push({ name: '신규 게스트 추가', isNewGuest: true }); baseOptions.push({ name: '신규 게스트 추가', isNewGuest: true });
} }
return baseOptions; return baseOptions;
@@ -206,32 +200,22 @@ const paymentStatus = ref('');
const error = ref(''); const error = ref('');
const submitted = ref(false); const submitted = ref(false);
const statusOptions = [
{ label: getStatusLabel('참가예정'), value: '참가예정' },
{ label: getStatusLabel('참가확정'), value: '참가확정' },
{ label: getStatusLabel('취소'), value: '취소' }
];
const paymentStatusOptions = [
{ label: getPaymentStatusLabel('미납'), value: '미납' },
{ label: getPaymentStatusLabel('납부완료'), value: '납부완료' }
];
const newGuest = ref({ name: '', phone: '', gender: '' }); const newGuest = ref({ name: '', phone: '', gender: '' });
import PublicEventService from '@/services/PublicEventService'; import PublicEventService from '@/services/PublicEventService';
async function addNewGuest() { async function addNewGuest() {
error.value = ''; error.value = '';
if (!newGuest.value.name || !newGuest.value.phone || !newGuest.value.gender) { if (!newGuest.value.name || !newGuest.value.gender) {
error.value = '이름, 연락처, 성별을 모두 입력하세요.'; error.value = '이름, 성별을 모두 입력하세요.';
return; return;
} }
try { try {
// 실제 API 경로/파라미터는 상황에 맞게 수정 필요 // 실제 API 경로/파라미터는 상황에 맞게 수정 필요
const res = await PublicEventService.createGuest(props.publicHash, { const res = await PublicEventService.createGuest(props.publicHash, {
name: newGuest.value.name, name: newGuest.value.name,
phone: newGuest.value.phone, phone: newGuest.value.phone || null,
gender: newGuest.value.gender, gender: newGuest.value.gender
average: newGuest.value.average
}); });
if (!res || !res.data || !res.data.memberId) throw new Error('게스트 등록 실패'); if (!res || !res.data || !res.data.memberId) throw new Error('게스트 등록 실패');
@@ -242,8 +226,8 @@ async function addNewGuest() {
id: res.data.participantId, id: res.data.participantId,
participantId: res.data.participantId, participantId: res.data.participantId,
memberId: res.data.memberId, memberId: res.data.memberId,
status: res.data.status || '참가예정', // 참가 확정 상태 추가 status: res.data.status || 'pending', // 참가 확정 상태 추가
paymentStatus: res.data.paymentStatus || '미납', // 결제 상태 추가 paymentStatus: res.data.paymentStatus || 'unpaid', // 결제 상태 추가
Member: { Member: {
name: newGuest.value.name, name: newGuest.value.name,
gender: newGuest.value.gender, gender: newGuest.value.gender,
@@ -284,13 +268,12 @@ async function addNewGuest() {
selectedMemberId.value = guest.memberId; selectedMemberId.value = guest.memberId;
// 참가 상태와 회비 납부 상태 자동 선택 // 참가 상태와 회비 납부 상태 자동 선택
console.log(guest);
status.value = guest.status; status.value = guest.status;
paymentStatus.value = guest.paymentStatus; paymentStatus.value = guest.paymentStatus;
comment.value = guest.comment || ''; comment.value = guest.comment || '';
// 입력폼 초기화 // 입력폼 초기화
newGuest.value = { name: '', phone: '', gender: '', average: '' }; newGuest.value = { name: '', phone: '', gender: '' };
// 부모 컴포넌트에 이벤트 발생 // 부모 컴포넌트에 이벤트 발생
emits('guest-added', guest); emits('guest-added', guest);
+1 -3
View File
@@ -82,9 +82,7 @@ export const EVENT_TYPE_LABELS = EVENT_TYPE_OPTIONS.reduce(
export const PAYMENT_STATUS_OPTIONS = [ export const PAYMENT_STATUS_OPTIONS = [
{ name: '미납', value: 'unpaid' }, { name: '미납', value: 'unpaid' },
{ name: '납부완료', value: 'paid' }, { name: '납부완료', value: 'paid' }
{ name: '대기', value: 'pending' },
{ name: '취소', value: 'canceled' }
]; ];
export const PAYMENT_STATUS_LABELS = PAYMENT_STATUS_OPTIONS.reduce( export const PAYMENT_STATUS_LABELS = PAYMENT_STATUS_OPTIONS.reduce(
(acc, cur) => ({ ...acc, [cur.value]: cur.name }), (acc, cur) => ({ ...acc, [cur.value]: cur.name }),