@aochuang/client-sdk 1.0.278

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

@@ -0,0 +1,179 @@
+<template>
+  <div class="sdk-chat-control-location" :class="['sdk-chat-control-location--' + type]">
+    <template v-if="type === 'default'">
+      <div class="sdk-chat-control-location__main">
+        <div class="sdk-chat-control-location__head">
+          <h4 class="sdk-chat-control-location__title">{{address}}</h4>
+        </div>
+        <div class="sdk-chat-control-location__body">
+          <div v-if="offline" class="sdk-chat-control-location__offline">
+            <div class="sdk-chat-control-location__offline-label">腾讯地图经纬度坐标：</div>
+            <div class="sdk-chat-control-location__offline-value">{{longitude}}、{{latitude}}</div>
+            <div class="sdk-chat-control-location__offline-tips">提示：离线模式无法显示地图</div>
+          </div>
+          <ac-static-map :map-key="mapKey" v-else :enable-link="false" width="280" height="160" :lng="longitude" :lat="latitude" @map-created="handleStaticMapCreated"></ac-static-map>
+        </div>
+      </div>
+    </template>
+    <template v-else-if="type === 'quote'">
+      <div class="sdk-chat-control-location__main">
+        <span class="sdk-chat-control-location__icon">
+          <svg t="1752133896251" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25831" width="200" height="200"><path d="M512 1012.394667l-271.530667-271.530667a384 384 0 1 1 543.061334 0L512 1012.394667z m211.2-331.861334a298.666667 298.666667 0 1 0-422.4 0L512 891.733333l211.2-211.2zM512 554.666667a85.333333 85.333333 0 1 1 0-170.666667 85.333333 85.333333 0 0 1 0 170.666667z" fill="currentColor" p-id="25832"></path></svg>
+        </span>
+        <span class="sdk-chat-control-location__title">{{address}}</span>
+        <ac-static-map :map-key="mapKey" :enable-link="false" width="52" height="52" :lng="longitude" :lat="latitude" @map-created="handleStaticMapCreated"></ac-static-map>
+      </div>
+    </template>
+  </div>
+</template>
+<script>
+import AcStaticMap from '@aochuang/common/common/static-map'
+import { parseXml } from '../../../utils/json'
+
+export default {
+  name: 'SdkChatControlLocation',
+  components: {
+    AcStaticMap
+  },
+  props: {
+    id: {
+      type: String
+    },
+    content: {
+      type: String
+    },
+    type: {
+      type: String,
+      default: 'default',
+      validator (value) {
+        return ['quote', 'default'].includes(value)
+      }
+    },
+    /**
+     * 离线模式
+     * 微聊天面板下载到本地浏览时会没有网络
+    */
+    offline: {
+      type: Boolean,
+      default: false
+    },
+    mapKey: {
+      type: String,
+      required: true
+    },
+    updateChatBoxProp: {
+      type: Function
+    }
+  },
+  computed: {
+    nextContent () {
+      // 政企版有这种数据，需要去除一下
+      // jojo4943:<br><msg><br> <location x="28.231337" y="113.041611" scale="15" label="湖南省长沙市开福区国润月湖郡7栋" maptype="roadmap" poiname="马栏山博创园" poiid="qqmap_1533871097335282393" buildingId="" floorName="" poiCategoryTips="房产小区:产业园区" poiBusinessHour="" poiPhone="" poiPriceTips="" isFromPoiList="true" adcode="430105" cityname="长沙市" fromusername="jojo4943" /><br></msg><br>
+      return parseXml((this.content || '').replace(/^.*?(?=<)/, '').replace(/<br>/ig, '')) || {}
+    },
+    address () {
+      return (this.nextContent.msg.location.cityname || '') + (this.nextContent.msg.location.label || '') + (this.nextContent.msg.location.poiname || '')
+    },
+    latitude () {
+      return Number(this.nextContent.msg.location.x)
+    },
+    longitude () {
+      return Number(this.nextContent.msg.location.y)
+    },
+  },
+  methods: {
+    handleStaticMapCreated ({ mapHref }) {
+      this.updateChatBoxProp && this.updateChatBoxProp('href', mapHref)
+    }
+  }
+}
+</script>
+<style lang="less">
+.sdk-chat-control-location--default {
+  .sdk-chat-control-location__body{
+    line-height: 0;
+  }
+  .sdk-chat-control-location__head{
+    padding: 4px 12px;
+  }
+  .sdk-chat-control-location__title{
+    font-weight: normal;
+    margin: 4px 0;
+    line-height: 1.7em;
+    color: #484848;
+  }
+  .sdk-chat-control-location__description{
+    color: #888;
+    line-height: 1.7em;
+    margin: 4px 0;
+  }
+  .sdk-chat-control-location__offline{
+    height: 160px;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    line-height: 1.7em;
+    padding-bottom: 36px;
+    box-sizing: border-box;
+    position: relative;
+    overflow: hidden;
+    &:after{
+      content: '';
+      position: absolute;
+      left: 0;
+      right: 0;
+      top: 0;
+      bottom: 0;
+      background: url(./offline-bg.png) no-repeat 0 0 #f3f9f9;
+      background-size: cover;
+      filter: blur(4px)
+    }
+  }
+  .sdk-chat-control-location__offline-value{
+    font-size: 20px;
+  }
+  .sdk-chat-control-location__offline-value,
+  .sdk-chat-control-location__offline-label{
+    padding: 6px 12px;
+    position: relative;
+    z-index: 3;
+  }
+  .sdk-chat-control-location__offline-tips{
+    position: absolute;
+    left: 0;
+    bottom: 0;
+    height: 24px;
+    line-height: 24px;
+    padding: 6px 12px;
+    color: #999;
+    z-index: 3;
+  }
+}
+.sdk-chat-control-location__body{
+  overflow: hidden;
+}
+.sdk-chat-control-location--quote {
+  .sdk-chat-control-location__main{
+    display: flex;
+    flex-direction: row;
+    max-width: 360px;
+  }
+  .sdk-chat-control-location__icon{
+    display: inline-block;
+    width: 18px;
+    height: 18px;
+    margin-right: 4px;
+    min-width: 18px;
+    vertical-align: top;
+    margin-top: 2px;
+    color: #999;
+    svg {
+      width: 100%;
+      height: 100%;
+    }
+  }
+  .sdk-chat-control-location__title{
+    margin-right: 6px;
+  }
+}
+</style>

package/components/wechat-chat-control/member-change/member-change.vue

@@ -0,0 +1,37 @@
+<template>
+  <div class="sdk-chat-control-member-change">
+    {{ text }}
+  </div>
+</template>
+<script>
+import { parse } from '../../../utils/json'
+
+export default {
+  name: 'SdkChatControlMemberChange',
+  props: {
+    id: {
+      type: String
+    },
+    content: {
+      type: [Object, String]
+    }
+  },
+  computed: {
+    nextContent () {
+      return parse(this.content) || {}
+    },
+    text () {
+      return this.nextContent.content
+    }
+  }
+}
+</script>
+<style lang="less">
+.sdk-chat-control-member-change{
+  text-align: center;
+  color: #999;
+  font-size: 12px;
+  width: 100%;
+  padding: 12px;
+}
+</style>

package/components/wechat-chat-control/music/icons/163.svg

@@ -0,0 +1,12 @@
+<svg width="595.28" height="595.28" xmlns="http://www.w3.org/2000/svg">
+ <metadata/>
+
+ <g>
+  <title>background</title>
+  <rect fill="none" id="canvas_background" height="402" width="582" y="-1" x="-1"/>
+ </g>
+ <g>
+  <title>Layer 1</title>
+  <path stroke-width="0" id="svg_32" d="m141.306,56.734681c-8.167,-5.286 -18.158,-8.186 -28.464,-8.699l-2.292,-8.414l0.076,0.081c-0.104,-0.252 -0.171,-0.497 -0.266,-0.734l-0.676,-2.491c-1.559,-7.192 1.284,-10.62 2.748,-11.855c0.257,-0.185 0.514,-0.375 0.789,-0.556c6.712,-4.463 16.276,2.686 16.818,3.109c4.249,4.079 12.007,5.089 16.19,0.91c4.24,-4.221 3.232,-12.114 -0.989,-16.328c-6.598,-6.574 -26.819,-17.12 -44.036,-5.676c-15.468,10.284 -15.782,24.759 -13.234,33.123l3.091,11.317c-5.181,1.483 -10.125,3.605 -14.66,6.372c-16.942,10.351 -25.432,27.813 -23.312,47.925c2.187,20.625 17.655,35.613 36.792,35.613c20.307,0 36.84,-16.488 36.84,-36.75c-0.267,-4.839 -0.219,-4.78 -0.855,-9.108c-0.646,-4.216 -6.884,-24.046 -6.884,-24.046c3.822,0.884 7.416,2.327 10.516,4.331c34.938,22.648 20.402,58.697 19.736,60.27c-9.611,23.029 -30.604,36.776 -57.556,37.722c-17.579,0.618 -34.425,-5.933 -47.421,-18.451c-13.719,-13.193 -21.572,-31.682 -21.572,-50.718c0,-28.668 18.073,-54.706 44.988,-64.776c5.6,-2.094 10.134,-8.067 7.035,-15.007c-2.443,-5.452 -9.042,-7.327 -14.65,-5.222c-35.329,13.215 -59.058,47.379 -59.058,85.005c0,24.871 10.277,49.023 28.198,66.267c16.523,15.903 37.791,24.557 60.161,24.557c1.027,0 2.044,-0.017 3.061,-0.055c35.281,-1.238 64.002,-20.305 76.789,-50.91c7.986,-18.591 12.445,-60.657 -27.903,-86.806zm-36.26,46.948c0,8.342 -6.808,15.13 -15.164,15.13c-9.289,0 -14.413,-8.43 -15.23,-16.264c-1.578,-14.926 6.237,-23.047 13.082,-27.226c2.767,-1.689 5.819,-3.018 9.003,-3.979c0,0 7.378,23.404 7.957,27.033c0.628,4.008 0.352,5.306 0.352,5.306z" fill="#E60012"/>
+ </g>
+</svg>

package/components/wechat-chat-control/music/icons/default.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="1604404752051" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6436" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M682.9 399.9c-19.9-29.6-27.2-66.5-23.8-119.6 0-0.4-0.1-0.9 0-1.3 0-0.9 0-1.7-0.1-2.5l-0.3-2.4c-0.1-0.8-0.3-1.5-0.5-2.2-0.2-0.8-0.5-1.6-0.8-2.3-0.3-0.7-0.6-1.3-0.9-2l-1.2-2.1c-0.4-0.6-0.9-1.2-1.3-1.8-0.5-0.6-1-1.2-1.6-1.8-0.5-0.6-1.1-1.1-1.7-1.6-0.6-0.5-1.3-1-1.9-1.5-0.6-0.4-1.2-0.8-1.9-1.2l-2.4-1.2c-0.4-0.2-0.7-0.4-1.1-0.5-0.3-0.1-0.6-0.1-0.9-0.2-0.8-0.3-1.7-0.5-2.5-0.6-0.8-0.2-1.6-0.3-2.3-0.4-0.4 0-0.7-0.2-1.1-0.2-0.5 0-0.9 0.1-1.4 0.1-0.8 0-1.5 0-2.3 0.1-1 0.1-2 0.2-3 0.4-0.5 0.1-0.9 0.2-1.3 0.3-1.2 0.3-2.4 0.7-3.5 1.2l-0.6 0.3c-1.3 0.6-2.5 1.3-3.6 2.1-0.1 0.1-0.2 0.2-0.3 0.2-1.1 0.8-2.2 1.7-3.1 2.8l-0.5 0.5c-0.9 1-1.7 2-2.4 3.1l-0.6 0.9c-0.6 1-1.1 2.1-1.5 3.2-0.1 0.3-0.3 0.5-0.4 0.8l-149 405.7-4.6 10.2c-8.6 19.3-23.5 29.9-46.8 33.2-11.2 1.6-23.8 1-39.4-2.1-15.4-3.1-28.6-10.7-37-21.5-5.5-7-11.4-18.5-8.4-33.7 5.1-25.2 32.2-39.6 63.1-33.4l6.9 1.4c9.4 1.9 18.8 6.8 27.8 12 1.5 0.8 4.1 2 5.7 2.5 12.9 4 26.6-3.2 30.6-16.1 3.7-11.9-2.2-24.6-13.3-29.5-11.6-6.6-25.4-13.6-41.2-16.8l-6.9-1.4c-57.2-11.5-110.2 20-120.6 71.7-5.2 26 1.1 52.1 17.8 73.4 15.6 19.9 39 33.8 66.9 39.4 12.5 2.5 24.2 3.8 35.3 3.8 6.8 0 13.3-0.5 19.7-1.4 39.7-5.8 68.9-27.1 84.3-61.5l4.9-10.9c0.2-0.4 0.2-0.8 0.4-1.1 0.1-0.2 0.2-0.3 0.3-0.6L621.7 385c4.9 14.3 11.5 28.5 20.6 42.1 8.3 12.4 17.1 23 25.5 33.2 23.7 28.8 35.9 45.1 31.9 74.6-1.8 13.4 7.5 25.7 20.9 27.5 1.1 0.2 2.2 0.2 3.3 0.2 12 0 22.5-8.9 24.2-21.1 7.1-52-19.3-84-42.6-112.3-7.7-9.2-15.6-18.8-22.6-29.3z" fill="#333333" p-id="6437"></path><path d="M700.9 789.4c-55.4 37.6-120.3 57.4-187.6 57.4-184.7 0-335-150.3-335-335 0-66.4 19.4-130.5 56-185.5 7.5-11.2 4.4-26.4-6.8-33.9s-26.4-4.4-33.9 6.8c-42 63-64.2 136.5-64.2 212.6 0 211.6 172.2 383.8 383.8 383.8 77.1 0 151.4-22.8 215-65.8 11.2-7.6 14.1-22.7 6.5-33.9-7.5-11.2-22.7-14.1-33.8-6.5zM513.3 128c-82 0-160.2 25.5-226.1 73.6-10.9 8-13.3 23.2-5.3 34.1 8 10.9 23.2 13.3 34.1 5.3 57.6-42 125.8-64.3 197.3-64.3 184.7 0 335 150.3 335 335 0 71.5-22.2 139.7-64.3 197.3-7.9 10.9-5.6 26.2 5.3 34.1 4.4 3.2 9.4 4.7 14.4 4.7 7.5 0 15-3.5 19.7-10 48.2-66 73.6-144.2 73.6-226.1 0.1-211.5-172.1-383.7-383.7-383.7z" fill="#333333" p-id="6438"></path></svg>

package/components/wechat-chat-control/music/icons/qq.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="1710381071549" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4321" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M26.815226 538.816181A485.183819 485.183819 0 1 0 511.999044 53.508885 485.183819 485.183819 0 0 0 26.815226 538.816181z m0 0" fill="#F8C913" p-id="4322"></path><path d="M659.883797 12.349756c-18.151176 20.78536-57.170031 38.977696-109.030534 51.901662-88.121696 20.78536-106.272872 25.930252-132.244283 41.488403a190.896043 190.896043 0 0 0-43.793314 30.869347C354.030305 154.883821 338.513314 188.593148 343.740523 199.006408c2.510707 5.144891 51.901662 75.19773 111.541241 160.808719 59.639579 82.976805 116.686132 166.077088 129.733576 184.228264a275.766168 275.766168 0 0 1 20.579565 34.285555c0 2.510707-10.41326 0-20.579565-2.634185-41.61188-13.006285-114.298903 0-166.077087 25.930252a268.522161 268.522161 0 0 0-101.251459 100.592912 181.635239 181.635239 0 0 0-7.902553 137.14222 192.130817 192.130817 0 0 0 93.266588 98.781911c34.285555 18.151176 41.488403 18.151176 85.610989 20.579565a228.638964 228.638964 0 0 0 77.831914-5.144892c96.024249-28.564436 165.95361-103.762166 171.427774-192.007339 2.634184-49.390955-2.634184-64.825629-67.418654-179.001054-101.374936-176.119915-192.213135-336.928634-192.213135-339.727455 0 0 18.192335-2.510707 41.488403-5.144891a171.427774 171.427774 0 0 0 150.518937-90.550085c13.129762-23.419545 13.129762-31.19862 13.129762-80.466098a238.31136 238.31136 0 0 0-5.144891-62.314922c-2.634184-7.779075-5.268369-5.144891-18.151176 7.779075z m0 0" fill="#02B053" p-id="4323"></path></svg>

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

@@ -0,0 +1,156 @@
+<template>
+  <div class="sdk-wechat-chat-panel-control-share-music" :class="['sdk-wechat-chat-panel-control-share-music--' + type]">
+    <template v-if="type === 'default'">
+      <div class="sdk-wechat-chat-panel-control-share-music__main">
+        <div class="sdk-wechat-chat-panel-control-share-music__cover">
+          <ui-image :src="cover" width="100%" height="100%" fit="cover" :radius="0"></ui-image>
+        </div>
+        <div class="sdk-wechat-chat-panel-control-share-music__content">
+          <div class="sdk-wechat-chat-panel-control-share-music__row">
+            <div class="sdk-wechat-chat-panel-control-share-music__title">{{ title }}</div>
+          </div>
+          <div class="sdk-wechat-chat-panel-control-share-music__row">
+            <div class="sdk-wechat-chat-panel-control-share-music__description">{{ desc }}</div>
+          </div>
+        </div>
+      </div>
+      <div class="sdk-wechat-chat-panel-control-share-music__other">
+        <span class="sdk-wechat-chat-panel-control-share-music__other-icon" :style="{'background-image': `url(${provide.icon})`}"></span>
+        <span class="sdk-wechat-chat-panel-control-share-music__other-text">{{ provide.name }}</span>
+      </div>
+    </template>
+    <template v-else-if="type === 'quote'">
+      <div class="sdk-wechat-chat-panel-control-share-music__icon">
+        <svg t="1752134148267" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25999" width="200" height="200"><path d="M512 577.493333V128h341.333333v85.333333h-256v512a170.666667 170.666667 0 1 1-85.333333-147.84zM426.666667 810.666667a85.333333 85.333333 0 1 0 0-170.666667 85.333333 85.333333 0 0 0 0 170.666667z" fill="currentColor" p-id="26000"></path></svg>
+      </div>
+      <div class="sdk-wechat-chat-panel-control-share-music__title">{{ title }}</div>
+      <div class="sdk-wechat-chat-panel-control-share-music__cover">
+        <ui-image :src="cover" width="100%" height="100%" fit="cover" :radius="0"></ui-image>
+      </div>
+    </template>
+  </div>
+</template>
+<script>
+import { parseXml } from '../../../utils/json'
+import { getProvideMetaByUrl } from './utils'
+
+export default {
+  name: 'SdkChatControlShareMusic',
+  props: {
+    id: {
+      type: String
+    },
+    content: {
+      type: String
+    },
+    type: {
+      type: String,
+      default: 'default',
+      validator (value) {
+        return ['quote', 'default'].includes(value)
+      }
+    }
+  },
+  computed: {
+    nextContent () {
+      return parseXml(this.content) || {}
+    },
+    cover () {
+      return this.nextContent.msg && this.nextContent.msg.appmsg && this.nextContent.msg.appmsg.songalbumurl
+    },
+    url () {
+      return this.nextContent.msg && this.nextContent.msg.appmsg && this.nextContent.msg.appmsg.url
+    },
+    title () {
+      return this.nextContent.msg && this.nextContent.msg.appmsg && this.nextContent.msg.appmsg.title
+    },
+    desc () {
+      return this.nextContent.msg && this.nextContent.msg.appmsg && this.nextContent.msg.appmsg.des
+    },
+    provide () {
+      return getProvideMetaByUrl(this.url)
+    }
+  }
+}
+</script>
+<style lang="less">
+.sdk-wechat-chat-panel-control-share-music--default {
+  .sdk-wechat-chat-panel-control-share-music__main{
+    display: flex;
+    flex-direction: row;
+    width: 248px;
+    padding: 6px;
+  }
+  .sdk-wechat-chat-panel-control-share-music__cover{
+    width: 60px;
+    height: 60px;
+    border-top-left-radius: 2px;
+    border-bottom-left-radius: 2px;
+    overflow: hidden;
+  }
+  .sdk-wechat-chat-panel-control-share-music__content {
+    height: 60px;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    flex: 1;
+    min-width: 0;
+    padding: 12px;
+    box-sizing: border-box!important;
+  }
+  .sdk-wechat-chat-panel-control-share-music__title,
+  .sdk-wechat-chat-panel-control-share-music__description{
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+  }
+  .sdk-wechat-chat-panel-control-share-music__description{
+    color: #999;
+  }
+  .sdk-wechat-chat-panel-control-share-music__other{
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    border-top: 1px solid #eee;
+    padding: 3px 6px;
+  }
+  .sdk-wechat-chat-panel-control-share-music__other-icon{
+    width: 16px;
+    height: 16px;
+    background-position: 50% 50%;
+    background-size: cover;
+    background-repeat: no-repeat;
+    display: inline-block;
+    margin-right: 4px;
+  }
+  .sdk-wechat-chat-panel-control-share-music__other-text {
+    color: #666;
+    font-size: 12px;
+  }
+}
+.sdk-wechat-chat-panel-control-share-music--quote {
+  display: flex;
+  flex-direction: row;
+  .sdk-wechat-chat-panel-control-share-music__icon {
+    display: inline-block;
+    width: 18px;
+    height: 18px;
+    margin-right: 4px;
+    min-width: 18px;
+    vertical-align: top;
+    margin-top: 2px;
+    color: #999;
+    svg {
+      width: 100%;
+      height: 100%;
+    }
+  }
+  .sdk-wechat-chat-panel-control-share-music__cover {
+    width: 52px;
+    height: 52px;
+  }
+  .sdk-wechat-chat-panel-control-share-music__title{
+    margin-right: 6px;
+  }
+}
+</style>

package/components/wechat-chat-control/music/utils.js

@@ -0,0 +1,30 @@
+import { parseUrl } from '../../../utils/url'
+
+/**
+ * 根据音乐播放地址获取厂商名称
+*/
+export function getProvideMetaByUrl (url) {
+  const urlMeta = parseUrl(url)
+  if (!urlMeta) {
+    return
+  }
+  const provideMap = {
+    qq: {
+      name: 'QQ音乐',
+      icon: require('./icons/qq.svg')
+    },
+    163: {
+      name: '网易音乐',
+      icon: require('./icons/163.png')
+    },
+    kuwo: {
+      name: '酷我音乐',
+      icon: require('./icons/kuwo.png')
+    },
+    unknow: {
+      name: '音乐',
+      icon: require('./icons/default.png')
+    }
+  }
+  return provideMap[urlMeta.domain.toLowerCase()] || provideMap.unknow
+}