@aochuang/client-sdk 1.0.278

package/components/wechat-chat-control/url/url-miniprogram.vue

@@ -0,0 +1,259 @@
+<template>
+  <div class="sdk-chat-panel-control-url-miniprogram" :class="['sdk-chat-panel-control-url-miniprogram--' + type, {'is-border': border}]">
+    <template v-if="type === 'default'">
+      <div class="sdk-chat-panel-control-url-miniprogram__main">
+        <div class="sdk-chat-panel-control-url-miniprogram__head" v-if="icon">
+          <img class="sdk-chat-panel-control-url-miniprogram__icon" width="22px" height="22px;" v-if="icon" :src="icon" />
+          <div class="sdk-chat-panel-control-url-miniprogram__desc" v-if="desc">
+            {{desc}}
+          </div>
+        </div>
+        <div class="sdk-chat-panel-control-url-miniprogram__body">
+          <div class="sdk-chat-panel-control-url-miniprogram__title" v-if="title">
+            {{title}}
+          </div>
+          <div class="sdk-chat-panel-control-url-miniprogram__content">
+            <div v-if="cover" :style="{width: '100%', height: '100%', background: 'url('+ cover +')', 'background-size': 'cover'}"></div>
+          </div>
+        </div>
+        <div class="sdk-chat-panel-control-url-miniprogram__foot">小程序</div>
+      </div>
+    </template>
+    <template v-else-if="type === 'thumb'">
+      <div class="sdk-chat-panel-control-url-miniprogram__main">
+        <div class="sdk-chat-panel-control-url-miniprogram__head" v-if="icon">
+          <img class="sdk-chat-panel-control-url-miniprogram__icon" width="22px" height="22px;" v-if="icon" :src="icon" />
+          <div class="sdk-chat-panel-control-url-miniprogram__desc" v-if="desc">
+            {{desc}}
+          </div>
+        </div>
+        <div class="sdk-chat-panel-control-url-miniprogram__body">
+          <div class="sdk-chat-panel-control-url-miniprogram__title" v-if="title">
+            {{title}}
+          </div>
+        </div>
+        <div class="sdk-chat-panel-control-url-miniprogram__bgimage">
+          <div v-if="cover" :style="{width: '100%', height: '100%', background: 'url('+ cover +')', 'background-size': 'cover'}"></div>
+        </div>
+        <div class="sdk-chat-panel-control-url-miniprogram__foot">小程序</div>
+      </div>
+    </template>
+    <template v-else-if="type === 'quote'">
+      <div class="sdk-chat-panel-control-url-miniprogram__icon"></div>
+      <div class="sdk-chat-panel-control-url-miniprogram__title" v-if="title">
+        {{title}}
+      </div>
+      <div class="sdk-chat-panel-control-url-miniprogram__content">
+        <div v-if="cover" :style="{width: '100%', height: '100%', background: 'url('+ cover +')', 'background-size': 'cover'}"></div>
+      </div>
+    </template>
+  </div>
+</template>
+<script>
+import { parse, parseXml } from '../../../utils/json'
+import { formatOssPath } from '@aochuang/common/utils/oss'
+
+export default {
+  name: 'SdkChatPanelControlUrlMiniprogram',
+  props: {
+    id: {
+      type: String
+    },
+    type: {
+      type: String
+    },
+    content: {
+      type: [Object, String]
+    }
+  },
+  inject: {
+    SdkChatPanelBox: {
+      default: null
+    }
+  },
+  computed: {
+    nextContent () {
+      return parse(this.content)
+    },
+    miniprogramData () {
+      let data = null
+      if (!this.nextContent) {
+        return data
+      }
+      if (this.nextContent.contentXml) {
+        data = parseXml(this.nextContent.contentXml)
+      }
+      return data
+    },
+    icon () {
+      return this.miniprogramData.msg && this.miniprogramData.msg.appmsg && this.miniprogramData.msg.appmsg.weappinfo ? this.miniprogramData.msg.appmsg.weappinfo.weappiconurl : ''
+    },
+    title () {
+      return this.miniprogramData.msg && this.miniprogramData.msg.appmsg ? this.miniprogramData.msg.appmsg.title : ''
+    },
+    url () {
+      return this.miniprogramData.msg && this.miniprogramData.msg.appmsg ? this.miniprogramData.msg.appmsg.url  : ''
+    },
+    desc () {
+      let desc = this.miniprogramData.msg && this.miniprogramData.msg.appmsg ? this.miniprogramData.msg.appmsg.des  : ''
+      if (!desc) {
+        desc = this.miniprogramData.msg && this.miniprogramData.msg.appmsg && this.miniprogramData.msg.appmsg.sourcedisplayname ? this.miniprogramData.msg.appmsg.sourcedisplayname : ''
+      }
+      return desc
+    },
+    cover () {
+      let cover = this.miniprogramData.msg && this.miniprogramData.msg.appmsg ? (this.miniprogramData.msg.appmsg.thumburl || this.content.previewImage) : ''
+      if (cover) {
+        cover = formatOssPath(cover)
+      }
+      return cover
+    },
+    border () {
+      return !this.SdkChatPanelBox
+    }
+  }
+}
+</script>
+<style lang="less">
+.sdk-chat-panel-control-url-miniprogram {
+  max-width: 280px;
+  &.is-border {
+    border-radius: 4px;
+    border: 1px solid #eee;
+  }
+}
+.sdk-chat-panel-control-url-miniprogram--default{
+  .sdk-chat-panel-control-url-miniprogram__main{
+    width: 280px;
+    color: #404040;
+    &:hover{
+      color: #404040;
+    }
+  }
+  .sdk-chat-panel-control-url-miniprogram__head{
+    padding: 6px 12px 0;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    img {
+      margin-right: 6px;
+    }
+  }
+  .sdk-chat-panel-control-url-miniprogram__body{
+    padding: 6px 12px 12px;
+  }
+  .sdk-chat-panel-control-url-miniprogram__title{
+    margin-bottom: 12px;
+    font-size: 16px;
+  }
+  .sdk-chat-panel-control-url-miniprogram__content{
+    height: 150px;
+    background-color: #f1f0f5;
+  }
+  .sdk-chat-panel-control-url-miniprogram__desc{
+    color: #888;
+  }
+  .sdk-chat-panel-control-url-miniprogram__foot{
+    padding: 3px 12px 3px 26px;
+    border-top: 1px solid rgba(0,0,0,.1);
+    background: url('./miniprogram.svg') no-repeat 12px 50%;
+    background-size: 12px;
+    font-size: 12px;
+    color: #888;
+  }
+}
+.sdk-chat-panel-control-url-miniprogram--thumb{
+  background-color: #fff;
+  position: relative;
+  .sdk-chat-panel-control-url-miniprogram__main{
+    width: auto;
+    color: #404040;
+    &:hover{
+      color: #404040;
+    }
+  }
+  .sdk-chat-panel-control-url-miniprogram__head{
+    padding: 6px 12px 0;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    position: relative;
+    z-index: 5;
+    img {
+      margin-right: 6px;
+    }
+  }
+  .sdk-chat-panel-control-url-miniprogram__body{
+    padding: 6px 12px 12px;
+    position: relative;
+    z-index: 5;
+  }
+  .sdk-chat-panel-control-url-miniprogram__title{
+    font-size: 16px;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2; /* 限制显示3行 */
+    overflow: hidden;
+  }
+  .sdk-chat-panel-control-url-miniprogram__desc{
+    color: #888;
+  }
+  .sdk-chat-panel-control-url-miniprogram__foot{
+    padding: 3px 12px 3px 26px;
+    border-top: 1px solid rgba(0,0,0,.1);
+    background: url('./miniprogram.svg') no-repeat 12px 50%;
+    background-size: 12px;
+    font-size: 12px;
+    color: #888;
+    position: relative;
+    z-index: 5;
+    background-color: #fff;
+  }
+  .sdk-chat-panel-control-url-miniprogram__bgimage{
+    position: absolute;
+    left: 0;
+    right: 0;
+    top: 0;
+    bottom: 0;
+    &:before {
+      content: '';
+      position: absolute;
+      left: 0;
+      top: 0;
+      right: 0;
+      bottom: 0;
+      z-index: 3;
+      background: linear-gradient(180deg,#fff 0,hsla(0,0%,100%,.8) 48%,hsla(0,0%,100%,.4) 79%,hsla(0,0%,100%,0));
+    }
+  }
+}
+.sdk-chat-panel-control-url-miniprogram--quote {
+  display: flex;
+  flex-direction: row;
+  max-width: 320px;
+  .sdk-chat-panel-control-url-miniprogram__icon {
+    display: inline-block;
+    width: 14px;
+    height: 14px;
+    margin-right: 4px;
+    min-width: 14px;
+    vertical-align: top;
+    margin-top: 4px;
+    color: #999;
+    background: url('./miniprogram.svg') no-repeat 50% 50%;
+    background-size: cover;
+  }
+  .sdk-chat-panel-control-url-miniprogram__content {
+    width: 52px;
+    height: 52px;
+    min-width: 52px;
+    background-position: 50% 50%;
+    background-repeat: no-repeat;
+    background-size: cover;
+    background-color: rgba(0,0,0,.1);
+  }
+  .sdk-chat-panel-control-url-miniprogram__title{
+    margin-right: 6px;
+  }
+}
+</style>

package/components/wechat-chat-control/url/url.vue

@@ -0,0 +1,116 @@
+<script>
+import { parse, parseXml } from '../../../utils/json'
+import UrlMerge from './url-merge'
+import UrlMiniprogram from './url-miniprogram'
+import UrlFile from './url-file'
+import UrlLink from './url-link'
+
+export default {
+  name: 'SdkChatPanelControlsUrl',
+  functional: true,
+  props: {
+    id: {
+      type: String
+    },
+    content: {
+      type: [Object, String]
+    },
+    updateChatBoxProp: {
+      type: Function
+    },
+    allowDownload: {
+      type: [Boolean, Function],
+      default: false
+    },
+    downloadMethod: {
+      type: Function
+    },
+    cancelDownloadMethod: {
+      type: Function
+    },
+    getDownloadTipsMethod: {
+      type: Function
+    },
+    previewMethod: {
+      type: Function
+    },
+    allowPreview: {
+      type: [Boolean, Function],
+      default: false
+    },
+    beforeLoadMergeMethod: {
+      type: Function
+    },
+    type: {
+      type: String,
+      default: 'default',
+      validator (value) {
+        return ['quote', 'default', 'thumb'].includes(value)
+      }
+    }
+  },
+  render (h, c) {
+    const { props } = c
+    let content = props.content
+    if (!content) {
+      return null
+    }
+    content = parse(content)
+    if (content.type === 'merged') {
+      return h(UrlMerge, {
+        props: {
+          id: props.id,
+          type: props.type,
+          content: content.content,
+          beforeLoad: props.beforeLoadMergeMethod
+        }
+      })
+    } else if (content.type === 'miniprogram') {
+      return h(UrlMiniprogram, {
+        props: {
+          id: props.id,
+          type: props.type,
+          content
+        },
+        key: c.data.key
+      })
+    } else if (content.type === 'file') {
+      return h(UrlFile, {
+        props: {
+          id: props.id,
+          type: props.type,
+          content,
+          allowDownload: props.allowDownload,
+          downloadMethod: props.downloadMethod,
+          getDownloadTipsMethod: props.getDownloadTipsMethod,
+          cancelDownloadMethod: props.cancelDownloadMethod,
+          allowPreview: props.allowPreview,
+          previewMethod: props.previewMethod,
+          updateChatBoxProp: c.props.updateChatBoxProp
+        },
+        key: c.data.key
+      })
+    } else {
+      if (typeof content === 'string') {
+        const xmlData = parseXml(content)
+        if (xmlData) {
+          content = {
+            title: xmlData.msg && xmlData.msg.appmsg && xmlData.msg.appmsg.title,
+            desc: xmlData.msg && xmlData.msg.appmsg && xmlData.msg.appmsg.des,
+            url: xmlData.msg && xmlData.msg.appmsg && xmlData.msg.appmsg.url
+          }
+        }
+      }
+      return h(UrlLink, {
+        props: {
+          id: props.id,
+          content,
+          type: props.type,
+          updateChatBoxProp: props.updateChatBoxProp
+        },
+        key: c.data.key
+      })
+    }
+  }
+}
+</script>

package/components/wechat-chat-control/util.js

@@ -0,0 +1,234 @@
+export const MESSAGE_TYPE = {
+	TEXT: 1,
+	IMAGE: 3,
+	VOICE: 34,
+    MUSIC: 1040187441,
+	ROOM_CALLING: 64,
+	SHARE_CARD: 42,
+	COMPANY_CARD: 66,
+	VIDEO: 43,
+	CUSTOM_EXPRESSION: 47,
+	LOCATION: 48,
+	URL: 49,
+	URLNew: 1090519089,
+	CALLING: 50,
+	REAL_TIME_POSITION: -1879048186,
+	RED_ENVELOPES: 436207665,
+	ACCOUNT_TRANSFER: 419430449,
+	SYSTEM: 10000,
+    SYSTEM_BATCH_MESSAGE: 10002,
+    REVOKE_ME_MESSAGE: 268445458,
+    REVOKE_YOU_MESSAGE: 285222674,
+    REVOKE_OTHER_MESSAGE: 268445456,
+	JX_SYS_TEXT: 90000,
+	MEMBER_CHANGE: 570425393,
+	SYSTEM_MONEY: -10001,
+	TIME_DIVIDER: -12346789,
+	TEXT_WITH_AT: 90001,
+	QUOTE_MESSAGE: 822083633,
+	CHANNEL_VIDEO: 754974769,
+	CHANNEL_VIDEO_CARD: 771751985, // 视频号名片
+	CHANNEL_VIDEO_LIVE: 973078577 // 视频号直播
+}
+
+function html2Escape (sHtml) {
+    return (sHtml || '').replace(/[<>]/g, (c) => {
+        return {
+        '<': '&lt;',
+        '>': '&gt;'
+        }[c]
+    })
+}
+
+function formatSystemMessage (content) {
+	if (!content) {
+		return
+	}
+	// 微被异常关闭  <a href=\"weixin://voip/callagain/?username=wxid_ofo60wv6hxeg22&isvideocall=false\">重新拨打</a>
+	content = content.replace(/<a .*?>(.*)?<\/a>/, '$1')
+	// 你有一笔待接收的<_wc_custom_link_ href=\"weixin://wxpay/transfer/remindrcvmsg?fromusername=wxid_czvz4ar05mzj12&transferid=1000050001202403131427288081709&transfer_msg_type=1\">转账</_wc_custom_link_>
+	content = content.replace(/<_wc_custom_link_ .*?>(.*)?<\/_wc_custom_link_>/, '$1')
+	// <img src=\"SystemMessages_HongbaoIcon.png\"/>  你领取了黄哒哒的<_wc_custom_link_ color=\"#FD9931\" href=\"weixin://weixinhongbao/opendetail?sendid=1000039901202403067108164737017&sign=aeb7599b2ba534837903a501e7c0f3aaa3449225842552e5d19221a43b1be006d012bcbf25660c6700d3ff1488703edf16e033ec6fb8a35a484ff79b3d4d71bf90c7dd7561af1335314c9ef451b8d36c&ver=6\">红包</_wc_custom_link_>
+	content = content.replace(/<img .*?\/>/, '')
+	return content
+}
+
+function toJson (data) {
+    try {
+        return JSON.parse(data)
+    } catch (e) {
+        console.log(e)
+    }
+    return data
+}
+
+/**
+ * 格式化为短消息
+*/
+export function formatShortMessage (msgType, msgContent) {
+    let shortMessage = msgContent
+    switch (msgType) {
+        case MESSAGE_TYPE.TEXT:
+            shortMessage = msgContent
+            break
+        case MESSAGE_TYPE.TEXT_WITH_AT:
+            let {atId, content, text} = toJson(msgContent) || {}
+            shortMessage = text
+            break
+        case MESSAGE_TYPE.IMAGE:
+            shortMessage = '[图片消息]'
+            break
+        case MESSAGE_TYPE.VIDEO:
+            shortMessage = '[视频消息]'
+            break
+        case MESSAGE_TYPE.CUSTOM_EXPRESSION:
+            shortMessage = '[自定义表情消息]'
+            break
+        case MESSAGE_TYPE.VOICE:
+            shortMessage = '[语音消息]'
+            break
+        case MESSAGE_TYPE.MUSIC:
+            shortMessage = '[音乐消息]'
+            break
+        case MESSAGE_TYPE.JX_SYS_TEXT:
+        case MESSAGE_TYPE.MEMBER_CHANGE:
+        case MESSAGE_TYPE.SYSTEM_MONEY:
+            shortMessage = '[系统消息]'
+            break
+        case MESSAGE_TYPE.SYSTEM:
+            shortMessage = formatSystemMessage(msgContent)
+            break
+        case MESSAGE_TYPE.URL:
+        case MESSAGE_TYPE.URLNew:
+            const jsonObj = toJson(msgContent)
+            if (typeof jsonObj === 'object') {
+                if(jsonObj.type === 'file') {
+                    shortMessage = '[文件消息]'
+                } else if(jsonObj.type === 'link') {
+                    shortMessage = '[链接消息]'
+                } else if(jsonObj.type === 'miniprogram') {
+                    shortMessage = '[小程序消息]'
+                } else if (jsonObj.type === 'music') {
+                    shortMessage = '[音乐消息]'
+                } else if (jsonObj.type === 'merged') {
+                    shortMessage = '[合并消息]'
+                } else {
+                    shortMessage = '[链接消息]'
+                }
+            } else {
+                shortMessage = '[链接消息]'
+            }
+            break
+        case MESSAGE_TYPE.RED_ENVELOPES:
+            shortMessage = '[红包消息]'
+            break
+        case MESSAGE_TYPE.ACCOUNT_TRANSFER:
+            shortMessage = '[转账消息]'
+            break
+        case MESSAGE_TYPE.COMPANY_CARD:
+        case MESSAGE_TYPE.SHARE_CARD:
+            shortMessage = '[名片消息]'
+            break
+        case MESSAGE_TYPE.LOCATION:
+            shortMessage = '[位置消息]'
+            break
+        case MESSAGE_TYPE.QUOTE_MESSAGE:
+            let nextContent = null
+            if (typeof msgContent === 'string') {
+                nextContent = msgContent.replace(/^[\w-_@]+:{/, '{')
+                nextContent = toJson(nextContent)
+            }
+            if (!nextContent) {
+                shortMessage = '[引用消息]'
+            } else {
+                shortMessage = nextContent.content
+            }
+            break
+        case MESSAGE_TYPE.CHANNEL_VIDEO:
+            shortMessage = '[视频号消息]'
+            break
+        case MESSAGE_TYPE.CHANNEL_VIDEO_CARD:
+            shortMessage = '[视频号名片]'
+            break
+        case MESSAGE_TYPE.CHANNEL_VIDEO_LIVE:
+            shortMessage = '[视频号直播]'
+            break
+        case MESSAGE_TYPE.ROOM_CALLING:
+        case MESSAGE_TYPE.CALLING:
+            shortMessage = '[语音通话消息]'
+            break
+        case MESSAGE_TYPE.REVOKE_ME_MESSAGE: 
+        case MESSAGE_TYPE.REVOKE_OTHER_MESSAGE: 
+            shortMessage = '[撤回消息]'
+            break
+        default:
+            if (msgContent) {
+                shortMessage = '[未知消息]'
+            }
+            break
+    }
+    return html2Escape(shortMessage)
+}
+
+/**
+ * {
+    "conversationId": "c46acbc06c7d2c98fc1c2cc7a8a166d51b86b978",
+    "lastMsgContent": "&lt;div&gt;afwefwefwe&lt;/div&gt;",
+    "lastMsgId": "6b8fb723bd3c2587e4cbe1c7dbf432273ae17937",
+    "lastMsgTime": 1752805509000,
+    "lastMsgType": 1,
+    "lastUpdateTime": 1752808689038,
+    "mute": false,
+    "stickyOnTop": false,
+    "targetId": "fa11efc7f771f73bd483d41e54084494e11b5d8b",
+    "type": 0,
+    "unreadMsgCount": 0,
+    "wechatAccountId": "e8aade993e66748cbb845d127ea8e2e067465de7"
+}
+*/
+export function formatShortSessionMessage (session, contextFn) {
+    if (!session.lastMsgType) {
+        return
+    }
+    if (session.lastMsgType === MESSAGE_TYPE.TEXT_WITH_AT) {
+        const content = toJson(session.lastMsgContent)
+        if (!contextFn) {
+            throw new Error('缺少上下文函数')
+        }
+        if (content && content.text && content.text.indexOf('@所有人') >= 0) {
+          const contextRs = contextFn()
+          if (contextRs && contextRs.then) {
+            return contextRs.then(rs => {
+              // 有未读消息才需要高亮红色提示
+              if (rs.session && rs.session.unreadMsgCount > 0) {
+                return `<span style="color: #e2544b;">[@所有人]</span>${html2Escape(content.text)}`
+              } else {
+                return formatShortMessage(session.lastMsgType, session.lastMsgContent)
+              }
+            })
+          } else {
+            return formatShortMessage(session.lastMsgType, session.lastMsgContent)
+          }
+        } else if (content && content.atWechatIdsHash && content.atWechatIdsHash.length) {
+            const contextRs = contextFn()
+            if (contextRs && contextRs.then) {
+                return contextRs.then(rs => {
+                    if (!rs.wechatAccount) {
+                        return formatShortMessage(session.lastMsgType, session.lastMsgContent)
+                    }
+                    // 有未读消息才需要高亮红色提示
+                    if (content.atWechatIdsHash.includes(rs.wechatAccount.wechatIdHash) && rs.session && rs.session.unreadMsgCount > 0) {
+                        return `<span style="color: #e2544b;">[有人@我]</span>${html2Escape(content.text)}`
+                    } else {
+                        return formatShortMessage(session.lastMsgType, session.lastMsgContent)
+                    }
+                })
+            } else {
+                return formatShortMessage(session.lastMsgType, session.lastMsgContent)
+            }
+        } else {
+            return formatShortMessage(session.lastMsgType, session.lastMsgContent)
+        }
+    }
+    return formatShortMessage(session.lastMsgType, session.lastMsgContent)
+}

package/components/wechat-chat-control/video/icons/video.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1731930511288" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1740" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M0 0h1024v1024H0z" fill="#6690FF" p-id="1741"></path><path d="M802.9696 692.736c15.9744 0 28.928-12.5184 28.928-27.904 0-0.5632 0.1024-0.7936 0.1024-1.1008V395.5968c0-0.3072-0.0768-0.5376-0.0768-1.1008 0-15.4112-12.9792-27.904-28.928-27.904-4.9152 0-9.472 1.1776-13.4656 3.2256h-0.1792l-88.2944 45.9776v-68.352c0-38.7584-32.512-70.1184-72.704-70.1184H264.704c-40.192 0-72.7296 31.36-72.7296 70.0928v350.464C192 736.6656 224.512 768 264.704 768h363.648c40.192 0 72.704-31.36 72.704-70.0928v-54.4512l88.8064 46.208c3.9936 1.792 8.3968 3.072 13.1072 3.072z" fill="#FFFFFF" p-id="1742"></path></svg>