| | |
| | | <text>{{ t.label }}</text> |
| | | </view> |
| | | </view> |
| | | <!-- 时间选择区域 --> |
| | | <view class="search-section"> |
| | | <!-- 日报:选择年月日 --> |
| | | <view v-if="searchForm.reportType === 'daily'" class="search-row"> |
| | | <view class="date-picker" @click="openDatePicker('single')"> |
| | | <text>{{ searchForm.singleDate || '请选择日期' }}</text> |
| | | </view> |
| | | </view> |
| | | |
| | | <!-- 月报:选择年月 --> |
| | | <view v-else-if="searchForm.reportType === 'monthly'" class="search-row"> |
| | | <view class="date-picker" @click="openDatePicker('startMonth')"> |
| | | <text>{{ searchForm.startMonth || '请选择开始月份' }}</text> |
| | | </view> |
| | | ~ |
| | | <view class="date-picker" @click="openDatePicker('endMonth')"> |
| | | <text>{{ searchForm.endMonth || '请选择结束月份' }}</text> |
| | | </view> |
| | | </view> |
| | | |
| | | <!-- 进出存:选择年月日时间范围 --> |
| | | <view v-else-if="searchForm.reportType === 'inout'" class="search-row"> |
| | | <view class="date-picker" @click="openDatePicker('startDate')"> |
| | | <text>{{ searchForm.startDate || '请选择开始日期' }}</text> |
| | | </view> |
| | | ~ |
| | | <view class="date-picker" @click="openDatePicker('endDate')"> |
| | | <text>{{ searchForm.endDate || '请选择结束日期' }}</text> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <view class="list-section"> |
| | | <view class="section-header"> |
| | | <text class="table-title">{{ tableTitle }}</text> |
| | |
| | | <up-datetime-picker |
| | | v-model="dateValue" |
| | | :mode="datePickerMode" |
| | | :show="showDatePicker" |
| | | @confirm="onDateConfirm" |
| | | @cancel="showDatePicker = false" |
| | | /> |
| | |
| | | const { searchForm } = toRefs(data); |
| | | |
| | | const datePickerMode = computed(() => { |
| | | if (datePickerTarget.value === "startMonth" || datePickerTarget.value === "endMonth") return "month"; |
| | | if (datePickerTarget.value === "startMonth" || datePickerTarget.value === "endMonth") return "year-month"; |
| | | return "date"; |
| | | }); |
| | | |
| | |
| | | if (searchForm.value.reportType === "daily") { |
| | | p.reportDate = searchForm.value.singleDate; |
| | | } else if (searchForm.value.reportType === "monthly") { |
| | | p.startMonth = searchForm.value.startMonth; |
| | | p.endMonth = searchForm.value.endMonth; |
| | | } else if (searchForm.value.reportType === "monthly") { |
| | | p.startMonth = searchForm.value.startMonth; |
| | | p.endMonth = searchForm.value.endMonth; |
| | | p.startMonth = searchForm.value.startMonth ? `${searchForm.value.startMonth}-01` : ""; |
| | | p.endMonth = searchForm.value.endMonth ? `${searchForm.value.endMonth}-01` : ""; |
| | | } else { |
| | | p.startDate = searchForm.value.startDate; |
| | | p.endDate = searchForm.value.endDate; |
| | |
| | | if (target === "single") val = searchForm.value.singleDate; |
| | | else if (target === "startMonth") val = searchForm.value.startMonth; |
| | | else if (target === "endMonth") val = searchForm.value.endMonth; |
| | | else if (target === "startDate") val = searchForm.value.startDate; |
| | | else if (target === "endDate") val = searchForm.value.endDate; |
| | | dateValue.value = val ? new Date(val).getTime() : Date.now(); |
| | | showDatePicker.value = true; |
| | | }; |
| | |
| | | const onDateConfirm = (e) => { |
| | | const isMonth = datePickerTarget.value === "startMonth" || datePickerTarget.value === "endMonth"; |
| | | const str = isMonth ? dayjs(e.value).format("YYYY-MM") : formatDateToYMD(e.value); |
| | | if (datePickerTarget.value === "single") searchForm.value.singleDate = str; |
| | | else if (datePickerTarget.value === "startMonth") searchForm.value.startMonth = str; |
| | | else if (datePickerTarget.value === "endMonth") searchForm.value.endMonth = str; |
| | | showDatePicker.value = false; |
| | | handleQuery(); |
| | | if (datePickerTarget.value === "single") { |
| | | searchForm.value.singleDate = str; |
| | | showDatePicker.value = false; |
| | | handleQuery(); |
| | | } else if (datePickerTarget.value === "startMonth") { |
| | | searchForm.value.startMonth = str; |
| | | showDatePicker.value = false; |
| | | setTimeout(() => { |
| | | openDatePicker("endMonth"); |
| | | }, 300); |
| | | } else if (datePickerTarget.value === "endMonth") { |
| | | searchForm.value.endMonth = str; |
| | | showDatePicker.value = false; |
| | | handleQuery(); |
| | | } else if (datePickerTarget.value === "startDate") { |
| | | searchForm.value.startDate = str; |
| | | showDatePicker.value = false; |
| | | setTimeout(() => { |
| | | openDatePicker("endDate"); |
| | | }, 300); |
| | | } else if (datePickerTarget.value === "endDate") { |
| | | searchForm.value.endDate = str; |
| | | showDatePicker.value = false; |
| | | handleQuery(); |
| | | } |
| | | }; |
| | | |
| | | const initDefaultDates = () => { |
| | |
| | | searchForm.value.singleDate = today.format("YYYY-MM-DD"); |
| | | } |
| | | if (!searchForm.value.startMonth || !searchForm.value.endMonth) { |
| | | const startOfMonth = today.startOf("month").format("YYYY-MM-DD"); |
| | | const endOfMonth = today.endOf("month").format("YYYY-MM-DD"); |
| | | searchForm.value.startMonth = startOfMonth; |
| | | searchForm.value.endMonth = endOfMonth; |
| | | searchForm.value.startMonth = today.format("YYYY-MM"); |
| | | searchForm.value.endMonth = today.add(1, "month").format("YYYY-MM"); |
| | | } |
| | | if (!searchForm.value.startDate || !searchForm.value.endDate) { |
| | | searchForm.value.endDate = today.format("YYYY-MM-DD"); |