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

<template>
<div class="container-xxl flex-grow-1 container-p-y">
    <div class="">
        <!-- 투표 작성  -->
        <WriteBtn @click="voteWrite"  />

        <!-- 투표마감/투표중  셀렉트 -->
        <div v-for="(item, index) in categoryList" @change="selectHandler"
            :key="index"
            class="form-check form-check-inline"  >
            <input class="form-check-input" type="radio" name="cate" :id="'inlineRadio' + index"
                    :value="index" v-model="category">
            <label class="form-check-label" :for="'inlineRadio' + index">{{ item }}</label>
        </div>

        <!-- 내가한 투표 보기  -->
        <div class="">
            <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.length == 0 " class="text-center">투표가 없습니다.</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"
                :currentPage="currentPage"
                @update:currentPage="handlePageChange"
        />
        </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';

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 = () =>{
    currentPage.value = 1;
    getvoteList();
}
//투표목록
const getvoteList = () => {
    $api.get('vote/getVoteList',{
            //목록조회시 파라미터 전달
            params:
            {
                page: currentPage.value
                ,voteset:voteset.value
                ,myVote:ischeked.value ? '1':'0'
            }
        }).then(res => {
            PageData.value = res.data.data;
            voteListCardData.value = res.data.data.list;
        })
    };

const selectHandler = () =>{
    currentPage.value = 1;
    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');
                    setTimeout(() => {
                        getvoteList();
                    }, 1000);
                }
        })
}
//수정
const updateVote = (id) =>{
    const voteData = voteListCardData.value.find((item) => item.localVote.LOCVOTSEQ === id);
    selectedVote.value = voteData;
    voteWrite();
}
// 페이지 변경
const handlePageChange = (page) => {
    currentPage.value=page;
    getvoteList();
};
</script>
<style></style>