blob: 0d0ca4b06a687d96cb73bb8203c25813a744d266 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
|
<?php
/** @version 4.6.1 */
declare(strict_types=1);
/**
* User: Daschmi (daschmi@daschmi.de)
* Date: 04.11.2021
* Time: 10:28
*/
?>
<script src="<?php echo WPSG_URL_CONTENT.'plugins/'.WPSG_FOLDERNAME.'/views/js/vue3.js'; ?>"></script>
<div id="wpsg_mod_orderstates_app">
<textarea name="wpsg_mod_orderstates[states]" class="none">{{arStates}}</textarea>
<p class="flex items-center justify-between">
<template v-if="arStatesNotDeleted.length === 0">
<?php echo __('Keine Bestellzustände angelegt.', 'wpsg'); ?>
</template>
<template v-else-if="arStatesNotDeleted.length === 1">
<?php echo __('Ein Bestellzustand wurde definiert.', 'wpsg'); ?>
</template>
<template v-else>
{{arStatesNotDeleted.length}} <?php echo __('Bestellzustände wurden definiert.', 'wpsg'); ?>
</template>
<a href="#" @click.prevent="add()">
<span class="wpsg-glyphicon glyphicon glyphicon-plus"></span><?php echo __('Neuen Bestellzustand anlegen', 'wpsg'); ?>
</a>
</p>
<table class="w-full mt-2">
<tbody v-for="(row, i) of arStatesNotDeleted">
<tr>
<td class="p-1 w-full">
<input class="w-full box-border" type="text" v-model="row.name" />
</td>
<td class="p-1 text-right">
<a href="#" @click.prevent="deleteRow(row)" title="<?php echo __('Bestellzustand löschen', 'wpsg'); ?>">
<span class="glyphicon glyphicon-trash"></span>
</a>
</td>
</tr>
</tbody>
</table>
</div>
<script>
const Counter = {
data() {
return {
arStates: <?php echo json_encode($this->view['arStates']); ?>
}
},
computed: {
arStatesNotDeleted() {
let r = [];
for (let s of this.arStates) if (s.deleted !== '1') r.push(s);
return r;
}
},
methods: {
add() {
this.arStates.push({
id: 0,
name: '',
deleted: 0
});
},
deleteRow(row) {
row.deleted = '1';
}
}
}
Vue.createApp(Counter).mount('#wpsg_mod_orderstates_app')
</script>
|
