cgiacofei/TandoorRecipes
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

mostly working and somewhat styled mobile plan ui

Browse Source
This commit is contained in:
vabene1111 2023-02-19 15:58:39 +01:00
parent a4f0f38300
commit a6e3ab2dbe
1 changed files with 29 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
vue/src/apps/MealPlanView/MealPlanView.vue
View File

@ -77,10 +77,10 @@
<b-list-group-item> <b-list-group-item>
<div class="d-flex flex-row align-items-center"> <div class="d-flex flex-row align-items-center">
<div> <div>
<h4>{{ day.date_label }}</h4> <h5>{{ day.date_label }}</h5>
</div> </div>
<div class="flex-grow-1 text-right"> <div class="flex-grow-1 text-right">
<b-button class=""><i <b-button class="btn-sm btn-outline-primary" @click="showMealPlanEditModal(null, day.create_default_date)"><i
class="fa fa-plus"></i></b-button> class="fa fa-plus"></i></b-button>
</div> </div>
</div> </div>
@ -94,13 +94,17 @@
</div> </div>
<div class="flex-grow-1 ml-2" <div class="flex-grow-1 ml-2"
style="text-overflow: ellipsis; overflow-wrap: anywhere;"> style="text-overflow: ellipsis; overflow-wrap: anywhere;">
<span class="two-row-text"><a <span class="two-row-text">
:href="resolveDjangoUrl('view_recipe', plan.recipe.id)">{{ <a :href="resolveDjangoUrl('view_recipe', plan.recipe.id)">{{ plan.recipe.name }}</a>
plan.recipe.name </span><br/>
}}</a></span> <small class="text-muted">{{ plan.meal_type_name }} -
<span v-if="plan.recipe">
<i class="fa fa-clock"></i> {{ plan.recipe.working_time + plan.recipe.waiting_time}} {{ $t('min')}}
</span>
</small>
</div> </div>
<div class="hover-button"> <div class="hover-button">
<b-button><i class="fas fa-pencil-alt"></i></b-button> <b-button class="btn-sm btn-outline-primary" @click="showMealPlanEditModal(plan,null)"><i class="fas fa-pencil-alt"></i></b-button>
</div> </div>
</div> </div>
</b-list-group-item> </b-list-group-item>
@ -267,7 +271,7 @@
<meal-plan-edit-modal <meal-plan-edit-modal
:entry="entryEditing" :entry="entryEditing"
:modal_title="modal_title" :modal_title="modal_title"
:create_date="edit_modal_default_date" :create_date="mealplan_default_date"
@reload-meal-types="refreshMealTypes" @reload-meal-types="refreshMealTypes"
></meal-plan-edit-modal> ></meal-plan-edit-modal>
@ -364,7 +368,7 @@ export default {
shopping_list: [], shopping_list: [],
current_period: null, current_period: null,
entryEditing: null, entryEditing: null,
edit_modal_default_date: null, mealplan_default_date: null,
ical_url: window.ICAL_URL, ical_url: window.ICAL_URL,
} }
}, },
@ -538,7 +542,7 @@ export default {
this.showDate = d this.showDate = d
}, },
createEntryClick(data) { createEntryClick(data) {
this.edit_modal_default_date = moment(data).format("YYYY-MM-DD") this.mealplan_default_date = moment(data).format("YYYY-MM-DD")
this.entryEditing = null this.entryEditing = null
this.$nextTick(function () { this.$nextTick(function () {
this.$bvModal.show(`id_meal_plan_edit_modal`) this.$bvModal.show(`id_meal_plan_edit_modal`)
@ -633,6 +637,15 @@ export default {
entry: plan_entry, entry: plan_entry,
} }
}, },
showMealPlanEditModal: function (entry, date) {
this.mealplan_default_date = date
this.entryEditing = entry
this.$nextTick(function () {
this.$bvModal.show(`id_meal_plan_edit_modal`)
})
}
}, },
directives: { directives: {
hover: { hover: {