askbot-dragon 1.5.19-beta → 1.5.21-beta

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 (4) hide show
  1. package/package.json +1 -1
  2. package/src/assets/less/ticketMessage.less +3 -3
  3. package/src/components/ConversationContainer.vue +116 -1
  4. package/src/components/message/TicketMessage.vue +46 -50
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "askbot-dragon",
3
- "version": "1.5.19-beta",
3
+ "version": "1.5.21-beta",
4
4
  "scripts": {
5
5
  "serve": "vue-cli-service serve",
6
6
  "build": "vue-cli-service build",
package/src/assets/less/ticketMessage.less CHANGED
@@ -162,7 +162,7 @@
162
162
  display: flex;
163
163
  justify-content: space-between;
164
164
  .singleItem{
165
- padding: 0 4px;
165
+ padding: 0;
166
166
  white-space: normal;
167
167
  word-wrap: break-word;
168
168
  text-align: left!important;
@@ -221,7 +221,7 @@
221
221
  align-items: center;
222
222
  .tripleItem{
223
223
  width: 33.33%;
224
- padding: 0 4px;
224
+ padding: 0;
225
225
  white-space: normal;
226
226
  word-wrap: break-word;
227
227
  }
@@ -251,7 +251,7 @@
251
251
  align-items: center;
252
252
  .quadrupleItem{
253
253
  width: 25%;
254
- padding: 0 4px;
254
+ padding: 0;
255
255
  white-space: normal;
256
256
  word-wrap: break-word;
257
257
  }
package/src/components/ConversationContainer.vue CHANGED
@@ -44,7 +44,7 @@
44
44
  <!-- <div v-html="htmlContainer"></div> -->
45
45
  <answer-radio :msg="answerRadios"></answer-radio>
46
46
  <ticket-message :content="updateTicetmessageObj"></ticket-message>
47
- <ticket-message :content="contents"></ticket-message>
47
+ <!-- <ticket-message :content="contents"></ticket-message> -->
48
48
  <!--
49
49
  <action-send-to-bot :msg="answerRadios"></action-send-to-bot>
50
50
  <text-message :text="text" @submitClick="submitClick"></text-message>
@@ -652,6 +652,121 @@ export default {
652
652
  ],
653
653
  apiKey: '123456789'
654
654
  },
655
+ utMessageObj2: {
656
+ version: 1,
657
+ cards: [
658
+ {
659
+ "scope": "system",
660
+ "multiple": false,
661
+ "style": "slide",
662
+ "version": 1,
663
+ "content": {
664
+ "htmlList": [
665
+ {
666
+ "style": [
667
+ {
668
+ "col": 1
669
+ }
670
+ ],
671
+ "list": [
672
+ "<p>11111111111111111111111111111111111111111</p>"
673
+ ],
674
+ "type": "SINGLE"
675
+ },
676
+ {
677
+ "style": [
678
+ {
679
+ "col": 1,
680
+ "colums": 2
681
+ },
682
+ {
683
+ "col": 1,
684
+ "colums": 2
685
+ }
686
+ ],
687
+ "list": [
688
+ "<p>11111111111111111111111111111111111111111</p>",
689
+ "<p>11111111111111111111111111111111111111111</p>"
690
+ ],
691
+ "type": "DOUBLE"
692
+ },
693
+ {
694
+ "style": [
695
+ {
696
+ "col": 1,
697
+ "colums": 3
698
+ },
699
+ {
700
+ "col": 2,
701
+ "colums": 3
702
+ }
703
+ ],
704
+ "list": [
705
+ "<p>11111111111111111111111111111111111111111</p>",
706
+ "<p>222222222222222222222222222222222</p>"
707
+ ],
708
+ "type": "DOUBLE"
709
+ },
710
+ {
711
+ "style": [
712
+ {
713
+ "col": 1,
714
+ "colums": 4
715
+ },
716
+ {
717
+ "col": 3,
718
+ "colums": 4
719
+ }
720
+ ],
721
+ "list": [
722
+ "<p>11111111111111111111111111111111111111111</p>",
723
+ "<p>333333333333333333333333333333333333333333</p>"
724
+ ],
725
+ "type": "DOUBLE"
726
+ },
727
+ {
728
+ "style": [
729
+ {
730
+ "col": 2,
731
+ "colums": 3
732
+ },
733
+ {
734
+ "col": 1,
735
+ "colums": 3
736
+ }
737
+ ],
738
+ "list": [
739
+ "<p>222222222222222222222222222222222</p>",
740
+ "<p>11111111111111111111111111111111111111111</p>"
741
+ ],
742
+ "type": "DOUBLE"
743
+ },
744
+ {
745
+ "style": [
746
+ {
747
+ "col": 3,
748
+ "colums": 4
749
+ },
750
+ {
751
+ "col": 1,
752
+ "colums": 4
753
+ }
754
+ ],
755
+ "list": [
756
+ "<p>333333333333333333333333333333333333333333</p>",
757
+ "<p>11111111111111111111111111111111111111111</p>"
758
+ ],
759
+ "type": "DOUBLE"
760
+ }
761
+ ],
762
+ "buttonList": []
763
+ }
764
+ }
765
+ ],
766
+ "apiKey": "398ba0d1857644d288a39dff6248ee63",
767
+ multiple: false,
768
+ "style": "slide"
769
+ },
655
770
  contents: {
656
771
  multiple: true,
657
772
  cards: [
package/src/components/message/TicketMessage.vue CHANGED
@@ -3,40 +3,41 @@
3
3
  <div class="ticketMessage">
4
4
  <ticket-swiper ref="swiper" :content="content" :type="type" @touchEnd="touchEnd">
5
5
  <template>
6
- <ticket-swiper-item v-for="(item, _index) in content.cards" :key="_index" :content="content">
6
+ <ticket-swiper-item v-for="(item, _index) in formatContent(content.cards)" :key="_index" :content="content">
7
7
  <template>
8
8
  <div class="ticketMessageContain">
9
9
  <div :class="{ isPhoneClass: isPhone === true, isCompayClass: isCompany === true }">
10
10
  <div :class="{ isIosClass: isIos === true, isAndroidClass: isAndroid === true }">
11
11
  <div class="htmlClass">
12
- <div v-for="(items, ind) in item.content.htmlList" :key="ind" class="html-item">
12
+ <div v-for="(items, ind) in item.content.htmlList" :key="'Out_' + ind" class="html-item">
13
13
  <div class="img" v-if="items.type === 'IMAGE'">
14
14
  <img :src="items.src">
15
15
  </div>
16
- <div class="singleClass" v-else-if="items.type === 'SINGLE'">
17
- <div v-html="itemss" class="singleItem" v-for="(itemss, inde) in items.list" :key="inde"></div>
16
+ <div class="singleClass" v-if="items.type === 'SINGLE'">
17
+ <div v-html="itemss" class="singleItem" v-for="(itemss, inde) in items.list" :key="'s_' + inde">
18
+ </div>
18
19
  </div>
19
- <div class="doubleClass" v-else-if="items.type === 'DOUBLE' && item.version != 1">
20
+ <div class="doubleClass" v-if="items.type === 'DOUBLE' && item.version != 1">
20
21
  <div class="doubleItem" v-for="(itemss, index) in items.list" :key="'__' + index"
21
22
  v-html="itemss">
22
23
  </div>
23
24
  </div>
24
- <div class="updateDoubleClass" v-else-if="items.type === 'DOUBLE' && item.version == 1">
25
+ <div class="updateDoubleClass" v-if="items.type === 'DOUBLE' && item.version == 1">
25
26
  <div class="doubleItem" :style="{ 'width': itemss.style.col / itemss.style.colums * 100 + '%' }"
26
- v-for="(itemss, index) in items.tampList" :key="'__' + index" v-html="itemss.html">
27
+ v-for="(itemss, index) in items.tampList" :key="'__D' + index" v-html="itemss.html">
27
28
  </div>
28
29
  <!-- <div class="doubleItem" v-for="(itemss,index) in items.tampList" :key="'__'+index">
29
30
  {{itemss.style.col/itemss.style.colums*100}}{{itemss.html}}
30
31
  </div> -->
31
32
  </div>
32
- <div class="tripleClass" v-else-if="items.type === 'TRIPLE'">
33
+ <div class="tripleClass" v-if="items.type === 'TRIPLE'">
33
34
  <div v-html="itemss" class="tripleItem" v-for="(itemss, index) in items.list"
34
- :key="'___' + index">
35
+ :key="'__t_' + index">
35
36
  </div>
36
37
  </div>
37
- <div class="quadrupleClass" v-else-if="items.type === 'QUADRUPLE'">
38
+ <div class="quadrupleClass" v-if="items.type === 'QUADRUPLE'">
38
39
  <div v-html="itemss" class="quadrupleItem" v-for="(itemss, index) in items.list"
39
- :key="'___' + index"></div>
40
+ :key="'_q__' + index"></div>
40
41
  </div>
41
42
  </div>
42
43
  </div>
@@ -80,30 +81,6 @@ export default {
80
81
  },
81
82
  data() {
82
83
  return {
83
- contents: {
84
- multiple: true,
85
- cards: [
86
- {
87
- content: {
88
- htmlList: [{ type: 'IMAGE', src: 'https://guoranopen-zjk.oss-cn-zhangjiakou.aliyuncs.com/cdn-office-website/images/09-4.png' }, { type: 'SINGLE', list: ['<p>aaaaaaaaaa</p>'] }, { type: 'DOUBLE', list: ['<p>北京首都国际机场</p>', '<div>bbbbb</div>'] }, { type: 'TRIPLE', list: ['<p>北京首都国际机场啦啦啦啦</p>', '<div>CA5689</div>', '<p>上海虹桥国际机场</p>'] }, { type: 'TRIPLE', list: ['<p>7:00</p>', '<div>SSS</div>', '<p>12:00</p>'] }],
89
- buttonList: [{ name: '我是标签1', scope: '', test: '' }, { name: '我是标签2' }]
90
- }
91
- },
92
- {
93
- content: {
94
- htmlList: [{ type: 'SINGLE', list: ['<p>aaaaa</p>', '<a>我是链接</a>'] }, { type: 'DOUBLE', list: ['<p>aaaaa</p>', '<div>bbbbb</div>'] }, { type: 'TRIPLE', list: ['<p>7:00</p>', '<div></div>', '<p>ccccc</p>'] }, { type: 'TRIPLE', list: ['<p>7:00</p>', '<div>bbbbb</div>', '<p>12:00</p>'] }],
95
- buttonList: [{ name: '我是标签1', scope: '', test: '' }]
96
- }
97
- },
98
- {
99
- content: {
100
- htmlList: [{ type: 'SINGLE', list: ['<p>邓伦李沁的背景图片</p>'] }, { type: 'SINGLE', list: ['<p>男生藏快递向求婚被他人错拆</p>'] }, { type: 'SINGLE', list: ['<p>aaaaa</p>'] }, { type: 'SINGLE', list: ['<p>aaaaa</p>'] }],
101
- buttonList: [{ name: '我是标签1' }]
102
- }
103
- }
104
-
105
- ]
106
- },
107
84
  device: 'PC',
108
85
  slideWidth: '',
109
86
  swiperStyle: {},
@@ -124,23 +101,42 @@ export default {
124
101
  this.isMobile()
125
102
  },
126
103
  mounted() {
127
- this.content.cards.forEach(element => {
128
- if (element.version == 1) {
129
- element.content.htmlList.forEach((item) => {
130
- item.tampList = [];
131
- item.list.forEach((cell, cellIndex) => {
132
- let tampCell = {
133
- html: cell,
134
- style: item.style[cellIndex]
135
- }
136
- item.tampList.push(tampCell);
137
- })
138
- })
139
- }
140
- });
141
- this.content.cards = [...this.content.cards];
104
+ // console.log(JSON.stringify(this.content.cards));
105
+ // this.content.cards.forEach(element => {
106
+ // if (element.version == 1) {
107
+ // element.content.htmlList.forEach((item) => {
108
+ // item.tampList = [];
109
+ // item.list.forEach((cell, cellIndex) => {
110
+ // let tampCell = {
111
+ // html: cell,
112
+ // style: item.style[cellIndex]
113
+ // }
114
+ // item.tampList.push(tampCell);
115
+ // })
116
+ // })
117
+ // }
118
+ // });
119
+ // this.content.cards = [...this.content.cards];
120
+ // console.log(this.content.cards);
142
121
  },
143
122
  methods: {
123
+ formatContent(arr) {
124
+ arr.forEach(element => {
125
+ if (element.version == 1) {
126
+ element.content.htmlList.forEach((item) => {
127
+ item.tampList = [];
128
+ item.list.forEach((cell, cellIndex) => {
129
+ let tampCell = {
130
+ html: cell,
131
+ style: item.style[cellIndex]
132
+ }
133
+ item.tampList.push(tampCell);
134
+ })
135
+ })
136
+ }
137
+ });
138
+ return arr;
139
+ },
144
140
  SwiperImgLoad() {
145
141
  if (!this.loadCheck) {
146
142
  this.$emit("SwiperImgLoadEvent");