shish vor 11 Monaten
Ursprung
Commit
dce9271f7f
1 geänderte Dateien mit 51 neuen und 68 gelöschten Zeilen
  1. 51 68
      hdPad/src/pages/home/components/birthdayEdit.vue

+ 51 - 68
hdPad/src/pages/home/components/birthdayEdit.vue

@@ -1,61 +1,55 @@
 <template>
     <div class="birthday-container full-width">
-        <div class="birthday-layout">
-            <div class="birthday-column">
-                <!-- 类型选择 -->
-                <div class="birthday-section">
-                    <div class="section-title">类型</div>
-                    <div class="type-buttons">
-                        <button 
-                            class="birthday-type-btn" 
-                            :class="{active: lunar == 0}" 
-                            @click="lunar = 0"
-                        >公历</button>
-                        <button 
-                            class="birthday-type-btn" 
-                            :class="{active: lunar == 1}" 
-                            @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="'month-'+month" 
-                            class="month-button" 
-                            :class="{ active: birthdayMonth == month }"
-                            @click="setMonth(month)"
-                        >{{ month }}</button>
-                    </div>
-                </div>
+        <!-- 类型选择 -->
+        <div class="birthday-section">
+            <div class="section-title">类型</div>
+            <div class="type-buttons">
+                <button 
+                    class="birthday-type-btn" 
+                    :class="{active: lunar == 0}" 
+                    @click="lunar = 0"
+                >公历</button>
+                <button 
+                    class="birthday-type-btn" 
+                    :class="{active: lunar == 1}" 
+                    @click="lunar = 1"
+                >农历</button>
             </div>
-            
-            <div class="birthday-column">
-                <!-- 日期选择 (数字按钮形式) -->
-                <div class="birthday-section">
-                    <div class="section-title">日期</div>
-                    <div class="date-buttons">
-                        <button 
-                            v-for="(date, index) in dateArray" 
-                            :key="date" 
-                            class="date-button" 
-                            :class="{ active: birthdayDate == date }"
-                            @click="setDate(date)"
-                        >{{ date }}</button>
-                    </div>
-                </div>
-                
-                <!-- 操作按钮 -->
-                <div class="birthday-actions">
-                    <button class="birthday-action-btn cancel-btn" @click="cancelEdit">取消</button>
-                    <button class="birthday-action-btn save-btn" @click="saveBirthday">保存</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="'month-'+month" 
+                    class="month-button" 
+                    :class="{ active: birthdayMonth == month }"
+                    @click="setMonth(month)"
+                >{{ month }}</button>
             </div>
         </div>
+        
+        <!-- 日期选择 (数字按钮形式) -->
+        <div class="birthday-section">
+            <div class="section-title">日期</div>
+            <div class="date-buttons">
+                <button 
+                    v-for="(date, index) in dateArray" 
+                    :key="date" 
+                    class="date-button" 
+                    :class="{ active: birthdayDate == date }"
+                    @click="setDate(date)"
+                >{{ date }}</button>
+            </div>
+        </div>
+        
+        <!-- 操作按钮 -->
+        <div class="birthday-actions">
+            <button class="birthday-action-btn cancel-btn" @click="cancelEdit">取消</button>
+            <button class="birthday-action-btn save-btn" @click="saveBirthday">保存</button>
+        </div>
     </div>
 </template>
 
@@ -141,19 +135,8 @@ export default {
     overflow-y: auto;
 }
 
-.birthday-layout {
-    display: flex;
-    flex-direction: row;
-    width: 100%;
-}
-
-.birthday-column {
-    flex: 1;
-    padding: 0 5upx;
-}
-
 .birthday-section {
-    margin-bottom: 12upx;
+    margin-bottom: 15upx;
 }
 
 .section-title {
@@ -200,7 +183,7 @@ export default {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
-    width: 100%; /* 使用100%宽度适应父容器 */
+    width: 170upx; /* 控制总宽度,使一行放6个 */
     margin: 0 auto;
 }
 
@@ -237,7 +220,7 @@ export default {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
-    width: 100%; /* 使用100%宽度适应父容器 */
+    width: 200upx; /* 控制总宽度,使一行放8个 */
     margin: 0 auto;
 }
 
@@ -251,7 +234,7 @@ export default {
     align-items: center;
     justify-content: center;
     font-size: 10upx;
-    margin: 3.5upx 4.5upx;
+    margin: 2.5upx 4.5upx;
     transition: all 0.2s;
     padding: 0;