/* 작성자 : 공현지 작성일 : 2025-01-17 수정자 : 박성용 수정일 : 2025-03-11 설명 : 공통 스크립트 */ import Quill from 'quill'; /* *템플릿 사용법 : $common.변수 *setup() 사용법 : const { appContext } = getCurrentInstance(); const $common = appContext.config.globalProperties.$common; or import { inject } from 'vue'; const $common = inject('common'); */ const common = { // JSON 문자열로 Delta 타입을 변환 contentToHtml(content) { try { if (content.startsWith('{') || content.startsWith('[')) { // Delta 형식으로 변환 const delta = JSON.parse(content); const quill = new Quill(document.createElement('div')); quill.setContents(delta); return quill.root.innerHTML; // HTML 반환 } return content; // 이미 HTML일 경우 그대로 반환 } catch (error) { console.error('콘텐츠 변환 오류:', error); return content; // 오류 발생 시 원본 반환 } }, // Delta 타입을 JSON 문자열로 변환 deltaAsJson(content) { if (content && content.ops) { return JSON.stringify(content.ops); // Delta 객체에서 ops 속성만 JSON 문자열로 변환 } console.error('잘못된 Delta 객체:', content); return null; // Delta 객체가 아니거나 ops가 없을 경우 null 반환 }, /** * Date 타입 문자열 포멧팅 * * @param {string} dateStr * @return * 1. Date type 인 경우 예시 '25-02-24 12:02' * 2. Date type 이 아닌 경우 입력값 리턴 * */ dateFormatter(dateStr) { const date = new Date(dateStr); const dateCheck = date.getTime(); if (isNaN(dateCheck)) { return dateStr; } else { const { year, month, day, hours, minutes } = this.formatDateTime(date); return `${year}-${month}-${day} ${hours}:${minutes}`; } }, formatDateTime(date) { const zeroFormat = num => (num < 10 ? `0${num}` : num); return { year: date.getFullYear(), month: zeroFormat(date.getMonth() + 1), day: zeroFormat(date.getDate()), hours: zeroFormat(date.getHours()), minutes: zeroFormat(date.getMinutes()), seconds: zeroFormat(date.getSeconds()), }; }, /** * 빈값 확인 * * @param {} obj * @returns */ isNotEmpty(obj) { if (obj === null || obj === undefined) return false; if (typeof obj === 'string' && obj.trim() === '') return false; if ((Array.isArray(obj) || obj === Object(obj)) && Object.keys(obj).length === 0) return false; 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; }, /** * 프로필 이미지 반환 * * @param { String } profileImg * @returns */ getProfileImage(profileImg, isAnonymous = false) { const defaultProfileImg = '/img/icons/icon.png'; // 기본 프로필 이미지 경로 const anonymousImg = '/img/avatars/default-Profile.jpg'; // 익명 이미지 let profileImgUrl = isAnonymous ? anonymousImg : defaultProfileImg; const UserProfile = `${import.meta.env.VITE_SERVER}upload/img/profile/${profileImg}`; return !profileImg || profileImg === '' ? profileImgUrl : UserProfile; }, setDefaultImage(event, deafultImg = '/img/icons/icon.png') { return (event.target.src = deafultImg); }, showImage(event) { return (event.target.style.visibility = 'visible'); }, }; export default { install(app) { app.config.globalProperties.$common = common; app.provide('common', common); }, };