koishi-plugin-chat-patch 3.0.2 → 5.0.1

package/client/web/src/components/msg-component/JsonSegComp.vue

@@ -0,0 +1,138 @@
+<!--
+ * @FileDescription: 卡片消息消息组件
+ * @Author: Stapxs
+ * @Date: 2023/05/23
+ *        2026/02/13
+ * @Version: 1.0 - 初始版本
+ *           2.0 - 重构为单独组件
+-->
+
+<template>
+    <template v-if="comp">
+        <component :is="comp" :id="id" :data="data" />
+    </template>
+    <div v-else-if="genericCard" class="msg-json generic-card" @click="openGenericCard(genericCard.url)">
+        <img v-if="genericCard.img" :src="genericCard.img" alt="">
+        <div>
+            <p>{{ genericCard.title }}</p>
+            <span v-if="genericCard.desc">{{ genericCard.desc }}</span>
+            <small v-if="genericCard.tag">{{ genericCard.tag }}</small>
+        </div>
+    </div>
+    <span v-else class="msg-unknown">{{
+        '( ' + $t('不支持的卡片类型') + ': ' + id + ' )'
+    }}</span>
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue'
+import { openLink } from '../../function/utils/appUtil'
+
+const comps = import.meta.glob('./jsonComp/*.vue', {
+    eager: true,
+    import: 'default',
+})
+
+const cardComponentMap = {
+    'com.tencent.tuwen.lua': comps['./jsonComp/Tuwen.lua.vue'],
+    'com.tencent.mannounce': comps['./jsonComp/Mannounce.vue'],
+    'com.tencent.miniapp.lua': comps['./jsonComp/Miniapp.lua.vue'],
+    'com.tencent.miniapp_01': comps['./jsonComp/Miniapp.vue'],
+    'com.tencent.music.lua': comps['./jsonComp/Music.lua.vue'],
+    'com.tencent.contact.lua': comps['./jsonComp/Contact.lua.vue'],
+    'com.tencent.map': comps['./jsonComp/Map.vue'],
+    'com.tencent.forum': comps['./jsonComp/Forum.vue'],
+    'com.tencent.autoreply': comps['./jsonComp/AutoReply.vue'],
+    'com.tencent.feed.lua': comps['./jsonComp/Feed.lua.vue'],
+}
+
+const { data } = defineProps<{
+    data: string,
+}>()
+
+let json: unknown
+let id = ''
+
+try {
+    json = JSON.parse(data)
+    if (json && typeof (json as any).app === 'string') {
+        id = (json as any).app
+    }
+} catch {
+    json = null
+    id = ''
+}
+
+const comp = cardComponentMap[id]
+
+function getString(value: unknown): string {
+    return typeof value === 'string' ? value : ''
+}
+
+const genericCard = computed(() => {
+    if (comp || !json || typeof json !== 'object' || Array.isArray(json)) return undefined
+    const root = json as Record<string, unknown>
+    const meta = root.meta
+    if (typeof meta !== 'object' || meta === null) return undefined
+    const metaList = Object.values(meta as Record<string, unknown>)
+    for (const value of metaList) {
+        if (typeof value !== 'object' || value === null || Array.isArray(value)) continue
+        const card = value as Record<string, unknown>
+        const title = getString(card.title) || getString(card.name) || getString(card.nickname)
+        const desc = getString(card.desc)
+            || getString(card.summary)
+            || getString(card.content)
+            || getString(card.address)
+        const img = getString(card.preview)
+            || getString(card.avatar)
+            || getString(card.cover)
+            || getString(card.img)
+        if (!title && !desc && !img) continue
+        return {
+            title,
+            desc,
+            img,
+            tag: getString(card.tag) || getString(card.source) || getString(root.desc),
+            url: getString(card.jumpUrl) || getString(card.url) || getString(card.qqdocurl),
+        }
+    }
+    return undefined
+})
+
+function openGenericCard(url: string) {
+    if (url) openLink(url)
+}
+</script>
+
+<style scoped>
+    .generic-card {
+        display: flex;
+        align-items: center;
+        gap: 12px;
+        cursor: pointer;
+    }
+    .generic-card img {
+        width: 48px;
+        height: 48px;
+        border-radius: 7px;
+        object-fit: cover;
+        flex-shrink: 0;
+    }
+    .generic-card > div {
+        min-width: 0;
+    }
+    .generic-card p {
+        margin: 0;
+        font-weight: bold;
+    }
+    .generic-card span,
+    .generic-card small {
+        display: block;
+        margin-top: 4px;
+        font-size: 0.8rem;
+        opacity: 0.7;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+</style>

package/client/web/src/components/msg-component/XmlSegComp.vue

@@ -0,0 +1,132 @@
+<!--
+ * @FileDescription: 卡片消息消息组件
+ * @Author: Mr.Lee
+ * @Date: 2026/02/13
+ * @Version: 1.0 - 从CardMsgComp拆分出来
+-->
+
+<template>
+    <div
+        ref="main"
+        @click="cardClick()"
+        v-html="buildXML(item, id, id)" />
+</template>
+
+<script setup lang="ts">
+import { Logger } from '../../function/base';
+import { openLink } from '../../function/utils/appUtil'
+import app from '../../main'
+import { useTemplateRef } from 'vue'
+
+const { item, id } = defineProps<{
+    item: string,
+    id: string,
+}>()
+
+const mainDom = useTemplateRef('main')
+
+let link: string | undefined = undefined
+
+/**
+ * 尝试解析渲染 XML 消息
+ * @param xml 原始的 XML 消息内容
+ * @param id  XML 消息 ID（暂时不知道有什么用）
+ * @param msgid 消息 ID
+ * @returns 处理完成的 HTML 代码
+ */
+function buildXML(xml: string, id: string, msgid: string) {
+    const $t = app.config.globalProperties.$t
+    try {
+        // <msg> 标签内的为本体
+        let item = xml.substring(xml.indexOf('<item'), xml.indexOf('</msg>'))
+        // 尝试转换标签为 html
+        // item = item.replaceAll('/>', '>')
+        item = item.replaceAll('item', 'div') // item
+        item = item.replaceAll('<div', '<div class="msg-xml"')
+        item = item.replaceAll('title', 'p') // title
+        item = item.replaceAll('summary', 'a') // summary
+        item = item.replaceAll('<a', '<a class="msg-xml-summary"')
+        item = item.replaceAll('<picture', '<img class="msg-xml-img"') // picture
+        // 将不正确的参数改为 dataset
+        item = item.replaceAll('size=', 'data-size=')
+        item = item.replaceAll('linespace=', 'data-linespace=')
+        item = item.replaceAll('cover=', 'src=')
+        // 处理出处标签
+        item = item.replace('source name=', 'source data-name=')
+        // 处理错误的 style 位置
+        const div = document.createElement('div')
+        div.id = 'xml-' + msgid
+        div.dataset.id = id
+        div.innerHTML = item
+        for (const element of div.children[0].children) {
+            if (element.nodeName === 'P') {
+                const pBody = element as HTMLParagraphElement
+                pBody.style.fontSize =
+                    (Number(pBody.dataset.size) / 30).toString() + 'rem'
+                pBody.style.marginBottom = Number(pBody.dataset.size) / 5 + 'px'
+                break
+            }
+        }
+        // 解析 msg 消息体
+        let msgHeader =
+            xml.substring(xml.indexOf('<msg'), xml.indexOf('<item')) + '</msg>'
+        msgHeader = msgHeader.replace('msg', 'div')
+        msgHeader = msgHeader.replace('m_resid=', 'data-resid=')
+        msgHeader = msgHeader.replace('url=', 'data-url=')
+        const header = document.createElement('div')
+        header.innerHTML = msgHeader
+        // 处理特殊的出处
+        let sourceBody = undefined as HTMLElement | undefined
+        for (const element of div.children) {
+            if (element.nodeName === 'SOURCE') {
+                sourceBody = element as HTMLElement
+            }
+        }
+        if (sourceBody !== undefined) {
+            const source = sourceBody.dataset.name
+            if (source === '群投票')
+                return (
+                    '<a class="msg-unknow">（' +
+                    $t('chat_xml_unsupport') +
+                    '：' +
+                    source +
+                    '）</a>'
+                )
+        }
+        // 附带链接的 xml 消息处理
+        if ((header.children[0] as HTMLElement).dataset.url !== undefined) {
+            link = (header.children[0] as HTMLElement).dataset.url
+            div.style.cursor = 'pointer'
+        }
+        return div.outerHTML
+    } catch (ex) {
+        new Logger().error(ex as Error, 'xml 消息解析错误')
+        return (
+            '<span v-else class="msg-unknown">( ' +
+            $t('解析消息错误') +
+            ': xml )</span>'
+        )
+    }
+}
+
+/**
+ * xml 消息的点击事件
+ */
+function cardClick() {
+    const sender = mainDom.value
+
+    if (!sender) return
+
+    // 如果存在 url 项，优先打开 url
+    if (link !== undefined && link !== 'undefined' && link !== '') {
+        const openType =
+            sender.dataset.urlOpenType || sender.dataset.urlopentype
+        if (openType == '_self') {
+            window.open(link, '_self')
+        } else {
+            // 默认都以 _blank 打开
+            openLink(link)
+        }
+    }
+}
+</script>

package/client/web/src/components/msg-component/jsonComp/AutoReply.vue

@@ -0,0 +1,97 @@
+<template>
+    <div v-if="success" class="msg-json self-help">
+        <p>{{ parsedContent.title }}</p>
+        <span class="reply-buttons">
+            <span
+                v-for="(button, index) in parsedContent.button"
+                :key="index"
+                class="reply-button"
+                @click="sendNotify(button.action_data)">
+                {{ button.name }}
+            </span>
+        </span>
+        <div class="bottom-bar">
+            <font-awesome-icon icon="square-poll-horizontal" />
+            <span>{{ $t('自助问答') }}</span>
+        </div>
+    </div>
+    <span v-else class="msg-unknown">{{
+        '( ' + $t('加载失败') + ': ' + id + ' )'
+    }}</span>
+</template>
+
+<script setup lang="ts">
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
+import { Logger } from '../../../function/base';
+import { sendMsgRaw } from '../../../function/utils/msgUtil'
+import { useChatStore } from '../../../state/chat'
+import * as z from 'zod'
+
+const { data: jsonData, id } = defineProps<{
+    data: string,
+    id: string,
+}>()
+
+const autoReply = z
+    .object({
+        app: z.literal('com.tencent.autoreply'),
+        meta: z.object({
+            metadata: z.object({
+                buttons: z.array(
+                    z.object({
+                        action: z.literal('notify'),
+                        action_data: z.string(),
+                        name: z.string(),
+                        slot: z.number(),
+                    }),
+                ),
+                title: z.string(),
+                type: z.string(),
+            }),
+        }),
+    })
+    .transform((o) => ({
+        title: o.meta.metadata.title,
+        button: o.meta.metadata.buttons.map((b) => ({
+            name: b.name,
+            action_data: b.action_data,
+        })),
+    }))
+const json = JSON.parse(jsonData)
+const parsedData = autoReply.safeParse(json)
+const success = parsedData.success
+const parsedContent = parsedData.data!
+const chatStore = useChatStore()
+if (!success) {
+    new Logger().error(parsedData.error, 'Card Parse Error')
+}
+
+function sendNotify(data: string) {
+    sendMsgRaw(
+        String(chatStore.chatInfo.show.id),
+        chatStore.chatInfo.show.type,
+        [
+            {
+                type: 'at',
+                qq: '2854196310'
+            },
+            {
+                type: 'text',
+                text: data,
+            }
+        ]
+    )
+}
+</script>
+
+<style lang="css" scoped>
+.reply-buttons {
+    display: flex;
+    flex-direction: column;
+    margin: 1ch 2ch;
+}
+.reply-button {
+    text-decoration: underline;
+    cursor: pointer;
+}
+</style>

package/client/web/src/components/msg-component/jsonComp/Contact.lua.vue

@@ -0,0 +1,129 @@
+<template>
+    <div v-if="success" class="msg-json">
+        <div class="contact-data">
+            <img :src="parsedContent.img" alt="">
+            <div>
+                <p>{{ parsedContent.title }}</p>
+                <span v-if="parsedContent.type === 'group'">{{ parsedContent.desc }}</span>
+            </div>
+        </div>
+        <div class="bottom-bar">
+            <span>{{ parsedContent.name }}</span>
+        </div>
+    </div>
+    <span v-else class="msg-unknown">{{
+        '( ' + $t('加载失败') + ': ' + id + ' )'
+    }}</span>
+</template>
+
+<script setup lang="ts">
+import { Logger } from '../../../function/base';
+import * as z from 'zod'
+
+const { data: jsonData, id } = defineProps<{
+    data: string,
+    id: string,
+}>()
+
+const friend = z
+    .object({
+        app: z.literal('com.tencent.contact.lua'),
+        meta: z.object({
+            contact: z.object({
+                avatar: z.string(),
+                nickname: z.string(),
+                contact: z.string(),
+                jumpUrl: z.string(),
+                tag: z.literal('推荐好友'),
+            }),
+        }),
+    })
+    .transform((o) => ({
+        type: 'user' as const,
+        img: o.meta.contact.avatar,
+        title: o.meta.contact.nickname,
+        jumpUrl: o.meta.contact.jumpUrl,
+        name: o.meta.contact.tag,
+    }))
+
+const group = z
+    .object({
+        app: z.literal('com.tencent.contact.lua'),
+        meta: z.object({
+            contact: z.object({
+                avatar: z.string().transform((s) => s.replace('/100', '/')),
+                nickname: z.string(),
+                contact: z.string().transform((s) => `${s}…`),
+                jumpUrl: z.string(),
+                tag: z.literal('群名片'),
+            }),
+        }),
+    })
+    .transform((o) => ({
+        type: 'group' as const,
+        img: o.meta.contact.avatar,
+        title: o.meta.contact.nickname,
+        desc: o.meta.contact.contact,
+        jumpUrl: o.meta.contact.jumpUrl,
+        name: o.meta.contact.tag,
+    }))
+
+const bot = z
+    .object({
+        app: z.literal('com.tencent.contact.lua'),
+        meta: z.object({
+            contact: z.object({
+                avatar: z.string(),
+                nickname: z.string(),
+                contact: z.string(),
+                jumpUrl: z.string(),
+                tag: z.literal('机器人名片'),
+            }),
+        }),
+    })
+    .transform((o) => ({
+        type: 'bot' as const,
+        img: o.meta.contact.avatar,
+        title: o.meta.contact.nickname,
+        jumpUrl: o.meta.contact.jumpUrl,
+        name: o.meta.contact.tag,
+    }))
+
+const contact = z.union([friend, group, bot])
+
+const json = JSON.parse(jsonData)
+const parsedData = contact.safeParse(json)
+const success = parsedData.success
+const parsedContent = parsedData.data!
+if (!success) {
+    new Logger().error(parsedData.error, 'Card Parse Error')
+}
+</script>
+
+<style scoped>
+.contact-data {
+    display: flex;
+    align-items: center;
+}
+.contact-data img {
+    width: 45px;
+    height: 45px;
+    border-radius: 100%;
+    margin-right: 15px;
+}
+.contact-data > div {
+    display: flex;
+    flex-direction: column;
+}
+.contact-data p {
+    text-wrap: nowrap;
+    margin: 0;
+    font-weight: bold;
+}
+.contact-data span {
+    text-wrap: nowrap;
+    font-size: 0.8rem;
+    opacity: 0.7;
+    margin-top: 5px;
+}
+</style>

package/client/web/src/components/msg-component/jsonComp/Feed.lua.vue

@@ -0,0 +1,94 @@
+<template>
+    <div v-if="success" class="msg-json" @click="openLink(parsedContent.jumpUrl)">
+        <p>{{ parsedContent.title }}</p>
+        <span>{{ parsedContent.desc }}</span>
+        <img :src="parsedContent.img" alt="">
+        <div class="bottom-bar">
+            <img :src="parsedContent.icon" alt="">
+            <span>{{ parsedContent.name }}</span>
+        </div>
+    </div>
+    <span v-else class="msg-unknown">{{
+        '( ' + $t('加载失败') + ': ' + id + ' )'
+    }}</span>
+</template>
+
+<script setup lang="ts">
+import { Logger } from '../../../function/base';
+import { openLink } from '../../../function/utils/appUtil'
+import * as z from 'zod'
+
+const { data: jsonData, id } = defineProps<{
+    data: string,
+    id: string,
+}>()
+
+/**
+ * 解包 Qzone 风格的嵌套 URL 链接
+ * @param url 原始的完整 URL 字符串
+ * @returns 解码后的内部链接，如果解析失败则返回 null
+ */
+function unpackNestedUrl(url: string): string | null {
+    const logger = new Logger()
+    try {
+        const urlObj = new URL(url)
+
+        // 1. 处理路径部分 (pathname)
+        // 示例路径: /groupphoto/inqq/detail/https%3A%2F%2F...
+        const pathname = urlObj.pathname
+
+        // 寻找 "detail/" 之后的部分，这是常见的 Qzone 嵌套模式
+        const detailMarker = 'detail/'
+        const markerIndex = pathname.indexOf(detailMarker)
+
+        if (markerIndex !== -1) {
+            // 截取 detail/ 之后的所有内容
+            const encodedPart = pathname.substring(
+                markerIndex + detailMarker.length,
+            )
+
+            // 进行 URL 解码
+            // 注意：decodeURIComponent 会处理 %3A, %2F, %26 等
+            return decodeURIComponent(encodedPart)
+        }
+
+        return null
+    } catch (error) {
+        logger.error(error as Error, 'URL 解包失败')
+        return null
+    }
+}
+
+const feed = z
+    .object({
+        app: z.literal('com.tencent.feed.lua'),
+        meta: z.object({
+            feed: z.object({
+                cover: z.string(),
+                title: z.string(),
+                tagIcon: z.string(),
+                tagName: z.string(),
+                forwardMessage: z.string(),
+                pcJumpUrl: z.string(),
+            }),
+        }),
+        prompt: z.string(),
+    })
+    .transform((o) => ({
+        title: o.meta.feed.title,
+        jumpUrl:
+            unpackNestedUrl(o.meta.feed.pcJumpUrl) ?? o.meta.feed.pcJumpUrl,
+        img: o.meta.feed.cover,
+        icon: o.meta.feed.tagIcon,
+        name: o.meta.feed.tagName,
+        desc: o.meta.feed.forwardMessage,
+    }))
+
+const json = JSON.parse(jsonData)
+const parsedData = feed.safeParse(json)
+const success = parsedData.success
+const parsedContent = parsedData.data!
+if (!success) {
+    new Logger().error(parsedData.error, 'Card Parse Error')
+}
+</script>

package/client/web/src/components/msg-component/jsonComp/Forum.vue

@@ -0,0 +1,84 @@
+<template>
+    <div v-if="success" class="msg-json" @click="openLink(parsedContent.jumpUrl)">
+        <p>{{ parsedContent.title }}</p>
+        <span>
+            <font-awesome-icon icon="eye" /> {{ parsedContent.view }}
+            <font-awesome-icon icon="message" /> {{ parsedContent.comment }}
+            <font-awesome-icon icon="thumbs-up" /> {{ parsedContent.prefer }}
+        </span>
+        <img v-if="parsedContent.img" :src="parsedContent.img" alt=""
+            class="forum-img">
+        <div class="bottom-bar">
+            <img :src="parsedContent.icon" alt="">
+            <span>{{ parsedContent.name }} ({{ $t('频道') }})</span>
+        </div>
+    </div>
+    <span v-else class="msg-unknown">{{
+        '( ' + $t('加载失败') + ': ' + id + ' )'
+    }}</span>
+</template>
+
+<script setup lang="ts">
+import { Logger } from '../../../function/base'
+import { openLink } from '../../../function/utils/appUtil'
+import * as z from 'zod'
+
+const { data: jsonData, id } = defineProps<{
+    data: string,
+    id: string,
+}>()
+
+const forum = z
+    .object({
+        app: z.literal('com.tencent.forum'),
+        meta: z.object({
+            detail: z.object({
+                channel_info: z.object({
+                    guild_icon: z.string(),
+                    guild_name: z.string(),
+                }),
+                feed: z.object({
+                    comment_count: z.number().optional(),
+                    images: z
+                        .array(
+                            z.object({
+                                pic_url: z.string(),
+                                height: z.number(),
+                                width: z.number(),
+                            }),
+                        )
+                        .optional(),
+                    prefer_count: z.number().optional(),
+                    view_count: z.number().optional(),
+                }),
+                jump_url: z.string(),
+            }),
+        }),
+        prompt: z.string(),
+    })
+    .transform((o) => ({
+        title: o.prompt.replace('[频道帖子]', ''),
+        view: o.meta.detail.feed.view_count ?? 0,
+        comment: o.meta.detail.feed.comment_count ?? 0,
+        prefer: o.meta.detail.feed.prefer_count ?? 0,
+        jumpUrl: o.meta.detail.jump_url,
+        img: o.meta.detail.feed.images?.[0]?.pic_url,
+        icon: o.meta.detail.channel_info.guild_icon,
+        name: o.meta.detail.channel_info.guild_name,
+    }))
+const json = JSON.parse(jsonData)
+const parsedData = forum.safeParse(json)
+const success = parsedData.success
+const parsedContent = parsedData.data!
+if (!success) {
+    new Logger().error(parsedData.error, 'Card Parse Error')
+}
+</script>
+
+<style lang="css" scoped>
+.forum-img {
+    max-width: 30vw;
+    min-width: 240px;
+    object-fit: cover;
+}
+</style>