feat(week recipe page ): [A] 增加刷新每日菜单功能
[A] 增加刷新每日菜单功能 Signed-off-by: Ching <loooching@gmail.com>
This commit is contained in:
parent
e308553490
commit
d7a786f431
@ -97,7 +97,7 @@ export default {
|
|||||||
};
|
};
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.getDailyRecipy(),
|
this.getDailyRecipe(),
|
||||||
axios
|
axios
|
||||||
.get(
|
.get(
|
||||||
config.publicPath + '/recipe/recipe/?recipe_type=meat&page_size=500'
|
config.publicPath + '/recipe/recipe/?recipe_type=meat&page_size=500'
|
||||||
@ -119,7 +119,7 @@ export default {
|
|||||||
.post(
|
.post(
|
||||||
config.publicPath + '/recipe/daily-recipe/' + this.$route.params.id
|
config.publicPath + '/recipe/daily-recipe/' + this.$route.params.id
|
||||||
)
|
)
|
||||||
.then((response) => (response, this.getDailyRecipy()));
|
.then((response) => (response, this.getDailyRecipe()));
|
||||||
},
|
},
|
||||||
submitRecipe() {
|
submitRecipe() {
|
||||||
axios.put(
|
axios.put(
|
||||||
@ -136,7 +136,7 @@ export default {
|
|||||||
console.log(this.meat, this.vegetable, this.soup);
|
console.log(this.meat, this.vegetable, this.soup);
|
||||||
this.disable_submit = false;
|
this.disable_submit = false;
|
||||||
},
|
},
|
||||||
getDailyRecipy() {
|
getDailyRecipe() {
|
||||||
axios
|
axios
|
||||||
.get(
|
.get(
|
||||||
config.publicPath + '/recipe/daily-recipe/' + this.$route.params.id
|
config.publicPath + '/recipe/daily-recipe/' + this.$route.params.id
|
||||||
|
|||||||
@ -5,107 +5,132 @@
|
|||||||
pulling-text="下拉重新生成每周菜谱"
|
pulling-text="下拉重新生成每周菜谱"
|
||||||
loosing-text="可以松手了..."
|
loosing-text="可以松手了..."
|
||||||
>
|
>
|
||||||
<van-cell-group
|
<div v-for:="(daily_recipe, recipe_index) in daily_recipes">
|
||||||
inset
|
<van-cell-group
|
||||||
v-for:="daily_recipe in daily_recipes"
|
inset
|
||||||
:title="formatDate(daily_recipe.date)"
|
:title="formatDate(daily_recipe.date)"
|
||||||
class="daily_recipes"
|
class="daily_recipes"
|
||||||
>
|
>
|
||||||
<van-row>
|
<van-swipe-cell>
|
||||||
<van-col span="3" class="recipe_type">
|
<van-row>
|
||||||
<van-grid :column-num="1">
|
<van-col span="3" class="recipe_type">
|
||||||
<van-grid-item text="肉" class="recipe_type"></van-grid-item>
|
<van-grid :column-num="1">
|
||||||
</van-grid>
|
<van-grid-item text="肉" class="recipe_type"></van-grid-item>
|
||||||
</van-col>
|
</van-grid>
|
||||||
<van-col span="21">
|
</van-col>
|
||||||
<van-grid :column-num="3" clickable>
|
<van-col span="21">
|
||||||
<van-grid-item
|
<van-grid :column-num="3" clickable>
|
||||||
v-for:="recipe in daily_recipe.meat"
|
<van-grid-item
|
||||||
:text="recipe.name"
|
v-for:="recipe in daily_recipe.meat"
|
||||||
|
:text="recipe.name"
|
||||||
|
:to="{
|
||||||
|
name: 'RecipeMobileRecipeDetail',
|
||||||
|
params: { id: recipe.id },
|
||||||
|
}"
|
||||||
|
/>
|
||||||
|
<van-grid-item
|
||||||
|
v-for="value in 3 - (daily_recipe.meat.length % 3)"
|
||||||
|
:key="value"
|
||||||
|
/>
|
||||||
|
</van-grid>
|
||||||
|
</van-col>
|
||||||
|
</van-row>
|
||||||
|
<van-row>
|
||||||
|
<van-col span="3">
|
||||||
|
<van-grid :column-num="1">
|
||||||
|
<van-grid-item text="菜" class="recipe_type"></van-grid-item>
|
||||||
|
</van-grid>
|
||||||
|
</van-col>
|
||||||
|
<van-col span="21">
|
||||||
|
<van-grid :column-num="3" clickable>
|
||||||
|
<van-grid-item
|
||||||
|
v-for:="recipe in daily_recipe.vegetable"
|
||||||
|
:text="recipe.name"
|
||||||
|
:to="{
|
||||||
|
name: 'RecipeMobileRecipeDetail',
|
||||||
|
params: { id: recipe.id },
|
||||||
|
}"
|
||||||
|
/>
|
||||||
|
<van-grid-item
|
||||||
|
v-for="value in 3 - (daily_recipe.vegetable.length % 3)"
|
||||||
|
:key="value"
|
||||||
|
/>
|
||||||
|
</van-grid>
|
||||||
|
</van-col>
|
||||||
|
</van-row>
|
||||||
|
<van-row v-if="daily_recipe.soup.length > 0">
|
||||||
|
<van-col span="3">
|
||||||
|
<van-grid :column-num="1">
|
||||||
|
<van-grid-item text="汤" class="recipe_type"></van-grid-item>
|
||||||
|
</van-grid>
|
||||||
|
</van-col>
|
||||||
|
<van-col span="21">
|
||||||
|
<van-grid :column-num="1" clickable>
|
||||||
|
<van-grid-item
|
||||||
|
v-for:="recipe in daily_recipe.soup"
|
||||||
|
:text="recipe.name"
|
||||||
|
:to="{
|
||||||
|
name: 'RecipeMobileRecipeDetail',
|
||||||
|
params: { id: recipe.id },
|
||||||
|
}"
|
||||||
|
/>
|
||||||
|
</van-grid>
|
||||||
|
</van-col>
|
||||||
|
</van-row>
|
||||||
|
<template #right>
|
||||||
|
<van-button
|
||||||
|
square
|
||||||
|
text="编辑"
|
||||||
|
type="primary"
|
||||||
|
class="action-button"
|
||||||
:to="{
|
:to="{
|
||||||
name: 'RecipeMobileRecipeDetail',
|
name: 'RecipeMobileDailyRecipeDetail',
|
||||||
params: { id: recipe.id },
|
params: { id: daily_recipe.id },
|
||||||
}"
|
}"
|
||||||
/>
|
/>
|
||||||
<van-grid-item
|
<van-button
|
||||||
v-for="value in 3 - (daily_recipe.meat.length % 3)"
|
square
|
||||||
:key="value"
|
text="刷新"
|
||||||
|
type="danger"
|
||||||
|
class="action-button"
|
||||||
|
@click="reGenerateRecipe(daily_recipe.id, recipe_index)"
|
||||||
/>
|
/>
|
||||||
</van-grid>
|
</template>
|
||||||
</van-col>
|
</van-swipe-cell>
|
||||||
</van-row>
|
</van-cell-group>
|
||||||
<van-row>
|
</div>
|
||||||
<van-col span="3">
|
|
||||||
<van-grid :column-num="1">
|
|
||||||
<van-grid-item text="菜" class="recipe_type"></van-grid-item>
|
|
||||||
</van-grid>
|
|
||||||
</van-col>
|
|
||||||
<van-col span="21">
|
|
||||||
<van-grid :column-num="3" clickable>
|
|
||||||
<van-grid-item
|
|
||||||
v-for:="recipe in daily_recipe.vegetable"
|
|
||||||
:text="recipe.name"
|
|
||||||
:to="{
|
|
||||||
name: 'RecipeMobileRecipeDetail',
|
|
||||||
params: { id: recipe.id },
|
|
||||||
}"
|
|
||||||
/>
|
|
||||||
<van-grid-item
|
|
||||||
v-for="value in 3 - (daily_recipe.vegetable.length % 3)"
|
|
||||||
:key="value"
|
|
||||||
/>
|
|
||||||
</van-grid>
|
|
||||||
</van-col>
|
|
||||||
</van-row>
|
|
||||||
<van-row v-if="daily_recipe.soup.length > 0">
|
|
||||||
<van-col span="3">
|
|
||||||
<van-grid :column-num="1">
|
|
||||||
<van-grid-item text="汤" class="recipe_type"></van-grid-item>
|
|
||||||
</van-grid>
|
|
||||||
</van-col>
|
|
||||||
<van-col span="21">
|
|
||||||
<van-grid :column-num="1" clickable>
|
|
||||||
<van-grid-item
|
|
||||||
v-for:="recipe in daily_recipe.soup"
|
|
||||||
:text="recipe.name"
|
|
||||||
:to="{
|
|
||||||
name: 'RecipeMobileRecipeDetail',
|
|
||||||
params: { id: recipe.id },
|
|
||||||
}"
|
|
||||||
/>
|
|
||||||
</van-grid>
|
|
||||||
</van-col>
|
|
||||||
</van-row>
|
|
||||||
</van-cell-group>
|
|
||||||
</van-pull-refresh>
|
</van-pull-refresh>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import {
|
import {
|
||||||
Tag,
|
Button,
|
||||||
Cell,
|
Cell,
|
||||||
CellGroup,
|
CellGroup,
|
||||||
Col,
|
Col,
|
||||||
Row,
|
|
||||||
Button,
|
|
||||||
Grid,
|
Grid,
|
||||||
GridItem,
|
GridItem,
|
||||||
PullRefresh,
|
PullRefresh,
|
||||||
|
Row,
|
||||||
|
SwipeCell,
|
||||||
|
Tag,
|
||||||
} from 'vant';
|
} from 'vant';
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
import config from '@/config/index';
|
import config from '@/config/index';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'RecipeMobileWeekRecipe',
|
name: 'RecipeMobileWeekRecipe',
|
||||||
components: {
|
components: {
|
||||||
[CellGroup.name]: CellGroup,
|
[Button.name]: Button,
|
||||||
[Cell.name]: Cell,
|
[Cell.name]: Cell,
|
||||||
|
[CellGroup.name]: CellGroup,
|
||||||
[Col.name]: Col,
|
[Col.name]: Col,
|
||||||
[Row.name]: Row,
|
|
||||||
[Tag.name]: Tag,
|
|
||||||
[Grid.name]: Grid,
|
[Grid.name]: Grid,
|
||||||
[GridItem.name]: GridItem,
|
[GridItem.name]: GridItem,
|
||||||
[Button.name]: Button,
|
|
||||||
[PullRefresh.name]: PullRefresh,
|
[PullRefresh.name]: PullRefresh,
|
||||||
|
[Row.name]: Row,
|
||||||
|
[SwipeCell.name]: SwipeCell,
|
||||||
|
[Tag.name]: Tag,
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
@ -114,9 +139,7 @@ export default {
|
|||||||
};
|
};
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
axios
|
this.getWeekRecipe(false);
|
||||||
.get(config.publicPath + '/recipe/week-recipe/')
|
|
||||||
.then((response) => (this.daily_recipes = response.data));
|
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
formatDate(date) {
|
formatDate(date) {
|
||||||
@ -128,12 +151,31 @@ export default {
|
|||||||
return days[date_.getDay()];
|
return days[date_.getDay()];
|
||||||
},
|
},
|
||||||
onRefresh() {
|
onRefresh() {
|
||||||
|
this.getWeekRecipe(true);
|
||||||
|
},
|
||||||
|
getWeekRecipe(regen) {
|
||||||
|
if (regen) {
|
||||||
|
axios
|
||||||
|
.post(config.publicPath + '/recipe/week-recipe/')
|
||||||
|
.then(
|
||||||
|
(response) => (
|
||||||
|
(this.daily_recipes = response.data), (this.loading = false)
|
||||||
|
)
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
axios
|
||||||
|
.get(config.publicPath + '/recipe/week-recipe/')
|
||||||
|
.then(
|
||||||
|
(response) => (this.daily_recipes = response.data),
|
||||||
|
(this.loading = false)
|
||||||
|
);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
reGenerateRecipe(daily_recipe_id, recepe_index) {
|
||||||
axios
|
axios
|
||||||
.post(config.publicPath + '/recipe/week-recipe/')
|
.post(config.publicPath + '/recipe/daily-recipe/' + daily_recipe_id)
|
||||||
.then(
|
.then((response) =>
|
||||||
(response) => (
|
this.daily_recipes.splice(recepe_index, 1, response.data)
|
||||||
(this.daily_recipes = response.data), (this.loading = false)
|
|
||||||
)
|
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
@ -153,4 +195,8 @@ export default {
|
|||||||
.daily_recipes:last-child {
|
.daily_recipes:last-child {
|
||||||
margin-bottom: 40px;
|
margin-bottom: 40px;
|
||||||
}
|
}
|
||||||
|
.action-button {
|
||||||
|
height: 100%;
|
||||||
|
width: 50%;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user