@afeefa/vue-app 0.0.225 → 0.0.227

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.225
1
+ 0.0.227
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@afeefa/vue-app",
3
- "version": "0.0.225",
3
+ "version": "0.0.227",
4
4
  "description": "",
5
5
  "author": "Afeefa Kollektiv <kollektiv@afeefa.de>",
6
6
  "license": "MIT",
@@ -5,6 +5,7 @@
5
5
  :items="items_"
6
6
  :valueComparator="compareValues"
7
7
  :style="cwm_widthStyle"
8
+ :multiple="multiple"
8
9
  v-bind="{...$attrs, dense, outlined}"
9
10
  v-on="$listeners"
10
11
  />
@@ -17,7 +18,7 @@ import { Model } from '@afeefa/api-resources-client'
17
18
  import { ComponentWidthMixin } from './mixins/ComponentWidthMixin'
18
19
 
19
20
  @Component({
20
- props: ['validator', 'defaultValue', 'items', {dense: true, outlined: true}]
21
+ props: ['validator', 'defaultValue', 'items', {dense: true, outlined: true, multiple: false}]
21
22
  })
22
23
  export default class ASelect extends Mixins(ComponentWidthMixin) {
23
24
  items_ = []
@@ -34,7 +35,11 @@ export default class ASelect extends Mixins(ComponentWidthMixin) {
34
35
  const setValue = this.select.setValue
35
36
  this.select.setValue = value => {
36
37
  if (this.select.isClear) {
37
- value = this.defaultValue || null
38
+ if (this.multiple) {
39
+ value = this.defaultValue || []
40
+ } else {
41
+ value = this.defaultValue || null
42
+ }
38
43
  }
39
44
  setValue(value)
40
45
  }
@@ -98,6 +103,14 @@ export default class ASelect extends Mixins(ComponentWidthMixin) {
98
103
  </script>
99
104
 
100
105
 
106
+ <style lang="scss">
107
+ .v-application .v-select-list .v-list-item__action {
108
+ margin: 0;
109
+ margin-right: .5rem;
110
+ }
111
+
112
+ </style>
113
+
101
114
  <style lang="scss" scoped>
102
115
  .v-text-field :deep(.v-input__icon--clear) { // always show clear icon, https://github.com/vuetifyjs/vuetify/pull/15876
103
116
  opacity: 1;
@@ -5,7 +5,8 @@
5
5
  :items="_items"
6
6
  itemText="itemTitle"
7
7
  itemValue="itemValue"
8
- :clearable="filter.hasDefaultValue() && !filter.hasDefaultValueSet()"
8
+ :multiple="filter.multiple"
9
+ :clearable="clearable"
9
10
  :defaultValue="filter.defaultValue"
10
11
  hide-details
11
12
  v-bind="$attrs"
@@ -25,6 +26,10 @@ export default class ListFilterSelect extends Mixins(ListFilterMixin) {
25
26
  items = null
26
27
 
27
28
  created () {
29
+ if (this.filter.multiple && !this.filter.value) {
30
+ this.filter.value = []
31
+ }
32
+
28
33
  if (this.filter.hasOptionsRequest()) {
29
34
  this.items = this.loadRequestOptions()
30
35
  } else if (this.filter.hasOptions()) {
@@ -32,6 +37,18 @@ export default class ListFilterSelect extends Mixins(ListFilterMixin) {
32
37
  }
33
38
  }
34
39
 
40
+ get clearable () {
41
+ if (this.multiple) {
42
+ return !!this.filter.value?.length
43
+ }
44
+
45
+ if (this.filter.hasDefaultValue()) {
46
+ return !this.filter.hasDefaultValueSet()
47
+ }
48
+
49
+ return !!this.filter.value
50
+ }
51
+
35
52
  get _items () {
36
53
  return this.$attrs.items || this.items || []
37
54
  }
@@ -32,6 +32,8 @@
32
32
  <div class="a-table-wrapper">
33
33
  <a-table>
34
34
  <a-table-header>
35
+ <div v-if="bulkselection" />
36
+
35
37
  <div v-if="$has.icon">
36
38
  <slot name="header-icon" />
37
39
  </div>
@@ -39,29 +41,67 @@
39
41
  <slot name="header-table" />
40
42
  </a-table-header>
41
43
 
42
- <a-table-row
43
- v-for="(model, index) in models_"
44
- :key="model.id"
45
- v-flying-context-trigger="hasFlyingContext"
46
- :class="getRowClasses(model)"
47
- v-bind="getRowAttributes(model)"
48
- v-on="getRowListeners(model)"
49
- @click="emitFlyingContext(model)"
50
- >
51
- <v-icon
52
- v-if="$has.icon"
53
- :color="model.getIcon().color"
54
- size="1.2rem"
55
- v-text="model.getIcon().icon"
56
- />
57
-
58
- <slot
59
- name="model-table"
60
- :model="model"
61
- :index="index"
62
- :filters="filters"
63
- />
64
- </a-table-row>
44
+ <template v-for="(model, index) in models_">
45
+ <a-table-row
46
+ :key="'model' + model.id"
47
+ v-flying-context-trigger="hasFlyingContext"
48
+ :class="[
49
+ getRowClasses(model),
50
+ { hasSubModels: !!getSubModels(model).length }
51
+ ]"
52
+ v-bind="getRowAttributes(model)"
53
+ v-on="getRowListeners(model)"
54
+ @click="emitFlyingContext(model)"
55
+ >
56
+ <div
57
+ v-if="bulkselection"
58
+ class="pr-2"
59
+ >
60
+ <a-checkbox
61
+ :value="isSelected(model)"
62
+ hide-details
63
+ class="pa-0"
64
+ @input="selectClient(model)"
65
+ />
66
+ </div>
67
+
68
+ <v-icon
69
+ v-if="$has.icon"
70
+ :color="model.getIcon().color"
71
+ size="1.2rem"
72
+ v-text="model.getIcon().icon"
73
+ />
74
+
75
+ <slot
76
+ name="model-table"
77
+ :model="model"
78
+ :index="index"
79
+ :filters="filters"
80
+ />
81
+ </a-table-row>
82
+
83
+ <a-table-row
84
+ v-for="(subModel, subIndex) in getSubModels(model)"
85
+ :key="subModel.id"
86
+ small
87
+ :class="{
88
+ ...getRowClasses(model),
89
+ last: subIndex === getSubModels(model).length - 1,
90
+ subModel: true
91
+ }"
92
+ >
93
+ <div v-if="bulkselection" />
94
+
95
+ <div v-if="$has.icon" />
96
+
97
+ <slot
98
+ name="subModel-table"
99
+ :model="subModel"
100
+ :index="subIndex"
101
+ :filters="filters"
102
+ />
103
+ </a-table-row>
104
+ </template>
65
105
  </a-table>
66
106
  </div>
67
107
  </template>
@@ -122,7 +162,17 @@ import { ListViewMixin } from '@a-vue/components/list/ListViewMixin'
122
162
  import { LoadingEvent } from '@a-vue/events'
123
163
 
124
164
  @Component({
125
- props: ['rowAttributes', 'rowClasses', 'rowListeners']
165
+ props: [
166
+ 'rowAttributes',
167
+ 'rowClasses',
168
+ 'rowListeners',
169
+ {
170
+ bulkselection: false,
171
+ getSubModels: {
172
+ default: () => model => []
173
+ }
174
+ }
175
+ ]
126
176
  })
127
177
  export default class ListView extends Mixins(ListViewMixin) {
128
178
  $hasOptions = ['icon', 'filters']
@@ -134,6 +184,20 @@ export default class ListView extends Mixins(ListViewMixin) {
134
184
  scrollTopStart = null
135
185
  scrollContainerY = null
136
186
 
187
+ selectedModels = []
188
+
189
+ isSelected (model) {
190
+ return this.selectedModels.includes(model)
191
+ }
192
+
193
+ selectClient (model) {
194
+ if (!this.isSelected(model)) {
195
+ this.selectedModels.push(model)
196
+ } else {
197
+ this.selectedModels = this.selectedModels.filter(m => m !== model)
198
+ }
199
+ }
200
+
137
201
  @Watch('isLoading')
138
202
  isLoadingChanged () {
139
203
  if (this.events) {
@@ -308,4 +372,19 @@ filters-below:not(:empty) {
308
372
  .a-table-row.clickable {
309
373
  cursor: pointer;
310
374
  }
375
+
376
+ :deep(.a-table-row.hasSubModels) > * {
377
+ padding-bottom: 0;
378
+ border: none;
379
+ }
380
+
381
+ :deep(.a-table-row.small.subModel) > * {
382
+ padding-top: 0;
383
+ color: gray;
384
+ }
385
+
386
+ :deep(.a-table-row.small.subModel):not(.last) > * {
387
+ border: none;
388
+ padding-bottom: 0;
389
+ }
311
390
  </style>