handy-uploader 1.1.8 → 2.0.0

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.
@@ -1,371 +0,0 @@
1
- <template>
2
- <div>
3
- <v-row>
4
- <v-col
5
- v-for="(attachment, index) in documentAttachment"
6
- :key="`attachment-${index}`"
7
- cols="12"
8
- md="4"
9
- xs="12"
10
- >
11
- <v-card
12
- :shaped="shaped"
13
- :outlined="outlined"
14
- :raised="raised"
15
- :tile="tile"
16
- class="mx-auto"
17
- max-width="344"
18
- >
19
- <template
20
- v-if="
21
- attachment.file.name
22
- .split('.')
23
- .pop()
24
- .toLowerCase() === 'jpg' ||
25
- attachment.file.name
26
- .split('.')
27
- .pop()
28
- .toLowerCase() === 'jpeg' ||
29
- attachment.file.name
30
- .split('.')
31
- .pop()
32
- .toLowerCase() === 'png' ||
33
- attachment.file.name
34
- .split('.')
35
- .pop()
36
- .toLowerCase() === 'tif' ||
37
- attachment.file.name
38
- .split('.')
39
- .pop()
40
- .toLowerCase() === 'bmp'
41
- "
42
- >
43
- <v-img
44
- :src="
45
- 'data:' + attachment.file.format + ',' + attachment.file.base64
46
- "
47
- height="200px"
48
- ></v-img>
49
- </template>
50
- <template v-else>
51
- <v-list-item-avatar
52
- style="margin-top: 0"
53
- tile
54
- width="345"
55
- height="192"
56
- color="blue-grey lighten-5"
57
- >
58
- <template>
59
- <v-icon
60
- v-if="
61
- attachment.file.name
62
- .split('.')
63
- .pop()
64
- .toLowerCase() === 'pdf'
65
- "
66
- size="120"
67
- file-word-outline
68
- color="red darken-1"
69
- >mdi-file-pdf-outline</v-icon
70
- >
71
- <v-icon
72
- v-else-if="
73
- attachment.file.name
74
- .split('.')
75
- .pop()
76
- .toLowerCase() === 'doc' ||
77
- attachment.file.name
78
- .split('.')
79
- .pop()
80
- .toLowerCase() === 'docx' ||
81
- attachment.file.name
82
- .split('.')
83
- .pop()
84
- .toLowerCase() === 'odt'
85
- "
86
- size="120"
87
- file-word-outline
88
- color="blue darken-1"
89
- >mdi-file-word-outline</v-icon
90
- >
91
- <v-icon
92
- v-else-if="
93
- attachment.file.name
94
- .split('.')
95
- .pop()
96
- .toLowerCase() === 'xls' ||
97
- attachment.file.name
98
- .split('.')
99
- .pop()
100
- .toLowerCase() === 'xlsx'
101
- "
102
- size="120"
103
- file-word-outline
104
- color="teal darken-1"
105
- >mdi-file-excel-outline</v-icon
106
- >
107
- <v-icon
108
- v-else-if="
109
- attachment.file.name
110
- .split('.')
111
- .pop()
112
- .toLowerCase() === 'pptx' ||
113
- attachment.file.name
114
- .split('.')
115
- .pop()
116
- .toLowerCase() === 'pptm' ||
117
- attachment.file.name
118
- .split('.')
119
- .pop()
120
- .toLowerCase() === 'ppt'
121
- "
122
- size="120"
123
- file-word-outline
124
- color="orange darken-3"
125
- >mdi-file-powerpoint-outline</v-icon
126
- >
127
- <v-icon
128
- v-else-if="
129
- attachment.file.name
130
- .split('.')
131
- .pop()
132
- .toLowerCase() === 'mp4' ||
133
- attachment.file.name
134
- .split('.')
135
- .pop()
136
- .toLowerCase() === 'mov' ||
137
- attachment.file.name
138
- .split('.')
139
- .pop()
140
- .toLowerCase() === 'flv' ||
141
- attachment.file.name
142
- .split('.')
143
- .pop()
144
- .toLowerCase() === 'wmv' ||
145
- attachment.file.name
146
- .split('.')
147
- .pop()
148
- .toLowerCase() === 'avi'
149
- "
150
- size="120"
151
- file-word-outline
152
- color="red lighten-1"
153
- >mdi-file-video-outline</v-icon
154
- >
155
- <v-icon
156
- v-else-if="
157
- attachment.file.name
158
- .split('.')
159
- .pop()
160
- .toLowerCase() === 'dwg'
161
- "
162
- size="120"
163
- file-word-outline
164
- color="indigo lighten-2"
165
- >mdi-file-cad</v-icon
166
- >
167
- <v-icon
168
- v-else-if="
169
- attachment.file.name
170
- .split('.')
171
- .pop()
172
- .toLowerCase() === 'zip' ||
173
- attachment.file.name
174
- .split('.')
175
- .pop()
176
- .toLowerCase() === 'rar' ||
177
- attachment.file.name
178
- .split('.')
179
- .pop()
180
- .toLowerCase() === '7-zip'
181
- "
182
- size="120"
183
- file-word-outline
184
- color="lime lighten-1"
185
- >mdi-folder-zip-outline</v-icon
186
- >
187
- <v-icon
188
- v-else-if="
189
- attachment.file.name
190
- .split('.')
191
- .pop()
192
- .toLowerCase() === 'txt'
193
- "
194
- size="120"
195
- file-word-outline
196
- color="light-green darken-3"
197
- >mdi-script-text-outline</v-icon
198
- >
199
- <v-icon
200
- v-else
201
- x-large
202
- file-word-outline
203
- color="indigo lighten-1"
204
- >mdi-file-question-outline</v-icon
205
- >
206
- </template>
207
- </v-list-item-avatar>
208
- </template>
209
-
210
- <v-card-subtitle style="height: 70px">
211
- {{ attachment.file.name }}
212
- </v-card-subtitle>
213
- <v-card-subtitle
214
- v-if="Number((attachment.file.size / 1000).toFixed(1)) < 1024"
215
- class="mt2"
216
- >
217
- <v-chip color="teal lighten-2" label text-color="white">
218
- {{
219
- Number((attachment.file.size / 1000).toFixed(1)) +
220
- " " +
221
- selectedLang[lang].size.kb
222
- }}
223
- <v-icon right>mdi-harddisk</v-icon>
224
- </v-chip>
225
- </v-card-subtitle>
226
- <v-card-subtitle
227
- v-if="Number((attachment.file.size / 1000).toFixed(1)) > 1024"
228
- >
229
- <v-chip color="teal lighten-2" label text-color="white">
230
- {{
231
- Number((attachment.file.size / 1000 / 1024).toFixed(1)) +
232
- " " +
233
- selectedLang[lang].size.mb
234
- }}
235
- <v-icon right>mdi-harddisk</v-icon>
236
- </v-chip>
237
- </v-card-subtitle>
238
- <v-divider class="mx-4"></v-divider>
239
- <v-spacer></v-spacer>
240
- <v-card-actions style="padding: 0">
241
- <v-tooltip right>
242
- <template v-slot:activator="{ on }">
243
- <v-btn
244
- v-if="deletePermission"
245
- text
246
- fab
247
- v-on="on"
248
- @click="openDeleteDialog(index, '')"
249
- ><v-icon color="red">mdi-trash-can-outline</v-icon></v-btn
250
- >
251
- </template>
252
- <span class="BYekan">{{ selectedLang[lang].delete }}</span>
253
- </v-tooltip>
254
- <v-tooltip right>
255
- <template v-slot:activator="{ on }">
256
- <v-btn
257
- v-if="editPermission"
258
- text
259
- fab
260
- v-on="on"
261
- @click="openEditDocumentDialog(attachment, index)"
262
- ><v-icon color="green">mdi-pencil-outline</v-icon></v-btn
263
- >
264
- </template>
265
- <span class="BYekan">{{ selectedLang[lang].edit }}</span>
266
- </v-tooltip>
267
-
268
- <v-spacer></v-spacer>
269
-
270
- <v-btn
271
- v-if="
272
- attachment.file.tags.length > 0 ||
273
- attachment.file.description !== ''
274
- "
275
- icon
276
- @click.prevent="
277
- attachment.file.showDetailState = !attachment.file
278
- .showDetailState
279
- "
280
- >
281
- <v-icon>{{
282
- attachment.file.showDetailState
283
- ? "mdi-chevron-up"
284
- : "mdi-chevron-down"
285
- }}</v-icon>
286
- </v-btn>
287
- </v-card-actions>
288
-
289
- <v-expand-transition>
290
- <template
291
- v-if="
292
- attachment.file.tags.length > 0 ||
293
- attachment.file.description !== ''
294
- "
295
- >
296
- <div v-show="attachment.file.showDetailState">
297
- <v-divider></v-divider>
298
- <v-chip-group
299
- v-if="attachment.file.tags.length > 0"
300
- multiple
301
- active-class="primary--text"
302
- style="padding: 8px"
303
- >
304
- <v-chip
305
- v-for="(tag, index) in attachment.file.tags"
306
- :key="`attachment-${index}`"
307
- style="margin: 5px"
308
- >
309
- {{ tag }}
310
- </v-chip>
311
- </v-chip-group>
312
- <v-card-text
313
- v-if="attachment.file.description != null"
314
- style="text-align: justify"
315
- >
316
- {{ attachment.file.description }}
317
- </v-card-text>
318
- </div>
319
- </template>
320
- </v-expand-transition>
321
- </v-card>
322
- </v-col>
323
- </v-row>
324
- </div>
325
- </template>
326
-
327
- <script>
328
- export default {
329
- props: {
330
- documentAttachment: [Array],
331
- thumb: {
332
- type: Boolean,
333
- default: true
334
- },
335
- lang: {
336
- type: String,
337
- default: "en"
338
- },
339
- cols: {
340
- type: Number,
341
- default: 4
342
- },
343
- editPermission: {
344
- type: Boolean,
345
- default: true
346
- },
347
- cardType: String,
348
- outlined: Boolean,
349
- raised: Boolean,
350
- shaped: Boolean,
351
- tile: Boolean,
352
- deletePermission: {
353
- type: Boolean,
354
- default: true
355
- },
356
- selectedLang: {}
357
- },
358
- data: () => ({}),
359
- methods: {
360
- setCardTheme() {
361
- this.$emit("setCardTheme");
362
- },
363
- openDeleteDialog(index, deleteId) {
364
- this.$emit("openDeleteDialog", index, deleteId);
365
- },
366
- openEditDocumentDialog(item, index) {
367
- this.$emit("openEditDocumentDialog", item, index);
368
- }
369
- }
370
- };
371
- </script>