프로젝트 참여자 관련 수정
This commit is contained in:
parent
86602d7ffe
commit
90d21869b3
@ -23,7 +23,7 @@
|
||||
<div class="d-flex flex-sm-row align-items-center pb-2">
|
||||
<i class="bx bxs-user"></i>
|
||||
<div class="ms-2">참여자</div>
|
||||
<UserList :projctSeq="projctSeq" :showOnlyActive="isProjectExpired" class="ms-8 mb-0" />
|
||||
<UserList ref="userListRef" :projctSeq="projctSeq" :showOnlyActive="true" class="ms-8 mb-0" />
|
||||
</div>
|
||||
<!-- 설명 -->
|
||||
<div class="d-flex flex-sm-row align-items-center pb-2">
|
||||
@ -110,11 +110,26 @@
|
||||
:is-essential="true"
|
||||
:is-label="true"
|
||||
:is-common="true"
|
||||
:is-color="true"
|
||||
:data="allColors"
|
||||
:value="selectedProject.PROJCTCOL"
|
||||
@update:data="selectedProject.PROJCTCOL = $event"
|
||||
/>
|
||||
|
||||
<div class="mb-2 row">
|
||||
<label class="col-md-2 col-form-label">
|
||||
참여자
|
||||
</label>
|
||||
<div class="col-md-10">
|
||||
<UserList class="m-0"
|
||||
ref="editUserListRef"
|
||||
:projctSeq="projctSeq"
|
||||
:showOnlyActive="false"
|
||||
@user-list-update="handleEditUserListUpdate"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<FormInput
|
||||
title="시작일"
|
||||
type="date"
|
||||
@ -161,7 +176,7 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { defineProps, onMounted, ref, computed, watch } from 'vue';
|
||||
import { defineProps, onMounted, ref, computed, watch, nextTick } from 'vue';
|
||||
import UserList from '@c/user/UserList.vue';
|
||||
import CenterModal from '@c/modal/CenterModal.vue';
|
||||
import $api from '@api';
|
||||
@ -230,6 +245,10 @@ const props = defineProps({
|
||||
projctCreatorId: {
|
||||
type: Number,
|
||||
required: false
|
||||
},
|
||||
resetUserSelection: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
});
|
||||
|
||||
@ -252,6 +271,20 @@ const originalColor = ref('');
|
||||
const nameAlert = ref(false);
|
||||
const user = ref(null);
|
||||
|
||||
const editUserListRef = ref(null);
|
||||
const userListRef = ref(null);
|
||||
|
||||
const selectedUsers = ref({
|
||||
activeUsers: [],
|
||||
disabledUsers: []
|
||||
});
|
||||
|
||||
// 사용자 목록 업데이트 핸들러
|
||||
const handleEditUserListUpdate = (userLists) => {
|
||||
selectedUsers.value = userLists;
|
||||
};
|
||||
|
||||
|
||||
const isProjectCreator = computed(() => {
|
||||
return user.value?.id === props.projctCreatorId;
|
||||
});
|
||||
@ -326,7 +359,7 @@ const closeModal = () => {
|
||||
};
|
||||
|
||||
// 수정 모달 열기
|
||||
const openEditModal = () => {
|
||||
const openEditModal = async () => {
|
||||
selectedProject.value = {
|
||||
PROJCTSEQ: props.projctSeq,
|
||||
PROJCTNAM: props.title,
|
||||
@ -342,6 +375,7 @@ const openEditModal = () => {
|
||||
|
||||
isEditModalOpen.value = true;
|
||||
originalColor.value = props.projctCol;
|
||||
|
||||
};
|
||||
|
||||
// 수정 모달 닫기
|
||||
@ -360,11 +394,17 @@ const closeEditModal = () => {
|
||||
};
|
||||
|
||||
isEditModalOpen.value = false;
|
||||
|
||||
// UserList의 resetSelection 메서드 호출
|
||||
if (editUserListRef.value) {
|
||||
editUserListRef.value.resetSelection();
|
||||
}
|
||||
};
|
||||
|
||||
// 변경된 내용 있는지 확인
|
||||
const hasChanges = computed(() => {
|
||||
return selectedProject.value.PROJCTNAM !== props.title ||
|
||||
// 기존 변경 확인 코드
|
||||
const basicChanges = selectedProject.value.PROJCTNAM !== props.title ||
|
||||
selectedProject.value.PROJCTSTR !== props.strdate ||
|
||||
selectedProject.value.PROJCTEND !== props.enddate ||
|
||||
selectedProject.value.PROJCTZIP !== props.addressZip ||
|
||||
@ -372,6 +412,11 @@ const hasChanges = computed(() => {
|
||||
selectedProject.value.PROJCTDTL !== props.addressdtail ||
|
||||
selectedProject.value.PROJCTDES !== props.description ||
|
||||
selectedProject.value.PROJCTCOL !== props.projctCol;
|
||||
|
||||
const userChanges = selectedUsers.value.activeUsers.length > 0 ||
|
||||
selectedUsers.value.disabledUsers.length > 0;
|
||||
|
||||
return basicChanges || userChanges;
|
||||
});
|
||||
|
||||
// 시작일 또는 종료일이 변경될 때 종료일의 최소값을 설정
|
||||
@ -385,9 +430,15 @@ watch(
|
||||
}
|
||||
);
|
||||
|
||||
// resetUserSelection 변경 감지
|
||||
watch(() => props.resetUserSelection, () => {
|
||||
if (editUserListRef.value) {
|
||||
editUserListRef.value.resetSelection();
|
||||
}
|
||||
});
|
||||
|
||||
// 프로젝트 수정
|
||||
const handleUpdate = () => {
|
||||
const handleUpdate = async () => {
|
||||
nameAlert.value = selectedProject.value.PROJCTNAM.trim() === '';
|
||||
|
||||
if (nameAlert.value) {
|
||||
@ -399,7 +450,9 @@ const handleUpdate = () => {
|
||||
return;
|
||||
}
|
||||
|
||||
$api.patch('project/update', {
|
||||
const disabledMemberSeqs = selectedUsers.value.disabledUsers.map(user => user.MEMBERSEQ);
|
||||
|
||||
const res = await $api.patch('project/update', {
|
||||
projctSeq: selectedProject.value.PROJCTSEQ,
|
||||
projctNam: selectedProject.value.PROJCTNAM,
|
||||
projctCol: selectedProject.value.PROJCTCOL,
|
||||
@ -411,17 +464,22 @@ const handleUpdate = () => {
|
||||
projctDes: selectedProject.value.PROJCTDES || null,
|
||||
projctUmb: user.value?.id,
|
||||
originalColor: originalColor.value === selectedProject.value.PROJCTCOL ? null : originalColor.value,
|
||||
}).then(res => {
|
||||
disabledMembers: disabledMemberSeqs
|
||||
});
|
||||
|
||||
if (res.status === 200) {
|
||||
toastStore.onToast('수정이 완료 되었습니다.', 's');
|
||||
|
||||
// 프로젝트 목록 새로고침
|
||||
await projectStore.getProjectList();
|
||||
await projectStore.getMemberProjects();
|
||||
|
||||
await editUserListRef.value.fetchProjectParticipation();
|
||||
await userListRef.value.fetchProjectParticipation();
|
||||
|
||||
closeEditModal();
|
||||
|
||||
projectStore.getProjectList();
|
||||
projectStore.getMemberProjects();
|
||||
|
||||
emit('update');
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 주소를 좌표로 변환하는 함수
|
||||
|
||||
@ -24,6 +24,7 @@
|
||||
:projctCol="post.PROJCTCOL"
|
||||
:projctColor="post.projctcolor"
|
||||
:projctCreatorId="post.PROJCTCMB"
|
||||
:resetUserSelection="resetUserSelection"
|
||||
@update="getProjectList"
|
||||
/>
|
||||
</div>
|
||||
@ -55,6 +56,19 @@
|
||||
@update:data="color = $event"
|
||||
/>
|
||||
|
||||
<div class="mb-2 row">
|
||||
<label class="col-md-2 col-form-label">
|
||||
참여자
|
||||
</label>
|
||||
<div class="col-md-10">
|
||||
<UserList
|
||||
ref="userListRef"
|
||||
@user-list-update="handleUserListUpdate"
|
||||
class="m-0"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<FormInput
|
||||
title="시작 일"
|
||||
name="startDay"
|
||||
@ -93,14 +107,14 @@
|
||||
</template>
|
||||
<template #footer>
|
||||
<BackButton type="reset" @click="closeCreateModal" />
|
||||
<SaveButton @click="handleCreate" />
|
||||
<SaveButton :disabled="!color" @click="handleCreate" />
|
||||
</template>
|
||||
</CenterModal>
|
||||
</form>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed, ref, watch, onMounted, inject } from 'vue';
|
||||
import { computed, ref, watch, onMounted, inject, nextTick } from 'vue';
|
||||
import SearchBar from '@c/search/SearchBar.vue';
|
||||
import ProjectCard from '@c/list/ProjectCard.vue';
|
||||
import CategoryBtn from '@/components/category/CategoryBtn.vue';
|
||||
@ -109,6 +123,7 @@
|
||||
import FormSelect from '@c/input/FormSelect.vue';
|
||||
import FormInput from '@c/input/FormInput.vue';
|
||||
import ArrInput from '@c/input/ArrInput.vue';
|
||||
import UserList from '@c/user/UserList.vue';
|
||||
import commonApi from '@/common/commonApi';
|
||||
import { useToastStore } from '@s/toastStore';
|
||||
import { useUserInfoStore } from '@/stores/useUserInfoStore';
|
||||
@ -126,6 +141,9 @@
|
||||
const selectedCategory = ref(null);
|
||||
const searchText = ref('');
|
||||
|
||||
const userListRef = ref(null);
|
||||
const resetUserSelection = ref(false);
|
||||
|
||||
// dayjs 인스턴스 가져오기
|
||||
const dayjs = inject('dayjs');
|
||||
|
||||
@ -149,6 +167,17 @@
|
||||
detailAddress: ''
|
||||
});
|
||||
|
||||
// 선택된 사용자 목록 관리
|
||||
const selectedUsers = ref({
|
||||
activeUsers: [],
|
||||
disabledUsers: []
|
||||
});
|
||||
|
||||
// UserList 컴포넌트에서 사용자 선택 업데이트 처리
|
||||
const handleUserListUpdate = (userLists) => {
|
||||
selectedUsers.value = userLists;
|
||||
};
|
||||
|
||||
// API 호출
|
||||
const { yearCategory, colorList } = commonApi({
|
||||
loadColor: true,
|
||||
@ -172,7 +201,7 @@
|
||||
|
||||
// 프로젝트 목록 조회
|
||||
const getProjectList = async () => {
|
||||
await projectStore.getProjectList(searchText.value, selectedYear.value);
|
||||
await projectStore.getProjectList(searchText.value, selectedYear.value, 'false');
|
||||
};
|
||||
|
||||
// 카테고리 변경 감지
|
||||
@ -187,11 +216,12 @@
|
||||
|
||||
const closeCreateModal = () => {
|
||||
isCreateModalOpen.value = false;
|
||||
resetUserSelection.value = !resetUserSelection.value;
|
||||
};
|
||||
|
||||
const formReset = () => {
|
||||
name.value = '';
|
||||
color.value = '';
|
||||
color.value = colorList.value.length > 0 ? colorList.value[0].value : '';
|
||||
addressData.value = {
|
||||
postcode: '',
|
||||
address: '',
|
||||
@ -201,8 +231,17 @@
|
||||
endDay.value = '';
|
||||
description.value = '';
|
||||
nameAlert.value = false;
|
||||
addressAlert.value = false;
|
||||
|
||||
selectedUsers.value = {
|
||||
activeUsers: [],
|
||||
disabledUsers: []
|
||||
};
|
||||
|
||||
if (userListRef.value) {
|
||||
userListRef.value.resetSelection();
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
// 등록 :: 주소 업데이트 핸들러
|
||||
const handleAddressUpdate = (data) => {
|
||||
@ -216,9 +255,9 @@
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
// 프로젝트 등록
|
||||
const handleCreate = async () => {
|
||||
|
||||
nameAlert.value = name.value.trim() === '';
|
||||
addressAlert.value = addressData.value.address.trim() === '';
|
||||
|
||||
@ -226,8 +265,10 @@
|
||||
return;
|
||||
}
|
||||
|
||||
$api.post('project/insert', {
|
||||
// 비활성화된 사용자 목록 생성
|
||||
const disabledMemberSeqs = selectedUsers.value.disabledUsers.map(user => user.MEMBERSEQ);
|
||||
|
||||
const response = await $api.post('project/insert', {
|
||||
projctNam: name.value,
|
||||
projctCol: color.value,
|
||||
projctStr: startDay.value,
|
||||
@ -237,15 +278,17 @@
|
||||
projctDtl: addressData.value.detailAddress,
|
||||
projctZip: addressData.value.postcode,
|
||||
projctCmb: user.value.id,
|
||||
}).then(res => {
|
||||
if (res.status === 200) {
|
||||
disabledMembers: disabledMemberSeqs
|
||||
});
|
||||
|
||||
if (response.status === 200) {
|
||||
toastStore.onToast('프로젝트가 등록되었습니다.', 's');
|
||||
closeCreateModal();
|
||||
getProjectList();
|
||||
projectStore.getMemberProjects();
|
||||
formReset();
|
||||
resetUserSelection.value = !resetUserSelection.value;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
onMounted(async () => {
|
||||
|
||||
@ -54,6 +54,28 @@ const props = defineProps({
|
||||
}
|
||||
});
|
||||
|
||||
const resetSelection = async () => {
|
||||
// 모든 사용자를 활성화 상태로 초기화
|
||||
if (props.projctSeq) {
|
||||
// 프로젝트 수정 모드일 경우
|
||||
userList.value = userList.value.map(user => ({
|
||||
...user,
|
||||
PROJCTYON: '1'
|
||||
}));
|
||||
|
||||
// 프로젝트 참여 정보 다시 가져오기
|
||||
await fetchProjectParticipation();
|
||||
} else {
|
||||
// 프로젝트 생성 모드일 경우
|
||||
userList.value = userList.value.map(user => ({
|
||||
...user,
|
||||
disabled: false // 모든 사용자 활성화
|
||||
}));
|
||||
}
|
||||
|
||||
emitUserListUpdate();
|
||||
};
|
||||
|
||||
// 활성화된 회원을 앞으로 정렬하는 computed 속성
|
||||
const sortedUserList = computed(() => {
|
||||
return [...userList.value].sort((a, b) => {
|
||||
@ -85,6 +107,7 @@ const fetchProjectParticipation = async () => {
|
||||
...user,
|
||||
PROJCTYON: projectMembers.find(pm => pm.MEMBERSEQ === user.MEMBERSEQ)?.PROJCTYON ?? '1'
|
||||
}));
|
||||
emitUserListUpdate();
|
||||
}
|
||||
}
|
||||
};
|
||||
@ -104,8 +127,9 @@ const fetchUserProjectPeriods = async () => {
|
||||
};
|
||||
|
||||
// projctSeq가 변경될 때마다 참여 기간 데이터 다시 불러오기
|
||||
watch(() => props.projctSeq, async (newVal) => {
|
||||
if (newVal) {
|
||||
watch(() => props.projctSeq, async (newVal, oldVal) => {
|
||||
if (newVal !== oldVal) {
|
||||
await fetchProjectParticipation();
|
||||
await fetchUserProjectPeriods();
|
||||
}
|
||||
}, { immediate: true });
|
||||
@ -118,6 +142,9 @@ onMounted(async () => {
|
||||
if (props.projctSeq) {
|
||||
await fetchProjectParticipation();
|
||||
await fetchUserProjectPeriods();
|
||||
} else {
|
||||
// projctSeq가 없는 경우, 초기 상태 emit
|
||||
emitUserListUpdate();
|
||||
}
|
||||
|
||||
nextTick(() => {
|
||||
@ -136,14 +163,14 @@ const initTooltips = () => {
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
// 사용자 비활성화 상태 확인
|
||||
const isUserDisabled = (user) => {
|
||||
return props.projctSeq ? user.PROJCTYON === '0' : user.disabled;
|
||||
};
|
||||
|
||||
// 클릭 시 활성화/비활성화 및 DB 업데이트
|
||||
// showOnlyActive가 true일 때는 toggleDisable 함수가 실행되지 않음
|
||||
const toggleDisable = async (index) => {
|
||||
// 사용자 선택 토글 (즉시 API 호출 없이 상태만 변경)
|
||||
const toggleDisable = (index) => {
|
||||
if (props.showOnlyActive) return;
|
||||
const user = displayedUserList.value[index];
|
||||
|
||||
@ -156,36 +183,15 @@ const toggleDisable = async (index) => {
|
||||
}
|
||||
|
||||
if (user) {
|
||||
const newParticipationStatus = props.projctSeq
|
||||
? user.PROJCTYON === '1'
|
||||
: !user.disabled;
|
||||
// 프로젝트 수정 모드인 경우
|
||||
if (props.projctSeq) {
|
||||
const response = await $api.patch('project/updateYon', {
|
||||
memberSeq: user.MEMBERSEQ,
|
||||
projctSeq: props.projctSeq,
|
||||
projctYon: newParticipationStatus ? '0' : '1'
|
||||
});
|
||||
if (response.status === 200) {
|
||||
// 원래 userList에서 해당 사용자를 찾아 업데이트
|
||||
const originalIndex = userList.value.findIndex(u => u.MEMBERSEQ === user.MEMBERSEQ);
|
||||
if (originalIndex !== -1) {
|
||||
userList.value[originalIndex].PROJCTYON = newParticipationStatus ? '0' : '1';
|
||||
user.PROJCTYON = user.PROJCTYON === '1' ? '0' : '1';
|
||||
} else {
|
||||
user.disabled = !user.disabled;
|
||||
}
|
||||
|
||||
// 변경 후 프로젝트 목록 새로고침
|
||||
const projectStore = useProjectStore();
|
||||
await projectStore.getProjectList('', '', 'true');
|
||||
await projectStore.getMemberProjects();
|
||||
}
|
||||
} else {
|
||||
// 원래 userList에서 해당 사용자를 찾아 업데이트
|
||||
const originalIndex = userList.value.findIndex(u => u.MEMBERSEQ === user.MEMBERSEQ);
|
||||
if (originalIndex !== -1) {
|
||||
userList.value[originalIndex].disabled = newParticipationStatus;
|
||||
emitUserListUpdate();
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// emit
|
||||
@ -216,5 +222,10 @@ const getTooltipTitle = (user) => {
|
||||
|
||||
return userName;
|
||||
};
|
||||
|
||||
defineExpose({
|
||||
resetSelection, fetchProjectParticipation
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
@ -10,12 +10,12 @@
|
||||
<ul class="navbar-nav flex-row align-items-center ms-auto">
|
||||
<select class="form-select py-1" id="name" v-model="selectedProject" @change="updateSelectedProject">
|
||||
<!-- 내가 참여하고 있는 프로젝트 그룹 -->
|
||||
<option v-for="item in myProjects" :key="item.PROJCTSEQ" :value="item.PROJCTSEQ">
|
||||
<option v-for="item in myActiveProjects" :key="item.PROJCTSEQ" :value="item.PROJCTSEQ">
|
||||
{{ item.PROJCTNAM }}
|
||||
</option>
|
||||
<!-- 전체 프로젝트 그룹 -->
|
||||
<!-- 내가 참여하지 않는 프로젝트 그룹 -->
|
||||
<option disabled>-----------</option>
|
||||
<option v-for="item in otherProjects" :key="item.PROJCTSEQ" :value="item.PROJCTSEQ">
|
||||
<option v-for="item in otherActiveProjects" :key="item.PROJCTSEQ" :value="item.PROJCTSEQ">
|
||||
{{ item.PROJCTNAM }}
|
||||
</option>
|
||||
</select>
|
||||
@ -262,28 +262,28 @@
|
||||
const user = ref(null);
|
||||
const selectedProject = ref(null);
|
||||
|
||||
// 내가 참여하고 있는 프로젝트 목록
|
||||
const myProjects = computed(() => {
|
||||
return projectStore.memberProjectList || [];
|
||||
// 내가 참여하고 있는 진행 중인 프로젝트 목록
|
||||
const myActiveProjects = computed(() => {
|
||||
return projectStore.activeMemberProjectList || [];
|
||||
});
|
||||
|
||||
// 내가 참여하고 있지 않은 프로젝트 목록
|
||||
const otherProjects = computed(() => {
|
||||
if (!projectStore.projectList || !projectStore.memberProjectList) return [];
|
||||
// 내가 참여하고 있지 않은 진행 중인 프로젝트 목록
|
||||
const otherActiveProjects = computed(() => {
|
||||
if (!projectStore.activeProjectList) return [];
|
||||
|
||||
// 내 프로젝트 ID 목록
|
||||
const myProjectIds = projectStore.memberProjectList.map(p => p.PROJCTSEQ);
|
||||
const myProjectIds = myActiveProjects.value.map(p => p.PROJCTSEQ);
|
||||
|
||||
// 내 프로젝트가 아닌 프로젝트만 필터링
|
||||
return projectStore.projectList.filter(p => !myProjectIds.includes(p.PROJCTSEQ));
|
||||
return projectStore.activeProjectList.filter(p => !myProjectIds.includes(p.PROJCTSEQ));
|
||||
});
|
||||
|
||||
// 프로젝트 선택 변경 시 스토어에 저장
|
||||
const updateSelectedProject = () => {
|
||||
if (!selectedProject.value) return;
|
||||
|
||||
// 전체 프로젝트 리스트에서 선택된 프로젝트 찾기
|
||||
const selected = projectStore.projectList.find(
|
||||
// 모든 진행 중인 프로젝트 리스트에서 선택된 프로젝트 찾기
|
||||
let selected = projectStore.activeProjectList.find(
|
||||
project => project.PROJCTSEQ === selectedProject.value
|
||||
);
|
||||
|
||||
@ -312,21 +312,21 @@
|
||||
await userStore.userInfo();
|
||||
user.value = userStore.user;
|
||||
|
||||
if (authStore.isAuthenticated) {
|
||||
await projectStore.getProjectList('', '', 'true');
|
||||
}
|
||||
|
||||
await projectStore.loadAllProjectLists();
|
||||
|
||||
// 사용자가 참여하고 있는 프로젝트 목록
|
||||
await projectStore.getMemberProjects();
|
||||
|
||||
|
||||
// 저장된 선택 프로젝트
|
||||
const storedProject = projectStore.getSelectedProject();
|
||||
if (storedProject) {
|
||||
selectedProject.value = storedProject.PROJCTSEQ;
|
||||
} else if (projectStore.memberProjectList.length > 0) {
|
||||
} else if (projectStore.activeMemberProjectList.length > 0) {
|
||||
// 저장된 선택 프로젝트가 없으면 첫 번째 참여 프로젝트 선택
|
||||
selectedProject.value = projectStore.memberProjectList[0].PROJCTSEQ;
|
||||
projectStore.setSelectedProject(projectStore.memberProjectList[0]);
|
||||
selectedProject.value = projectStore.activeMemberProjectList[0].PROJCTSEQ;
|
||||
projectStore.setSelectedProject(projectStore.activeMemberProjectList[0]);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
@ -9,15 +9,20 @@ import { defineStore } from 'pinia';
|
||||
import { ref, watch } from 'vue';
|
||||
import $api from '@api';
|
||||
import { useUserInfoStore } from '@/stores/useUserInfoStore';
|
||||
import { useAuthStore } from '@/stores/useAuthStore';
|
||||
|
||||
export const useProjectStore = defineStore('project', () => {
|
||||
const projectList = ref([]);
|
||||
const memberProjectList = ref([]);
|
||||
const projectList = ref([]); // 모든 프로젝트 (종료된 프로젝트 포함)
|
||||
const activeProjectList = ref([]); // 진행 중인 프로젝트만 (종료된 프로젝트 제외)
|
||||
const memberProjectList = ref([]); // 사용자가 속한 프로젝트
|
||||
const activeMemberProjectList = ref([]); // 사용자가 속한 진행 중인 프로젝트
|
||||
const selectedProject = ref(null);
|
||||
const userStore = useUserInfoStore();
|
||||
const authStore = useAuthStore();
|
||||
|
||||
// 전체 프로젝트 가져오기
|
||||
const getProjectList = async (searchText = '', selectedYear = '', excludeEnded = '') => {
|
||||
// 전체 프로젝트 가져오기 (종료된 프로젝트 포함 여부에 따라 다른 배열에 저장)
|
||||
const getProjectList = async (searchText = '', selectedYear = '', excludeEnded = 'false') => {
|
||||
if (!userStore.user) return;
|
||||
const res = await $api.get('project/select', {
|
||||
params: {
|
||||
searchKeyword: searchText || '',
|
||||
@ -25,7 +30,22 @@ export const useProjectStore = defineStore('project', () => {
|
||||
excludeEnded: excludeEnded
|
||||
},
|
||||
});
|
||||
|
||||
if (excludeEnded === 'true') {
|
||||
// 종료되지 않은 프로젝트만 저장
|
||||
activeProjectList.value = res.data.data.projectList;
|
||||
} else {
|
||||
// 모든 프로젝트 저장 (종료된 프로젝트 포함)
|
||||
projectList.value = res.data.data.projectList;
|
||||
}
|
||||
};
|
||||
|
||||
// 모든 프로젝트 목록 로드 (종료 여부 구분하여 모두 로드)
|
||||
const loadAllProjectLists = async (searchText = '', selectedYear = '') => {
|
||||
// 진행 중인 프로젝트 로드
|
||||
await getProjectList(searchText, selectedYear, 'true');
|
||||
// 모든 프로젝트 로드 (종료된 프로젝트 포함)
|
||||
await getProjectList(searchText, selectedYear, 'false');
|
||||
};
|
||||
|
||||
// 사용자가 속한 프로젝트 목록 가져오기
|
||||
@ -33,10 +53,16 @@ export const useProjectStore = defineStore('project', () => {
|
||||
if (!userStore.user) return; // 로그인한 사용자 확인
|
||||
|
||||
const res = await $api.get(`project/${userStore.user.id}`);
|
||||
memberProjectList.value = res.data.data;
|
||||
const allMemberProjects = res.data.data;
|
||||
memberProjectList.value = allMemberProjects;
|
||||
|
||||
if (memberProjectList.value.length > 0 && !selectedProject.value) {
|
||||
setSelectedProject(memberProjectList.value[0]);
|
||||
// 사용자가 속한 프로젝트 중 진행 중인 프로젝트만 필터링
|
||||
activeMemberProjectList.value = allMemberProjects.filter(project =>
|
||||
!project.ENDYN || project.ENDYN === 'N'
|
||||
);
|
||||
|
||||
if (activeMemberProjectList.value.length > 0 && !selectedProject.value) {
|
||||
setSelectedProject(activeMemberProjectList.value[0]);
|
||||
}
|
||||
};
|
||||
|
||||
@ -60,19 +86,19 @@ export const useProjectStore = defineStore('project', () => {
|
||||
};
|
||||
|
||||
// 프로젝트 리스트가 변경될 때 자동으로 반응
|
||||
watch(projectList, (newList) => {
|
||||
watch(activeProjectList, (newList) => {
|
||||
// 선택된 프로젝트가 없고 목록이 있는 경우
|
||||
if (!selectedProject.value && newList.length > 0) {
|
||||
// 사용자가 속한 프로젝트가 있는지 먼저 확인
|
||||
if (memberProjectList.value.length > 0) {
|
||||
setSelectedProject(memberProjectList.value[0]);
|
||||
if (activeMemberProjectList.value.length > 0) {
|
||||
setSelectedProject(activeMemberProjectList.value[0]);
|
||||
} else {
|
||||
setSelectedProject(newList[0]);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
watch(memberProjectList, (newList) => {
|
||||
watch(activeMemberProjectList, (newList) => {
|
||||
if (newList.length > 0) {
|
||||
// 현재 선택된 프로젝트가 없는 경우 첫 번째 항목 선택
|
||||
if (!selectedProject.value) {
|
||||
@ -88,14 +114,16 @@ export const useProjectStore = defineStore('project', () => {
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
return {
|
||||
projectList,
|
||||
projectList, // 종료된 프로젝트 포함한 모든 프로젝트
|
||||
activeProjectList, // 진행 중인 프로젝트만
|
||||
memberProjectList, // 사용자가 속한 모든 프로젝트
|
||||
activeMemberProjectList, // 사용자가 속한 진행 중인 프로젝트
|
||||
selectedProject,
|
||||
getProjectList,
|
||||
memberProjectList,
|
||||
loadAllProjectLists, // 모든 프로젝트 목록 한번에 로드
|
||||
getMemberProjects,
|
||||
setSelectedProject,
|
||||
getSelectedProject
|
||||
getSelectedProject,
|
||||
};
|
||||
});
|
||||
|
||||
Loading…
Reference in New Issue
Block a user