Merge branch 'main' into board-ji

2025-03-11 10:34:51 +09:00 · 2025-03-11 10:34:51 +09:00 · ccc195435c
commit ccc195435c
parent 7ec6424667 23f39170da
7 changed files with 138 additions and 72 deletions
--- a/src/common/common.js
+++ b/src/common/common.js
@ -81,6 +81,34 @@ const common = {

        return true;
    },
+
+    /**
+     * 에디터에 내용이 있는지 확인
+     *
+     * @param { Quill } content
+     * @returns true: 값 없음, false: 값 있음
+     */
+    isNotValidContent(content) {
+        if (!content.value?.ops?.length) return true;
+
+        // 이미지 포함 여부 확인
+        const hasImage = content.value.ops.some(op => op.insert && typeof op.insert === 'object' && op.insert.image);
+        // 텍스트 포함 여부 확인
+        const hasText = content.value.ops.some(op => typeof op.insert === 'string' && op.insert.trim().length > 0);
+
+        // 텍스트 또는 이미지가 하나라도 있으면 유효한 내용
+        return !(hasText || hasImage);
+    },
+
+    /**
+     * 빈 값 확인
+     *
+     * @param {ref} text ex) inNotValidInput(data.value);
+     * @returns
+     */
+    isNotValidInput(text) {
+        return text.trim().length === 0;
+    },
 };

 export default {
--- a/src/components/category/CategoryBtn.vue
+++ b/src/components/category/CategoryBtn.vue
@ -31,7 +31,7 @@
 </template>

 <script setup>
-import { defineProps, ref } from 'vue';
+import { defineProps, ref, watch } from 'vue';

 // lists prop 정의
 const props = defineProps({
@ -43,21 +43,29 @@ const props = defineProps({
        type: Boolean,
        required: false,
    },
+    selectedCategory: {
+        type: [String, Number],
+        default: null,
+        required: false,
+    },
 });

 // 카테고리 선택
-const selectedCategory = ref(null);
-const emit = defineEmits();
+const selectedCategory = ref(props.selectedCategory);
+
+const emit = defineEmits(['update:data']);
 const selectCategory = (cate) => {
    selectedCategory.value = selectedCategory.value === cate ? null : cate;
    emit('update:data', selectedCategory.value);
 };
+
+watch(() => props.selectedCategory, (newVal) => {
+    selectedCategory.value = newVal;
+});
+
 </script>

-
 <style scoped>
-
-
@media (max-width: 768px) {
    .cate-list {
        overflow-x: scroll;
--- a/src/components/list/ProjectCard.vue
+++ b/src/components/list/ProjectCard.vue
@ -8,7 +8,7 @@
                        {{ title }}
                    </h5>
                    <p v-if="isProjectExpired" class="btn-icon btn-danger rounded-2"><i class='bx bx-power-off'></i></p>
-                    <div v-if="!isProjectExpired">
+                    <div v-if="!isProjectExpired" class="d-flex gap-1">
                        <EditBtn @click.stop="openEditModal" />
                        <DeleteBtn v-if="isProjectCreator" @click.stop="handleDelete" class="ms-1"/>
                    </div>
@ -128,6 +128,7 @@
                title="종료일"
                type="date"
                name="endDay"
+                :min="todays"
                :modelValue="selectedProject.PROJCTEND"
                @update:modelValue="selectedProject.PROJCTEND = $event"
            />
@ -160,7 +161,7 @@
 </template>

 <script setup>
-import { defineProps, onMounted, ref, computed, watch } from 'vue';
+import { defineProps, onMounted, ref, computed, watch, inject } from 'vue';
 import UserList from '@c/user/UserList.vue';
 import CenterModal from '@c/modal/CenterModal.vue';
 import $api from '@api';
@ -253,6 +254,12 @@ const isProjectCreator = computed(() => {
    return user.value?.id === props.projctCreatorId;
 });

+// dayjs 인스턴스 가져오기
+const dayjs = inject('dayjs');
+
+// 오늘 날짜를 YYYY-MM-DD 형식으로 변환
+const todays = dayjs().format('YYYY-MM-DD');
+
 // 프로젝트 만료 여부 체크 (종료일이 지났는지)
 const isProjectExpired = computed(() => {
    if (!props.enddate) return false;
@ -356,19 +363,6 @@ const hasChanges = computed(() => {
        selectedProject.value.PROJCTDES !== props.description ||
        selectedProject.value.PROJCTCOL !== props.projctCol;
 });
-// 종료일이 시작일보다 이전 날짜라면 종료일을 시작일로 맞추기
-watch(
-    () => selectedProject.value,
-    () => {
-        const start = new Date(selectedProject.value.PROJCTSTR);
-        const end = new Date(selectedProject.value.PROJCTEND);
-
-        if (end < start) {
-            selectedProject.value.PROJCTEND = selectedProject.value.PROJCTSTR;
-        }
-    },
-    { deep: true, flush: 'post' }
-);

 // 프로젝트 수정
 const handleUpdate = () => {
--- a/src/components/projectlist/ProjectList.vue
+++ b/src/components/projectlist/ProjectList.vue
@ -69,6 +69,7 @@
                    :type="'date'"
                    name="endDay"
                    :modelValue="endDay"
+                    :min = "today"
                    @update:modelValue="endDay = $event"
                />

--- a/src/components/voteboard/voteCard.vue
+++ b/src/components/voteboard/voteCard.vue
@ -24,9 +24,10 @@
                            <button
                            v-if="!data.localVote.LOCVOTDDT"
                            type="button"
-                            class="bx btn btn-danger"
+                            class="btn btn-label-danger btn-icon"
                            @click="endBtn(data.localVote.LOCVOTSEQ)"
-                            >종료</button>
+                            ><i class="bx bx-power-off"></i>
+                            </button>
                            <DeleteBtn v-if="!data.localVote.LOCVOTDDT" @click="voteDelete(data.localVote.LOCVOTSEQ)" />
                        </div>
                        <p v-if="data.localVote.LOCVOTDDT" class="btn-icon btn-danger rounded-2"><i class="bx bx-power-off"></i></p>
@ -104,7 +105,6 @@ voteEndDate.setDate(voteEndDate.getDate() + 1);
 const isVoteEnded = computed(() => {
    return currentDate > voteEndDate;
 });
-
 const emit = defineEmits(['addContents','checkedNames','endVoteId','voteEnded','randomList','voteDelete','updateVote']);
 onMounted(() => {
    if (isVoteEnded.value && !props.data.localVote.LOCVOTDDT) {
--- a/src/views/board/BoardEdit.vue
+++ b/src/views/board/BoardEdit.vue
@ -10,7 +10,15 @@
            <div class="col-xl-12">
                <div class="card-body">
                    <!-- 제목 입력 -->
-                    <FormInput title="제목" name="title" :is-essential="true" :is-alert="titleAlert" v-model="title" />
+                    <FormInput
+                        title="제목"
+                        name="title"
+                        :is-essential="true"
+                        :is-alert="titleAlert"
+                        v-model="title"
+                        @update:alert="titleAlert = $event"
+                        @input.once="validateTitle"
+                    />

                    <!-- 첨부파일 업로드 -->
                    <FormFile
@ -43,7 +51,6 @@
                        <label for="html5-tel-input" class="col-md-2 col-form-label">
                            내용
                            <span class="text-red">*</span>
-                            <div class="invalid-feedback" :class="contentAlert ? 'display-block' : ''">내용을 확인해주세요.</div>
                        </label>
                        <div class="col-md-12">
                            <QEditor
@ -53,6 +60,7 @@
                                :initialData="content"
                            />
                        </div>
+                        <div v-if="contentAlert" class="invalid-feedback d-block">내용을 확인해주세요.</div>
                    </div>

                    <!-- 버튼 -->
@ -74,10 +82,15 @@
    import QEditor from '@c/editor/QEditor.vue';
    import FormInput from '@c/input/FormInput.vue';
    import FormFile from '@c/input/FormFile.vue';
-    import { ref, onMounted, computed, watch } from 'vue';
+    import { ref, onMounted, computed, watch, inject } from 'vue';
    import { useRoute, useRouter } from 'vue-router';
+    import { useToastStore } from '@s/toastStore';
    import axios from '@api';

+    // 공통
+    const $common = inject('common');
+    const toastStore = useToastStore();
+
    // 상태 변수
    const title = ref('');
    const content = ref('');
@ -134,51 +147,18 @@
        router.push('/board');
    };

-    // 게시물 수정
-    const updateBoard = async () => {
-        // 유효성 검사
-        if (!title.value) {
-            titleAlert.value = true;
-            return;
-        }
-        titleAlert.value = false;
+    // 유효성 확인
+    const checkValidation = () => {
+        contentAlert.value = $common.isNotValidContent(content);
+        titleAlert.value = $common.isNotValidInput(title.value);

-        if (!content.value) {
-            contentAlert.value = true;
-            return;
-        }
-        contentAlert.value = false;
-
-        try {
-            // 수정 데이터 전송
-            const boardData = {
-                LOCBRDTTL: title.value,
-                LOCBRDCON: JSON.stringify(content.value),
-                LOCBRDSEQ: currentBoardId.value,
-            };
-
-            if (delFileIdx.value && delFileIdx.value.length > 0) {
-                boardData.delFileIdx = [...delFileIdx.value];
+        if (titleAlert.value || contentAlert.value || !isFileValid.value) {
+            if (titleAlert.value) {
+                title.value = '';
            }
-
-            const fileArray = newFileFilter(attachFiles);
-            const formData = new FormData();
-
-            Object.entries(boardData).forEach(([key, value]) => {
-                formData.append(key, value);
-            });
-
-            fileArray.forEach((file, idx) => {
-                formData.append('files', file);
-            });
-
-            await axios.put(`board/${currentBoardId.value}`, formData, { isFormData: true });
-
-            alert('게시물이 수정되었습니다.');
-            goList();
-        } catch (error) {
-            console.error('게시물 수정 중 오류 발생:', error);
-            alert('게시물 수정에 실패했습니다.');
+            return true;
+        } else {
+            return false;
        }
    };

@ -219,6 +199,60 @@
    };
    ////////////////// fileSection[E] ////////////////////

+    /** `content` 변경 감지하여 자동 유효성 검사 실행 */
+    watch(content, () => {
+        contentAlert.value = $common.isNotValidContent(content);
+    });
+
+    // 글 제목 유효성
+    const validateTitle = () => {
+        titleAlert.value = title.value.trim().length === 0;
+    };
+
+    /** `content` 변경 감지하여 자동 유효성 검사 실행 */
+    // watch(content, () => {
+    //     contentAlert.value = $common.isNotValidContent(content);
+    // });
+
+    // 게시물 수정
+    const updateBoard = async () => {
+        if (checkValidation()) return;
+
+        try {
+            // 수정 데이터 전송
+            const boardData = {
+                LOCBRDTTL: title.value.trim(),
+                LOCBRDCON: JSON.stringify(content.value),
+                LOCBRDSEQ: currentBoardId.value,
+            };
+
+            // 업로드 된 첨부파일의 삭제목록
+            if (delFileIdx.value && delFileIdx.value.length > 0) {
+                boardData.delFileIdx = [...delFileIdx.value];
+            }
+
+            const fileArray = newFileFilter(attachFiles);
+            const formData = new FormData();
+
+            // formData에 boardData 추가
+            Object.entries(boardData).forEach(([key, value]) => {
+                formData.append(key, value);
+            });
+
+            // formData에 새로 추가한 파일 추가
+            fileArray.forEach((file, idx) => {
+                formData.append('files', file);
+            });
+
+            await axios.put(`board/${currentBoardId.value}`, formData, { isFormData: true });
+            toastStore.onToast('게시물이 수정되었습니다.', 's');
+            goList();
+        } catch (error) {
+            console.error('게시물 수정 중 오류 발생:', error);
+            toastStore.onToast('게시물 수정에 실패했습니다.');
+        }
+    };
+
    // 컴포넌트 마운트 시 데이터 로드
    onMounted(() => {
        if (currentBoardId.value) {
--- a/src/views/wordDict/wordDict.vue
+++ b/src/views/wordDict/wordDict.vue
@ -9,7 +9,7 @@
            <DictAlphabetFilter @update:data="handleSelectedAlphabetChange" :indexCategory="indexCategory" :selectedAl="selectedAlphabet" />
            <!-- 카테고리 -->
            <div v-if="cateList.length">
-                <CategoryBtn :lists="cateList" @update:data="handleSelectedCategoryChange" :showAll="true"/>
+                <CategoryBtn :lists="cateList" @update:data="handleSelectedCategoryChange" :showAll="true" :selectedCategory="selectedCategory"  />
            </div>
            <!-- 작성 -->
            <div v-if="writeStore.isItemActive(999999)" class="mt-5 card p-5">
@ -108,7 +108,7 @@
    });

    const refreshWordList = () => {
-    getwordList(searchText.value, selectedAlphabet.value, selectedCategory.value);
+        getwordList(searchText.value, selectedAlphabet.value, selectedCategory.value);
    };

    //용어 목록
@ -205,6 +205,7 @@
                    }
                    getwordList();
                    getIndex();
+                    selectedCategory.value = 'all';
                    if(res.data.data == '2'){
                        const newCategory = { label: data, value: category };
                        cateList.value = [...cateList.value,newCategory];