@tencentcloud/ai-desk-customer-vue 0.1.3 → 0.1.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/CustomerServiceChat/index-web.vue +6 -14
- package/components/CustomerServiceChat/message-input/message-input-quote/index.vue +3 -14
- package/components/CustomerServiceChat/message-input-toolbar/emoji-dialog-mobile/emoji-dialog-mobile.vue +2 -5
- package/components/CustomerServiceChat/message-input-toolbar/emoji-picker/emoji-picker-dialog.vue +8 -15
- package/components/CustomerServiceChat/message-input-toolbar/file-upload/index.vue +3 -7
- package/components/CustomerServiceChat/message-input-toolbar/image-upload/index.vue +6 -44
- package/components/CustomerServiceChat/message-input-toolbar/index-web.vue +1 -14
- package/components/CustomerServiceChat/message-input-toolbar/style/uni.scss +0 -56
- package/components/CustomerServiceChat/message-input-toolbar/toolbar-item-container/index.vue +4 -7
- package/components/CustomerServiceChat/message-input-toolbar/toolbar-item-container/style/index.scss +0 -1
- package/components/CustomerServiceChat/message-input-toolbar/video-upload/index.vue +7 -50
- package/components/CustomerServiceChat/message-list/index-web.vue +3 -7
- package/components/CustomerServiceChat/message-list/message-elements/{plugins/plugin-components → message-desk}/index.ts +1 -1
- package/components/{customer-icon.vue → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/customer-icon.vue} +0 -9
- package/components/CustomerServiceChat/message-list/message-elements/{plugins/plugin-components/message-customer → message-desk/message-desk-elements}/index.ts +1 -1
- package/components/{message-branch.vue → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-branch.vue} +4 -4
- package/components/CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-desk.vue +126 -0
- package/components/{message-multi-branch → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-multi-branch}/branch-pc.vue +1 -1
- package/components/{message-multi-branch → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-multi-branch}/index.vue +2 -3
- package/components/{message-multi-form → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-multi-form}/component-mobile/form-popup.vue +2 -3
- package/components/{message-multi-form → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-multi-form}/component-mobile/input-mobile.vue +1 -1
- package/components/{message-multi-form → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-multi-form}/component-mobile/radios-mobile.vue +7 -7
- package/components/{message-multi-form → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-multi-form}/component-pc/input-pc.vue +1 -1
- package/components/{message-multi-form → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-multi-form}/component-pc/radio-pc.vue +4 -5
- package/components/{message-multi-form → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-multi-form}/form-mobile.vue +8 -7
- package/components/{message-multi-form → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-multi-form}/form-pc.vue +5 -5
- package/components/{message-multi-form → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-multi-form}/index.vue +3 -3
- package/components/{message-product-card.vue → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-product-card.vue} +2 -2
- package/components/{message-rating → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-rating}/index.vue +4 -4
- package/components/{message-rating → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-rating}/message-rating-number.vue +3 -3
- package/components/{message-rating → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-rating}/message-rating-star.vue +5 -5
- package/components/{message-rich-text.vue → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-rich-text.vue} +5 -17
- package/components/{message-robot-welcome.vue → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-robot-welcome.vue} +7 -7
- package/components/{message-form → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-single-form}/form-input.vue +5 -5
- package/components/{message-form → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-single-form}/index.vue +1 -1
- package/components/{message-stream.vue → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-stream.vue} +2 -2
- package/{styles → components/CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/styles}/common.scss +1 -1
- package/components/CustomerServiceChat/message-list/message-elements/{plugins/plugin-components → message-desk}/message-plugin-layout-web.vue +2 -9
- package/components/CustomerServiceChat/message-list/message-elements/{plugins/plugin-components → message-desk}/message-plugin-web.vue +5 -5
- package/components/CustomerServiceChat/message-list/message-elements/message-quote/index-web.vue +2 -4
- package/components/CustomerServiceChat/message-list/message-elements/message-record/index.vue +3 -6
- package/components/CustomerServiceChat/message-list/message-elements/simple-message-list/index.vue +3 -29
- package/components/CustomerServiceChat/style/index.scss +0 -2
- package/components/common/Avatar/index.vue +2 -23
- package/components/common/BottomPopup/index.vue +2 -3
- package/components/common/Dialog/index.vue +2 -2
- package/components/common/ImagePreviewer/index-web.vue +2 -84
- package/components/common/ProgressMessage/index.vue +0 -8
- package/index.ts +4 -13
- package/index.vue +1 -60
- package/package.json +1 -1
- package/server.ts +2 -12
- package/utils/chatStorage.ts +2 -11
- package/utils/index.ts +2 -1
- package/assets/audio-before-delete.svg +0 -4
- package/assets/audio-blue.png +0 -0
- package/assets/audio-bubble-blue.svg +0 -3
- package/assets/audio-bubble-red.svg +0 -3
- package/assets/audio-delete.svg +0 -10
- package/assets/audio.svg +0 -6
- package/assets/camera-uni.png +0 -0
- package/assets/face-uni.png +0 -0
- package/assets/more-uni.png +0 -0
- package/assets/translate.svg +0 -12
- package/assets/video-uni.png +0 -0
- package/components/CustomerServiceChat/message-input-toolbar/toolbar-item-container/style/uni.scss +0 -36
- package/components/CustomerServiceChat/message-list/link/index.ts +0 -23
- package/components/CustomerServiceChat/message-list/message-elements/plugins/plugin-components/message-customer/message-customer-service.vue +0 -22
- package/components/CustomerServiceChat/style/uni.scss +0 -12
- package/components/CustomerServiceChat/style/wx.scss +0 -5
- package/components/common/RichText/LICENSE +0 -21
- package/components/common/RichText/README.md +0 -244
- package/components/common/RichText/dist/mp-alipay/index.acss +0 -1
- package/components/common/RichText/dist/mp-alipay/index.axml +0 -1
- package/components/common/RichText/dist/mp-alipay/index.js +0 -8
- package/components/common/RichText/dist/mp-alipay/index.json +0 -1
- package/components/common/RichText/dist/mp-alipay/node/node.acss +0 -1
- package/components/common/RichText/dist/mp-alipay/node/node.axml +0 -1
- package/components/common/RichText/dist/mp-alipay/node/node.js +0 -1
- package/components/common/RichText/dist/mp-alipay/node/node.json +0 -1
- package/components/common/RichText/dist/mp-alipay/parser.js +0 -1
- package/components/common/RichText/dist/mp-baidu/index.css +0 -1
- package/components/common/RichText/dist/mp-baidu/index.js +0 -8
- package/components/common/RichText/dist/mp-baidu/index.json +0 -1
- package/components/common/RichText/dist/mp-baidu/index.swan +0 -1
- package/components/common/RichText/dist/mp-baidu/node/node.css +0 -1
- package/components/common/RichText/dist/mp-baidu/node/node.js +0 -1
- package/components/common/RichText/dist/mp-baidu/node/node.json +0 -1
- package/components/common/RichText/dist/mp-baidu/node/node.swan +0 -1
- package/components/common/RichText/dist/mp-baidu/parser.js +0 -1
- package/components/common/RichText/dist/mp-qq/index.js +0 -8
- package/components/common/RichText/dist/mp-qq/index.json +0 -1
- package/components/common/RichText/dist/mp-qq/index.qml +0 -1
- package/components/common/RichText/dist/mp-qq/index.qss +0 -1
- package/components/common/RichText/dist/mp-qq/node/node.js +0 -1
- package/components/common/RichText/dist/mp-qq/node/node.json +0 -1
- package/components/common/RichText/dist/mp-qq/node/node.qml +0 -1
- package/components/common/RichText/dist/mp-qq/node/node.qss +0 -1
- package/components/common/RichText/dist/mp-qq/parser.js +0 -1
- package/components/common/RichText/dist/mp-toutiao/index.js +0 -8
- package/components/common/RichText/dist/mp-toutiao/index.json +0 -1
- package/components/common/RichText/dist/mp-toutiao/index.ttml +0 -1
- package/components/common/RichText/dist/mp-toutiao/index.ttss +0 -1
- package/components/common/RichText/dist/mp-toutiao/node/node.js +0 -1
- package/components/common/RichText/dist/mp-toutiao/node/node.json +0 -1
- package/components/common/RichText/dist/mp-toutiao/node/node.ttml +0 -1
- package/components/common/RichText/dist/mp-toutiao/node/node.ttss +0 -1
- package/components/common/RichText/dist/mp-toutiao/parser.js +0 -1
- package/components/common/RichText/dist/mp-weixin/index.js +0 -8
- package/components/common/RichText/dist/mp-weixin/index.json +0 -1
- package/components/common/RichText/dist/mp-weixin/index.wxml +0 -1
- package/components/common/RichText/dist/mp-weixin/index.wxss +0 -1
- package/components/common/RichText/dist/mp-weixin/node/node.js +0 -1
- package/components/common/RichText/dist/mp-weixin/node/node.json +0 -1
- package/components/common/RichText/dist/mp-weixin/node/node.wxml +0 -1
- package/components/common/RichText/dist/mp-weixin/node/node.wxss +0 -1
- package/components/common/RichText/dist/mp-weixin/parser.js +0 -1
- package/components/common/RichText/dist/uni-app/components/mp-html/mp-html.vue +0 -498
- package/components/common/RichText/dist/uni-app/components/mp-html/node/node.vue +0 -587
- package/components/common/RichText/dist/uni-app/components/mp-html/parser.js +0 -1393
- package/components/common/RichText/dist/uni-app/static/app-plus/mp-html/js/handler.js +0 -1
- package/components/common/RichText/dist/uni-app/static/app-plus/mp-html/js/uni.webview.min.js +0 -1
- package/components/common/RichText/dist/uni-app/static/app-plus/mp-html/local.html +0 -1
- package/components/common/RichText/docs/.nojekyll +0 -0
- package/components/common/RichText/docs/index.html +0 -50
- package/components/common/RichText/docs/lib/docsify.min.js +0 -1
- package/components/common/RichText/docs/lib/prism-bash.min.js +0 -1
- package/components/common/RichText/docs/lib/search.min.js +0 -1
- package/components/common/RichText/docs/lib/vue.css +0 -858
- package/components/common/RichText/gulpfile.js +0 -113
- package/components/common/RichText/lint.js +0 -63
- package/components/common/RichText/package.json +0 -74
- package/components/common/RichText/plugins/README.md +0 -2
- package/components/common/RichText/plugins/audio/README.md +0 -25
- package/components/common/RichText/plugins/audio/build.js +0 -11
- package/components/common/RichText/plugins/audio/context.js +0 -7
- package/components/common/RichText/plugins/audio/index.js +0 -34
- package/components/common/RichText/plugins/audio/miniprogram/audio.js +0 -189
- package/components/common/RichText/plugins/audio/miniprogram/audio.json +0 -3
- package/components/common/RichText/plugins/audio/miniprogram/audio.wxml +0 -17
- package/components/common/RichText/plugins/audio/miniprogram/audio.wxss +0 -127
- package/components/common/RichText/plugins/audio/miniprogram/build.js +0 -3
- package/components/common/RichText/plugins/audio/uni-app/audio.vue +0 -269
- package/components/common/RichText/plugins/audio/uni-app/build.js +0 -3
- package/components/common/RichText/plugins/card/README.md +0 -30
- package/components/common/RichText/plugins/card/build.js +0 -14
- package/components/common/RichText/plugins/card/index.js +0 -7
- package/components/common/RichText/plugins/card/miniprogram/build.js +0 -3
- package/components/common/RichText/plugins/card/miniprogram/card.js +0 -26
- package/components/common/RichText/plugins/card/miniprogram/card.json +0 -3
- package/components/common/RichText/plugins/card/miniprogram/card.wxml +0 -9
- package/components/common/RichText/plugins/card/miniprogram/card.wxss +0 -55
- package/components/common/RichText/plugins/card/uni-app/build.js +0 -3
- package/components/common/RichText/plugins/card/uni-app/card.vue +0 -122
- package/components/common/RichText/plugins/editable/README.md +0 -137
- package/components/common/RichText/plugins/editable/config.js +0 -15
- package/components/common/RichText/plugins/editable/miniprogram/build.js +0 -813
- package/components/common/RichText/plugins/editable/miniprogram/index.js +0 -551
- package/components/common/RichText/plugins/editable/uni-app/build.js +0 -744
- package/components/common/RichText/plugins/editable/uni-app/index.js +0 -553
- package/components/common/RichText/plugins/emoji/README.md +0 -15
- package/components/common/RichText/plugins/emoji/index.js +0 -203
- package/components/common/RichText/plugins/highlight/README.md +0 -26
- package/components/common/RichText/plugins/highlight/config.js +0 -5
- package/components/common/RichText/plugins/highlight/index.js +0 -96
- package/components/common/RichText/plugins/highlight/miniprogram/build.js +0 -88
- package/components/common/RichText/plugins/highlight/prism.css +0 -125
- package/components/common/RichText/plugins/highlight/prism.min.js +0 -7
- package/components/common/RichText/plugins/highlight/uni-app/build.js +0 -88
- package/components/common/RichText/plugins/img-cache/README.md +0 -24
- package/components/common/RichText/plugins/img-cache/build.js +0 -16
- package/components/common/RichText/plugins/img-cache/index.js +0 -138
- package/components/common/RichText/plugins/latex/README.md +0 -16
- package/components/common/RichText/plugins/latex/build.js +0 -14
- package/components/common/RichText/plugins/latex/index.js +0 -77
- package/components/common/RichText/plugins/latex/katex.css +0 -1070
- package/components/common/RichText/plugins/latex/katex.min.js +0 -1
- package/components/common/RichText/plugins/markdown/README.md +0 -17
- package/components/common/RichText/plugins/markdown/index.js +0 -34
- package/components/common/RichText/plugins/markdown/marked.min.js +0 -6
- package/components/common/RichText/plugins/markdown/miniprogram/build.js +0 -70
- package/components/common/RichText/plugins/markdown/uni-app/build.js +0 -68
- package/components/common/RichText/plugins/search/README.md +0 -46
- package/components/common/RichText/plugins/search/miniprogram/index.js +0 -137
- package/components/common/RichText/plugins/search/uni-app/index.js +0 -132
- package/components/common/RichText/plugins/style/README.md +0 -30
- package/components/common/RichText/plugins/style/index.js +0 -129
- package/components/common/RichText/plugins/style/parser.js +0 -175
- package/components/common/RichText/plugins/template/README.md +0 -2
- package/components/common/RichText/plugins/template/build.js +0 -65
- package/components/common/RichText/plugins/template/index.js +0 -67
- package/components/common/RichText/plugins/txv-video/README.md +0 -18
- package/components/common/RichText/plugins/txv-video/build.js +0 -3
- package/components/common/RichText/plugins/txv-video/index.js +0 -46
- package/components/common/RichText/plugins/txv-video/miniprogram/build.js +0 -6
- package/components/common/RichText/plugins/txv-video/uni-app/build.js +0 -3
- package/components/common/RichText/src/miniprogram/index.js +0 -396
- package/components/common/RichText/src/miniprogram/index.json +0 -6
- package/components/common/RichText/src/miniprogram/index.wxml +0 -7
- package/components/common/RichText/src/miniprogram/index.wxss +0 -13
- package/components/common/RichText/src/miniprogram/node/node.js +0 -247
- package/components/common/RichText/src/miniprogram/node/node.json +0 -6
- package/components/common/RichText/src/miniprogram/node/node.wxml +0 -112
- package/components/common/RichText/src/miniprogram/node/node.wxss +0 -164
- package/components/common/RichText/src/miniprogram/parser.js +0 -1269
- package/components/common/RichText/src/uni-app/components/mp-html/mp-html.vue +0 -498
- package/components/common/RichText/src/uni-app/components/mp-html/node/node.vue +0 -585
- package/components/common/RichText/src/uni-app/components/mp-html/parser.js +0 -1393
- package/components/common/RichText/src/uni-app/static/app-plus/mp-html/js/handler.js +0 -254
- package/components/common/RichText/src/uni-app/static/app-plus/mp-html/js/uni.webview.min.js +0 -1
- package/components/common/RichText/src/uni-app/static/app-plus/mp-html/local.html +0 -33
- package/components/common/RichText/tools/config.js +0 -82
- package/components/common/RichText/tools/converter.js +0 -205
- package/components/common/RichText/tools/ifdef.js +0 -115
- package/components/common/RichText/tools/minifier.js +0 -40
- package/components/common/RichText/tools/plugin.js +0 -248
- package/components/message-customer-service.vue +0 -114
- package/script/fileCopy.js +0 -60
- package/script/syncVersion.js +0 -35
- /package/components/{message-multi-form → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-multi-form}/component-mobile/label-mobile.vue +0 -0
- /package/components/{message-multi-form → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-multi-form}/component-pc/label-pc.vue +0 -0
- /package/components/{message-form → CustomerServiceChat/message-list/message-elements/message-desk/message-desk-elements/message-single-form}/form-branch.vue +0 -0
|
@@ -1,269 +0,0 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<view v-if="controls" @click="onClick" class="_contain">
|
|
3
|
-
<!-- 海报和按钮 -->
|
|
4
|
-
<view class="_poster" :style="'background-image:url('+poster+')'">
|
|
5
|
-
<view class="_button" @tap="_buttonTap">
|
|
6
|
-
<view :class="playing?'_pause':'_play'" />
|
|
7
|
-
</view>
|
|
8
|
-
</view>
|
|
9
|
-
<!-- 曲名和作者 -->
|
|
10
|
-
<view class="_title">
|
|
11
|
-
<view class="_name">{{name||'未知音频'}}</view>
|
|
12
|
-
<view class="_author">{{author||'未知作者'}}</view>
|
|
13
|
-
</view>
|
|
14
|
-
<!-- 进度条 -->
|
|
15
|
-
<slider class="_slider" activeColor="#585959" block-size="12" handle-size="12" :disabled="error" :value="value" @changing="_seeking" @change="_seeked" />
|
|
16
|
-
<!--播放时间-->
|
|
17
|
-
<view class="_time">{{time||'00:00'}}</view>
|
|
18
|
-
</view>
|
|
19
|
-
</template>
|
|
20
|
-
|
|
21
|
-
<script>
|
|
22
|
-
/**
|
|
23
|
-
* @fileoverview audio 组件
|
|
24
|
-
*/
|
|
25
|
-
import context from './context'
|
|
26
|
-
export default {
|
|
27
|
-
data () {
|
|
28
|
-
return {
|
|
29
|
-
error: false,
|
|
30
|
-
playing: false,
|
|
31
|
-
time: '00:00',
|
|
32
|
-
value: 0
|
|
33
|
-
}
|
|
34
|
-
},
|
|
35
|
-
props: {
|
|
36
|
-
aid: String,
|
|
37
|
-
name: String, // 音乐名
|
|
38
|
-
author: String, // 作者
|
|
39
|
-
poster: String, // 海报图片地址
|
|
40
|
-
autoplay: [Boolean, String], // 是否自动播放
|
|
41
|
-
controls: [Boolean, String], // 是否显示控件
|
|
42
|
-
loop: [Boolean, String], // 是否循环播放
|
|
43
|
-
src: String // 源地址
|
|
44
|
-
},
|
|
45
|
-
watch: {
|
|
46
|
-
src (src) {
|
|
47
|
-
this.setSrc(src)
|
|
48
|
-
}
|
|
49
|
-
},
|
|
50
|
-
mounted () {
|
|
51
|
-
this._ctx = uni.createInnerAudioContext()
|
|
52
|
-
this._ctx.onError((err) => {
|
|
53
|
-
this.error = true
|
|
54
|
-
this.$emit('error', err)
|
|
55
|
-
})
|
|
56
|
-
this._ctx.onTimeUpdate(() => {
|
|
57
|
-
const time = this._ctx.currentTime
|
|
58
|
-
const min = parseInt(time / 60)
|
|
59
|
-
const sec = Math.ceil(time % 60)
|
|
60
|
-
this.time = (min > 9 ? min : '0' + min) + ':' + (sec > 9 ? sec : '0' + sec)
|
|
61
|
-
if (!this.lastTime) {
|
|
62
|
-
this.value = time / this._ctx.duration * 100 // 不在拖动状态下
|
|
63
|
-
}
|
|
64
|
-
})
|
|
65
|
-
this._ctx.onEnded(() => {
|
|
66
|
-
if (!this.loop) {
|
|
67
|
-
this.playing = false
|
|
68
|
-
}
|
|
69
|
-
})
|
|
70
|
-
context.set(this.aid, this)
|
|
71
|
-
this.setSrc(this.src)
|
|
72
|
-
},
|
|
73
|
-
beforeDestroy () {
|
|
74
|
-
this._ctx.destroy()
|
|
75
|
-
context.remove(this.aid)
|
|
76
|
-
},
|
|
77
|
-
onPageShow () {
|
|
78
|
-
if (this.playing && this._ctx.paused) {
|
|
79
|
-
this._ctx.play()
|
|
80
|
-
}
|
|
81
|
-
},
|
|
82
|
-
methods: {
|
|
83
|
-
// 设置源
|
|
84
|
-
setSrc (src) {
|
|
85
|
-
this._ctx.autoplay = this.autoplay
|
|
86
|
-
this._ctx.loop = this.loop
|
|
87
|
-
this._ctx.src = src
|
|
88
|
-
if (this.autoplay && !this.playing) {
|
|
89
|
-
this.playing = true
|
|
90
|
-
}
|
|
91
|
-
},
|
|
92
|
-
// 播放
|
|
93
|
-
play () {
|
|
94
|
-
this._ctx.play()
|
|
95
|
-
this.playing = true
|
|
96
|
-
this.$emit('play', {
|
|
97
|
-
target: {
|
|
98
|
-
id: this.aid
|
|
99
|
-
}
|
|
100
|
-
})
|
|
101
|
-
},
|
|
102
|
-
// 暂停
|
|
103
|
-
pause () {
|
|
104
|
-
this._ctx.pause()
|
|
105
|
-
this.playing = false
|
|
106
|
-
this.$emit('pause')
|
|
107
|
-
},
|
|
108
|
-
// 设置播放速率
|
|
109
|
-
playbackRate (rate) {
|
|
110
|
-
this._ctx.playbackRate = rate
|
|
111
|
-
},
|
|
112
|
-
// 移动进度条
|
|
113
|
-
seek (sec) {
|
|
114
|
-
this._ctx.seek(sec)
|
|
115
|
-
},
|
|
116
|
-
// 内部方法
|
|
117
|
-
_buttonTap () {
|
|
118
|
-
if (this.playing) this.pause()
|
|
119
|
-
else this.play()
|
|
120
|
-
},
|
|
121
|
-
_seeking (e) {
|
|
122
|
-
// 避免过于频繁 setData
|
|
123
|
-
if (e.timeStamp - this.lastTime < 200) return
|
|
124
|
-
const time = Math.round(e.detail.value / 100 * this._ctx.duration)
|
|
125
|
-
const min = parseInt(time / 60)
|
|
126
|
-
const sec = time % 60
|
|
127
|
-
this.time = (min > 9 ? min : '0' + min) + ':' + (sec > 9 ? sec : '0' + sec)
|
|
128
|
-
this.lastTime = e.timeStamp
|
|
129
|
-
},
|
|
130
|
-
_seeked (e) {
|
|
131
|
-
this.seek(e.detail.value / 100 * this._ctx.duration)
|
|
132
|
-
this.lastTime = undefined
|
|
133
|
-
},
|
|
134
|
-
onClick(e) {
|
|
135
|
-
this.$emit('onClick', e)
|
|
136
|
-
}
|
|
137
|
-
}
|
|
138
|
-
}
|
|
139
|
-
</script>
|
|
140
|
-
|
|
141
|
-
<style>
|
|
142
|
-
/* 顶层容器 */
|
|
143
|
-
._contain {
|
|
144
|
-
position: relative;
|
|
145
|
-
display: inline-flex;
|
|
146
|
-
width: 290px;
|
|
147
|
-
background-color: #fcfcfc;
|
|
148
|
-
border: 1px solid #e0e0e0;
|
|
149
|
-
border-radius: 2px;
|
|
150
|
-
}
|
|
151
|
-
|
|
152
|
-
/* 播放、暂停按钮 */
|
|
153
|
-
._button {
|
|
154
|
-
display: flex;
|
|
155
|
-
align-items: center;
|
|
156
|
-
justify-content: center;
|
|
157
|
-
width: 20px;
|
|
158
|
-
height: 20px;
|
|
159
|
-
overflow: hidden;
|
|
160
|
-
background-color: rgb(0, 0, 0, 0.2);
|
|
161
|
-
border: 1px solid white;
|
|
162
|
-
border-radius: 50%;
|
|
163
|
-
opacity: 0.9;
|
|
164
|
-
}
|
|
165
|
-
|
|
166
|
-
._play {
|
|
167
|
-
margin-left: 2px;
|
|
168
|
-
border-top: 4px solid transparent;
|
|
169
|
-
border-bottom: 4px solid transparent;
|
|
170
|
-
border-left: 8px solid white;
|
|
171
|
-
}
|
|
172
|
-
|
|
173
|
-
._pause {
|
|
174
|
-
width: 8px;
|
|
175
|
-
height: 8px;
|
|
176
|
-
background-color: white;
|
|
177
|
-
}
|
|
178
|
-
|
|
179
|
-
/* 海报 */
|
|
180
|
-
._poster {
|
|
181
|
-
display: flex;
|
|
182
|
-
align-items: center;
|
|
183
|
-
justify-content: center;
|
|
184
|
-
width: 70px;
|
|
185
|
-
height: 70px;
|
|
186
|
-
background-color: #e6e6e6;
|
|
187
|
-
background-size: contain;
|
|
188
|
-
}
|
|
189
|
-
|
|
190
|
-
/* 标题栏 */
|
|
191
|
-
._title {
|
|
192
|
-
flex: 1;
|
|
193
|
-
margin: 4px 0 0 14px;
|
|
194
|
-
text-align: left;
|
|
195
|
-
}
|
|
196
|
-
|
|
197
|
-
._author {
|
|
198
|
-
width: 45px;
|
|
199
|
-
font-size: 12px;
|
|
200
|
-
color: #888;
|
|
201
|
-
}
|
|
202
|
-
|
|
203
|
-
._name {
|
|
204
|
-
width: 140px;
|
|
205
|
-
font-size: 15px;
|
|
206
|
-
line-height: 39px;
|
|
207
|
-
}
|
|
208
|
-
|
|
209
|
-
._author,
|
|
210
|
-
._name {
|
|
211
|
-
overflow: hidden;
|
|
212
|
-
text-overflow: ellipsis;
|
|
213
|
-
white-space: nowrap;
|
|
214
|
-
}
|
|
215
|
-
|
|
216
|
-
/* 进度条 */
|
|
217
|
-
._slider {
|
|
218
|
-
position: absolute;
|
|
219
|
-
right: 16px;
|
|
220
|
-
bottom: 8px;
|
|
221
|
-
width: 140px;
|
|
222
|
-
margin: 0;
|
|
223
|
-
}
|
|
224
|
-
|
|
225
|
-
/* 播放时间 */
|
|
226
|
-
._time {
|
|
227
|
-
margin: 7px 14px 0 0;
|
|
228
|
-
font-size: 12px;
|
|
229
|
-
color: #888;
|
|
230
|
-
}
|
|
231
|
-
|
|
232
|
-
/* 响应式布局,大屏幕用更大的尺寸 */
|
|
233
|
-
@media (min-width: 400px) {
|
|
234
|
-
._contain {
|
|
235
|
-
width: 380px;
|
|
236
|
-
}
|
|
237
|
-
|
|
238
|
-
._button {
|
|
239
|
-
width: 26px;
|
|
240
|
-
height: 26px;
|
|
241
|
-
}
|
|
242
|
-
|
|
243
|
-
._poster {
|
|
244
|
-
width: 90px;
|
|
245
|
-
height: 90px;
|
|
246
|
-
}
|
|
247
|
-
|
|
248
|
-
._author {
|
|
249
|
-
width: 60px;
|
|
250
|
-
font-size: 15px;
|
|
251
|
-
}
|
|
252
|
-
|
|
253
|
-
._name {
|
|
254
|
-
width: 180px;
|
|
255
|
-
font-size: 19px;
|
|
256
|
-
line-height: 55px;
|
|
257
|
-
}
|
|
258
|
-
|
|
259
|
-
._slider {
|
|
260
|
-
right: 20px;
|
|
261
|
-
bottom: 10px;
|
|
262
|
-
width: 180px;
|
|
263
|
-
}
|
|
264
|
-
|
|
265
|
-
._time {
|
|
266
|
-
font-size: 15px;
|
|
267
|
-
}
|
|
268
|
-
}
|
|
269
|
-
</style>
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
module.exports = {
|
|
2
|
-
template: '<my-audio v-if="n.name==\'audio\'" :class="n.attrs.class" :style="n.attrs.style" :aid="n.attrs.id" :author="n.attrs.author" :controls="n.attrs.controls" :autoplay="n.attrs.autoplay" :loop="n.attrs.loop" :name="n.attrs.name" :poster="n.attrs.poster" :src="n.src[ctrl[i]||0]" :data-i="i" data-source="audio" @play="play" @error="mediaError" />'
|
|
3
|
-
}
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
# card
|
|
2
|
-
功能:商品(联络人)信息卡
|
|
3
|
-
大小:*≈7KB*
|
|
4
|
-
支持平台:
|
|
5
|
-
|
|
6
|
-
| 微信小程序 | QQ 小程序 | 百度小程序 | 支付宝小程序 | 头条小程序 | uni-app |
|
|
7
|
-
|:---:|:---:|:---:|:---:|:---:|:---:|
|
|
8
|
-
| √ | √ | √ | √ | √ | √(nvue 不支持) |
|
|
9
|
-
|
|
10
|
-
### 效果图
|
|
11
|
-

|
|
12
|
-
|
|
13
|
-
### 参数列表
|
|
14
|
-
|参数名|是否必须|类型|说明|
|
|
15
|
-
|:---- |:---|:----- |----- |
|
|
16
|
-
|src|是|String|图片Url|
|
|
17
|
-
|title|是|String|标题|
|
|
18
|
-
|desc|是|String|描述|
|
|
19
|
-
|url|是|String|跳转url|
|
|
20
|
-
|color|是|String|文字颜色|
|
|
21
|
-
|bgcolor|是|String|卡片背景颜色|
|
|
22
|
-
|border|是|String|卡片边框颜色|
|
|
23
|
-
|
|
24
|
-
### 说明:
|
|
25
|
-
1. 可以显示商品信息卡片/联络人信息卡片
|
|
26
|
-
|
|
27
|
-
### 基础库要求:
|
|
28
|
-
满足最低要求即可
|
|
29
|
-
|
|
30
|
-
?> 如果希望页面上使用本组件,组件的路径为 *path/to/mp-html/card/card*
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
module.exports = {
|
|
2
|
-
usingComponents: {
|
|
3
|
-
'my-card': '../card/card'
|
|
4
|
-
},
|
|
5
|
-
handler (file) {
|
|
6
|
-
if (file.isBuffer()) {
|
|
7
|
-
let content = file.contents.toString()
|
|
8
|
-
if (file.path.includes('parser.js')) {
|
|
9
|
-
content = content.replace(/trustTags\s*:\s*makeMap\('/, "trustTags: makeMap('card,").replace(/voidTags\s*:\s*makeMap\('/, "voidTags: makeMap('card,")
|
|
10
|
-
}
|
|
11
|
-
file.contents = Buffer.from(content)
|
|
12
|
-
}
|
|
13
|
-
}
|
|
14
|
-
}
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
module.exports = {
|
|
2
|
-
template: '<my-card wx:if="{{n.name==\'card\'}}" class="{{n.attrs.class}}" style="{{n.attrs.style}}" mode="{{opts[5]}}" src="{{n.attrs.src}}" title="{{n.attrs.title}}" desc="{{n.attrs.desc}}" url="{{n.attrs.url}}" color="{{n.attrs.color}}" bgcolor="{{n.attrs.bgcolor}}" border="{{n.attrs.border}}" name="{{n.attrs.name}}" data-i="{{i}}" data-source="card" />'
|
|
3
|
-
}
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @fileoverview card 组件
|
|
3
|
-
*/
|
|
4
|
-
Component({
|
|
5
|
-
properties: {
|
|
6
|
-
mode: {
|
|
7
|
-
type: Boolean,
|
|
8
|
-
default: false
|
|
9
|
-
},
|
|
10
|
-
src: String,
|
|
11
|
-
title: String,
|
|
12
|
-
desc: String,
|
|
13
|
-
url: String,
|
|
14
|
-
color: String,
|
|
15
|
-
bgcolor: String,
|
|
16
|
-
border: String
|
|
17
|
-
},
|
|
18
|
-
data: {},
|
|
19
|
-
methods: {
|
|
20
|
-
onClick (e) {
|
|
21
|
-
if (this.properties.url && this.properties.url.trim().length > 6 && !this.properties.mode) {
|
|
22
|
-
wx.navigateTo({ url: this.properties.url })
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
}
|
|
26
|
-
})
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
<view class="card" bindtap="onClick" style="background-color:{{bgcolor||'#a4d0ff'}};border:{{border||'1px solid #FFF'}};color:{{color||'#000'}}">
|
|
2
|
-
<image class="card-img" mode="aspectFill" src="{{src}}" />
|
|
3
|
-
<view class="text-wrap text-wrap-width" wx:if="{{!!desc}}">
|
|
4
|
-
<view class="title one-t">{{title}}</view>
|
|
5
|
-
<view class="desc one-t">{{desc}}</view>
|
|
6
|
-
</view>
|
|
7
|
-
<view wx:else class="text-wrap-width title more-t">{{title}}</view>
|
|
8
|
-
<image class="card-icon" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAMAAADVRocKAAABCFBMVEUAAAC/v7+qqqqZmZmLi6KJnZ2ImZmHlpaGlKGMjJmSkp6Li5eQkJuKlZ+Pj5mOjpeJkpuNjZ6IkJmHj5eLi5uKkpmGjZqJj5uLi5eIjpmIjZiKj5qKj5mJjpiHjJqJjZaGj5iKj5eIjJmKjpqHi5eGjZeIi5eHjZiIi5eHjJiIjpaHjJeIjZiGjJeIjZiGjJaGjJeIi5aGjJeHi5eHi5aHjJeHjJaHjJeGi5eHjJaHjJeGi5aGi5aHjJeHjJaGjJeGjJeHjJaHi5eGi5eHjJaHjJeGjJaGjJeHi5aHjJeHjJeHi5aGjJeHi5aGjJaHi5eGjJaHi5eHjJaGi5eGi5aHjJeGi5aGi5apAvjmAAAAV3RSTlMABAYKCw0PERMUFRYXGBkbHB0eICEjJiksLS8wMjQ1ODk7PD9ATFZXWFlaW1xdXl+Hi6msu7/Dx8vMzs/R0tTV19na3N3f4uTn6evs7e7v8PHy9PX7/P18cCTXAAABEklEQVRo3u2YWU5CQRQFn4qCM4LzhIoDAorzrIgCigiCimf/O/Gj3UIlmJxaQFXSea/T90aRMcYYY4zpG0ZPu9cZMnAi6SsLBjqS9LnJBcqSpC53Sjs/kqSPNaxwGAqtFbrQXKILjQW68DpPF17m6EI9TRdqM3TheZouVCbpQnkcK5RC4T5BF27jdOFqhC5cDtOFixhdOB+iC2cDdOEoggttLrDbk6QW5/+WJB1T/r1e+FAHWT/2q/35scsiF/w3cdZ/R13Y+8H/MMb6Hycgfz74n6ZYfzXJ+mspyF8I/vos68cep0X4eV2EB4SD4H9bZP3vy+yTtL3KjrGddXgQ34BXCVvwMmT7P69zjDHGGGP6gF83lHISOctsKQAAAABJRU5ErkJggg=="></image>
|
|
9
|
-
</view>
|
|
@@ -1,55 +0,0 @@
|
|
|
1
|
-
.one-t {
|
|
2
|
-
overflow: hidden;
|
|
3
|
-
white-space: nowrap;
|
|
4
|
-
text-overflow: ellipsis;
|
|
5
|
-
transition: all linear 0.2s;
|
|
6
|
-
}
|
|
7
|
-
.more-t {
|
|
8
|
-
overflow: hidden;
|
|
9
|
-
text-overflow: ellipsis;
|
|
10
|
-
word-break: break-all;
|
|
11
|
-
display: -webkit-box;
|
|
12
|
-
-webkit-line-clamp: 2;
|
|
13
|
-
-webkit-box-orient: vertical;
|
|
14
|
-
transition: all linear 0.2s;
|
|
15
|
-
}
|
|
16
|
-
.card {
|
|
17
|
-
width: 80%;
|
|
18
|
-
margin: 10rpx auto;
|
|
19
|
-
max-width: 700rpx;
|
|
20
|
-
max-height: 140rpx;
|
|
21
|
-
box-sizing: border-box;
|
|
22
|
-
overflow: hidden;
|
|
23
|
-
display: flex;
|
|
24
|
-
justify-content: space-between;
|
|
25
|
-
align-items: center;
|
|
26
|
-
padding: 20rpx 0 20rpx 10rpx;
|
|
27
|
-
border-radius: 12rpx;
|
|
28
|
-
}
|
|
29
|
-
.card-img {
|
|
30
|
-
width: 96rpx;
|
|
31
|
-
height: 96rpx;
|
|
32
|
-
border-radius: 12rpx;
|
|
33
|
-
flex: 0 0 96rpx;
|
|
34
|
-
}
|
|
35
|
-
.card-icon {
|
|
36
|
-
width: 30rpx;
|
|
37
|
-
height: 96rpx;
|
|
38
|
-
}
|
|
39
|
-
.card .text-wrap {
|
|
40
|
-
display: flex;
|
|
41
|
-
flex-direction: column;
|
|
42
|
-
justify-content: space-between;
|
|
43
|
-
}
|
|
44
|
-
.card .text-wrap-width {
|
|
45
|
-
width: 72%;
|
|
46
|
-
}
|
|
47
|
-
.card .title {
|
|
48
|
-
font-weight: bold;
|
|
49
|
-
font-size: 34rpx;
|
|
50
|
-
line-height: 48rpx;
|
|
51
|
-
}
|
|
52
|
-
.card .desc {
|
|
53
|
-
font-size: 27rpx;
|
|
54
|
-
line-height: 37rpx;
|
|
55
|
-
}
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
module.exports = {
|
|
2
|
-
template: '<my-card v-if="n.name==\'card\'" :class="n.attrs.class" :style="n.attrs.style" :mode="opts[5]" :src="n.attrs.src" :title="n.attrs.title" :desc="n.attrs.desc" :url="n.attrs.url" :color="n.attrs.color" :bgcolor="n.attrs.bgcolor" :border="n.attrs.border" :name="n.attrs.name" :data-i="i" data-source="card" />'
|
|
3
|
-
}
|
|
@@ -1,122 +0,0 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<view class="card" @click="onClick" :style="[customStyle]" :data-i="$attrs['data-i']">
|
|
3
|
-
<image class="card-img" mode="aspectFill" :src="src" />
|
|
4
|
-
<view class="text-wrap text-wrap-width" v-if="!!desc">
|
|
5
|
-
<view class="title one-t">{{title}}</view>
|
|
6
|
-
<view class="desc one-t">{{desc}}</view>
|
|
7
|
-
</view>
|
|
8
|
-
<view v-else class="text-wrap-width title more-t">{{title}}</view>
|
|
9
|
-
<image class="card-icon" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAMAAADVRocKAAABCFBMVEUAAAC/v7+qqqqZmZmLi6KJnZ2ImZmHlpaGlKGMjJmSkp6Li5eQkJuKlZ+Pj5mOjpeJkpuNjZ6IkJmHj5eLi5uKkpmGjZqJj5uLi5eIjpmIjZiKj5qKj5mJjpiHjJqJjZaGj5iKj5eIjJmKjpqHi5eGjZeIi5eHjZiIi5eHjJiIjpaHjJeIjZiGjJeIjZiGjJaGjJeIi5aGjJeHi5eHi5aHjJeHjJaHjJeGi5eHjJaHjJeGi5aGi5aHjJeHjJaGjJeGjJeHjJaHi5eGi5eHjJaHjJeGjJaGjJeHi5aHjJeHjJeHi5aGjJeHi5aGjJaHi5eGjJaHi5eHjJaGi5eGi5aHjJeGi5aGi5apAvjmAAAAV3RSTlMABAYKCw0PERMUFRYXGBkbHB0eICEjJiksLS8wMjQ1ODk7PD9ATFZXWFlaW1xdXl+Hi6msu7/Dx8vMzs/R0tTV19na3N3f4uTn6evs7e7v8PHy9PX7/P18cCTXAAABEklEQVRo3u2YWU5CQRQFn4qCM4LzhIoDAorzrIgCigiCimf/O/Gj3UIlmJxaQFXSea/T90aRMcYYY4zpG0ZPu9cZMnAi6SsLBjqS9LnJBcqSpC53Sjs/kqSPNaxwGAqtFbrQXKILjQW68DpPF17m6EI9TRdqM3TheZouVCbpQnkcK5RC4T5BF27jdOFqhC5cDtOFixhdOB+iC2cDdOEoggttLrDbk6QW5/+WJB1T/r1e+FAHWT/2q/35scsiF/w3cdZ/R13Y+8H/MMb6Hycgfz74n6ZYfzXJ+mspyF8I/vos68cep0X4eV2EB4SD4H9bZP3vy+yTtL3KjrGddXgQ34BXCVvwMmT7P69zjDHGGGP6gF83lHISOctsKQAAAABJRU5ErkJggg=="></image>
|
|
10
|
-
</view>
|
|
11
|
-
</template>
|
|
12
|
-
|
|
13
|
-
<script>
|
|
14
|
-
export default {
|
|
15
|
-
props: {
|
|
16
|
-
mode: {
|
|
17
|
-
type: Boolean,
|
|
18
|
-
default: false
|
|
19
|
-
},
|
|
20
|
-
src: String,
|
|
21
|
-
title: String,
|
|
22
|
-
desc: String,
|
|
23
|
-
url: String,
|
|
24
|
-
color: String,
|
|
25
|
-
bgcolor: String,
|
|
26
|
-
border: String
|
|
27
|
-
},
|
|
28
|
-
data () {
|
|
29
|
-
return {
|
|
30
|
-
|
|
31
|
-
}
|
|
32
|
-
},
|
|
33
|
-
computed: {
|
|
34
|
-
customStyle () {
|
|
35
|
-
return {
|
|
36
|
-
'background-color': this.bgColor || '#a4d0ff',
|
|
37
|
-
border: this.border || '1px solid #FFF',
|
|
38
|
-
color: this.color || '#000'
|
|
39
|
-
}
|
|
40
|
-
}
|
|
41
|
-
},
|
|
42
|
-
methods: {
|
|
43
|
-
onClick (e) {
|
|
44
|
-
if (this.url && this.url.trim().length > 6 && !this.mode) {
|
|
45
|
-
uni.navigateTo({ url: this.url })
|
|
46
|
-
}
|
|
47
|
-
this.$emit('click', e)
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
</script>
|
|
52
|
-
|
|
53
|
-
<style lang="scss">
|
|
54
|
-
.one-t {
|
|
55
|
-
overflow: hidden;
|
|
56
|
-
white-space: nowrap;
|
|
57
|
-
text-overflow: ellipsis;
|
|
58
|
-
transition: all linear 0.2s;
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
.more-t {
|
|
62
|
-
overflow: hidden;
|
|
63
|
-
text-overflow: ellipsis;
|
|
64
|
-
word-break:break-all;
|
|
65
|
-
display: -webkit-box;
|
|
66
|
-
-webkit-line-clamp: 2;
|
|
67
|
-
-webkit-box-orient: vertical;
|
|
68
|
-
transition: all linear 0.2s;
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
.card {
|
|
72
|
-
|
|
73
|
-
width: 80%;
|
|
74
|
-
margin: 10rpx auto;
|
|
75
|
-
max-width: 700rpx;
|
|
76
|
-
max-height: 140rpx;
|
|
77
|
-
|
|
78
|
-
box-sizing: border-box;
|
|
79
|
-
overflow: hidden;
|
|
80
|
-
|
|
81
|
-
display: flex;
|
|
82
|
-
justify-content: space-between;
|
|
83
|
-
align-items: center;
|
|
84
|
-
|
|
85
|
-
padding: 20rpx 0 20rpx 10rpx;
|
|
86
|
-
border-radius: 12rpx;
|
|
87
|
-
|
|
88
|
-
&-img {
|
|
89
|
-
width: 96rpx;
|
|
90
|
-
height: 96rpx;
|
|
91
|
-
border-radius: 12rpx;
|
|
92
|
-
flex: 0 0 96rpx;
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
&-icon {
|
|
96
|
-
width: 30rpx;
|
|
97
|
-
height: 96rpx;
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
.text-wrap {
|
|
101
|
-
|
|
102
|
-
display: flex;
|
|
103
|
-
flex-direction: column;
|
|
104
|
-
justify-content: space-between;
|
|
105
|
-
|
|
106
|
-
&-width {
|
|
107
|
-
width: 72%;
|
|
108
|
-
}
|
|
109
|
-
}
|
|
110
|
-
|
|
111
|
-
.title {
|
|
112
|
-
font-weight: bold;
|
|
113
|
-
font-size: 34rpx;
|
|
114
|
-
line-height: 48rpx;
|
|
115
|
-
}
|
|
116
|
-
|
|
117
|
-
.desc {
|
|
118
|
-
font-size: 27rpx;
|
|
119
|
-
line-height: 37rpx;
|
|
120
|
-
}
|
|
121
|
-
}
|
|
122
|
-
</style>
|
|
@@ -1,137 +0,0 @@
|
|
|
1
|
-
# editable
|
|
2
|
-
功能:富文本编辑
|
|
3
|
-
下表列出了本插件与原生 *editor* 组件的功能差异,可按需选用
|
|
4
|
-
|
|
5
|
-
| 组件 | 优点 | 缺点 |
|
|
6
|
-
|:---:|:---:|:---:|
|
|
7
|
-
| 原生 *editor* | 底层通过 *contenteditable* 实现,编辑流畅 | 支持标签少(不支持音视频、表格以及 *section* 等常用标签)、部分小程序平台不支持或低版本不兼容 |
|
|
8
|
-
| 本插件 | 支持标签全面、支持平台全面 | 编辑灵活性不够强 |
|
|
9
|
-
|
|
10
|
-
大小:*≈17.5KB*
|
|
11
|
-
支持平台:
|
|
12
|
-
|
|
13
|
-
| 微信小程序 | QQ 小程序 | 百度小程序 | 支付宝小程序 | 头条小程序 | uni-app |
|
|
14
|
-
|:---:|:---:|:---:|:---:|:---:|:---:|
|
|
15
|
-
| √ | √ | √ | √ | √ | √(nvue 不支持) |
|
|
16
|
-
|
|
17
|
-
说明:
|
|
18
|
-
引入本插件后,会给组件添加以下属性:
|
|
19
|
-
|
|
20
|
-
| 属性名 | 类型 | 默认值 | 说明 |
|
|
21
|
-
|:---:|:---:|:---:|:---:|
|
|
22
|
-
| editable | Boolean | false | 是否开启内容编辑 |
|
|
23
|
-
| placeholder | String | 请输入 | 输入框为空时占位符(`2.1.0+`) |
|
|
24
|
-
|
|
25
|
-
添加以下事件:
|
|
26
|
-
|
|
27
|
-
| 事件名 | 触发时机 | 用途 |
|
|
28
|
-
|:---:|:---:|:---:|
|
|
29
|
-
| remove(`2.2.0+`) | 删除图片/视频/音频标签时 | 删除已上传的线上文件 |
|
|
30
|
-
|
|
31
|
-
支持以下操作:
|
|
32
|
-
|
|
33
|
-
| 类型 | 操作 |
|
|
34
|
-
|:---:|:---:|
|
|
35
|
-
| 文本 | 修改 |
|
|
36
|
-
| 图片 | 更换链接、调整宽度、设置成超链接(`2.0.4+`)、设置预览图链接、禁用预览、删除 |
|
|
37
|
-
| 链接 | 更换链接、删除 |
|
|
38
|
-
| 音视频 | 设置封面、设置循环播放、设置自动播放(`2.2.0+`)、删除 |
|
|
39
|
-
| 普通标签 | 设置字体大小、斜体、粗体、下划线(`2.0.4+`)、居中、缩进、删除 |
|
|
40
|
-
|
|
41
|
-
> `2.2.1` 版本起所有标签支持上下移动操作,但仅限同级标签间移动,即在有同级标签且非第一个(或最后一个)时可以上移(或下移)
|
|
42
|
-
|
|
43
|
-
> 在支付宝小程序中使用时需要在页面样式中添加 *page { position: relative; }* 避免 *tooltip* 错位
|
|
44
|
-
|
|
45
|
-
> 菜单项可以通过编辑 *plugins/editable/config.js* 进行修改,仅可以删减或调整顺序,添加或更名无效
|
|
46
|
-
|
|
47
|
-
组件实例上提供了以下方法(*editable* 属性为 *true* 时才可以调用):
|
|
48
|
-
|
|
49
|
-
| 名称 | 功能 |
|
|
50
|
-
|:---:|:---:|
|
|
51
|
-
| undo | 撤销一个操作 |
|
|
52
|
-
| redo | 重做一个操作 |
|
|
53
|
-
| insertHtml | 在光标处插入指定 html 内容(`2.1.0+`) |
|
|
54
|
-
| insertImg | 在光标处插入一张图片 |
|
|
55
|
-
| insertTable(rows, cols) | 在光标处插入一个 rows 行 cols 列的表格(`2.1.3+`) |
|
|
56
|
-
| insertVideo | 在光标处插入一个视频 |
|
|
57
|
-
| insertAudio | 在光标处插入一个音频 |
|
|
58
|
-
| insertLink | 在光标处插入一个链接 |
|
|
59
|
-
| insertText | 在光标处插入一段文本 |
|
|
60
|
-
| clear | 清空内容 |
|
|
61
|
-
| getContent | 获取编辑后的 html 内容 |
|
|
62
|
-
|
|
63
|
-
> 考虑到不同场景下希望获取链接的方法不同,需要在初始时给组件设置一个 *getSrc* 方法(否则插入图片、音视频、链接或修改链接等操作无法使用),每次组件内需要链接时会调用此方法,开发者可在此方法中自行决定如何获取链接,返回 **线上地址** 即可(具体用法见下方示例)
|
|
64
|
-
|
|
65
|
-
编辑完成后,通过 *getContent* 方法获取编辑后的 *html*,最后将 *editable* 属性设置为 *false* 即可正常渲染
|
|
66
|
-
|
|
67
|
-
> 点击保存按钮时,部分平台 *tap* 事件早于 *blur* 事件触发,直接获取内容可能导致无法获取当前编辑的文本内容,因此建议设置一个小的延时后获取(可参考下方示例,[详细](https://github.com/jin-yufeng/mp-html/issues/368))
|
|
68
|
-
|
|
69
|
-
示例:
|
|
70
|
-
```javascript
|
|
71
|
-
Page({
|
|
72
|
-
onLoad () {
|
|
73
|
-
// ctx 为组件实例,获取方法见上
|
|
74
|
-
/**
|
|
75
|
-
* @description 设置获取链接的方法
|
|
76
|
-
* @param {String} type 链接的类型(img/video/audio/link)
|
|
77
|
-
* @param {String} value 修改链接时,这里会传入旧值
|
|
78
|
-
* @returns {Promise} 返回线上地址(2.2.0 版本起设置了 domain 属性时,可以缺省主域名)
|
|
79
|
-
* type 为 audio/video 时,可以返回一个源地址数组
|
|
80
|
-
* 2.1.3 版本起 type 为 audio 时,可以返回一个 object,包含 src、name、author、poster 等字段
|
|
81
|
-
* 2.2.0 版本起 type 为 img 时,可以返回一个源地址数组,表示插入多张图片(修改链接时仅限一张)
|
|
82
|
-
*/
|
|
83
|
-
this.ctx.getSrc = (type, value) => {
|
|
84
|
-
return new Promise((resolve, reject) => {
|
|
85
|
-
// 以图片为例
|
|
86
|
-
if (type == 'img') {
|
|
87
|
-
wx.chooseImage({
|
|
88
|
-
count: value === undefined ? 9 : 1, // 2.2.0 版本起插入图片时支持多张(修改图片链接时仅限一张)
|
|
89
|
-
success: res => {
|
|
90
|
-
wx.showLoading({
|
|
91
|
-
title: '上传中'
|
|
92
|
-
});
|
|
93
|
-
(async ()=>{
|
|
94
|
-
const arr = []
|
|
95
|
-
for (let item of res.tempFilePaths) {
|
|
96
|
-
// 依次上传
|
|
97
|
-
const src = await upload(item)
|
|
98
|
-
arr.push(src)
|
|
99
|
-
}
|
|
100
|
-
return arr
|
|
101
|
-
})().then(res => {
|
|
102
|
-
wx.hideLoading()
|
|
103
|
-
resolve(res)
|
|
104
|
-
})
|
|
105
|
-
},
|
|
106
|
-
fail: reject
|
|
107
|
-
})
|
|
108
|
-
}
|
|
109
|
-
})
|
|
110
|
-
}
|
|
111
|
-
},
|
|
112
|
-
finishEdit () {
|
|
113
|
-
setTimeout(() => {
|
|
114
|
-
var html = ctx.getContent() // 获取编辑好的 html
|
|
115
|
-
// 上传 html
|
|
116
|
-
wx.request({
|
|
117
|
-
url: 'xxx',
|
|
118
|
-
data: {
|
|
119
|
-
html
|
|
120
|
-
},
|
|
121
|
-
success: () => {
|
|
122
|
-
this.setData({
|
|
123
|
-
editable: false // 结束编辑
|
|
124
|
-
})
|
|
125
|
-
}
|
|
126
|
-
})
|
|
127
|
-
}, 50)
|
|
128
|
-
}
|
|
129
|
-
})
|
|
130
|
-
```
|
|
131
|
-
|
|
132
|
-
**示例项目**:
|
|
133
|
-
微信小程序点击 [代码片段](https://developers.weixin.qq.com/s/GFbJKum77eBy) 即可在微信开发者工具中导入;*uni-app* 下载 [示例项目](https://mp-html.oss-cn-hangzhou.aliyuncs.com/editable.zip) 在 *HBuilder X* 中打开即可体验;注意示例项目中不一定包含最新版本,仅供参考使用方法
|
|
134
|
-
|
|
135
|
-
注意事项:
|
|
136
|
-
1. 不要在 *editable* 属性被设置为 *true* 前通过 *setContent* 方法(用 *content* 属性)设置内容,否则在切换为 *true* 后会变成空白
|
|
137
|
-
2. *editable* 属性为 *true* 时不支持在 *scroll-view* 中使用,否则提示框的位置可能不正确
|