🎨 优化home页面和纪念日页面

src/pages.json

@@ -131,7 +131,7 @@
         "selectedIconPath": "./static/images/home-active.png"
       },
       {
-        "pagePath": "pages/recipe/recipe",
+        "pagePath": "pages/order/order",
         "text": "菜谱",
         "iconPath": "./static/images/recipe.png",
         "selectedIconPath": "./static/images/recipe-active.png"

src/pages/anniversary/anniversary.vue

@@ -73,7 +73,7 @@
     </view>
 
     <!-- 悬浮新增按钮 -->
-    <view class="floating-add-btn" @click="showAddDialog">
+    <view class="floating-add-btn" v-if="!showDialog" @click="showAddDialog">
       <uni-icons type="plus" size="32" color="#fff"></uni-icons>
     </view>
 
@@ -97,18 +97,30 @@
             ></uni-easyinput>
           </view>
 
+          <view class="form-item">
+            <text class="form-label">纪念日类型</text>
+            <view class="type-group">
+              <view class="type-item" :class="{active: formData.type === 1}" @click="formData.type = 1">恋爱纪念日</view>
+              <view class="type-item" :class="{active: formData.type === 2}" @click="formData.type = 2">生日</view>
+              <view class="type-item" :class="{active: formData.type === 3}" @click="formData.type = 3">其他</view>
+            </view>
+          </view>
+
           <view class="form-item">
             <text class="form-label">纪念日期</text>
-            <uni-datetime-picker
+            <view class="date-input" @click="openCalendar">
-              v-model="formData.date"
+              <text class="date-text">{{ formData.date || '请选择日期' }}</text>
-              type="date"
+              <uni-icons type="calendar" size="20" color="#666"></uni-icons>
-              :clear-icon="false"
+            </view>
-              @change="onDateChange"
+            <uni-calendar
-            ></uni-datetime-picker>
+              ref="calendarRef"
-            <!-- 调试信息 -->
+              :insert="false"
-            <text class="debug-info">当前日期值: {{ formData.date }}</text>
+              :lunar="true"
-            <!-- 测试按钮 -->
+              :start-date="'1900-01-01'"
-            <view class="test-date-btn" @click="testSetDate">测试设置日期</view>
+              :end-date="'2100-12-31'"
+              :date="formData.date"
+              @confirm="onCalendarConfirm"
+            ></uni-calendar>
           </view>
         </view>
 
@@ -131,11 +143,13 @@ const anniversaryList = ref([])
 const showDialog = ref(false)
 const isEdit = ref(false)
 const popup = ref(null)
+const calendarRef = ref(null)
 const formData = ref({
   id: null,
   user_id: null,
   lover_id: null,
   title: '',
+  type: 3,
   date: ''
 })
 
@@ -195,11 +209,13 @@ const showAddDialog = () => {
     user_id: 1, // 这里应该从用户信息中获取
     lover_id: 2, // 这里应该从情侣信息中获取
     title: '',
+    type: 3,
     date: currentDate // 默认设置为当前日期
   }
 
   showDialog.value = true
   popup.value.open()
+  // 悬浮按钮由 v-show 受 showDialog 控制自动隐藏
   console.log('显示弹窗状态:', showDialog.value)
   console.log('设置的默认日期:', currentDate)
 }
@@ -212,6 +228,7 @@ const editAnniversary = (item) => {
     user_id: item.user_id,
     lover_id: item.lover_id,
     title: item.title,
+    type: Number(item.type) || 3,
     date: item.date
   }
 
@@ -360,13 +377,18 @@ const getCountdownClass = (item) => {
 }
 
 const goBack = () => {
-  uni.navigateBack()
+  const pages = getCurrentPages()
+  if (pages.length > 1) {
+    uni.navigateBack()
+  } else {
+    uni.switchTab({ url: '/pages/home/home' })
+  }
 }
 
-const testSetDate = () => {
+const openCalendar = () => {
-  console.log('手动设置日期为 2023-10-27')
+  if (calendarRef.value && calendarRef.value.open) {
-  formData.value.date = '2023-10-27'
+    calendarRef.value.open()
-  console.log('设置后的日期:', formData.value.date)
+  }
 }
 
 const getCurrentDate = () => {
@@ -379,9 +401,8 @@ const getCurrentDate = () => {
   return currentDate
 }
 
-const onDateChange = (e) => {
+const onCalendarConfirm = (e) => {
-  console.log('日期选择器已选择:', e.value)
+  formData.value.date = e.fulldate || e.value || ''
-  formData.value.date = e.value
 }
 </script>
 
@@ -668,13 +689,46 @@ const onDateChange = (e) => {
         font-weight: bold;
       }
 
-      .form-input {
+              .form-input {
-        background: #f8f8f8;
+          background: #f8f8f8;
-        border-radius: 10rpx;
+          border-radius: 10rpx;
-        padding: 20rpx;
+          padding: 20rpx;
-      }
+        }
 
-      .debug-info {
+        .type-group {
+          display: flex;
+          gap: 20rpx;
+        }
+
+        .type-item {
+          padding: 14rpx 22rpx;
+          border-radius: 12rpx;
+          border: 1rpx solid #ddd;
+          color: #666;
+          background: #f8f8f8;
+        }
+
+        .type-item.active {
+          color: #fff;
+          border-color: transparent;
+          background: linear-gradient(135deg, #FF6B9D 0%, #FF8E9E 100%);
+        }
+
+        .date-input {
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+          background: #f8f8f8;
+          border-radius: 10rpx;
+          padding: 20rpx;
+        }
+
+        .date-text {
+          font-size: 28rpx;
+          color: #333;
+        }
+
+        .debug-info {
         font-size: 20rpx;
         color: #999;
         margin-top: 10rpx;

src/pages/anniversary/detail.vue

@@ -71,12 +71,19 @@
 
         <view class="form-item">
           <text class="form-label">纪念日期</text>
-          <uni-datetime-picker
+          <view class="date-input" @click="openCalendar">
-            v-model="editForm.date"
+            <text class="date-text">{{ editForm.date || '请选择日期' }}</text>
-            type="date"
+            <uni-icons type="calendar" size="20" color="#666"></uni-icons>
-            :clear-icon="false"
+          </view>
-            @change="onDateChange"
+          <uni-calendar
-          ></uni-datetime-picker>
+            ref="calendarRef"
+            :insert="false"
+            :lunar="true"
+            :start-date="'1900-01-01'"
+            :end-date="'2100-12-31'"
+            :date="editForm.date"
+            @confirm="onCalendarConfirm"
+          ></uni-calendar>
         </view>
 
         <view class="form-item">
@@ -113,6 +120,7 @@ const anniversary = ref({})
 const isEditing = ref(false)
 const showCalendar = ref(false)
 const editForm = ref({})
+const calendarRef = ref(null)
 
 // 纪念日类型
 const anniversaryTypes = [
@@ -188,8 +196,14 @@ const cancelEdit = () => {
   }
 }
 
-const onDateChange = (e) => {
+const openCalendar = () => {
-  editForm.value.date = e.value
+  if (calendarRef.value && calendarRef.value.open) {
+    calendarRef.value.open()
+  }
+}
+
+const onCalendarConfirm = (e) => {
+  editForm.value.date = e.fulldate || e.value || ''
 }
 
 const saveChanges = async () => {
@@ -268,7 +282,12 @@ const deleteAnniversary = () => {
 }
 
 const goBack = () => {
-  uni.navigateBack()
+  const pages = getCurrentPages()
+  if (pages.length > 1) {
+    uni.navigateBack()
+  } else {
+    uni.switchTab({ url: '/pages/home/home' })
+  }
 }
 
 const getIconByType = (type) => {
@@ -488,6 +507,20 @@ const getCountdownText = (item) => {
         color: #333;
       }
     }
+
+    .date-input {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      background: #f8f8f8;
+      border-radius: 10rpx;
+      padding: 20rpx;
+    }
+
+    .date-text {
+      font-size: 28rpx;
+      color: #333;
+    }
   }
 
   .form-actions {

src/pages/home/home.vue

@@ -297,7 +297,7 @@ const goToDiary = () => {
 }
 
 const goToOrder = () => {
-  uni.switchTab({ url: '/pages/order/order' })
+  uni.navigateTo({ url: '/pages/order/order' })
 }
 
 const addAnniversary = () => {