feat: 打开日历选择日期
This commit is contained in:
@@ -4,7 +4,7 @@
|
|||||||
<!-- :style="backgroundStyle" -->
|
<!-- :style="backgroundStyle" -->
|
||||||
<view class="top-item1-left">
|
<view class="top-item1-left">
|
||||||
<image :src="initPageImages.welcomeImageUrl"></image>
|
<image :src="initPageImages.welcomeImageUrl"></image>
|
||||||
<text>{{ currentDate }} 多云 -3~6℃ ff </text>
|
<text>{{ currentDate }} 多云 -3~6℃ ss </text>
|
||||||
</view>
|
</view>
|
||||||
<view class="top-item1-right">
|
<view class="top-item1-right">
|
||||||
<image :src="initPageImages.logoImageUrl"></image>
|
<image :src="initPageImages.logoImageUrl"></image>
|
||||||
|
|||||||
@@ -18,16 +18,41 @@
|
|||||||
<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();
|
||||||
@@ -51,7 +76,7 @@ const selectDate = (index) => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const openCalendar = () => {
|
const openCalendar = () => {
|
||||||
uni.showToast({ title: '打开日历', icon: 'none' });
|
calendarVisible.value = true
|
||||||
};
|
};
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
|
|||||||
Reference in New Issue
Block a user