Skip to content
Snippets Groups Projects
Unverified Commit 9e744b98 authored by Marc Hanisch's avatar Marc Hanisch
Browse files

passes CV entities as component props

parent 2f57cdd3
No related branches found
No related tags found
2 merge requests!90Draft: restructure frontend properties 2,!82Restructure frontend
......@@ -21,17 +21,22 @@
multiple
>
<template
v-for="(field, index) in properties"
v-for="(field, index) in deviceProperties"
>
<NuxtChild
:key="'property-' + index"
v-model="properties[index]"
v-model="deviceProperties[index]"
:compartments="compartments"
:sampling-medias="samplingMedias"
:properties="properties"
:units="units"
:measured-quantity-units="measuredQuantityUnits"
@delete="deleteProperty"
/>
</template>
</v-expansion-panels>
<v-card-actions
v-if="properties.length > 3"
v-if="deviceProperties.length > 3"
>
<v-spacer />
<v-btn
......@@ -48,8 +53,13 @@
</template>
<script lang="ts">
import { Component, Vue } from 'nuxt-property-decorator'
import { Component, Vue, Watch } from 'nuxt-property-decorator'
import { DeviceProperty } from '@/models/DeviceProperty'
import { Compartment } from '@/models/Compartment'
import { Property } from '@/models/Property'
import { SamplingMedia } from '@/models/SamplingMedia'
import { Unit } from '@/models/Unit'
import { MeasuredQuantityUnit } from '@/models/MeasuredQuantityUnit'
import ProgressIndicator from '@/components/ProgressIndicator.vue'
......@@ -60,20 +70,51 @@ import ProgressIndicator from '@/components/ProgressIndicator.vue'
})
export default class DevicePropertiesPage extends Vue {
private openedPanels: number[] = []
private properties: DeviceProperty[] = []
private deviceProperties: DeviceProperty[] = []
private isLoading = false
private isSaving = false
private compartments: Compartment[] = []
private samplingMedias: SamplingMedia[] = []
private properties: Property[] = []
private units: Unit[] = []
private measuredQuantityUnits: MeasuredQuantityUnit[] = []
mounted () {
this.isLoading = true
this.$api.devices.findRelatedDeviceProperties(this.deviceId).then((foundProperties) => {
this.properties = foundProperties
this.deviceProperties = foundProperties
this.isLoading = false
this.openSelectedPanel()
}).catch(() => {
this.$store.commit('snackbar/setError', 'Failed to fetch custom fields')
this.$store.commit('snackbar/setError', 'Failed to fetch properties')
this.isLoading = false
})
this.$api.compartments.findAllPaginated().then((foundCompartments) => {
this.compartments = foundCompartments
}).catch(() => {
this.$store.commit('snackbar/setError', 'Loading of compartments failed')
})
this.$api.samplingMedia.findAllPaginated().then((foundSamplingMedias) => {
this.samplingMedias = foundSamplingMedias
}).catch(() => {
this.$store.commit('snackbar/setError', 'Loading of sampling medias failed')
})
this.$api.properties.findAllPaginated().then((foundProperties) => {
this.properties = foundProperties
}).catch(() => {
this.$store.commit('snackbar/setError', 'Loading of properties failed')
})
this.$api.units.findAllPaginated().then((foundUnits) => {
this.units = foundUnits
}).catch(() => {
this.$store.commit('snackbar/setError', 'Loading of units failed')
})
this.$api.measuredQuantityUnits.findAllPaginated().then((foundUnits) => {
this.measuredQuantityUnits = foundUnits
}).catch(() => {
this.$store.commit('snackbar/setError', 'Loading of measuredquantityunits failed')
})
}
get isInProgress (): boolean {
......@@ -106,14 +147,17 @@ export default class DevicePropertiesPage extends Vue {
openSelectedPanel (): void {
const propertyId = this.getPropertyIdFromUrl()
console.log('propertyId by URL is', propertyId)
if (!propertyId) {
Vue.set(this, 'openedPanels', [])
return
}
const propertyIndex: number = this.properties.findIndex((prop: DeviceProperty) => prop.id === propertyId)
const propertyIndex: number = this.deviceProperties.findIndex((prop: DeviceProperty) => prop.id === propertyId)
console.log('propertyIndex is', propertyIndex)
if (propertyIndex === -1) {
return
}
this.openedPanels = [propertyIndex]
Vue.set(this, 'openedPanels', [propertyIndex])
}
addProperty (): void {
......@@ -121,5 +165,12 @@ export default class DevicePropertiesPage extends Vue {
deleteProperty (property: DeviceProperty) {
}
@Watch('$route', { immediate: true, deep: true })
// @ts-ignore
onRouteChanged () {
this.openSelectedPanel()
console.log('route changed', this.openedPanels)
}
}
</script>
......@@ -3,6 +3,11 @@
<NuxtChild
v-if="isEditModeForProperty"
v-model="property"
:compartments="compartments"
:sampling-medias="samplingMedias"
:properties="properties"
:units="units"
:measured-quantity-units="measuredQuantityUnits"
/>
<DevicePropertyExpansionPanel
v-else
......@@ -42,44 +47,68 @@ import DevicePropertyInfo from '@/components/DevicePropertyInfo.vue'
}
})
export default class DevicePropertyIdPage extends Vue {
private compartments: Compartment[] = []
private samplingMedias: SamplingMedia[] = []
private properties: Property[] = []
private units: Unit[] = []
private measuredQuantityUnits: MeasuredQuantityUnit[] = []
@Prop({
required: true,
type: Object
})
readonly value!: DeviceProperty
/**
* a list of compartments
*/
@Prop({
default: () => [] as Compartment[],
required: false,
type: Array
})
// @ts-ignore
readonly compartments!: Compartment[]
/**
* a list of samplingMedias
*/
@Prop({
default: () => [] as SamplingMedia[],
required: false,
type: Array
})
// @ts-ignore
readonly samplingMedias!: SamplingMedia[]
/**
* a list of properties
*/
@Prop({
default: () => [] as Property[],
required: false,
type: Array
})
// @ts-ignore
readonly properties!: Property[]
/**
* a list of units
*/
@Prop({
default: () => [] as Unit[],
required: false,
type: Array
})
// @ts-ignore
readonly units!: Unit[]
/**
* a list of measuredQuantityUnits
*/
@Prop({
default: () => [] as MeasuredQuantityUnit[],
required: false,
type: Array
})
// @ts-ignore
readonly measuredQuantityUnits!: MeasuredQuantityUnit[]
mounted () {
this.$api.compartments.findAllPaginated().then((foundCompartments) => {
this.compartments = foundCompartments
}).catch(() => {
this.$store.commit('snackbar/setError', 'Loading of compartments failed')
})
this.$api.samplingMedia.findAllPaginated().then((foundSamplingMedias) => {
this.samplingMedias = foundSamplingMedias
}).catch(() => {
this.$store.commit('snackbar/setError', 'Loading of sampling medias failed')
})
this.$api.properties.findAllPaginated().then((foundProperties) => {
this.properties = foundProperties
}).catch(() => {
this.$store.commit('snackbar/setError', 'Loading of properties failed')
})
this.$api.units.findAllPaginated().then((foundUnits) => {
this.units = foundUnits
}).catch(() => {
this.$store.commit('snackbar/setError', 'Loading of units failed')
})
this.$api.measuredQuantityUnits.findAllPaginated().then((foundUnits) => {
this.measuredQuantityUnits = foundUnits
}).catch(() => {
this.$store.commit('snackbar/setError', 'Loading of measuredquantityunits failed')
})
}
get property (): DeviceProperty {
......
......@@ -57,48 +57,72 @@ export default class DeviceCustomFieldsShowPage extends Vue {
private isSaving: boolean = false
private valueCopy: DeviceProperty = new DeviceProperty()
private compartments: Compartment[] = []
private samplingMedias: SamplingMedia[] = []
private properties: Property[] = []
private units: Unit[] = []
private measuredQuantityUnits: MeasuredQuantityUnit[] = []
@Prop({
required: true,
type: Object
})
readonly value!: DeviceProperty
/**
* a list of compartments
*/
@Prop({
default: () => [] as Compartment[],
required: false,
type: Array
})
// @ts-ignore
readonly compartments!: Compartment[]
/**
* a list of samplingMedias
*/
@Prop({
default: () => [] as SamplingMedia[],
required: false,
type: Array
})
// @ts-ignore
readonly samplingMedias!: SamplingMedia[]
/**
* a list of properties
*/
@Prop({
default: () => [] as Property[],
required: false,
type: Array
})
// @ts-ignore
readonly properties!: Property[]
/**
* a list of units
*/
@Prop({
default: () => [] as Unit[],
required: false,
type: Array
})
// @ts-ignore
readonly units!: Unit[]
/**
* a list of measuredQuantityUnits
*/
@Prop({
default: () => [] as MeasuredQuantityUnit[],
required: false,
type: Array
})
// @ts-ignore
readonly measuredQuantityUnits!: MeasuredQuantityUnit[]
created () {
this.valueCopy = DeviceProperty.createFromObject(this.value)
}
mounted () {
this.$api.compartments.findAllPaginated().then((foundCompartments) => {
this.compartments = foundCompartments
}).catch(() => {
this.$store.commit('snackbar/setError', 'Loading of compartments failed')
})
this.$api.samplingMedia.findAllPaginated().then((foundSamplingMedias) => {
this.samplingMedias = foundSamplingMedias
}).catch(() => {
this.$store.commit('snackbar/setError', 'Loading of sampling medias failed')
})
this.$api.properties.findAllPaginated().then((foundProperties) => {
this.properties = foundProperties
}).catch(() => {
this.$store.commit('snackbar/setError', 'Loading of properties failed')
})
this.$api.units.findAllPaginated().then((foundUnits) => {
this.units = foundUnits
}).catch(() => {
this.$store.commit('snackbar/setError', 'Loading of units failed')
})
this.$api.measuredQuantityUnits.findAllPaginated().then((foundUnits) => {
this.measuredQuantityUnits = foundUnits
}).catch(() => {
this.$store.commit('snackbar/setError', 'Loading of measuredquantityunits failed')
});
//(this.$refs.devicePropertyForm as Vue & { focus: () => void}).focus()
}
......
......@@ -93,11 +93,6 @@ import DevicePropertyInfo from '@/components/DevicePropertyInfo.vue'
export default class DevicePropertiesShowPage extends Vue {
private isLoading = false
private isSaving = false
private compartments: Compartment[] = []
private samplingMedias: SamplingMedia[] = []
private properties: Property[] = []
private units: Unit[] = []
private measuredQuantityUnits: MeasuredQuantityUnit[] = []
/**
* a DeviceProperty
......@@ -109,32 +104,62 @@ export default class DevicePropertiesShowPage extends Vue {
// @ts-ignore
readonly value!: DeviceProperty
/**
* a list of compartments
*/
@Prop({
default: () => [] as Compartment[],
required: false,
type: Array
})
// @ts-ignore
readonly compartments!: Compartment[]
/**
* a list of samplingMedias
*/
@Prop({
default: () => [] as SamplingMedia[],
required: false,
type: Array
})
// @ts-ignore
readonly samplingMedias!: SamplingMedia[]
/**
* a list of properties
*/
@Prop({
default: () => [] as Property[],
required: false,
type: Array
})
// @ts-ignore
readonly properties!: Property[]
/**
* a list of units
*/
@Prop({
default: () => [] as Unit[],
required: false,
type: Array
})
// @ts-ignore
readonly units!: Unit[]
/**
* a list of measuredQuantityUnits
*/
@Prop({
default: () => [] as MeasuredQuantityUnit[],
required: false,
type: Array
})
// @ts-ignore
readonly measuredQuantityUnits!: MeasuredQuantityUnit[]
mounted () {
this.$api.compartments.findAllPaginated().then((foundCompartments) => {
this.compartments = foundCompartments
}).catch(() => {
this.$store.commit('snackbar/setError', 'Loading of compartments failed')
})
this.$api.samplingMedia.findAllPaginated().then((foundSamplingMedias) => {
this.samplingMedias = foundSamplingMedias
}).catch(() => {
this.$store.commit('snackbar/setError', 'Loading of sampling medias failed')
})
this.$api.properties.findAllPaginated().then((foundProperties) => {
this.properties = foundProperties
}).catch(() => {
this.$store.commit('snackbar/setError', 'Loading of properties failed')
})
this.$api.units.findAllPaginated().then((foundUnits) => {
this.units = foundUnits
}).catch(() => {
this.$store.commit('snackbar/setError', 'Loading of units failed')
})
this.$api.measuredQuantityUnits.findAllPaginated().then((foundUnits) => {
this.measuredQuantityUnits = foundUnits
}).catch(() => {
this.$store.commit('snackbar/setError', 'Loading of measuredquantityunits failed')
})
}
get isInProgress (): boolean {
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment