refactor/code-cleanup

This commit is contained in:
hay-kot 2021-04-21 14:49:29 -08:00
commit 0c6827d5a9
3 changed files with 39 additions and 63 deletions

View file

@ -119,10 +119,10 @@
<v-card-text> <v-card-text>
<h2 class="mt-1 mb-4">{{ $t("settings.locale-settings") }}</h2> <h2 class="mt-1 mb-4">{{ $t("settings.locale-settings") }}</h2>
<v-row> <v-row>
<v-col cols="3"> <v-col cols="12" md="3" sm="12">
<LanguageSelector @select-lang="writeLang" :site-settings="true" /> <LanguageSelector @select-lang="writeLang" :site-settings="true" />
</v-col> </v-col>
<v-col sm="3"> <v-col cols="12" md="3" sm="12">
<v-select <v-select
dense dense
prepend-icon="mdi-calendar-week-begin" prepend-icon="mdi-calendar-week-begin"

View file

@ -33,7 +33,7 @@
class="my-3" class="my-3"
:label="$t('recipe.recipe-name')" :label="$t('recipe.recipe-name')"
v-model="value.name" v-model="value.name"
:rules="[rules.required]" :rules="[existsRule]"
> >
</v-text-field> </v-text-field>
<v-textarea <v-textarea
@ -94,7 +94,7 @@
class="mr-n1" class="mr-n1"
slot="prepend" slot="prepend"
color="error" color="error"
@click="removeIngredient(index)" @click="removeByIndex(value.recipeIngredient, index)"
> >
mdi-delete mdi-delete
</v-icon> </v-icon>
@ -107,7 +107,7 @@
<v-btn color="secondary" fab dark small @click="addIngredient"> <v-btn color="secondary" fab dark small @click="addIngredient">
<v-icon>mdi-plus</v-icon> <v-icon>mdi-plus</v-icon>
</v-btn> </v-btn>
<BulkAdd @bulk-data="appendIngredients" /> <BulkAdd @bulk-data="addIngredient" />
<h2 class="mt-6">{{ $t("recipe.categories") }}</h2> <h2 class="mt-6">{{ $t("recipe.categories") }}</h2>
<CategoryTagSelector <CategoryTagSelector
@ -140,7 +140,7 @@
color="white" color="white"
class="mr-2" class="mr-2"
elevation="0" elevation="0"
@click="removeNote(index)" @click="removeByIndex(value.notes, index)"
> >
<v-icon color="error">mdi-delete</v-icon> <v-icon color="error">mdi-delete</v-icon>
</v-btn> </v-btn>
@ -183,7 +183,7 @@
color="white" color="white"
class="mr-2" class="mr-2"
elevation="0" elevation="0"
@click="removeStep(index)" @click="removeByIndex(value.recipeInstructions, index)"
> >
<v-icon size="24" color="error">mdi-delete</v-icon> <v-icon size="24" color="error">mdi-delete</v-icon>
</v-btn> </v-btn>
@ -218,6 +218,7 @@
</template> </template>
<script> <script>
const UPLOAD_EVENT = "upload";
import draggable from "vuedraggable"; import draggable from "vuedraggable";
import utils from "@/utils"; import utils from "@/utils";
import BulkAdd from "./BulkAdd"; import BulkAdd from "./BulkAdd";
@ -225,6 +226,7 @@ import ExtrasEditor from "./ExtrasEditor";
import CategoryTagSelector from "@/components/FormHelpers/CategoryTagSelector"; import CategoryTagSelector from "@/components/FormHelpers/CategoryTagSelector";
import NutritionEditor from "./NutritionEditor"; import NutritionEditor from "./NutritionEditor";
import ImageUploadBtn from "./ImageUploadBtn.vue"; import ImageUploadBtn from "./ImageUploadBtn.vue";
import { validators } from "@/mixins/validators";
export default { export default {
components: { components: {
BulkAdd, BulkAdd,
@ -237,26 +239,20 @@ export default {
props: { props: {
value: Object, value: Object,
}, },
mixins: [validators],
data() { data() {
return { return {
drag: false, drag: false,
fileObject: null, fileObject: null,
rules: {
required: v => !!v || this.$i18n.t("recipe.key-name-required"),
whiteSpace: v =>
!v ||
v.split(" ").length <= 1 ||
this.$i18n.t("recipe.no-white-space-allowed"),
},
}; };
}, },
methods: { methods: {
uploadImage(fileObject) { uploadImage(fileObject) {
this.$emit("upload", fileObject); this.$emit(UPLOAD_EVENT, fileObject);
}, },
toggleDisabled(stepIndex) { toggleDisabled(stepIndex) {
if (this.disabledSteps.includes(stepIndex)) { if (this.disabledSteps.includes(stepIndex)) {
let index = this.disabledSteps.indexOf(stepIndex); const index = this.disabledSteps.indexOf(stepIndex);
if (index !== -1) { if (index !== -1) {
this.disabledSteps.splice(index, 1); this.disabledSteps.splice(index, 1);
} }
@ -265,66 +261,40 @@ export default {
} }
}, },
isDisabled(stepIndex) { isDisabled(stepIndex) {
if (this.disabledSteps.includes(stepIndex)) { return this.disabledSteps.includes(stepIndex) ? "disabled-card" : null;
return "disabled-card";
} else {
return;
}
}, },
generateKey(item, index) { generateKey(item, index) {
return utils.generateUniqueKey(item, index); return utils.generateUniqueKey(item, index);
}, },
addIngredient(ingredients = null) {
appendIngredients(ingredients) { if (ingredients) {
this.value.recipeIngredient.push(...ingredients); this.value.recipeIngredient.push(...ingredients);
}, } else {
addIngredient() { this.value.recipeIngredient.push("");
let list = this.value.recipeIngredient; }
list.push("");
},
removeIngredient(index) {
this.value.recipeIngredient.splice(index, 1);
}, },
appendSteps(steps) { appendSteps(steps) {
let processSteps = []; this.value.recipeInstructions.push(
steps.forEach(element => { ...steps.map(x => ({
processSteps.push({ text: element }); text: x,
}); }))
);
this.value.recipeInstructions.push(...processSteps);
}, },
addStep() { addStep() {
let list = this.value.recipeInstructions; this.value.recipeInstructions.push({ text: "" });
list.push({ text: "" });
}, },
removeStep(index) {
this.value.recipeInstructions.splice(index, 1);
},
addNote() { addNote() {
let list = this.value.notes; this.value.notes.push({ text: "" });
list.push({ text: "" });
},
removeNote(index) {
this.value.notes.splice(index, 1);
},
removeCategory(index) {
this.value.recipeCategory.splice(index, 1);
},
removeTags(index) {
this.value.tags.splice(index, 1);
}, },
saveExtras(extras) { saveExtras(extras) {
this.value.extras = extras; this.value.extras = extras;
}, },
removeByIndex(list, index) {
list.splice(index, 1);
},
validateRecipe() { validateRecipe() {
if (this.$refs.form.validate()) { return this.$refs.form.validate();
return true;
} else {
return false;
}
}, },
}, },
}; };

View file

@ -4,12 +4,18 @@ export const validators = {
emailRule: v => emailRule: v =>
!v || !v ||
/^[^@\s]+@[^@\s.]+.[^@.\s]+$/.test(v) || /^[^@\s]+@[^@\s.]+.[^@.\s]+$/.test(v) ||
this.$t('user.e-mail-must-be-valid'), this.$t("user.e-mail-must-be-valid"),
existsRule: value => !!value || this.$t('general.field-required'), existsRule: value => !!value || this.$t("general.field-required"),
minRule: v => minRule: v =>
v.length >= 8 || this.$t('user.use-8-characters-or-more-for-your-password'), v.length >= 8 ||
this.$t("user.use-8-characters-or-more-for-your-password"),
whiteSpace: v =>
!v ||
v.split(" ").length <= 1 ||
this.$t("recipe.no-white-space-allowed"),
}; };
}, },
}; };