9e36a0bd1c
【主 题】：订单模块 重构 【描 述】： [原因]：订单页面 销售统计页面 数据请求 在加载页面时再请求 对应条件数据 [过程]： [影响]： 【结 束】 # 类型 包含: # feat：新功能（feature） # fix：修补bug # docs：文档（documentation） # style： 格式（不影响代码运行的变动） # refactor：重构（即不是新增功能，也不是修改bug的代码变动） # test：增加测试 # chore：构建过程或辅助工具的变动
124 lines
4.0 KiB
Vue
124 lines
4.0 KiB
Vue
<template>
|
|
<el-date-picker v-model="value" type="daterange" align="right" unlink-panels range-separator="至"
|
|
start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions" format="yyyy-MM-dd">
|
|
</el-date-picker>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data () {
|
|
return {
|
|
pickerOptions: {
|
|
shortcuts: [
|
|
{
|
|
text: '今天',
|
|
onClick (picker) {
|
|
const start = new Date(new Date().setHours(0, 0, 0, 0))
|
|
const end = new Date(new Date().setHours(23, 59, 59, 999))
|
|
picker.$emit('pick', [start, end])
|
|
}
|
|
},
|
|
{
|
|
text: '这月',
|
|
onClick (picker) {
|
|
const end = new Date()
|
|
end.setHours(23, 59, 59, 999)
|
|
const start = new Date(new Date().getFullYear(), new Date().getMonth(), 1, 0, 0, 0, 0)
|
|
picker.$emit('pick', [start, end])
|
|
}
|
|
},
|
|
{
|
|
text: '今年',
|
|
onClick (picker) {
|
|
const end = new Date()
|
|
end.setHours(23, 59, 59, 999)
|
|
const start = new Date(new Date().getFullYear(), 0, 1, 0, 0, 0, 0)
|
|
picker.$emit('pick', [start, end])
|
|
}
|
|
},
|
|
{
|
|
text: '最近一周',
|
|
onClick (picker) {
|
|
const end = new Date()
|
|
end.setHours(23, 59, 59, 999)
|
|
const start = new Date()
|
|
start.setDate(end.getDate() - 6)
|
|
start.setHours(0, 0, 0, 0)
|
|
picker.$emit('pick', [start, end])
|
|
}
|
|
},
|
|
{
|
|
text: '最近一个月',
|
|
onClick (picker) {
|
|
const end = new Date()
|
|
end.setHours(23, 59, 59, 999)
|
|
const start = new Date()
|
|
start.setMonth(end.getMonth() - 1)
|
|
start.setHours(0, 0, 0, 0)
|
|
picker.$emit('pick', [start, end])
|
|
}
|
|
},
|
|
{
|
|
text: '最近三个月',
|
|
onClick (picker) {
|
|
const end = new Date()
|
|
end.setHours(23, 59, 59, 999)
|
|
const start = new Date()
|
|
start.setMonth(end.getMonth() - 3)
|
|
start.setHours(0, 0, 0, 0)
|
|
picker.$emit('pick', [start, end])
|
|
}
|
|
},
|
|
{
|
|
text: '上月',
|
|
onClick (picker) {
|
|
const end = new Date(new Date().getFullYear(), new Date().getMonth(), 0, 23, 59, 59, 999)
|
|
const start = new Date(new Date().getFullYear(), new Date().getMonth() - 1, 1, 0, 0, 0, 0)
|
|
picker.$emit('pick', [start, end])
|
|
}
|
|
}
|
|
]
|
|
},
|
|
value: []
|
|
}
|
|
},
|
|
created () {
|
|
const startTime = this.$store.getters['app/getOrderSerch'].start_time
|
|
const endTime = this.$store.getters['app/getOrderSerch'].end_time
|
|
|
|
if (startTime === '' && endTime === '') {
|
|
this.value = [
|
|
new Date(new Date().setHours(0, 0, 0, 0)).getTime(),
|
|
new Date(new Date().setHours(23, 59, 59, 999)).getTime()
|
|
]
|
|
this.$store.commit('app/setOrderSerch', { start_time: startTime, end_time: endTime })
|
|
} else {
|
|
this.value = [
|
|
new Date(startTime * 1000),
|
|
new Date(endTime * 1000)
|
|
]
|
|
}
|
|
},
|
|
watch: {
|
|
value (newVal) {
|
|
if (newVal && newVal.length === 2) {
|
|
const start = new Date(newVal[0])
|
|
const end = new Date(newVal[1])
|
|
end.setHours(23, 59, 59, 999) // 设置结束日期为当天的23:59:59
|
|
const startTimestamp = Math.floor(start.getTime() / 1000) // 转换毫秒为秒
|
|
const endTimestamp = Math.floor(end.getTime() / 1000) // 转换毫秒为秒
|
|
this.$store.commit('app/setOrderSerch', { start_time: startTimestamp, end_time: endTimestamp })
|
|
} else if (newVal === null) {
|
|
this.$store.commit('app/setOrderSerch', { start_time: '', end_time: '' })
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.el-date-editor .el-range__close-icon {
|
|
display: block !important;
|
|
}
|
|
</style>
|