localhost-front/src/views/voteboard/voteBoardList.vue

<template>
<div class="container-xxl flex-grow-1 container-p-y">
    <LoadingSpinner v-if="isLoading" />
    <div v-else class="row g-3">
    <div class="mt-8">
        <!-- 투표 작성  -->
        <WriteBtn @click="voteWrite"  />
        <!-- 투표마감/투표중  셀렉트 -->
        <FormSelect class="col-3" name="cate" :isLabel="false" title="투표상태" :data="categoryList" @update:data="category = $event" @change="selectHandler"/>
        <!-- 내가한 투표 보기  -->
        <div class="p-4">
            <div class="form-check">
            <input class="form-check-input" type="checkbox" value="" id="defaultCheck1" v-model="ischeked" @change="changeCheck">
            <label class="form-check-label" for="defaultCheck1"> 내가 한 투표 </label>
            </div>
        </div>

        <!-- 투표리스트 -->
        <div v-if="!voteListCardData" class="mt66"> ❌❌등록된 투표가 없습니다.❌❌</div>
        <vote-list
        :data="voteListCardData"
        @addContents="addContents"
        @checkedNames="checkedNames"
        @endVoteId="endVoteId"
        @voteEnded="voteEnded"
        @voteDelete="voteDelete"
        @updateVote="updateVote"
        @randomList="randomList"
        />
    </div>
    </div>
    <!-- 페이지네이션 -->
    <div class="row g-3">
        <div class="mt-8">
            <Pagination
                v-if="PageData.pages"
                v-bind="PageData"
                @update:currentPage="handlePageChange"
            />
        </div>
    </div>
</div>
</template>
<script setup>
import { getCurrentInstance, onMounted, ref } from 'vue';
import Pagination from '@c/pagination/Pagination.vue';
import FormSelect from '@c/input/FormSelect.vue';
import { useToastStore } from '@s/toastStore';
import QEditor from '@c/editor/QEditor.vue';
import $api from '@api';
import Quill from 'quill';
import WriteBtn from '@c/button/WriteBtn.vue';
import voteList from '@c/voteboard/voteCardList.vue';
import { useRouter } from 'vue-router';
import LoadingSpinner from "@v/LoadingPage.vue";
const isLoading = ref(true);

const toastStore = useToastStore();
const category = ref('0');
const categoryList = ['전체','투표마감','투표중'];
const PageData = ref([]);
const voteListCardData = ref([]);
const titleAlert = ref(false);
const addContent = ref('');
const currentPage = ref(1);
const voteset = ref(0);
const ischeked = ref(false);
const selectedVote = ref({}); // 선택된 투표 데이터
const router = useRouter();

onMounted(async () => {
    getvoteList();
});
//글작성
const voteWrite = () => {
    router.push('/voteboard/write');
};

const changeCheck = () =>{
    getvoteList();
}
//투표목록
const getvoteList = async () => {
    isLoading.value = true;
    const response = await $api.get('vote/getVoteList',{
        params:
        {
            page: currentPage.value
            ,voteset:voteset.value
            ,myVote:ischeked.value ? '1':'0'
        }
    });
    if (response.data.status === "OK") {
        PageData.value = response.data.data;
        voteListCardData.value = response.data.data.list;
        isLoading.value = false;
    }
};
const selectHandler = () =>{
    voteset.value = category.value;
    getvoteList();
}

//투표항목추가
const addContents = (itemList, voteId) => {
    $api.post('vote/insertWord',{
            itemList :itemList
            ,voteId :voteId
        }).then((res)=>{
            if(res.data.status === 'OK'){
                toastStore.onToast('항목이 등록되었습니다.', 's');
                getvoteList();
            }
        })
}
//투표하기
const checkedNames = (numList) => {
    $api.post('vote/insertCheckedNums',{
        checkedList :numList
        ,votenum : numList[0].LOCVOTSEQ
        }).then((res)=>{
            if(res.data.status === 'OK'){
                toastStore.onToast('투표가 완료되었습니다.', 's');
                getvoteList();
            }
        })
}
//투표종료
const endVoteId = (endVoteId) => {
    $api.patch('vote/updateEndData',{
        endVoteId :endVoteId
        }).then((res)=>{
            if(res.data.status === 'OK'){
                toastStore.onToast('투표가 종료되었습니다.', 's');
                getvoteList();
            }
        })
}
//기한 지난 투표 종료
const voteEnded = async (id) =>{
    await endVoteId(id.id);
}
//투표 삭제
const voteDelete =(id) =>{
    $api.patch('vote/updateDeleteData',{
        deleteVoteId :id
        }).then((res)=>{
            if(res.data.status === 'OK'){
                toastStore.onToast('투표가 삭제되었습니다.', 's');
                getvoteList();
            }
        })
}
//랜덤 1위 뽑기
const randomList = (data,id) =>{
    $api.post('vote/randomList',{
        randomList :data
        ,voteid:id
        }).then((res)=>{
            if(res.data.status === 'OK'){
                toastStore.onToast('랜덤뽑기 진행되었습니다.', 's');
                getvoteList();
            }
        })
}
//수정
const updateVote = (id) =>{
    const voteData = voteListCardData.value.find((item) => item.localVote.LOCVOTSEQ === id);
    selectedVote.value = voteData;
    voteWrite();
}
// 페이지 변경
const handlePageChange = async (page) => {
    currentPage.value=page;
    await getvoteList();
};
</script>
<style></style>