@afeefa/vue-app 0.0.53 → 0.0.54

package/.afeefa/package/release/version.txt

@@ -1 +1 @@
-0.0.53
+0.0.54

package/package.json

@@ -1,20 +1,13 @@
 {
   "name": "@afeefa/vue-app",
-  "version": "0.0.53",
+  "version": "0.0.54",
   "description": "",
   "author": "Afeefa Kollektiv <kollektiv@afeefa.de>",
   "license": "MIT",
-  "scripts": {
-    "typings": "tsc"
-  },
   "devDependencies": {
-    "core-js": "^3.9.1",
-    "typescript": "^4.2.3",
-    "vue": "^2.6.12",
+    "core-js": "^3.21.1",
+    "vue": "^2.6.14",
     "vue-class-component": "^7.2.6",
     "vue-property-decorator": "^9.1.2"
-  },
-  "dependencies": {
-    "moment": "^2.29.1"
   }
 }

package/src/api-resources/ApiActions.js

@@ -228,14 +228,38 @@ export class RemoveAction {
 }
 
 export class ListAction {
+  action = null
   request = null
+  params = {}
+  fields = {}
+  filters = {}
   events = true
 
+  setAction (action) {
+    this.action = action
+    return this
+  }
+
   setRequest (request) {
     this.request = request
     return this
   }
 
+  setParams (params) {
+    this.params = params
+    return this
+  }
+
+  setFields (fields) {
+    this.fields = fields
+    return this
+  }
+
+  setFilters (filters) {
+    this.filters = filters
+    return this
+  }
+
   noEvents (noEvents) {
     this.events = noEvents === undefined ? false : !noEvents
     return this
@@ -246,6 +270,13 @@ export class ListAction {
       eventBus.dispatch(new LoadingEvent(LoadingEvent.START_LOADING))
     }
 
+    if (!this.request) {
+      this.request = this.action.createRequest()
+        .params(this.params)
+        .fields(this.fields)
+        .filters(this.filters)
+    }
+
     const result = await this.request.send()
 
     if (result.error) {

package/src/components/AAlert.vue

@@ -35,7 +35,7 @@
 </template>
 
 <script>
-import { Component, Vue } from 'vue-property-decorator'
+import { Component, Vue } from '@a-vue'
 import { AlertEvent } from './alert/AlertEvent'
 
 @Component

package/src/components/AAutocomplete.vue

@@ -18,7 +18,7 @@
 
 
 <script>
-import { Component, Vue, Watch } from 'vue-property-decorator'
+import { Component, Vue, Watch } from '@a-vue'
 import { Model } from '@afeefa/api-resources-client'
 import { debounce } from '@a-vue/utils/debounce'
 

package/src/components/ABadge.vue

@@ -7,7 +7,7 @@
 
 
 <script>
-import { Component, Vue, Watch } from 'vue-property-decorator'
+import { Component, Vue, Watch } from '@a-vue'
 
 @Component({
   props: ['content']

package/src/components/ABreadcrumbs.vue

@@ -19,7 +19,7 @@
 
 
 <script>
-import { Component, Vue, Watch } from 'vue-property-decorator'
+import { Component, Vue, Watch } from '@a-vue'
 import { SaveEvent } from './save-indicator/SaveEvent'
 import { routeConfigPlugin } from '@a-vue/plugins/route-config/RouteConfigPlugin'
 

package/src/components/ACheckbox.vue

@@ -0,0 +1,35 @@
+<template>
+  <v-checkbox
+    ref="checkbox"
+    v-bind="$attrs"
+    :inputValue="$attrs.value"
+    @change="$emit('input', $event || false)"
+  />
+</template>
+
+
+<script>
+import { Component, Vue } from '@a-vue'
+
+@Component({
+  props: ['validator']
+})
+export default class ACheckbox extends Vue {
+  created () {
+    this.init()
+  }
+
+  async init () {
+    if (this.validator) {
+      this.$nextTick(() => {
+        this.$refs.checkbox.validate(true)
+      })
+    }
+  }
+
+  get validationRules () {
+    const label = this.$attrs.label
+    return (this.validator && this.validator.getRules(label)) || []
+  }
+}
+</script>

package/src/components/AContextMenu.vue

@@ -25,7 +25,7 @@
 </template>
 
 <script>
-import { Component, Mixins, Watch } from 'vue-property-decorator'
+import { Component, Mixins, Watch } from '@a-vue'
 import { UsesPositionServiceMixin } from '../services/position/UsesPositionServiceMixin'
 import { Positions, PositionConfig } from '../services/PositionService'
 import { randomCssClass } from '../utils/random'

package/src/components/AContextMenuItem.vue

@@ -8,7 +8,7 @@
 </template>
 
 <script>
-import { Component, Vue } from 'vue-property-decorator'
+import { Component, Vue } from '@a-vue'
 
 @Component({
   props: ['to']

package/src/components/ADatePicker.vue

@@ -29,7 +29,7 @@
 
 
 <script>
-import { Component, Mixins, Watch } from 'vue-property-decorator'
+import { Component, Mixins, Watch } from '@a-vue'
 import { formatDate } from '@a-vue/utils/format-date'
 import { ComponentWidthMixin } from './mixins/ComponentWidthMixin'
 

package/src/components/ADialog.vue

@@ -54,7 +54,7 @@
 </template>
 
 <script>
-import { Component, Mixins, Watch } from 'vue-property-decorator'
+import { Component, Mixins, Watch } from '@a-vue'
 import { DialogEvent } from './dialog/DialogEvent'
 import { PositionConfig } from '../services/PositionService'
 import { UsesPositionServiceMixin } from '../services/position/UsesPositionServiceMixin'

package/src/components/AGrid.vue

@@ -6,7 +6,7 @@
 
 
 <script>
-import { Component, Vue } from 'vue-property-decorator'
+import { Component, Vue } from '@a-vue'
 
 @Component({
   props: ['fullWidth', 'gap', 'hGap', 'vGap', 'cols', 'even', 'breakMobile']
@@ -91,6 +91,7 @@ export default class AGrid extends Vue {
       grid-template-columns: repeat(5, 1fr);
     }
   }
+
   &.breakMobile {
     @media (max-width: 900px), (orientation : portrait) {
       grid-template-columns: 1fr;

package/src/components/AIcon.vue

@@ -10,7 +10,7 @@
 
 
 <script>
-import { Component, Vue } from 'vue-property-decorator'
+import { Component, Vue } from '@a-vue'
 
 @Component({
   props: ['button']

package/src/components/AIconButton.vue

@@ -16,7 +16,7 @@
 
 
 <script>
-import { Component, Vue } from 'vue-property-decorator'
+import { Component, Vue } from '@a-vue'
 
 @Component({
   props: ['icon', 'text']

package/src/components/ALoadingIndicator.vue

@@ -9,7 +9,7 @@
 </template>
 
 <script>
-import { Component, Vue, Watch } from 'vue-property-decorator'
+import { Component, Vue, Watch } from '@a-vue'
 
 @Component({
   props: ['isLoading']

package/src/components/AModal.vue

@@ -33,7 +33,7 @@
 </template>
 
 <script>
-import { Component, Mixins, Watch } from 'vue-property-decorator'
+import { Component, Mixins, Watch } from '@a-vue'
 import { PositionConfig } from '../services/PositionService'
 import { UsesPositionServiceMixin } from '@a-vue/services/position/UsesPositionServiceMixin'
 import { randomCssClass } from '../utils/random'

package/src/components/APagination.vue

@@ -13,7 +13,7 @@
 
 
 <script>
-import { Component, Vue } from 'vue-property-decorator'
+import { Component, Vue } from '@a-vue'
 
 @Component({
   props: ['content']

package/src/components/ARadioGroup.vue

@@ -18,7 +18,7 @@
 
 
 <script>
-import { Component, Vue, Watch } from 'vue-property-decorator'
+import { Component, Vue, Watch } from '@a-vue'
 
 @Component({
   props: ['options', 'validator']

package/src/components/ARow.vue

@@ -6,7 +6,7 @@
 
 
 <script>
-import { Component, Vue } from 'vue-property-decorator'
+import { Component, Vue } from '@a-vue'
 
 @Component({
   props: ['fullWidth', 'gap', 'start', 'stretch', 'center', 'vertical', 'right']

package/src/components/ASaveIndicator.vue

@@ -14,7 +14,7 @@
 
 
 <script>
-import { Component, Vue } from 'vue-property-decorator'
+import { Component, Vue } from '@a-vue'
 import { SaveEvent } from './save-indicator/SaveEvent'
 
 @Component

package/src/components/ASearchSelect.vue

@@ -44,12 +44,14 @@
     <div :class="listCssClass">
       <search-select-list
         v-if="isOpen"
-        v-bind="listConfig"
+        :listViewConfig="listViewConfig"
         :q="q"
+        :selectedItems="selectedItems"
         :events="false"
         :history="false"
         :filterSource="filterSource"
         :loadOnlyIfKeyword="_loadOnlyIfKeyword"
+        :filters.sync="filters"
         :count.sync="count"
         :isLoading.sync="isLoading"
       >
@@ -88,7 +90,7 @@
 
 
 <script>
-import { Component, Watch, Mixins } from 'vue-property-decorator'
+import { Component, Watch, Mixins } from '@a-vue'
 import { UsesPositionServiceMixin } from '../services/position/UsesPositionServiceMixin'
 import { PositionConfig } from '../services/PositionService'
 import { randomCssClass } from '../utils/random'
@@ -98,7 +100,16 @@ import SearchSelectList from './search-select/SearchSelectList'
 import { CancelOnEscMixin } from '@a-vue/services/escape/CancelOnEscMixin'
 
 @Component({
-  props: ['listConfig', 'q', 'width', 'closeOnSelect', 'loadOnlyIfKeyword'],
+  props: [
+    'listViewConfig',
+    'q',
+    'width',
+    'closeOnSelect',
+    'loadOnlyIfKeyword',
+    {
+      selectedItems: []
+    }
+  ],
   components: {
     SearchSelectFilters,
     SearchSelectList
@@ -196,7 +207,7 @@ export default class ASearchSelect extends Mixins(UsesPositionServiceMixin, Canc
         p
           .anchorTop()
           .targetBottom()
-          .diffY('-1rem')
+          .diffY('-.5rem')
       })
       .onPosition(this.onListPositionChanged)
 
@@ -323,8 +334,13 @@ export default class ASearchSelect extends Mixins(UsesPositionServiceMixin, Canc
   overflow-y: auto;
   overscroll-behavior: contain;
 
-  ::v-deep .a-table-row > * {
-    cursor: pointer;
+  ::v-deep .a-table-row {
+    &:not(.selected) {
+      cursor: pointer;
+    }
+    &.selected {
+      pointer-events: none;
+    }
   }
 }
 

package/src/components/ASelect.vue

@@ -12,7 +12,7 @@
 
 
 <script>
-import { Component, Mixins, Watch } from 'vue-property-decorator'
+import { Component, Mixins, Watch } from '@a-vue'
 import { Model } from '@afeefa/api-resources-client'
 import { ComponentWidthMixin } from './mixins/ComponentWidthMixin'
 

package/src/components/ATable.vue

@@ -6,7 +6,7 @@
 
 
 <script>
-import { Component, Vue } from 'vue-property-decorator'
+import { Component, Vue } from '@a-vue'
 
 @Component({
   props: ['width', 'fixed']

package/src/components/ATableHeader.vue

@@ -6,7 +6,7 @@
 
 
 <script>
-import { Component, Vue } from 'vue-property-decorator'
+import { Component, Vue } from '@a-vue'
 
 @Component({
   props: ['small']

package/src/components/ATableRow.vue

@@ -9,7 +9,7 @@
 
 
 <script>
-import { Component, Vue } from 'vue-property-decorator'
+import { Component, Vue } from '@a-vue'
 
 @Component({
   props: ['small', 'selected']

package/src/components/ATextArea.vue

@@ -10,7 +10,7 @@
 
 
 <script>
-import { Component, Vue } from 'vue-property-decorator'
+import { Component, Vue } from '@a-vue'
 
 @Component({
   props: ['validator']

package/src/components/ATextField.vue

@@ -15,7 +15,7 @@
 
 
 <script>
-import { Component, Watch, Mixins } from 'vue-property-decorator'
+import { Component, Watch, Mixins } from '@a-vue'
 import { debounce } from '@a-vue/utils/debounce'
 import { ComponentWidthMixin } from './mixins/ComponentWidthMixin'
 

package/src/components/form/EditForm.vue

@@ -14,7 +14,7 @@
 
 
 <script>
-import { Component, Vue, Watch } from 'vue-property-decorator'
+import { Component, Vue, Watch } from '@a-vue'
 import { apiResources } from '@afeefa/api-resources-client'
 
 @Component({

package/src/components/form/EditModal.vue

@@ -56,7 +56,7 @@
 
 
 <script>
-import { Component, Vue, Watch } from 'vue-property-decorator'
+import { Component, Vue, Watch } from '@a-vue'
 
 @Component({
   props: ['model', 'title', 'show']

package/src/components/form/FormFieldMixin.js

@@ -1,6 +1,6 @@
 import { ListAction } from '@a-vue/api-resources/ApiActions'
 import { apiResources } from '@afeefa/api-resources-client'
-import { Component, Vue } from 'vue-property-decorator'
+import { Component, Vue } from '@a-vue'
 
 @Component({
   props: ['name', 'label']

package/src/components/form/fields/FormFieldCheckbox.vue

@@ -0,0 +1,18 @@
+<template>
+  <a-checkbox
+    v-model="model[name]"
+    :label="label || name"
+    :validator="validator"
+    v-bind="$attrs"
+    v-on="$listeners"
+  />
+</template>
+
+<script>
+import { Component, Mixins } from '@a-vue'
+import { FormFieldMixin } from '../FormFieldMixin'
+
+@Component
+export default class FormFieldCheckbox extends Mixins(FormFieldMixin) {
+}
+</script>

package/src/components/form/fields/FormFieldDate.vue

@@ -8,7 +8,7 @@
 </template>
 
 <script>
-import { Component, Mixins } from 'vue-property-decorator'
+import { Component, Mixins } from '@a-vue'
 import { FormFieldMixin } from '../FormFieldMixin'
 
 @Component

package/src/components/form/fields/FormFieldRadioGroup.vue

@@ -10,7 +10,7 @@
 </template>
 
 <script>
-import { Component, Mixins } from 'vue-property-decorator'
+import { Component, Mixins } from '@a-vue'
 import { FormFieldMixin } from '../FormFieldMixin'
 
 @Component

package/src/components/form/fields/FormFieldSearchSelect.vue

@@ -35,7 +35,7 @@
 </template>
 
 <script>
-import { Component, Mixins } from 'vue-property-decorator'
+import { Component, Mixins } from '@a-vue'
 import { FormFieldMixin } from '../FormFieldMixin'
 
 @Component({

package/src/components/form/fields/FormFieldSelect.vue

@@ -13,7 +13,7 @@
 </template>
 
 <script>
-import { Component, Mixins } from 'vue-property-decorator'
+import { Component, Mixins } from '@a-vue'
 import { FormFieldMixin } from '../FormFieldMixin'
 
 @Component

package/src/components/form/fields/FormFieldSelect2.vue

@@ -14,7 +14,7 @@
 </template>
 
 <script>
-import { Component, Mixins } from 'vue-property-decorator'
+import { Component, Mixins } from '@a-vue'
 import { FormFieldMixin } from '../FormFieldMixin'
 import { ComponentWidthMixin } from '../../mixins/ComponentWidthMixin'
 

package/src/components/form/fields/FormFieldText.vue

@@ -8,7 +8,7 @@
 </template>
 
 <script>
-import { Component, Mixins } from 'vue-property-decorator'
+import { Component, Mixins } from '@a-vue'
 import { FormFieldMixin } from '../FormFieldMixin'
 
 @Component

package/src/components/form/fields/FormFieldTextArea.vue

@@ -8,7 +8,7 @@
 </template>
 
 <script>
-import { Component, Mixins } from 'vue-property-decorator'
+import { Component, Mixins } from '@a-vue'
 import { FormFieldMixin } from '../FormFieldMixin'
 
 @Component

package/src/components/index.js

@@ -2,6 +2,7 @@ import Vue from 'vue'
 
 import EditForm from './form/EditForm'
 import EditModal from './form/EditModal'
+import FormFieldCheckbox from './form/fields/FormFieldCheckbox'
 import FormFieldDate from './form/fields/FormFieldDate'
 import FormFieldRadioGroup from './form/fields/FormFieldRadioGroup'
 import FormFieldSearchSelect from './form/fields/FormFieldSearchSelect'
@@ -19,6 +20,7 @@ Vue.component('EditModal', EditModal)
 Vue.component('FormFieldText', FormFieldText)
 Vue.component('FormFieldTextArea', FormFieldTextArea)
 Vue.component('FormFieldRadioGroup', FormFieldRadioGroup)
+Vue.component('FormFieldCheckbox', FormFieldCheckbox)
 Vue.component('FormFieldDate', FormFieldDate)
 Vue.component('FormFieldSearchSelect', FormFieldSearchSelect)
 Vue.component('FormFieldSelect', FormFieldSelect)

package/src/components/list/ListFilterMixin.js

@@ -1,4 +1,4 @@
-import { Component, Vue } from 'vue-property-decorator'
+import { Component, Vue } from '@a-vue'
 
 @Component({
   props: ['name', 'label']

package/src/components/list/ListFilterRow.vue

@@ -9,7 +9,7 @@
 
 
 <script>
-import { Component, Vue } from 'vue-property-decorator'
+import { Component, Vue } from '@a-vue'
 
 @Component({
   props: ['gap']

package/src/components/list/ListViewMixin.js

@@ -1,13 +1,12 @@
+import { Component, Vue, Watch } from '@a-vue'
 import { ListAction } from '@a-vue/api-resources/ApiActions'
-import { propsWithDefaults } from '@a-vue/utils/props-helper'
 import { ListViewModel } from '@afeefa/api-resources-client'
-import { Component, Vue, Watch } from 'vue-property-decorator'
 
 import { CurrentRouteFilterSource } from './CurrentRouteFilterSource'
 import { FilterSourceType } from './FilterSourceType'
 
 @Component({
-  ...propsWithDefaults([
+  props: [
     'models', 'meta', // given, if already loaded
     'listViewConfig',
     'filterHistoryKey',
@@ -17,7 +16,7 @@ import { FilterSourceType } from './FilterSourceType'
       events: true,
       history: true
     }
-  ])
+  ]
 })
 export class ListViewMixin extends Vue {
   LIST_VIEW = true

package/src/components/list/filters/ListFilterPage.vue

@@ -27,7 +27,7 @@
 
 
 <script>
-import { Component, Mixins } from 'vue-property-decorator'
+import { Component, Mixins } from '@a-vue'
 import { ListFilterMixin } from '../ListFilterMixin'
 
 @Component({

package/src/components/list/filters/ListFilterSearch.vue

@@ -12,7 +12,7 @@
 
 
 <script>
-import { Component, Mixins } from 'vue-property-decorator'
+import { Component, Mixins } from '@a-vue'
 import { ListFilterMixin } from '../ListFilterMixin'
 
 @Component

package/src/components/list/filters/ListFilterSelect.vue

@@ -13,7 +13,7 @@
 
 
 <script>
-import { Component, Mixins } from 'vue-property-decorator'
+import { Component, Mixins } from '@a-vue'
 import { ListFilterMixin } from '../ListFilterMixin'
 import { ListAction } from '@a-vue/api-resources/ApiActions'
 

package/src/components/mixins/ClickOutsideMixin.js

@@ -1,4 +1,4 @@
-import { Component, Vue } from 'vue-property-decorator'
+import { Component, Vue } from '@a-vue'
 import { getZIndex } from 'vuetify/lib/util/helpers'
 
 @Component

package/src/components/mixins/ComponentWidthMixin.js

@@ -1,4 +1,4 @@
-import { Component, Vue } from 'vue-property-decorator'
+import { Component, Vue } from '@a-vue'
 
 @Component({
   props: ['maxWidth', 'width']