@aochuang/client-sdk 1.0.354 → 1.0.356

package/components/wework-chat-control/file-url/file-url.vue

@@ -7,9 +7,11 @@
         </div>
         <div class="sdk-chat-wework-control-file-url__toolbar">
           <span class="sdk-chat-wework-control-file-url__size" v-if="fileSize">{{fileSize}}</span>
-          <!-- <span class="sdk-chat-wework-control-file-url__download" v-if="innerAllowDownload" @click.stop.prevent>
-            <ui-button type="primary" link :click="handleDownloadClick">下载</ui-button>
-          </span> -->
+          <span class="sdk-chat-wework-control-file-url__download" v-if="canDownload" @click.stop.prevent>
+            <ui-button type="primary" link :loading="downloading" icon="download-line" :click="handleDownloadClick">
+              下载
+            </ui-button>
+          </span>
         </div>
       </span>
       <span v-if="fileIcon" class="sdk-chat-wework-control-file-url__icon">
@@ -67,7 +69,8 @@ export default {
   },
   data () {
     return {
-      nextContent: {}
+      nextContent: {},
+      downloading: false
     }
   },
   computed: {
@@ -105,6 +108,9 @@ export default {
       }
       return this.allowDownload
     },
+    canDownload () {
+      return this.type !== 'quote' && this.innerAllowDownload && typeof this.downloadMethod === 'function'
+    },
     border () {
       if (this.type === 'quote') {
         return false
@@ -114,24 +120,37 @@ export default {
   },
   created () {
     this.nextContent = parse(this.content) || {}
-    if (this.url && this.updateChatBoxProp) {
-      this.updateChatBoxProp('href', this.url)
-    }
   },
   methods: {
     handleDownloadClick () {
-      if (!this.downloadMethod) {
+      if (!this.canDownload || this.downloading) {
         return
       }
-      return this.downloadMethod({
+      const updateContent = data => {
+        if (!data || typeof data !== 'object' || Array.isArray(data)) {
+          throw new Error('updateContentProps只支持更新数据对象')
+        }
+        this.nextContent = data
+        this.$emit('content-update', data)
+      }
+      const result = this.downloadMethod({
         content: this.nextContent,
         updateContentProp: (prop, value) => {
-          if (!['url'].includes(prop)) {
+          if (!['resPath', 'url'].includes(prop)) {
             throw new Error('不支持的更新属性' + prop)
           }
           this.$set(this.nextContent, prop, value)
-        }
+          this.$emit('content-update', this.nextContent)
+        },
+        updateContentProps: updateContent
       })
+      if (result && result.finally) {
+        this.downloading = true
+        result.finally(() => {
+          this.downloading = false
+        })
+      }
+      return result
     }
   },
   beforeDestroy () {

package/components/wework-chat-control/text/text-default.vue

@@ -0,0 +1,99 @@
+<template>
+  <div class="sdk-chat-wework-control-text" :class="['sdk-chat-wework-control-text--' + type]">
+    <div class="sdk-chat-wework-control-text__main">
+      <template v-if="hasScroll">
+        <ui-popover :value="showPopover" @input="handleShowPopoverChange">
+          <template slot="reference">
+            <div class="sdk-chat-wework-control-text__content" v-html="html" ref="popoverContent"></div>
+          </template>
+          <div class="sdk-chat-wework-control-text__popover" v-html="html" :style="{'width': popoverWidth}"></div>
+        </ui-popover>
+      </template>
+      <template v-else>
+        <div class="sdk-chat-wework-control-text__content" v-html="html" ref="content"></div>
+      </template>
+    </div>
+  </div>
+</template>
+<script>
+import {Popover as UiPopover} from '@aochuang/common/components'
+import {parseWechatEmoji} from '@aochuang/common/common/wechat-emoji'
+import {html2Escape} from '../../../utils/string'
+
+function parseTextContent (content) {
+  if (typeof content !== 'string') return content
+  try {
+    const data = JSON.parse(content)
+    return data && typeof data === 'object' ? data : content
+  } catch (e) {
+    return content
+  }
+}
+
+export default {
+  name: 'SdkChatControlTextDefault',
+  components: {UiPopover},
+  props: {
+    id: {type: String},
+    content: {type: [String, Object]},
+    type: {
+      type: String,
+      default: 'default',
+      validator (value) { return ['quote', 'default', 'thumb'].includes(value) }
+    },
+    formatter: {type: Function}
+  },
+  data () {
+    return {hasScroll: false, showPopover: false, popoverWidth: null}
+  },
+  computed: {
+    nextContent () { return parseTextContent(this.content) },
+    text () {
+      return this.nextContent && typeof this.nextContent === 'object' ? this.nextContent.text || '' : this.nextContent
+    },
+    html () {
+      let content = this.formatter ? this.formatter({content: this.nextContent}) : parseWechatEmoji(html2Escape(String(this.text || '')), false)
+      if (!content) return ''
+      content = String(content).replace(/(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig, item => `<a href="${item}" target='_blank'>${item}</a>`)
+      return content.trim()
+    }
+  },
+  mounted () {
+    if (this.$refs.content) this.hasScroll = this.$refs.content.scrollHeight > this.$refs.content.clientHeight
+  },
+  methods: {
+    handleShowPopoverChange (visible) {
+      if (this.$refs.popoverContent && visible) this.popoverWidth = this.$refs.popoverContent.offsetWidth + 'px'
+      this.$nextTick(() => { this.showPopover = visible })
+    }
+  }
+}
+</script>
+<style lang="less">
+.sdk-chat-wework-control-text--default .sdk-chat-wework-control-text__main { padding: 10px; }
+.sdk-chat-wework-control-text--quote .sdk-chat-wework-control-text__content {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  overflow: hidden;
+  max-width: 420px;
+}
+.sdk-chat-wework-control-text--thumb {
+  background-color: #fff;
+  border: 1px solid #eee;
+  border-radius: 3px;
+  padding: 6px 10px;
+}
+.sdk-chat-wework-control-text--thumb .sdk-chat-wework-control-text__content {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 3;
+  overflow: hidden;
+}
+.sdk-chat-wework-control-text__main { white-space: pre-wrap; line-height: 1.5em; word-break: break-all; }
+.sdk-chat-wework-control-text__main img { vertical-align: top; }
+.sdk-chat-wework-control-text__main a { color: #4387ff; }
+.sdk-chat-wework-control-text__main a:hover { color: #4387ff; text-decoration: underline; }
+.sdk-chat-wework-control-text__popover { white-space: pre-wrap; line-height: 1.5em; word-break: break-all; padding: 10px; }
+.sdk-chat-wework-control-text__popover img { vertical-align: top; }
+</style>

package/components/wework-chat-control/text/text-quote.vue

@@ -0,0 +1,105 @@
+<template>
+  <div class="sdk-chat-wework-control-text-quote" :class="['sdk-chat-wework-control-text-quote--' + type]">
+    <text-default :id="id" :content="mainContent" :type="type" :formatter="formatter"></text-default>
+  </div>
+</template>
+<script>
+import {parse} from '../../../utils/json'
+import {chatControls} from '../index'
+import WeworkChatControlConfigMsg from '../wework-chat-control-config-msg.vue'
+import TextDefault from './text-default.vue'
+
+function parseQuoteContent (content) {
+  if (content && typeof content === 'object') return content
+  const parsed = parse(content, {})
+  if (!parsed || typeof parsed !== 'object' || !parsed.quote || typeof content !== 'string') return parsed
+  // JSON.parse converts large企微 message IDs to imprecise Numbers. Restore the
+  // original digit sequence before it is sent to the detail endpoint.
+  const match = content.match(/"messageId"\s*:\s*(?:"([^"]+)"|([0-9]+))/)
+  if (match) parsed.quote.messageId = match[1] || match[2]
+  return parsed
+}
+
+export default {
+  name: 'SdkChatControlTextQuote',
+  components: {TextDefault, WeworkChatControlConfigMsg},
+  props: {
+    id: {type: String},
+    content: {type: [String, Object]},
+    type: {type: String, default: 'default'},
+    formatter: {type: Function},
+    getQuoteMessage: {type: Function},
+    setChatBoxFootVnode: {type: Function}
+  },
+  data () { return {loading: false, quoteMessageData: null, errorMsg: null} },
+  computed: {
+    contentObject () {
+      return parseQuoteContent(this.content)
+    },
+    quoteInfo () { return this.contentObject.quote || {} },
+    mainContent () {
+      const value = Object.assign({}, this.contentObject)
+      delete value.quote
+      return JSON.stringify(value)
+    },
+    quoteText () { return this.quoteInfo.text || '引用消息' },
+    quoteAuthor () {
+      const message = this.quoteMessageData || {}
+      return this.quoteInfo.sendName || message.userName || message.contactName || message.roomName || this.quoteInfo.sendId || '引用消息'
+    },
+    quoteControl () {
+      return chatControls[this.quoteMessageData && this.quoteMessageData.msgType] || TextDefault
+    },
+    quoteFootComponent () {
+      return {
+        render: h => {
+          const content = [h('div', {class: 'sdk-chat-wework-control-text-quote__author'}, [this.quoteAuthor])]
+          if (this.loading) {
+            content.push(h('div', {class: 'sdk-chat-wework-control-text-quote__status'}, ['引用内容正在加载中...']))
+          } else if (this.quoteMessageData) {
+            content.push(h(WeworkChatControlConfigMsg, {
+              props: {msgData: this.quoteMessageData},
+              scopedSlots: {
+                default: ({configData}) => h(this.quoteControl, {
+                  props: Object.assign({}, configData, {id: this.id + '_quote', content: this.quoteMessageData.content, type: 'quote'})
+                })
+              }
+            }))
+          } else {
+            content.push(h('div', {class: 'sdk-chat-wework-control-text-quote__content'}, [this.quoteText]))
+            if (this.errorMsg) content.push(h('div', {class: 'sdk-chat-wework-control-text-quote__status'}, [this.errorMsg]))
+          }
+          return h('div', {class: 'sdk-chat-wework-control-text-quote__box'}, content)
+        }
+      }
+    }
+  },
+  created () {
+    if (this.setChatBoxFootVnode) this.setChatBoxFootVnode(this.quoteFootComponent)
+    if (!this.getQuoteMessage || !this.quoteInfo.messageId || !this.quoteInfo.sendTime) {
+      this.errorMsg = '未找到引用消息内容，请在手机中确认'
+      return
+    }
+    this.loading = true
+    this.getQuoteMessage({
+      msgId: String(this.quoteInfo.messageId),
+      sendTime: this.quoteInfo.sendTime,
+      content: this.quoteInfo
+    }).then(data => {
+      this.quoteMessageData = data && data.data ? data.data : data
+      if (!this.quoteMessageData) this.errorMsg = '未找到引用消息内容，请在手机中确认'
+      if (this.setChatBoxFootVnode) this.setChatBoxFootVnode(this.quoteFootComponent)
+    }).catch(() => {
+      this.errorMsg = '未找到引用消息内容，请在手机中确认'
+      if (this.setChatBoxFootVnode) this.setChatBoxFootVnode(this.quoteFootComponent)
+    }).finally(() => { this.loading = false })
+  }
+}
+</script>
+<style lang="less">
+.sdk-chat-wework-control-text-quote { min-width: 0; }
+.sdk-chat-wework-control-text-quote__box { margin: 10px 0 0; padding: 7px 8px; background: rgba(0, 0, 0, .06); border-radius: 3px; max-width: 420px; line-height: 1.5em; }
+.sdk-chat-wework-control-text-quote__author { color: #999; word-break: break-all; }
+.sdk-chat-wework-control-text-quote__content, .sdk-chat-wework-control-text-quote__status { white-space: pre-wrap; word-break: break-all; }
+.sdk-chat-wework-control-text-quote__status { color: #999; font-size: 12px; }
+</style>

package/components/wework-chat-control/text/text.vue

@@ -1,177 +1,37 @@
 <template>
-  <div
-    class="sdk-chat-wework-control-text"
-    :class="['sdk-chat-wework-control-text--' + type]"
-  >
-    <div class="sdk-chat-wework-control-text__main">
-      <template v-if="hasScroll">
-        <ui-popover
-          :value="showPopover"
-          @input="handleShowPopoverChange"
-        >
-          <template slot="reference">
-            <div class="sdk-chat-wework-control-text__content" 
-              v-html="html" 
-              ref="popoverContent"
-            ></div>
-          </template>
-          <div class="sdk-chat-wework-control-text__popover" v-html="html" :style="{'width': popoverWidth}"></div>
-        </ui-popover>
-      </template>
-      <template v-else>
-        <div class="sdk-chat-wework-control-text__content" 
-          v-html="html" 
-          ref="content"
-        ></div>
-      </template>
-    </div>
-  </div>
+  <component
+    :is="contentObject && contentObject.quote ? quoteComponent : defaultComponent"
+    v-bind="componentProps"
+  ></component>
 </template>
 <script>
-import { Popover as UiPopover } from '@aochuang/common/components'
-import { parseWechatEmoji } from '@aochuang/common/common/wechat-emoji'
-import { html2Escape } from '../../../utils/string'
+import TextDefault from './text-default.vue'
+import TextQuote from './text-quote.vue'
 
-function parseTextContent (content) {
-  if (typeof content !== 'string') {
-    return content
-  }
-  try {
-    const data = JSON.parse(content)
-    if (data && typeof data === 'object') {
-      return data
-    }
-  } catch (e) {
-    return content
-  }
-  return content
+function parseContent (content) {
+  if (typeof content !== 'string') return content
+  try { return JSON.parse(content) } catch (e) { return content }
 }
 
 export default {
   name: 'SdkChatControlText',
-  components: {
-    UiPopover
-  },
+  components: {TextDefault, TextQuote},
+  inheritAttrs: false,
   props: {
-    id: {
-      type: String
-    },
-    content: {
-      type: String
-    },
-    type: {
-      type: String,
-      default: 'default',
-      validator (value) {
-        return ['quote', 'default', 'thumb'].includes(value)
-      }
-    },
-    formatter: {
-      type: Function
-    }
-  },
-  data () {
-    return {
-      hasScroll: false,
-      showPopover: false,
-      popoverWidth: null
-    }
+    id: {type: String},
+    content: {type: [String, Object]},
+    type: {type: String, default: 'default'},
+    formatter: {type: Function},
+    getQuoteMessage: {type: Function},
+    setChatBoxFootVnode: {type: Function}
   },
   computed: {
-    nextContent () {
-      return parseTextContent(this.content)
-    },
-    text () {
-      if (this.nextContent && typeof this.nextContent === 'object') {
-        return this.nextContent.text || ''
-      }
-      return this.nextContent
-    },
-    html () {
-      let content = this.text
-      if (this.formatter) {
-        content = this.formatter({
-          content: this.nextContent
-        })
-      } else {
-        content = parseWechatEmoji(html2Escape(String(content || '')), false)
-      }
-      if (!content) {
-        return ''
-      }
-      content = String(content)
-      content = content.replace(/(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig, item => {
-        return `<a href="${item}" target='_blank'>${item}</a>`
-      })
-      return content.trim()
-    }
-  },
-  mounted () {
-    if (this.$refs.content) {
-      this.hasScroll = this.$refs.content.scrollHeight > this.$refs.content.clientHeight
-    }
-  },
-  methods: {
-    handleShowPopoverChange (visible) {
-      if (this.$refs.popoverContent && visible) {
-        this.popoverWidth = this.$refs.popoverContent.offsetWidth + 'px'
-      }
-      this.$nextTick(() => {
-        this.showPopover = visible
-      })
+    contentObject () { return parseContent(this.content) },
+    defaultComponent () { return TextDefault },
+    quoteComponent () { return TextQuote },
+    componentProps () {
+      return Object.assign({}, this.$attrs, this.$props, {getQuoteMessage: this.getQuoteMessage})
     }
   }
 }
 </script>
-<style lang="less">
-.sdk-chat-wework-control-text--default {
-  .sdk-chat-wework-control-text__main{
-    padding: 10px;
-  }
-} 
-.sdk-chat-wework-control-text--quote {
-  .sdk-chat-wework-control-text__content{
-    display: -webkit-box;
-    -webkit-box-orient: vertical;
-    -webkit-line-clamp: 2; /* 限制显示3行 */
-    overflow: hidden;
-    max-width: 420px;
-  }
-}
-.sdk-chat-wework-control-text--thumb {
-  background-color: #fff;
-  border: 1px solid #eee;
-  border-radius: 3px;
-  padding: 6px 10px;
-  .sdk-chat-wework-control-text__content{
-    display: -webkit-box;
-    -webkit-box-orient: vertical;
-    -webkit-line-clamp: 3; /* 限制显示3行 */
-    overflow: hidden;
-  }
-}
-.sdk-chat-wework-control-text__main{
-  white-space: pre-wrap;
-  line-height: 1.5em;
-  word-break: break-all;
-  img {
-    vertical-align: top;
-  }
-  a {
-    color: #4387ff;
-    &:hover {
-      color: #4387ff;
-      text-decoration: underline;
-    }
-  }
-}
-.sdk-chat-wework-control-text__popover{
-  white-space: pre-wrap;
-  line-height: 1.5em;
-  word-break: break-all;
-  padding: 10px;
-  img {
-    vertical-align: top;
-  }
-}
-</style>

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

@@ -112,23 +112,15 @@ export function formatShortMessage (msgType, msgContent) {
         case MESSAGE_TYPE.SYSTEM:
             shortMessage = formatSystemMessage(msgContent)
             break
-        case MESSAGE_TYPE.URL:
         case MESSAGE_TYPE.URLFile:
+            shortMessage = '[文件消息]'
+            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') {
+                if(jsonObj.contentType === 78) {
                     shortMessage = '[小程序消息]'
-                } else if (jsonObj.type === 'music') {
-                    shortMessage = '[音乐消息]'
-                } else if (jsonObj.type === 'merged') {
-                    shortMessage = '[合并消息]'
-                } else {
-                    shortMessage = '[链接消息]'
                 }
             } else {
                 shortMessage = '[链接消息]'

package/components/wework-chat-panel/chat-panel-item.vue

@@ -16,11 +16,14 @@
           @user-avatar-click="handleUserAvatarClick"
           @user-avatar-contextmenu="handleUserAvatarContextmenu"
           >
-          <sdk-chat-control-text
-            v-bind="configData"
-            :id="item.id"
-            :content="msgContent"
-          ></sdk-chat-control-text>
+          <template slot-scope="{ setFootVnode }">
+            <sdk-chat-control-text
+              v-bind="configData"
+              :id="item.id"
+              :content="msgContent"
+              :set-chat-box-foot-vnode="setFootVnode"
+            ></sdk-chat-control-text>
+          </template>
           <template slot="append" slot-scope="{ updateProp }">
             <slot name="chat-append" :item="item" :update-chat-box-prop="updateProp"></slot>
           </template>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aochuang/client-sdk",
-  "version": "1.0.354",
+  "version": "1.0.356",
   "description": "",
   "files": [
     "common",