@afeefa/vue-app 0.0.316 → 0.0.318

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 +1 @@
1
- 0.0.316
1
+ 0.0.318
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@afeefa/vue-app",
3
- "version": "0.0.316",
3
+ "version": "0.0.318",
4
4
  "description": "",
5
5
  "author": "Afeefa Kollektiv <kollektiv@afeefa.de>",
6
6
  "license": "MIT",
@@ -251,13 +251,22 @@ export default class ADatePicker extends Mixins(ComponentWidthMixin, UsesPositio
251
251
  : value.substr(4, 4))
252
252
  value = `${day.padStart(2, '0')}.${month.padStart(2, '0')}.${year}`
253
253
  } else {
254
- // also accept DD.MM.YY and expand to YYYY (covers inputs like '1.2.20')
255
- const m = value.match(/^(\d{1,2})\.(\d{1,2})\.(\d{2})$/)
256
- if (m) {
257
- const day = m[1].padStart(2, '0')
258
- const month = m[2].padStart(2, '0')
259
- const year = (2000 + parseInt(m[3], 10)).toString()
254
+ // accept D.M. without year and expand to current year (covers inputs like '1.7.')
255
+ const mNoYear = value.match(/^(\d{1,2})\.(\d{1,2})\.$/)
256
+ if (mNoYear) {
257
+ const day = mNoYear[1].padStart(2, '0')
258
+ const month = mNoYear[2].padStart(2, '0')
259
+ const year = new Date().getFullYear().toString()
260
260
  value = `${day}.${month}.${year}`
261
+ } else {
262
+ // also accept DD.MM.YY and expand to YYYY (covers inputs like '1.2.20')
263
+ const m = value.match(/^(\d{1,2})\.(\d{1,2})\.(\d{2})$/)
264
+ if (m) {
265
+ const day = m[1].padStart(2, '0')
266
+ const month = m[2].padStart(2, '0')
267
+ const year = (2000 + parseInt(m[3], 10)).toString()
268
+ value = `${day}.${month}.${year}`
269
+ }
261
270
  }
262
271
  }
263
272
 
@@ -1,5 +1,8 @@
1
1
  <template>
2
- <div :class="['a-search-select', widthClass]">
2
+ <div
3
+ :class="['a-search-select', widthClass]"
4
+ :style="cwm_widthStyle"
5
+ >
3
6
  <div
4
7
  class="activator"
5
8
  @click="open"
@@ -1,223 +0,0 @@
1
- <template>
2
- <div>
3
- <a-table
4
- v-if="selectedItems.length"
5
- :style="selectedWidthStyle"
6
- >
7
- <a-table-header
8
- v-if="hasHeader"
9
- small
10
- >
11
- <div
12
- v-for="(column, index) in selectedColumns"
13
- :key="index"
14
- >
15
- {{ column.header }}
16
- </div>
17
- </a-table-header>
18
-
19
- <a-table-row
20
- v-for="(item, index) in selectedItems"
21
- :key="item.id"
22
- :selected="isClicked(item)"
23
- >
24
- <template v-for="(column, index2) in selectedColumns">
25
- <v-icon
26
- v-if="column.icon"
27
- :key="'icon' + index2"
28
- :color="column.icon.color"
29
- class="selectedIcon"
30
- size="1.5rem"
31
- v-text="column.icon.icon"
32
- />
33
-
34
- <div
35
- v-else
36
- :key="'text' + index2"
37
- class="selectedContent"
38
- >
39
- {{ column.text(item) }}
40
- </div>
41
- </template>
42
-
43
- <div>
44
- <a-context-menu
45
- :ref="'editItem' + index"
46
- @open="clickedItem = item"
47
- @close="clickedItem = null"
48
- >
49
- <a-context-menu-item @click="removeItem(item, index)">
50
- <v-icon>$trashCanIcon</v-icon>
51
- Löschen
52
- </a-context-menu-item>
53
- </a-context-menu>
54
- </div>
55
- </a-table-row>
56
- </a-table>
57
-
58
- <div v-else>
59
- {{ isEmptyText }}
60
- </div>
61
-
62
- <a-search-select
63
- :listAction="selectableConfig.listAction"
64
- :selectedItems="selectableSelectedItems"
65
- :width="selectableWidth"
66
- @select="addItem"
67
- >
68
- <template #activator>
69
- <a-icon-button
70
- small
71
- icon="$plusIcon"
72
- :text="selectableConfig.addButtonTitle || 'Hinzufügen'"
73
- class="mt-4"
74
- />
75
- </template>
76
-
77
- <template #filters>
78
- <a-row gap="4">
79
- <list-filter-search
80
- :focus="true"
81
- maxWidth="100%"
82
- label="Suche Berater:in"
83
- />
84
-
85
- <list-filter-page
86
- :has="{page_size: false, page_number: true}"
87
- :totalVisible="0"
88
- />
89
- </a-row>
90
- </template>
91
-
92
- <template #row="{ model, on }">
93
- <template
94
- v-for="(column, index) in selectableColumns"
95
- v-on="on"
96
- >
97
- <v-icon
98
- v-if="column.icon"
99
- :key="'icon' + index"
100
- :color="column.icon.color"
101
- class="selectableIcon"
102
- size="1.5rem"
103
- v-on="on"
104
- v-text="column.icon.icon"
105
- />
106
-
107
- <div
108
- v-else
109
- :key="'text' + index"
110
- class="selectableContent"
111
- v-on="on"
112
- >
113
- {{ column.text(model) }}
114
- </div>
115
- </template>
116
- </template>
117
- </a-search-select>
118
- </div>
119
- </template>
120
-
121
-
122
- <script>
123
- import { Component, Vue } from '@a-vue'
124
-
125
- @Component({
126
- props: [
127
- 'value',
128
- 'selectedConfig',
129
- 'selectedWidth',
130
- 'selectableConfig',
131
- 'selectableWidth'
132
- ]
133
- })
134
- export default class SearchSelectFormField extends Vue {
135
- clickedItem = null
136
-
137
- get hasHeader () {
138
- return this.selectedColumns.some(c => !!c.header)
139
- }
140
-
141
- get selectedItems () {
142
- return this.value
143
- }
144
-
145
- get selectableSelectedItems () {
146
- return this.value.map(this.selectedConfig.selectedToSelectableItem)
147
- }
148
-
149
- get isEmptyText () {
150
- return this.selectedConfig.isEmptyText
151
- }
152
-
153
- isClicked (selectedItem) {
154
- return selectedItem === this.clickedItem
155
- }
156
-
157
- get selectedColumns () {
158
- return this.selectedConfig.columns
159
- }
160
-
161
- get selectableColumns () {
162
- return this.selectableConfig.columns
163
- }
164
-
165
- addItem (selectableItem) {
166
- const selectedItem = this.selectedConfig.newSelectedItem(selectableItem)
167
- const selectedItems = [...this.value, selectedItem]
168
- if (this.$listeners.add) {
169
- this.$emit('add', selectedItems)
170
- } else {
171
- this.$emit('input', selectedItems)
172
- }
173
- }
174
-
175
- async removeItem (selectedItem, rowIndex) {
176
- const removeDialog = this.selectedConfig.removeDialog(selectedItem)
177
- const dialog = {
178
- anchor: this.$refs['editItem' + rowIndex], // is array [component]
179
- ...removeDialog,
180
- yesButton: 'Löschen',
181
- yesColor: 'red white--text'
182
- }
183
-
184
- const selectedItems = this.value.filter(i => i !== selectedItem)
185
- if (this.$listeners.remove) {
186
- this.$emit('remove', selectedItems, dialog)
187
- } else {
188
- this.$emit('input', selectedItems)
189
- }
190
- }
191
-
192
- get selectedWidthStyle () {
193
- if (!this.selectedWidth) {
194
- return ''
195
- }
196
-
197
- let width = this.selectedWidth
198
- if (!isNaN(width)) {
199
- width = width + 'px'
200
- }
201
- return `width: ${width};`
202
- }
203
- }
204
- </script>
205
-
206
-
207
- <style scoped lang="scss">
208
- .selectedIcon:deep() {
209
- padding-right: .3rem !important;
210
- }
211
-
212
- .selectableIcon:deep() {
213
- padding-right: 2rem !important;
214
- }
215
-
216
- .selectedContent:deep() {
217
- width: 100%;
218
- }
219
-
220
- .selectableContent:deep() {
221
- width: 100%;
222
- }
223
- </style>