diff --git a/app/app.vue b/app/app.vue
index e5492cb..548c253 100644
--- a/app/app.vue
+++ b/app/app.vue
@@ -1,8 +1,5 @@
+
+
+
+
+
+
diff --git a/layers/components/blocks/modal/Alert.vue b/layers/components/blocks/modal/Alert.vue
new file mode 100644
index 0000000..d044349
--- /dev/null
+++ b/layers/components/blocks/modal/Alert.vue
@@ -0,0 +1,59 @@
+
+
+
+
+
+
+
+
+
+
+
emit('confirmButtonEvent'))"
+ >
+ {{ props.confirmButtonText || '확인' }}
+
+
+
+
+
+
+
diff --git a/layers/components/blocks/modal/Confirm.vue b/layers/components/blocks/modal/Confirm.vue
new file mode 100644
index 0000000..bf17a0a
--- /dev/null
+++ b/layers/components/blocks/modal/Confirm.vue
@@ -0,0 +1,66 @@
+
+
+
+
+
+
+
+
+
+
+
emit('cancelButtonEvent'))"
+ >
+ {{ props.cancelButtonText || '취소' }}
+
+
emit('confirmButtonEvent'))"
+ >
+ {{ props.confirmButtonText || '확인' }}
+
+
+
+
+
+
+
diff --git a/layers/components/blocks/modal/YouTube.vue b/layers/components/blocks/modal/YouTube.vue
index 83687db..d49f344 100644
--- a/layers/components/blocks/modal/YouTube.vue
+++ b/layers/components/blocks/modal/YouTube.vue
@@ -1,3 +1,52 @@
+
+
-
-
diff --git a/layers/stores/useModalStore.ts b/layers/stores/useModalStore.ts
index cc555d1..98e86b0 100644
--- a/layers/stores/useModalStore.ts
+++ b/layers/stores/useModalStore.ts
@@ -4,7 +4,6 @@ import type {
YoutubeParams,
} from '#layers/types/components/modal'
-// [TODO] 모달 상태 관리 개선
const createModalState = () => ({
storeIsOpen: ref(false),
storeIsShowDimmed: ref(false),
@@ -13,20 +12,8 @@ const createModalState = () => ({
storeContentText: ref(''),
storeConfirmButtonText: ref(''),
storeConfirmButtonEvent: skipHydrate(ref<() => void>(() => {})),
- storeCloseButtonEvent: skipHydrate(ref<() => void>(() => {})),
})
-const resetModalState = (type: ReturnType) => {
- type.storeIsOpen.value = false
- type.storeIsShowDimmed.value = false
- type.storeClassName.value = ''
- type.storeIsOutsideClose.value = true
- type.storeContentText.value = ''
- type.storeConfirmButtonText.value = ''
- type.storeConfirmButtonEvent.value = () => {}
- type.storeCloseButtonEvent.value = () => {}
-}
-
export const useModalStore = defineStore('modalStore', () => {
const scrollStore = useScrollStore()
@@ -41,8 +28,7 @@ export const useModalStore = defineStore('modalStore', () => {
isOutsideClose = true,
contentText,
confirmButtonText = '',
- confirmButtonEvent,
- closeButtonEvent,
+ confirmButtonEvent = () => {},
}: DialogParams) => {
alert.storeIsOpen.value = true
alert.storeIsShowDimmed.value = isShowDimmed
@@ -50,12 +36,7 @@ export const useModalStore = defineStore('modalStore', () => {
alert.storeContentText.value = contentText
alert.storeConfirmButtonText.value = confirmButtonText
alert.storeIsOutsideClose.value = isOutsideClose
- alert.storeConfirmButtonEvent.value = confirmButtonEvent ?? handleResetAlert
- alert.storeCloseButtonEvent.value = closeButtonEvent ?? handleResetAlert
- }
-
- const handleResetAlert = () => {
- resetModalState(alert)
+ alert.storeConfirmButtonEvent.value = confirmButtonEvent
}
// confirm ------------------
@@ -72,9 +53,8 @@ export const useModalStore = defineStore('modalStore', () => {
contentText,
confirmButtonText = '',
cancelButtonText = '',
- confirmButtonEvent,
- cancelButtonEvent,
- closeButtonEvent,
+ confirmButtonEvent = () => {},
+ cancelButtonEvent = () => {},
}: DialogParams) => {
confirm.storeIsOpen.value = true
confirm.storeIsShowDimmed.value = isShowDimmed
@@ -83,29 +63,26 @@ export const useModalStore = defineStore('modalStore', () => {
confirm.storeConfirmButtonText.value = confirmButtonText
confirm.storeCancelButtonText.value = cancelButtonText
confirm.storeIsOutsideClose.value = isOutsideClose
- confirm.storeConfirmButtonEvent.value =
- confirmButtonEvent ?? handleResetConfirm
- confirm.storeCancelButtonEvent.value =
- cancelButtonEvent ?? handleResetConfirm
- confirm.storeCloseButtonEvent.value = closeButtonEvent ?? handleResetConfirm
- }
-
- const handleResetConfirm = () => {
- resetModalState(confirm)
- confirm.storeCancelButtonText.value = ''
- confirm.storeCancelButtonEvent.value = () => {}
+ confirm.storeConfirmButtonEvent.value = confirmButtonEvent
+ confirm.storeCancelButtonEvent.value = cancelButtonEvent
}
// youtube ------------------
const youtube = {
storeIsOpen: ref(false),
storeYoutubeUrl: ref(''),
+ storeIsOutsideClose: ref(true),
storeClassName: ref(''),
}
- const handleOpenYoutube = ({ youtubeUrl, className = '' }: YoutubeParams) => {
+ const handleOpenYoutube = ({
+ youtubeUrl,
+ isOutsideClose = true,
+ className = '',
+ }: YoutubeParams) => {
youtube.storeIsOpen.value = true
youtube.storeYoutubeUrl.value = youtubeUrl
+ youtube.storeIsOutsideClose.value = isOutsideClose
youtube.storeClassName.value = className
scrollStore.controlScrollLock(true)
}
@@ -113,6 +90,7 @@ export const useModalStore = defineStore('modalStore', () => {
const handleResetYoutube = () => {
youtube.storeIsOpen.value = false
youtube.storeYoutubeUrl.value = ''
+ youtube.storeIsOutsideClose.value = true
youtube.storeClassName.value = ''
scrollStore.controlScrollLock(false)
}
@@ -123,8 +101,6 @@ export const useModalStore = defineStore('modalStore', () => {
youtube,
handleOpenAlert,
handleOpenConfirm,
- handleResetAlert,
- handleResetConfirm,
handleOpenYoutube,
handleResetYoutube,
}
diff --git a/layers/types/components/modal.ts b/layers/types/components/modal.ts
index b806da0..f2393c8 100644
--- a/layers/types/components/modal.ts
+++ b/layers/types/components/modal.ts
@@ -12,5 +12,6 @@ export interface DialogParams {
export interface YoutubeParams {
youtubeUrl: string
+ isOutsideClose?: boolean
className?: string
}
diff --git a/public/images/common/dark/Frame.svg b/public/images/common/dark/Frame.svg
deleted file mode 100644
index b4b0534..0000000
--- a/public/images/common/dark/Frame.svg
+++ /dev/null
@@ -1,13 +0,0 @@
-
diff --git a/public/images/common/dark/ic-v2-content-option-horizontal-fill.svg b/public/images/common/dark/ic-v2-content-option-horizontal-fill.svg
deleted file mode 100644
index 881b97d..0000000
--- a/public/images/common/dark/ic-v2-content-option-horizontal-fill.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/public/images/common/dark/ic-v2-control-arrow-right-line.svg b/public/images/common/dark/ic-v2-control-arrow-right-line.svg
deleted file mode 100644
index e4c5431..0000000
--- a/public/images/common/dark/ic-v2-control-arrow-right-line.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/public/images/common/dark/ic-v2-control-close-line.svg b/public/images/common/dark/ic-v2-control-close-line.svg
deleted file mode 100644
index d5c7b86..0000000
--- a/public/images/common/dark/ic-v2-control-close-line.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/public/images/common/dark/ic-v2-control-select-arrow-down-fill.svg b/public/images/common/dark/ic-v2-control-select-arrow-down-fill.svg
deleted file mode 100644
index 9ac3064..0000000
--- a/public/images/common/dark/ic-v2-control-select-arrow-down-fill.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/public/images/common/dark/ic-v2-control-web-link-line.svg b/public/images/common/dark/ic-v2-control-web-link-line.svg
deleted file mode 100644
index 5839161..0000000
--- a/public/images/common/dark/ic-v2-control-web-link-line.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-
diff --git a/public/images/common/dark/ic-v2-logo-apple-fill.svg b/public/images/common/dark/ic-v2-logo-apple-fill.svg
deleted file mode 100644
index ee4ad05..0000000
--- a/public/images/common/dark/ic-v2-logo-apple-fill.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-
diff --git a/public/images/common/dark/ic-v2-navigation-menu-bold-line.svg b/public/images/common/dark/ic-v2-navigation-menu-bold-line.svg
deleted file mode 100644
index 28d2b9c..0000000
--- a/public/images/common/dark/ic-v2-navigation-menu-bold-line.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/public/images/common/dark/ic-v2-stove-s-color.svg b/public/images/common/dark/ic-v2-stove-s-color.svg
deleted file mode 100644
index 38b72d2..0000000
--- a/public/images/common/dark/ic-v2-stove-s-color.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/public/images/common/light/Frame.svg b/public/images/common/light/Frame.svg
deleted file mode 100644
index 865f6de..0000000
--- a/public/images/common/light/Frame.svg
+++ /dev/null
@@ -1,13 +0,0 @@
-
diff --git a/public/images/common/light/ic-v2-content-option-horizontal-fill.svg b/public/images/common/light/ic-v2-content-option-horizontal-fill.svg
deleted file mode 100644
index 66c0abb..0000000
--- a/public/images/common/light/ic-v2-content-option-horizontal-fill.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/public/images/common/light/ic-v2-control-arrow-right-line.svg b/public/images/common/light/ic-v2-control-arrow-right-line.svg
deleted file mode 100644
index 020c548..0000000
--- a/public/images/common/light/ic-v2-control-arrow-right-line.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/public/images/common/light/ic-v2-control-close-line.svg b/public/images/common/light/ic-v2-control-close-line.svg
deleted file mode 100644
index e206cd8..0000000
--- a/public/images/common/light/ic-v2-control-close-line.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/public/images/common/light/ic-v2-control-select-arrow-down-fill.svg b/public/images/common/light/ic-v2-control-select-arrow-down-fill.svg
deleted file mode 100644
index bb226b8..0000000
--- a/public/images/common/light/ic-v2-control-select-arrow-down-fill.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/public/images/common/light/ic-v2-control-web-link-line.svg b/public/images/common/light/ic-v2-control-web-link-line.svg
deleted file mode 100644
index c51ccfe..0000000
--- a/public/images/common/light/ic-v2-control-web-link-line.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-
diff --git a/public/images/common/light/ic-v2-logo-apple-fill.svg b/public/images/common/light/ic-v2-logo-apple-fill.svg
deleted file mode 100644
index 0cdd2c5..0000000
--- a/public/images/common/light/ic-v2-logo-apple-fill.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-
diff --git a/public/images/common/light/ic-v2-navigation-menu-bold-line.svg b/public/images/common/light/ic-v2-navigation-menu-bold-line.svg
deleted file mode 100644
index cdf4f67..0000000
--- a/public/images/common/light/ic-v2-navigation-menu-bold-line.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/public/images/common/light/ic-v2-stove-s-color.svg b/public/images/common/light/ic-v2-stove-s-color.svg
deleted file mode 100644
index 38b72d2..0000000
--- a/public/images/common/light/ic-v2-stove-s-color.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-