修改 测试bug
This commit is contained in:
@@ -1,28 +1,41 @@
|
||||
<template>
|
||||
<el-select v-model="interval" style="min-width: 90px; width: 90px; margin-right: 10px" @change="timeChange">
|
||||
<el-option v-for="item in timeOptions" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
<el-date-picker
|
||||
v-model="timeValue"
|
||||
type="daterange"
|
||||
:disabled="disabledPicker"
|
||||
style="width: 230px; margin-right: 10px"
|
||||
unlink-panels
|
||||
:clearable="false"
|
||||
range-separator="至"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
value-format="YYYY-MM-DD"
|
||||
:shortcuts="shortcuts"
|
||||
/>
|
||||
<el-button :disabled="backDisabled" type="primary" :icon="DArrowLeft" @click="preClick"></el-button>
|
||||
<el-button type="primary" :icon="VideoPause" @click="nowTime">当前</el-button>
|
||||
<el-button :disabled="preDisabled" type="primary" :icon="DArrowRight" @click="next"></el-button>
|
||||
<div style="width: 600px">
|
||||
<el-select v-model="interval" style="min-width: 90px; width: 90px; margin-right: 10px" @change="timeChange">
|
||||
<el-option v-for="item in timeOptions" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
|
||||
<el-date-picker
|
||||
v-model="timeValue"
|
||||
type="daterange"
|
||||
:disabled="disabledPicker"
|
||||
style="width: 220px; margin-right: 10px"
|
||||
unlink-panels
|
||||
:clearable="false"
|
||||
range-separator="至"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
value-format="YYYY-MM-DD"
|
||||
:shortcuts="shortcuts"
|
||||
/>
|
||||
<el-button :disabled="backDisabled" type="primary" :icon="DArrowLeft" @click="preClick"></el-button>
|
||||
<el-button type="primary" :icon="VideoPause" @click="nowTime">当前</el-button>
|
||||
<el-button :disabled="preDisabled" type="primary" :icon="DArrowRight" @click="next"></el-button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { DArrowLeft, VideoPause, DArrowRight } from '@element-plus/icons-vue'
|
||||
import { ref, onMounted, nextTick } from 'vue'
|
||||
import { ref, onMounted, nextTick, watch } from 'vue'
|
||||
|
||||
interface Props {
|
||||
nextFlag?: boolean
|
||||
theCurrentTime: boolean
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
nextFlag: false,
|
||||
theCurrentTime: false
|
||||
})
|
||||
|
||||
const interval = ref(3)
|
||||
const timeFlag = ref(1)
|
||||
@@ -110,6 +123,7 @@ const timeChange = (e: number) => {
|
||||
|
||||
// 当前
|
||||
const nowTime = () => {
|
||||
console.log(interval.value, '000000000')
|
||||
timeChange(interval.value)
|
||||
}
|
||||
// 上一个
|
||||
@@ -140,7 +154,6 @@ const preClick = () => {
|
||||
//按周
|
||||
} else if (interval.value == 4) {
|
||||
//根据开始时间推
|
||||
|
||||
let start = new Date(year, month - 1, date)
|
||||
start.setDate(start.getDate() - 7)
|
||||
startTime = formatTime(start)
|
||||
@@ -177,7 +190,6 @@ const preClick = () => {
|
||||
//下一个
|
||||
const next = () => {
|
||||
//向后
|
||||
|
||||
let startTime = timeValue.value[0]
|
||||
let endTime = timeValue.value[1]
|
||||
let year = parseInt(startTime.substring(0, 4))
|
||||
@@ -193,8 +205,9 @@ const next = () => {
|
||||
if (interval.value == 3) {
|
||||
if (month == 12) {
|
||||
year = year + 1
|
||||
|
||||
// 年份进位后,大于当前的年份,是不科学的
|
||||
if (presentY < year) {
|
||||
if (presentY < year && !props.nextFlag) {
|
||||
startTime = presentY + '-12-01'
|
||||
if (presentD < 10) {
|
||||
endTime = presentY + '-12' + '-0' + presentD
|
||||
@@ -223,7 +236,7 @@ const next = () => {
|
||||
// 年份等于当前年份
|
||||
if (presentY == year) {
|
||||
// 月份超过当前月份,是不科学的
|
||||
if (month >= presentM) {
|
||||
if (month >= presentM && !props.nextFlag) {
|
||||
if (presentM < 10) {
|
||||
startTime = year + '-0' + presentM + '-01'
|
||||
if (presentD < 10) {
|
||||
@@ -268,7 +281,7 @@ const next = () => {
|
||||
if (month == 10) {
|
||||
year = year + 1
|
||||
// 年份进位后大于当前年份是不科学的
|
||||
if (year > presentY) {
|
||||
if (year > presentY && !props.nextFlag) {
|
||||
startTime = presentY + '-10-01'
|
||||
if (presentD < 10) {
|
||||
endTime = year + '-' + presentM + '-0' + presentD
|
||||
@@ -294,8 +307,10 @@ const next = () => {
|
||||
}
|
||||
} else {
|
||||
month = month + 3
|
||||
console.log('🚀 ~ next ~ presentM:', presentM, month)
|
||||
|
||||
// 季度进位后,超过当前月份是不科学的
|
||||
if (year == presentY) {
|
||||
if (year == presentY && !props.nextFlag) {
|
||||
if (month >= presentM) {
|
||||
// 当季度进位后大于当前月,以当前月的时间显示季度
|
||||
if (presentM > 0 && presentM < 4) {
|
||||
@@ -307,6 +322,7 @@ const next = () => {
|
||||
endTime = year + '-0' + presentM + '-' + presentD
|
||||
}
|
||||
} else if (presentM > 3 && presentM < 7) {
|
||||
console.log(123123)
|
||||
// 第二季度
|
||||
startTime = year + '-04-01'
|
||||
if (presentD < 10) {
|
||||
@@ -342,7 +358,7 @@ const next = () => {
|
||||
endTime = NowgetEndTime()
|
||||
} else {
|
||||
var day = getDays(year, month)
|
||||
endTime = year + '-' + month + '-' + day
|
||||
endTime = year + '-0' + month + '-' + day
|
||||
}
|
||||
}
|
||||
} else {
|
||||
@@ -359,6 +375,7 @@ const next = () => {
|
||||
}
|
||||
}
|
||||
}
|
||||
console.log(startTime, endTime)
|
||||
} else if (interval.value == 5) {
|
||||
} else if (interval.value == 4) {
|
||||
//根据开始时间推
|
||||
@@ -371,7 +388,7 @@ const next = () => {
|
||||
} else {
|
||||
year = year + 1
|
||||
// 年份进位后大于当前年份,是不科学的
|
||||
if (year >= presentY) {
|
||||
if (year >= presentY && !props.nextFlag) {
|
||||
startTime = presentY + '-01-01'
|
||||
if (presentM < 10) {
|
||||
if (presentD < 10) {
|
||||
@@ -395,7 +412,8 @@ const setTime = (flag = 0, e = 0) => {
|
||||
let dd = window.XEUtils.toDateString(new Date().getTime() - e * 3600 * 1000 * 24, 'dd')
|
||||
|
||||
let data = ''
|
||||
if (dd < 4 || dd == 0) {
|
||||
|
||||
if ((dd < 4 || dd == 0) && interval.value != 4 && !props.theCurrentTime) {
|
||||
data = window.XEUtils.toDateString(new Date().getTime() - (e + dd) * 3600 * 1000 * 24, 'yyyy-MM-dd')
|
||||
} else {
|
||||
data = window.XEUtils.toDateString(new Date().getTime() - e * 3600 * 1000 * 24, 'yyyy-MM-dd')
|
||||
@@ -496,7 +514,7 @@ function formatDate(date: Date): string {
|
||||
const day = String(date.getDate()).padStart(2, '0')
|
||||
return `${year}-${month}-${day}`
|
||||
}
|
||||
defineExpose({ timeValue, interval, timeFlag, setTimeOptions, setInterval, getYearOnYear, getMonthOnMonth,timeChange })
|
||||
defineExpose({ timeValue, interval, timeFlag, setTimeOptions, setInterval, getYearOnYear, getMonthOnMonth, timeChange })
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
@@ -2,22 +2,23 @@
|
||||
<div ref="tableHeader" class="cn-table-header">
|
||||
<div class="table-header ba-scroll-style">
|
||||
<el-form
|
||||
style="flex: 1; height: 32px; margin-right: 20px"
|
||||
style="flex: 1; height: 34px; margin-right: 20px; display: flex; flex-wrap: wrap"
|
||||
ref="headerForm"
|
||||
@submit.prevent=""
|
||||
@keyup.enter="onComSearch"
|
||||
label-position="left"
|
||||
:inline="true"
|
||||
>
|
||||
<el-form-item label="日期" v-if="datePicker" style="grid-column: span 2; max-width: 570px">
|
||||
<DatePicker ref="datePickerRef" :nextFlag="nextFlag" :theCurrentTime="theCurrentTime"></DatePicker>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="区域" v-if="area">
|
||||
<Area ref="areaRef" v-model="tableStore.table.params.deptIndex" />
|
||||
</el-form-item>
|
||||
<el-form-item label="日期" v-if="datePicker" style="grid-column: span 2; max-width: unset">
|
||||
<DatePicker ref="datePickerRef"></DatePicker>
|
||||
</el-form-item>
|
||||
<slot name="select"></slot>
|
||||
</el-form>
|
||||
<template v-if="$slots.select || datePicker">
|
||||
<template v-if="$slots.select || datePicker || showSearch">
|
||||
<el-button type="primary" @click="showSelectChange" v-if="showUnfoldButton">
|
||||
<Icon size="14" name="el-icon-ArrowUp" style="color: #fff" v-if="showSelect" />
|
||||
<Icon size="14" name="el-icon-ArrowDown" style="color: #fff" v-else />
|
||||
@@ -46,6 +47,7 @@ import Area from '@/components/form/area/index.vue'
|
||||
import { mainHeight } from '@/utils/layout'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
import { Search, RefreshLeft } from '@element-plus/icons-vue'
|
||||
import { defineProps } from 'vue'
|
||||
|
||||
const tableStore = inject('tableStore') as TableStore
|
||||
const tableHeader = ref()
|
||||
@@ -59,12 +61,16 @@ interface Props {
|
||||
datePicker?: boolean
|
||||
area?: boolean
|
||||
showSearch?: boolean
|
||||
nextFlag?: boolean //控制时间是否可以往后推
|
||||
theCurrentTime?: boolean //控制时间前3天展示上个月时间
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
datePicker: false,
|
||||
area: false,
|
||||
showSearch: true
|
||||
showSearch: true,
|
||||
nextFlag: false,
|
||||
theCurrentTime: false
|
||||
})
|
||||
// 动态计算table高度
|
||||
const resizeObserver = new ResizeObserver(entries => {
|
||||
@@ -151,19 +157,19 @@ const onComSearch = async () => {
|
||||
|
||||
await tableStore.onTableAction('search', {})
|
||||
}
|
||||
const onResetForm = () => {
|
||||
//时间重置成默认值
|
||||
datePickerRef.value?.timeChange(3)
|
||||
tableStore.onTableAction('reset', {})
|
||||
}
|
||||
const setDatePicker = (list: any) => {
|
||||
datePickerRef.value.setTimeOptions(list)
|
||||
}
|
||||
const onResetForm = () => {
|
||||
//时间重置成默认值
|
||||
datePickerRef.value?.setInterval(3)
|
||||
tableStore.onTableAction('reset', {})
|
||||
}
|
||||
const setInterval = (val: any) => {
|
||||
datePickerRef.value.setInterval(val)
|
||||
}
|
||||
|
||||
defineExpose({ onComSearch, areaRef, setDatePicker, setInterval, datePickerRef })
|
||||
defineExpose({ onComSearch, areaRef, setDatePicker, setInterval, datePickerRef, showSelectChange})
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
Reference in New Issue
Block a user