Skip to content

Commit 2450f39

Browse files
HectruendoHectruendo
committed
More refactoring
1 parent ee68c39 commit 2450f39

4 files changed

Lines changed: 31 additions & 25 deletions

File tree

‎admin/components/generic/Card.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<div class="card-header-title">{{ createTitle(item) }}</div>
55
</template>
66
<div v-for="(name, prop) in cardProps" class="property">
7-
<span class="title">{{ name }}:</span>{{ solveRefPropValue(item, prop, schema) }}
7+
<span class="title">{{ name }}:</span>{{ solveRefPropValue(item, prop, itemSchema) }}
88
</div>
99
<div class="divider">
1010
</div>
@@ -53,7 +53,7 @@ const props = defineProps({
5353
type: Object,
5454
required: false,
5555
},
56-
schema: {
56+
itemSchema: {
5757
type: Object,
5858
required: true,
5959
},

‎admin/components/generic/ReadView.vue‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@
3030
</div>
3131
<div class="cards-view" v-if="!itemsStore.tableMode && cardProps && requiredFilterSatisfied">
3232
<div v-for="item in itemsStore.items[apiUrl]?.results" class="card-wrapper">
33-
<Card :item="item" :cardProps="cardProps" :schema="schema" :titleProps="titleProps" :apiUrl="apiUrl">
33+
<Card :item="item" :cardProps="cardProps" :titleProps="titleProps" :apiUrl="apiUrl" :itemSchema="itemSchema">
3434
<template v-slot:extra-card-bottom="{item}">
3535
<slot name="extra-card-bottom" :item="item"></slot>
3636
</template>
@@ -58,7 +58,7 @@
5858
v-for="(propInfo, prop) in tableProps"
5959
:prop="prop"
6060
:label="propInfo.name"
61-
:formatter="(row, column) => propInfo.formatter ? propInfo.formatter(row, column.property) : solveRefPropValue(row, column.property, schema)"
61+
:formatter="(row, column) => propInfo.formatter ? propInfo.formatter(row, column.property) : solveRefPropValue(row, column.property, itemSchema)"
6262
:width="propInfo.width ? propInfo.width : undefined"
6363
:align="propInfo.align ? propInfo.align : undefined"
6464
:sortable="propInfo.sortable"
@@ -116,13 +116,15 @@ import Filters from "~/components/generic/filters/Filters.vue";
116116
import Card from "~/components/generic/Card.vue";
117117
import {useI18n} from "vue-i18n";
118118
import {solveRefPropValue, deleteItem} from "~/utils/index.js";
119+
import {storeToRefs} from 'pinia'
119120
120121
const { t } = useI18n();
121122
const itemsStore = useItemsStore()
122123
const {$axios} = useNuxtApp();
123124
const deleting = ref(undefined)
124125
const deleteDialogVisible = ref(false)
125-
const schema = ref({})
126+
const {schema} = storeToRefs(itemsStore)
127+
const itemSchema = ref({})
126128
const route = useRoute()
127129
128130
const props = defineProps({
@@ -195,7 +197,7 @@ function initStoreWatchers() {
195197
196198
async function initData() {
197199
itemsStore.loading = true
198-
schema.value = await itemsStore.getSchemaDef($axios, props.apiUrl)
200+
itemSchema.value = await itemsStore.getSchemaDef($axios, props.apiUrl)
199201
sortChange(props.defaultSort)
200202
await loadItems()
201203
initStoreWatchers()

‎admin/components/generic/WriteView.vue‎

Lines changed: 14 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -18,11 +18,11 @@
1818
>
1919
<div v-if="!Object.keys(sections).length" class="form-section">
2020
<div class="edit-title">{{ createTitle(form) }}</div>
21-
<div v-for="(fieldInfo, fieldName) in filterInSection(true, schema.properties)">
21+
<div v-for="(fieldInfo, fieldName) in filterInSection(true, itemSchema.properties)">
2222
<FormField
2323
v-if="allExcludeFields.indexOf(fieldName) === -1 && !props.readOnly && !fieldInfo.readOnly"
2424
:fieldName="fieldName"
25-
:schema="schema"
25+
:schema="itemSchema"
2626
:form="form"
2727
:formServerErrors="formServerErrors"
2828
:ref="el => fieldsRef[fieldName] = el"
@@ -34,7 +34,7 @@
3434
<ReadOnlyField
3535
v-else-if="allExcludeFields.indexOf(fieldName) === -1 && (props.readOnly || fieldInfo.readOnly)"
3636
:fieldName="fieldName"
37-
:schema="schema"
37+
:schema="itemSchema"
3838
:value="form[fieldName]"
3939
>
4040
<template v-for="(_, name) in $slots" v-slot:[name]="data">
@@ -49,7 +49,7 @@
4949
<FormField
5050
v-if="allExcludeFields.indexOf(fieldName) === -1 && !props.readOnly"
5151
:fieldName="fieldName"
52-
:schema="schema"
52+
:schema="itemSchema"
5353
:form="form"
5454
:formServerErrors="formServerErrors"
5555
:ref="el => fieldsRef[fieldName] = el"
@@ -60,7 +60,7 @@
6060
</FormField>
6161
<ReadOnlyField v-else-if="allExcludeFields.indexOf(fieldName) === -1 && props.readOnly"
6262
:fieldName="fieldName"
63-
:schema="schema"
63+
:schema="itemSchema"
6464
:value="form[fieldName]"
6565
>
6666
<template v-for="(_, name) in $slots" v-slot:[name]="data">
@@ -69,11 +69,11 @@
6969
</ReadOnlyField>
7070
</div>
7171
</div>
72-
<div v-for="(_, fieldName) in filterInSection(false, schema.properties)">
72+
<div v-for="(_, fieldName) in filterInSection(false, itemSchema.properties)">
7373
<FormField
7474
v-if="allExcludeFields.indexOf(fieldName) === -1 && !props.readOnly"
7575
:fieldName="fieldName"
76-
:schema="schema"
76+
:schema="itemSchema"
7777
:form="form"
7878
:formServerErrors="formServerErrors"
7979
:noLabel="true"
@@ -85,7 +85,7 @@
8585
</FormField>
8686
<ReadOnlyField v-else-if="allExcludeFields.indexOf(fieldName) === -1 && props.readOnly"
8787
:fieldName="fieldName"
88-
:schema="schema"
88+
:schema="itemSchema"
8989
:value="form[fieldName]"
9090
>
9191
<template v-for="(_, name) in $slots" v-slot:[name]="data">
@@ -133,18 +133,20 @@ import ReadOnlyField from "~/components/generic/ReadOnlyField.vue";
133133
import BackButton from "~/components/generic/BackButton.vue";
134134
import {ElNotification} from 'element-plus'
135135
import {useI18n} from "vue-i18n";
136+
import {storeToRefs} from "pinia";
136137
137138
const {t} = useI18n();
138139
const {$axios} = useNuxtApp();
139140
const itemsStore = useItemsStore()
140141
const router = useRouter()
141-
const schema = ref({})
142142
const deleteDialogVisible = ref(false)
143143
const form = ref({})
144144
const formServerErrors = ref({})
145145
const formRules = ref({})
146146
const formRef = ref()
147147
const fieldsRef = ref({})
148+
const {schema} = storeToRefs(itemsStore)
149+
const itemSchema = ref({})
148150
149151
const emit = defineEmits(['submitFormStart', 'submitFormEnd'])
150152
defineExpose({submitForm, form})
@@ -242,20 +244,20 @@ const allExcludeFields = computed(() => {
242244
})
243245
async function initData() {
244246
itemsStore.loading = true
245-
schema.value = await itemsStore.getSchemaDef($axios, props.apiUrl)
247+
itemSchema.value = await itemsStore.getSchemaDef($axios, props.apiUrl)
246248
itemsStore.loading = false
247249
}
248250
249251
await initData()
250252
251253
252254
// Initialize form
253-
for (const [fieldName, fieldInfo] of Object.entries(schema.value.properties)) {
255+
for (const [fieldName, fieldInfo] of Object.entries(itemSchema.value.properties)) {
254256
if (allExcludeFields.value.indexOf(fieldName) === -1) {
255257
form.value[fieldName] = undefined
256258
formServerErrors.value[fieldName] = undefined
257259
formRules.value[fieldName] = []
258-
if (schema.value.required.indexOf(fieldName) !== -1) {
260+
if (itemSchema.value.required.indexOf(fieldName) !== -1) {
259261
formRules.value[fieldName].push({required: true, message: `Please enter ${fieldName}`, trigger: 'blur'})
260262
}
261263
}

‎admin/utils/index.js‎

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -41,17 +41,19 @@ export function formatDate(date) {
4141
return `${day}/${month}/${year} ${hour}:${minutes}`;
4242
}
4343

44-
export function solveRefPropValue(item, propName, schema) {
45-
const prop = schema.properties[propName]
44+
export function solveRefPropValue(item, propName, itemSchema) {
45+
if (!itemSchema)
46+
return
47+
const prop = itemSchema.properties[propName]
4648
if (!prop)
4749
return item[propName]
48-
if (prop.$ref && schema.properties[propName].choices) {
49-
// schema.choices has the values for the $ref: [{label: "label", value: "value"}, {...}] item[propName] has the value, we want the label
50+
if (prop.$ref && itemSchema.properties[propName].choices) {
51+
// itemSchema.choices has the values for the $ref: [{label: "label", value: "value"}, {...}] item[propName] has the value, we want the label
5052
let choice
51-
if (schema.properties[propName].choices.results)
52-
choice = schema.properties[propName].choices.results.find(choice => choice.value === item[propName])
53+
if (itemSchema.properties[propName].choices.results)
54+
choice = itemSchema.properties[propName].choices.results.find(choice => choice.value === item[propName])
5355
else
54-
choice = schema.properties[propName].choices.find(choice => choice.value === item[propName])
56+
choice = itemSchema.properties[propName].choices.find(choice => choice.value === item[propName])
5557
if (choice) {
5658
return choice.label
5759
}

0 commit comments

Comments
 (0)