refactor(event): 三个下拉抽屉改为自筛选栏下缘自绘展开

- 移除 up-popup 模板：场所/状态/时间三个抽屉统一改为自绘 .drop-panel，
  锚定在筛选栏下缘展开（不再占全屏）
- 抽出 .content-area 作为抽屉定位锚点与统一遮罩容器，
  三个抽屉共享 .content-mask 关闭交互
- 时间抽屉去重 time-mask/time-drawer 旧样式，面板高度改为 66vh 并受
  max-height: 100% 约束，避免遮罩下方露白

pages/event/index.vue

@@ -24,16 +24,22 @@
       </view>
     </view>
 
+    <!-- 数据层：筛选栏以下区域；三个下拉抽屉都锚定在这层顶部（筛选栏下缘）展开 -->
+    <view class="content-area">
+      <view class="content-body">
         <view class="empty-area">
           <up-empty mode="message" text="暂无事件数据" />
         </view>
         <view class="empty-hint">
           <text>调整筛选条件后的事件列表将在此展示</text>
         </view>
+      </view>
 
-    <!-- 场所抽屉：顶部下拉选项列表 -->
-    <up-popup :show="drawer === 'scene'" mode="top" round="24" :overlay-opacity="0.35" :safe-area-inset-bottom="false" :custom-style="{ width: '100vw' }" @close="closeDrawer">
-      <view class="option-drawer">
+      <!-- 遮罩：盖住筛选栏以下全部内容 -->
+      <view v-if="drawer" class="content-mask" @click="closeDrawer" @touchmove.stop.prevent="noop" />
+
+      <!-- 场所抽屉：从筛选栏下缘展开 -->
+      <view v-if="drawer === 'scene'" class="drop-panel drop-panel--options">
         <view class="option-drawer-header">
           <text class="option-drawer-title">选择场所</text>
           <view class="option-drawer-close" @click="closeDrawer">
@@ -53,11 +59,9 @@
           </view>
         </view>
       </view>
-    </up-popup>
 
-    <!-- 状态抽屉：顶部下拉选项列表 -->
-    <up-popup :show="drawer === 'status'" mode="top" round="24" :overlay-opacity="0.35" :safe-area-inset-bottom="false" :custom-style="{ width: '100vw' }" @close="closeDrawer">
-      <view class="option-drawer">
+      <!-- 状态抽屉：从筛选栏下缘展开 -->
+      <view v-if="drawer === 'status'" class="drop-panel drop-panel--options">
         <view class="option-drawer-header">
           <text class="option-drawer-title">选择状态</text>
           <view class="option-drawer-close" @click="closeDrawer">
@@ -77,11 +81,9 @@
           </view>
         </view>
       </view>
-    </up-popup>
 
-    <!-- 时间抽屉：自绘遮罩 + 顶部面板（滚动式日历：懒渲染，窗口外月份占位） -->
-    <view v-if="drawer === 'time'" class="time-mask" @click="closeDrawer" @touchmove.stop.prevent="noop" />
-    <view v-if="drawer === 'time'" class="time-drawer">
+      <!-- 时间抽屉：从筛选栏下缘展开（滚动式日历：懒渲染，窗口外月份占位） -->
+      <view v-if="drawer === 'time'" class="drop-panel drop-panel--calendar">
         <view class="time-drawer-header">
           <text class="time-drawer-title">选择时间范围</text>
           <view class="time-drawer-close" @click="closeDrawer">
@@ -157,6 +159,7 @@
         </view>
       </view>
     </view>
+  </view>
 </template>
 <script>
 import { getSceneList } from '@/api/scene'
@@ -441,7 +444,14 @@ export default {
 <style lang="scss" scoped>
 @import '@/styles/common.css';
 
+/* 页面容器：纵向 flex，让数据层撑满筛选栏以下的全部剩余视口 */
+.page {
+  display: flex;
+  flex-direction: column;
+}
+
 .filters {
+  flex-shrink: 0;
   display: flex;
   align-items: stretch;
   min-height: 96rpx;
@@ -501,11 +511,49 @@ export default {
   color: #b5b9c0;
 }
 
-/* 场所/状态选项抽屉 */
-.option-drawer {
+/* 数据层：撑满筛选栏以下全部视口，是三个下拉抽屉的定位锚点 */
+.content-area {
+  position: relative;
+  flex: 1;
+  min-height: 0;
+}
+
+/* 遮罩：盖住筛选栏以下内容，点击关闭 */
+.content-mask {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.35);
+  z-index: 10;
+}
+
+/* 下拉面板：从数据层顶部（筛选栏下缘）展开 */
+.drop-panel {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
   background: #ffffff;
-  padding-bottom: 24rpx;
   box-shadow: 0 12rpx 40rpx rgba(0, 0, 0, 0.08);
+  z-index: 11;
+  display: flex;
+  flex-direction: column;
+  border-bottom-left-radius: 24rpx;
+  border-bottom-right-radius: 24rpx;
+  overflow: hidden;
+}
+
+/* 场所/状态选项面板：内容自适应高度 */
+.drop-panel--options {
+  max-height: 60vh;
+}
+
+/* 时间面板：日历占剩余空间，但不超过数据层高度（时间抽屉时遮罩仍完整盖住剩余空间） */
+.drop-panel--calendar {
+  height: 66vh;
+  max-height: 100%;
 }
 
 .option-drawer-header {
@@ -531,7 +579,7 @@ export default {
 }
 
 .option-drawer-list {
-  padding: 12rpx 24rpx;
+  padding: 12rpx 24rpx 24rpx;
 }
 
 .option-drawer-item {
@@ -561,32 +609,7 @@ export default {
   font-weight: 600;
 }
 
-/* 时间抽屉：自绘遮罩 + 顶部面板（不经过 up-popup，避免其 touchmove 拦截吞掉日历滚动手势） */
-.time-mask {
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: rgba(0, 0, 0, 0.35);
-  z-index: 10075;
-}
-
-.time-drawer {
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100vw;
-  height: 66vh; /* 固定高度：日历窗口+按钮填满，按钮钉底 */
-  z-index: 10076;
-  background: #ffffff;
-  border-bottom-left-radius: 32rpx;
-  border-bottom-right-radius: 32rpx;
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-}
-
+/* 时间面板头/底部（面板已锚定在筛选栏下方，不再 fixed） */
 .time-drawer-header {
   padding: 20rpx 32rpx;
   display: flex;