feat:增加设置模块

src/components/AppLoading.vue

@@ -0,0 +1,20 @@
+<template>
+  <div v-if="appStore.isLoading" id="app-loading">
+    <div class="cube-container">
+      <div class="cube cube1"></div>
+      <div class="cube cube2"></div>
+      <div class="cube cube3"></div>
+    </div>
+    <p class="loading-text">正在加载中...</p>
+  </div>
+</template>
+
+<script setup>
+import { useAppStore } from '@/store/app.ts'
+
+const appStore = useAppStore()
+</script>
+
+<style lang="scss">
+@use "@/styles/app.loading.module.scss";
+</style>

src/components/Food/FoodCard.vue

@@ -65,8 +65,9 @@
 <script setup lang="ts">
 import { Edit, MoreFilled, DeleteFilled } from '@element-plus/icons-vue'
 import { useFoodStore } from '@/store/food'
-import { defineProps, onMounted, PropType, reactive } from 'vue'
-import { IFoodRecipe, IFoodRecord } from '@/types/food.ts'
+import { defineProps, onMounted, reactive } from 'vue'
+import type { PropType } from 'vue'
+import type { IFoodRecipe, IFoodRecord } from '@/types/food.ts'
 import { useRouter } from 'vue-router'
 import { formatDate } from 'vue3-common/utils/dateUtil'
 import { deepCopyObject } from 'vue3-common/utils/dataUtil'

src/components/Food/FoodDailyItem.vue

@@ -29,7 +29,7 @@ import { useFoodStore } from '@/store/food.ts'
 import { useRouter } from 'vue-router'
 import { useAppStore } from '@/store/app.ts'
 import { formatChineseDate } from 'vue3-common/utils/dateUtil'
-import { IFoodRecord } from '@/types/food.ts'
+import type { IFoodRecord } from '@/types/food.ts'
 
 const foodStore = useFoodStore()
 const appStore = useAppStore()

src/components/Moment/MomentCard.vue

@@ -47,6 +47,18 @@
                    @click="sendCommentClick"
                    class="send-button">发送</el-button>
       </div>
+
+      <div class="moment-comment-list">
+        <div class="moment-comment-item">
+          <span class="name">Cxx：</span>
+          <span>确实很不错</span>
+        </div>
+
+        <div class="moment-comment-item">
+          <span class="name">Cxx：</span>
+          <span>确实很不错阿</span>
+        </div>
+      </div>
     </div>
   </div>
 </template>
@@ -100,6 +112,21 @@ const sendCommentClick = async () => {
       justify-items: center;
       gap: 5px;
     }
+
+    .moment-comment-list {
+      padding: 10px;
+      background-color: var(--color-comment-bg);
+
+      display: flex;
+      flex-direction: column;
+      gap: 5px;
+
+      .moment-comment-item {
+        .name {
+          font-weight: bold;
+        }
+      }
+    }
   }
 }
 </style>