【类 型】：factor 统计模块重新设计 未完成
【原 因】： 【过 程】： 【影 响】：
This commit is contained in:
tk
parent
61bfc7d455
commit
77d52d9304
@ -80,7 +80,7 @@ export async function questAss (id, type, val) {
|
|||||||
* @description: 获取订单列表
|
* @description: 获取订单列表
|
||||||
* @param {*} orderSerch 搜索条件
|
* @param {*} orderSerch 搜索条件
|
||||||
*/
|
*/
|
||||||
export async function getOrderList (orderSerch) {
|
export async function getOrderList (orderSerch = {}) {
|
||||||
const params = new URLSearchParams()// post对象参数 转成 字符串连接
|
const params = new URLSearchParams()// post对象参数 转成 字符串连接
|
||||||
params.append('shop_id', orderSerch.shop_id)
|
params.append('shop_id', orderSerch.shop_id)
|
||||||
params.append('start_time', orderSerch.start_time)
|
params.append('start_time', orderSerch.start_time)
|
||||||
|
|||||||
@ -9,7 +9,7 @@
|
|||||||
<!-- 统计标签 -->
|
<!-- 统计标签 -->
|
||||||
<el-row :gutter="10" class="m-t-20">
|
<el-row :gutter="10" class="m-t-20">
|
||||||
<!-- 日统计标签 -->
|
<!-- 日统计标签 -->
|
||||||
<el-col :span="8">
|
<!-- <el-col :span="8">
|
||||||
<div class="dayStatBox rad4 flex p-10 column">
|
<div class="dayStatBox rad4 flex p-10 column">
|
||||||
<el-date-picker class="w-100" v-model="dayTime" align="right" type="date" placeholder="今日"
|
<el-date-picker class="w-100" v-model="dayTime" align="right" type="date" placeholder="今日"
|
||||||
:picker-options="dayPickerOptions" />
|
:picker-options="dayPickerOptions" />
|
||||||
@ -45,9 +45,9 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</el-col>
|
</el-col> -->
|
||||||
<!-- 月统计标签 -->
|
<!-- 月统计标签 -->
|
||||||
<el-col :span="8">
|
<!-- <el-col :span="8">
|
||||||
<div class="monthStatBox rad4 flex p-10 column">
|
<div class="monthStatBox rad4 flex p-10 column">
|
||||||
<el-date-picker class="w-100" v-model="monthTime" align="right" type="month" placeholder="本月"
|
<el-date-picker class="w-100" v-model="monthTime" align="right" type="month" placeholder="本月"
|
||||||
:picker-options="monthPickerOptions" />
|
:picker-options="monthPickerOptions" />
|
||||||
@ -83,9 +83,9 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</el-col>
|
</el-col> -->
|
||||||
<!-- 年统计标签 -->
|
<!-- 年统计标签 -->
|
||||||
<el-col :span="8">
|
<!-- <el-col :span="8">
|
||||||
<div class="yearStatBox rad4 flex p-10 column">
|
<div class="yearStatBox rad4 flex p-10 column">
|
||||||
<el-date-picker class="w-100" v-model="yearTime" align="right" type="year" placeholder="本年"
|
<el-date-picker class="w-100" v-model="yearTime" align="right" type="year" placeholder="本年"
|
||||||
:picker-options="yearPickerOptions" />
|
:picker-options="yearPickerOptions" />
|
||||||
@ -121,220 +121,238 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</el-col>
|
</el-col> -->
|
||||||
</el-row>
|
</el-row>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import SelectionShopId from '@/components/SelectionShopId.vue'
|
import SelectionShopId from '@/components/SelectionShopId.vue'
|
||||||
|
// import { formatPrice } from '@/utils'
|
||||||
|
import { getOrderList } from '@/utils/api/table'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'Stat',
|
name: 'Stat',
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
shop_id: '', // 搜索条件 商铺id
|
shop_id: '', // 搜索条件 商铺id
|
||||||
// 日选择器
|
dayOrderList: [] // 日统计 订单列表
|
||||||
dayPickerOptions: {
|
// // 日选择器
|
||||||
disabledDate (time) {
|
// dayPickerOptions: {
|
||||||
return time.getTime() > Date.now()
|
// disabledDate (time) {
|
||||||
},
|
// return time.getTime() > Date.now()
|
||||||
shortcuts: [{
|
// },
|
||||||
text: '今天',
|
// shortcuts: [{
|
||||||
onClick (picker) {
|
// text: '今天',
|
||||||
const start = new Date()
|
// onClick (picker) {
|
||||||
start.setHours(0, 0, 0, 0)
|
// const start = new Date()
|
||||||
picker.$emit('pick', start)
|
// start.setHours(0, 0, 0, 0)
|
||||||
}
|
// picker.$emit('pick', start)
|
||||||
}, {
|
// }
|
||||||
text: '昨天',
|
// }, {
|
||||||
onClick (picker) {
|
// text: '昨天',
|
||||||
const start = new Date()
|
// onClick (picker) {
|
||||||
start.setDate(start.getDate() - 1)
|
// const start = new Date()
|
||||||
start.setHours(0, 0, 0, 0)
|
// start.setDate(start.getDate() - 1)
|
||||||
picker.$emit('pick', start)
|
// start.setHours(0, 0, 0, 0)
|
||||||
}
|
// picker.$emit('pick', start)
|
||||||
}, {
|
// }
|
||||||
text: '前日',
|
// }, {
|
||||||
onClick (picker) {
|
// text: '前日',
|
||||||
const start = new Date()
|
// onClick (picker) {
|
||||||
start.setDate(start.getDate() - 2)
|
// const start = new Date()
|
||||||
start.setHours(0, 0, 0, 0)
|
// start.setDate(start.getDate() - 2)
|
||||||
picker.$emit('pick', start)
|
// start.setHours(0, 0, 0, 0)
|
||||||
}
|
// picker.$emit('pick', start)
|
||||||
}]
|
// }
|
||||||
},
|
// }]
|
||||||
dayTime: new Date(), // 默认值为今天
|
// },
|
||||||
|
// dayTime: new Date(), // 默认值为今天
|
||||||
|
|
||||||
monthPickerOptions: {
|
// monthPickerOptions: {
|
||||||
disabledDate (time) {
|
// disabledDate (time) {
|
||||||
return time.getTime() > Date.now()
|
// return time.getTime() > Date.now()
|
||||||
},
|
// },
|
||||||
shortcuts: [{
|
// shortcuts: [{
|
||||||
text: '本月',
|
// text: '本月',
|
||||||
onClick (picker) {
|
// onClick (picker) {
|
||||||
const start = new Date()
|
// const start = new Date()
|
||||||
start.setDate(1)
|
// start.setDate(1)
|
||||||
start.setHours(0, 0, 0, 0)
|
// start.setHours(0, 0, 0, 0)
|
||||||
picker.$emit('pick', start)
|
// picker.$emit('pick', start)
|
||||||
}
|
// }
|
||||||
}, {
|
// }, {
|
||||||
text: '上月',
|
// text: '上月',
|
||||||
onClick (picker) {
|
// onClick (picker) {
|
||||||
const start = new Date()
|
// const start = new Date()
|
||||||
start.setMonth(start.getMonth() - 1)
|
// start.setMonth(start.getMonth() - 1)
|
||||||
start.setDate(1)
|
// start.setDate(1)
|
||||||
start.setHours(0, 0, 0, 0)
|
// start.setHours(0, 0, 0, 0)
|
||||||
picker.$emit('pick', start)
|
// picker.$emit('pick', start)
|
||||||
}
|
// }
|
||||||
}, {
|
// }, {
|
||||||
text: '前月',
|
// text: '前月',
|
||||||
onClick (picker) {
|
// onClick (picker) {
|
||||||
const start = new Date()
|
// const start = new Date()
|
||||||
start.setMonth(start.getMonth() - 2)
|
// start.setMonth(start.getMonth() - 2)
|
||||||
start.setDate(1)
|
// start.setDate(1)
|
||||||
start.setHours(0, 0, 0, 0)
|
// start.setHours(0, 0, 0, 0)
|
||||||
picker.$emit('pick', start)
|
// picker.$emit('pick', start)
|
||||||
}
|
// }
|
||||||
}]
|
// }]
|
||||||
},
|
// },
|
||||||
monthTime: new Date(), // 默认值为本月
|
// monthTime: new Date(), // 默认值为本月
|
||||||
yearPickerOptions: {
|
// yearPickerOptions: {
|
||||||
disabledDate (time) {
|
// disabledDate (time) {
|
||||||
return time.getTime() > Date.now()
|
// return time.getTime() > Date.now()
|
||||||
},
|
// },
|
||||||
shortcuts: [{
|
// shortcuts: [{
|
||||||
text: '本年',
|
// text: '本年',
|
||||||
onClick (picker) {
|
// onClick (picker) {
|
||||||
const start = new Date()
|
// const start = new Date()
|
||||||
start.setMonth(0)
|
// start.setMonth(0)
|
||||||
start.setDate(1)
|
// start.setDate(1)
|
||||||
start.setHours(0, 0, 0, 0)
|
// start.setHours(0, 0, 0, 0)
|
||||||
picker.$emit('pick', start)
|
// picker.$emit('pick', start)
|
||||||
}
|
// }
|
||||||
}, {
|
// }, {
|
||||||
text: '去年',
|
// text: '去年',
|
||||||
onClick (picker) {
|
// onClick (picker) {
|
||||||
const start = new Date()
|
// const start = new Date()
|
||||||
start.setFullYear(start.getFullYear() - 1)
|
// start.setFullYear(start.getFullYear() - 1)
|
||||||
start.setMonth(0)
|
// start.setMonth(0)
|
||||||
start.setDate(1)
|
// start.setDate(1)
|
||||||
start.setHours(0, 0, 0, 0)
|
// start.setHours(0, 0, 0, 0)
|
||||||
picker.$emit('pick', start)
|
// picker.$emit('pick', start)
|
||||||
}
|
// }
|
||||||
}, {
|
// }, {
|
||||||
text: '前年',
|
// text: '前年',
|
||||||
onClick (picker) {
|
// onClick (picker) {
|
||||||
const start = new Date()
|
// const start = new Date()
|
||||||
start.setFullYear(start.getFullYear() - 2)
|
// start.setFullYear(start.getFullYear() - 2)
|
||||||
start.setMonth(0)
|
// start.setMonth(0)
|
||||||
start.setDate(1)
|
// start.setDate(1)
|
||||||
start.setHours(0, 0, 0, 0)
|
// start.setHours(0, 0, 0, 0)
|
||||||
picker.$emit('pick', start)
|
// picker.$emit('pick', start)
|
||||||
}
|
// }
|
||||||
}]
|
// }]
|
||||||
},
|
// },
|
||||||
yearTime: new Date() // 默认值为本年
|
// yearTime: new Date() // 默认值为本年
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
SelectionShopId
|
SelectionShopId
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
// 日统计 订单列表
|
/**
|
||||||
dayOrderList () {
|
* @description: 搜索条件 集合
|
||||||
return this.$store.state.orderList.filter(item => Number(item.order_time) > Number(this.dayTimestamps.start) && Number(item.order_time) < Number(this.dayTimestamps.end))
|
*/
|
||||||
},
|
orderSerch () {
|
||||||
// 月统计 订单列表
|
return this.$store.getters['app/getOrderSerch']
|
||||||
monthOrderList () {
|
}
|
||||||
return this.$store.state.orderList.filter(item => Number(item.order_time) > Number(this.monthTimestamps.start) && Number(item.order_time) < Number(this.monthTimestamps.end))
|
// // 月统计 订单列表
|
||||||
},
|
// monthOrderList () {
|
||||||
// 年统计 订单列表
|
// return this.$store.state.orderList.filter(item => Number(item.order_time) > Number(this.monthTimestamps.start) && Number(item.order_time) < Number(this.monthTimestamps.end))
|
||||||
yearOrderList () {
|
// },
|
||||||
return this.$store.state.orderList.filter(item => Number(item.order_time) > Number(this.yearTimestamps.start) && Number(item.order_time) < Number(this.yearTimestamps.end))
|
// // 年统计 订单列表
|
||||||
},
|
// yearOrderList () {
|
||||||
|
// return this.$store.state.orderList.filter(item => Number(item.order_time) > Number(this.yearTimestamps.start) && Number(item.order_time) < Number(this.yearTimestamps.end))
|
||||||
|
// },
|
||||||
// 过滤出 日 收款订单 包括已付款 和 已完成
|
// 过滤出 日 收款订单 包括已付款 和 已完成
|
||||||
dayPaid () {
|
// dayPaid () {
|
||||||
return this.dayOrderList.filter(item => item.main_status === '已付款' || item.main_status === '已完成')
|
// return this.dayOrderList.filter(item => item.main_status === '已付款' || item.main_status === '已完成')
|
||||||
},
|
// },
|
||||||
// 日收款订单 营业额总和
|
// // 日收款订单 营业额总和
|
||||||
dayPaidTotal () {
|
// dayPaidTotal () {
|
||||||
return this.dayPaid.reduce((total, item) => total + Number(item.total_price), 0).toFixed(2)
|
// return this.dayPaid.reduce((total, item) => total + Number(item.total_price), 0).toFixed(2)
|
||||||
},
|
// },
|
||||||
// 过滤出 日 退款付点单
|
// // 过滤出 日 退款付点单
|
||||||
dayRefund () {
|
// dayRefund () {
|
||||||
return this.dayOrderList.filter(item => item.main_status === '已退款')
|
// return this.dayOrderList.filter(item => item.main_status === '已退款')
|
||||||
},
|
// },
|
||||||
// 日收款订单 退款额总和
|
// // 日收款订单 退款额总和
|
||||||
dayRefundTotal () {
|
// dayRefundTotal () {
|
||||||
return this.dayRefund.reduce((total, item) => total + Number(item.refund_price), 0).toFixed(2)
|
// return this.dayRefund.reduce((total, item) => total + Number(item.refund_price), 0).toFixed(2)
|
||||||
},
|
// },
|
||||||
// 日 统计组件 起始 结束时间戳
|
// // 日 统计组件 起始 结束时间戳
|
||||||
dayTimestamps () {
|
// dayTimestamps () {
|
||||||
if (!this.dayTime) {
|
// if (!this.dayTime) {
|
||||||
return { start: null, end: null }
|
// return { start: null, end: null }
|
||||||
}
|
// }
|
||||||
const start = new Date(this.dayTime)
|
// const start = new Date(this.dayTime)
|
||||||
start.setHours(0, 0, 0, 0)
|
// start.setHours(0, 0, 0, 0)
|
||||||
const end = new Date(this.dayTime)
|
// const end = new Date(this.dayTime)
|
||||||
end.setHours(23, 59, 59, 999)
|
// end.setHours(23, 59, 59, 999)
|
||||||
return {
|
// return {
|
||||||
start: Math.floor(start.getTime() / 1000), // 转换为秒
|
// start: Math.floor(start.getTime() / 1000), // 转换为秒
|
||||||
end: Math.floor(end.getTime() / 1000) // 转换为秒
|
// end: Math.floor(end.getTime() / 1000) // 转换为秒
|
||||||
}
|
// }
|
||||||
},
|
// }
|
||||||
// 月 统计组件 起始 结束时间戳
|
// // 月 统计组件 起始 结束时间戳
|
||||||
monthTimestamps () {
|
// monthTimestamps () {
|
||||||
if (!this.monthTime) {
|
// if (!this.monthTime) {
|
||||||
return { start: null, end: null }
|
// return { start: null, end: null }
|
||||||
}
|
// }
|
||||||
const start = new Date(this.monthTime)
|
// const start = new Date(this.monthTime)
|
||||||
start.setDate(1)
|
// start.setDate(1)
|
||||||
start.setHours(0, 0, 0, 0)
|
// start.setHours(0, 0, 0, 0)
|
||||||
const end = new Date(this.monthTime)
|
// const end = new Date(this.monthTime)
|
||||||
end.setMonth(end.getMonth() + 1)
|
// end.setMonth(end.getMonth() + 1)
|
||||||
end.setDate(0)
|
// end.setDate(0)
|
||||||
end.setHours(23, 59, 59, 999)
|
// end.setHours(23, 59, 59, 999)
|
||||||
return {
|
// return {
|
||||||
start: Math.floor(start.getTime() / 1000), // 转换为秒
|
// start: Math.floor(start.getTime() / 1000), // 转换为秒
|
||||||
end: Math.floor(end.getTime() / 1000) // 转换为秒
|
// end: Math.floor(end.getTime() / 1000) // 转换为秒
|
||||||
}
|
// }
|
||||||
},
|
// },
|
||||||
// 年 统计组件 起始 结束时间戳
|
// // 年 统计组件 起始 结束时间戳
|
||||||
yearTimestamps () {
|
// yearTimestamps () {
|
||||||
if (!this.yearTime) {
|
// if (!this.yearTime) {
|
||||||
return { start: null, end: null }
|
// return { start: null, end: null }
|
||||||
}
|
// }
|
||||||
const start = new Date(this.yearTime)
|
// const start = new Date(this.yearTime)
|
||||||
start.setMonth(0)
|
// start.setMonth(0)
|
||||||
start.setDate(1)
|
// start.setDate(1)
|
||||||
start.setHours(0, 0, 0, 0)
|
// start.setHours(0, 0, 0, 0)
|
||||||
const end = new Date(this.yearTime)
|
// const end = new Date(this.yearTime)
|
||||||
end.setMonth(11)
|
// end.setMonth(11)
|
||||||
end.setDate(31)
|
// end.setDate(31)
|
||||||
end.setHours(23, 59, 59, 999)
|
// end.setHours(23, 59, 59, 999)
|
||||||
return {
|
// return {
|
||||||
start: Math.floor(start.getTime() / 1000), // 转换为秒
|
// start: Math.floor(start.getTime() / 1000), // 转换为秒
|
||||||
end: Math.floor(end.getTime() / 1000) // 转换为秒
|
// end: Math.floor(end.getTime() / 1000) // 转换为秒
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
async getDayOrderList (orderSerch) {
|
||||||
|
const res = await getOrderList(orderSerch)
|
||||||
|
if (res.data.status === 1) {
|
||||||
|
this.dayOrderList = res.data.orderList
|
||||||
|
} else {
|
||||||
|
this.$message.error('获取日订单列表失败')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {},
|
|
||||||
watch: {
|
watch: {
|
||||||
monthTimestamps (val) {
|
// monthTimestamps (val) {
|
||||||
console.log(val)
|
// console.log(val)
|
||||||
},
|
// },
|
||||||
dayTimestamps (val) {
|
// dayTimestamps (val) {
|
||||||
console.log(val)
|
// console.log(val)
|
||||||
},
|
// },
|
||||||
dayPaid (val) {
|
// dayPaid (val) {
|
||||||
console.log(val)
|
// console.log(val)
|
||||||
},
|
// },
|
||||||
yearOrderList (val) {
|
// yearOrderList (val) {
|
||||||
console.log(val)
|
// console.log(val)
|
||||||
}
|
// }
|
||||||
},
|
},
|
||||||
created () {
|
created () {
|
||||||
|
this.getDayOrderList(this.orderSerch)
|
||||||
|
setTimeout(() => {
|
||||||
|
console.error(this.dayOrderList)
|
||||||
|
}, 3000)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user