temp2

pages.json

@@ -10,15 +10,10 @@
 		{
 			"path": "pages/index/index",
 			"style": {
-				"navigationBarTitleText": "首页"
+				"navigationStyle": "custom"
 			}
 		}
 	],
-	"globalStyle": {
+
-		"navigationBarTextStyle": "black",
-		"navigationBarTitleText": "uni-app",
-		"navigationBarBackgroundColor": "#F8F8F8",
-		"backgroundColor": "#F8F8F8"
-	},
 	"uniIdRouter": {}
 }

pages/index/index.vue

@@ -1,10 +1,21 @@
 <template>
+  <view class="status_bar">
+  </view>
   <!-- 顶部Tabs栏 -->
-  <TopTabs :tabs="topTabs" v-model="topTabValue" />
+<view class="fixed">
+  <uv-tabs :list="topTabs" @click="click"></uv-tabs>
+</view>
+
+
 
   <!-- 日期条 -->
   <DateBar :days="weekDays" v-model="selectedDate" />
 
+  <view>
+    <uv-calendar ref="calendar"  mode="single" @confirm="handleConfirm"></uv-calendar>
+    <button @click="openCalendar">打开</button>
+  </view>
+
   <!-- 时间轴表格 -->
   <TimeTable :hours="hours" :events="eventsInDay" />
 
@@ -15,7 +26,12 @@
   <AddEventModal :show="showAdd" @ok="addEvent" @cancel="showAdd = false" />
 
   <!-- 底部导航 -->
-  <BottomTabbar :items="tabbarItems" v-model="tabbarVal" />
+  <uv-tabbar :value="value" @change="index=>value = index">
+    <uv-tabbar-item text="首页" icon="home"></uv-tabbar-item>
+    <uv-tabbar-item text="放映厅" icon="photo"></uv-tabbar-item>
+    <uv-tabbar-item text="直播" icon="play-right"></uv-tabbar-item>
+    <uv-tabbar-item text="我的" icon="account"></uv-tabbar-item>
+  </uv-tabbar>
 </template>
 
 <script setup>
@@ -29,10 +45,10 @@ import AddEventModal from '@/components/AddEventModal.vue';
 
 // 顶部tabs选项
 const topTabs = [
-  { label: '日程编辑', value: 0 },
+  { name: '日程编辑', value: 0 },
-  { label: '内容看板', value: 1 },
+  { name: '内容看板', value: 1 },
-  { label: '待办事项', value: 2 },
+  { name: '待办事项', value: 2 },
-  { label: '消息内容', value: 3 }
+  { name: '消息内容', value: 3 }
 ];
 const topTabValue = ref(0);
 
@@ -73,6 +89,17 @@ const eventsInDay = computed(() =>
   allEvents.value.filter(e=>e.date===selectedDate.value)
 );
 
+const calendar = ref(null)
+// 打开日历方法
+const openCalendar = () => {
+  if (calendar.value) {
+    calendar.value.open()
+  }
+}
+const handleConfirm = (e) => {
+  console.log('日历选择：', e)
+}
+
 // 悬浮按钮/弹窗控制
 const showAdd = ref(false);
 function addEvent(e) {
@@ -83,6 +110,7 @@ function addEvent(e) {
   });
   showAdd.value = false;
 }
+const value=ref(0);
 
 // 底部导航
 const tabbarItems = [
@@ -96,11 +124,20 @@ const tabbarVal = ref(1);
 </script>
 
 <style lang="scss" scoped>
-@import "@/uni.scss";
+
+.status_bar {
+  height: var(--status-bar-height);
+  width: 100%;
+}
 
 :deep(.bottom-tabbar) { z-index: 1000 !important; }
 
 .schedule-timeline {
   padding-bottom: 130rpx !important;
 }
+.fixed{
+  position: relative;
+  left: 0;
+  width: 100%;
+}
 </style>