generic-skin 2.5.3 → 2.9.56
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/apps/vueChrono.js +70 -69
- package/apps/vueChrono.min.js +1 -1
- package/apps/vueDefault.js +462 -117
- package/apps/vueDefault.min.js +2 -4
- package/apps/vueMulti.js +71 -61
- package/apps/vueMulti.min.js +1 -1
- package/apps/vueRela.js +68 -67
- package/apps/vueRela.min.js +1 -1
- package/config/vueComponents.js +161 -194
- package/config/vueComponents.min.js +2 -2
- package/config/vueElements.js +1 -1
- package/config/vueElements.min.js +1 -1
- package/config/vueFilters.js +6 -0
- package/config/vueFilters.min.js +1 -1
- package/extensions/vueRouter.js +1 -1
- package/extensions/vueRouter.min.js +0 -0
- package/frameworks/FNRFramework.js +1145 -860
- package/frameworks/FNRFramework.min.js +1 -1
- package/general.js +95 -41
- package/general.min.js +1 -1
- package/options/noManagers.js +18 -18
- package/options/noManagers.min.js +1 -1
- package/package.json +1 -1
- package/pages/ucp.js +49 -13
- package/pages/ucp.min.js +1 -1
- package/plugins/sjcl.min.js +0 -0
- package/readme.md +0 -0
- package/stylesheet.css +58 -27
- package/stylesheet.min.css +1 -1
package/apps/vueChrono.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
Vue.component('modal-cronologia', {
|
|
2
|
-
props: ['
|
|
3
|
-
data
|
|
2
|
+
props: ['element', 'type'],
|
|
3
|
+
data() {
|
|
4
4
|
return {
|
|
5
5
|
page: 0,
|
|
6
6
|
state: {
|
|
@@ -12,17 +12,17 @@ Vue.component('modal-cronologia', {
|
|
|
12
12
|
selector: true
|
|
13
13
|
},
|
|
14
14
|
content: {
|
|
15
|
-
edit: JSON.parse(JSON.stringify(this.
|
|
16
|
-
current: this.
|
|
15
|
+
edit: JSON.parse(JSON.stringify(this.element)),
|
|
16
|
+
current: this.element
|
|
17
17
|
}
|
|
18
18
|
}
|
|
19
19
|
},
|
|
20
20
|
computed: {
|
|
21
|
-
modalTitle
|
|
22
|
-
if (this.
|
|
23
|
-
else if (this.
|
|
21
|
+
modalTitle() {
|
|
22
|
+
if (this.type === 'new') return 'Nueva entrada';
|
|
23
|
+
else if (this.type === 'edit') return 'Editar entrada';
|
|
24
24
|
},
|
|
25
|
-
oneCheck
|
|
25
|
+
oneCheck() {
|
|
26
26
|
let final = '';
|
|
27
27
|
|
|
28
28
|
if (!Object.keys(this.content.edit).length) return final;
|
|
@@ -77,7 +77,7 @@ Vue.component('modal-cronologia', {
|
|
|
77
77
|
|
|
78
78
|
return final;
|
|
79
79
|
},
|
|
80
|
-
secondCheck
|
|
80
|
+
secondCheck() {
|
|
81
81
|
let final = '';
|
|
82
82
|
|
|
83
83
|
if (!Object.keys(this.content.edit).length) return final;
|
|
@@ -92,10 +92,10 @@ Vue.component('modal-cronologia', {
|
|
|
92
92
|
|
|
93
93
|
return final;
|
|
94
94
|
},
|
|
95
|
-
finalCheck
|
|
95
|
+
finalCheck() {
|
|
96
96
|
return JSON.stringify(this.content.current) !== JSON.stringify(this.finalData);
|
|
97
97
|
},
|
|
98
|
-
finalData
|
|
98
|
+
finalData() {
|
|
99
99
|
let data = JSON.parse(JSON.stringify(this.content.edit));
|
|
100
100
|
|
|
101
101
|
if (!Object.keys(this.content.edit).length) return data;
|
|
@@ -129,7 +129,7 @@ Vue.component('modal-cronologia', {
|
|
|
129
129
|
|
|
130
130
|
return data;
|
|
131
131
|
},
|
|
132
|
-
sortedCharacters
|
|
132
|
+
sortedCharacters() {
|
|
133
133
|
if (!Object.keys(this.content.edit).length) return this.$parent.users.map((item) => {
|
|
134
134
|
return item.user;
|
|
135
135
|
});
|
|
@@ -141,7 +141,7 @@ Vue.component('modal-cronologia', {
|
|
|
141
141
|
return item.toLowerCase().indexOf(this.info.user.toLowerCase()) > -1;
|
|
142
142
|
});
|
|
143
143
|
},
|
|
144
|
-
sortedEditCharacters
|
|
144
|
+
sortedEditCharacters() {
|
|
145
145
|
return this.info.people.sort((a, b) => {
|
|
146
146
|
if (a < b) return -1;
|
|
147
147
|
else if (a > b) return 1;
|
|
@@ -150,12 +150,12 @@ Vue.component('modal-cronologia', {
|
|
|
150
150
|
}
|
|
151
151
|
},
|
|
152
152
|
methods: {
|
|
153
|
-
modalClose
|
|
153
|
+
modalClose() {
|
|
154
154
|
this.$parent.modal.type = 'new';
|
|
155
155
|
this.$parent.modal.status = false;
|
|
156
156
|
this.$parent.setEntry();
|
|
157
157
|
},
|
|
158
|
-
pushElement
|
|
158
|
+
pushElement() {
|
|
159
159
|
if (this.$parent.modal.type === 'edit') {
|
|
160
160
|
this.$parent.content.edit.splice(this.$parent.content.edit.map((item) => {
|
|
161
161
|
return item.position;
|
|
@@ -166,7 +166,7 @@ Vue.component('modal-cronologia', {
|
|
|
166
166
|
|
|
167
167
|
this.modalClose();
|
|
168
168
|
},
|
|
169
|
-
addCharacter
|
|
169
|
+
addCharacter(character) {
|
|
170
170
|
this.info.people.push(character);
|
|
171
171
|
this.info.selector = false;
|
|
172
172
|
this.info.user = '';
|
|
@@ -175,7 +175,7 @@ Vue.component('modal-cronologia', {
|
|
|
175
175
|
this.info.selector = true;
|
|
176
176
|
}, 250);
|
|
177
177
|
},
|
|
178
|
-
deleteCharacter
|
|
178
|
+
deleteCharacter(index) {
|
|
179
179
|
const old = JSON.parse(JSON.stringify(this.content.edit.status));
|
|
180
180
|
|
|
181
181
|
this.info.people.splice(index, 1);
|
|
@@ -198,7 +198,7 @@ Vue.component('modal-cronologia', {
|
|
|
198
198
|
this.info.people = list;
|
|
199
199
|
},
|
|
200
200
|
template: `
|
|
201
|
-
<modal-foro :
|
|
201
|
+
<modal-foro :title="modalTitle" @modal-close="modalClose()">
|
|
202
202
|
<template v-if="page === 0">
|
|
203
203
|
<template slot="content">
|
|
204
204
|
<aviso-foro v-show="oneCheck.length">
|
|
@@ -206,17 +206,17 @@ Vue.component('modal-cronologia', {
|
|
|
206
206
|
</aviso-foro>
|
|
207
207
|
<ul class="forum-fieldlist no-style">
|
|
208
208
|
<li>
|
|
209
|
-
<campo-foro
|
|
209
|
+
<campo-foro name="Título">
|
|
210
210
|
<input type="text" v-model="content.edit.name" placeholder="Escribe el nombre del tema." />
|
|
211
211
|
</campo-foro>
|
|
212
212
|
</li>
|
|
213
213
|
<li>
|
|
214
|
-
<campo-foro
|
|
214
|
+
<campo-foro name="Enlace">
|
|
215
215
|
<input type="text" v-model="content.edit.link" placeholder="Escribe el enlace del tema." />
|
|
216
216
|
</campo-foro>
|
|
217
217
|
</li>
|
|
218
218
|
<li>
|
|
219
|
-
<campo-foro
|
|
219
|
+
<campo-foro name="Fecha">
|
|
220
220
|
<div class="input-date">
|
|
221
221
|
<div class="date-element date-dmy">
|
|
222
222
|
<label>
|
|
@@ -251,7 +251,7 @@ Vue.component('modal-cronologia', {
|
|
|
251
251
|
</template>
|
|
252
252
|
<template slot="controls" v-if="!oneCheck.length">
|
|
253
253
|
<controles-modal>
|
|
254
|
-
<button class="button1 btn-main"
|
|
254
|
+
<button class="button1 btn-main" @click="page = 1" title="Paso siguiente">Siguiente</button>
|
|
255
255
|
</controles-modal>
|
|
256
256
|
</template>
|
|
257
257
|
</template>
|
|
@@ -262,7 +262,7 @@ Vue.component('modal-cronologia', {
|
|
|
262
262
|
</aviso-foro>
|
|
263
263
|
<ul class="forum-fieldlist no-style">
|
|
264
264
|
<li>
|
|
265
|
-
<campo-foro
|
|
265
|
+
<campo-foro name="Estado">
|
|
266
266
|
<div class="select-container">
|
|
267
267
|
<select v-model="content.edit.status">
|
|
268
268
|
<option value="-1" selected="selected" hidden="hidden">Selecciona un estado para el tema</option>
|
|
@@ -274,18 +274,18 @@ Vue.component('modal-cronologia', {
|
|
|
274
274
|
</campo-foro>
|
|
275
275
|
</li>
|
|
276
276
|
<li>
|
|
277
|
-
<campo-foro
|
|
277
|
+
<campo-foro name="Personajes">
|
|
278
278
|
<div class="character-selector">
|
|
279
279
|
<input type="text" v-model="info.user" placeholder="Escribe el nombre de un personaje." />
|
|
280
280
|
<ul class="no-style selector-list" v-if="sortedCharacters.length > 0 && info.selector">
|
|
281
|
-
<li v-for="(character, index) in sortedCharacters"
|
|
281
|
+
<li v-for="(character, index) in sortedCharacters" @click="addCharacter(character)" :title="'Seleccionar «' + character + '»'">{{ character }}<i class="fas fa-plus"></i></li>
|
|
282
282
|
</ul>
|
|
283
|
-
<a class="character-custom"
|
|
283
|
+
<a class="character-custom" @click="addCharacter(info.user)" v-if="info.user.length > 2" :title="'Seleccionar «' + info.user + '»'">
|
|
284
284
|
<i class="fas fa-plus"></i>
|
|
285
285
|
</a>
|
|
286
286
|
</div>
|
|
287
287
|
<ul v-if="info.people.length" class="no-style character-list">
|
|
288
|
-
<li v-for="(character, index) in sortedEditCharacters"
|
|
288
|
+
<li v-for="(character, index) in sortedEditCharacters" @click="deleteCharacter(index)" :title="'Quitar ' + character"><i class="fas fa-times"></i> {{ character }}</li>
|
|
289
289
|
</ul>
|
|
290
290
|
</campo-foro>
|
|
291
291
|
</li>
|
|
@@ -293,8 +293,8 @@ Vue.component('modal-cronologia', {
|
|
|
293
293
|
</template>
|
|
294
294
|
<template slot="controls">
|
|
295
295
|
<controles-modal>
|
|
296
|
-
<button class="button2"
|
|
297
|
-
<button class="button1 btn-main"
|
|
296
|
+
<button class="button2" @click="page = 0" title="Paso anterior">Anterior</button>
|
|
297
|
+
<button class="button1 btn-main" @click="pushElement()" v-if="!secondCheck.length && finalCheck" title="Guardar entrada">Guardar</button>
|
|
298
298
|
</controles-modal>
|
|
299
299
|
</template>
|
|
300
300
|
</template>
|
|
@@ -303,7 +303,7 @@ Vue.component('modal-cronologia', {
|
|
|
303
303
|
});
|
|
304
304
|
|
|
305
305
|
Vue.component('gestor-cronologia', {
|
|
306
|
-
data
|
|
306
|
+
data() {
|
|
307
307
|
return {
|
|
308
308
|
render: 0,
|
|
309
309
|
modal: {
|
|
@@ -323,7 +323,7 @@ Vue.component('gestor-cronologia', {
|
|
|
323
323
|
}
|
|
324
324
|
},
|
|
325
325
|
computed: {
|
|
326
|
-
sortedContent
|
|
326
|
+
sortedContent() {
|
|
327
327
|
return JSON.parse(JSON.stringify(this.content.edit)).sort(({
|
|
328
328
|
date: a,
|
|
329
329
|
name: n1
|
|
@@ -343,7 +343,7 @@ Vue.component('gestor-cronologia', {
|
|
|
343
343
|
return n1 - n2;
|
|
344
344
|
});
|
|
345
345
|
},
|
|
346
|
-
paginationContent
|
|
346
|
+
paginationContent() {
|
|
347
347
|
const limit = forumConfig.skinOptions.paginationDefault;
|
|
348
348
|
const pages = Math.floor((this.sortedContent.length - 1) / limit) + 1;
|
|
349
349
|
|
|
@@ -360,15 +360,15 @@ Vue.component('gestor-cronologia', {
|
|
|
360
360
|
content: this.sortedContent.slice(this.state.pagination * limit, (this.state.pagination + 1) * limit)
|
|
361
361
|
};
|
|
362
362
|
},
|
|
363
|
-
finalCheck
|
|
363
|
+
finalCheck() {
|
|
364
364
|
return JSON.stringify(this.content.current) !== JSON.stringify(this.content.edit);
|
|
365
365
|
}
|
|
366
366
|
},
|
|
367
367
|
methods: {
|
|
368
|
-
forceRerender
|
|
368
|
+
forceRerender() {
|
|
369
369
|
this.render += 1;
|
|
370
370
|
},
|
|
371
|
-
setEntry
|
|
371
|
+
setEntry() {
|
|
372
372
|
this.entry = {
|
|
373
373
|
link: '',
|
|
374
374
|
name: '',
|
|
@@ -386,12 +386,12 @@ Vue.component('gestor-cronologia', {
|
|
|
386
386
|
}
|
|
387
387
|
};
|
|
388
388
|
},
|
|
389
|
-
addEntry
|
|
389
|
+
addEntry(e) {
|
|
390
390
|
e.preventDefault();
|
|
391
391
|
|
|
392
392
|
this.modal.status = true;
|
|
393
393
|
},
|
|
394
|
-
save
|
|
394
|
+
save(e) {
|
|
395
395
|
e.preventDefault();
|
|
396
396
|
|
|
397
397
|
this.state.page = 2;
|
|
@@ -453,71 +453,72 @@ Vue.component('gestor-cronologia', {
|
|
|
453
453
|
<div class="is-content">
|
|
454
454
|
<h2>Cronología</h2>
|
|
455
455
|
<hr />
|
|
456
|
-
<p>En esta página podrás editar la cronología de tu personaje
|
|
456
|
+
<p>En esta página podrás editar la cronología de tu personaje.</p>
|
|
457
|
+
<p>Ante cualquier duda o problema, contacta con la administración.</p>
|
|
457
458
|
</div>
|
|
458
459
|
<separador-foro />
|
|
459
460
|
<template v-if="state.page === 0">
|
|
460
|
-
<cargando-foro
|
|
461
|
+
<cargando-foro text="Cargando utilidad…"></cargando-foro>
|
|
461
462
|
</template>
|
|
462
463
|
<template v-else-if="state.page === 1">
|
|
463
|
-
<modal-cronologia v-if="modal.status" :
|
|
464
|
-
<mando-foro
|
|
464
|
+
<modal-cronologia v-if="modal.status" :type="modal.type" :element="entry"></modal-cronologia>
|
|
465
|
+
<mando-foro id="upper-controls" app="true">
|
|
465
466
|
<template slot="pagination" v-if="paginationContent.pages.length > 1">
|
|
466
|
-
<a class="page-action" title="Ir a la página anterior" v-if="state.pagination > 0"
|
|
467
|
+
<a class="page-action" title="Ir a la página anterior" v-if="state.pagination > 0" @click="state.pagination -= 1">
|
|
467
468
|
<i class="fas fa-chevron-left"></i>
|
|
468
469
|
</a>
|
|
469
470
|
<template v-for="page in paginationContent.pages">
|
|
470
471
|
<strong v-if="page === state.pagination">{{ page + 1 }}</strong>
|
|
471
|
-
<a class="page-link" :title="'Ir a la página «' + (page + 1) + '»'" v-else
|
|
472
|
+
<a class="page-link" :title="'Ir a la página «' + (page + 1) + '»'" v-else @click="state.pagination = page">{{ page + 1 }}</a>
|
|
472
473
|
</template>
|
|
473
|
-
<a class="page-action" title="Ir a la página siguiente" v-if="(state.pagination + 1) < paginationContent.pages.length"
|
|
474
|
+
<a class="page-action" title="Ir a la página siguiente" v-if="(state.pagination + 1) < paginationContent.pages.length" @click="state.pagination += 1">
|
|
474
475
|
<i class="fas fa-chevron-right"></i>
|
|
475
476
|
</a>
|
|
476
477
|
</template>
|
|
477
478
|
<template slot="controls">
|
|
478
|
-
<li
|
|
479
|
-
<boton-foro
|
|
479
|
+
<li @click="addEntry($event)">
|
|
480
|
+
<boton-foro url="#" name="Añadir" icon="fas fa-plus"></boton-foro>
|
|
480
481
|
</li>
|
|
481
|
-
<li v-if="finalCheck"
|
|
482
|
-
<boton-foro
|
|
482
|
+
<li v-if="finalCheck" @click="save($event)">
|
|
483
|
+
<boton-foro url="#" name="Guardar" icon="fas fa-save" type="no-name"></boton-foro>
|
|
483
484
|
</li>
|
|
484
485
|
</template>
|
|
485
486
|
</mando-foro>
|
|
486
|
-
<ul id="forum-rplist" class="no-style" :key="render">
|
|
487
|
+
<ul id="forum-rplist" :class="'no-style' + (!paginationContent.content.length ? ' no-results': '')" :key="render">
|
|
487
488
|
<template v-if="!paginationContent.content.length">
|
|
488
|
-
<li class="is-not-
|
|
489
|
+
<li class="is-not-topic is-not-lastpost">
|
|
489
490
|
<h6>No hay entradas en tu cronología</h6>
|
|
490
491
|
</li>
|
|
491
492
|
</template>
|
|
492
493
|
<template v-else v-for="rp in paginationContent.content">
|
|
493
|
-
<elemento-cronologia :
|
|
494
|
+
<elemento-cronologia :element="rp" type="manager" :id="rp.position" />
|
|
494
495
|
</template>
|
|
495
496
|
</ul>
|
|
496
|
-
<mando-foro
|
|
497
|
+
<mando-foro id="lower-controls" app="true">
|
|
497
498
|
<template slot="pagination" v-if="paginationContent.pages.length > 1">
|
|
498
|
-
<a class="page-action" title="Ir a la página anterior" v-if="state.pagination > 0"
|
|
499
|
+
<a class="page-action" title="Ir a la página anterior" v-if="state.pagination > 0" @click="state.pagination -= 1">
|
|
499
500
|
<i class="fas fa-chevron-left"></i>
|
|
500
501
|
</a>
|
|
501
502
|
<template v-for="page in paginationContent.pages">
|
|
502
503
|
<strong v-if="page === state.pagination">{{ page + 1 }}</strong>
|
|
503
|
-
<a class="page-link" :title="'Ir a la página «' + (page + 1) + '»'" v-else
|
|
504
|
+
<a class="page-link" :title="'Ir a la página «' + (page + 1) + '»'" v-else @click="state.pagination = page">{{ page + 1 }}</a>
|
|
504
505
|
</template>
|
|
505
|
-
<a class="page-action" title="Ir a la página siguiente" v-if="(state.pagination + 1) < paginationContent.pages.length"
|
|
506
|
+
<a class="page-action" title="Ir a la página siguiente" v-if="(state.pagination + 1) < paginationContent.pages.length" @click="state.pagination += 1">
|
|
506
507
|
<i class="fas fa-chevron-right"></i>
|
|
507
508
|
</a>
|
|
508
509
|
</template>
|
|
509
510
|
<template slot="controls">
|
|
510
|
-
<li
|
|
511
|
-
<boton-foro
|
|
511
|
+
<li @click="addEntry($event)">
|
|
512
|
+
<boton-foro url="#" name="Añadir" icon="fas fa-plus"></boton-foro>
|
|
512
513
|
</li>
|
|
513
|
-
<li v-if="finalCheck"
|
|
514
|
-
<boton-foro
|
|
514
|
+
<li v-if="finalCheck" @click="save($event)">
|
|
515
|
+
<boton-foro url="#" name="Guardar" icon="fas fa-save" type="no-name"></boton-foro>
|
|
515
516
|
</li>
|
|
516
517
|
</template>
|
|
517
518
|
</mando-foro>
|
|
518
519
|
</template>
|
|
519
520
|
<template v-else-if="state.page === 2">
|
|
520
|
-
<cargando-foro
|
|
521
|
+
<cargando-foro text="Actualizando información…"></cargando-foro>
|
|
521
522
|
</template>
|
|
522
523
|
</section>
|
|
523
524
|
`
|
|
@@ -525,17 +526,17 @@ Vue.component('gestor-cronologia', {
|
|
|
525
526
|
|
|
526
527
|
|
|
527
528
|
Vue.component('elemento-cronologia', {
|
|
528
|
-
props: ['
|
|
529
|
-
data
|
|
529
|
+
props: ['element', 'type', 'id'],
|
|
530
|
+
data() {
|
|
530
531
|
return {
|
|
531
|
-
content: this.
|
|
532
|
+
content: this.element
|
|
532
533
|
}
|
|
533
534
|
},
|
|
534
535
|
methods: {
|
|
535
|
-
deleteElement
|
|
536
|
+
deleteElement() {
|
|
536
537
|
this.$parent.content.edit.splice(this.$parent.content.edit.map((item) => {
|
|
537
538
|
return item.position;
|
|
538
|
-
}).indexOf(this.
|
|
539
|
+
}).indexOf(this.id), 1);
|
|
539
540
|
|
|
540
541
|
if (this.$parent.paginationContent.content.length === 0 && this.$parent.state.pagination !== 0) {
|
|
541
542
|
this.$parent.state.pagination -= 1;
|
|
@@ -543,7 +544,7 @@ Vue.component('elemento-cronologia', {
|
|
|
543
544
|
|
|
544
545
|
this.$parent.forceRerender();
|
|
545
546
|
},
|
|
546
|
-
editElement
|
|
547
|
+
editElement() {
|
|
547
548
|
this.$parent.modal.type = 'edit';
|
|
548
549
|
this.$parent.entry = this.content;
|
|
549
550
|
this.$parent.modal.status = true;
|
|
@@ -551,7 +552,7 @@ Vue.component('elemento-cronologia', {
|
|
|
551
552
|
},
|
|
552
553
|
template: `
|
|
553
554
|
<li class="rp-list">
|
|
554
|
-
<template v-if="
|
|
555
|
+
<template v-if="type === 'manager'">
|
|
555
556
|
<a class="rp-element rp-manager">
|
|
556
557
|
<div class="rp-icon">
|
|
557
558
|
<template v-if="content.status === 'ropened'">
|
|
@@ -572,12 +573,12 @@ Vue.component('elemento-cronologia', {
|
|
|
572
573
|
</small>
|
|
573
574
|
</div>
|
|
574
575
|
<div class="rp-controls">
|
|
575
|
-
<span
|
|
576
|
+
<span @click="editElement()" title="Editar entrada">Editar</span> / <span @click="deleteElement()" title="Eliminar entrada">Eliminar</span>
|
|
576
577
|
</div>
|
|
577
578
|
</div>
|
|
578
579
|
</a>
|
|
579
580
|
</template>
|
|
580
|
-
<template v-else-if="
|
|
581
|
+
<template v-else-if="type === 'profile'">
|
|
581
582
|
<a class="rp-element" :href="content.link" target="_blank" :title="'Ir al tema «' + content.name + '»'">
|
|
582
583
|
<div class="rp-icon">
|
|
583
584
|
<template v-if="content.status === 'ropened'">
|
package/apps/vueChrono.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
Vue.component("modal-cronologia", { props: ["dataElement", "dataType"], data: function () { return { page: 0, state: { modal: !1 }, info: { user: "", people: [], selector: !0 }, content: { edit: JSON.parse(JSON.stringify(this.dataElement)), current: this.dataElement } } }, computed: { modalTitle: function () { return "new" === this.dataType ? "Nueva entrada" : "edit" === this.dataType ? "Editar entrada" : void 0 }, oneCheck: function () { let t = ""; if (!Object.keys(this.content.edit).length) return t; this.content.edit.name.length < 5 && (t += "<li>Escribe un título lo suficientemente largo.</li>"), -1 === this.content.edit.link.indexOf("/t") && (t += "<li>Escribe un enlace válido.</li>"); let e = []; if ((1 > parseFloat(this.content.edit.date.day) || parseFloat(this.content.edit.date.day) > forumData.date.day || "" === this.content.edit.date.day || Number.isNaN(parseFloat(this.content.edit.date.day))) && e.push("un día correcto (1 al " + forumData.date.day + ")"), (1 > parseFloat(this.content.edit.date.month) || parseFloat(this.content.edit.date.month) > forumData.date.month || "" === this.content.edit.date.month || Number.isNaN(parseFloat(this.content.edit.date.month))) && e.push("un mes correcto (1 al " + forumData.date.month + ")"), ("DFI" === this.content.edit.date.time && parseFloat(this.content.edit.date.year) > forumData.date.year || "DFI" === this.content.edit.date.time && parseFloat(this.content.edit.date.year) < 1 || "" === this.content.edit.date.year || Number.isNaN(parseFloat(this.content.edit.date.year))) && e.push("un año correcto"), -1 === this.content.edit.date.time && e.push("un periodo correcto"), e.length) { let n = ""; n += "<li>Recuerda poner ", [].forEach.call(e, (t, e, a) => { n += t, a.length - 2 === e ? n += " y " : a.length === e + 1 ? n += "." : a.length > e && (n += ", ") }), n += "</li>", t += n } return t }, secondCheck: function () { let t = ""; return Object.keys(this.content.edit).length ? (-1 === this.content.edit.status && (t += "<li>Selecciona un estado para el tema.</li>"), this.info.people.length || (t += "<li>Selecciona al menos un personaje.</li>"), t) : t }, finalCheck: function () { return JSON.stringify(this.content.current) !== JSON.stringify(this.finalData) }, finalData: function () { let t = JSON.parse(JSON.stringify(this.content.edit)); if (!Object.keys(this.content.edit).length) return t; let e = "", n = ""; return [].forEach.call(JSON.parse(JSON.stringify(this.sortedEditCharacters)), (t, a, o) => { e += t, n += Vue.filter("just-name")(t), o.length - 2 === a ? (e += " y ", n += " y ") : o.length === a + 1 ? (e += "", n += "") : o.length > a && (e += ", ", n += ", ") }), t.people.count = this.info.people.length, t.people.list = e, t.people.short = n, "new" === this.$parent.modal.type && (t.position = this.$parent.content.edit.length), t }, sortedCharacters: function () { return Object.keys(this.content.edit).length ? this.$parent.users.map(t => t.user).filter(t => -1 === this.info.people.indexOf(t)).filter(t => t.toLowerCase().indexOf(this.info.user.toLowerCase()) > -1) : this.$parent.users.map(t => t.user) }, sortedEditCharacters: function () { return this.info.people.sort((t, e) => t < e ? -1 : t > e ? 1 : 0) } }, methods: { modalClose: function () { this.$parent.modal.type = "new", this.$parent.modal.status = !1, this.$parent.setEntry() }, pushElement: function () { "edit" === this.$parent.modal.type && this.$parent.content.edit.splice(this.$parent.content.edit.map(t => t.position).indexOf(this.content.current.position), 1), this.$parent.content.edit.push(this.finalData), this.modalClose() }, addCharacter: function (t) { this.info.people.push(t), this.info.selector = !1, this.info.user = "", setTimeout(() => { this.info.selector = !0 }, 250) }, deleteCharacter: function (t) { const e = JSON.parse(JSON.stringify(this.content.edit.status)); this.info.people.splice(t, 1), this.forceRerender(), this.content.edit.status = -1, this.content.edit.status = e } }, created() { let t = []; "" !== this.content.edit.people.list && (t = -1 === this.content.edit.people.list.indexOf(" y ") ? [this.content.edit.people.list] : this.content.edit.people.list.split(" y ")[0].split(", ").concat(this.content.edit.people.list.split(" y ")[1])), this.info.people = t }, template: '\n <modal-foro :data-title="modalTitle" v-on:modal-close="modalClose()">\n <template v-if="page === 0">\n <template slot="content">\n <aviso-foro v-show="oneCheck.length">\n <ul v-html="oneCheck"></ul>\n </aviso-foro>\n <ul class="forum-fieldlist no-style">\n <li>\n <campo-foro data-name="Título">\n <input type="text" v-model="content.edit.name" placeholder="Escribe el nombre del tema." />\n </campo-foro>\n </li>\n <li>\n <campo-foro data-name="Enlace">\n <input type="text" v-model="content.edit.link" placeholder="Escribe el enlace del tema." />\n </campo-foro>\n </li>\n <li>\n <campo-foro data-name="Fecha">\n <div class="input-date">\n <div class="date-element date-dmy">\n <label>\n Día\n <input type="text" v-model="content.edit.date.day" placeholder="0" />\n </label>\n <label>\n Mes\n <input type="text" v-model="content.edit.date.month" placeholder="0" />\n </label>\n <label>\n Año\n <input type="text" v-model="content.edit.date.year" placeholder="0" />\n </label>\n </div>\n <div class="date-element not-show mt-4">\n <label>\n Periodo\n <div class="select-container">\n <select v-model="content.edit.date.time">\n <option value="-1" hidden>-</option>\n <option value="AFI">AFI</option>\n <option value="DFI">DFI</option>\n </select>\n </div>\n </label>\n </div>\n </div>\n </campo-foro>\n </li>\n </ul>\n </template>\n <template slot="controls" v-if="!oneCheck.length">\n <controles-modal>\n <button class="button1 btn-main" v-on:click="page = 1" title="Paso siguiente">Siguiente</button>\n </controles-modal>\n </template>\n </template>\n <template v-else-if="page === 1">\n <template slot="content">\n <aviso-foro v-show="secondCheck.length">\n <ul v-html="secondCheck"></ul>\n </aviso-foro>\n <ul class="forum-fieldlist no-style">\n <li>\n <campo-foro data-name="Estado">\n <div class="select-container">\n <select v-model="content.edit.status">\n <option value="-1" selected="selected" hidden="hidden">Selecciona un estado para el tema</option>\n <option value="ropened">Activo</option>\n <option value="rclosed">Cerrado</option>\n <option value="rabandoned">Abandonado</option>\n </select>\n </div>\n </campo-foro>\n </li>\n <li>\n <campo-foro data-name="Personajes">\n <div class="character-selector">\n <input type="text" v-model="info.user" placeholder="Escribe el nombre de un personaje." />\n <ul class="no-style selector-list" v-if="sortedCharacters.length > 0 && info.selector">\n <li v-for="(character, index) in sortedCharacters" v-on:click="addCharacter(character)" :title="\'Seleccionar «\' + character + \'»\'">{{ character }}<i class="fas fa-plus"></i></li>\n </ul>\n <a class="character-custom" v-on:click="addCharacter(info.user)" v-if="info.user.length > 2" :title="\'Seleccionar «\' + info.user + \'»\'">\n <i class="fas fa-plus"></i>\n </a>\n </div>\n <ul v-if="info.people.length" class="no-style character-list">\n <li v-for="(character, index) in sortedEditCharacters" v-on:click="deleteCharacter(index)" :title="\'Quitar \' + character"><i class="fas fa-times"></i> {{ character }}</li>\n </ul>\n </campo-foro>\n </li>\n </ul>\n </template>\n <template slot="controls">\n <controles-modal>\n <button class="button2" v-on:click="page = 0" title="Paso anterior">Anterior</button>\n <button class="button1 btn-main" v-on:click="pushElement()" v-if="!secondCheck.length && finalCheck" title="Guardar entrada">Guardar</button>\n </controles-modal>\n </template>\n </template>\n </modal-foro>\n ' }), Vue.component("gestor-cronologia", { data: function () { return { render: 0, modal: { type: "new", status: !1 }, users: [], state: { page: 0, pagination: 0 }, entry: {}, content: { edit: [], current: [] } } }, computed: { sortedContent: function () { return JSON.parse(JSON.stringify(this.content.edit)).sort(({ date: t, name: e }, { date: n, name: a }) => { if (t.time !== n.time) return "AFI" === t.time ? -1 : 1; const o = "AFI" === t.time ? n : t, i = "AFI" === t.time ? t : n; return parseFloat(t.year) !== parseFloat(n.year) ? parseFloat(o.year) - parseFloat(i.year) : parseFloat(t.month) !== parseFloat(n.month) ? parseFloat(o.month) - parseFloat(i.month) : parseFloat(t.day) !== parseFloat(n.day) ? parseFloat(o.day) - parseFloat(i.day) : e - a }) }, paginationContent: function () { const t = forumConfig.skinOptions.paginationDefault, e = Math.floor((this.sortedContent.length - 1) / t) + 1; let n = []; for (let t = 0; t < e; t++)n.push(t); return this.forceRerender(), { pages: n, content: this.sortedContent.slice(this.state.pagination * t, (this.state.pagination + 1) * t) } }, finalCheck: function () { return JSON.stringify(this.content.current) !== JSON.stringify(this.content.edit) } }, methods: { forceRerender: function () { this.render += 1 }, setEntry: function () { this.entry = { link: "", name: "", status: -1, people: { list: "", short: "", count: 0 }, date: { time: "DFI", day: "", month: "", year: "" } } }, addEntry: function (t) { t.preventDefault(), this.modal.status = !0 }, save: function (t) { t.preventDefault(), this.state.page = 2; const e = this.sortedContent.map(t => (void 0 !== t.desc && delete t.desc, void 0 !== t.position && delete t.position, t)); FNR.user.profile.setData([{ name: forumConfig.profileUser.cronoField, type: "textarea", value: JSON.stringify(e).replace(/"/g, "`") }]).then(t => { t ? (FNR.html.genNotification("Atención", "Información actualizada sin inconvenientes.", "fas fa-check"), setTimeout(() => { window.location.reload() }, 2e3)) : FNR.html.genNotification("Atención", "Hubo un problema al actualizar. Dale otro intento.", "fas fa-exclamation") }) } }, created() { FNR.user.profile.getData([{ name: forumConfig.profileUser.cronoField, type: "textarea" }]).then(t => { const e = FNR.utility.genArray(t[0].value).map((t, e) => { let n = t; return n.position = e, n }); this.content.edit = e, this.content.current = JSON.parse(JSON.stringify(e)), FNR.forum.getMembers().then(t => { this.setEntry(), this.users = t, this.state.page = 1 }) }) }, template: '\n <section id="forum-chronology" class="wiki-content is-dramatic">\n <div class="is-content">\n <h2>Cronología</h2>\n <hr />\n <p>En esta página podrás editar la cronología de tu personaje. Experimenta con su funcionamiento, es bastante intuitivo.</p>\n </div>\n <separador-foro />\n <template v-if="state.page === 0">\n <cargando-foro data-text="Cargando utilidad…"></cargando-foro>\n </template>\n <template v-else-if="state.page === 1">\n <modal-cronologia v-if="modal.status" :data-type="modal.type" :data-element="entry"></modal-cronologia>\n <mando-foro data-id="upper-controls" data-app="true">\n <template slot="pagination" v-if="paginationContent.pages.length > 1">\n <a class="page-action" title="Ir a la página anterior" v-if="state.pagination > 0" v-on:click="state.pagination -= 1">\n <i class="fas fa-chevron-left"></i>\n </a>\n <template v-for="page in paginationContent.pages">\n <strong v-if="page === state.pagination">{{ page + 1 }}</strong>\n <a class="page-link" :title="\'Ir a la página «\' + (page + 1) + \'»\'" v-else v-on:click="state.pagination = page">{{ page + 1 }}</a>\n </template>\n <a class="page-action" title="Ir a la página siguiente" v-if="(state.pagination + 1) < paginationContent.pages.length" v-on:click="state.pagination += 1">\n <i class="fas fa-chevron-right"></i>\n </a>\n </template>\n <template slot="controls">\n <li v-on:click="addEntry($event)">\n <boton-foro data-url="#" data-name="Añadir" data-icon="fas fa-plus"></boton-foro>\n </li>\n <li v-if="finalCheck" v-on:click="save($event)">\n <boton-foro data-url="#" data-name="Guardar" data-icon="fas fa-save" data-type="no-name"></boton-foro>\n </li>\n </template>\n </mando-foro>\n <ul id="forum-rplist" class="no-style" :key="render">\n <template v-if="!paginationContent.content.length">\n <li class="is-not-lastpost not-status">\n <h6>No hay entradas en tu cronología</h6>\n </li>\n </template>\n <template v-else v-for="rp in paginationContent.content">\n <elemento-cronologia :data-element="rp" data-type="manager" :data-id="rp.position" />\n </template>\n </ul>\n <mando-foro data-id="lower-controls" data-app="true">\n <template slot="pagination" v-if="paginationContent.pages.length > 1">\n <a class="page-action" title="Ir a la página anterior" v-if="state.pagination > 0" v-on:click="state.pagination -= 1">\n <i class="fas fa-chevron-left"></i>\n </a>\n <template v-for="page in paginationContent.pages">\n <strong v-if="page === state.pagination">{{ page + 1 }}</strong>\n <a class="page-link" :title="\'Ir a la página «\' + (page + 1) + \'»\'" v-else v-on:click="state.pagination = page">{{ page + 1 }}</a>\n </template>\n <a class="page-action" title="Ir a la página siguiente" v-if="(state.pagination + 1) < paginationContent.pages.length" v-on:click="state.pagination += 1">\n <i class="fas fa-chevron-right"></i>\n </a>\n </template>\n <template slot="controls">\n <li v-on:click="addEntry($event)">\n <boton-foro data-url="#" data-name="Añadir" data-icon="fas fa-plus"></boton-foro>\n </li>\n <li v-if="finalCheck" v-on:click="save($event)">\n <boton-foro data-url="#" data-name="Guardar" data-icon="fas fa-save" data-type="no-name"></boton-foro>\n </li>\n </template>\n </mando-foro>\n </template>\n <template v-else-if="state.page === 2">\n <cargando-foro data-text="Actualizando información…"></cargando-foro>\n </template>\n </section>\n ' }), Vue.component("elemento-cronologia", { props: ["dataElement", "dataType", "dataId"], data: function () { return { content: this.dataElement } }, methods: { deleteElement: function () { this.$parent.content.edit.splice(this.$parent.content.edit.map(t => t.position).indexOf(this.dataId), 1), 0 === this.$parent.paginationContent.content.length && 0 !== this.$parent.state.pagination && (this.$parent.state.pagination -= 1), this.$parent.forceRerender() }, editElement: function () { this.$parent.modal.type = "edit", this.$parent.entry = this.content, this.$parent.modal.status = !0 } }, template: '\n <li class="rp-list">\n <template v-if="dataType === \'manager\'">\n <a class="rp-element rp-manager">\n <div class="rp-icon">\n <template v-if="content.status === \'ropened\'">\n <i class="fas fa-lock-open"></i>\n </template>\n <template v-else-if="content.status === \'rclosed\'">\n <i class="fas fa-lock"></i>\n </template>\n <template v-else-if="content.status === \'rabandoned\'">\n <i class="fas fa-times"></i>\n </template>\n </div>\n <div class="rp-content">\n <div class="rp-name">\n <span>{{ content.name }}</span>\n <small>\n {{ content.date.day | to-number | in-two-digits }}/{{ content.date.month | to-number | in-two-digits }}/{{ content.date.year | to-number | in-two-digits }} - <template v-if="content.people.count < 4">{{ content.people.short }}</template><template v-else>Invitados</template>\n </small>\n </div>\n <div class="rp-controls">\n <span v-on:click="editElement()" title="Editar entrada">Editar</span> / <span v-on:click="deleteElement()" title="Eliminar entrada">Eliminar</span>\n </div>\n </div>\n </a>\n </template>\n <template v-else-if="dataType === \'profile\'">\n <a class="rp-element" :href="content.link" target="_blank" :title="\'Ir al tema «\' + content.name + \'»\'">\n <div class="rp-icon">\n <template v-if="content.status === \'ropened\'">\n <i class="fas fa-lock-open"></i>\n </template>\n <template v-else-if="content.status === \'rclosed\'">\n <i class="fas fa-lock"></i>\n </template>\n <template v-else-if="content.status === \'rabandoned\'">\n <i class="fas fa-times"></i>\n </template>\n </div>\n <div class="rp-content">\n <div class="rp-name">\n <span>{{ content.name }}</span>\n <small>\n {{ content.date.day | to-number | in-two-digits }}/{{ content.date.month | to-number | in-two-digits }}/{{ content.date.year | to-number | in-two-digits }} - <template v-if="content.people.count < 4">{{ content.people.short }}</template><template v-else>Invitados</template>\n </small>\n </div>\n </div>\n </a>\n </template>\n </li>\n ' });
|
|
1
|
+
Vue.component("modal-cronologia",{props:["element","type"],data(){return{page:0,state:{modal:!1},info:{user:"",people:[],selector:!0},content:{edit:JSON.parse(JSON.stringify(this.element)),current:this.element}}},computed:{modalTitle(){return"new"===this.type?"Nueva entrada":"edit"===this.type?"Editar entrada":void 0},oneCheck(){let t="";if(!Object.keys(this.content.edit).length)return t;this.content.edit.name.length<5&&(t+="<li>Escribe un título lo suficientemente largo.</li>"),-1===this.content.edit.link.indexOf("/t")&&(t+="<li>Escribe un enlace válido.</li>");let e=[];if((1>parseFloat(this.content.edit.date.day)||parseFloat(this.content.edit.date.day)>forumData.date.day||""===this.content.edit.date.day||Number.isNaN(parseFloat(this.content.edit.date.day)))&&e.push("un día correcto (1 al "+forumData.date.day+")"),(1>parseFloat(this.content.edit.date.month)||parseFloat(this.content.edit.date.month)>forumData.date.month||""===this.content.edit.date.month||Number.isNaN(parseFloat(this.content.edit.date.month)))&&e.push("un mes correcto (1 al "+forumData.date.month+")"),("DFI"===this.content.edit.date.time&&parseFloat(this.content.edit.date.year)>forumData.date.year||"DFI"===this.content.edit.date.time&&parseFloat(this.content.edit.date.year)<1||""===this.content.edit.date.year||Number.isNaN(parseFloat(this.content.edit.date.year)))&&e.push("un año correcto"),-1===this.content.edit.date.time&&e.push("un periodo correcto"),e.length){let n="";n+="<li>Recuerda poner ",[].forEach.call(e,(t,e,a)=>{n+=t,a.length-2===e?n+=" y ":a.length===e+1?n+=".":a.length>e&&(n+=", ")}),n+="</li>",t+=n}return t},secondCheck(){let t="";return Object.keys(this.content.edit).length?(-1===this.content.edit.status&&(t+="<li>Selecciona un estado para el tema.</li>"),this.info.people.length||(t+="<li>Selecciona al menos un personaje.</li>"),t):t},finalCheck(){return JSON.stringify(this.content.current)!==JSON.stringify(this.finalData)},finalData(){let t=JSON.parse(JSON.stringify(this.content.edit));if(!Object.keys(this.content.edit).length)return t;let e="",n="";return[].forEach.call(JSON.parse(JSON.stringify(this.sortedEditCharacters)),(t,a,o)=>{e+=t,n+=Vue.filter("just-name")(t),o.length-2===a?(e+=" y ",n+=" y "):o.length===a+1?(e+="",n+=""):o.length>a&&(e+=", ",n+=", ")}),t.people.count=this.info.people.length,t.people.list=e,t.people.short=n,"new"===this.$parent.modal.type&&(t.position=this.$parent.content.edit.length),t},sortedCharacters(){return Object.keys(this.content.edit).length?this.$parent.users.map(t=>t.user).filter(t=>-1===this.info.people.indexOf(t)).filter(t=>t.toLowerCase().indexOf(this.info.user.toLowerCase())>-1):this.$parent.users.map(t=>t.user)},sortedEditCharacters(){return this.info.people.sort((t,e)=>t<e?-1:t>e?1:0)}},methods:{modalClose(){this.$parent.modal.type="new",this.$parent.modal.status=!1,this.$parent.setEntry()},pushElement(){"edit"===this.$parent.modal.type&&this.$parent.content.edit.splice(this.$parent.content.edit.map(t=>t.position).indexOf(this.content.current.position),1),this.$parent.content.edit.push(this.finalData),this.modalClose()},addCharacter(t){this.info.people.push(t),this.info.selector=!1,this.info.user="",setTimeout(()=>{this.info.selector=!0},250)},deleteCharacter(t){const e=JSON.parse(JSON.stringify(this.content.edit.status));this.info.people.splice(t,1),this.forceRerender(),this.content.edit.status=-1,this.content.edit.status=e}},created(){let t=[];""!==this.content.edit.people.list&&(t=-1===this.content.edit.people.list.indexOf(" y ")?[this.content.edit.people.list]:this.content.edit.people.list.split(" y ")[0].split(", ").concat(this.content.edit.people.list.split(" y ")[1])),this.info.people=t},template:'\n <modal-foro :title="modalTitle" @modal-close="modalClose()">\n <template v-if="page === 0">\n <template slot="content">\n <aviso-foro v-show="oneCheck.length">\n <ul v-html="oneCheck"></ul>\n </aviso-foro>\n <ul class="forum-fieldlist no-style">\n <li>\n <campo-foro name="Título">\n <input type="text" v-model="content.edit.name" placeholder="Escribe el nombre del tema." />\n </campo-foro>\n </li>\n <li>\n <campo-foro name="Enlace">\n <input type="text" v-model="content.edit.link" placeholder="Escribe el enlace del tema." />\n </campo-foro>\n </li>\n <li>\n <campo-foro name="Fecha">\n <div class="input-date">\n <div class="date-element date-dmy">\n <label>\n Día\n <input type="text" v-model="content.edit.date.day" placeholder="0" />\n </label>\n <label>\n Mes\n <input type="text" v-model="content.edit.date.month" placeholder="0" />\n </label>\n <label>\n Año\n <input type="text" v-model="content.edit.date.year" placeholder="0" />\n </label>\n </div>\n <div class="date-element not-show mt-4">\n <label>\n Periodo\n <div class="select-container">\n <select v-model="content.edit.date.time">\n <option value="-1" hidden>-</option>\n <option value="AFI">AFI</option>\n <option value="DFI">DFI</option>\n </select>\n </div>\n </label>\n </div>\n </div>\n </campo-foro>\n </li>\n </ul>\n </template>\n <template slot="controls" v-if="!oneCheck.length">\n <controles-modal>\n <button class="button1 btn-main" @click="page = 1" title="Paso siguiente">Siguiente</button>\n </controles-modal>\n </template>\n </template>\n <template v-else-if="page === 1">\n <template slot="content">\n <aviso-foro v-show="secondCheck.length">\n <ul v-html="secondCheck"></ul>\n </aviso-foro>\n <ul class="forum-fieldlist no-style">\n <li>\n <campo-foro name="Estado">\n <div class="select-container">\n <select v-model="content.edit.status">\n <option value="-1" selected="selected" hidden="hidden">Selecciona un estado para el tema</option>\n <option value="ropened">Activo</option>\n <option value="rclosed">Cerrado</option>\n <option value="rabandoned">Abandonado</option>\n </select>\n </div>\n </campo-foro>\n </li>\n <li>\n <campo-foro name="Personajes">\n <div class="character-selector">\n <input type="text" v-model="info.user" placeholder="Escribe el nombre de un personaje." />\n <ul class="no-style selector-list" v-if="sortedCharacters.length > 0 && info.selector">\n <li v-for="(character, index) in sortedCharacters" @click="addCharacter(character)" :title="\'Seleccionar «\' + character + \'»\'">{{ character }}<i class="fas fa-plus"></i></li>\n </ul>\n <a class="character-custom" @click="addCharacter(info.user)" v-if="info.user.length > 2" :title="\'Seleccionar «\' + info.user + \'»\'">\n <i class="fas fa-plus"></i>\n </a>\n </div>\n <ul v-if="info.people.length" class="no-style character-list">\n <li v-for="(character, index) in sortedEditCharacters" @click="deleteCharacter(index)" :title="\'Quitar \' + character"><i class="fas fa-times"></i> {{ character }}</li>\n </ul>\n </campo-foro>\n </li>\n </ul>\n </template>\n <template slot="controls">\n <controles-modal>\n <button class="button2" @click="page = 0" title="Paso anterior">Anterior</button>\n <button class="button1 btn-main" @click="pushElement()" v-if="!secondCheck.length && finalCheck" title="Guardar entrada">Guardar</button>\n </controles-modal>\n </template>\n </template>\n </modal-foro>\n '}),Vue.component("gestor-cronologia",{data:()=>({render:0,modal:{type:"new",status:!1},users:[],state:{page:0,pagination:0},entry:{},content:{edit:[],current:[]}}),computed:{sortedContent(){return JSON.parse(JSON.stringify(this.content.edit)).sort(({date:t,name:e},{date:n,name:a})=>{if(t.time!==n.time)return"AFI"===t.time?-1:1;const o="AFI"===t.time?n:t,i="AFI"===t.time?t:n;return parseFloat(t.year)!==parseFloat(n.year)?parseFloat(o.year)-parseFloat(i.year):parseFloat(t.month)!==parseFloat(n.month)?parseFloat(o.month)-parseFloat(i.month):parseFloat(t.day)!==parseFloat(n.day)?parseFloat(o.day)-parseFloat(i.day):e-a})},paginationContent(){const t=forumConfig.skinOptions.paginationDefault,e=Math.floor((this.sortedContent.length-1)/t)+1;let n=[];for(let t=0;t<e;t++)n.push(t);return this.forceRerender(),{pages:n,content:this.sortedContent.slice(this.state.pagination*t,(this.state.pagination+1)*t)}},finalCheck(){return JSON.stringify(this.content.current)!==JSON.stringify(this.content.edit)}},methods:{forceRerender(){this.render+=1},setEntry(){this.entry={link:"",name:"",status:-1,people:{list:"",short:"",count:0},date:{time:"DFI",day:"",month:"",year:""}}},addEntry(t){t.preventDefault(),this.modal.status=!0},save(t){t.preventDefault(),this.state.page=2;const e=this.sortedContent.map(t=>(void 0!==t.desc&&delete t.desc,void 0!==t.position&&delete t.position,t));FNR.user.profile.setData([{name:forumConfig.profileUser.cronoField,type:"textarea",value:JSON.stringify(e).replace(/"/g,"`")}]).then(t=>{t?(FNR.html.genNotification("Atención","Información actualizada sin inconvenientes.","fas fa-check"),setTimeout(()=>{window.location.reload()},2e3)):FNR.html.genNotification("Atención","Hubo un problema al actualizar. Dale otro intento.","fas fa-exclamation")})}},created(){FNR.user.profile.getData([{name:forumConfig.profileUser.cronoField,type:"textarea"}]).then(t=>{const e=FNR.utility.genArray(t[0].value).map((t,e)=>{let n=t;return n.position=e,n});this.content.edit=e,this.content.current=JSON.parse(JSON.stringify(e)),FNR.forum.getMembers().then(t=>{this.setEntry(),this.users=t,this.state.page=1})})},template:'\n <section id="forum-chronology" class="wiki-content is-dramatic">\n <div class="is-content">\n <h2>Cronología</h2>\n <hr />\n <p>En esta página podrás editar la cronología de tu personaje.</p>\n <p>Ante cualquier duda o problema, contacta con la administración.</p>\n </div>\n <separador-foro />\n <template v-if="state.page === 0">\n <cargando-foro text="Cargando utilidad…"></cargando-foro>\n </template>\n <template v-else-if="state.page === 1">\n <modal-cronologia v-if="modal.status" :type="modal.type" :element="entry"></modal-cronologia>\n <mando-foro id="upper-controls" app="true">\n <template slot="pagination" v-if="paginationContent.pages.length > 1">\n <a class="page-action" title="Ir a la página anterior" v-if="state.pagination > 0" @click="state.pagination -= 1">\n <i class="fas fa-chevron-left"></i>\n </a>\n <template v-for="page in paginationContent.pages">\n <strong v-if="page === state.pagination">{{ page + 1 }}</strong>\n <a class="page-link" :title="\'Ir a la página «\' + (page + 1) + \'»\'" v-else @click="state.pagination = page">{{ page + 1 }}</a>\n </template>\n <a class="page-action" title="Ir a la página siguiente" v-if="(state.pagination + 1) < paginationContent.pages.length" @click="state.pagination += 1">\n <i class="fas fa-chevron-right"></i>\n </a>\n </template>\n <template slot="controls">\n <li @click="addEntry($event)">\n <boton-foro url="#" name="Añadir" icon="fas fa-plus"></boton-foro>\n </li>\n <li v-if="finalCheck" @click="save($event)">\n <boton-foro url="#" name="Guardar" icon="fas fa-save" type="no-name"></boton-foro>\n </li>\n </template>\n </mando-foro>\n <ul id="forum-rplist" :class="\'no-style\' + (!paginationContent.content.length ? \' no-results\': \'\')" :key="render">\n <template v-if="!paginationContent.content.length">\n <li class="is-not-topic is-not-lastpost">\n <h6>No hay entradas en tu cronología</h6>\n </li>\n </template>\n <template v-else v-for="rp in paginationContent.content">\n <elemento-cronologia :element="rp" type="manager" :id="rp.position" />\n </template>\n </ul>\n <mando-foro id="lower-controls" app="true">\n <template slot="pagination" v-if="paginationContent.pages.length > 1">\n <a class="page-action" title="Ir a la página anterior" v-if="state.pagination > 0" @click="state.pagination -= 1">\n <i class="fas fa-chevron-left"></i>\n </a>\n <template v-for="page in paginationContent.pages">\n <strong v-if="page === state.pagination">{{ page + 1 }}</strong>\n <a class="page-link" :title="\'Ir a la página «\' + (page + 1) + \'»\'" v-else @click="state.pagination = page">{{ page + 1 }}</a>\n </template>\n <a class="page-action" title="Ir a la página siguiente" v-if="(state.pagination + 1) < paginationContent.pages.length" @click="state.pagination += 1">\n <i class="fas fa-chevron-right"></i>\n </a>\n </template>\n <template slot="controls">\n <li @click="addEntry($event)">\n <boton-foro url="#" name="Añadir" icon="fas fa-plus"></boton-foro>\n </li>\n <li v-if="finalCheck" @click="save($event)">\n <boton-foro url="#" name="Guardar" icon="fas fa-save" type="no-name"></boton-foro>\n </li>\n </template>\n </mando-foro>\n </template>\n <template v-else-if="state.page === 2">\n <cargando-foro text="Actualizando información…"></cargando-foro>\n </template>\n </section>\n '}),Vue.component("elemento-cronologia",{props:["element","type","id"],data(){return{content:this.element}},methods:{deleteElement(){this.$parent.content.edit.splice(this.$parent.content.edit.map(t=>t.position).indexOf(this.id),1),0===this.$parent.paginationContent.content.length&&0!==this.$parent.state.pagination&&(this.$parent.state.pagination-=1),this.$parent.forceRerender()},editElement(){this.$parent.modal.type="edit",this.$parent.entry=this.content,this.$parent.modal.status=!0}},template:'\n <li class="rp-list">\n <template v-if="type === \'manager\'">\n <a class="rp-element rp-manager">\n <div class="rp-icon">\n <template v-if="content.status === \'ropened\'">\n <i class="fas fa-lock-open"></i>\n </template>\n <template v-else-if="content.status === \'rclosed\'">\n <i class="fas fa-lock"></i>\n </template>\n <template v-else-if="content.status === \'rabandoned\'">\n <i class="fas fa-times"></i>\n </template>\n </div>\n <div class="rp-content">\n <div class="rp-name">\n <span>{{ content.name }}</span>\n <small>\n {{ content.date.day | to-number | in-two-digits }}/{{ content.date.month | to-number | in-two-digits }}/{{ content.date.year | to-number | in-two-digits }} - <template v-if="content.people.count < 4">{{ content.people.short }}</template><template v-else>Invitados</template>\n </small>\n </div>\n <div class="rp-controls">\n <span @click="editElement()" title="Editar entrada">Editar</span> / <span @click="deleteElement()" title="Eliminar entrada">Eliminar</span>\n </div>\n </div>\n </a>\n </template>\n <template v-else-if="type === \'profile\'">\n <a class="rp-element" :href="content.link" target="_blank" :title="\'Ir al tema «\' + content.name + \'»\'">\n <div class="rp-icon">\n <template v-if="content.status === \'ropened\'">\n <i class="fas fa-lock-open"></i>\n </template>\n <template v-else-if="content.status === \'rclosed\'">\n <i class="fas fa-lock"></i>\n </template>\n <template v-else-if="content.status === \'rabandoned\'">\n <i class="fas fa-times"></i>\n </template>\n </div>\n <div class="rp-content">\n <div class="rp-name">\n <span>{{ content.name }}</span>\n <small>\n {{ content.date.day | to-number | in-two-digits }}/{{ content.date.month | to-number | in-two-digits }}/{{ content.date.year | to-number | in-two-digits }} - <template v-if="content.people.count < 4">{{ content.people.short }}</template><template v-else>Invitados</template>\n </small>\n </div>\n </div>\n </a>\n </template>\n </li>\n '});
|