askbot-dragon 1.0.12 → 1.0.13

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.
Files changed (77) hide show
  1. package/README.md +27 -27
  2. package/babel.config.js +6 -6
  3. package/dragon.iml +7 -7
  4. package/package.json +56 -56
  5. package/public/index.html +43 -43
  6. package/src/App.vue +31 -31
  7. package/src/api/index.js +1 -1
  8. package/src/api/mock.http +2 -2
  9. package/src/api/requestUrl.js +185 -185
  10. package/src/assets/js/AliyunlssUtil.js +92 -92
  11. package/src/assets/js/Base64Util.js +22 -22
  12. package/src/assets/js/script.js +36 -36
  13. package/src/assets/less/common.css +6773 -6773
  14. package/src/assets/less/converSationContainer/common.less +191 -191
  15. package/src/assets/less/converSationContainer/converSatonContainer.less +493 -493
  16. package/src/assets/less/iconfont.css +37 -37
  17. package/src/assets/less/ticketMessage.less +211 -211
  18. package/src/components/ActionAlertIframe.vue +112 -112
  19. package/src/components/AiGuide.vue +467 -467
  20. package/src/components/AskIFrame.vue +15 -15
  21. package/src/components/ConversationContainer.vue +4617 -4617
  22. package/src/components/FileType.vue +86 -86
  23. package/src/components/Message.vue +27 -27
  24. package/src/components/actionSatisfaction.vue +107 -107
  25. package/src/components/actionSendToBot.vue +62 -62
  26. package/src/components/answerDissatisfaction.vue +62 -62
  27. package/src/components/answerRadio.vue +76 -76
  28. package/src/components/ask-components/DissatisfactionOptions.vue +57 -57
  29. package/src/components/ask-components/Msgloading.vue +37 -37
  30. package/src/components/ask-components/SatisfactionV2.vue +15 -15
  31. package/src/components/askVideo.vue +138 -138
  32. package/src/components/assetDetails.vue +370 -370
  33. package/src/components/assetMessage.vue +228 -228
  34. package/src/components/associationIntention.vue +243 -241
  35. package/src/components/botActionSatisfactor.vue +68 -68
  36. package/src/components/chatContent.vue +513 -513
  37. package/src/components/feedBack.vue +136 -136
  38. package/src/components/fielListView.vue +346 -346
  39. package/src/components/file/AliyunOssComponents.vue +108 -108
  40. package/src/components/formTemplate.vue +3344 -3342
  41. package/src/components/loadingProcess.vue +164 -164
  42. package/src/components/message/ActionAlertIframe.vue +112 -112
  43. package/src/components/message/ShopMessage.vue +164 -164
  44. package/src/components/message/TextMessage.vue +924 -924
  45. package/src/components/message/TicketMessage.vue +177 -177
  46. package/src/components/message/swiper/index.js +4 -4
  47. package/src/components/message/swiper/ticketSwiper.vue +503 -503
  48. package/src/components/message/swiper/ticketSwiperItem.vue +61 -61
  49. package/src/components/msgLoading.vue +231 -231
  50. package/src/components/myPopup.vue +70 -70
  51. package/src/components/popup.vue +227 -227
  52. package/src/components/receiverMessagePlatform.vue +65 -65
  53. package/src/components/recommend.vue +89 -89
  54. package/src/components/selector/hOption.vue +20 -20
  55. package/src/components/selector/hSelector.vue +199 -199
  56. package/src/components/selector/hWrapper.vue +216 -216
  57. package/src/components/senderMessagePlatform.vue +50 -50
  58. package/src/components/source/BotMessage.vue +24 -24
  59. package/src/components/source/CustomMessage.vue +24 -24
  60. package/src/components/test.vue +260 -260
  61. package/src/components/tree.vue +247 -247
  62. package/src/components/utils/AliyunIssUtil.js +72 -72
  63. package/src/components/utils/ckeditor.js +155 -153
  64. package/src/components/utils/ckeditorImageUpload/command.js +109 -109
  65. package/src/components/utils/ckeditorImageUpload/editing.js +11 -11
  66. package/src/components/utils/ckeditorImageUpload/plugin-image.js +11 -11
  67. package/src/components/utils/ckeditorImageUpload/toolbar-ui.js +40 -40
  68. package/src/components/utils/ckeditorfileUpload/common.js +111 -111
  69. package/src/components/utils/ckeditorfileUpload/editing.js +11 -11
  70. package/src/components/utils/ckeditorfileUpload/plugin_file.js +11 -11
  71. package/src/components/utils/ckeditorfileUpload/toolbar_ui.js +34 -34
  72. package/src/components/utils/format_date.js +25 -25
  73. package/src/components/utils/index.js +6 -6
  74. package/src/components/utils/math_utils.js +29 -29
  75. package/src/components/voiceComponent.vue +119 -119
  76. package/src/main.js +60 -60
  77. package/vue.config.js +47 -47
package/src/assets/less/converSationContainer/converSatonContainer.less CHANGED
@@ -1,494 +1,494 @@
1
- @import "../converSationContainer/common";
2
- @import "../iconfont.css";
3
- .video-player{
4
- width: 260px!important;
5
- }
6
- // .video-js .vjs-big-play-button{
7
- // top: 50px!important;
8
- // left: 90px!important;
9
- // }
10
- .el-cascader-node__label{
11
- padding: 0;
12
- }
13
- .el-cascader-node__postfix{
14
- right: 5px;
15
- }
16
- .el-cascader-node{
17
- height: 24px;
18
- line-height: 24px;
19
- padding: 0 20px 0 5px;
20
- }
21
- .el-radio{
22
- width: 100%;
23
- margin: 5px 0px;
24
- }
25
- .conversation-container{
26
- width: 400px;
27
- z-index: 999;
28
- .conversation-container-d {
29
- //background-color: rgba(0, 0, 0, 0) !important;
30
- // height: 0 !important;
31
- height: 100vh;
32
- }
33
- .test-box {
34
- height: 100vh;
35
- background-color:#323232;
36
- display: flex;
37
- flex-direction: column;
38
- justify-content: flex-start;
39
- .gr-header{
40
- padding: 16px;
41
- height: 16px;
42
- flex: none;
43
- border-bottom: solid 2px #424247;
44
- display: flex;
45
- justify-content: flex-start;
46
- font-size: 16px;
47
- .bot-name{
48
- flex: auto;
49
- text-align: left;
50
- color: #ffffff;
51
- i{
52
- margin-left: 10px;
53
- cursor: pointer;
54
- font-weight: bolder;
55
- }
56
- }
57
- .el-icon-refresh{
58
- flex: none;
59
- width: 24px;
60
- /*color: @system_fontcolor_red;*/
61
- color: #409EFF;
62
- font-weight: bolder;
63
- cursor: pointer;
64
- }
65
- .el-icon-close{
66
- flex: none;
67
- width: 24px;
68
- color: #409EFF;
69
- font-weight: bolder;
70
- cursor: pointer;
71
- }
72
- }
73
- .mod-loading{
74
- flex: none;
75
- padding: 5px;
76
- background: #fff;
77
- font-size: 14px;
78
- color: #5857579c;
79
- em {
80
- font-size: 16px;
81
- position: relative;
82
- top: 1px;
83
- font-weight: bolder;
84
- margin-left: 5px;
85
- }
86
- }
87
- .fade-enter-active, .fade-leave-active {
88
- transition: opacity .5s
89
- }
90
- .fade-enter, .fade-leave-active {
91
- opacity: 0
92
- }
93
- .gr-content {
94
- flex: auto;
95
- overflow: auto;
96
- padding: 8px;
97
- ul{
98
- padding: 8px 0;
99
- .via-bot-outer{
100
- display: flex;
101
- justify-content: flex-start;
102
- .chat-content{
103
- border-radius: 0 8px 8px 8px;
104
- a {
105
- color: royalblue !important;
106
- }
107
- a:link{
108
- text-decoration: underline !important;
109
- }
110
- table{
111
- color: red !important;
112
- border: solid 1px red !important;
113
- }
114
- }
115
- }
116
- .via-user-outer{
117
- display: flex;
118
- justify-content: flex-end;
119
- .chat-content{
120
- border-radius:8px 0 8px 8px;
121
- background-color: @system_fontcolor_red;
122
- color: white;
123
- }
124
- }
125
- li{
126
- margin: 8px;
127
- .via{
128
- flex: none;
129
- height: 30px;
130
- width: 30px;
131
- border-radius: 0 15px 15px 15px;
132
- font-size: 28px;
133
-
134
- }
135
- .via-bot {
136
- border: solid 1px @system_fontcolor_sub;
137
- margin-right: 8px;
138
- em {
139
- color: @system_fontcolor_sub;
140
- }
141
-
142
- }
143
- .via-user {
144
- border: solid 1px @system_fontcolor_red;
145
- margin-left: 8px;
146
- em {
147
- color:@system_fontcolor_red;
148
- }
149
- }
150
- .chat-content{
151
- background-color: white;
152
- line-height: 26px;
153
- padding: 8px;
154
- max-width: 300px;
155
- font-size: 14px;
156
- text-align: left;
157
- word-wrap: break-word;
158
-
159
-
160
- .link-list-outer{
161
- font-size: 14px;
162
- .link-cell{
163
- line-height: 16px;
164
- display: block;
165
- color: @system_fontcolor_red;
166
- }
167
- }
168
- }
169
- }
170
- }
171
- }
172
- .gr-footer{
173
- height: 32px;
174
- padding: 8px;
175
- flex: none;
176
- .el-input{
177
- .el-button{
178
- color: white;
179
- background-color: @system_fontcolor_red;
180
- }
181
- }
182
- }
183
- }
184
-
185
- }
186
- .dialog{
187
- width: 51%;
188
- margin: 0 auto;
189
- background-color: #ffffff;
190
- .list-paddingleft-2 {
191
- padding-left: 16px !important;
192
- color: hotpink;
193
- }
194
-
195
- ul,
196
- ol,
197
- li {
198
- list-style-type: none;
199
- }
200
-
201
- ul, ul li {
202
- list-style-type: disc !important;
203
- }
204
-
205
- ol, ol li{
206
- list-style-type: decimal !important;
207
- }
208
-
209
- table,table tr th, table tr td {
210
- border:1px solid #DDD !important;
211
- }
212
- table {
213
- width: 200px; min-height: 25px; line-height: 25px; text-align: center; border-collapse: collapse !important;
214
- }
215
- .headerName{
216
- padding: 20px;
217
- text-align: center;
218
- }
219
- .dialogContent{
220
- background-color: rgb(245, 245, 245);
221
- height: calc(100vh - 170px);
222
- display: flex;
223
- flex-direction: column;
224
- padding: 10px;
225
- overflow-x: hidden;
226
- overflow-y: auto;
227
- .message-notice{
228
- display: inline-block;
229
- text-align: center;
230
- margin-bottom: 20px;
231
- width: 100%;
232
- background-color: transparent !important;
233
- }
234
- .notice-content{
235
- display: inline-block;
236
- padding: 5px 10px;
237
- border-radius: 5px;
238
- background-color: #e8eaec;
239
- color: #666666;
240
- font-size: 12px;
241
- }
242
- .notice-content-day{
243
- display: inline-block;
244
- padding: 5px 10px;
245
- .line-left{
246
- display:inline-block;
247
- width:100px;
248
- height:1px;
249
- margin-bottom: 5px;
250
- margin-right: 5px;
251
- //background:#dcdcdc;
252
- background: -webkit-linear-gradient(left, #fff -4%,#666666 50%);
253
-
254
- }
255
- .line-text{
256
- color: #666666;
257
- font-size: 12px;
258
- }
259
- .line-right{
260
- display:inline-block;
261
- width:100px;
262
- height:1px;
263
- margin-bottom: 5px;
264
- margin-left: 5px;
265
- //background:#dcdcdc;
266
- background: -webkit-linear-gradient(left,#666666 50%,#fff 100%);
267
- }
268
- }
269
- //messages
270
- .message{
271
- display: flex;
272
- margin-bottom: 20px;
273
- justify-content:flex-start;
274
- .user-detail{
275
- display: flex;
276
- align-items: flex-start;
277
- .media-body{
278
- //max-width: calc(100vw - 800px);
279
- background-color: white;
280
- // border: 1px solid #e4e3e3;
281
- word-break: break-word;
282
- flex: 1;
283
- min-height: 25px;
284
- line-height: 25px;
285
- border-radius: 15px;
286
- border-top-left-radius: 0px;
287
- padding: 10px 10px 0 15px;
288
- text-align: left;
289
-
290
- h2{
291
- font-size: 18px;
292
- }
293
- p{
294
- margin-bottom: 5px;
295
- font-size: 14px;
296
- word-wrap:break-word;
297
- word-break:break-all;
298
- overflow: hidden;
299
- }
300
- .voicemessage{
301
- width: 200px;
302
- height: 35px;
303
- line-height: 35px;
304
- background-color: #e8eaec;
305
- border-radius: 10px;
306
- .icon-vioce{
307
- font-size: 24px;
308
- float: left;
309
- margin-left: 20px;
310
- margin-right: 20px;
311
- }
312
- .time{
313
- font-size: 14px;
314
- margin-left: 20px;
315
- }
316
- }
317
- span{
318
- margin-bottom: 5px;
319
- font-size: 12px;
320
- color: #a3a4a5;
321
- float: left;
322
- }
323
- .botname{
324
- margin-left: 10px;
325
- float: right;
326
- }
327
- .mb-0{
328
- margin-bottom: 0 !important;
329
- text-align: left;
330
- line-height: 1.3;
331
- margin-top: 0;
332
- font-size: 12px;
333
- }
334
- }
335
- .media-body-ps{
336
- //max-width: calc(100vw - 800px);
337
- background-color: #f8f8f8;
338
- border: 1px solid #e4e3e3;
339
- word-break: break-word;
340
- flex: 1;
341
- min-height: 25px;
342
- line-height: 25px;
343
- border-radius: 25px;
344
- border-top-left-radius: 0px;
345
- text-align: left;
346
- h2{
347
- font-size: 18px;
348
- }
349
- .other{
350
- margin-bottom: 5px;
351
- font-size: 14px;
352
- word-wrap:break-word;
353
- word-break:break-all;
354
- overflow: hidden;
355
- padding: 10px 10px 0 15px;
356
- }
357
- .ps{
358
- padding: 5px 10px 5px 15px;
359
- height: 25px;
360
- line-height: 25px;
361
- border-top: 1px solid #e4e3e3;
362
- background-color: #ffffff;
363
- color: #409eff;
364
- cursor:pointer;
365
- }
366
- .end{
367
- border-bottom-left-radius: 25px !important;
368
- border-bottom-right-radius: 25px !important;
369
- }
370
- .voicemessage{
371
- width: 200px;
372
- height: 35px;
373
- line-height: 35px;
374
- background-color: #e8eaec;
375
- border-radius: 10px;
376
- .icon-vioce{
377
- font-size: 24px;
378
- float: left;
379
- margin-left: 20px;
380
- margin-right: 20px;
381
- }
382
- .time{
383
- font-size: 14px;
384
- margin-left: 20px;
385
- }
386
- }
387
- span{
388
- margin-bottom: 5px;
389
- font-size: 12px;
390
- color: #a3a4a5;
391
- float: left;
392
- }
393
- .botname{
394
- margin-left: 10px;
395
- float: right;
396
- }
397
- .mb-0{
398
- margin-bottom: 0 !important;
399
- text-align: left;
400
- line-height: 1.3;
401
- margin-top: 0;
402
- font-size: 12px;
403
- }
404
- }
405
- }
406
- .video-player ,.video-js .vjs-icon-placeholder {
407
- width: 300px;
408
- height: 172px;
409
- display: block;
410
- }
411
- .el-image{
412
- float:right;
413
- width: 300px !important;
414
- height: auto !important;
415
- }
416
- }
417
- .message-kf{
418
- display: flex;
419
- margin-bottom: 20px;
420
- justify-content:flex-end;
421
- .user-detail{
422
- display: flex;
423
- align-items: flex-start;
424
- .media-body{
425
- //max-width: calc(100vw - 800px);
426
- border: 1px solid #c1e5ff !important;
427
- background-color: #c1e5ff !important;
428
- word-break: break-word;
429
- flex: 1;
430
- min-height: 25px;
431
- line-height: 25px;
432
- border-radius: 15px;
433
- border-top-right-radius: 0px;
434
- padding: 10px 10px 0 10px;
435
- text-align: left;
436
- h2{
437
- font-size: 18px;
438
- }
439
- p{
440
- margin-bottom: 5px;
441
- font-size: 14px;
442
- word-wrap:break-word;
443
- word-break:break-all;
444
- overflow: hidden;
445
- }
446
- .voicemessage{
447
- width: 200px;
448
- height: 35px;
449
- line-height: 35px;
450
- background-color: #e8eaec;
451
- border-radius: 10px;
452
- .icon-vioce{
453
- font-size: 24px;
454
- float: left;
455
- margin-left: 20px;
456
- margin-right: 20px;
457
- }
458
- .time{
459
- font-size: 14px;
460
- margin-left: 20px;
461
- }
462
- }
463
- span{
464
- margin-bottom: 5px;
465
- font-size: 12px;
466
- color: #a3a4a5;
467
- float: right;
468
- }
469
- .botname{
470
- margin-left: 10px;
471
- float: right;
472
- }
473
- .mb-0{
474
- margin-bottom: 0 !important;
475
- text-align: left;
476
- line-height: 1.3;
477
- margin-top: 0;
478
- font-size: 12px;
479
- }
480
- }
481
- }
482
- .video-player ,.video-js .vjs-icon-placeholder {
483
- width: 300px;
484
- height: 172px;
485
- display: block;
486
- }
487
- .el-image{
488
- float:right;
489
- width: 300px !important;
490
- height: auto !important;
491
- }
492
- }
493
- }
1
+ @import "../converSationContainer/common";
2
+ @import "../iconfont.css";
3
+ .video-player{
4
+ width: 260px!important;
5
+ }
6
+ // .video-js .vjs-big-play-button{
7
+ // top: 50px!important;
8
+ // left: 90px!important;
9
+ // }
10
+ .el-cascader-node__label{
11
+ padding: 0;
12
+ }
13
+ .el-cascader-node__postfix{
14
+ right: 5px;
15
+ }
16
+ .el-cascader-node{
17
+ height: 24px;
18
+ line-height: 24px;
19
+ padding: 0 20px 0 5px;
20
+ }
21
+ .el-radio{
22
+ width: 100%;
23
+ margin: 5px 0px;
24
+ }
25
+ .conversation-container{
26
+ width: 400px;
27
+ z-index: 999;
28
+ .conversation-container-d {
29
+ //background-color: rgba(0, 0, 0, 0) !important;
30
+ // height: 0 !important;
31
+ height: 100vh;
32
+ }
33
+ .test-box {
34
+ height: 100vh;
35
+ background-color:#323232;
36
+ display: flex;
37
+ flex-direction: column;
38
+ justify-content: flex-start;
39
+ .gr-header{
40
+ padding: 16px;
41
+ height: 16px;
42
+ flex: none;
43
+ border-bottom: solid 2px #424247;
44
+ display: flex;
45
+ justify-content: flex-start;
46
+ font-size: 16px;
47
+ .bot-name{
48
+ flex: auto;
49
+ text-align: left;
50
+ color: #ffffff;
51
+ i{
52
+ margin-left: 10px;
53
+ cursor: pointer;
54
+ font-weight: bolder;
55
+ }
56
+ }
57
+ .el-icon-refresh{
58
+ flex: none;
59
+ width: 24px;
60
+ /*color: @system_fontcolor_red;*/
61
+ color: #409EFF;
62
+ font-weight: bolder;
63
+ cursor: pointer;
64
+ }
65
+ .el-icon-close{
66
+ flex: none;
67
+ width: 24px;
68
+ color: #409EFF;
69
+ font-weight: bolder;
70
+ cursor: pointer;
71
+ }
72
+ }
73
+ .mod-loading{
74
+ flex: none;
75
+ padding: 5px;
76
+ background: #fff;
77
+ font-size: 14px;
78
+ color: #5857579c;
79
+ em {
80
+ font-size: 16px;
81
+ position: relative;
82
+ top: 1px;
83
+ font-weight: bolder;
84
+ margin-left: 5px;
85
+ }
86
+ }
87
+ .fade-enter-active, .fade-leave-active {
88
+ transition: opacity .5s
89
+ }
90
+ .fade-enter, .fade-leave-active {
91
+ opacity: 0
92
+ }
93
+ .gr-content {
94
+ flex: auto;
95
+ overflow: auto;
96
+ padding: 8px;
97
+ ul{
98
+ padding: 8px 0;
99
+ .via-bot-outer{
100
+ display: flex;
101
+ justify-content: flex-start;
102
+ .chat-content{
103
+ border-radius: 0 8px 8px 8px;
104
+ a {
105
+ color: royalblue !important;
106
+ }
107
+ a:link{
108
+ text-decoration: underline !important;
109
+ }
110
+ table{
111
+ color: red !important;
112
+ border: solid 1px red !important;
113
+ }
114
+ }
115
+ }
116
+ .via-user-outer{
117
+ display: flex;
118
+ justify-content: flex-end;
119
+ .chat-content{
120
+ border-radius:8px 0 8px 8px;
121
+ background-color: @system_fontcolor_red;
122
+ color: white;
123
+ }
124
+ }
125
+ li{
126
+ margin: 8px;
127
+ .via{
128
+ flex: none;
129
+ height: 30px;
130
+ width: 30px;
131
+ border-radius: 0 15px 15px 15px;
132
+ font-size: 28px;
133
+
134
+ }
135
+ .via-bot {
136
+ border: solid 1px @system_fontcolor_sub;
137
+ margin-right: 8px;
138
+ em {
139
+ color: @system_fontcolor_sub;
140
+ }
141
+
142
+ }
143
+ .via-user {
144
+ border: solid 1px @system_fontcolor_red;
145
+ margin-left: 8px;
146
+ em {
147
+ color:@system_fontcolor_red;
148
+ }
149
+ }
150
+ .chat-content{
151
+ background-color: white;
152
+ line-height: 26px;
153
+ padding: 8px;
154
+ max-width: 300px;
155
+ font-size: 14px;
156
+ text-align: left;
157
+ word-wrap: break-word;
158
+
159
+
160
+ .link-list-outer{
161
+ font-size: 14px;
162
+ .link-cell{
163
+ line-height: 16px;
164
+ display: block;
165
+ color: @system_fontcolor_red;
166
+ }
167
+ }
168
+ }
169
+ }
170
+ }
171
+ }
172
+ .gr-footer{
173
+ height: 32px;
174
+ padding: 8px;
175
+ flex: none;
176
+ .el-input{
177
+ .el-button{
178
+ color: white;
179
+ background-color: @system_fontcolor_red;
180
+ }
181
+ }
182
+ }
183
+ }
184
+
185
+ }
186
+ .dialog{
187
+ width: 51%;
188
+ margin: 0 auto;
189
+ background-color: #ffffff;
190
+ .list-paddingleft-2 {
191
+ padding-left: 16px !important;
192
+ color: hotpink;
193
+ }
194
+
195
+ ul,
196
+ ol,
197
+ li {
198
+ list-style-type: none;
199
+ }
200
+
201
+ ul, ul li {
202
+ list-style-type: disc !important;
203
+ }
204
+
205
+ ol, ol li{
206
+ list-style-type: decimal !important;
207
+ }
208
+
209
+ table,table tr th, table tr td {
210
+ border:1px solid #DDD !important;
211
+ }
212
+ table {
213
+ width: 200px; min-height: 25px; line-height: 25px; text-align: center; border-collapse: collapse !important;
214
+ }
215
+ .headerName{
216
+ padding: 20px;
217
+ text-align: center;
218
+ }
219
+ .dialogContent{
220
+ background-color: rgb(245, 245, 245);
221
+ height: calc(100vh - 170px);
222
+ display: flex;
223
+ flex-direction: column;
224
+ padding: 10px;
225
+ overflow-x: hidden;
226
+ overflow-y: auto;
227
+ .message-notice{
228
+ display: inline-block;
229
+ text-align: center;
230
+ margin-bottom: 20px;
231
+ width: 100%;
232
+ background-color: transparent !important;
233
+ }
234
+ .notice-content{
235
+ display: inline-block;
236
+ padding: 5px 10px;
237
+ border-radius: 5px;
238
+ background-color: #e8eaec;
239
+ color: #666666;
240
+ font-size: 12px;
241
+ }
242
+ .notice-content-day{
243
+ display: inline-block;
244
+ padding: 5px 10px;
245
+ .line-left{
246
+ display:inline-block;
247
+ width:100px;
248
+ height:1px;
249
+ margin-bottom: 5px;
250
+ margin-right: 5px;
251
+ //background:#dcdcdc;
252
+ background: -webkit-linear-gradient(left, #fff -4%,#666666 50%);
253
+
254
+ }
255
+ .line-text{
256
+ color: #666666;
257
+ font-size: 12px;
258
+ }
259
+ .line-right{
260
+ display:inline-block;
261
+ width:100px;
262
+ height:1px;
263
+ margin-bottom: 5px;
264
+ margin-left: 5px;
265
+ //background:#dcdcdc;
266
+ background: -webkit-linear-gradient(left,#666666 50%,#fff 100%);
267
+ }
268
+ }
269
+ //messages
270
+ .message{
271
+ display: flex;
272
+ margin-bottom: 20px;
273
+ justify-content:flex-start;
274
+ .user-detail{
275
+ display: flex;
276
+ align-items: flex-start;
277
+ .media-body{
278
+ //max-width: calc(100vw - 800px);
279
+ background-color: white;
280
+ // border: 1px solid #e4e3e3;
281
+ word-break: break-word;
282
+ flex: 1;
283
+ min-height: 25px;
284
+ line-height: 25px;
285
+ border-radius: 15px;
286
+ border-top-left-radius: 0px;
287
+ padding: 10px 10px 0 15px;
288
+ text-align: left;
289
+
290
+ h2{
291
+ font-size: 18px;
292
+ }
293
+ p{
294
+ margin-bottom: 5px;
295
+ font-size: 14px;
296
+ word-wrap:break-word;
297
+ word-break:break-all;
298
+ overflow: hidden;
299
+ }
300
+ .voicemessage{
301
+ width: 200px;
302
+ height: 35px;
303
+ line-height: 35px;
304
+ background-color: #e8eaec;
305
+ border-radius: 10px;
306
+ .icon-vioce{
307
+ font-size: 24px;
308
+ float: left;
309
+ margin-left: 20px;
310
+ margin-right: 20px;
311
+ }
312
+ .time{
313
+ font-size: 14px;
314
+ margin-left: 20px;
315
+ }
316
+ }
317
+ span{
318
+ margin-bottom: 5px;
319
+ font-size: 12px;
320
+ color: #a3a4a5;
321
+ float: left;
322
+ }
323
+ .botname{
324
+ margin-left: 10px;
325
+ float: right;
326
+ }
327
+ .mb-0{
328
+ margin-bottom: 0 !important;
329
+ text-align: left;
330
+ line-height: 1.3;
331
+ margin-top: 0;
332
+ font-size: 12px;
333
+ }
334
+ }
335
+ .media-body-ps{
336
+ //max-width: calc(100vw - 800px);
337
+ background-color: #f8f8f8;
338
+ border: 1px solid #e4e3e3;
339
+ word-break: break-word;
340
+ flex: 1;
341
+ min-height: 25px;
342
+ line-height: 25px;
343
+ border-radius: 25px;
344
+ border-top-left-radius: 0px;
345
+ text-align: left;
346
+ h2{
347
+ font-size: 18px;
348
+ }
349
+ .other{
350
+ margin-bottom: 5px;
351
+ font-size: 14px;
352
+ word-wrap:break-word;
353
+ word-break:break-all;
354
+ overflow: hidden;
355
+ padding: 10px 10px 0 15px;
356
+ }
357
+ .ps{
358
+ padding: 5px 10px 5px 15px;
359
+ height: 25px;
360
+ line-height: 25px;
361
+ border-top: 1px solid #e4e3e3;
362
+ background-color: #ffffff;
363
+ color: #409eff;
364
+ cursor:pointer;
365
+ }
366
+ .end{
367
+ border-bottom-left-radius: 25px !important;
368
+ border-bottom-right-radius: 25px !important;
369
+ }
370
+ .voicemessage{
371
+ width: 200px;
372
+ height: 35px;
373
+ line-height: 35px;
374
+ background-color: #e8eaec;
375
+ border-radius: 10px;
376
+ .icon-vioce{
377
+ font-size: 24px;
378
+ float: left;
379
+ margin-left: 20px;
380
+ margin-right: 20px;
381
+ }
382
+ .time{
383
+ font-size: 14px;
384
+ margin-left: 20px;
385
+ }
386
+ }
387
+ span{
388
+ margin-bottom: 5px;
389
+ font-size: 12px;
390
+ color: #a3a4a5;
391
+ float: left;
392
+ }
393
+ .botname{
394
+ margin-left: 10px;
395
+ float: right;
396
+ }
397
+ .mb-0{
398
+ margin-bottom: 0 !important;
399
+ text-align: left;
400
+ line-height: 1.3;
401
+ margin-top: 0;
402
+ font-size: 12px;
403
+ }
404
+ }
405
+ }
406
+ .video-player ,.video-js .vjs-icon-placeholder {
407
+ width: 300px;
408
+ height: 172px;
409
+ display: block;
410
+ }
411
+ .el-image{
412
+ float:right;
413
+ width: 300px !important;
414
+ height: auto !important;
415
+ }
416
+ }
417
+ .message-kf{
418
+ display: flex;
419
+ margin-bottom: 20px;
420
+ justify-content:flex-end;
421
+ .user-detail{
422
+ display: flex;
423
+ align-items: flex-start;
424
+ .media-body{
425
+ //max-width: calc(100vw - 800px);
426
+ border: 1px solid #c1e5ff !important;
427
+ background-color: #c1e5ff !important;
428
+ word-break: break-word;
429
+ flex: 1;
430
+ min-height: 25px;
431
+ line-height: 25px;
432
+ border-radius: 15px;
433
+ border-top-right-radius: 0px;
434
+ padding: 10px 10px 0 10px;
435
+ text-align: left;
436
+ h2{
437
+ font-size: 18px;
438
+ }
439
+ p{
440
+ margin-bottom: 5px;
441
+ font-size: 14px;
442
+ word-wrap:break-word;
443
+ word-break:break-all;
444
+ overflow: hidden;
445
+ }
446
+ .voicemessage{
447
+ width: 200px;
448
+ height: 35px;
449
+ line-height: 35px;
450
+ background-color: #e8eaec;
451
+ border-radius: 10px;
452
+ .icon-vioce{
453
+ font-size: 24px;
454
+ float: left;
455
+ margin-left: 20px;
456
+ margin-right: 20px;
457
+ }
458
+ .time{
459
+ font-size: 14px;
460
+ margin-left: 20px;
461
+ }
462
+ }
463
+ span{
464
+ margin-bottom: 5px;
465
+ font-size: 12px;
466
+ color: #a3a4a5;
467
+ float: right;
468
+ }
469
+ .botname{
470
+ margin-left: 10px;
471
+ float: right;
472
+ }
473
+ .mb-0{
474
+ margin-bottom: 0 !important;
475
+ text-align: left;
476
+ line-height: 1.3;
477
+ margin-top: 0;
478
+ font-size: 12px;
479
+ }
480
+ }
481
+ }
482
+ .video-player ,.video-js .vjs-icon-placeholder {
483
+ width: 300px;
484
+ height: 172px;
485
+ display: block;
486
+ }
487
+ .el-image{
488
+ float:right;
489
+ width: 300px !important;
490
+ height: auto !important;
491
+ }
492
+ }
493
+ }
494
494
  }