feat(week recipe page ): [A] 增加刷新每日菜单功能

[A] 增加刷新每日菜单功能

Signed-off-by: Ching <loooching@gmail.com>

frontend/src/components/daily_recipe_detail.vue

@@ -97,7 +97,7 @@ export default {
     };
   },
   mounted() {
-    this.getDailyRecipy(),
+    this.getDailyRecipe(),
       axios
         .get(
           config.publicPath + '/recipe/recipe/?recipe_type=meat&page_size=500'
@@ -119,7 +119,7 @@ export default {
         .post(
           config.publicPath + '/recipe/daily-recipe/' + this.$route.params.id
         )
-        .then((response) => (response, this.getDailyRecipy()));
+        .then((response) => (response, this.getDailyRecipe()));
     },
     submitRecipe() {
       axios.put(
@@ -136,7 +136,7 @@ export default {
       console.log(this.meat, this.vegetable, this.soup);
       this.disable_submit = false;
     },
-    getDailyRecipy() {
+    getDailyRecipe() {
       axios
         .get(
           config.publicPath + '/recipe/daily-recipe/' + this.$route.params.id

frontend/src/components/recipe-mobile/week-recipe.vue

@@ -5,12 +5,13 @@
     pulling-text="下拉重新生成每周菜谱"
     loosing-text="可以松手了..."
   >
+    <div v-for:="(daily_recipe, recipe_index) in daily_recipes">
       <van-cell-group
         inset
-      v-for:="daily_recipe in daily_recipes"
         :title="formatDate(daily_recipe.date)"
         class="daily_recipes"
       >
+        <van-swipe-cell>
           <van-row>
             <van-col span="3" class="recipe_type">
               <van-grid :column-num="1">
@@ -76,36 +77,60 @@
               </van-grid>
             </van-col>
           </van-row>
+          <template #right>
+            <van-button
+              square
+              text="编辑"
+              type="primary"
+              class="action-button"
+              :to="{
+                name: 'RecipeMobileDailyRecipeDetail',
+                params: { id: daily_recipe.id },
+              }"
+            />
+            <van-button
+              square
+              text="刷新"
+              type="danger"
+              class="action-button"
+              @click="reGenerateRecipe(daily_recipe.id, recipe_index)"
+            />
+          </template>
+        </van-swipe-cell>
       </van-cell-group>
+    </div>
   </van-pull-refresh>
 </template>
 
 <script>
 import {
-  Tag,
+  Button,
   Cell,
   CellGroup,
   Col,
-  Row,
-  Button,
   Grid,
   GridItem,
   PullRefresh,
+  Row,
+  SwipeCell,
+  Tag,
 } from 'vant';
 import axios from 'axios';
 import config from '@/config/index';
+
 export default {
   name: 'RecipeMobileWeekRecipe',
   components: {
-    [CellGroup.name]: CellGroup,
+    [Button.name]: Button,
     [Cell.name]: Cell,
+    [CellGroup.name]: CellGroup,
     [Col.name]: Col,
-    [Row.name]: Row,
-    [Tag.name]: Tag,
     [Grid.name]: Grid,
     [GridItem.name]: GridItem,
-    [Button.name]: Button,
     [PullRefresh.name]: PullRefresh,
+    [Row.name]: Row,
+    [SwipeCell.name]: SwipeCell,
+    [Tag.name]: Tag,
   },
   data() {
     return {
@@ -114,9 +139,7 @@ export default {
     };
   },
   mounted() {
-    axios
-      .get(config.publicPath + '/recipe/week-recipe/')
-      .then((response) => (this.daily_recipes = response.data));
+    this.getWeekRecipe(false);
   },
   methods: {
     formatDate(date) {
@@ -128,6 +151,10 @@ export default {
       return days[date_.getDay()];
     },
     onRefresh() {
+      this.getWeekRecipe(true);
+    },
+    getWeekRecipe(regen) {
+      if (regen) {
         axios
           .post(config.publicPath + '/recipe/week-recipe/')
           .then(
@@ -135,6 +162,21 @@ export default {
               (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
+        .post(config.publicPath + '/recipe/daily-recipe/' + daily_recipe_id)
+        .then((response) =>
+          this.daily_recipes.splice(recepe_index, 1, response.data)
+        );
     },
   },
 };
@@ -153,4 +195,8 @@ export default {
 .daily_recipes:last-child {
   margin-bottom: 40px;
 }
+.action-button {
+  height: 100%;
+  width: 50%;
+}
 </style>