diff --git a/hwe/ts/components/MessagePanel.vue b/hwe/ts/components/MessagePanel.vue index 3e05b278..b66aaa9b 100644 --- a/hwe/ts/components/MessagePanel.vue +++ b/hwe/ts/components/MessagePanel.vue @@ -173,6 +173,8 @@ import MessagePlate from "@/components/MessagePlate.vue"; import { useToast, BFormSelect } from "bootstrap-vue-3"; import { unwrap } from "@/util/unwrap"; import { isBrightColor } from "@/util/isBrightColor"; +import { getNewMsgToast } from "@/utilGame/getNewMsgToast"; +import { scrollToSelector } from "@/util/scrollToSelector"; const serverID = staticValues.serverID; const toasts = unwrap(useToast()); @@ -269,10 +271,20 @@ function _updateLatestMsg(msg: MsgItem) { toasts.remove(toastID); } const newToastID = toasts.show( - { - title: "새로운 개인 메시지", - body: "새로운 개인 메시지가 도착했습니다.", - }, + getNewMsgToast( + "새로운 개인 메시지", + "새로운 개인 메시지가 도착했습니다.", + (type, e)=>{ + if(type === 'goto'){ + scrollToSelector('.PrivateTalk > .stickyAnchor') + return; + } + if(type === 'ignore'){ + readLatestMsg('private'); + return; + } + } + ), { delay: 1000 * 60 * 10, variant: 'warning' @@ -292,10 +304,20 @@ function _updateLatestMsg(msg: MsgItem) { toasts.remove(toastID); } const newToastID = toasts.show( - { - title: "새로운 외교 메시지", - body: "새로운 외교 메시지가 도착했습니다.", - }, + getNewMsgToast( + "새로운 외교 메시지", + "새로운 외교 메시지가 도착했습니다.", + (type, e)=>{ + if(type === 'goto'){ + scrollToSelector('.DiplomacyTalk > .stickyAnchor') + return; + } + if(type === 'ignore'){ + readLatestMsg('diplomacy'); + return; + } + } + ), { delay: 1000 * 60 * 10, variant: 'warning' diff --git a/hwe/ts/utilGame/getNewMsgToast.ts b/hwe/ts/utilGame/getNewMsgToast.ts new file mode 100644 index 00000000..8cb099f1 --- /dev/null +++ b/hwe/ts/utilGame/getNewMsgToast.ts @@ -0,0 +1,21 @@ +import { BButton } from "bootstrap-vue-3"; +import type { ToastContent } from "bootstrap-vue-3/dist/components/BToast/plugin"; +import { h } from "vue"; + +type CallbackType = (type: "goto" | "ignore", e: MouseEvent) => void; + +export function getNewMsgToast(title: string, body: string, callback: CallbackType): ToastContent{ + const bodyNode = h( + "span", + null, + [ + body, + h(BButton, { variant: "primary", size: "sm", onClick: (e)=>{ callback('goto', e) } }, "보러가기"), + h(BButton, { variant: "secondary", size: "sm", onClick: (e)=>{ callback('ignore', e)} }, "이미읽음"), + ] + ); + return { + title, + body: bodyNode, + } +} \ No newline at end of file