vue-intergrall-plugins 1.0.79 → 1.0.81
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/dist/vue-intergrall-plugins.esm.js +21 -99
- package/dist/vue-intergrall-plugins.min.js +1 -1
- package/dist/vue-intergrall-plugins.ssr.js +16 -66
- package/package.json +1 -1
- package/src/lib-components/Messages/ChatMessages.vue +33 -37
- package/src/lib-components/Messages/InteratividadeBotoes.vue +41 -42
- package/src/lib-components/Messages/InteratividadeFormulario.vue +55 -131
|
@@ -1,121 +1,38 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div class="interatividade">
|
|
3
|
-
<div v-if="Object.keys(infoCanal).length > 0">
|
|
4
|
-
<!-- CHIPS -->
|
|
5
|
-
<div class="d-flex overflow-hidden mt-10 w-100 d-flex flex-wrap">
|
|
6
|
-
<div
|
|
7
|
-
v-if="situation || deadline.text"
|
|
8
|
-
class="d-flex-center flex-column w-100 border-radius-10 border-1 bg-dark-white-2 border-color-gray p-10 mb-10"
|
|
9
|
-
:style="`${
|
|
10
|
-
situation && situation.cor ? `border: 1px solid ${situation.cor}` : ''
|
|
11
|
-
}`"
|
|
12
|
-
>
|
|
13
|
-
<div class="d-flex w-100 mb-5">
|
|
14
|
-
<strong
|
|
15
|
-
v-if="situation"
|
|
16
|
-
class="text-ellipsis text-left fs-_85"
|
|
17
|
-
v-text="`${dictionary.chip_situacao}:`"
|
|
18
|
-
></strong>
|
|
19
|
-
<span
|
|
20
|
-
v-if="situation"
|
|
21
|
-
:style="`color: ${situation.cor}`"
|
|
22
|
-
class="ml-5 text-left fs-_85 text-shadow"
|
|
23
|
-
v-text="verificaInfos(situation)"
|
|
24
|
-
></span>
|
|
25
|
-
</div>
|
|
26
|
-
<div class="d-flex w-100" v-if="deadline.text">
|
|
27
|
-
<strong
|
|
28
|
-
v-text="`${deadline.title}:`"
|
|
29
|
-
class="text-ellipsis text-left fs-_75"
|
|
30
|
-
></strong>
|
|
31
|
-
<span class="ml-5 text-nowrap text-left fs-_75" v-text="deadline.text"></span>
|
|
32
|
-
</div>
|
|
33
|
-
</div>
|
|
34
|
-
</div>
|
|
35
|
-
</div>
|
|
36
3
|
<!-- TABELA INTERATIVIDADE HO -->
|
|
37
4
|
<template v-if="informacao.length">
|
|
38
|
-
<div class="interatividade-form-header d-flex justify-content-between">
|
|
39
|
-
{{ dictionary.msg_abertura_reclamacao }}
|
|
40
|
-
<span class="d-flex-center">
|
|
41
|
-
<fa-icon :icon="['fas', 'calendar']" class="mr-5" />
|
|
42
|
-
{{ formataDataHora(infoCanal.DATA_ABERTURA) }}
|
|
43
|
-
</span>
|
|
44
|
-
</div>
|
|
45
5
|
<div class="interatividade-form-body">
|
|
46
|
-
<div
|
|
47
|
-
v-
|
|
48
|
-
|
|
49
|
-
class="interatividade-info-form"
|
|
50
|
-
>
|
|
51
|
-
<p
|
|
52
|
-
v-if="form.TIPO_TEXTO < 1000"
|
|
53
|
-
v-text="form.DESC_TIPO_TEXTO"
|
|
54
|
-
class="interatividade-titulo-form"
|
|
55
|
-
></p>
|
|
56
|
-
<p
|
|
57
|
-
v-if="form.TIPO_TEXTO < 1000"
|
|
58
|
-
v-text="form.TEXTO"
|
|
59
|
-
class="interatividade-description-form"
|
|
60
|
-
></p>
|
|
6
|
+
<div v-for="form in informacao" :key="form.TIPO_TEXTO" class="interatividade-info-form">
|
|
7
|
+
<p v-if="form.TIPO_TEXTO < 1000" v-text="form.DESC_TIPO_TEXTO" class="interatividade-titulo-form"></p>
|
|
8
|
+
<p v-if="form.TIPO_TEXTO < 1000" v-text="form.TEXTO" class="interatividade-description-form"></p>
|
|
61
9
|
</div>
|
|
62
10
|
<div v-if="informacaoAdicional.length" class="interatividade-form-header">
|
|
63
11
|
{{ dictionary.msg_info_adicional }}
|
|
64
12
|
</div>
|
|
65
13
|
<div class="interatividade-form-body">
|
|
66
|
-
<div
|
|
67
|
-
v-for="form in informacaoAdicional"
|
|
68
|
-
:key="form.TIPO_TEXTO"
|
|
69
|
-
class="interatividade-add-info-form"
|
|
70
|
-
>
|
|
14
|
+
<div v-for="form in informacaoAdicional" :key="form.TIPO_TEXTO" class="interatividade-add-info-form">
|
|
71
15
|
<div class="divisor-form-info-aditional">
|
|
72
16
|
<div class="info-aditional">
|
|
73
|
-
<p
|
|
74
|
-
|
|
75
|
-
v-text="form.DESC_TIPO_TEXTO + ': '"
|
|
76
|
-
class="interatividade-titulo-form"
|
|
77
|
-
></p>
|
|
17
|
+
<p v-if="form.TIPO_TEXTO > 999" v-text="form.DESC_TIPO_TEXTO + ': '" class="interatividade-titulo-form">
|
|
18
|
+
</p>
|
|
78
19
|
</div>
|
|
79
20
|
<div class="info-aditional">
|
|
80
|
-
<p
|
|
81
|
-
v-if="form.TIPO_TEXTO > 999"
|
|
82
|
-
v-text="form.TEXTO"
|
|
83
|
-
class="interatividade-description-form"
|
|
84
|
-
></p>
|
|
21
|
+
<p v-if="form.TIPO_TEXTO > 999" v-text="form.TEXTO" class="interatividade-description-form"></p>
|
|
85
22
|
</div>
|
|
86
23
|
</div>
|
|
87
24
|
</div>
|
|
88
25
|
</div>
|
|
89
26
|
<h3 class="m-5 text-bold" v-text="`Anexos`"></h3>
|
|
90
27
|
<div class="d-flex flex-wrap align-items-center">
|
|
91
|
-
<div
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
v-if="!type"
|
|
100
|
-
:src="`${dominio}/callcenter/docs.php?mku=${mku}`"
|
|
101
|
-
:alt="name"
|
|
102
|
-
:title="name"
|
|
103
|
-
/>
|
|
104
|
-
<fa-icon
|
|
105
|
-
v-else
|
|
106
|
-
:icon="returnCurrentIcon(type)"
|
|
107
|
-
@click="openFile(mku, type)"
|
|
108
|
-
:class="returnCurrentClass(type)"
|
|
109
|
-
:title="name"
|
|
110
|
-
/>
|
|
111
|
-
<a
|
|
112
|
-
class="d-flex align-items-end ml-3 text-dark"
|
|
113
|
-
:href="`${dominio}/callcenter/docs.php?mku=${mkuDownload}`"
|
|
114
|
-
:download="`${name}`"
|
|
115
|
-
target="_blank"
|
|
116
|
-
rel="noreferrer noopener"
|
|
117
|
-
:title="`Download ${name}`"
|
|
118
|
-
>
|
|
28
|
+
<div v-for="({ name, type, mkuDownload, mku }, fileIndex) in anexos" :key="`file-${fileIndex}`"
|
|
29
|
+
class="mb-5 mx-5 d-flex">
|
|
30
|
+
<img class="box-shadow max-w-75px max-h-75px cursor-pointer" @click="openFile(mku, type)" v-if="!type"
|
|
31
|
+
:src="`${dominio}/callcenter/docs.php?mku=${mku}`" :alt="name" :title="name" />
|
|
32
|
+
<fa-icon v-else :icon="returnCurrentIcon(type)" @click="openFile(mku, type)"
|
|
33
|
+
:class="returnCurrentClass(type)" :title="name" />
|
|
34
|
+
<a class="d-flex align-items-end ml-3 text-dark" :href="`${dominio}/callcenter/docs.php?mku=${mkuDownload}`"
|
|
35
|
+
:download="`${name}`" target="_blank" rel="noreferrer noopener" :title="`Download ${name}`">
|
|
119
36
|
<fa-icon :icon="['fas', 'download']" />
|
|
120
37
|
</a>
|
|
121
38
|
</div>
|
|
@@ -127,7 +44,7 @@
|
|
|
127
44
|
</template>
|
|
128
45
|
<script>
|
|
129
46
|
import InteratividadePopup from "./InteratividadePopup";
|
|
130
|
-
import {
|
|
47
|
+
import { formataDataHora } from "../../services/textFormatting";
|
|
131
48
|
|
|
132
49
|
export default {
|
|
133
50
|
components: { InteratividadePopup },
|
|
@@ -142,11 +59,6 @@ export default {
|
|
|
142
59
|
type: Object,
|
|
143
60
|
required: true,
|
|
144
61
|
},
|
|
145
|
-
infoCanal: {
|
|
146
|
-
type: [Object, Array],
|
|
147
|
-
required: false,
|
|
148
|
-
default: {},
|
|
149
|
-
},
|
|
150
62
|
dominio: {
|
|
151
63
|
type: String,
|
|
152
64
|
required: true,
|
|
@@ -160,30 +72,6 @@ export default {
|
|
|
160
72
|
required: false,
|
|
161
73
|
},
|
|
162
74
|
},
|
|
163
|
-
computed: {
|
|
164
|
-
situation() {
|
|
165
|
-
try {
|
|
166
|
-
const { SITUACAO } = this.infoCanal;
|
|
167
|
-
return SITUACAO ? SITUACAO : null;
|
|
168
|
-
} catch (e) {
|
|
169
|
-
console.error("Erro ao gerar a situacao do atendimento");
|
|
170
|
-
console.error(e);
|
|
171
|
-
}
|
|
172
|
-
},
|
|
173
|
-
deadline() {
|
|
174
|
-
try {
|
|
175
|
-
const { PRAZO, NOME_CAMPO_PRAZO } = this.infoCanal;
|
|
176
|
-
return {
|
|
177
|
-
text: PRAZO ? formataData(PRAZO) : "---",
|
|
178
|
-
title: NOME_CAMPO_PRAZO ? NOME_CAMPO_PRAZO : this.dictionary.tit_prazo,
|
|
179
|
-
};
|
|
180
|
-
} catch (e) {
|
|
181
|
-
console.error("Erro ao gerar o prazo do atendimento");
|
|
182
|
-
console.error(e);
|
|
183
|
-
return {};
|
|
184
|
-
}
|
|
185
|
-
},
|
|
186
|
-
},
|
|
187
75
|
mounted() {
|
|
188
76
|
if (this.validateInterativity()) {
|
|
189
77
|
this.verifyInfoAditional();
|
|
@@ -191,9 +79,8 @@ export default {
|
|
|
191
79
|
},
|
|
192
80
|
methods: {
|
|
193
81
|
returnCurrentClass(isDoc) {
|
|
194
|
-
return `fs-2 cursor-pointer ${
|
|
195
|
-
|
|
196
|
-
}`;
|
|
82
|
+
return `fs-2 cursor-pointer ${typeof isDoc == "string" && isDoc.indexOf("pdf") > -1 ? "text-red" : "text-blue"
|
|
83
|
+
}`;
|
|
197
84
|
},
|
|
198
85
|
returnCurrentIcon(isDoc) {
|
|
199
86
|
return typeof isDoc == "string" && isDoc.indexOf("pdf") > -1
|
|
@@ -260,10 +147,12 @@ export default {
|
|
|
260
147
|
align-items: center;
|
|
261
148
|
justify-content: space-around;
|
|
262
149
|
}
|
|
150
|
+
|
|
263
151
|
.info-aditional {
|
|
264
152
|
border-bottom: 1px solid #ccc;
|
|
265
153
|
width: 49%;
|
|
266
154
|
}
|
|
155
|
+
|
|
267
156
|
.interatividade-form-header {
|
|
268
157
|
background-color: #efefef;
|
|
269
158
|
margin-top: 5px;
|
|
@@ -279,6 +168,7 @@ export default {
|
|
|
279
168
|
font-weight: 700;
|
|
280
169
|
font-size: 14.4px;
|
|
281
170
|
}
|
|
171
|
+
|
|
282
172
|
.interatividade-form-body {
|
|
283
173
|
padding: 0px 10px;
|
|
284
174
|
background: white;
|
|
@@ -288,9 +178,11 @@ export default {
|
|
|
288
178
|
border-bottom-right-radius: 10px;
|
|
289
179
|
padding-bottom: 10px;
|
|
290
180
|
}
|
|
181
|
+
|
|
291
182
|
.interatividade {
|
|
292
183
|
margin: 10px 0;
|
|
293
184
|
}
|
|
185
|
+
|
|
294
186
|
.interatividade-titulo-form {
|
|
295
187
|
white-space: nowrap;
|
|
296
188
|
text-overflow: ellipsis;
|
|
@@ -301,106 +193,138 @@ export default {
|
|
|
301
193
|
padding: 0;
|
|
302
194
|
padding-top: 5px;
|
|
303
195
|
}
|
|
196
|
+
|
|
304
197
|
.interatividade-description-form {
|
|
305
198
|
overflow: hidden;
|
|
306
199
|
max-width: 100%;
|
|
307
200
|
margin: 0;
|
|
308
201
|
padding: 0;
|
|
309
202
|
}
|
|
203
|
+
|
|
310
204
|
.text-dark {
|
|
311
205
|
color: #333;
|
|
312
206
|
}
|
|
207
|
+
|
|
313
208
|
.ml-3 {
|
|
314
209
|
margin-left: 3px;
|
|
315
210
|
}
|
|
211
|
+
|
|
316
212
|
.flex-wrap {
|
|
317
213
|
flex-wrap: wrap;
|
|
318
214
|
}
|
|
215
|
+
|
|
319
216
|
.align-items-center {
|
|
320
217
|
align-items: center;
|
|
321
218
|
}
|
|
219
|
+
|
|
322
220
|
.d-flex {
|
|
323
221
|
display: flex;
|
|
324
222
|
}
|
|
223
|
+
|
|
325
224
|
.align-items-end {
|
|
326
225
|
align-items: flex-end;
|
|
327
226
|
}
|
|
227
|
+
|
|
328
228
|
.flex-column {
|
|
329
229
|
flex-direction: column;
|
|
330
230
|
}
|
|
231
|
+
|
|
331
232
|
.text-bold {
|
|
332
233
|
font-weight: bold;
|
|
333
234
|
}
|
|
235
|
+
|
|
334
236
|
.m-5 {
|
|
335
237
|
margin: 5px;
|
|
336
238
|
}
|
|
239
|
+
|
|
337
240
|
.mb-5 {
|
|
338
241
|
margin-bottom: 5px;
|
|
339
242
|
}
|
|
243
|
+
|
|
340
244
|
.mx-5 {
|
|
341
245
|
margin-left: 5px;
|
|
342
246
|
margin-right: 5px;
|
|
343
247
|
}
|
|
248
|
+
|
|
344
249
|
.cursor-pointer {
|
|
345
250
|
cursor: pointer;
|
|
346
251
|
}
|
|
252
|
+
|
|
347
253
|
.bg-dark-white-2 {
|
|
348
254
|
background-color: #f7f7f7;
|
|
349
255
|
}
|
|
256
|
+
|
|
350
257
|
.border-radius-10 {
|
|
351
258
|
border-radius: 10px;
|
|
352
259
|
}
|
|
260
|
+
|
|
353
261
|
.w-100 {
|
|
354
262
|
width: 100%;
|
|
355
263
|
}
|
|
264
|
+
|
|
356
265
|
.overflow-hidden {
|
|
357
266
|
overflow: hidden;
|
|
358
267
|
}
|
|
268
|
+
|
|
359
269
|
.mt-10 {
|
|
360
270
|
margin-top: 10px;
|
|
361
271
|
}
|
|
272
|
+
|
|
362
273
|
.flex-wrap {
|
|
363
274
|
flex-wrap: wrap;
|
|
364
275
|
}
|
|
276
|
+
|
|
365
277
|
.d-flex {
|
|
366
278
|
display: flex;
|
|
367
279
|
}
|
|
280
|
+
|
|
368
281
|
.p-10 {
|
|
369
282
|
padding: 10px;
|
|
370
283
|
}
|
|
284
|
+
|
|
371
285
|
.mb-5 {
|
|
372
286
|
margin-bottom: 5px;
|
|
373
287
|
}
|
|
288
|
+
|
|
374
289
|
.mb-10 {
|
|
375
290
|
margin-bottom: 10px;
|
|
376
291
|
}
|
|
292
|
+
|
|
377
293
|
.d-flex-center {
|
|
378
294
|
display: flex;
|
|
379
295
|
justify-content: center;
|
|
380
296
|
align-items: center;
|
|
381
297
|
}
|
|
298
|
+
|
|
382
299
|
.fs-_85 {
|
|
383
300
|
font-size: 13.6px;
|
|
384
301
|
}
|
|
302
|
+
|
|
385
303
|
.text-ellipsis {
|
|
386
304
|
text-overflow: ellipsis;
|
|
387
305
|
}
|
|
306
|
+
|
|
388
307
|
.text-left {
|
|
389
308
|
text-align: left;
|
|
390
309
|
}
|
|
310
|
+
|
|
391
311
|
.text-ellipsis {
|
|
392
312
|
white-space: nowrap;
|
|
393
313
|
overflow: hidden;
|
|
394
314
|
}
|
|
315
|
+
|
|
395
316
|
.ml-5 {
|
|
396
317
|
margin-left: 5px;
|
|
397
318
|
}
|
|
319
|
+
|
|
398
320
|
.text-shadow {
|
|
399
321
|
text-shadow: 0 0 #000;
|
|
400
322
|
}
|
|
323
|
+
|
|
401
324
|
.justify-content-between {
|
|
402
325
|
justify-content: space-between;
|
|
403
326
|
}
|
|
327
|
+
|
|
404
328
|
.mr-5 {
|
|
405
329
|
margin-right: 5px;
|
|
406
330
|
}
|