askbot-dragon 1.3.23 → 1.3.24

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "askbot-dragon",
3
- "version": "1.3.23",
3
+ "version": "1.3.24",
4
4
  "scripts": {
5
5
  "serve": "vue-cli-service serve",
6
6
  "build": "vue-cli-service build",
package/public/index.html CHANGED
@@ -10,7 +10,7 @@
10
10
  <!-- 项目图标 -->
11
11
  <link rel="stylesheet" href="//at.alicdn.com/t/font_1566110_3hu6pyd938i.css"/>
12
12
  <!-- guoran图标 -->
13
- <link rel="stylesheet" href="//at.alicdn.com/t/c/font_2913049_v0wnepni1r.css"/>
13
+ <link rel="stylesheet" href="//at.alicdn.com/t/c/font_2913049_qtm7orae3l.css"/>
14
14
  <script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
15
15
  <script src="https://static.guoranbot.com/ckeditor5-build-classic/0.3.7/build/ckeditor.js"></script>
16
16
 
@@ -0,0 +1,270 @@
1
+ <template>
2
+ <div :style="{ width: boxWidth + 'px' }" class="answer-voice">
3
+ <audio :id="'audioTagCom_' + msg.id" :src="msg.content.url"></audio>
4
+ <div class="audiocon">
5
+ <!-- 按钮 -->
6
+ <div class="leftBtn">
7
+ <span v-show="!isPlay" @click="bofang"><i class="iconfont guoran-bofang"></i></span>
8
+ <span v-show="isPlay" @click="bofang"><i class="iconfont guoran-zanting"></i></span>
9
+ </div>
10
+ <div class="adcon">
11
+ <!-- <div class="time">
12
+ <span>{{ time }}</span>
13
+ </div> -->
14
+ <div class="bar">
15
+ <div class="activeLine" @click="seekTime">
16
+ <div :style="{ width: currentPosi + '%' }" class="dot"></div>
17
+ </div>
18
+ </div>
19
+ <div class="time">
20
+ <span>{{ otherTime }}</span>
21
+ </div>
22
+ <!-- <div class="time">
23
+ <span>{{ allTime }}</span>
24
+ </div> -->
25
+ </div>
26
+ </div>
27
+ </div>
28
+ </template>
29
+ <script>
30
+
31
+ export default {
32
+ name: "answer_voice",
33
+ props: ["msg"],
34
+ data() {
35
+ return {
36
+ active: 0,
37
+ time: 0,
38
+ activeAudio: "",
39
+ isPlay: false,
40
+ currentPosi: 0,
41
+ allTime: 0,
42
+ otherTime: 0,
43
+ durationNum: 0,
44
+ boxWidth: 200
45
+ }
46
+ },
47
+ watch: {
48
+ },
49
+ computed: {
50
+
51
+ },
52
+ mounted() {
53
+ console.log(120);
54
+ this.$nextTick(() => {
55
+ setTimeout(() => {
56
+ console.log(this._$(`#audioTagCom_${this.msg.id}`)[0]);
57
+ this.activeAudio = this._$(`#audioTagCom_${this.msg.id}`)[0];
58
+ this.time = "00:00";
59
+ this.otherTime = this.transTime(this.activeAudio.duration);
60
+ this.durationNum = this.activeAudio.duration;
61
+ console.log(this.activeAudio.duration);
62
+ this.allTime = this.transTime(this.activeAudio.duration);
63
+ if (this.activeAudio.duration >= 60) {
64
+ this.boxWidth = 240;
65
+ } else {
66
+ this.boxWidth = 160 + this.activeAudio.duration;
67
+ }
68
+ this._$(`#audioTagCom_${this.msg.id}`).on("loadedmetadata", (e) => {
69
+ console.log(e.currentTarget);
70
+ this.time = "00:00";
71
+ console.log(e.currentTarget.duration);
72
+ this.allTime = this.transTime(e.currentTarget.duration);
73
+ if (this.activeAudio.duration >= 60) {
74
+ this.boxWidth = 240;
75
+ } else {
76
+ this.boxWidth = 160 + this.activeAudio.duration;
77
+ }
78
+ this.durationNum = e.currentTarget.duration;
79
+ this.otherTime = this.transTime(this.activeAudio.duration);
80
+ // this.activeAudio.play();
81
+ // this.isPlay = true;
82
+ });
83
+
84
+ document.addEventListener(
85
+ "WeixinJSBridgeReady",
86
+ function () {
87
+ this.activeAudio.play();
88
+ },
89
+ false
90
+ );
91
+
92
+ this._$(`#audioTagCom_${this.msg.id}`).on("timeupdate", () => {
93
+ this.updateProgress();
94
+ });
95
+
96
+ this._$(`#audioTagCom_${this.msg.id}`).on("timeupdate", () => {
97
+ this.updateProgress();
98
+ });
99
+
100
+ this._$(`#audioTagCom_${this.msg.id}`).on("ended", () => {
101
+ this.audioEnded();
102
+ });
103
+ }, 500);
104
+
105
+ });
106
+ },
107
+ methods: {
108
+ bofang() {
109
+ if (this.activeAudio.paused) {
110
+ this.activeAudio.play();
111
+ this.isPlay = true;
112
+ } else {
113
+ this.activeAudio.pause();
114
+ this.isPlay = false;
115
+ }
116
+
117
+ },
118
+ transTime(time) {
119
+ var duration = parseInt(time);
120
+ var minute = parseInt(duration / 60);
121
+ var sec = (duration % 60) + "";
122
+ var isM0 = ":";
123
+ if (minute == 0) {
124
+ minute = "00";
125
+ } else if (minute < 10) {
126
+ minute = "0" + minute;
127
+ }
128
+ if (sec.length == 1) {
129
+ sec = "0" + sec;
130
+ }
131
+ return minute + isM0 + sec;
132
+ },
133
+ transOtherTime(time) {
134
+ var duration = parseInt(time);
135
+ var minute = parseInt((parseInt(this.durationNum) - duration) / 60);
136
+ var sec = ((parseInt(this.durationNum) - duration) % 60) + "";
137
+ var isM0 = ":";
138
+ if (minute == 0) {
139
+ minute = "00";
140
+ } else if (minute < 10) {
141
+ minute = "0" + minute;
142
+ }
143
+ if (sec.length == 1) {
144
+ sec = "0" + sec;
145
+ }
146
+ return minute + isM0 + sec;
147
+ },
148
+ updateProgress() {
149
+ this.currentPosi = (this.activeAudio.currentTime / this.activeAudio.duration) * 100;
150
+ this.time = this.transTime(this.activeAudio.currentTime);
151
+ this.otherTime = this.transOtherTime(this.activeAudio.currentTime);
152
+ },
153
+
154
+ audioEnded() {
155
+ this.activeAudio.currentTime = 0;
156
+ this.activeAudio.pause();
157
+ this.isPlay = false;
158
+ },
159
+
160
+ seekTime(e) {
161
+ var rate = e.offsetX / e.target.clientWidth;
162
+ this.activeAudio.currentTime = this.activeAudio.duration * rate;
163
+ this.updateProgress();
164
+ },
165
+
166
+ }
167
+
168
+ }
169
+ </script>
170
+ <style scoped lang="less">
171
+ .answer-voice {
172
+ width: 100%;
173
+ padding: 4px 0;
174
+ // min-width: 240px;
175
+
176
+ .audiocon {
177
+ display: flex;
178
+ align-items: center;
179
+ width: 100%;
180
+ height: 30px;
181
+ justify-content: space-between;
182
+ }
183
+
184
+ .leftBtn {
185
+ width: 30px;
186
+
187
+ span {
188
+ i {
189
+ font-size: 28px;
190
+ color: #ADC0F6;
191
+ line-height: 32px;
192
+ }
193
+ }
194
+ }
195
+
196
+ .adcon {
197
+ position: relative;
198
+ z-index: 10;
199
+ width: calc(100% - 40px);
200
+ height: 30px;
201
+ display: flex;
202
+ align-items: center;
203
+ margin-left: 16px;
204
+
205
+ .bar {
206
+ width: calc(100% - 20px);
207
+ position: relative;
208
+ height: 30px;
209
+ display: flex;
210
+ align-items: center;
211
+
212
+ .activeLine {
213
+ position: absolute;
214
+ top: 0;
215
+ left: 0px;
216
+ z-index: 10;
217
+ width: 98%;
218
+ height: 30px;
219
+ cursor: pointer;
220
+
221
+ &::before {
222
+ content: "";
223
+ position: absolute;
224
+ width: 100%;
225
+ height: 4px;
226
+ top: 50%;
227
+ left: 0;
228
+ transform: translateY(-50%);
229
+ border-radius: 4px;
230
+
231
+ background-color: #D5DDEC;
232
+ }
233
+ }
234
+
235
+ .dot {
236
+ border-radius: 4px;
237
+ z-index: 11;
238
+ pointer-events: none;
239
+ position: absolute;
240
+ height: 4px;
241
+ top: 50%;
242
+ left: 0px;
243
+ transform: translateY(-50%);
244
+ background-color: #366AFF;
245
+
246
+ &::before {
247
+ content: "";
248
+ position: absolute;
249
+ top: -4px;
250
+ right: -6px;
251
+ width: 5px;
252
+ height: 5px;
253
+ border-radius: 50%;
254
+ background-color: white;
255
+ border: solid 4px #366AFF;
256
+ }
257
+ }
258
+ }
259
+
260
+ .time {
261
+ width: 58px;
262
+ font-size: 14px;
263
+ color: #222222;
264
+ font-weight: 500;
265
+ display: flex;
266
+ margin-left: 10px;
267
+ }
268
+ }
269
+ }
270
+ </style>
@@ -42,6 +42,7 @@
42
42
  <feed-back :feedBack="feedBack"></feed-back>
43
43
  <voice-compontent></voice-compontent> -->
44
44
  <ai-guide :aiGuide="ActionAiGuideObj"></ai-guide>
45
+ <answer-voice :msg="answerVoiceObj"></answer-voice>
45
46
 
46
47
  <!-- <FileType :urls="urls" :color="black"></FileType>-->
47
48
  <!-- <FileType :urls="urls" :color="black"></FileType>
@@ -78,6 +79,7 @@ import FeedBack from "@/components/feedBack";*/
78
79
  /*import ActionAlert from "@/components/message/ActionAlertIframe";*/
79
80
  // 智能引导组件
80
81
  import AiGuide from "@/components/AiGuide";
82
+ import AnswerVoice from "@/components/AnswerVoice";
81
83
  // import FileType from "@/components/FileType";
82
84
  // import ChatContent from "./chatContent";
83
85
  // import FeedBack from '@/components/feedBack'
@@ -102,6 +104,7 @@ export default {
102
104
  // FeedBack,
103
105
  // VoiceCompontent,
104
106
  AiGuide,
107
+ AnswerVoice,
105
108
  FormTemplate,
106
109
  // FormTemplate,
107
110
  // FileType,
@@ -114,6 +117,16 @@ export default {
114
117
  data() {
115
118
  return {
116
119
  black:'',
120
+ answerVoiceObj: {
121
+ id: "643f8e7c235d0d20541170d7",
122
+ intentId: 152859,
123
+ nodeId: "643ce95db62c5d38f1706242",
124
+ type: "answer_voice",
125
+ content: {
126
+ filenName: "二月兰.mp3",
127
+ url: "https://guoranopen-zjk.oss-cn-zhangjiakou.aliyuncs.com/front-oss/6b11f188b3cb4d73ba8305039f32d0da/2023/04/19/14/47/5ffbef1135ae52eb2bb5029323f5404c/二月兰.mp3"
128
+ }
129
+ },
117
130
  answerDocknowledge: {
118
131
  type: "answer_doc_knowledge",
119
132
  content: {