生日

mallApp/src/api/user/index.js

@@ -22,4 +22,8 @@ export const accountLogin = data => {
 
 export const clearLogin = data => {
 	return https.get("/user/clear-login", data);
-};
+};
+
+export const modifyBirthday = data => {
+	return https.get('/user/modify-birthday', data)
+}

mallApp/src/pages/home/recent.vue

@@ -54,7 +54,7 @@
            </view>
 
            <!-- 生日礼物提示横幅 -->
-           <view class="birthday-banner" @click="goToBirthday">
+           <view class="birthday-banner" @click="goToBirthday" v-if="Number(user.birthdayMonth)>0">
              <view class="gift-icon-container">
                <text class="gift-icon">🎁</text>
              </view>

mallApp/src/pages/user/birthday.vue

@@ -1,22 +1,288 @@
 <template>
-	<view>
+  <view class="birthday-page">
+    <div class="birthday-container">
+      <!-- 类型选择 -->
+      <div class="birthday-section">
+        <div class="section-title">类型</div>
+        <div class="type-buttons">
+          <button 
+            class="admin-button-com middle" 
+            :class="[lunar == 0 ? 'blue' : 'default']" 
+            @click="lunar = 0"
+          >公历</button>
+          <button 
+            class="admin-button-com middle" 
+            :class="[lunar == 1 ? 'blue' : 'default']" 
+            @click="lunar = 1"
+          >农历</button>
+        </div>
+      </div>
+      
+      <!-- 月份选择 -->
+      <div class="birthday-section">
+        <div class="section-title">月份</div>
+        <div class="month-buttons">
+          <button 
+            v-for="(month, index) in [1,2,3,4,5,6,7,8,9,10,11,12]" 
+            :key="index" 
+            class="month-button" 
+            :class="{ active: birthdayMonth == month }"
+            @click="birthdayMonth = month"
+          >{{ month }}</button>
+        </div>
+      </div>
+      
+      <!-- 日期选择 (数字按钮形式) -->
+      <div class="birthday-section">
+        <div class="section-title">日期</div>
+        <div class="date-buttons-container">
+          <!-- 使用固定高度的容器和绝对定位的滚动视图 -->
+          <view class="date-buttons-wrapper">
+            <scroll-view 
+              scroll-y="true" 
+              class="date-buttons-scroll" 
+              enhanced="true"
+              show-scrollbar="true"
+              always-bounce-vertical="true"
+            >
+              <div class="date-buttons">
+                <button 
+                  v-for="(date, index) in dateArray" 
+                  :key="index"
+                  class="date-button" 
+                  :class="{ active: birthdayDate == date }"
+                  @click="birthdayDate = date"
+                >{{ date }}</button>
+              </div>
+            </scroll-view>
+          </view>
+        </div>
+      </div>
 
-	</view>
+      <!-- 操作按钮 -->
+      <div class="action-buttons">
+        <button class="admin-button-com middle default" @click="cancel">取消</button>
+        <button class="admin-button-com middle blue" @click="confirm">确认</button>
+      </div>
+    </div>
+  </view>
 </template>
 <script>
+import { modifyBirthday } from "@/api/user"
 export default {
-	name: 'birthday',
-	components: {
-		TuiListCell
+  name: 'birthday',
+  components: {
+  },
+  data() {
+    return {
+      lunar: 0, // 0公历 1农历
+      birthdayMonth: '', // 选择的月份
+      birthdayDate: '', // 选择的日期
+      dateArray: Array.from({length: 31}, (_, i) => i + 1), // 1-31的数组
+    }
+  },
+  onLoad() {
+      //返回上一页时刷新
+      let pages = getCurrentPages();
+      let prevPage = pages[ pages.length - 2 ];
+      prevPage.$vm.pageAction = {refresh:1}
+  },
+  methods: {
+	init(){
 	},
-	data() {
-		return {
-		}
-	},
-	onLoad() {},
-	methods: {
-	}
+    cancel() {
+      // 取消操作
+      uni.navigateBack();
+    },
+    confirm() {
+      // 确认操作
+      if (!this.birthdayMonth || !this.birthdayDate) {
+        uni.showToast({
+          title: '请选择月份和日期',
+          icon: 'none'
+        });
+        return;
+      }
+      // 返回选中的数据
+      const params = {
+        lunar: this.lunar,
+        birthdayMonth: this.birthdayMonth,
+        birthdayDate: this.birthdayDate
+      };
+		this.$util.confirmModal({content:'确认修改？提交后将不能再修改'},() => {
+			modifyBirthday(params).then(res=>{
+				if(res.code == 1){
+					this.$msg('已修改')
+					setTimeout(() => {
+						uni.navigateBack()
+					}, 900);
+				}
+			})
+		})
+    }
+  }
 }
 </script>
 <style lang="scss" scoped>
+.birthday-page {
+  padding: 30upx;
+  background: #fff;
+  min-height: 100vh;
+}
+
+.birthday-container {
+  width: 100%;
+}
+
+.birthday-section {
+  margin-bottom: 30upx;
+  
+  &:last-child {
+    margin-bottom: 0;
+  }
+  
+  .section-title {
+    font-size: 32upx;
+    color: #333;
+    margin-bottom: 20upx;
+    font-weight: 500;
+  }
+  
+  .type-buttons {
+    display: flex;
+    gap: 20upx;
+    
+    button {
+      flex: 1;
+    }
+  }
+  
+  .month-buttons {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 10upx;
+  }
+  
+  .month-button {
+    width: calc(25% - 10upx);
+    height: 80upx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: #f8f9fa;
+    border: 2upx solid #e9ecef;
+    border-radius: 8upx;
+    font-size: 30upx;
+    color: #333;
+    margin-bottom: 10upx;
+    
+    &.active {
+      background: #e8f5ff;
+      border-color: #3385FF;
+      color: #3385FF;
+      font-weight: 500;
+    }
+    
+    &:active {
+      background: #e8f5ff;
+    }
+  }
+  
+  .date-buttons-container {
+    width: 100%;
+  }
+  
+  .date-buttons-wrapper {
+    width: 100%;
+    height: 340upx; /* 固定高度，显示4行 */
+    background: #f8f9fa;
+    border: 2upx solid #e9ecef;
+    border-radius: 8upx;
+    position: relative;
+    overflow: hidden;
+  }
+  
+  .date-buttons-scroll {
+    width: 100%;
+    height: 100%;
+    padding: 10upx;
+    box-sizing: border-box;
+  }
+  
+  .date-buttons {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 10upx;
+  }
+  
+  .date-button {
+    width: calc(25% - 8upx);
+    height: 80upx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: #ffffff;
+    border: 2upx solid #e9ecef;
+    border-radius: 8upx;
+    font-size: 30upx;
+    color: #333;
+    margin-bottom: 10upx;
+    box-sizing: border-box;
+    
+    &.active {
+      background: #e8f5ff;
+      border-color: #3385FF;
+      color: #3385FF;
+      font-weight: 500;
+    }
+    
+    &:active {
+      background: #e8f5ff;
+    }
+  }
+}
+
+.action-buttons {
+  margin-top: 50upx;
+  display: flex;
+  gap: 20upx;
+  padding: 0 20upx;
+  
+  button {
+    flex: 1;
+  }
+}
+
+/* 按钮基础样式 */
+.admin-button-com {
+  height: 80upx;
+  border-radius: 8upx;
+  font-size: 32upx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border: none;
+  outline: none;
+  
+  &.middle {
+    height: 80upx;
+    font-size: 30upx;
+  }
+  
+  &.default {
+    background: #f8f9fa;
+    color: #333;
+    border: 2upx solid #e9ecef;
+  }
+  
+  &.blue {
+    background: #3385FF;
+    color: #fff;
+    border: 2upx solid #3385FF;
+  }
+  
+  &:active {
+    opacity: 0.8;
+  }
+}
 </style>