lavkach3

1
async function choiceOneUUID(element, method) {
2
    var display_title = element.getAttribute('display-title')
3
    var filter = element.getAttribute('filter')
4
    var is_filter = element.getAttribute('is-filter')
5
    var model_name = element.getAttribute('model-name')
6
    var attrs = {
7
        placeholder: true,
8
        searchPlaceholderValue: 'Start typing to search',
9
        placeholderValue: "Enter " + display_title
10
    }
11
    if (method === 'get' || element.getAttribute('readonly')) {
12
        attrs.removeItemButton = false
13
    } else {
14
        attrs.removeItemButton = true
15
    }
16
    let choices = new Choices(element, attrs);
17
    if (method === 'get' || element.getAttribute('readonly')) {
18
        choices.disable()
19
    } else if (method === 'update' && element.getAttribute('readonly')) {
20
        choices.containerInner.element.classList.add('disabled');
21
        choices.disable()
22
    }
23

24
    function check_valid(event) {
25
        if (method === 'get' || element.getAttribute('readonly')) { // Если метод get или reanonly, то нет смысла от валидования
26
            // Если метод get или reanonly, то нет смысла от валидования
27
            return
28
        }
29
        if (element.required) {
30
            if (event) {
31
                if (event.type === 'choice') {
32
                    if (event.detail.choice.value) {
33
                        choices.containerInner.element.classList.remove('is-invalid');
34
                        choices.containerInner.element.classList.add('is-valid');
35
                    }
36
                } else if (event.type === 'removeItem') {
37
                    if (event.detail.value) {
38
                        if (!choices.containerInner.element.innerText) {
39
                            choices.containerInner.element.classList.add('is-invalid');
40
                            choices.containerInner.element.classList.remove('is-valid');
41
                        } else {
42
                            choices.containerInner.element.classList.add('is-valid');
43
                            choices.containerInner.element.classList.remove('is-invalid');
44
                        }
45

46
                    }
47
                }
48

49
            } else {
50
                if (!choices.containerInner.element.innerText) {
51
                    choices.containerInner.element.classList.add('is-invalid');
52
                    choices.containerInner.element.classList.remove('is-valid');
53
                } else {
54
                    choices.containerInner.element.classList.add('is-valid');
55
                    choices.containerInner.element.classList.remove('is-invalid');
56
                }
57
            }
58
        } else if (element.id.includes('__in')) {
59
            choices.containerInner.element.classList.remove('is-invalid');
60
            choices.containerInner.element.classList.remove('is-invalid');
61
        } else {
62
            try {
63
                choices.containerInner.element.classList.remove('is-invalid');
64
            } catch (err) {
65

66
            }
67
            choices.containerInner.element.classList.add('is-valid');
68
        }
69
    }
70

71
    choices.containerInner.element.classList.add('form-control');
72

73
    async function searchChoices(value) {
74
        try {
75
            const items = await fetch('/base/search?model=' + model_name + '&filter=' + filter + '&search=' + encodeURIComponent(value));
76
            const results = await items.json();
77
            if (0 === results.length) { // Handle error from result, for example.
78
                throw 'Empty!';
79
            }
80
            return results;
81
        } catch (err) {
82
            console.error(err);
83
        }
84
    }
85

86
    async function getValues() {
87

88
        var id__in = ''
89
        let value = await choices.getValue();
90
        if (value) {
91
            value.label = 'Loading....'
92
        } else {
93
            return []
94
        }
95
        choices.setValue([value])
96
        try {
97
            if (!value) {
98
                return []
99
            } else {
100
                id__in = value.value
101
            }
102
            var maybe_cache = Singleton.results[id__in] // вдруг есть в кеше
103
            if (maybe_cache) {
104
                return [{value: id__in, label: maybe_cache}]
105
            }
106
            Singleton.pushUUID(model_name, id__in)
107
            while (true) {
108
                if (Singleton.results[id__in]) {
109
                    return [{value: id__in, label: Singleton.results[id__in]}]
110
                }
111
                await new Promise(r => setTimeout(r, 50));
112
            }
113
        } catch (err) {
114
            console.error(err);
115
            return []
116
        }
117
    }
118

119
    let init_values = await getValues()
120
    choices.removeActiveItems()
121
    choices.clearChoices()
122
    choices.setValue(init_values)
123
    element.addEventListener('search', async e => {
124
        element.focus()
125
        let value = e.detail.value;
126
        choices.clearChoices()// Test!
127
        choices.setChoices(
128
            await searchChoices(value)
129
        )
130
    });
131

132
    check_valid()
133
    element.addEventListener('choice', function (event) {
134
        check_valid(event)
135
    });
136
    element.addEventListener('showDropdown', async e => {
137
        choices.clearChoices()// Test!
138
        choices.setChoices(
139
            await searchChoices('')
140
        )
141
    });
142
    element.addEventListener('removeItem', function (event) {
143
        check_valid(event)
144
    });
145
}
146

147

148
async function choiceMultiUUID(element, method) {
149
    var display_title = element.getAttribute('display-title')
150
    var filter = element.getAttribute('filter')
151
    var is_filter = element.getAttribute('is-filter')
152
    var model_name = element.getAttribute('model-name')
153
    var attrs = {
154
        placeholderValue: "Enter " + display_title
155
    }
156
    if (method === 'get' || element.getAttribute('readonly')) {
157
        attrs.removeItemButton = false
158
        attrs.placeholderValue = ''
159
    } else {
160
        attrs.removeItemButton = true
161
    }
162
    let choices = new Choices(element, attrs);
163
    if (method === 'get' || element.getAttribute('readonly')) {
164
        choices.disable()
165
    } else if (method === 'update' && element.getAttribute('readonly')) {
166
        choices.containerInner.element.classList.add('disabled');
167
        choices.disable()
168
    }
169

170
    function check_valid(event) {
171
        if (method === 'get' || element.getAttribute('readonly')) { // Если метод get или reanonly, то нет смысла от валидования
172
            // Если метод get или reanonly, то нет смысла от валидования
173
            return
174
        }
175
        if (element.required) {
176
            if (event) {
177
                if (event.type === 'choice') {
178
                    if (event.detail.choice.value) {
179
                        choices.containerInner.element.classList.remove('is-invalid');
180
                        choices.containerInner.element.classList.add('is-valid');
181
                    }
182
                } else if (event.type === 'removeItem') {
183
                    if (event.detail.value) {
184
                        if (!choices.containerInner.element.innerText) {
185
                            choices.containerInner.element.classList.add('is-invalid');
186
                            choices.containerInner.element.classList.remove('is-valid');
187
                        } else {
188
                            choices.containerInner.element.classList.add('is-valid');
189
                            choices.containerInner.element.classList.remove('is-invalid');
190
                        }
191

192
                    }
193
                }
194

195
            } else {
196
                if (!choices.containerInner.element.innerText) {
197
                    choices.containerInner.element.classList.add('is-invalid');
198
                    choices.containerInner.element.classList.remove('is-valid');
199
                } else {
200
                    choices.containerInner.element.classList.add('is-valid');
201
                    choices.containerInner.element.classList.remove('is-invalid');
202
                }
203
            }
204
        } else if (element.id.includes('__in')) {
205
            choices.containerInner.element.classList.remove('is-invalid');
206
            choices.containerInner.element.classList.remove('is-invalid');
207
        } else {
208
            try {
209
                choices.containerInner.element.classList.remove('is-invalid');
210
            } catch (err) {
211

212
            }
213
            choices.containerInner.element.classList.add('is-valid');
214
        }
215
    }
216

217
    choices.containerInner.element.classList.add('form-control');
218

219
    async function getValues() {
220
        var id__in = ''
221
        let values = await choices.getValue();
222
        choices.setValue([])
223

224
        for (let v in values) {
225
            var maybe_cache = Singleton.results[v]
226
            if (!maybe_cache) {
227
                Singleton.pushUUID(model_name, values[v].value)
228
            }
229
        }
230
        var result = []
231
        while (true) {
232
            for (let v in values) {
233
                id__in = values[v].value
234
                if (Singleton.results[id__in]) {
235
                    result.push({
236
                        value: values[v].label,
237
                        label: Singleton.results[id__in]
238
                    })
239
                    values.splice(v, 1)
240
                }
241
            }
242
            if (values.length === 0) {
243
                return result
244
            }
245
            await new Promise(r => setTimeout(r, 50));
246
        }
247
    }
248

249
    let init_values = await getValues()
250
    choices.removeActiveItems()
251
    choices.clearChoices()
252
    choices.setValue(init_values)
253
    element.addEventListener('search', async e => {
254
        element.focus()
255
        let value = e.detail.value;
256
        choices.clearChoices()// Test!
257
        choices.setChoices(async () => {
258
            try {
259
                const items = await fetch('/base/search?model=' + model_name + '&filter=' + filter + '&search=' + encodeURIComponent(value));
260
                const results = await items.json();
261
                if (0 === results.length) { // Handle error from result, for example.
262
                    throw 'Empty!';
263
                }
264
                return results;
265
            } catch (err) {
266
                console.error(err);
267
                choices.input.element.style = ""
268
            }
269
        }).then(() => {
270
            e.target.parentNode.querySelector('input').focus();
271
        });
272
        choices.input.element.style = ""
273
    });
274
    check_valid()
275
}
276

277
async function choicesMultiBadges(element, method) {
278
    var model_name = element.getAttribute('model-name')
279

280
    async function getValues() {
281
        var id__in = ''
282
        var str = element.innerText.replace(/[\s\n\t]+/g, ' ').trim()
283
        let values = str ? str.split(',') : [];
284

285
        for (let v in values) {
286
            var maybe_cache = Singleton.results[values[v]]
287
            if (!maybe_cache) {
288
                Singleton.pushUUID(model_name, values[v])
289
            }
290
        }
291
        var result = []
292
        while (true) {
293
            for (let v in values) {
294
                if (Singleton.results[values[v]]) {
295
                    result.push({
296
                        value: values[v],
297
                        label: Singleton.results[values[v]]
298
                    })
299
                    values.splice(v, 1)
300
                }
301
            }
302
            if (values.length === 0) {
303
                return result
304
            }
305
            await new Promise(r => setTimeout(r, 50));
306
        }
307
    }
308

309
    let res = await getValues()
310
    element.innerText = ''
311
    res.forEach(function (line) {
312

313
        element.insertAdjacentHTML('beforeend', '<span class="badge bg-secondary">' + line.label + '</span>');
314
    });
315
}
316

317
async function choiceMultiBabel() {
318
    var display_title = element.getAttribute('display-title')
319
    var filter = element.getAttribute('filter')
320
    var is_filter = element.getAttribute('is-filter')
321
    var model_name = element.getAttribute('model-name')
322
    var attrs = {
323
        placeholderValue: "Enter " + display_title
324
    }
325
    if (method === 'get' || element.getAttribute('readonly')) {
326
        attrs.removeItemButton = false
327
    } else {
328
        attrs.removeItemButton = true
329
    }
330
    let choices = new Choices(element, attrs);
331
    if (method === 'get' || element.getAttribute('readonly')) {
332
        choices.containerInner.element.classList.add('disabled');
333
        choices.disable()
334
    }
335
    choices.containerInner.element.classList.add('form-control');
336
    if (is_filter) {
337
        function check_valid() {
338
            if (element.required) {
339
                choices.containerInner.element.classList.add('is-invalid');
340
                choices.containerInner.element.classList.remove('is-valid');
341
            } else {
342
                choices.containerInner.element.classList.remove('is-invalid');
343
                choices.containerInner.element.classList.add('is-valid');
344
            }
345
        }
346

347
        check_valid()
348
    }
349

350
    function init() {
351
        choices.setChoices(async () => {
352
            try {
353
                const items = await fetch('/base/search?model=' + model_name + '&search=');
354
                const results = await items.json();
355
                if (0 === results.length) { // Handle error from result, for example.
356
                    throw 'Empty!';
357
                }
358
                return results;
359
            } catch (err) {
360
                console.error(err);
361
            }
362
        }).then(() => {
363
            choices.input.element.focus()
364
        });
365
    }
366

367
    init()
368

369
}
370

371
async function choiceOneBabel() {
372
    var display_title = element.getAttribute('display-title')
373
    var filter = element.getAttribute('filter')
374
    var is_filter = element.getAttribute('is-filter')
375
    var model_name = element.getAttribute('model-name')
376
    var attrs = {
377
        placeholderValue: "Enter " + display_title
378
    }
379
    if (method === 'get' || element.getAttribute('readonly')) {
380
        attrs.removeItemButton = false
381
    } else {
382
        attrs.removeItemButton = true
383
    }
384
    let choices = new Choices(element, attrs);
385
    if (method === 'get' || element.getAttribute('readonly')) {
386
        choices.containerInner.element.classList.add('disabled');
387
        choices.disable()
388
    }
389
    choices.containerInner.element.classList.add('form-control');
390
    if (is_filter) {
391

392
        function check_valid() {
393
            if (element.required) {
394
                choices.containerInner.element.classList.add('is-invalid');
395
                choices.containerInner.element.classList.remove('is-valid');
396
            } else {
397
                choices.containerInner.element.classList.remove('is-invalid');
398
                choices.containerInner.element.classList.add('is-valid');
399
            }
400
        }
401

402
        check_valid()
403
    }
404

405
    function init() {
406
        choices.setChoices(async () => {
407
            try {
408
                const items = await fetch('/base/search?model=' + model_name + '&search=');
409
                const results = await items.json();
410
                if (0 === results.length) { // Handle error from result, for example.
411
                    throw 'Empty!';
412
                }
413
                return results;
414
            } catch (err) {
415
                console.error(err);
416
            }
417
        }).then(() => {
418
            choices.input.element.focus()
419
        });
420
    }
421

422
    init()
423
}
424

425
async function choiceMultiEnum(element, method) {
426
    var display_title = element.getAttribute('display-title')
427
    var filter = element.getAttribute('filter')
428
    var is_filter = element.getAttribute('is-filter')
429
    var model_name = element.getAttribute('model-name')
430
    var attrs = {
431
        placeholderValue: "Enter " + display_title
432
    }
433
    if (method === 'get' || element.getAttribute('readonly')) {
434
        attrs.removeItemButton = false
435
    } else {
436
        attrs.removeItemButton = true
437
    }
438
    let choices = new Choices(element, attrs);
439
    if (method === 'get' || element.getAttribute('readonly')) {
440
        choices.containerInner.element.classList.add('disabled');
441
        choices.disable()
442
    }
443
    choices.containerInner.element.classList.add('form-control');
444

445
    function check_valid(event) {
446
        if (method === 'get' || element.getAttribute('readonly')) { // Если метод get или reanonly, то нет смысла от валидования
447
            // Если метод get или reanonly, то нет смысла от валидования
448
            return
449
        }
450
        if (element.required) {
451
            if (event) {
452
                if (event.type === 'choice') {
453
                    if (event.detail.choice.value) {
454
                        choices.containerInner.element.classList.remove('is-invalid');
455
                        choices.containerInner.element.classList.add('is-valid');
456
                    }
457
                } else if (event.type === 'removeItem') {
458
                    if (event.detail.value) {
459
                        if (!choices.containerInner.element.innerText) {
460
                            choices.containerInner.element.classList.add('is-invalid');
461
                            choices.containerInner.element.classList.remove('is-valid');
462
                        } else {
463
                            choices.containerInner.element.classList.add('is-valid');
464
                            choices.containerInner.element.classList.remove('is-invalid');
465
                        }
466

467
                    }
468
                }
469

470
            } else {
471
                if (!choices.containerInner.element.innerText) {
472
                    choices.containerInner.element.classList.add('is-invalid');
473
                    choices.containerInner.element.classList.remove('is-valid');
474
                } else {
475
                    choices.containerInner.element.classList.add('is-valid');
476
                    choices.containerInner.element.classList.remove('is-invalid');
477
                }
478
            }
479
        } else if (element.id.includes('__in')) {
480
            choices.containerInner.element.classList.remove('is-invalid');
481
            choices.containerInner.element.classList.remove('is-invalid');
482
        } else {
483
            try {
484
                choices.containerInner.element.classList.remove('is-invalid');
485
            } catch (err) {
486

487
            }
488
            choices.containerInner.element.classList.add('is-valid');
489
        }
490
    }
491

492
    choices.containerInner.element.classList.add('form-control');
493

494
    check_valid()
495
}
496

497

498
async function createModal(modal_id) {
499
    var modal = new bootstrap.Modal(modal_id)
500
    function createDragModal(modal) {
501
        var header = modal.querySelector('.modal-header');
502

503
        header.onmousedown = function (e) {
504
            var offsetX = e.clientX - modal.getBoundingClientRect().left;
505
            var offsetY = e.clientY - modal.getBoundingClientRect().top;
506

507
            function mouseMoveHandler(e) {
508
                modal.style.position = 'absolute';
509
                modal.style.left = (e.clientX - offsetX) + 'px';
510
                modal.style.top = (e.clientY - offsetY) + 'px';
511
            }
512

513
            function mouseUpHandler() {
514
                document.removeEventListener('mousemove', mouseMoveHandler);
515
                document.removeEventListener('mouseup', mouseUpHandler);
516
            }
517

518
            document.addEventListener('mousemove', mouseMoveHandler);
519
            document.addEventListener('mouseup', mouseUpHandler);
520
        };
521
    }
522
    modal.show()
523
    document.addEventListener('hidden.bs.modal', function (event) {
524
        console.log(event)
525
        event.target.remove()
526
    })
527
}