refactor: enhance DoubleBtnAlert and Header components with improved button handling and confirm dialog integration
This commit is contained in:
parent
b4e009cb8e
commit
778d3b6be8
@ -1,10 +1,19 @@
|
||||
'use client'
|
||||
|
||||
import { usePopupController } from '@/store/popupController'
|
||||
import React from 'react'
|
||||
|
||||
export default function DoubleBtnAlert() {
|
||||
const { alertMsg, alert2BtnYes, alert2BtnNo } = usePopupController()
|
||||
const { alertMsg, alert2BtnYes, alert2BtnNo, setAlert2 } = usePopupController()
|
||||
|
||||
const handleAlert2BtnYes = () => {
|
||||
alert2BtnYes()
|
||||
setAlert2(false)
|
||||
}
|
||||
|
||||
const handleAlert2BtnNo = () => {
|
||||
alert2BtnNo()
|
||||
setAlert2(false)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="modal-popup alert">
|
||||
@ -13,12 +22,12 @@ export default function DoubleBtnAlert() {
|
||||
<div className="alert-tit">{alertMsg}</div>
|
||||
<div className="alert-btn-wrap">
|
||||
<div className="alert-btn-bx">
|
||||
<button className="btn-frame red min" onClick={() => alert2BtnYes()}>
|
||||
<button className="btn-frame red min" onClick={() => handleAlert2BtnYes()}>
|
||||
確認
|
||||
</button>
|
||||
</div>
|
||||
<div className="alert-btn-bx">
|
||||
<button className="btn-frame n-blue min" onClick={() => alert2BtnNo()}>
|
||||
<button className="btn-frame n-blue min" onClick={() => handleAlert2BtnNo()}>
|
||||
キャンセル
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@ -14,6 +14,7 @@ import { useTitle } from '@/hooks/useTitle'
|
||||
import { axiosInstance } from '@/libs/axios'
|
||||
|
||||
import 'swiper/css'
|
||||
import { confirmParamsSerialize } from '@/utils/window'
|
||||
|
||||
export default function Header() {
|
||||
const router = useRouter()
|
||||
@ -38,6 +39,22 @@ export default function Header() {
|
||||
}
|
||||
}
|
||||
|
||||
const handleYes = () => {
|
||||
console.log('yes')
|
||||
}
|
||||
|
||||
const handleNo = () => {
|
||||
console.log('no')
|
||||
}
|
||||
|
||||
const handleCofirm = () => {
|
||||
window.neoConfirm(
|
||||
'よろしいですか?',
|
||||
() => console.log('yes'),
|
||||
() => console.log('no'),
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="header-warp">
|
||||
@ -45,7 +62,7 @@ export default function Header() {
|
||||
<div className="header-inner">
|
||||
{backBtn && (
|
||||
<div className="back-button-wrap">
|
||||
<button className="back-button" onClick={() => router.back()}></button>
|
||||
<button className="back-button" onClick={handleCofirm}></button>
|
||||
</div>
|
||||
)}
|
||||
<h2 className="logo">
|
||||
|
||||
@ -7,6 +7,12 @@ import { usePathname } from 'next/navigation'
|
||||
import { useEffect } from 'react'
|
||||
import { useSessionStore } from '@/store/session'
|
||||
|
||||
declare global {
|
||||
interface Window {
|
||||
neoConfirm: (msg?: string, alertBtn2Yes?: Function, alertBtn2No?: Function) => boolean
|
||||
}
|
||||
}
|
||||
|
||||
interface EdgeProviderProps {
|
||||
children: React.ReactNode
|
||||
sessionData: string
|
||||
@ -44,25 +50,18 @@ export default function EdgeProvider({ children, sessionData }: EdgeProviderProp
|
||||
setAlert2(true)
|
||||
}
|
||||
|
||||
//alert 함수 변경해서 바인딩
|
||||
useEffect(() => {
|
||||
//alert 함수 변경해서 바인딩
|
||||
window.alert = function (msg, alertBtn = () => setAlert(false)) {
|
||||
alertFunc(msg, alertBtn)
|
||||
}
|
||||
window.confirm = function (msg = '', alert2BtnYes = () => setAlert2(false), alert2BtnNo = () => setAlert2(false)) {
|
||||
alertFunc2(
|
||||
msg,
|
||||
() => {
|
||||
alert2BtnYes()
|
||||
return true
|
||||
},
|
||||
() => {
|
||||
alert2BtnNo()
|
||||
return false
|
||||
},
|
||||
)
|
||||
// confirm 함수 변경해서 바인딩
|
||||
window.neoConfirm = function (msg: string | undefined, alertBtn2Yes?: Function, alertBtn2No?: Function) {
|
||||
if (!msg) return false
|
||||
alertFunc2(msg, alertBtn2Yes || (() => {}), alertBtn2No || (() => {}))
|
||||
return false
|
||||
}
|
||||
// 서버 세션이 있으면 zuatand 세션 데이터 갱신
|
||||
if (sessionData && sessionData !== '') {
|
||||
setSession({
|
||||
...session,
|
||||
|
||||
7
src/utils/window.ts
Normal file
7
src/utils/window.ts
Normal file
@ -0,0 +1,7 @@
|
||||
export const confirmParamsSerialize = ({ msg, yes, no }: { msg: string; yes: () => void; no: () => void }) => {
|
||||
return JSON.stringify({ msg, yes, no })
|
||||
}
|
||||
|
||||
export const confirmParamsDeserialize = (params: string) => {
|
||||
return JSON.parse(params)
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user