feat: 快速预定的日历调整

This commit is contained in:
2025-08-10 23:14:24 +08:00
parent d1557fea04
commit 79f33497c7
2 changed files with 48 additions and 27 deletions

View File

@@ -2,10 +2,50 @@
<view class="container"> <view class="container">
<ChatMainList /> <ChatMainList />
</view> </view>
<!-- 日历组件 -->
<Calender
:visible="calendarVisible"
mode="single"
:default-value="selectedDate"
@close="handleCalendarClose"
@select="handleDateSelect"
/>
</template> </template>
<script setup> <script setup>
import { ref, onMounted, onUnmounted } from "vue";
import ChatMainList from "../chat/ChatMainList.vue"; import ChatMainList from "../chat/ChatMainList.vue";
import Calender from "@/components/Calender/index.vue";
const calendarVisible = ref(false);
const selectedDate = ref("");
// 处理日历关闭
const handleCalendarClose = () => {
calendarVisible.value = false;
};
// 处理日期选择
const handleDateSelect = (data) => {
selectedDate.value = data.date;
calendarVisible.value = false;
console.log("选择的日期:", data.date);
uni.$emit("selectCalendarDate", selectedDate.value); // 传回父组件
};
uni.$on("openCalendar", () => {
calendarVisible.value = true;
});
onUnmounted(() => {
// uni.$off('openCalendar')
})
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

View File

@@ -22,41 +22,17 @@
<text class="calendar-text">日历</text> <text class="calendar-text">日历</text>
</view> </view>
</view> </view>
<!-- 日历组件 -->
<Calender
:visible="calendarVisible"
mode="single"
:default-value="selectedDate"
@close="handleCalendarClose"
@select="handleDateSelect"
/>
</view> </view>
</template> </template>
<script setup> <script setup>
import { ref, onMounted } from "vue"; import { ref, onMounted } from "vue";
const emit = defineEmits(["update:date"]); // 声明事件 const emit = defineEmits(["update:date"]); // 声明事件
import Calender from "@/components/Calender/index.vue";
const activeIndex = ref(2); // 默认今天 const activeIndex = ref(2); // 默认今天
const dates = ref([]); const dates = ref([]);
const calendarVisible = ref(false);
const selectedDate = ref("");
// 处理日历关闭
const handleCalendarClose = () => {
calendarVisible.value = false;
};
// 处理日期选择
const handleDateSelect = (data) => {
selectedDate.value = data.date;
calendarVisible.value = false;
console.log("选择的日期:", data.date);
emit("update:date", { fullDate: selectedDate.value }); // 传回父组件
};
// 初始化日期(前天、昨天、今天、明天、后天) // 初始化日期(前天、昨天、今天、明天、后天)
const initDates = () => { const initDates = () => {
const today = new Date(); const today = new Date();
@@ -82,7 +58,12 @@ const selectDate = (index) => {
}; };
const openCalendar = () => { const openCalendar = () => {
calendarVisible.value = true; uni.$emit("openCalendar");
uni.$on("selectCalendarDate", (date) => {
emit("update:date", { fullDate: date });
uni.$off("selectCalendarDate");
});
}; };
onMounted(() => { onMounted(() => {